react-frontend-common-components 0.0.66 → 0.0.68
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/dist/index.d.ts +3 -2
- package/dist/index.js +2 -2
- package/dist/index.js.map +1 -1
- package/dist/index.mjs +2 -2
- package/dist/index.mjs.map +1 -1
- package/package.json +1 -1
- package/src/components/app-back-arrow/app-back-arrow.tsx +4 -3
- package/src/components/app-password-input/app-password-input.tsx +5 -1
- package/src/themes/icons/icons.tsx +15 -0
package/package.json
CHANGED
|
@@ -1,4 +1,5 @@
|
|
|
1
1
|
import React from "react";
|
|
2
|
+
import { MouseEventHandler } from "react";
|
|
2
3
|
import Icons from "../../themes/icons/icons";
|
|
3
4
|
import "./app-back-arrow.css";
|
|
4
5
|
|
|
@@ -7,7 +8,7 @@ interface BackArrowProps {
|
|
|
7
8
|
href?: string;
|
|
8
9
|
className?: string;
|
|
9
10
|
backIcon?: React.ReactNode;
|
|
10
|
-
onClick?:
|
|
11
|
+
onClick?: MouseEventHandler<HTMLElement>;
|
|
11
12
|
}
|
|
12
13
|
|
|
13
14
|
const AppBackArrow = ({
|
|
@@ -17,9 +18,9 @@ const AppBackArrow = ({
|
|
|
17
18
|
backIcon,
|
|
18
19
|
onClick,
|
|
19
20
|
}: BackArrowProps) => {
|
|
20
|
-
const handleNavigation = () => {
|
|
21
|
+
const handleNavigation: MouseEventHandler<HTMLElement> = (event) => {
|
|
21
22
|
if (onClick) {
|
|
22
|
-
onClick();
|
|
23
|
+
onClick(event);
|
|
23
24
|
} else if (href) {
|
|
24
25
|
window.location.href = href;
|
|
25
26
|
}
|
|
@@ -25,6 +25,7 @@ interface AppPasswordInputProps {
|
|
|
25
25
|
errorMessage?: string;
|
|
26
26
|
autoComplete?: string;
|
|
27
27
|
icon?: React.ReactNode;
|
|
28
|
+
hiddenIcon?: React.ReactNode;
|
|
28
29
|
showIcon?: boolean;
|
|
29
30
|
}
|
|
30
31
|
|
|
@@ -45,6 +46,7 @@ const AppPasswordInput = ({
|
|
|
45
46
|
triggerFocus,
|
|
46
47
|
autoComplete = "new-password",
|
|
47
48
|
icon,
|
|
49
|
+
hiddenIcon,
|
|
48
50
|
showIcon = true,
|
|
49
51
|
}: AppPasswordInputProps) => {
|
|
50
52
|
const [showPassword, setShowPassword] = useState(false);
|
|
@@ -74,7 +76,9 @@ const AppPasswordInput = ({
|
|
|
74
76
|
/>
|
|
75
77
|
{showIcon && (
|
|
76
78
|
<span className={"icon"} onClick={togglePasswordVisibility}>
|
|
77
|
-
{
|
|
79
|
+
{!showPassword
|
|
80
|
+
? icon || Icons.eyePassword
|
|
81
|
+
: hiddenIcon || Icons.iconHiddenIcon}
|
|
78
82
|
</span>
|
|
79
83
|
)}
|
|
80
84
|
</div>
|
|
@@ -127,5 +127,20 @@ const Icons = {
|
|
|
127
127
|
/>
|
|
128
128
|
</svg>
|
|
129
129
|
),
|
|
130
|
+
iconHiddenIcon: (
|
|
131
|
+
<svg
|
|
132
|
+
width="24"
|
|
133
|
+
height="24"
|
|
134
|
+
viewBox="0 0 24 24"
|
|
135
|
+
fill="none"
|
|
136
|
+
xmlns="http://www.w3.org/2000/svg"
|
|
137
|
+
>
|
|
138
|
+
<path
|
|
139
|
+
d="M23.0139 11.7722C22.982 11.6991 22.202 9.96938 20.4601 8.2275C18.8439 6.61313 16.067 4.6875 12.0001 4.6875C7.93323 4.6875 5.15636 6.61313 3.54011 8.2275C1.79823 9.96938 1.01823 11.6962 0.986357 11.7722C0.954306 11.8442 0.937744 11.9221 0.937744 12.0009C0.937744 12.0798 0.954306 12.1577 0.986357 12.2297C1.01823 12.3019 1.79823 14.0316 3.54011 15.7734C5.15636 17.3878 7.93323 19.3125 12.0001 19.3125C16.067 19.3125 18.8439 17.3878 20.4601 15.7734C22.202 14.0316 22.982 12.3047 23.0139 12.2297C23.0459 12.1577 23.0625 12.0798 23.0625 12.0009C23.0625 11.9221 23.0459 11.8442 23.0139 11.7722ZM12.0001 18.1875C9.05823 18.1875 6.48948 17.1169 4.36417 15.0066C3.47324 14.1211 2.71933 13.1078 2.12729 12C2.71916 10.8924 3.47309 9.87932 4.36417 8.99438C6.48948 6.88313 9.05823 5.8125 12.0001 5.8125C14.942 5.8125 17.5107 6.88313 19.636 8.99438C20.5271 9.87932 21.2811 10.8924 21.8729 12C21.2757 13.1447 18.2814 18.1875 12.0001 18.1875ZM12.0001 7.6875C11.1472 7.6875 10.3134 7.94042 9.60421 8.41429C8.89502 8.88815 8.34228 9.56167 8.01588 10.3497C7.68947 11.1377 7.60407 12.0048 7.77047 12.8413C7.93687 13.6779 8.3476 14.4463 8.95071 15.0494C9.55382 15.6525 10.3222 16.0632 11.1588 16.2296C11.9953 16.396 12.8624 16.3106 13.6504 15.9842C14.4384 15.6578 15.112 15.1051 15.5858 14.3959C16.0597 13.6867 16.3126 12.8529 16.3126 12C16.3111 10.8567 15.8563 9.76067 15.0479 8.95225C14.2394 8.14382 13.1434 7.68899 12.0001 7.6875ZM12.0001 15.1875C11.3697 15.1875 10.7534 15.0006 10.2292 14.6503C9.70505 14.3001 9.2965 13.8022 9.05524 13.2198C8.81399 12.6374 8.75086 11.9965 8.87385 11.3781C8.99684 10.7598 9.30042 10.1919 9.7462 9.7461C10.192 9.30032 10.7599 8.99674 11.3783 8.87375C11.9966 8.75076 12.6375 8.81388 13.2199 9.05513C13.8023 9.29639 14.3002 9.70494 14.6504 10.2291C15.0007 10.7533 15.1876 11.3696 15.1876 12C15.1876 12.8454 14.8518 13.6561 14.254 14.2539C13.6562 14.8517 12.8455 15.1875 12.0001 15.1875Z"
|
|
140
|
+
fill="black"
|
|
141
|
+
/>
|
|
142
|
+
<path d="M21 3L3 21" stroke="black" stroke-linecap="round" />
|
|
143
|
+
</svg>
|
|
144
|
+
),
|
|
130
145
|
};
|
|
131
146
|
export default Icons;
|