@sanvika/auth 2.10.0 → 2.10.1

package/dist/index.js

@@ -882,11 +882,11 @@ function SanvikaAccountButton(props) {
 }
 
 // SanvikaAdminLogin.jsx
-import { useState as useState3, useEffect as useEffect3 } from "react";
+import { useState as useState4, useEffect as useEffect4 } from "react";
 import { useRouter } from "next/navigation";
 
 // MobilePolicyPhoneInput.jsx
-import PhoneInput, { formatPhoneNumberIntl } from "react-phone-number-input";
+import PhoneInput from "react-phone-number-input";
 import flags from "react-phone-number-input/flags";
 import en from "react-phone-number-input/locale/en.json";
 import { parsePhoneNumber } from "libphonenumber-js/min";
@@ -924,6 +924,12 @@ function isCountryLocked(config) {
   const list = countriesForPolicy(config);
   return Array.isArray(list) && list.length === 1;
 }
+function countryOptionsOrderForPolicy(config) {
+  const list = countriesForPolicy(config);
+  if (Array.isArray(list) && list.length <= 1) return void 0;
+  const top = defaultCountryForPolicy(config);
+  return top ? [top, "|"] : void 0;
+}
 function toPhoneInputValue(raw, config) {
   if (!raw) return void 0;
   const s = String(raw).trim();
@@ -934,14 +940,179 @@ function toPhoneInputValue(raw, config) {
   return `+${digits}`;
 }
 
+// PolicySearchableCountrySelect.jsx
+import { useEffect as useEffect3, useMemo as useMemo2, useRef as useRef2, useState as useState3 } from "react";
+import { getCountryCallingCode } from "react-phone-number-input";
+
+// unicodeCountryFlag.js
+function unicodeCountryFlag(countryCode) {
+  if (!countryCode || countryCode === "ZZ" || countryCode.length !== 2) return "";
+  const upper = countryCode.toUpperCase();
+  if (!/^[A-Z]{2}$/.test(upper)) return "";
+  return String.fromCodePoint(
+    ...[...upper].map((char) => 127397 + char.charCodeAt(0))
+  );
+}
+
+// PolicySearchableCountrySelect.jsx
+import { jsx as jsx3, jsxs as jsxs2 } from "react/jsx-runtime";
+function dialCodeFor(country) {
+  if (!country) return "";
+  try {
+    return `+${getCountryCallingCode(country)}`;
+  } catch {
+    return "";
+  }
+}
+function countryWords(label) {
+  return String(label || "").toLowerCase().split(/[\s,().-]+/).filter(Boolean);
+}
+function matchScore(label, q, code, dialDigits, qDigits) {
+  const normalized = String(label || "").toLowerCase();
+  if (normalized.startsWith(q)) return 0;
+  if (countryWords(label).some((word) => word.startsWith(q))) return 1;
+  if (code.startsWith(q)) return 2;
+  if (qDigits && dialDigits.startsWith(qDigits)) return 3;
+  return -1;
+}
+function PolicySearchableCountrySelect({
+  value,
+  onChange,
+  options,
+  disabled,
+  readOnly
+}) {
+  const [open, setOpen] = useState3(false);
+  const [query, setQuery] = useState3("");
+  const rootRef = useRef2(null);
+  const searchRef = useRef2(null);
+  const selectable = useMemo2(
+    () => options.filter((o) => !o.divider && o.value),
+    [options]
+  );
+  const filtered = useMemo2(() => {
+    const q = query.trim().toLowerCase();
+    if (!q) return selectable;
+    const qDigits = q.replace(/\D/g, "");
+    return selectable.map((o) => ({
+      option: o,
+      score: matchScore(
+        o.label,
+        q,
+        (o.value || "").toLowerCase(),
+        dialCodeFor(o.value).replace(/\D/g, ""),
+        qDigits
+      )
+    })).filter((row) => row.score >= 0).sort((a, b) => a.score - b.score || a.option.label.localeCompare(b.option.label)).map((row) => row.option);
+  }, [query, selectable]);
+  useEffect3(() => {
+    if (!open) return void 0;
+    const onDoc = (event) => {
+      if (rootRef.current && !rootRef.current.contains(event.target)) {
+        setOpen(false);
+      }
+    };
+    document.addEventListener("click", onDoc);
+    return () => document.removeEventListener("click", onDoc);
+  }, [open]);
+  useEffect3(() => {
+    if (!open) return;
+    setQuery("");
+    requestAnimationFrame(() => {
+      var _a;
+      return (_a = searchRef.current) == null ? void 0 : _a.focus();
+    });
+  }, [open]);
+  const locked = disabled || readOnly;
+  const flag = value ? unicodeCountryFlag(value) : "\u{1F310}";
+  const dial = dialCodeFor(value);
+  const pick = (code) => {
+    if (!code || code === value) {
+      setOpen(false);
+      setQuery("");
+      return;
+    }
+    onChange(code);
+    setOpen(false);
+    setQuery("");
+  };
+  return /* @__PURE__ */ jsx3("div", { className: "PhoneInputCountry", children: /* @__PURE__ */ jsxs2("div", { className: "sa-country-picker", ref: rootRef, children: [
+    /* @__PURE__ */ jsxs2(
+      "button",
+      {
+        type: "button",
+        className: "sa-country-picker__trigger",
+        disabled: locked,
+        "aria-expanded": open,
+        "aria-haspopup": "listbox",
+        "aria-label": value ? `Country ${value}` : "Select country",
+        onClick: (event) => {
+          event.stopPropagation();
+          if (!locked) setOpen((v) => !v);
+        },
+        children: [
+          /* @__PURE__ */ jsx3("span", { className: "sa-country-picker__flag", "aria-hidden": "true", children: flag }),
+          dial ? /* @__PURE__ */ jsx3("span", { className: "sa-country-picker__dial", children: dial }) : null,
+          !locked ? /* @__PURE__ */ jsx3("span", { className: "sa-country-picker__chev", "aria-hidden": "true", children: "\u25BE" }) : null
+        ]
+      }
+    ),
+    open && !locked ? /* @__PURE__ */ jsxs2(
+      "div",
+      {
+        className: "sa-country-picker__panel",
+        role: "listbox",
+        onMouseDown: (event) => event.stopPropagation(),
+        children: [
+          /* @__PURE__ */ jsx3(
+            "input",
+            {
+              ref: searchRef,
+              type: "search",
+              className: "sa-country-picker__search",
+              placeholder: "Search country",
+              value: query,
+              onChange: (e) => setQuery(e.target.value),
+              "aria-label": "Search country",
+              autoComplete: "off"
+            }
+          ),
+          /* @__PURE__ */ jsxs2("ul", { className: "sa-country-picker__list", children: [
+            filtered.map((o) => /* @__PURE__ */ jsx3("li", { children: /* @__PURE__ */ jsxs2(
+              "button",
+              {
+                type: "button",
+                role: "option",
+                "aria-selected": o.value === value,
+                className: `sa-country-picker__option${o.value === value ? " sa-country-picker__option--active" : ""}`,
+                onMouseDown: (event) => {
+                  event.preventDefault();
+                  event.stopPropagation();
+                  pick(o.value);
+                },
+                children: [
+                  /* @__PURE__ */ jsx3("span", { className: "sa-country-picker__option-flag", "aria-hidden": "true", children: unicodeCountryFlag(o.value) }),
+                  /* @__PURE__ */ jsx3("span", { className: "sa-country-picker__name", children: o.label }),
+                  /* @__PURE__ */ jsx3("span", { className: "sa-country-picker__code", children: dialCodeFor(o.value) })
+                ]
+              }
+            ) }, o.value)),
+            !filtered.length ? /* @__PURE__ */ jsx3("li", { className: "sa-country-picker__empty", children: "No matches" }) : null
+          ] })
+        ]
+      }
+    ) : null
+  ] }) });
+}
+
 // MobilePolicyPhoneInput.jsx
 import "react-phone-number-input/style.css";
 
 // MobilePolicyPhoneInput.css
-styleInject(".sa-phone-field {\n  margin-bottom: 16px;\n}\n.sa-phone-input {\n  display: block;\n}\n.sa-phone-input .PhoneInput {\n  display: flex;\n  align-items: stretch;\n  border-radius: 8px;\n  overflow: hidden;\n  border: 1px solid #dddddd;\n  background: #ffffff;\n}\n.sa-phone-input--dark .PhoneInput {\n  border-color: #333333;\n  background: #222222;\n}\n.sa-phone-input .PhoneInputCountry {\n  align-self: stretch;\n  display: flex;\n  align-items: center;\n  padding: 0 10px;\n  margin: 0;\n  border-right: 1px solid #dddddd;\n  background: #f5f5f5;\n}\n.sa-phone-input--dark .PhoneInputCountry {\n  border-right-color: #333333;\n  background: #2a2a2a;\n}\n.sa-phone-input .PhoneInputCountrySelect {\n  font-size: 14px;\n  cursor: pointer;\n  color: #222222;\n  max-width: 120px;\n}\n.sa-phone-input--dark .PhoneInputCountrySelect {\n  color: #eeeeee;\n  background: #2a2a2a;\n}\n.sa-phone-input .PhoneInputCountrySelect:disabled {\n  cursor: default;\n  opacity: 0.85;\n}\n.sa-phone-input .PhoneInputCountryIcon {\n  width: 1.5em;\n  height: 1em;\n  box-shadow: none;\n  border: none;\n}\n.sa-phone-input .PhoneInputCountryIcon--border {\n  box-shadow: 0 0 0 1px rgba(0, 0, 0, 0.08);\n}\n.sa-phone-input .PhoneInputInput {\n  flex: 1;\n  min-width: 0;\n  border: none;\n  outline: none;\n  padding: 10px 12px;\n  font-size: 15px;\n  background: transparent;\n  color: #222222;\n}\n.sa-phone-input--dark .PhoneInputInput {\n  color: #ffffff;\n}\n.sa-phone-input .PhoneInputInput::placeholder {\n  color: #999999;\n}\n.sa-phone-input--dark .PhoneInputInput::placeholder {\n  color: #666666;\n}\n.sa-phone-preview {\n  display: flex;\n  flex-wrap: wrap;\n  align-items: center;\n  gap: 6px 10px;\n  margin-top: 8px;\n  padding: 8px 10px;\n  border-radius: 6px;\n  font-size: 12px;\n  background: #f0f7ff;\n  border: 1px solid #cce4ff;\n}\n.sa-phone-preview--dark {\n  background: #1a2433;\n  border-color: #2a3f5f;\n}\n.sa-phone-preview__label {\n  font-weight: 600;\n  color: #555555;\n  text-transform: uppercase;\n  letter-spacing: 0.04em;\n  font-size: 10px;\n}\n.sa-phone-preview--dark .sa-phone-preview__label {\n  color: #8899aa;\n}\n.sa-phone-preview__value {\n  color: #0984e3;\n  font-weight: 500;\n}\n.sa-phone-preview--dark .sa-phone-preview__value {\n  color: #88c5ff;\n}\n.sa-phone-preview__e164 {\n  font-family:\n    ui-monospace,\n    SFMono-Regular,\n    Menlo,\n    monospace;\n  color: #333333;\n  background: rgba(0, 0, 0, 0.05);\n  padding: 2px 6px;\n  border-radius: 4px;\n}\n.sa-phone-preview--dark .sa-phone-preview__e164 {\n  color: #cccccc;\n  background: rgba(255, 255, 255, 0.06);\n}\n.sa-phone-input--modal .PhoneInputCountrySelect {\n  max-width: 100px;\n}\n");
+styleInject(".sa-phone-field {\n  margin-bottom: 16px;\n}\n.sa-phone-input {\n  display: block;\n}\n.sa-phone-input .PhoneInput {\n  display: flex;\n  align-items: stretch;\n  border-radius: 8px;\n  overflow: hidden;\n  border: 1px solid #dddddd;\n  background: #ffffff;\n}\n.sa-phone-input--searchable-country .PhoneInput {\n  overflow: visible;\n}\n.sa-phone-input--dark .PhoneInput {\n  border-color: #333333;\n  background: #222222;\n}\n.sa-phone-input .PhoneInputCountry {\n  position: relative;\n  flex: 0 0 auto;\n  align-self: stretch;\n  display: flex;\n  align-items: center;\n  justify-content: center;\n  margin: 0;\n  min-width: 5.25rem;\n  max-width: 6.75rem;\n  border-right: 1px solid #dddddd;\n  background: #f5f5f5;\n}\n.sa-phone-input--dark .PhoneInputCountry {\n  border-right-color: #333333;\n  background: #2a2a2a;\n}\n.sa-phone-input--searchable-country .PhoneInputCountryIcon,\n.sa-phone-input--searchable-country .PhoneInputCountryIconUnicode,\n.sa-phone-input--searchable-country .PhoneInputCountrySelectArrow {\n  display: none !important;\n}\n.sa-phone-input .PhoneInputInput {\n  flex: 1 1 auto;\n  min-width: 0;\n  width: 100%;\n  border: none;\n  outline: none;\n  padding: 10px 12px;\n  font-size: 15px;\n  background: transparent;\n  color: #222222;\n}\n.sa-phone-input--dark .PhoneInputInput {\n  color: #ffffff;\n}\n.sa-phone-input .PhoneInputInput::placeholder {\n  color: #999999;\n}\n.sa-phone-input--dark .PhoneInputInput::placeholder {\n  color: #666666;\n}\n.sa-country-picker {\n  position: relative;\n  width: 100%;\n  height: 100%;\n  min-height: 42px;\n}\n.sa-country-picker__trigger {\n  display: flex;\n  align-items: center;\n  justify-content: center;\n  gap: 4px;\n  width: 100%;\n  height: 100%;\n  min-height: 42px;\n  padding: 0 8px;\n  margin: 0;\n  border: none;\n  background: transparent;\n  cursor: pointer;\n  color: inherit;\n  font: inherit;\n}\n.sa-country-picker__trigger:disabled {\n  cursor: default;\n  opacity: 0.65;\n}\n.sa-country-picker__flag {\n  font-size: 1.15rem;\n  line-height: 1;\n  flex-shrink: 0;\n}\n.sa-country-picker__dial {\n  font-size: 13px;\n  font-weight: 600;\n  white-space: nowrap;\n  flex-shrink: 0;\n}\n.sa-country-picker__chev {\n  font-size: 10px;\n  opacity: 0.7;\n  flex-shrink: 0;\n  margin-left: 1px;\n}\n.sa-country-picker__panel {\n  position: absolute;\n  top: calc(100% + 4px);\n  left: 0;\n  z-index: 50;\n  width: min(20rem, calc(100vw - 2rem));\n  max-height: min(20rem, 55vh);\n  display: flex;\n  flex-direction: column;\n  border-radius: 10px;\n  border: 1px solid #dddddd;\n  background: #ffffff;\n  box-shadow: 0 8px 24px rgba(0, 0, 0, 0.18);\n  overflow: hidden;\n}\n.sa-phone-input--dark .sa-country-picker__panel {\n  border-color: #444444;\n  background: #1e1e1e;\n  box-shadow: 0 8px 24px rgba(0, 0, 0, 0.45);\n}\n.sa-country-picker__search {\n  flex-shrink: 0;\n  width: 100%;\n  padding: 10px 12px;\n  border: none;\n  border-bottom: 1px solid #eeeeee;\n  outline: none;\n  font-size: 14px;\n  background: #fafafa;\n  color: #222222;\n}\n.sa-phone-input--dark .sa-country-picker__search {\n  border-bottom-color: #333333;\n  background: #252525;\n  color: #ffffff;\n}\n.sa-country-picker__list {\n  list-style: none;\n  margin: 0;\n  padding: 4px 0;\n  overflow-y: auto;\n  flex: 1;\n  min-height: 0;\n}\n.sa-country-picker__option {\n  display: flex;\n  align-items: center;\n  gap: 8px;\n  width: 100%;\n  padding: 8px 12px;\n  border: none;\n  background: transparent;\n  cursor: pointer;\n  text-align: left;\n  font-size: 14px;\n  color: #222222;\n}\n.sa-phone-input--dark .sa-country-picker__option {\n  color: #eeeeee;\n}\n.sa-country-picker__option:hover,\n.sa-country-picker__option--active {\n  background: #f0f4ff;\n}\n.sa-phone-input--dark .sa-country-picker__option:hover,\n.sa-phone-input--dark .sa-country-picker__option--active {\n  background: #2a3344;\n}\n.sa-country-picker__option-flag {\n  font-size: 1.1rem;\n  line-height: 1;\n  flex-shrink: 0;\n}\n.sa-country-picker__name {\n  flex: 1;\n  min-width: 0;\n  overflow: hidden;\n  text-overflow: ellipsis;\n  white-space: nowrap;\n}\n.sa-country-picker__code {\n  flex-shrink: 0;\n  font-size: 12px;\n  font-weight: 600;\n  color: #666666;\n}\n.sa-phone-input--dark .sa-country-picker__code {\n  color: #999999;\n}\n.sa-country-picker__empty {\n  padding: 12px;\n  font-size: 13px;\n  color: #888888;\n  text-align: center;\n}\n.sa-phone-preview {\n  display: flex;\n  flex-wrap: wrap;\n  align-items: center;\n  gap: 6px 10px;\n  margin-top: 8px;\n  padding: 8px 10px;\n  border-radius: 6px;\n  font-size: 12px;\n  background: #f0f7ff;\n  border: 1px solid #cce4ff;\n}\n.sa-phone-preview--dark {\n  background: #1a2433;\n  border-color: #2a3f5f;\n}\n.sa-phone-preview__label {\n  font-weight: 600;\n  color: #555555;\n  text-transform: uppercase;\n  letter-spacing: 0.04em;\n  font-size: 10px;\n}\n.sa-phone-preview--dark .sa-phone-preview__label {\n  color: #8899aa;\n}\n.sa-phone-preview__value {\n  color: #0984e3;\n  font-weight: 500;\n}\n.sa-phone-preview--dark .sa-phone-preview__value {\n  color: #88c5ff;\n}\n.sa-phone-preview__e164 {\n  font-family:\n    ui-monospace,\n    SFMono-Regular,\n    Menlo,\n    monospace;\n  color: #333333;\n  background: rgba(0, 0, 0, 0.05);\n  padding: 2px 6px;\n  border-radius: 4px;\n}\n.sa-phone-preview--dark .sa-phone-preview__e164 {\n  color: #cccccc;\n  background: rgba(255, 255, 255, 0.06);\n}\n");
 
 // MobilePolicyPhoneInput.jsx
-import { Fragment, jsx as jsx3, jsxs as jsxs2 } from "react/jsx-runtime";
+import { jsx as jsx4, jsxs as jsxs3 } from "react/jsx-runtime";
 function MobilePolicyPhoneInput({
   config,
   value,
@@ -949,53 +1120,58 @@ function MobilePolicyPhoneInput({
   theme = "dark",
   inputRef,
   id = "mobile-phone-input",
-  placeholder = "Enter phone number"
+  placeholder = "Enter phone number",
+  showPreview = true
 }) {
   const policy = mergeMobilePolicy(config);
   const countries = countriesForPolicy(config);
   const defaultCountry = defaultCountryForPolicy(config);
   const countryLocked = isCountryLocked(config);
-  let intlFormatted = "";
-  let e164Digits = "";
+  const countryOrder = countryOptionsOrderForPolicy(config);
+  let e164Display = "";
   if (value) {
     try {
-      intlFormatted = formatPhoneNumberIntl(value) || value;
       const parsed = parsePhoneNumber(value);
       if (parsed == null ? void 0 : parsed.isValid()) {
-        e164Digits = parsed.number.replace("+", "");
+        e164Display = parsed.number;
       } else {
-        e164Digits = normalizeMobileWithPolicy(value, policy) || String(value).replace(/\D/g, "");
+        const digits = normalizeMobileWithPolicy(value, policy) || String(value).replace(/\D/g, "");
+        e164Display = digits ? `+${digits}` : "";
       }
     } catch {
-      intlFormatted = value;
+      e164Display = "";
     }
   }
-  return /* @__PURE__ */ jsxs2("div", { className: "sa-phone-field", children: [
-    /* @__PURE__ */ jsx3(
+  return /* @__PURE__ */ jsxs3("div", { className: "sa-phone-field", children: [
+    /* @__PURE__ */ jsx4(
       "div",
       {
-        className: `sa-phone-input sa-phone-input--${theme}`,
+        className: `sa-phone-input sa-phone-input--${theme} sa-phone-input--searchable-country`,
         "data-theme": theme,
-        children: /* @__PURE__ */ jsx3(
+        children: /* @__PURE__ */ jsx4(
           PhoneInput,
           {
             id,
-            international: true,
+            international: false,
             countryCallingCodeEditable: false,
             defaultCountry,
             countries,
+            countryOptionsOrder: countryOrder,
+            addInternationalOption: false,
+            countrySelectComponent: PolicySearchableCountrySelect,
             flags,
             labels: en,
             value,
             onChange,
             placeholder,
             smartCaret: true,
+            inputRef,
+            focusInputOnCountrySelection: Boolean(inputRef),
             countrySelectProps: {
               unicodeFlags: true,
               ...countryLocked ? { disabled: true } : {}
             },
             numberInputProps: {
-              ref: inputRef,
               autoComplete: "tel",
               inputMode: "tel",
               "aria-label": "Phone number"
@@ -1004,14 +1180,10 @@ function MobilePolicyPhoneInput({
         )
       }
     ),
-    value && /* @__PURE__ */ jsxs2("div", { className: `sa-phone-preview sa-phone-preview--${theme}`, children: [
-      /* @__PURE__ */ jsx3("span", { className: "sa-phone-preview__label", children: "Formatted" }),
-      /* @__PURE__ */ jsx3("span", { className: "sa-phone-preview__value", children: intlFormatted }),
-      e164Digits ? /* @__PURE__ */ jsxs2(Fragment, { children: [
-        /* @__PURE__ */ jsx3("span", { className: "sa-phone-preview__label", children: "E.164" }),
-        /* @__PURE__ */ jsx3("span", { className: "sa-phone-preview__e164", children: e164Digits })
-      ] }) : null
-    ] })
+    showPreview && value && e164Display ? /* @__PURE__ */ jsxs3("div", { className: `sa-phone-preview sa-phone-preview--${theme}`, children: [
+      /* @__PURE__ */ jsx4("span", { className: "sa-phone-preview__label", children: "E.164" }),
+      /* @__PURE__ */ jsx4("span", { className: "sa-phone-preview__e164", children: e164Display })
+    ] }) : null
   ] });
 }
 
@@ -1071,7 +1243,7 @@ function mobilePlaceholder(config) {
 }
 
 // SanvikaAdminLogin.jsx
-import { jsx as jsx4, jsxs as jsxs3 } from "react/jsx-runtime";
+import { jsx as jsx5, jsxs as jsxs4 } from "react/jsx-runtime";
 var DEVICE_ID_KEY = "sanvika_admin_device_id";
 var ADMIN_MOBILE_POLICY = CLIENT_MOBILE_POLICIES.IN_10;
 function getDeviceId() {
@@ -1116,12 +1288,12 @@ function SanvikaAdminLogin({
 }) {
   const router = useRouter();
   const { isAuthenticated, loading, user, setAuth, clientId } = useSanvikaAuth();
-  const [phoneValue, setPhoneValue] = useState3(void 0);
-  const [password, setPassword] = useState3("");
-  const [error, setError] = useState3("");
-  const [submitting, setSubmitting] = useState3(false);
-  const [ready, setReady] = useState3(false);
-  useEffect3(() => {
+  const [phoneValue, setPhoneValue] = useState4(void 0);
+  const [password, setPassword] = useState4("");
+  const [error, setError] = useState4("");
+  const [submitting, setSubmitting] = useState4(false);
+  const [ready, setReady] = useState4(false);
+  useEffect4(() => {
     if (loading) return;
     if (isAuthenticated && (user == null ? void 0 : user.role) === "superadmin") {
       router.replace(dashboardPath);
@@ -1242,10 +1414,10 @@ function SanvikaAdminLogin({
     }
   };
   if (loading || !ready) {
-    return /* @__PURE__ */ jsx4("div", { style: S.page, children: /* @__PURE__ */ jsx4("div", { style: S.card, children: /* @__PURE__ */ jsx4("p", { style: S.subtitle, children: "Loading\u2026" }) }) });
+    return /* @__PURE__ */ jsx5("div", { style: S.page, children: /* @__PURE__ */ jsx5("div", { style: S.card, children: /* @__PURE__ */ jsx5("p", { style: S.subtitle, children: "Loading\u2026" }) }) });
   }
-  return /* @__PURE__ */ jsx4("div", { style: S.page, children: /* @__PURE__ */ jsxs3("div", { style: S.card, children: [
-    /* @__PURE__ */ jsx4(
+  return /* @__PURE__ */ jsx5("div", { style: S.page, children: /* @__PURE__ */ jsxs4("div", { style: S.card, children: [
+    /* @__PURE__ */ jsx5(
       "button",
       {
         style: S.closeBtn,
@@ -1254,15 +1426,15 @@ function SanvikaAdminLogin({
         children: "\u2715"
       }
     ),
-    /* @__PURE__ */ jsx4("div", { style: S.logo, children: "\u{1F6E1}\uFE0F" }),
-    /* @__PURE__ */ jsxs3("h1", { style: S.title, children: [
+    /* @__PURE__ */ jsx5("div", { style: S.logo, children: "\u{1F6E1}\uFE0F" }),
+    /* @__PURE__ */ jsxs4("h1", { style: S.title, children: [
       serviceName,
       " Admin"
     ] }),
-    /* @__PURE__ */ jsx4("p", { style: S.subtitle, children: "SuperAdmin access \u2014 Sanvika Accounts SSO" }),
-    /* @__PURE__ */ jsxs3("form", { onSubmit: handleLogin, style: S.form, autoComplete: "off", children: [
-      /* @__PURE__ */ jsx4("label", { style: S.label, htmlFor: "admin-mobile-phone", children: "Mobile Number" }),
-      /* @__PURE__ */ jsx4(
+    /* @__PURE__ */ jsx5("p", { style: S.subtitle, children: "SuperAdmin access \u2014 Sanvika Accounts SSO" }),
+    /* @__PURE__ */ jsxs4("form", { onSubmit: handleLogin, style: S.form, autoComplete: "off", children: [
+      /* @__PURE__ */ jsx5("label", { style: S.label, htmlFor: "admin-mobile-phone", children: "Mobile Number" }),
+      /* @__PURE__ */ jsx5(
         MobilePolicyPhoneInput,
         {
           config: ADMIN_MOBILE_POLICY,
@@ -1270,11 +1442,12 @@ function SanvikaAdminLogin({
           onChange: setPhoneValue,
           theme: "dark",
           id: "admin-mobile-phone",
-          placeholder: "Enter phone number"
+          placeholder: "Enter phone number",
+          showPreview: false
         }
       ),
-      /* @__PURE__ */ jsx4("label", { style: S.label, children: "Password" }),
-      /* @__PURE__ */ jsx4(
+      /* @__PURE__ */ jsx5("label", { style: S.label, children: "Password" }),
+      /* @__PURE__ */ jsx5(
         "input",
         {
           type: "password",
@@ -1286,7 +1459,7 @@ function SanvikaAdminLogin({
           autoComplete: "new-password"
         }
       ),
-      /* @__PURE__ */ jsx4(
+      /* @__PURE__ */ jsx5(
         "button",
         {
           type: "submit",
@@ -1296,7 +1469,7 @@ function SanvikaAdminLogin({
         }
       )
     ] }),
-    error && /* @__PURE__ */ jsx4("p", { style: S.error, children: error })
+    error && /* @__PURE__ */ jsx5("p", { style: S.error, children: error })
   ] }) });
 }
 var ADMIN_LOGIN_API_URL = authApiUrl(AUTH_API.LOGIN, DEFAULT_AUTH_URL);

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@sanvika/auth",
-  "version": "2.10.0",
+  "version": "2.10.1",
   "description": "Sanvika Auth SDK — React components/hooks + server-side token verification and user proxy",
   "type": "module",
   "main": "dist/index.js",