profinansy-ui-lib 3.1.83 → 3.1.85

package/dist/components/uikit/ModalMobile/ModalMobile.js

@@ -0,0 +1,72 @@
+"use strict";
+var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    var desc = Object.getOwnPropertyDescriptor(m, k);
+    if (!desc || ("get" in desc ? !m.__esModule : desc.writable || desc.configurable)) {
+      desc = { enumerable: true, get: function() { return m[k]; } };
+    }
+    Object.defineProperty(o, k2, desc);
+}) : (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    o[k2] = m[k];
+}));
+var __setModuleDefault = (this && this.__setModuleDefault) || (Object.create ? (function(o, v) {
+    Object.defineProperty(o, "default", { enumerable: true, value: v });
+}) : function(o, v) {
+    o["default"] = v;
+});
+var __importStar = (this && this.__importStar) || function (mod) {
+    if (mod && mod.__esModule) return mod;
+    var result = {};
+    if (mod != null) for (var k in mod) if (k !== "default" && Object.prototype.hasOwnProperty.call(mod, k)) __createBinding(result, mod, k);
+    __setModuleDefault(result, mod);
+    return result;
+};
+var __importDefault = (this && this.__importDefault) || function (mod) {
+    return (mod && mod.__esModule) ? mod : { "default": mod };
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.ModalMobile = void 0;
+const react_1 = __importDefault(require("react"));
+const useTransitionModal_1 = require("../../../hooks/useTransitionModal");
+const Portal_1 = require("../Portal");
+const TextButton_1 = require("../TextButton");
+const Styled = __importStar(require("./ModalMobile.styled"));
+const styled_components_1 = require("styled-components");
+const ThemeProvider_1 = require("../../../theme/ThemeProvider");
+const theme_const_1 = require("../../../theme/theme.const");
+const CloseSmall_svg_1 = __importDefault(require("../../../icons/CloseSmall.svg"));
+const CircleButton_1 = require("../CircleButton");
+const MOBILE_MODAL_ROOT_ELEMENT_ID = 'react-sidebar';
+const ModalMobile = (props) => {
+    const { animation, showModal, content, handleClose } = (0, useTransitionModal_1.useTransitionModal)({
+        isOpen: props.isOpen,
+        children: props.children,
+        onClose: props.onClose
+    });
+    if (!showModal)
+        return null;
+    return (react_1.default.createElement(Content, Object.assign({}, props, { onClose: handleClose, animation: animation }), content));
+};
+exports.ModalMobile = ModalMobile;
+const Content = ({ title, leftButtonText, rightButtonText, children, animation, onClose, onLeftButton, onRightButton, closeIconVisible }) => {
+    const handleClose = () => {
+        if (onClose)
+            onClose();
+    };
+    (0, useTransitionModal_1.useControlsForModal)(onClose);
+    const { mode } = (0, ThemeProvider_1.useMode)();
+    return (react_1.default.createElement(Portal_1.Portal, { id: MOBILE_MODAL_ROOT_ELEMENT_ID },
+        react_1.default.createElement(styled_components_1.ThemeProvider, { theme: theme_const_1.palette[mode] },
+            react_1.default.createElement(Styled.Wrapper, { isOpen: animation },
+                react_1.default.createElement(Styled.Layout, { onClick: handleClose }),
+                react_1.default.createElement(Styled.Content, { isOpen: animation },
+                    react_1.default.createElement(Styled.Header, null,
+                        !!leftButtonText && (react_1.default.createElement(TextButton_1.TextButton, { text: leftButtonText, style: { color: '#F84708' }, onClick: onLeftButton })),
+                        react_1.default.createElement(Styled.Title, null, title),
+                        !!rightButtonText && (react_1.default.createElement(TextButton_1.TextButton, { text: rightButtonText, onClick: onRightButton })),
+                        closeIconVisible && (react_1.default.createElement(Styled.CloseButton, null,
+                            react_1.default.createElement(CircleButton_1.CircleButton, { icon: react_1.default.createElement(CloseSmall_svg_1.default, { className: "modal-mobile-closeBtn" }), onClick: handleClose, size: "M" })))),
+                    react_1.default.createElement("div", null, children))))));
+};
+//# sourceMappingURL=ModalMobile.js.map

package/dist/components/uikit/ModalMobile/ModalMobile.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"ModalMobile.js","sourceRoot":"","sources":["../../../../src/components/uikit/ModalMobile/ModalMobile.tsx"],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA,kDAAyB;AAEzB,0EAG0C;AAC1C,sCAAkC;AAClC,8CAA0C;AAC1C,6DAA8C;AAG9C,yDAAiD;AACjD,gEAAsD;AACtD,4DAAoD;AACpD,mFAAqD;AACrD,kDAA8C;AAE9C,MAAM,4BAA4B,GAAG,eAAe,CAAA;AAEpD,MAAM,WAAW,GAAG,CAAC,KAAmB,EAAE,EAAE;IAC1C,MAAM,EAAE,SAAS,EAAE,SAAS,EAAE,OAAO,EAAE,WAAW,EAAE,GAAG,IAAA,uCAAkB,EAAC;QACxE,MAAM,EAAE,KAAK,CAAC,MAAM;QACpB,QAAQ,EAAE,KAAK,CAAC,QAAQ;QACxB,OAAO,EAAE,KAAK,CAAC,OAAO;KACvB,CAAC,CAAA;IAEF,IAAI,CAAC,SAAS;QAAE,OAAO,IAAI,CAAA;IAE3B,OAAO,CACL,8BAAC,OAAO,oBAAK,KAAK,IAAE,OAAO,EAAE,WAAW,EAAE,SAAS,EAAE,SAAS,KAC3D,OAAO,CACA,CACX,CAAA;AACH,CAAC,CAAA;AAwDQ,kCAAW;AAtDpB,MAAM,OAAO,GAAG,CAAC,EACf,KAAK,EACL,cAAc,EACd,eAAe,EACf,QAAQ,EACR,SAAS,EACT,OAAO,EACP,YAAY,EACZ,aAAa,EACb,gBAAgB,EACsB,EAAE,EAAE;IAC1C,MAAM,WAAW,GAAG,GAAG,EAAE;QACvB,IAAI,OAAO;YAAE,OAAO,EAAE,CAAA;IACxB,CAAC,CAAA;IAED,IAAA,wCAAmB,EAAC,OAAO,CAAC,CAAA;IAC5B,MAAM,EAAE,IAAI,EAAE,GAAG,IAAA,uBAAO,GAAE,CAAA;IAE1B,OAAO,CACL,8BAAC,eAAM,IAAC,EAAE,EAAE,4BAA4B;QACtC,8BAAC,iCAAa,IAAC,KAAK,EAAE,qBAAO,CAAC,IAAI,CAAC;YACjC,8BAAC,MAAM,CAAC,OAAO,IAAC,MAAM,EAAE,SAAS;gBAC/B,8BAAC,MAAM,CAAC,MAAM,IAAC,OAAO,EAAE,WAAW,GAAI;gBACvC,8BAAC,MAAM,CAAC,OAAO,IAAC,MAAM,EAAE,SAAS;oBAC/B,8BAAC,MAAM,CAAC,MAAM;wBACX,CAAC,CAAC,cAAc,IAAI,CACnB,8BAAC,uBAAU,IACT,IAAI,EAAE,cAAc,EACpB,KAAK,EAAE,EAAE,KAAK,EAAE,SAAS,EAAE,EAC3B,OAAO,EAAE,YAAY,GACrB,CACH;wBACD,8BAAC,MAAM,CAAC,KAAK,QAAE,KAAK,CAAgB;wBACnC,CAAC,CAAC,eAAe,IAAI,CACpB,8BAAC,uBAAU,IAAC,IAAI,EAAE,eAAe,EAAE,OAAO,EAAE,aAAa,GAAI,CAC9D;wBACA,gBAAgB,IAAI,CACnB,8BAAC,MAAM,CAAC,WAAW;4BACjB,8BAAC,2BAAY,IACX,IAAI,EAAE,8BAAC,wBAAS,IAAC,SAAS,EAAC,uBAAuB,GAAG,EACrD,OAAO,EAAE,WAAW,EACpB,IAAI,EAAC,GAAG,GACR,CACiB,CACtB,CACa;oBAChB,2CAAM,QAAQ,CAAO,CACN,CACF,CACH,CACT,CACV,CAAA;AACH,CAAC,CAAA"}

package/dist/components/uikit/ModalMobile/ModalMobile.stories.js

@@ -0,0 +1,63 @@
+"use strict";
+var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    var desc = Object.getOwnPropertyDescriptor(m, k);
+    if (!desc || ("get" in desc ? !m.__esModule : desc.writable || desc.configurable)) {
+      desc = { enumerable: true, get: function() { return m[k]; } };
+    }
+    Object.defineProperty(o, k2, desc);
+}) : (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    o[k2] = m[k];
+}));
+var __setModuleDefault = (this && this.__setModuleDefault) || (Object.create ? (function(o, v) {
+    Object.defineProperty(o, "default", { enumerable: true, value: v });
+}) : function(o, v) {
+    o["default"] = v;
+});
+var __importStar = (this && this.__importStar) || function (mod) {
+    if (mod && mod.__esModule) return mod;
+    var result = {};
+    if (mod != null) for (var k in mod) if (k !== "default" && Object.prototype.hasOwnProperty.call(mod, k)) __createBinding(result, mod, k);
+    __setModuleDefault(result, mod);
+    return result;
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.ModalMobile = void 0;
+const _1 = require(".");
+const react_1 = __importStar(require("react"));
+const Button_1 = require("../Button");
+const StoryDescription_1 = require("../storybook/StoryDescription/StoryDescription");
+const StoryExample_1 = require("../storybook/StoryExample/StoryExample");
+const StoryTitle_1 = require("../storybook/StoryTitle/StoryTitle");
+exports.default = {
+    title: 'Components',
+    component: _1.ModalMobile
+};
+const ModalMobile = () => {
+    const [open1, setOpen1] = (0, react_1.useState)(false);
+    return (react_1.default.createElement(react_1.default.Fragment, null,
+        react_1.default.createElement(StoryTitle_1.StoryTitle, null, "\u041E\u043F\u0438\u0441\u0430\u043D\u0438\u0435"),
+        react_1.default.createElement(StoryDescription_1.StoryDescription, { text: "\u041A\u043E\u043C\u043F\u043E\u043D\u0435\u043D\u0442 \u0438\u0441\u043F\u043E\u043B\u044C\u0437\u0443\u0435\u0442\u0441\u044F \u0434\u043B\u044F \u0441\u043E\u0437\u0434\u0430\u043D\u0438\u044F \u043C\u043E\u0431\u0438\u043B\u044C\u043D\u044B\u0445 \u043C\u043E\u0434\u0430\u043B\u044C\u043D\u044B\u0445 \u043E\u043A\u043E\u043D" }),
+        react_1.default.createElement(StoryExample_1.StoryExample, null,
+            react_1.default.createElement(Button_1.Button, { onClick: () => setOpen1(true), text: "\u041E\u0442\u043A\u0440\u044B\u0442\u044C" }),
+            react_1.default.createElement(_1.ModalMobile, { isOpen: open1, onClose: () => setOpen1(false), title: 'Test modal', closeIconVisible: true },
+                react_1.default.createElement("div", { style: {
+                        width: '100%',
+                        background: '#D9D9D9',
+                        borderRadius: 12,
+                        height: '50vh'
+                    } }))),
+        react_1.default.createElement(StoryDescription_1.StoryDescription, { text: "\u041C\u043E\u0434\u0430\u043B\u044C\u043D\u043E\u0435 \u043E\u043A\u043D\u043E \u0441 \u043A\u043D\u043E\u043F\u043A\u0430\u043C\u0438 \u0441\u043F\u0440\u0430\u0432\u0430 \u0438 \u0441\u043B\u0435\u0432\u0430" }),
+        react_1.default.createElement(StoryExample_1.StoryExample, null,
+            react_1.default.createElement(Button_1.Button, { onClick: () => setOpen1(true), text: "\u041E\u0442\u043A\u0440\u044B\u0442\u044C" }),
+            react_1.default.createElement(_1.ModalMobile, { isOpen: open1, onClose: () => setOpen1(false), title: 'Test modal', rightButtonText: 'Ready', leftButtonText: 'Cancel' },
+                react_1.default.createElement("div", { style: {
+                        width: '100%',
+                        background: '#D9D9D9',
+                        borderRadius: 12,
+                        height: '50vh'
+                    } })))));
+};
+exports.ModalMobile = ModalMobile;
+//# sourceMappingURL=ModalMobile.stories.js.map

package/dist/components/uikit/ModalMobile/ModalMobile.stories.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"ModalMobile.stories.js","sourceRoot":"","sources":["../../../../src/components/uikit/ModalMobile/ModalMobile.stories.tsx"],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;AAAA,wBAA4C;AAC5C,+CAAuC;AAEvC,sCAAkC;AAClC,qFAAiF;AACjF,yEAAqE;AACrE,mEAA+D;AAE/D,kBAAe;IACb,KAAK,EAAE,YAAY;IACnB,SAAS,EAAE,cAAS;CACrB,CAAA;AAEM,MAAM,WAAW,GAAG,GAAG,EAAE;IAC9B,MAAM,CAAC,KAAK,EAAE,QAAQ,CAAC,GAAG,IAAA,gBAAQ,EAAC,KAAK,CAAC,CAAA;IAEzC,OAAO,CACL;QACE,8BAAC,uBAAU,2DAAsB;QACjC,8BAAC,mCAAgB,IAAC,IAAI,EAAC,4UAA8D,GAAG;QACxF,8BAAC,2BAAY;YACX,8BAAC,eAAM,IAAC,OAAO,EAAE,GAAG,EAAE,CAAC,QAAQ,CAAC,IAAI,CAAC,EAAE,IAAI,EAAC,4CAAS,GAAG;YACxD,8BAAC,cAAS,IACR,MAAM,EAAE,KAAK,EACb,OAAO,EAAE,GAAG,EAAE,CAAC,QAAQ,CAAC,KAAK,CAAC,EAC9B,KAAK,EAAE,YAAY,EACnB,gBAAgB,EAAE,IAAI;gBAEtB,uCACE,KAAK,EAAE;wBACL,KAAK,EAAE,MAAM;wBACb,UAAU,EAAE,SAAS;wBACrB,YAAY,EAAE,EAAE;wBAChB,MAAM,EAAE,MAAM;qBACf,GACD,CACQ,CACC;QACf,8BAAC,mCAAgB,IAAC,IAAI,EAAC,oNAA0C,GAAG;QACpE,8BAAC,2BAAY;YACX,8BAAC,eAAM,IAAC,OAAO,EAAE,GAAG,EAAE,CAAC,QAAQ,CAAC,IAAI,CAAC,EAAE,IAAI,EAAC,4CAAS,GAAG;YACxD,8BAAC,cAAS,IACR,MAAM,EAAE,KAAK,EACb,OAAO,EAAE,GAAG,EAAE,CAAC,QAAQ,CAAC,KAAK,CAAC,EAC9B,KAAK,EAAE,YAAY,EACnB,eAAe,EAAE,OAAO,EACxB,cAAc,EAAE,QAAQ;gBAExB,uCACE,KAAK,EAAE;wBACL,KAAK,EAAE,MAAM;wBACb,UAAU,EAAE,SAAS;wBACrB,YAAY,EAAE,EAAE;wBAChB,MAAM,EAAE,MAAM;qBACf,GACD,CACQ,CACC,CACd,CACJ,CAAA;AACH,CAAC,CAAA;AA/CY,QAAA,WAAW,eA+CvB"}

package/dist/components/uikit/ModalMobile/ModalMobile.styled.js

@@ -0,0 +1,71 @@
+"use strict";
+var __importDefault = (this && this.__importDefault) || function (mod) {
+    return (mod && mod.__esModule) ? mod : { "default": mod };
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.CloseButton = exports.Title = exports.Header = exports.Content = exports.Layout = exports.Wrapper = void 0;
+const styled_components_1 = __importDefault(require("styled-components"));
+const Scroll_1 = require("../Scroll/Scroll");
+const Wrapper = styled_components_1.default.div `
+  position: fixed;
+  top: 0;
+  bottom: 0;
+  left: 0;
+  right: 0;
+  z-index: 100000;
+  opacity: ${(props) => (props.isOpen ? 1 : 0)};
+  transition: opacity 225ms cubic-bezier(0.4, 0, 0.2, 1) 0ms;
+`;
+exports.Wrapper = Wrapper;
+const Layout = styled_components_1.default.div `
+  position: fixed;
+  top: 0;
+  bottom: 0;
+  left: 0;
+  right: 0;
+  background: rgba(90, 90, 90, 0.8);
+`;
+exports.Layout = Layout;
+const Content = styled_components_1.default.div `
+  overflow-y: auto;
+  position: fixed;
+  left: 0;
+  bottom: 0;
+  max-height: calc(100vh - 80px);
+  background: ${(props) => props.theme.background.content};
+  width: 100%;
+  z-index: 100;
+  translate: ${(props) => (props.isOpen ? 0 : '0 100%')};
+  transition: 0.225s;
+  border-radius: 14px 14px 0 0;
+  padding: 0 16px 16px 16px;
+  ${Scroll_1.Scroll}
+`;
+exports.Content = Content;
+const Header = styled_components_1.default.div `
+  position: relative;
+  display: flex;
+  align-items: center;
+  justify-content: space-between;
+  padding: 16px 0;
+  margin-bottom: 12px;
+`;
+exports.Header = Header;
+const Title = styled_components_1.default.p `
+  font-size: 18px;
+  font-weight: 700;
+  line-height: 24px;
+  text-align: center;
+  width: 100%;
+  color: ${(props) => props.theme.text.primary};
+  padding: 0 16px;
+`;
+exports.Title = Title;
+const CloseButton = styled_components_1.default.div `
+  position: absolute;
+  z-index: 10;
+  top: 15px;
+  right: 0;
+`;
+exports.CloseButton = CloseButton;
+//# sourceMappingURL=ModalMobile.styled.js.map

package/dist/components/uikit/ModalMobile/ModalMobile.styled.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"ModalMobile.styled.js","sourceRoot":"","sources":["../../../../src/components/uikit/ModalMobile/ModalMobile.styled.ts"],"names":[],"mappings":";;;;;;AAAA,0EAAsC;AACtC,6CAAyC;AAEzC,MAAM,OAAO,GAAG,2BAAM,CAAC,GAAG,CAAqB;;;;;;;aAOlC,CAAC,KAAK,EAAE,EAAE,CAAC,CAAC,KAAK,CAAC,MAAM,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC;;CAE7C,CAAA;AAqDQ,0BAAO;AAnDhB,MAAM,MAAM,GAAG,2BAAM,CAAC,GAAG,CAAA;;;;;;;CAOxB,CAAA;AA4CiB,wBAAM;AA1CxB,MAAM,OAAO,GAAG,2BAAM,CAAC,GAAG,CAAqB;;;;;;gBAM/B,CAAC,KAAK,EAAE,EAAE,CAAC,KAAK,CAAC,KAAK,CAAC,UAAU,CAAC,OAAO;;;eAG1C,CAAC,KAAK,EAAE,EAAE,CAAC,CAAC,KAAK,CAAC,MAAM,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,QAAQ,CAAC;;;;IAInD,eAAM;CACT,CAAA;AA4ByB,0BAAO;AA1BjC,MAAM,MAAM,GAAG,2BAAM,CAAC,GAAG,CAAA;;;;;;;CAOxB,CAAA;AAmBkC,wBAAM;AAjBzC,MAAM,KAAK,GAAG,2BAAM,CAAC,CAAC,CAAA;;;;;;WAMX,CAAC,KAAK,EAAE,EAAE,CAAC,KAAK,CAAC,KAAK,CAAC,IAAI,CAAC,OAAO;;CAE7C,CAAA;AAS0C,sBAAK;AAPhD,MAAM,WAAW,GAAG,2BAAM,CAAC,GAAG,CAAA;;;;;CAK7B,CAAA;AAEiD,kCAAW"}

package/dist/components/uikit/ModalMobile/ModalMobile.typed.js

@@ -0,0 +1,3 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+//# sourceMappingURL=ModalMobile.typed.js.map

package/dist/components/uikit/ModalMobile/ModalMobile.typed.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"ModalMobile.typed.js","sourceRoot":"","sources":["../../../../src/components/uikit/ModalMobile/ModalMobile.typed.ts"],"names":[],"mappings":""}

package/dist/components/uikit/ModalMobile/index.js

@@ -0,0 +1,6 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.ModalMobile = void 0;
+var ModalMobile_1 = require("./ModalMobile");
+Object.defineProperty(exports, "ModalMobile", { enumerable: true, get: function () { return ModalMobile_1.ModalMobile; } });
+//# sourceMappingURL=index.js.map

package/dist/components/uikit/ModalMobile/index.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../../src/components/uikit/ModalMobile/index.ts"],"names":[],"mappings":";;;AAAA,6CAA2C;AAAlC,0GAAA,WAAW,OAAA"}

package/dist/components/uikit/PasswordInput/PasswordInput.js

@@ -0,0 +1,61 @@
+"use strict";
+var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    var desc = Object.getOwnPropertyDescriptor(m, k);
+    if (!desc || ("get" in desc ? !m.__esModule : desc.writable || desc.configurable)) {
+      desc = { enumerable: true, get: function() { return m[k]; } };
+    }
+    Object.defineProperty(o, k2, desc);
+}) : (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    o[k2] = m[k];
+}));
+var __setModuleDefault = (this && this.__setModuleDefault) || (Object.create ? (function(o, v) {
+    Object.defineProperty(o, "default", { enumerable: true, value: v });
+}) : function(o, v) {
+    o["default"] = v;
+});
+var __importStar = (this && this.__importStar) || function (mod) {
+    if (mod && mod.__esModule) return mod;
+    var result = {};
+    if (mod != null) for (var k in mod) if (k !== "default" && Object.prototype.hasOwnProperty.call(mod, k)) __createBinding(result, mod, k);
+    __setModuleDefault(result, mod);
+    return result;
+};
+var __rest = (this && this.__rest) || function (s, e) {
+    var t = {};
+    for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0)
+        t[p] = s[p];
+    if (s != null && typeof Object.getOwnPropertySymbols === "function")
+        for (var i = 0, p = Object.getOwnPropertySymbols(s); i < p.length; i++) {
+            if (e.indexOf(p[i]) < 0 && Object.prototype.propertyIsEnumerable.call(s, p[i]))
+                t[p[i]] = s[p[i]];
+        }
+    return t;
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.PasswordInput = void 0;
+const react_1 = __importStar(require("react"));
+const Input_1 = require("../Input");
+const Styled = __importStar(require("./PasswordInput.styled"));
+const styled_components_1 = require("styled-components");
+const ThemeProvider_1 = require("../../../theme/ThemeProvider");
+const theme_const_1 = require("../../../theme/theme.const");
+const PasswordInput = (_a) => {
+    var { withIcon = true } = _a, props = __rest(_a, ["withIcon"]);
+    const [type, setType] = (0, react_1.useState)('password');
+    const handleClick = () => {
+        if (type === 'password') {
+            setType('text');
+            return;
+        }
+        setType('password');
+    };
+    const { mode } = (0, ThemeProvider_1.useMode)();
+    return (react_1.default.createElement(styled_components_1.ThemeProvider, { theme: theme_const_1.palette[mode] },
+        react_1.default.createElement(Styled.Container, null,
+            react_1.default.createElement(Input_1.Input, Object.assign({}, props, { type: type })),
+            withIcon && (react_1.default.createElement("span", { onClick: handleClick }, type === 'password' ? (react_1.default.createElement(Styled.EyeIconStyle, null)) : (react_1.default.createElement(Styled.EyeCloseIconStyle, null)))))));
+};
+exports.PasswordInput = PasswordInput;
+//# sourceMappingURL=PasswordInput.js.map

package/dist/components/uikit/PasswordInput/PasswordInput.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"PasswordInput.js","sourceRoot":"","sources":["../../../../src/components/uikit/PasswordInput/PasswordInput.tsx"],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA,+CAAuC;AAEvC,oCAAgC;AAChC,+DAAgD;AAGhD,yDAAiD;AACjD,gEAAsD;AACtD,4DAAoD;AAEpD,MAAM,aAAa,GAAG,CAAC,EAA6C,EAAE,EAAE;QAAjD,EAAE,QAAQ,GAAG,IAAI,OAA4B,EAAvB,KAAK,cAA3B,YAA6B,CAAF;IAChD,MAAM,CAAC,IAAI,EAAE,OAAO,CAAC,GAAG,IAAA,gBAAQ,EAAsB,UAAU,CAAC,CAAA;IAEjE,MAAM,WAAW,GAAG,GAAG,EAAE;QACvB,IAAI,IAAI,KAAK,UAAU,EAAE;YACvB,OAAO,CAAC,MAAM,CAAC,CAAA;YACf,OAAM;SACP;QACD,OAAO,CAAC,UAAU,CAAC,CAAA;IACrB,CAAC,CAAA;IAED,MAAM,EAAE,IAAI,EAAE,GAAG,IAAA,uBAAO,GAAE,CAAA;IAE1B,OAAO,CACL,8BAAC,iCAAa,IAAC,KAAK,EAAE,qBAAO,CAAC,IAAI,CAAC;QACjC,8BAAC,MAAM,CAAC,SAAS;YACf,8BAAC,aAAK,oBAAK,KAAK,IAAE,IAAI,EAAE,IAAI,IAAI;YAC/B,QAAQ,IAAI,CACX,wCAAM,OAAO,EAAE,WAAW,IACvB,IAAI,KAAK,UAAU,CAAC,CAAC,CAAC,CACrB,8BAAC,MAAM,CAAC,YAAY,OAAG,CACxB,CAAC,CAAC,CAAC,CACF,8BAAC,MAAM,CAAC,iBAAiB,OAAG,CAC7B,CACI,CACR,CACgB,CACL,CACjB,CAAA;AACH,CAAC,CAAA;AAEQ,sCAAa"}

package/dist/components/uikit/PasswordInput/PasswordInput.stories.js

@@ -0,0 +1,53 @@
+"use strict";
+var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    var desc = Object.getOwnPropertyDescriptor(m, k);
+    if (!desc || ("get" in desc ? !m.__esModule : desc.writable || desc.configurable)) {
+      desc = { enumerable: true, get: function() { return m[k]; } };
+    }
+    Object.defineProperty(o, k2, desc);
+}) : (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    o[k2] = m[k];
+}));
+var __setModuleDefault = (this && this.__setModuleDefault) || (Object.create ? (function(o, v) {
+    Object.defineProperty(o, "default", { enumerable: true, value: v });
+}) : function(o, v) {
+    o["default"] = v;
+});
+var __importStar = (this && this.__importStar) || function (mod) {
+    if (mod && mod.__esModule) return mod;
+    var result = {};
+    if (mod != null) for (var k in mod) if (k !== "default" && Object.prototype.hasOwnProperty.call(mod, k)) __createBinding(result, mod, k);
+    __setModuleDefault(result, mod);
+    return result;
+};
+var __importDefault = (this && this.__importDefault) || function (mod) {
+    return (mod && mod.__esModule) ? mod : { "default": mod };
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.PasswordInput = void 0;
+const react_1 = __importDefault(require("react"));
+const Styled = __importStar(require("./PasswordInput.styled"));
+const StoryDescription_1 = require("../storybook/StoryDescription/StoryDescription");
+const StoryExample_1 = require("../storybook/StoryExample/StoryExample");
+const StoryTitle_1 = require("../storybook/StoryTitle/StoryTitle");
+const PasswordInput_1 = require("./PasswordInput");
+exports.default = {
+    title: 'Components',
+    component: PasswordInput_1.PasswordInput
+};
+const PasswordInput = () => {
+    return (react_1.default.createElement(react_1.default.Fragment, null,
+        react_1.default.createElement(StoryTitle_1.StoryTitle, null, "\u041A\u043E\u043C\u043F\u043E\u043D\u0435\u043D\u0442 \u0432\u0432\u043E\u0434\u0430 \u043F\u0430\u0440\u043E\u043B\u044F"),
+        react_1.default.createElement(StoryDescription_1.StoryDescription, { text: "\u041A\u043E\u043C\u043F\u043E\u043D\u0435\u043D\u0442 \u0438\u0441\u043F\u043E\u043B\u044C\u0437\u0443\u0435\u0442\u0441\u044F \u0434\u043B\u044F \u0432\u0432\u043E\u0434\u0430 \u043F\u0430\u0440\u043E\u043B\u044F \u043F\u043E\u043B\u044C\u0437\u043E\u0432\u0430\u0442\u0435\u043B\u0435\u043C. \u041E\u0441\u043D\u043E\u0432\u0430\u043D \u043D\u0430 \u043A\u043E\u043C\u043F\u043E\u043D\u0435\u043D\u0442\u0435 Input, \u043F\u043E\u044D\u0442\u043E\u043C\u0443\n      \u0438\u043C\u0435\u0435\u0442 \u0432\u0441\u0435 \u0442\u0435 \u0436\u0435 \u0441\u043E\u0441\u0442\u043E\u044F\u043D\u0438\u044F, \u0447\u0442\u043E \u0438 \u043E\u043D." }),
+        react_1.default.createElement(StoryExample_1.StoryExample, null,
+            react_1.default.createElement(Styled.Wrapper, null,
+                react_1.default.createElement(PasswordInput_1.PasswordInput, { value: "", name: "test" }))),
+        react_1.default.createElement(StoryDescription_1.StoryDescription, { text: "\u0412\u044B \u043C\u043E\u0436\u0435\u0442\u0435 \u0438\u0441\u043F\u043E\u043B\u044C\u0437\u043E\u0432\u0430\u0442\u044C \u043F\u043E\u043B\u0435 \u0431\u0435\u0437 \u0438\u043A\u043E\u043D\u043A\u0438 \u043F\u0435\u0440\u0435\u043A\u043B\u044E\u0447\u0435\u043D\u0438\u044F \u0440\u0435\u0436\u0438\u043C\u043E\u0432. \u041F\u043E \u0443\u043C\u043E\u043B\u0447\u0430\u043D\u0438\u044E \u0437\u043D\u0430\u0447\u0435\u043D\u0438\u044F\n      \u0441\u043A\u0440\u044B\u0442\u044B \u043E\u0442 \u043F\u043E\u043B\u044C\u0437\u043E\u0432\u0430\u0442\u0435\u043B\u044F" }),
+        react_1.default.createElement(StoryExample_1.StoryExample, null,
+            react_1.default.createElement(Styled.Wrapper, null,
+                react_1.default.createElement(PasswordInput_1.PasswordInput, { value: "", name: "test", withIcon: false })))));
+};
+exports.PasswordInput = PasswordInput;
+//# sourceMappingURL=PasswordInput.stories.js.map

package/dist/components/uikit/PasswordInput/PasswordInput.stories.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"PasswordInput.stories.js","sourceRoot":"","sources":["../../../../src/components/uikit/PasswordInput/PasswordInput.stories.tsx"],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA,kDAAyB;AACzB,+DAAgD;AAEhD,qFAAiF;AACjF,yEAAqE;AACrE,mEAA+D;AAE/D,mDAA4D;AAE5D,kBAAe;IACb,KAAK,EAAE,YAAY;IACnB,SAAS,EAAE,6BAAS;CACrB,CAAA;AAEM,MAAM,aAAa,GAAG,GAAG,EAAE;IAEhC,OAAO,CACL;QACE,8BAAC,uBAAU,qIAAoC;QAC/C,8BAAC,mCAAgB,IACf,IAAI,EAAC,koBAC8B,GACnC;QACF,8BAAC,2BAAY;YACX,8BAAC,MAAM,CAAC,OAAO;gBACb,8BAAC,6BAAS,IAAC,KAAK,EAAC,EAAE,EAAC,IAAI,EAAC,MAAM,GAAG,CACnB,CACJ;QACf,8BAAC,mCAAgB,IACf,IAAI,EAAC,yjBACgB,GACrB;QACF,8BAAC,2BAAY;YACX,8BAAC,MAAM,CAAC,OAAO;gBACb,8BAAC,6BAAS,IAAC,KAAK,EAAC,EAAE,EAAC,IAAI,EAAC,MAAM,EAAC,QAAQ,EAAE,KAAK,GAAI,CACpC,CACJ,CACd,CACJ,CAAA;AACH,CAAC,CAAA;AAzBY,QAAA,aAAa,iBAyBzB"}

package/dist/components/uikit/PasswordInput/PasswordInput.styled.js

@@ -0,0 +1,60 @@
+"use strict";
+var __importDefault = (this && this.__importDefault) || function (mod) {
+    return (mod && mod.__esModule) ? mod : { "default": mod };
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.Wrapper = exports.EyeIconStyle = exports.EyeCloseIconStyle = exports.Container = void 0;
+const styled_components_1 = __importDefault(require("styled-components"));
+const Eye_svg_1 = __importDefault(require("../../../icons/Eye.svg"));
+const EyeClose_svg_1 = __importDefault(require("../../../icons/EyeClose.svg"));
+const Container = styled_components_1.default.div `
+  position: relative;
+  width: 100%;
+  & input {
+    padding-right: 40px;
+  }
+`;
+exports.Container = Container;
+const Icon = `
+  width: 24px;
+  height: 24px;
+  position: absolute;
+  top: 11px;
+  right: 10px;
+  cursor: pointer;
+`;
+const EyeIconStyle = (0, styled_components_1.default)(Eye_svg_1.default) `
+  ${Icon}
+  & > path {
+    fill: ${(props) => props.theme.icons.primary};
+  }
+  &:hover {
+    & > path {
+      fill: ${(props) => props.theme.icons.secondary};
+    }
+  }
+  &:active {
+    opacity: 0.6;
+  }
+`;
+exports.EyeIconStyle = EyeIconStyle;
+const EyeCloseIconStyle = (0, styled_components_1.default)(EyeClose_svg_1.default) `
+  ${Icon}
+  & > path {
+    fill: ${(props) => props.theme.icons.primary};
+  }
+  &:hover {
+    & > path {
+      fill: ${(props) => props.theme.icons.secondary};
+    }
+  }
+  &:active {
+    opacity: 0.6;
+  }
+`;
+exports.EyeCloseIconStyle = EyeCloseIconStyle;
+const Wrapper = styled_components_1.default.div `
+  max-width: 340px;
+`;
+exports.Wrapper = Wrapper;
+//# sourceMappingURL=PasswordInput.styled.js.map

package/dist/components/uikit/PasswordInput/PasswordInput.styled.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"PasswordInput.styled.js","sourceRoot":"","sources":["../../../../src/components/uikit/PasswordInput/PasswordInput.styled.ts"],"names":[],"mappings":";;;;;;AAAA,0EAAsC;AACtC,qEAA4C;AAC5C,+EAAsD;AAEtD,MAAM,SAAS,GAAG,2BAAM,CAAC,GAAG,CAAA;;;;;;CAM3B,CAAA;AA4CQ,8BAAS;AA1ClB,MAAM,IAAI,GAAG;;;;;;;CAOZ,CAAA;AAED,MAAM,YAAY,GAAG,IAAA,2BAAM,EAAC,iBAAO,CAAC,CAAA;IAChC,IAAI;;YAEI,CAAC,KAAK,EAAE,EAAE,CAAC,KAAK,CAAC,KAAK,CAAC,KAAK,CAAC,OAAO;;;;cAIlC,CAAC,KAAK,EAAE,EAAE,CAAC,KAAK,CAAC,KAAK,CAAC,KAAK,CAAC,SAAS;;;;;;CAMnD,CAAA;AAoBsC,oCAAY;AAnBnD,MAAM,iBAAiB,GAAG,IAAA,2BAAM,EAAC,sBAAY,CAAC,CAAA;IAC1C,IAAI;;YAEI,CAAC,KAAK,EAAE,EAAE,CAAC,KAAK,CAAC,KAAK,CAAC,KAAK,CAAC,OAAO;;;;cAIlC,CAAC,KAAK,EAAE,EAAE,CAAC,KAAK,CAAC,KAAK,CAAC,KAAK,CAAC,SAAS;;;;;;CAMnD,CAAA;AAMmB,8CAAiB;AAJrC,MAAM,OAAO,GAAG,2BAAM,CAAC,GAAG,CAAA;;CAEzB,CAAA;AAEoD,0BAAO"}

package/dist/components/uikit/PasswordInput/PasswordInput.typed.js

@@ -0,0 +1,3 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+//# sourceMappingURL=PasswordInput.typed.js.map

package/dist/components/uikit/PasswordInput/PasswordInput.typed.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"PasswordInput.typed.js","sourceRoot":"","sources":["../../../../src/components/uikit/PasswordInput/PasswordInput.typed.ts"],"names":[],"mappings":""}

package/dist/components/uikit/PasswordInput/index.js

@@ -0,0 +1,6 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.PasswordInput = void 0;
+var PasswordInput_1 = require("./PasswordInput");
+Object.defineProperty(exports, "PasswordInput", { enumerable: true, get: function () { return PasswordInput_1.PasswordInput; } });
+//# sourceMappingURL=index.js.map

package/dist/components/uikit/PasswordInput/index.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../../src/components/uikit/PasswordInput/index.ts"],"names":[],"mappings":";;;AAAA,iDAA+C;AAAtC,8GAAA,aAAa,OAAA"}

package/dist/components/uikit/Popup/Popup.d.ts

@@ -28,9 +28,9 @@ export declare function usePopup({ placement, isHover }: {
         floating: HTMLElement;
     } & import("@floating-ui/react").ExtendedElements<import("@floating-ui/react").ReferenceType>;
     context: {
-        placement: Placement;
         x: number;
         y: number;
+        placement: Placement;
         strategy: import("@floating-ui/utils").Strategy;
         middlewareData: import("@floating-ui/core").MiddlewareData;
         isPositioned: boolean;