| 1 | "use strict";
|
| 2 | var __makeTemplateObject = (this && this.__makeTemplateObject) || function (cooked, raw) {
|
| 3 | if (Object.defineProperty) { Object.defineProperty(cooked, "raw", { value: raw }); } else { cooked.raw = raw; }
|
| 4 | return cooked;
|
| 5 | };
|
| 6 | var __read = (this && this.__read) || function (o, n) {
|
| 7 | var m = typeof Symbol === "function" && o[Symbol.iterator];
|
| 8 | if (!m) return o;
|
| 9 | var i = m.call(o), r, ar = [], e;
|
| 10 | try {
|
| 11 | while ((n === void 0 || n-- > 0) && !(r = i.next()).done) ar.push(r.value);
|
| 12 | }
|
| 13 | catch (error) { e = { error: error }; }
|
| 14 | finally {
|
| 15 | try {
|
| 16 | if (r && !r.done && (m = i["return"])) m.call(i);
|
| 17 | }
|
| 18 | finally { if (e) throw e.error; }
|
| 19 | }
|
| 20 | return ar;
|
| 21 | };
|
| 22 | Object.defineProperty(exports, "__esModule", { value: true });
|
| 23 | var React = require("react");
|
| 24 | var styled_components_1 = require("styled-components");
|
| 25 | var Colors_1 = require("../Colors");
|
| 26 | var Eye = styled_components_1.default.svg(templateObject_1 || (templateObject_1 = __makeTemplateObject(["\n position: absolute;\n top: 0;\n right: 0;\n height: 25px;\n fill:none;\n stroke: ", ";\n stroke-width: 2px;\n padding: 2px;\n z-index: 2;\n\n ", "\n\n &:hover {\n cursor: pointer;\n // .eye-stroke {\n // transition: transform 0.5s ease;\n // stroke: #003C64;\n // }\n }\n"], ["\n position: absolute;\n top: 0;\n right: 0;\n height: 25px;\n fill:none;\n stroke: ", ";\n stroke-width: 2px;\n padding: 2px;\n z-index: 2;\n\n ",
|
| 27 | "\n\n &:hover {\n cursor: pointer;\n // .eye-stroke {\n // transition: transform 0.5s ease;\n // stroke: #003C64;\n // }\n }\n"])), Colors_1.default.mongeral, function (_a) {
|
| 28 | var passwordType = _a.passwordType;
|
| 29 | return !passwordType ? "\n .eye-opened {\n transform: scale(0);\n transition: transform 0.5s ease;\n transform-origin: center;\n stroke: none;\n fill: " + Colors_1.default.mongeral + ";\n }\n\n .eye-closed {\n transform: scale(1);\n transition: transform 0.5s ease;\n transform-origin: center;\n stroke: 2px;\n fill: none;\n }\n " : "\n .eye-closed {\n transform: scale(0);\n transition: transform 0.5s ease-in-out;\n transform-origin: center;\n stroke: 2px;\n fill: none;\n }\n .eye-opened {\n transform: scale(1);\n transition: transform 0.5s ease-in-out;\n transform-origin: center;\n stroke: none;\n fill: #0077c8;\n }\n ";
|
| 30 | });
|
| 31 | exports.default = (function (_a) {
|
| 32 | var onClick = _a.onClick;
|
| 33 | var _b = __read(React.useState(false), 2), passwordType = _b[0], setPasswordType = _b[1];
|
| 34 | var onSetPasswordType = function () {
|
| 35 | setPasswordType(!passwordType);
|
| 36 | onClick(!passwordType);
|
| 37 | };
|
| 38 | return (React.createElement(Eye, { onClick: onSetPasswordType, passwordType: !passwordType, viewBox: '0 0 22 20.4' },
|
| 39 | React.createElement("path", { className: 'eye-stroke', d: 'M20.5 10.2s-4.3 6.5-9.5 6.5-9.5-6.5-9.5-6.5S5.8 3.7 11 3.7s9.5 6.5 9.5 6.5z' }),
|
| 40 | React.createElement("path", { className: 'eye-closed', d: 'M8.4 12.7l5.2-5' }),
|
| 41 | React.createElement("ellipse", { className: 'eye-opened', cx: '11', cy: '10.2', rx: '3.6', ry: '3.5' })));
|
| 42 | });
|
| 43 | var templateObject_1;
|
| 44 | |
| \ | No newline at end of file |