@thetechfossil/auth2 1.2.21 → 1.2.22

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.
@@ -5,12 +5,6 @@ import { io } from 'socket.io-client';
5
5
  import { ImageManager, UpfilesClient } from '@thetechfossil/upfiles';
6
6
  import { jsx, jsxs, Fragment } from 'react/jsx-runtime';
7
7
 
8
- var __require = /* @__PURE__ */ ((x) => typeof require !== "undefined" ? require : typeof Proxy !== "undefined" ? new Proxy(x, {
9
- get: (a, b) => (typeof require !== "undefined" ? require : a)[b]
10
- }) : x)(function(x) {
11
- if (typeof require !== "undefined") return require.apply(this, arguments);
12
- throw Error('Dynamic require of "' + x + '" is not supported');
13
- });
14
8
  var ERROR_MESSAGES = {
15
9
  NETWORK_ERROR: "Unable to connect to the server. Please check your internet connection and try again.",
16
10
  TIMEOUT: "The request took too long. Please try again.",
@@ -340,6 +334,7 @@ var AuthService = class {
340
334
  if (token) {
341
335
  this.token = token;
342
336
  this.httpClient.setAuthToken(token);
337
+ this.setTokenCookie(token);
343
338
  }
344
339
  } catch (error) {
345
340
  console.warn("Failed to load token from storage:", error);
@@ -350,15 +345,28 @@ var AuthService = class {
350
345
  if (typeof window !== "undefined" && this.config.localStorageKey) {
351
346
  try {
352
347
  localStorage.setItem(this.config.localStorageKey, token);
348
+ this.setTokenCookie(token);
353
349
  } catch (error) {
354
350
  console.warn("Failed to save token to storage:", error);
355
351
  }
356
352
  }
357
353
  }
354
+ setTokenCookie(token) {
355
+ if (typeof window !== "undefined") {
356
+ const maxAge = 7 * 24 * 60 * 60;
357
+ document.cookie = `auth_token=${token}; path=/; max-age=${maxAge}; SameSite=Lax`;
358
+ }
359
+ }
360
+ removeTokenCookie() {
361
+ if (typeof window !== "undefined") {
362
+ document.cookie = "auth_token=; path=/; max-age=0; SameSite=Lax";
363
+ }
364
+ }
358
365
  removeTokenFromStorage() {
359
366
  if (typeof window !== "undefined" && this.config.localStorageKey) {
360
367
  try {
361
368
  localStorage.removeItem(this.config.localStorageKey);
369
+ this.removeTokenCookie();
362
370
  } catch (error) {
363
371
  console.warn("Failed to remove token from storage:", error);
364
372
  }
@@ -958,14 +966,6 @@ function useThemeColors() {
958
966
  const { theme } = useAuthTheme();
959
967
  return theme === "dark" ? darkTheme : lightTheme;
960
968
  }
961
- var PhoneInputWithCountry = null;
962
- try {
963
- const module = __require("react-phone-number-input");
964
- PhoneInputWithCountry = module.default || module;
965
- __require("react-phone-number-input/style.css");
966
- } catch (error) {
967
- console.warn("react-phone-number-input not available, using fallback");
968
- }
969
969
  var CustomPhoneInput = React.forwardRef((props, ref) => /* @__PURE__ */ jsx(
970
970
  "input",
971
971
  {
@@ -986,6 +986,8 @@ var PhoneInput = ({
986
986
  }) => {
987
987
  const colors = useThemeColors();
988
988
  const [defaultCountry, setDefaultCountry] = useState("US");
989
+ const [PhoneInputComponent, setPhoneInputComponent] = useState(null);
990
+ const [isLoading, setIsLoading] = useState(true);
989
991
  const styleContent = useMemo(() => `
990
992
  .PhoneInput {
991
993
  display: flex;
@@ -1098,6 +1100,29 @@ var PhoneInput = ({
1098
1100
  opacity: 0.6;
1099
1101
  }
1100
1102
  `, [colors]);
1103
+ useEffect(() => {
1104
+ let mounted = true;
1105
+ const loadPhoneInput = async () => {
1106
+ try {
1107
+ const module = await import('react-phone-number-input');
1108
+ if (mounted) {
1109
+ setPhoneInputComponent(() => module.default);
1110
+ }
1111
+ } catch (error) {
1112
+ if (mounted) {
1113
+ setPhoneInputComponent(null);
1114
+ }
1115
+ } finally {
1116
+ if (mounted) {
1117
+ setIsLoading(false);
1118
+ }
1119
+ }
1120
+ };
1121
+ loadPhoneInput();
1122
+ return () => {
1123
+ mounted = false;
1124
+ };
1125
+ }, []);
1101
1126
  useEffect(() => {
1102
1127
  const detectCountry = async () => {
1103
1128
  try {
@@ -1150,7 +1175,6 @@ var PhoneInput = ({
1150
1175
  }
1151
1176
  }
1152
1177
  } catch (error) {
1153
- console.log("Country detection failed, using default US");
1154
1178
  }
1155
1179
  };
1156
1180
  detectCountry();
@@ -1158,7 +1182,31 @@ var PhoneInput = ({
1158
1182
  const handleChange = useMemo(() => (val) => {
1159
1183
  onChange(val || "");
1160
1184
  }, [onChange]);
1161
- if (!PhoneInputWithCountry) {
1185
+ if (isLoading) {
1186
+ return /* @__PURE__ */ jsx(
1187
+ "input",
1188
+ {
1189
+ id,
1190
+ type: "tel",
1191
+ value,
1192
+ onChange: (e) => onChange(e.target.value),
1193
+ disabled,
1194
+ required,
1195
+ placeholder,
1196
+ style: {
1197
+ width: "100%",
1198
+ padding: "12px 16px",
1199
+ border: `1px solid ${colors.borderSecondary}`,
1200
+ borderRadius: "8px",
1201
+ fontSize: "16px",
1202
+ backgroundColor: colors.bgSecondary,
1203
+ color: colors.textPrimary,
1204
+ ...style
1205
+ }
1206
+ }
1207
+ );
1208
+ }
1209
+ if (!PhoneInputComponent) {
1162
1210
  return /* @__PURE__ */ jsx(
1163
1211
  "input",
1164
1212
  {
@@ -1192,7 +1240,7 @@ var PhoneInput = ({
1192
1240
  children: [
1193
1241
  /* @__PURE__ */ jsx("style", { children: styleContent }),
1194
1242
  /* @__PURE__ */ jsx(
1195
- PhoneInputWithCountry,
1243
+ PhoneInputComponent,
1196
1244
  {
1197
1245
  id,
1198
1246
  international: true,
@@ -1690,6 +1738,28 @@ var RegisterForm = ({
1690
1738
  const [error, setError] = useState(null);
1691
1739
  const [showPassword, setShowPassword] = useState(false);
1692
1740
  const [showConfirmPassword, setShowConfirmPassword] = useState(false);
1741
+ const [invitationDetails, setInvitationDetails] = useState(null);
1742
+ const [isLoadingInvitation, setIsLoadingInvitation] = useState(false);
1743
+ const config = authConfig || {
1744
+ baseUrl: "http://localhost:7000"
1745
+ };
1746
+ useEffect(() => {
1747
+ if (invitationToken) {
1748
+ setIsLoadingInvitation(true);
1749
+ fetch(`${config.baseUrl}/api/v1/auth/verify-invitation/${invitationToken}`).then((res) => res.json()).then((data) => {
1750
+ setInvitationDetails(data);
1751
+ if (data.valid && data.email) {
1752
+ setEmail(data.email);
1753
+ }
1754
+ }).catch((err) => {
1755
+ console.error("Failed to verify invitation:", err);
1756
+ setError("Failed to verify invitation. Please try again.");
1757
+ }).finally(() => {
1758
+ setIsLoadingInvitation(false);
1759
+ });
1760
+ }
1761
+ }, [invitationToken, config.baseUrl]);
1762
+ const isEmailDisabled = isLoading || invitationDetails?.valid && !!invitationDetails?.email;
1693
1763
  const getPasswordStrength = (pwd) => {
1694
1764
  if (!pwd) return { strength: "weak", score: 0, label: "" };
1695
1765
  let score = 0;
@@ -1703,9 +1773,6 @@ var RegisterForm = ({
1703
1773
  return { strength: "strong", score, label: "Strong" };
1704
1774
  };
1705
1775
  getPasswordStrength(password);
1706
- const config = authConfig || {
1707
- baseUrl: "http://localhost:7000"
1708
- };
1709
1776
  const { register } = useAuth(config);
1710
1777
  const handleSubmit = async (e) => {
1711
1778
  e.preventDefault();
@@ -1740,6 +1807,25 @@ var RegisterForm = ({
1740
1807
  if (response.ok && data.success) {
1741
1808
  if (typeof window !== "undefined" && data.token) {
1742
1809
  localStorage.setItem("auth_token", data.token);
1810
+ if (data.invitation?.organizationId && data.invitation?.role) {
1811
+ localStorage.setItem("currentOrganizationId", data.invitation.organizationId);
1812
+ const backendUrl = typeof window !== "undefined" ? process.env.NEXT_PUBLIC_INVENTORY_API_URL || process.env.NEXT_PUBLIC_BIZFLOW_API_URL || "http://localhost:5002" : "http://localhost:5002";
1813
+ try {
1814
+ await fetch(`${backendUrl}/api/auth/sync-with-role`, {
1815
+ method: "POST",
1816
+ headers: {
1817
+ "Content-Type": "application/json",
1818
+ "Authorization": `Bearer ${data.token}`
1819
+ },
1820
+ body: JSON.stringify({
1821
+ organizationId: data.invitation.organizationId,
1822
+ roleName: data.invitation.role
1823
+ })
1824
+ });
1825
+ } catch (syncError) {
1826
+ console.error("Failed to sync user role with backend:", syncError);
1827
+ }
1828
+ }
1743
1829
  }
1744
1830
  onRegisterSuccess?.();
1745
1831
  } else {
@@ -1847,7 +1933,7 @@ var RegisterForm = ({
1847
1933
  value: email,
1848
1934
  onChange: (e) => setEmail(e.target.value),
1849
1935
  required: !phoneNumber,
1850
- disabled: isLoading,
1936
+ disabled: isEmailDisabled,
1851
1937
  style: {
1852
1938
  width: "100%",
1853
1939
  padding: "12px 16px",
@@ -1855,9 +1941,11 @@ var RegisterForm = ({
1855
1941
  borderRadius: "8px",
1856
1942
  fontSize: "16px",
1857
1943
  boxSizing: "border-box",
1858
- color: colors.textPrimary,
1944
+ color: isEmailDisabled ? colors.textSecondary : colors.textPrimary,
1859
1945
  transition: "all 0.2s ease",
1860
- backgroundColor: colors.bgSecondary
1946
+ backgroundColor: isEmailDisabled ? colors.bgHover : colors.bgSecondary,
1947
+ cursor: isEmailDisabled ? "not-allowed" : "text",
1948
+ opacity: isEmailDisabled ? 0.7 : 1
1861
1949
  },
1862
1950
  placeholder: "Enter your email"
1863
1951
  }
@@ -2560,7 +2648,7 @@ var EmailVerificationPage = ({
2560
2648
  } })
2561
2649
  ] }) });
2562
2650
  }
2563
- return /* @__PURE__ */ jsx("div", { style: {
2651
+ return /* @__PURE__ */ jsxs("div", { style: {
2564
2652
  maxWidth: "500px",
2565
2653
  margin: "0 auto",
2566
2654
  padding: "30px",
@@ -2569,44 +2657,86 @@ var EmailVerificationPage = ({
2569
2657
  backgroundColor: "#ffffff",
2570
2658
  textAlign: "center",
2571
2659
  border: "1px solid #eaeaea"
2572
- }, children: /* @__PURE__ */ jsxs("div", { style: {
2573
- padding: "20px"
2574
2660
  }, children: [
2575
- /* @__PURE__ */ jsx("h2", { style: { color: "black" }, children: "Email Verification" }),
2576
- /* @__PURE__ */ jsx("div", { style: {
2577
- padding: "16px 20px",
2578
- margin: "24px 0",
2579
- borderRadius: "8px",
2580
- fontSize: "15px",
2581
- fontWeight: 500,
2582
- backgroundColor: isSuccess ? "#d4edda" : "#f8d7da",
2583
- color: isSuccess ? "#155724" : "#721c24",
2584
- border: isSuccess ? "1px solid #c3e6cb" : "1px solid #f5c6cb"
2585
- }, children: message }),
2586
- isSuccess && /* @__PURE__ */ jsxs("div", { style: {
2587
- marginTop: "24px"
2661
+ /* @__PURE__ */ jsxs("div", { style: {
2662
+ padding: "20px"
2588
2663
  }, children: [
2589
- /* @__PURE__ */ jsx("p", { style: { color: "black" }, children: "Your email has been successfully verified!" }),
2590
- /* @__PURE__ */ jsx(
2591
- "button",
2592
- {
2593
- onClick: () => window.location.href = "/login",
2594
- style: {
2595
- padding: "12px 24px",
2596
- backgroundColor: "#007bff",
2597
- color: "white",
2598
- border: "none",
2599
- borderRadius: "8px",
2600
- fontSize: "16px",
2601
- fontWeight: 600,
2602
- cursor: "pointer",
2603
- transition: "all 0.2s ease"
2604
- },
2605
- children: "Go to Login"
2664
+ /* @__PURE__ */ jsx("h2", { style: { color: "black" }, children: isSuccess ? "\u2713 Email Verified!" : "\u2717 Verification Failed" }),
2665
+ /* @__PURE__ */ jsx("div", { style: {
2666
+ padding: "16px 20px",
2667
+ margin: "24px 0",
2668
+ borderRadius: "8px",
2669
+ fontSize: "15px",
2670
+ fontWeight: 500,
2671
+ backgroundColor: isSuccess ? "#d4edda" : "#f8d7da",
2672
+ color: isSuccess ? "#155724" : "#721c24",
2673
+ border: isSuccess ? "1px solid #c3e6cb" : "1px solid #f5c6cb"
2674
+ }, children: message }),
2675
+ isSuccess ? /* @__PURE__ */ jsxs("div", { style: { marginTop: "24px" }, children: [
2676
+ /* @__PURE__ */ jsx("p", { style: { color: "#666", marginBottom: "16px" }, children: "Redirecting to login..." }),
2677
+ /* @__PURE__ */ jsx("div", { style: {
2678
+ border: "3px solid #d4edda",
2679
+ borderTop: "3px solid #28a745",
2680
+ borderRadius: "50%",
2681
+ width: "30px",
2682
+ height: "30px",
2683
+ animation: "spin 1s linear infinite",
2684
+ margin: "0 auto"
2685
+ } })
2686
+ ] }) : /* @__PURE__ */ jsxs("div", { style: { marginTop: "24px" }, children: [
2687
+ /* @__PURE__ */ jsx("p", { style: { color: "#666", marginBottom: "16px" }, children: "The verification link may have expired or already been used." }),
2688
+ /* @__PURE__ */ jsx(
2689
+ "button",
2690
+ {
2691
+ onClick: () => {
2692
+ const registerPath = process.env.NEXT_PUBLIC_AUTH_REDIRECT_TO_REGISTER || process.env.REACT_APP_AUTH_REDIRECT_TO_REGISTER || "/auth/register";
2693
+ window.location.href = registerPath;
2694
+ },
2695
+ style: {
2696
+ padding: "12px 24px",
2697
+ backgroundColor: "#007bff",
2698
+ color: "white",
2699
+ border: "none",
2700
+ borderRadius: "8px",
2701
+ fontSize: "16px",
2702
+ fontWeight: 600,
2703
+ cursor: "pointer",
2704
+ transition: "all 0.2s ease",
2705
+ marginRight: "12px"
2706
+ },
2707
+ children: "Register Again"
2708
+ }
2709
+ ),
2710
+ /* @__PURE__ */ jsx(
2711
+ "button",
2712
+ {
2713
+ onClick: () => {
2714
+ const loginPath = process.env.NEXT_PUBLIC_AUTH_REDIRECT_TO_LOGIN || process.env.REACT_APP_AUTH_REDIRECT_TO_LOGIN || "/auth/login";
2715
+ window.location.href = loginPath;
2716
+ },
2717
+ style: {
2718
+ padding: "12px 24px",
2719
+ backgroundColor: "#6c757d",
2720
+ color: "white",
2721
+ border: "none",
2722
+ borderRadius: "8px",
2723
+ fontSize: "16px",
2724
+ fontWeight: 600,
2725
+ cursor: "pointer",
2726
+ transition: "all 0.2s ease"
2727
+ },
2728
+ children: "Go to Login"
2729
+ }
2730
+ )
2731
+ ] })
2732
+ ] }),
2733
+ /* @__PURE__ */ jsx("style", { children: `
2734
+ @keyframes spin {
2735
+ 0% { transform: rotate(0deg); }
2736
+ 100% { transform: rotate(360deg); }
2606
2737
  }
2607
- )
2608
- ] })
2609
- ] }) });
2738
+ ` })
2739
+ ] });
2610
2740
  };
2611
2741
  var AuthContext = createContext(void 0);
2612
2742
  var useAuth2 = () => {
@@ -4825,6 +4955,274 @@ var UserProfile = ({
4825
4955
  ] })
4826
4956
  ] });
4827
4957
  };
4958
+ var SuperAdminSignIn = ({ redirectUrl, appearance }) => {
4959
+ const { signIn, isSignedIn, loading: authLoading, user } = useAuth2();
4960
+ const colors = useThemeColors();
4961
+ const [email, setEmail] = useState("");
4962
+ const [password, setPassword] = useState("");
4963
+ const [showPassword, setShowPassword] = useState(false);
4964
+ const [isLoading, setIsLoading] = useState(false);
4965
+ const [error, setError] = useState(null);
4966
+ const [success, setSuccess] = useState(null);
4967
+ useEffect(() => {
4968
+ if (isSignedIn && user) {
4969
+ const isSuperAdmin = user.role === "SUPER_ADMIN" || user.role === "SUPERADMIN";
4970
+ if (isSuperAdmin) {
4971
+ const redirect = redirectUrl || process.env.NEXT_PUBLIC_AUTH_REDIRECT_AFTER_LOGIN || process.env.REACT_APP_AUTH_REDIRECT_AFTER_LOGIN || "/dashboard";
4972
+ const baseUrl = process.env.NEXT_PUBLIC_FRONTEND_BASE_URL || process.env.REACT_APP_FRONTEND_BASE_URL || (typeof window !== "undefined" ? window.location.origin : "");
4973
+ window.location.href = `${baseUrl}${redirect}`;
4974
+ } else {
4975
+ setError("Access denied. Only Super Admin users can access this portal.");
4976
+ document.cookie = "auth_token=; path=/; expires=Thu, 01 Jan 1970 00:00:00 GMT";
4977
+ document.cookie = "refresh_token=; path=/; expires=Thu, 01 Jan 1970 00:00:00 GMT";
4978
+ }
4979
+ }
4980
+ }, [isSignedIn, user, redirectUrl]);
4981
+ const handleSubmit = async (e) => {
4982
+ e.preventDefault();
4983
+ setIsLoading(true);
4984
+ setError(null);
4985
+ setSuccess(null);
4986
+ try {
4987
+ const response = await signIn({ email, password });
4988
+ if (response.success) {
4989
+ const userRole = response.user?.role;
4990
+ const isSuperAdmin = userRole === "SUPER_ADMIN" || userRole === "SUPERADMIN";
4991
+ if (!isSuperAdmin) {
4992
+ document.cookie = "auth_token=; path=/; expires=Thu, 01 Jan 1970 00:00:00 GMT";
4993
+ document.cookie = "refresh_token=; path=/; expires=Thu, 01 Jan 1970 00:00:00 GMT";
4994
+ setError("Access denied. Only Super Admin users can access this portal.");
4995
+ return;
4996
+ }
4997
+ setSuccess("Login successful! Redirecting...");
4998
+ } else {
4999
+ setError(response.message || "Login failed. Please check your credentials.");
5000
+ }
5001
+ } catch (err) {
5002
+ setError(err instanceof Error ? err.message : "An error occurred during login.");
5003
+ } finally {
5004
+ setIsLoading(false);
5005
+ }
5006
+ };
5007
+ if (authLoading) {
5008
+ return /* @__PURE__ */ jsx("div", { style: { textAlign: "center", padding: "40px" }, children: /* @__PURE__ */ jsx("div", { children: "Loading..." }) });
5009
+ }
5010
+ return /* @__PURE__ */ jsx(
5011
+ ThemeWrapper,
5012
+ {
5013
+ style: {
5014
+ maxWidth: "400px",
5015
+ margin: "0 auto",
5016
+ padding: "30px",
5017
+ borderRadius: "12px",
5018
+ boxShadow: "0 4px 20px rgba(0, 0, 0, 0.1)",
5019
+ backgroundColor: colors.bgPrimary,
5020
+ border: `1px solid ${colors.borderPrimary}`,
5021
+ ...appearance?.elements?.card
5022
+ },
5023
+ children: /* @__PURE__ */ jsxs("form", { onSubmit: handleSubmit, children: [
5024
+ /* @__PURE__ */ jsxs("div", { style: { textAlign: "center", marginBottom: "24px" }, children: [
5025
+ /* @__PURE__ */ jsx("div", { style: {
5026
+ width: "60px",
5027
+ height: "60px",
5028
+ margin: "0 auto 16px",
5029
+ backgroundColor: colors.buttonPrimary + "20",
5030
+ borderRadius: "12px",
5031
+ display: "flex",
5032
+ alignItems: "center",
5033
+ justifyContent: "center"
5034
+ }, children: /* @__PURE__ */ jsxs("svg", { width: "32", height: "32", viewBox: "0 0 24 24", fill: "none", stroke: colors.buttonPrimary, strokeWidth: "2", children: [
5035
+ /* @__PURE__ */ jsx("path", { d: "M12 22s8-4 8-10V5l-8-3-8 3v7c0 6 8 10 8 10z" }),
5036
+ /* @__PURE__ */ jsx("path", { d: "M9 12l2 2 4-4" })
5037
+ ] }) }),
5038
+ /* @__PURE__ */ jsx("h2", { style: {
5039
+ color: colors.textPrimary,
5040
+ fontSize: "24px",
5041
+ fontWeight: 600,
5042
+ margin: 0,
5043
+ ...appearance?.elements?.headerTitle
5044
+ }, children: "Super Admin Portal" }),
5045
+ /* @__PURE__ */ jsx("p", { style: {
5046
+ color: colors.textSecondary,
5047
+ fontSize: "14px",
5048
+ marginTop: "8px"
5049
+ }, children: "Sign in with your administrator credentials" })
5050
+ ] }),
5051
+ error && /* @__PURE__ */ jsx("div", { style: {
5052
+ padding: "12px 16px",
5053
+ marginBottom: "20px",
5054
+ backgroundColor: colors.errorBg,
5055
+ color: colors.errorText,
5056
+ border: `1px solid ${colors.errorBorder}`,
5057
+ borderRadius: "8px",
5058
+ fontSize: "14px"
5059
+ }, children: error }),
5060
+ success && /* @__PURE__ */ jsx("div", { style: {
5061
+ padding: "12px 16px",
5062
+ marginBottom: "20px",
5063
+ backgroundColor: colors.successBg,
5064
+ color: colors.successText,
5065
+ border: `1px solid ${colors.successBorder}`,
5066
+ borderRadius: "8px",
5067
+ fontSize: "14px"
5068
+ }, children: success }),
5069
+ /* @__PURE__ */ jsxs("div", { style: { marginBottom: "20px" }, children: [
5070
+ /* @__PURE__ */ jsx("label", { htmlFor: "email", style: {
5071
+ display: "block",
5072
+ marginBottom: "8px",
5073
+ fontWeight: 500,
5074
+ color: colors.textSecondary,
5075
+ fontSize: "14px"
5076
+ }, children: "Email Address" }),
5077
+ /* @__PURE__ */ jsx(
5078
+ "input",
5079
+ {
5080
+ id: "email",
5081
+ type: "email",
5082
+ value: email,
5083
+ onChange: (e) => setEmail(e.target.value),
5084
+ onFocus: (e) => {
5085
+ e.currentTarget.style.borderColor = colors.buttonPrimary;
5086
+ e.currentTarget.style.outline = `2px solid ${colors.buttonPrimary}40`;
5087
+ },
5088
+ onBlur: (e) => {
5089
+ e.currentTarget.style.borderColor = colors.borderSecondary;
5090
+ e.currentTarget.style.outline = "none";
5091
+ },
5092
+ required: true,
5093
+ disabled: isLoading,
5094
+ autoComplete: "email",
5095
+ style: {
5096
+ width: "100%",
5097
+ padding: "12px 16px",
5098
+ border: `1px solid ${colors.borderSecondary}`,
5099
+ borderRadius: "8px",
5100
+ fontSize: "16px",
5101
+ boxSizing: "border-box",
5102
+ backgroundColor: colors.bgSecondary,
5103
+ color: colors.textPrimary,
5104
+ transition: "all 0.2s ease",
5105
+ WebkitTextFillColor: colors.textPrimary,
5106
+ WebkitBoxShadow: `0 0 0 1000px ${colors.bgSecondary} inset`,
5107
+ ...appearance?.elements?.formFieldInput
5108
+ },
5109
+ placeholder: "admin@example.com"
5110
+ }
5111
+ )
5112
+ ] }),
5113
+ /* @__PURE__ */ jsxs("div", { style: { marginBottom: "24px", position: "relative" }, children: [
5114
+ /* @__PURE__ */ jsx("label", { htmlFor: "password", style: {
5115
+ display: "block",
5116
+ marginBottom: "8px",
5117
+ fontWeight: 500,
5118
+ color: colors.textSecondary,
5119
+ fontSize: "14px"
5120
+ }, children: "Password" }),
5121
+ /* @__PURE__ */ jsx(
5122
+ "input",
5123
+ {
5124
+ id: "password",
5125
+ type: showPassword ? "text" : "password",
5126
+ value: password,
5127
+ onChange: (e) => setPassword(e.target.value),
5128
+ onFocus: (e) => {
5129
+ e.currentTarget.style.borderColor = colors.buttonPrimary;
5130
+ e.currentTarget.style.outline = `2px solid ${colors.buttonPrimary}40`;
5131
+ },
5132
+ onBlur: (e) => {
5133
+ e.currentTarget.style.borderColor = colors.borderSecondary;
5134
+ e.currentTarget.style.outline = "none";
5135
+ },
5136
+ required: true,
5137
+ disabled: isLoading,
5138
+ autoComplete: "current-password",
5139
+ style: {
5140
+ width: "100%",
5141
+ padding: "12px 16px",
5142
+ paddingRight: "60px",
5143
+ border: `1px solid ${colors.borderSecondary}`,
5144
+ borderRadius: "8px",
5145
+ fontSize: "16px",
5146
+ boxSizing: "border-box",
5147
+ backgroundColor: colors.bgSecondary,
5148
+ color: colors.textPrimary,
5149
+ transition: "all 0.2s ease",
5150
+ WebkitTextFillColor: colors.textPrimary,
5151
+ WebkitBoxShadow: `0 0 0 1000px ${colors.bgSecondary} inset`,
5152
+ ...appearance?.elements?.formFieldInput
5153
+ },
5154
+ placeholder: "Enter your password"
5155
+ }
5156
+ ),
5157
+ /* @__PURE__ */ jsx(
5158
+ "button",
5159
+ {
5160
+ type: "button",
5161
+ onClick: () => setShowPassword(!showPassword),
5162
+ style: {
5163
+ position: "absolute",
5164
+ right: "12px",
5165
+ top: "38px",
5166
+ background: "none",
5167
+ border: "none",
5168
+ cursor: "pointer",
5169
+ color: colors.textTertiary,
5170
+ fontSize: "14px",
5171
+ padding: "4px 8px"
5172
+ },
5173
+ children: showPassword ? "Hide" : "Show"
5174
+ }
5175
+ )
5176
+ ] }),
5177
+ /* @__PURE__ */ jsx(
5178
+ "button",
5179
+ {
5180
+ type: "submit",
5181
+ disabled: isLoading || !email || !password,
5182
+ onMouseEnter: (e) => {
5183
+ if (!isLoading && email && password) {
5184
+ e.currentTarget.style.backgroundColor = colors.buttonPrimaryHover;
5185
+ }
5186
+ },
5187
+ onMouseLeave: (e) => {
5188
+ e.currentTarget.style.backgroundColor = colors.buttonPrimary;
5189
+ },
5190
+ style: {
5191
+ width: "100%",
5192
+ padding: "14px",
5193
+ backgroundColor: colors.buttonPrimary,
5194
+ color: "white",
5195
+ border: "none",
5196
+ borderRadius: "8px",
5197
+ fontSize: "16px",
5198
+ fontWeight: 600,
5199
+ cursor: isLoading || !email || !password ? "not-allowed" : "pointer",
5200
+ opacity: isLoading || !email || !password ? 0.6 : 1,
5201
+ transition: "all 0.2s ease",
5202
+ ...appearance?.elements?.formButtonPrimary
5203
+ },
5204
+ children: isLoading ? "Signing in..." : "Sign In"
5205
+ }
5206
+ ),
5207
+ /* @__PURE__ */ jsx("div", { style: {
5208
+ marginTop: "20px",
5209
+ padding: "12px",
5210
+ backgroundColor: colors.bgSecondary,
5211
+ borderRadius: "8px",
5212
+ textAlign: "center"
5213
+ }, children: /* @__PURE__ */ jsxs("p", { style: {
5214
+ color: colors.textTertiary,
5215
+ fontSize: "12px",
5216
+ margin: 0
5217
+ }, children: [
5218
+ "\u{1F512} This portal is restricted to Super Admin users only.",
5219
+ /* @__PURE__ */ jsx("br", {}),
5220
+ "Contact your system administrator if you need access."
5221
+ ] }) })
5222
+ ] })
5223
+ }
5224
+ );
5225
+ };
4828
5226
  var AvatarManager = ({
4829
5227
  open,
4830
5228
  onOpenChange,
@@ -4907,6 +5305,6 @@ var AvatarManager = ({
4907
5305
  );
4908
5306
  };
4909
5307
 
4910
- export { AuthFlow, AvatarManager, AvatarUploader, ChangePassword, EmailVerificationPage, ForgotPassword, LoginForm, OtpForm, PhoneInput, ProtectedRoute, PublicRoute, RegisterForm, ResetPassword, SignIn, SignOut, SignUp, UserButton, UserProfile, VerifyEmail };
5308
+ export { AuthFlow, AvatarManager, AvatarUploader, ChangePassword, EmailVerificationPage, ForgotPassword, LoginForm, OtpForm, PhoneInput, ProtectedRoute, PublicRoute, RegisterForm, ResetPassword, SignIn, SignOut, SignUp, SuperAdminSignIn, UserButton, UserProfile, VerifyEmail };
4911
5309
  //# sourceMappingURL=index.components.mjs.map
4912
5310
  //# sourceMappingURL=index.components.mjs.map