diff --git a/products/ASC.Files/Client/src/components/panels/UploadPanel/PasswordInput.js b/products/ASC.Files/Client/src/components/panels/UploadPanel/PasswordInput.js
new file mode 100644
index 0000000000..55aebc4736
--- /dev/null
+++ b/products/ASC.Files/Client/src/components/panels/UploadPanel/PasswordInput.js
@@ -0,0 +1,42 @@
+import React, { useState } from "react";
+import PasswordInput from "@appserver/components/password-input";
+import Button from "@appserver/components/button";
+import styled, { css } from "styled-components";
+
+const StyledBody = styled.div`
+  display: flex;
+  width: 468px;
+
+  #conversion-button {
+    margin-left: 8px;
+  }
+  #conversion-password {
+    width: 382px;
+  }
+`;
+const PasswordComponent = ({}) => {
+  const [password, setPassword] = useState();
+  const onClick = () => {
+    console.log("on click");
+  };
+  return (
+    <StyledBody>
+      <PasswordInput
+        simpleView
+        id="conversion-password"
+        type="password"
+        inputValue={password}
+      />
+      <Button
+        id="conversion-button"
+        size="medium"
+        scale
+        primary
+        label={"Button Text"}
+        onClick={onClick}
+      />
+    </StyledBody>
+  );
+};
+
+export default PasswordComponent;