login-signup-google 1.0.2 → 1.0.3

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.
Files changed (5) hide show
  1. package/dist/Login.js +29 -15
  2. package/dist/Signup.js +78 -49
  3. package/dist/index.js +1 -1
  4. package/package.json +64 -3
  5. /package/dist/{GoogleLogin.js → GoogleButton.js} +0 -0
package/dist/Login.js CHANGED
@@ -19,11 +19,12 @@ export default function Login({
19
19
  style: styles.card
20
20
  }, /*#__PURE__*/React.createElement("h2", {
21
21
  style: styles.title
22
- }, "Login"), /*#__PURE__*/React.createElement("form", {
22
+ }, "Welcome back"), /*#__PURE__*/React.createElement("form", {
23
23
  onSubmit: submit
24
24
  }, /*#__PURE__*/React.createElement("input", {
25
25
  style: styles.input,
26
26
  placeholder: "Email",
27
+ type: "email",
27
28
  value: email,
28
29
  onChange: e => setEmail(e.target.value)
29
30
  }), /*#__PURE__*/React.createElement("input", {
@@ -33,35 +34,48 @@ export default function Login({
33
34
  value: password,
34
35
  onChange: e => setPassword(e.target.value)
35
36
  }), /*#__PURE__*/React.createElement("button", {
36
- style: styles.btn
37
+ style: styles.btn,
38
+ type: "submit"
37
39
  }, "Login")));
38
40
  }
39
41
  const styles = {
40
42
  card: {
41
- width: 320,
42
- padding: 20,
43
+ width: "100%",
44
+ maxWidth: 420,
45
+ padding: 24,
43
46
  background: "#fff",
44
- borderRadius: 10,
45
- border: "2px solid #2ecc71"
47
+ borderRadius: 14,
48
+ border: "1px solid rgba(46, 204, 113, 0.35)",
49
+ boxShadow: "0 10px 30px rgba(0,0,0,0.08)",
50
+ boxSizing: "border-box"
46
51
  },
47
52
  title: {
48
53
  textAlign: "center",
49
- color: "#2ecc71"
54
+ color: "#16a34a",
55
+ marginTop: 0,
56
+ marginBottom: 16,
57
+ fontSize: 28,
58
+ fontWeight: 700,
59
+ letterSpacing: "0.2px"
50
60
  },
51
61
  input: {
52
62
  width: "100%",
53
- padding: 10,
54
- marginBottom: 10,
55
- border: "1px solid #2ecc71",
56
- borderRadius: 5
63
+ padding: "12px 12px",
64
+ marginBottom: 12,
65
+ border: "1px solid rgba(46, 204, 113, 0.6)",
66
+ borderRadius: 10,
67
+ outline: "none",
68
+ boxSizing: "border-box"
57
69
  },
58
70
  btn: {
59
71
  width: "100%",
60
- padding: 10,
61
- background: "#2ecc71",
72
+ padding: "12px 12px",
73
+ background: "linear-gradient(90deg, #22c55e, #16a34a)",
62
74
  color: "#fff",
63
75
  border: "none",
64
- borderRadius: 5,
65
- cursor: "pointer"
76
+ borderRadius: 10,
77
+ cursor: "pointer",
78
+ fontWeight: 700,
79
+ letterSpacing: "0.2px"
66
80
  }
67
81
  };
package/dist/Signup.js CHANGED
@@ -7,47 +7,48 @@ export default function Signup({
7
7
  lastName: "",
8
8
  email: "",
9
9
  phone: "",
10
- otp: ""
10
+ password: ""
11
11
  });
12
- const [otpSent, setOtpSent] = useState(false);
13
- const [success, setSuccess] = useState(false);
12
+ const [loading, setLoading] = useState(false);
13
+ const [message, setMessage] = useState("");
14
14
  const handleChange = e => {
15
15
  setForm({
16
16
  ...form,
17
17
  [e.target.name]: e.target.value
18
18
  });
19
19
  };
20
- const sendOtp = () => {
21
- if (!form.phone) {
22
- alert("Enter phone number");
23
- return;
24
- }
25
- setOtpSent(true);
26
- alert("OTP sent (demo)");
27
- };
28
- const submit = e => {
20
+ const submit = async e => {
29
21
  e.preventDefault();
30
- if (!form.otp) {
31
- alert("Enter OTP");
22
+ if (!form.firstName || !form.email || !form.password) {
23
+ alert("First name, email and password are required");
32
24
  return;
33
25
  }
34
- setSuccess(true);
35
- onSuccess && onSuccess(form);
26
+ setLoading(true);
27
+ try {
28
+ setMessage("");
29
+ onSuccess && onSuccess({
30
+ username: `${form.firstName} ${form.lastName}`.trim(),
31
+ email: form.email,
32
+ phone: form.phone,
33
+ password: form.password
34
+ });
35
+ setMessage("Signup submitted ✅");
36
+ } catch (err) {
37
+ setMessage("Signup failed");
38
+ } finally {
39
+ setLoading(false);
40
+ }
36
41
  };
37
- if (success) {
38
- return /*#__PURE__*/React.createElement("div", {
39
- style: styles.card
40
- }, /*#__PURE__*/React.createElement("h2", {
41
- style: {
42
- color: "#2ecc71"
43
- }
44
- }, "Signup Successful \u2705"), /*#__PURE__*/React.createElement("p", null, "Welcome ", form.firstName));
45
- }
46
42
  return /*#__PURE__*/React.createElement("div", {
47
43
  style: styles.card
48
44
  }, /*#__PURE__*/React.createElement("h2", {
49
45
  style: styles.title
50
- }, "Signup"), /*#__PURE__*/React.createElement("input", {
46
+ }, "Create account"), /*#__PURE__*/React.createElement("form", {
47
+ onSubmit: submit,
48
+ style: styles.form
49
+ }, /*#__PURE__*/React.createElement("div", {
50
+ style: styles.row
51
+ }, /*#__PURE__*/React.createElement("input", {
51
52
  name: "firstName",
52
53
  style: styles.input,
53
54
  placeholder: "First Name",
@@ -57,7 +58,7 @@ export default function Signup({
57
58
  style: styles.input,
58
59
  placeholder: "Last Name",
59
60
  onChange: handleChange
60
- }), /*#__PURE__*/React.createElement("input", {
61
+ })), /*#__PURE__*/React.createElement("input", {
61
62
  name: "email",
62
63
  style: styles.input,
63
64
  placeholder: "Email",
@@ -65,47 +66,75 @@ export default function Signup({
65
66
  }), /*#__PURE__*/React.createElement("input", {
66
67
  name: "phone",
67
68
  style: styles.input,
68
- placeholder: "Phone Number",
69
+ placeholder: "Phone",
69
70
  onChange: handleChange
70
- }), !otpSent ? /*#__PURE__*/React.createElement("button", {
71
- style: styles.btn,
72
- onClick: sendOtp
73
- }, "Send OTP") : /*#__PURE__*/React.createElement(React.Fragment, null, /*#__PURE__*/React.createElement("input", {
74
- name: "otp",
71
+ }), /*#__PURE__*/React.createElement("input", {
72
+ name: "password",
75
73
  style: styles.input,
76
- placeholder: "Enter OTP",
74
+ placeholder: "Password",
75
+ type: "password",
77
76
  onChange: handleChange
78
77
  }), /*#__PURE__*/React.createElement("button", {
79
78
  style: styles.btn,
80
- onClick: submit
81
- }, "Verify & Signup")));
79
+ type: "submit",
80
+ disabled: loading
81
+ }, loading ? "Creating..." : "Sign up")), message && /*#__PURE__*/React.createElement("p", {
82
+ style: styles.message
83
+ }, message));
82
84
  }
83
85
  const styles = {
84
86
  card: {
85
- width: 350,
86
- padding: 20,
87
+ width: "100%",
88
+ maxWidth: 420,
89
+ padding: 24,
87
90
  background: "#fff",
88
- borderRadius: 10,
89
- border: "2px solid #2ecc71"
91
+ borderRadius: 14,
92
+ border: "1px solid rgba(46, 204, 113, 0.35)",
93
+ boxShadow: "0 10px 30px rgba(0,0,0,0.08)",
94
+ boxSizing: "border-box"
90
95
  },
91
96
  title: {
92
97
  textAlign: "center",
93
- color: "#2ecc71"
98
+ color: "#16a34a",
99
+ marginTop: 0,
100
+ marginBottom: 16,
101
+ fontSize: 28,
102
+ fontWeight: 700,
103
+ letterSpacing: "0.2px"
104
+ },
105
+ form: {
106
+ display: "flex",
107
+ flexDirection: "column",
108
+ gap: 12
109
+ },
110
+ row: {
111
+ display: "flex",
112
+ gap: 12,
113
+ flexWrap: "wrap"
94
114
  },
95
115
  input: {
116
+ flex: "1 1 180px",
96
117
  width: "100%",
97
- padding: 10,
98
- marginBottom: 10,
99
- border: "1px solid #2ecc71",
100
- borderRadius: 5
118
+ padding: "12px 12px",
119
+ border: "1px solid rgba(46, 204, 113, 0.6)",
120
+ borderRadius: 10,
121
+ outline: "none",
122
+ boxSizing: "border-box"
101
123
  },
102
124
  btn: {
103
125
  width: "100%",
104
- padding: 10,
105
- background: "#2ecc71",
126
+ padding: "12px 12px",
127
+ background: "linear-gradient(90deg, #22c55e, #16a34a)",
106
128
  color: "#fff",
107
129
  border: "none",
108
- borderRadius: 5,
109
- cursor: "pointer"
130
+ borderRadius: 10,
131
+ cursor: "pointer",
132
+ fontWeight: 700,
133
+ letterSpacing: "0.2px"
134
+ },
135
+ message: {
136
+ marginTop: 12,
137
+ textAlign: "center",
138
+ color: "#16a34a"
110
139
  }
111
140
  };
package/dist/index.js CHANGED
@@ -1,3 +1,3 @@
1
1
  export { default as Login } from "./Login";
2
2
  export { default as Signup } from "./Signup";
3
- export { default as GoogleLogin } from "./GoogleLogin";
3
+ export { default as GoogleButton } from "./GoogleButton";
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "login-signup-google",
3
- "version": "1.0.2",
3
+ "version": "1.0.3",
4
4
  "description": "Reusable React Login, Signup and Google Login components",
5
5
  "main": "dist/index.js",
6
6
  "keywords": [
@@ -23,6 +23,67 @@
23
23
  "devDependencies": {
24
24
  "@babel/cli": "^7.28.6",
25
25
  "@babel/core": "^7.28.6",
26
- "@babel/preset-react": "^7.28.5"
27
- }
26
+ "@babel/preset-react": "^7.28.5",
27
+ "nodemon": "^3.1.11"
28
+ },
29
+ "dependencies": {
30
+ "anymatch": "^3.1.3",
31
+ "balanced-match": "^1.0.2",
32
+ "baseline-browser-mapping": "^2.9.15",
33
+ "bcryptjs": "^3.0.3",
34
+ "binary-extensions": "^2.3.0",
35
+ "brace-expansion": "^1.1.12",
36
+ "braces": "^3.0.3",
37
+ "browserslist": "^4.28.1",
38
+ "caniuse-lite": "^1.0.30001764",
39
+ "chokidar": "^3.6.0",
40
+ "commander": "^6.2.1",
41
+ "concat-map": "^0.0.1",
42
+ "convert-source-map": "^2.0.0",
43
+ "cors": "^2.8.5",
44
+ "debug": "^4.4.3",
45
+ "dotenv": "^17.2.3",
46
+ "electron-to-chromium": "^1.5.267",
47
+ "escalade": "^3.2.0",
48
+ "express": "^5.2.1",
49
+ "fill-range": "^7.1.1",
50
+ "fs-readdir-recursive": "^1.1.0",
51
+ "fs.realpath": "^1.0.0",
52
+ "gensync": "^1.0.0-beta.2",
53
+ "glob": "^7.2.3",
54
+ "glob-parent": "^5.1.2",
55
+ "google-auth-library": "^10.5.0",
56
+ "inflight": "^1.0.6",
57
+ "inherits": "^2.0.4",
58
+ "is-binary-path": "^2.1.0",
59
+ "is-extglob": "^2.1.1",
60
+ "is-glob": "^4.0.3",
61
+ "is-number": "^7.0.0",
62
+ "js-tokens": "^4.0.0",
63
+ "jsesc": "^3.1.0",
64
+ "json5": "^2.2.3",
65
+ "jsonwebtoken": "^9.0.3",
66
+ "lru-cache": "^5.1.1",
67
+ "make-dir": "^2.1.0",
68
+ "minimatch": "^3.1.2",
69
+ "mongoose": "^9.1.4",
70
+ "ms": "^2.1.3",
71
+ "node-releases": "^2.0.27",
72
+ "nodemailer": "^7.0.12",
73
+ "normalize-path": "^3.0.0",
74
+ "once": "^1.4.0",
75
+ "path-is-absolute": "^1.0.1",
76
+ "picocolors": "^1.1.1",
77
+ "picomatch": "^2.3.1",
78
+ "pify": "^4.0.1",
79
+ "react": ">=18",
80
+ "readdirp": "^3.6.0",
81
+ "semver": "^6.3.1",
82
+ "slash": "^2.0.0",
83
+ "to-regex-range": "^5.0.1",
84
+ "update-browserslist-db": "^1.2.3",
85
+ "wrappy": "^1.0.2",
86
+ "yallist": "^3.1.1"
87
+ },
88
+ "type": "commonjs"
28
89
  }
/package/dist/{GoogleLogin.js → GoogleButton.js} RENAMED
File without changes