@growy/strapi-plugin-encrypted-field 1.0.7 → 1.0.9
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.
|
@@ -0,0 +1,10 @@
|
|
|
1
|
+
import React from 'react';
|
|
2
|
+
|
|
3
|
+
const EncryptedIcon = () => (
|
|
4
|
+
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 32 32" width="16" height="16">
|
|
5
|
+
<rect width="31" height="23" x="0.5" y="4.5" fill="#EAFBE7" stroke="#C6F0C2" rx="2.5"></rect>
|
|
6
|
+
<path fill="#328048" d="M13.679 11.18a.75.75 0 0 0-1.358 0l-4 8.5a.75.75 0 0 0 1.357.64l.974-2.07h4.695l.974 2.07a.75.75 0 1 0 1.358-.64zm-2.32 5.57 1.64-3.489 1.643 3.489zm9.14-3c-.865 0-1.547.241-2.027.717a.749.749 0 1 0 1.056 1.063c.188-.187.516-.283.972-.283.584 0 1.074.323 1.21.757a3 3 0 0 0-1.21-.254c-1.516 0-2.75 1.121-2.75 2.5s1.234 2.5 2.75 2.5c.479.001.95-.114 1.375-.336A.75.75 0 0 0 23.25 20v-3.75c0-1.379-1.234-2.5-2.75-2.5m0 5.5c-.687 0-1.25-.449-1.25-1s.563-1 1.25-1 1.25.449 1.25 1-.562 1-1.25 1"></path>
|
|
7
|
+
</svg>
|
|
8
|
+
);
|
|
9
|
+
|
|
10
|
+
export default EncryptedIcon;
|
|
@@ -3,18 +3,20 @@ import { useIntl } from 'react-intl';
|
|
|
3
3
|
import { Field, Flex, IconButton, Typography } from '@strapi/design-system';
|
|
4
4
|
import { Eye, EyeStriked, Duplicate, Check } from '@strapi/icons';
|
|
5
5
|
|
|
6
|
-
const Input = ({
|
|
7
|
-
|
|
8
|
-
|
|
9
|
-
|
|
10
|
-
|
|
11
|
-
|
|
12
|
-
|
|
13
|
-
|
|
14
|
-
|
|
15
|
-
|
|
16
|
-
|
|
17
|
-
|
|
6
|
+
const Input = (props) => {
|
|
7
|
+
const {
|
|
8
|
+
attribute,
|
|
9
|
+
description,
|
|
10
|
+
disabled,
|
|
11
|
+
error,
|
|
12
|
+
intlLabel,
|
|
13
|
+
labelAction,
|
|
14
|
+
name,
|
|
15
|
+
onChange,
|
|
16
|
+
required,
|
|
17
|
+
value = '',
|
|
18
|
+
} = props;
|
|
19
|
+
|
|
18
20
|
const { formatMessage } = useIntl();
|
|
19
21
|
const [showValue, setShowValue] = useState(false);
|
|
20
22
|
const [copied, setCopied] = useState(false);
|
|
@@ -31,6 +33,16 @@ const Input = ({
|
|
|
31
33
|
}
|
|
32
34
|
};
|
|
33
35
|
|
|
36
|
+
const handleChange = (e) => {
|
|
37
|
+
onChange({
|
|
38
|
+
target: {
|
|
39
|
+
name,
|
|
40
|
+
value: e.target.value,
|
|
41
|
+
type: attribute?.type || 'text',
|
|
42
|
+
},
|
|
43
|
+
});
|
|
44
|
+
};
|
|
45
|
+
|
|
34
46
|
const charCount = value ? value.length : 0;
|
|
35
47
|
|
|
36
48
|
return (
|
|
@@ -68,12 +80,8 @@ const Input = ({
|
|
|
68
80
|
id: 'encrypted-field.placeholder',
|
|
69
81
|
defaultMessage: 'Ingresa el texto a cifrar...',
|
|
70
82
|
})}
|
|
71
|
-
value={value
|
|
72
|
-
onChange={
|
|
73
|
-
onChange({
|
|
74
|
-
target: { name, value: e.target.value, type: attribute.type },
|
|
75
|
-
});
|
|
76
|
-
}}
|
|
83
|
+
value={value}
|
|
84
|
+
onChange={handleChange}
|
|
77
85
|
disabled={disabled}
|
|
78
86
|
/>
|
|
79
87
|
<Flex justifyContent="space-between" alignItems="center" paddingTop={1}>
|
package/admin/src/index.js
CHANGED
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
import
|
|
1
|
+
import EncryptedIcon from './components/EncryptedIcon';
|
|
2
2
|
|
|
3
3
|
export default {
|
|
4
4
|
register(app) {
|
|
@@ -14,7 +14,7 @@ export default {
|
|
|
14
14
|
id: 'encrypted-field.description',
|
|
15
15
|
defaultMessage: 'Campo de texto que se cifra automáticamente con AES-256-GCM',
|
|
16
16
|
},
|
|
17
|
-
icon:
|
|
17
|
+
icon: EncryptedIcon,
|
|
18
18
|
components: {
|
|
19
19
|
Input: async () => import('./components/Input.jsx'),
|
|
20
20
|
},
|