@quantaroute/checkout 1.1.1 → 1.2.1

package/dist/lib/index.d.ts

@@ -1,4 +1,3 @@
-import { CSSProperties } from 'react';
 import { default as default_2 } from 'react';
 
 /**
@@ -49,6 +48,8 @@ export declare interface AdministrativeInfo {
     max_population_density?: number;
 }
 
+declare type AnyStyle = any;
+
 /**
  * QuantaRoute Checkout Widget
  *
@@ -81,12 +82,12 @@ export declare interface CheckoutWidgetProps {
     defaultLng?: number;
     /** Color theme. Defaults to 'light'. */
     theme?: 'light' | 'dark';
-    /** CSS class name(s) to add to the root element. */
+    /** CSS class name(s) to add to the root element (web only). */
     className?: string;
-    /** Inline styles for the root element. */
-    style?: CSSProperties;
-    /** Map area height. Defaults to '380px'. */
-    mapHeight?: string;
+    /** Inline styles for the root element (CSSProperties on web, StyleProp<ViewStyle> on native). */
+    style?: AnyStyle;
+    /** Map area height. String on web ('380px'), number on native (380). Defaults to '380px' / 380. */
+    mapHeight?: string | number;
     /** Widget header title. Defaults to 'Add Delivery Address'. */
     title?: string;
     /**
@@ -211,7 +212,8 @@ export declare interface MapPinSelectorProps {
     onLocationConfirm: (lat: number, lng: number, digipin: string) => void;
     defaultLat?: number;
     defaultLng?: number;
-    mapHeight?: string;
+    /** Map height. String on web ('380px'), number on native (380). */
+    mapHeight?: string | number;
     theme?: 'light' | 'dark';
     /**
      * URL to an India boundary GeoJSON file (FeatureCollection).

package/dist/lib/quantaroute-checkout.es.js

@@ -1,5 +1,5 @@
 /*!
- * @quantaroute/checkout v1.1.1
+ * @quantaroute/checkout v1.2.0
  * (c) 2026 QuantaRoute – https://quantaroute.com
  * Released under the MIT License.
  *
@@ -7,10 +7,16 @@
  * (Apache 2.0 – © India Post, IIT Hyderabad, ISRO NRSC)
  * https://github.com/INDIAPOST-gov/digipin
  *
- * Peer dependencies (install separately):
- *   react >= 18.2.0
+ * Web peer dependencies (install separately):
+ *   react >= 18.0.0
  *   react-dom >= 18.2.0
  *   maplibre-gl >= 4.0.0
+ *
+ * Native peer dependencies (Expo / React Native):
+ *   react-native >= 0.72.0
+ *   expo >= 49.0.0
+ *   expo-osm-sdk >= 2.0.0
+ *   expo-location >= 17.0.0
  */
 import { jsxs, jsx, Fragment } from "react/jsx-runtime";
 import { useState, useCallback, useRef, useEffect, useReducer, useMemo } from "react";
@@ -445,6 +451,14 @@ const MapPinSelector = ({
   ] });
 };
 const DEFAULT_BASE_URL = "https://api.quantaroute.com";
+function makeTimeoutSignal(ms) {
+  if (typeof AbortSignal !== "undefined" && typeof AbortSignal.timeout === "function") {
+    return AbortSignal.timeout(ms);
+  }
+  const ctrl = new AbortController();
+  setTimeout(() => ctrl.abort(), ms);
+  return ctrl.signal;
+}
 async function lookupLocation(lat, lng, apiKey, baseUrl = DEFAULT_BASE_URL) {
   const url = `${baseUrl.replace(/\/$/, "")}/v1/location/lookup`;
   let res;
@@ -456,11 +470,10 @@ async function lookupLocation(lat, lng, apiKey, baseUrl = DEFAULT_BASE_URL) {
         "x-api-key": apiKey
       },
       body: JSON.stringify({ latitude: lat, longitude: lng }),
-      signal: AbortSignal.timeout(15e3)
-      // 15s timeout
+      signal: makeTimeoutSignal(15e3)
     });
   } catch (err) {
-    if (err instanceof Error && err.name === "TimeoutError") {
+    if (err instanceof Error && (err.name === "TimeoutError" || err.name === "AbortError")) {
       throw new Error("Request timed out. Check your internet connection.");
     }
     throw new Error(`Network error: ${err instanceof Error ? err.message : String(err)}`);
@@ -496,11 +509,10 @@ async function reverseGeocode(digipin, apiKey, baseUrl = DEFAULT_BASE_URL) {
         "x-api-key": apiKey
       },
       body: JSON.stringify({ digipin }),
-      signal: AbortSignal.timeout(15e3)
-      // 15s timeout
+      signal: makeTimeoutSignal(15e3)
     });
   } catch (err) {
-    if (err instanceof Error && err.name === "TimeoutError") {
+    if (err instanceof Error && (err.name === "TimeoutError" || err.name === "AbortError")) {
       throw new Error("Request timed out. Check your internet connection.");
     }
     throw new Error(`Network error: ${err instanceof Error ? err.message : String(err)}`);

package/dist/lib/quantaroute-checkout.umd.js

@@ -1,7 +1,7 @@
-!function(e,r){"object"==typeof exports&&"undefined"!=typeof module?r(exports,require("react/jsx-runtime"),require("react"),require("maplibre-gl")):"function"==typeof define&&define.amd?define(["exports","react/jsx-runtime","react","maplibre-gl"],r):r((e="undefined"!=typeof globalThis?globalThis:e||self).QuantaRouteCheckout={},e.ReactJSXRuntime,e.React,e.maplibregl)}(this,function(e,r,a,n){"use strict"
+!function(e,r){"object"==typeof exports&&"undefined"!=typeof module?r(exports,require("react/jsx-runtime"),require("react"),require("maplibre-gl")):"function"==typeof define&&define.amd?define(["exports","react/jsx-runtime","react","maplibre-gl"],r):r((e="undefined"!=typeof globalThis?globalThis:e||self).QuantaRouteCheckout={},e.ReactJSXRuntime,e.React,e.maplibregl)}(this,function(e,r,n,t){"use strict"
 
 ;/*!
- * @quantaroute/checkout v1.1.1
+ * @quantaroute/checkout v1.2.0
  * (c) 2026 QuantaRoute – https://quantaroute.com
  * Released under the MIT License.
  *
@@ -9,80 +9,88 @@
  * (Apache 2.0 – © India Post, IIT Hyderabad, ISRO NRSC)
  * https://github.com/INDIAPOST-gov/digipin
  *
- * Peer dependencies (install separately):
- *   react >= 18.2.0
+ * Web peer dependencies (install separately):
+ *   react >= 18.0.0
  *   react-dom >= 18.2.0
  *   maplibre-gl >= 4.0.0
- */const t=[["F","C","9","8"],["J","3","2","7"],["K","4","5","6"],["L","M","P","T"]],i={minLat:2.5,maxLat:38.5,minLon:63.5,maxLon:99.5}
+ *
+ * Native peer dependencies (Expo / React Native):
+ *   react-native >= 0.72.0
+ *   expo >= 49.0.0
+ *   expo-osm-sdk >= 2.0.0
+ *   expo-location >= 17.0.0
+ */const a=[["F","C","9","8"],["J","3","2","7"],["K","4","5","6"],["L","M","P","T"]],i={minLat:2.5,maxLat:38.5,minLon:63.5,maxLon:99.5}
 function o(e,r){if(e<i.minLat||e>i.maxLat)throw new Error(`Latitude ${e} out of range. Must be between ${i.minLat} and ${i.maxLat}`)
 if(r<i.minLon||r>i.maxLon)throw new Error(`Longitude ${r} out of range. Must be between ${i.minLon} and ${i.maxLon}`)
-let a=i.minLat,n=i.maxLat,o=i.minLon,l=i.maxLon,s=""
-for(let i=1;i<=10;i++){const d=(n-a)/4,c=(l-o)/4
-let u=3-Math.floor((e-a)/d),h=Math.floor((r-o)/c)
-u=Math.max(0,Math.min(u,3)),h=Math.max(0,Math.min(h,3)),s+=t[u][h],3!==i&&6!==i||(s+="-"),n=a+d*(4-u),a+=d*(3-u),o+=c*h,l=o+c}return s}function l(e){const r=e.replace(/-/g,"")
+let n=i.minLat,t=i.maxLat,o=i.minLon,l=i.maxLon,s=""
+for(let i=1;i<=10;i++){const d=(t-n)/4,c=(l-o)/4
+let u=3-Math.floor((e-n)/d),h=Math.floor((r-o)/c)
+u=Math.max(0,Math.min(u,3)),h=Math.max(0,Math.min(h,3)),s+=a[u][h],3!==i&&6!==i||(s+="-"),t=n+d*(4-u),n+=d*(3-u),o+=c*h,l=o+c}return s}function l(e){const r=e.replace(/-/g,"")
 if(10!==r.length)throw new Error("Invalid DIGIPIN: must be 10 characters (excluding dashes)")
-let a=i.minLat,n=i.maxLat,o=i.minLon,l=i.maxLon
+let n=i.minLat,t=i.maxLat,o=i.minLon,l=i.maxLon
 for(let i=0;i<10;i++){const e=r[i]
 let s=!1,d=-1,c=-1
-for(let r=0;r<4;r++){for(let a=0;a<4;a++)if(t[r][a]===e){d=r,c=a,s=!0
+for(let r=0;r<4;r++){for(let n=0;n<4;n++)if(a[r][n]===e){d=r,c=n,s=!0
 break}if(s)break}if(!s)throw new Error(`Invalid character in DIGIPIN: '${e}'`)
-const u=(n-a)/4,h=(l-o)/4,p=o+h*(c+1)
-a=n-u*(d+1),n-=u*d,o+=h*c,l=p}return{latitude:((a+n)/2).toFixed(6),longitude:((o+l)/2).toFixed(6)}}function s(e,r){return e>=i.minLat&&e<=i.maxLat&&r>=i.minLon&&r<=i.maxLon}function d(){const[e,r]=a.useState({loading:!1,error:null})
-return{...e,locate:a.useCallback(e=>{navigator.geolocation?(r({loading:!0,error:null}),navigator.geolocation.getCurrentPosition(({coords:a})=>{r({loading:!1,error:null}),e(a.latitude,a.longitude)},e=>{let a="Unable to get location."
-e.code===e.PERMISSION_DENIED?a="Location permission denied. Please enable it in browser settings.":e.code===e.POSITION_UNAVAILABLE?a="Location unavailable. Try again or place the pin manually.":e.code===e.TIMEOUT&&(a="Location request timed out. Try again."),r({loading:!1,error:a})},{enableHighAccuracy:!0,timeout:12e3,maximumAge:0})):r({loading:!1,error:"Geolocation is not supported by your browser."})},[]),clearError:a.useCallback(()=>{r(e=>({...e,error:null}))},[])}}function c(e,r){if(!s(e,r))return null
-try{return o(e,r)}catch{return null}}const u=({onLocationConfirm:e,defaultLat:t,defaultLng:i,mapHeight:o="380px",theme:l="light",indiaBoundaryUrl:s})=>{const u=a.useRef(null),h=a.useRef(null),p=a.useRef(null),m=t??13.00427,g=i??77.589291,f=void 0!==t&&void 0!==i,[q,b]=a.useState(m),[y,N]=a.useState(g),[v,_]=a.useState(()=>c(m,g)),[w,k]=a.useState(!1),{loading:x,error:L,locate:C,clearError:E}=d(),S=a.useCallback((e,r)=>{_(c(e,r))},[])
-a.useEffect(()=>{if(!u.current)return
-const e=s?fetch(s).then(e=>e.ok?e.json():null).catch(()=>null):Promise.resolve(null),r=f?18:9,a=new n.Map({container:u.current,style:"https://basemaps.cartocdn.com/gl/positron-gl-style/style.json",center:[g,m],zoom:r,minZoom:6,attributionControl:!1,touchZoomRotate:!0})
-return a.addControl(new n.AttributionControl({compact:!0,customAttribution:'© <a href="https://www.openstreetmap.org/copyright" target="_blank" rel="noopener">OpenStreetMap</a> contributors &nbsp;© <a href="https://carto.com/attributions" target="_blank" rel="noopener">CARTO</a>'}),"bottom-right"),a.addControl(new n.NavigationControl({showCompass:!1}),"top-right"),a.on("load",()=>{k(!0),e.then(e=>{if(e&&a.isStyleLoaded())try{a.addSource("india-boundary",{type:"geojson",data:e}),a.addLayer({id:"india-boundary-line",type:"line",source:"india-boundary",paint:{"line-color":"#94a3b8","line-width":1.5,"line-opacity":.65}})}catch{}})
+const u=(t-n)/4,h=(l-o)/4,p=o+h*(c+1)
+n=t-u*(d+1),t-=u*d,o+=h*c,l=p}return{latitude:((n+t)/2).toFixed(6),longitude:((o+l)/2).toFixed(6)}}function s(e,r){return e>=i.minLat&&e<=i.maxLat&&r>=i.minLon&&r<=i.maxLon}function d(){const[e,r]=n.useState({loading:!1,error:null})
+return{...e,locate:n.useCallback(e=>{navigator.geolocation?(r({loading:!0,error:null}),navigator.geolocation.getCurrentPosition(({coords:n})=>{r({loading:!1,error:null}),e(n.latitude,n.longitude)},e=>{let n="Unable to get location."
+e.code===e.PERMISSION_DENIED?n="Location permission denied. Please enable it in browser settings.":e.code===e.POSITION_UNAVAILABLE?n="Location unavailable. Try again or place the pin manually.":e.code===e.TIMEOUT&&(n="Location request timed out. Try again."),r({loading:!1,error:n})},{enableHighAccuracy:!0,timeout:12e3,maximumAge:0})):r({loading:!1,error:"Geolocation is not supported by your browser."})},[]),clearError:n.useCallback(()=>{r(e=>({...e,error:null}))},[])}}function c(e,r){if(!s(e,r))return null
+try{return o(e,r)}catch{return null}}const u=({onLocationConfirm:e,defaultLat:a,defaultLng:i,mapHeight:o="380px",theme:l="light",indiaBoundaryUrl:s})=>{const u=n.useRef(null),h=n.useRef(null),p=n.useRef(null),m=a??13.00427,f=i??77.589291,g=void 0!==a&&void 0!==i,[b,q]=n.useState(m),[y,N]=n.useState(f),[v,_]=n.useState(()=>c(m,f)),[w,k]=n.useState(!1),{loading:x,error:L,locate:C,clearError:E}=d(),A=n.useCallback((e,r)=>{_(c(e,r))},[])
+n.useEffect(()=>{if(!u.current)return
+const e=s?fetch(s).then(e=>e.ok?e.json():null).catch(()=>null):Promise.resolve(null),r=g?18:9,n=new t.Map({container:u.current,style:"https://basemaps.cartocdn.com/gl/positron-gl-style/style.json",center:[f,m],zoom:r,minZoom:6,attributionControl:!1,touchZoomRotate:!0})
+return n.addControl(new t.AttributionControl({compact:!0,customAttribution:'© <a href="https://www.openstreetmap.org/copyright" target="_blank" rel="noopener">OpenStreetMap</a> contributors &nbsp;© <a href="https://carto.com/attributions" target="_blank" rel="noopener">CARTO</a>'}),"bottom-right"),n.addControl(new t.NavigationControl({showCompass:!1}),"top-right"),n.on("load",()=>{k(!0),e.then(e=>{if(e&&n.isStyleLoaded())try{n.addSource("india-boundary",{type:"geojson",data:e}),n.addLayer({id:"india-boundary-line",type:"line",source:"india-boundary",paint:{"line-color":"#94a3b8","line-width":1.5,"line-opacity":.65}})}catch{}})
 const r=function(){const e=document.createElement("div")
-return e.className="qr-pin",e.setAttribute("aria-label","Drag to adjust your location"),e.style.width="40px",e.style.height="52px",e.innerHTML='\n    <svg\n      class="qr-pin__svg"\n      width="40"\n      height="52"\n      viewBox="0 0 40 52"\n      overflow="visible"\n      fill="none"\n      xmlns="http://www.w3.org/2000/svg"\n      aria-hidden="true"\n    >\n      <defs>\n        \x3c!--\n          The filter region must be generous enough to contain the shadow blur.\n          stdDeviation=3 → ~9px blur radius; our region extends 50% on each side.\n          overflow="visible" on the <svg> lets it paint outside the viewport.\n        --\x3e\n        <filter id="qr-pin-shadow" x="-60%" y="-40%" width="220%" height="220%">\n          <feDropShadow dx="0" dy="3" stdDeviation="3.5"\n            flood-color="#000" flood-opacity="0.28"/>\n        </filter>\n      </defs>\n\n      \x3c!-- Teardrop body — tip is at (20, 52) = bottom-center of the SVG --\x3e\n      <path\n        d="M20 0C9.402 0 0 9.402 0 20C0 34 20 52 20 52S40 34 40 20C40 9.402 30.598 0 20 0Z"\n        fill="#0ea5e9"\n        filter="url(#qr-pin-shadow)"\n      />\n      \x3c!-- Dot inside the pin --\x3e\n      <circle cx="20" cy="20" r="9" fill="white"/>\n      <circle cx="20" cy="20" r="5" fill="#0ea5e9"/>\n    </svg>\n\n    \x3c!--\n      Pulse ring — position: absolute inside .qr-pin (position: relative).\n      bottom: -(height/2)  →  bottom: -10px  centres the 20×20 circle\n      exactly at y = PIN_H = 52px = the pin tip coordinate.\n    --\x3e\n    <div class="qr-pin__pulse" aria-hidden="true"></div>\n  ',e}(),t=new n.Marker({element:r,draggable:!0,anchor:"bottom"}).setLngLat([g,m]).addTo(a)
-t.on("drag",()=>{const e=t.getLngLat()
-b(e.lat),N(e.lng),S(e.lat,e.lng)}),t.on("dragend",()=>{const e=t.getLngLat()
-a.easeTo({center:[e.lng,e.lat],duration:250})}),p.current=t}),a.on("click",e=>{var r
-const n=e.lngLat
-null==(r=p.current)||r.setLngLat([n.lng,n.lat]),b(n.lat),N(n.lng),S(n.lat,n.lng),a.easeTo({center:[n.lng,n.lat],duration:200})}),h.current=a,()=>{a.remove(),h.current=null,p.current=null}},[])
-const A=a.useCallback(()=>{E(),C((e,r)=>{var a
-b(e),N(r),S(e,r),h.current&&h.current.flyTo({center:[r,e],zoom:18,duration:1400,essential:!0}),null==(a=p.current)||a.setLngLat([r,e])})},[C,E,S]),T=a.useCallback(()=>{v&&e(q,y,v)},[q,y,v,e]),I=null!==v,M=I&&w
-return r.jsxs("div",{className:"qr-map-wrapper",children:[r.jsxs("div",{className:"qr-step-header",children:[r.jsx("div",{className:"qr-step-badge",children:"1"}),r.jsxs("div",{className:"qr-step-text",children:[r.jsx("span",{className:"qr-step-title",children:"Pin Your Location"}),r.jsx("span",{className:"qr-step-sub",children:"Tap the map or drag the pin to your exact home / office"})]})]}),r.jsxs("div",{className:"qr-map-outer",style:{height:o},children:[r.jsx("div",{ref:u,className:"qr-map-canvas"}),v&&r.jsxs("div",{className:"qr-digipin-badge","aria-live":"polite","aria-label":`DigiPin: ${v}`,children:[r.jsx("span",{className:"qr-digipin-badge__label",children:"DigiPin"}),r.jsx("span",{className:"qr-digipin-badge__code",children:v})]}),!I&&w&&r.jsx("div",{className:"qr-map-notice",role:"status",children:"Move map to India to get a DigiPin"}),r.jsx("button",{className:"qr-locate-btn"+(x?" qr-locate-btn--loading":""),onClick:A,disabled:x,title:"Use my current location","aria-label":"Use my current location",type:"button",children:x?r.jsx("span",{className:"qr-spinner","aria-hidden":"true"}):r.jsxs("svg",{"aria-hidden":"true",viewBox:"0 0 24 24",fill:"none",stroke:"currentColor",strokeWidth:"2",strokeLinecap:"round",strokeLinejoin:"round",children:[r.jsx("circle",{cx:"12",cy:"12",r:"3",fill:"currentColor",stroke:"none"}),r.jsx("circle",{cx:"12",cy:"12",r:"7"}),r.jsx("path",{d:"M12 2v3M12 19v3M2 12h3M19 12h3"})]})}),L&&r.jsxs("div",{className:"qr-geo-error",role:"alert",children:[r.jsx("span",{children:L}),r.jsx("button",{type:"button",className:"qr-geo-error__dismiss",onClick:E,"aria-label":"Dismiss error",children:"×"})]})]}),w&&r.jsxs("div",{className:"qr-coords-strip","aria-label":"Current pin coordinates",children:[r.jsxs("span",{children:[q.toFixed(5),"° N"]}),r.jsx("span",{className:"qr-coords-sep",children:"·"}),r.jsxs("span",{children:[y.toFixed(5),"° E"]})]}),r.jsxs("div",{className:"qr-map-actions",children:[r.jsxs("button",{type:"button",className:"qr-btn qr-btn--primary qr-btn--full",onClick:T,disabled:!M,children:["Confirm Location",r.jsx("svg",{"aria-hidden":"true",viewBox:"0 0 24 24",fill:"none",stroke:"currentColor",strokeWidth:"2.5",strokeLinecap:"round",strokeLinejoin:"round",children:r.jsx("path",{d:"M5 12h14M12 5l7 7-7 7"})})]}),!I&&w&&r.jsx("p",{className:"qr-map-hint",children:"Move the pin to a location in India to continue"})]})]})},h="https://api.quantaroute.com"
-async function p(e,r,a,n=h){const t=`${n.replace(/\/$/,"")}/v1/location/lookup`
+return e.className="qr-pin",e.setAttribute("aria-label","Drag to adjust your location"),e.style.width="40px",e.style.height="52px",e.innerHTML='\n    <svg\n      class="qr-pin__svg"\n      width="40"\n      height="52"\n      viewBox="0 0 40 52"\n      overflow="visible"\n      fill="none"\n      xmlns="http://www.w3.org/2000/svg"\n      aria-hidden="true"\n    >\n      <defs>\n        \x3c!--\n          The filter region must be generous enough to contain the shadow blur.\n          stdDeviation=3 → ~9px blur radius; our region extends 50% on each side.\n          overflow="visible" on the <svg> lets it paint outside the viewport.\n        --\x3e\n        <filter id="qr-pin-shadow" x="-60%" y="-40%" width="220%" height="220%">\n          <feDropShadow dx="0" dy="3" stdDeviation="3.5"\n            flood-color="#000" flood-opacity="0.28"/>\n        </filter>\n      </defs>\n\n      \x3c!-- Teardrop body — tip is at (20, 52) = bottom-center of the SVG --\x3e\n      <path\n        d="M20 0C9.402 0 0 9.402 0 20C0 34 20 52 20 52S40 34 40 20C40 9.402 30.598 0 20 0Z"\n        fill="#0ea5e9"\n        filter="url(#qr-pin-shadow)"\n      />\n      \x3c!-- Dot inside the pin --\x3e\n      <circle cx="20" cy="20" r="9" fill="white"/>\n      <circle cx="20" cy="20" r="5" fill="#0ea5e9"/>\n    </svg>\n\n    \x3c!--\n      Pulse ring — position: absolute inside .qr-pin (position: relative).\n      bottom: -(height/2)  →  bottom: -10px  centres the 20×20 circle\n      exactly at y = PIN_H = 52px = the pin tip coordinate.\n    --\x3e\n    <div class="qr-pin__pulse" aria-hidden="true"></div>\n  ',e}(),a=new t.Marker({element:r,draggable:!0,anchor:"bottom"}).setLngLat([f,m]).addTo(n)
+a.on("drag",()=>{const e=a.getLngLat()
+q(e.lat),N(e.lng),A(e.lat,e.lng)}),a.on("dragend",()=>{const e=a.getLngLat()
+n.easeTo({center:[e.lng,e.lat],duration:250})}),p.current=a}),n.on("click",e=>{var r
+const t=e.lngLat
+null==(r=p.current)||r.setLngLat([t.lng,t.lat]),q(t.lat),N(t.lng),A(t.lat,t.lng),n.easeTo({center:[t.lng,t.lat],duration:200})}),h.current=n,()=>{n.remove(),h.current=null,p.current=null}},[])
+const S=n.useCallback(()=>{E(),C((e,r)=>{var n
+q(e),N(r),A(e,r),h.current&&h.current.flyTo({center:[r,e],zoom:18,duration:1400,essential:!0}),null==(n=p.current)||n.setLngLat([r,e])})},[C,E,A]),T=n.useCallback(()=>{v&&e(b,y,v)},[b,y,v,e]),I=null!==v,M=I&&w
+return r.jsxs("div",{className:"qr-map-wrapper",children:[r.jsxs("div",{className:"qr-step-header",children:[r.jsx("div",{className:"qr-step-badge",children:"1"}),r.jsxs("div",{className:"qr-step-text",children:[r.jsx("span",{className:"qr-step-title",children:"Pin Your Location"}),r.jsx("span",{className:"qr-step-sub",children:"Tap the map or drag the pin to your exact home / office"})]})]}),r.jsxs("div",{className:"qr-map-outer",style:{height:o},children:[r.jsx("div",{ref:u,className:"qr-map-canvas"}),v&&r.jsxs("div",{className:"qr-digipin-badge","aria-live":"polite","aria-label":`DigiPin: ${v}`,children:[r.jsx("span",{className:"qr-digipin-badge__label",children:"DigiPin"}),r.jsx("span",{className:"qr-digipin-badge__code",children:v})]}),!I&&w&&r.jsx("div",{className:"qr-map-notice",role:"status",children:"Move map to India to get a DigiPin"}),r.jsx("button",{className:"qr-locate-btn"+(x?" qr-locate-btn--loading":""),onClick:S,disabled:x,title:"Use my current location","aria-label":"Use my current location",type:"button",children:x?r.jsx("span",{className:"qr-spinner","aria-hidden":"true"}):r.jsxs("svg",{"aria-hidden":"true",viewBox:"0 0 24 24",fill:"none",stroke:"currentColor",strokeWidth:"2",strokeLinecap:"round",strokeLinejoin:"round",children:[r.jsx("circle",{cx:"12",cy:"12",r:"3",fill:"currentColor",stroke:"none"}),r.jsx("circle",{cx:"12",cy:"12",r:"7"}),r.jsx("path",{d:"M12 2v3M12 19v3M2 12h3M19 12h3"})]})}),L&&r.jsxs("div",{className:"qr-geo-error",role:"alert",children:[r.jsx("span",{children:L}),r.jsx("button",{type:"button",className:"qr-geo-error__dismiss",onClick:E,"aria-label":"Dismiss error",children:"×"})]})]}),w&&r.jsxs("div",{className:"qr-coords-strip","aria-label":"Current pin coordinates",children:[r.jsxs("span",{children:[b.toFixed(5),"° N"]}),r.jsx("span",{className:"qr-coords-sep",children:"·"}),r.jsxs("span",{children:[y.toFixed(5),"° E"]})]}),r.jsxs("div",{className:"qr-map-actions",children:[r.jsxs("button",{type:"button",className:"qr-btn qr-btn--primary qr-btn--full",onClick:T,disabled:!M,children:["Confirm Location",r.jsx("svg",{"aria-hidden":"true",viewBox:"0 0 24 24",fill:"none",stroke:"currentColor",strokeWidth:"2.5",strokeLinecap:"round",strokeLinejoin:"round",children:r.jsx("path",{d:"M5 12h14M12 5l7 7-7 7"})})]}),!I&&w&&r.jsx("p",{className:"qr-map-hint",children:"Move the pin to a location in India to continue"})]})]})},h="https://api.quantaroute.com"
+function p(e){if("undefined"!=typeof AbortSignal&&"function"==typeof AbortSignal.timeout)return AbortSignal.timeout(e)
+const r=new AbortController
+return setTimeout(()=>r.abort(),e),r.signal}async function m(e,r,n,t=h){const a=`${t.replace(/\/$/,"")}/v1/location/lookup`
 let i
-try{i=await fetch(t,{method:"POST",headers:{"Content-Type":"application/json","x-api-key":a},body:JSON.stringify({latitude:e,longitude:r}),signal:AbortSignal.timeout(15e3)})}catch(l){if(l instanceof Error&&"TimeoutError"===l.name)throw new Error("Request timed out. Check your internet connection.")
+try{i=await fetch(a,{method:"POST",headers:{"Content-Type":"application/json","x-api-key":n},body:JSON.stringify({latitude:e,longitude:r}),signal:p(15e3)})}catch(l){if(l instanceof Error&&("TimeoutError"===l.name||"AbortError"===l.name))throw new Error("Request timed out. Check your internet connection.")
 throw new Error(`Network error: ${l instanceof Error?l.message:String(l)}`)}if(!i.ok){let e=""
 try{e=await i.text()}catch{}if(401===i.status||403===i.status)throw new Error("Invalid API key. Check your QuantaRoute API key.")
 if(429===i.status)throw new Error("Rate limit exceeded. Upgrade your plan or try again later.")
 throw new Error(`API error ${i.status}: ${e||i.statusText}`)}const o=await i.json()
 if(!o.success)throw new Error(o.message??"Location lookup failed")
-return o}async function m(e,r,a=h){const n=`${a.replace(/\/$/,"")}/v1/digipin/reverse`
-let t
-try{t=await fetch(n,{method:"POST",headers:{"Content-Type":"application/json","x-api-key":r},body:JSON.stringify({digipin:e}),signal:AbortSignal.timeout(15e3)})}catch(o){if(o instanceof Error&&"TimeoutError"===o.name)throw new Error("Request timed out. Check your internet connection.")
-throw new Error(`Network error: ${o instanceof Error?o.message:String(o)}`)}if(!t.ok){let e=""
-try{e=await t.text()}catch{}if(401===t.status||403===t.status)throw new Error("Invalid API key. Check your QuantaRoute API key.")
-if(429===t.status)throw new Error("Rate limit exceeded. Upgrade your plan or try again later.")
-throw new Error(`API error ${t.status}: ${e||t.statusText}`)}const i=await t.json()
+return o}async function f(e,r,n=h){const t=`${n.replace(/\/$/,"")}/v1/digipin/reverse`
+let a
+try{a=await fetch(t,{method:"POST",headers:{"Content-Type":"application/json","x-api-key":r},body:JSON.stringify({digipin:e}),signal:p(15e3)})}catch(o){if(o instanceof Error&&("TimeoutError"===o.name||"AbortError"===o.name))throw new Error("Request timed out. Check your internet connection.")
+throw new Error(`Network error: ${o instanceof Error?o.message:String(o)}`)}if(!a.ok){let e=""
+try{e=await a.text()}catch{}if(401===a.status||403===a.status)throw new Error("Invalid API key. Check your QuantaRoute API key.")
+if(429===a.status)throw new Error("Rate limit exceeded. Upgrade your plan or try again later.")
+throw new Error(`API error ${a.status}: ${e||a.statusText}`)}const i=await a.json()
 if(!i.success)throw new Error(i.message??"Reverse geocoding failed")
 return i}const g={flatNumber:"",floorNumber:"",buildingName:"",streetName:""}
-function f(e,r){switch(r.type){case"LOAD_START":return{status:"loading"}
+function b(e,r){switch(r.type){case"LOAD_START":return{status:"loading"}
 case"LOAD_SUCCESS":{const e=function(e){const r={}
 e.name?r.buildingName=e.name:e.building_name?r.buildingName=e.building_name:e.addr_housename&&(r.buildingName=e.addr_housename)
-const a=[]
-return e.road&&a.push(e.road),e.suburb&&a.push(e.suburb),a.length>0&&(r.streetName=a.join(", ")),r}(r.addressComponents)
+const n=[]
+return e.road&&n.push(e.road),e.suburb&&n.push(e.suburb),n.length>0&&(r.streetName=n.join(", ")),r}(r.addressComponents)
 return{status:"ready",adminInfo:r.adminInfo,alternatives:r.alternatives||[],selectedLocality:r.adminInfo.locality,fields:{...g,...e},submitting:!1}}case"LOAD_ERROR":return{status:"error",message:r.message}
 case"SET_FIELD":return"ready"!==e.status?e:{...e,fields:{...e.fields,[r.key]:r.value}}
 case"SET_LOCALITY":return"ready"!==e.status?e:{...e,selectedLocality:r.locality}
 case"SUBMIT_START":return"ready"!==e.status?e:{...e,submitting:!0}
 case"SUBMIT_END":return"ready"!==e.status?e:{...e,submitting:!1}
-default:return e}}const q=({digipin:e,lat:n,lng:t,apiKey:i,apiBaseUrl:o,onAddressComplete:l,onBack:s,onError:d})=>{const[c,u]=a.useReducer(f,{status:"loading"}),h=a.useCallback(async()=>{u({type:"LOAD_START"})
-try{const[r,a]=await Promise.all([p(n,t,i,o),m(e,i,o)])
-u({type:"LOAD_SUCCESS",adminInfo:r.data.administrative_info,alternatives:r.data.alternatives||[],addressComponents:a.data.addressComponents})}catch(r){const e=r instanceof Error?r.message:"Failed to fetch address data."
-u({type:"LOAD_ERROR",message:e}),null==d||d(r instanceof Error?r:new Error(e))}},[e,n,t,i,o,d])
-a.useEffect(()=>{h()},[h])
-const g=a.useCallback(r=>{if(r.preventDefault(),"ready"!==c.status)return
-const{adminInfo:a,selectedLocality:i,fields:o}=c,s=[o.flatNumber,o.floorNumber?`Floor ${o.floorNumber}`:"",o.buildingName,o.streetName,i,a.district,a.state,a.pincode].filter(Boolean),d={digipin:e,lat:n,lng:t,state:a.state,district:a.district,division:a.division,locality:i,pincode:a.pincode,delivery:a.delivery,country:a.country??"India",...o,formattedAddress:s.join(", ")}
+default:return e}}const q=({digipin:e,lat:t,lng:a,apiKey:i,apiBaseUrl:o,onAddressComplete:l,onBack:s,onError:d})=>{const[c,u]=n.useReducer(b,{status:"loading"}),h=n.useCallback(async()=>{u({type:"LOAD_START"})
+try{const[r,n]=await Promise.all([m(t,a,i,o),f(e,i,o)])
+u({type:"LOAD_SUCCESS",adminInfo:r.data.administrative_info,alternatives:r.data.alternatives||[],addressComponents:n.data.addressComponents})}catch(r){const e=r instanceof Error?r.message:"Failed to fetch address data."
+u({type:"LOAD_ERROR",message:e}),null==d||d(r instanceof Error?r:new Error(e))}},[e,t,a,i,o,d])
+n.useEffect(()=>{h()},[h])
+const p=n.useCallback(r=>{if(r.preventDefault(),"ready"!==c.status)return
+const{adminInfo:n,selectedLocality:i,fields:o}=c,s=[o.flatNumber,o.floorNumber?`Floor ${o.floorNumber}`:"",o.buildingName,o.streetName,i,n.district,n.state,n.pincode].filter(Boolean),d={digipin:e,lat:t,lng:a,state:n.state,district:n.district,division:n.division,locality:i,pincode:n.pincode,delivery:n.delivery,country:n.country??"India",...o,formattedAddress:s.join(", ")}
 u({type:"SUBMIT_START"})
-try{l(d)}finally{u({type:"SUBMIT_END"})}},[c,e,n,t,l])
-return r.jsxs("div",{className:"qr-form-wrapper",children:[r.jsxs("div",{className:"qr-step-header",children:[r.jsx("button",{type:"button",className:"qr-back-btn",onClick:s,"aria-label":"Back to map",children:r.jsx("svg",{"aria-hidden":"true",viewBox:"0 0 24 24",fill:"none",stroke:"currentColor",strokeWidth:"2.5",strokeLinecap:"round",strokeLinejoin:"round",children:r.jsx("path",{d:"M19 12H5M12 19l-7-7 7-7"})})}),r.jsx("div",{className:"qr-step-badge",children:"2"}),r.jsxs("div",{className:"qr-step-text",children:[r.jsx("span",{className:"qr-step-title",children:"Add Address Details"}),r.jsx("span",{className:"qr-step-sub",children:"Flat number and building info"})]})]}),r.jsxs("div",{className:"qr-form-digipin-strip",children:[r.jsxs("svg",{"aria-hidden":"true",viewBox:"0 0 24 24",fill:"none",stroke:"currentColor",strokeWidth:"2",strokeLinecap:"round",strokeLinejoin:"round",children:[r.jsx("path",{d:"M21 10c0 7-9 13-9 13S3 17 3 10a9 9 0 0118 0z"}),r.jsx("circle",{cx:"12",cy:"10",r:"3"})]}),r.jsx("span",{className:"qr-form-digipin-strip__label",children:"DigiPin"}),r.jsx("span",{className:"qr-form-digipin-strip__code",children:e})]}),"loading"===c.status&&r.jsxs("div",{className:"qr-loading-state","aria-busy":"true","aria-label":"Fetching address details",children:[r.jsx("div",{className:"qr-spinner qr-spinner--lg","aria-hidden":"true"}),r.jsx("p",{className:"qr-loading-state__text",children:"Fetching address details…"})]}),"error"===c.status&&r.jsxs("div",{className:"qr-error-state",role:"alert",children:[r.jsx("div",{className:"qr-error-state__icon","aria-hidden":"true",children:"⚠"}),r.jsx("p",{className:"qr-error-state__msg",children:c.message}),r.jsx("button",{type:"button",className:"qr-btn qr-btn--secondary qr-btn--sm",onClick:()=>{h()},children:"Retry"})]}),"ready"===c.status&&r.jsxs("form",{onSubmit:g,className:"qr-form",noValidate:!0,children:[r.jsxs("fieldset",{className:"qr-fieldset",children:[r.jsxs("legend",{className:"qr-fieldset__legend",children:[r.jsx("span",{className:"qr-fieldset__icon","aria-hidden":"true",children:"📍"}),"Auto-detected from your pin"]}),r.jsxs("div",{className:"qr-auto-grid",children:[r.jsxs("div",{className:"qr-auto-row",children:[r.jsx("span",{className:"qr-auto-row__label",children:"State"}),r.jsx("span",{className:"qr-auto-row__value",children:c.adminInfo.state})]}),r.jsxs("div",{className:"qr-auto-row",children:[r.jsx("span",{className:"qr-auto-row__label",children:"District"}),r.jsx("span",{className:"qr-auto-row__value",children:c.adminInfo.district})]}),r.jsxs("div",{className:"qr-auto-row qr-auto-row--full",children:[r.jsx("span",{className:"qr-auto-row__label",children:"Locality"}),c.alternatives.length>0?r.jsxs("select",{className:"qr-auto-row__select",value:c.selectedLocality,onChange:e=>u({type:"SET_LOCALITY",locality:e.target.value}),"aria-label":"Select locality",children:[r.jsx("option",{value:c.adminInfo.locality,children:c.adminInfo.locality}),c.alternatives.map((e,a)=>r.jsx("option",{value:e.name,children:e.name},a))]}):r.jsx("span",{className:"qr-auto-row__value",children:c.selectedLocality})]}),r.jsxs("div",{className:"qr-auto-row",children:[r.jsx("span",{className:"qr-auto-row__label",children:"Pincode"}),r.jsx("span",{className:"qr-auto-row__value qr-auto-row__value--pin",children:c.adminInfo.pincode})]})]})]}),r.jsxs("fieldset",{className:"qr-fieldset",children:[r.jsxs("legend",{className:"qr-fieldset__legend",children:[r.jsx("span",{className:"qr-fieldset__icon","aria-hidden":"true",children:"🏠"}),"Your details"]}),r.jsxs("div",{className:"qr-fields-grid",children:[r.jsxs("div",{className:"qr-field qr-field--full",children:[r.jsxs("label",{className:"qr-field__label",htmlFor:"qr-flatNumber",children:["Flat / House Number",r.jsx("span",{className:"qr-required","aria-hidden":"true",children:"*"})]}),r.jsx("input",{id:"qr-flatNumber",type:"text",className:"qr-field__input",placeholder:"e.g. 4B, Flat 201, House No. 12",value:c.fields.flatNumber,onChange:e=>u({type:"SET_FIELD",key:"flatNumber",value:e.target.value}),autoComplete:"address-line1",required:!0,"aria-required":"true"})]}),r.jsxs("div",{className:"qr-field",children:[r.jsxs("label",{className:"qr-field__label",htmlFor:"qr-floorNumber",children:["Floor",r.jsx("span",{className:"qr-optional",children:"optional"})]}),r.jsx("input",{id:"qr-floorNumber",type:"text",className:"qr-field__input",placeholder:"e.g. 3rd, Ground",value:c.fields.floorNumber,onChange:e=>u({type:"SET_FIELD",key:"floorNumber",value:e.target.value})})]}),r.jsxs("div",{className:"qr-field",children:[r.jsxs("label",{className:"qr-field__label",htmlFor:"qr-buildingName",children:["Building / Society",r.jsx("span",{className:"qr-optional",children:"optional"})]}),r.jsx("input",{id:"qr-buildingName",type:"text",className:"qr-field__input",placeholder:"e.g. Sunshine Apts, DDA Colony",value:c.fields.buildingName,onChange:e=>u({type:"SET_FIELD",key:"buildingName",value:e.target.value}),autoComplete:"address-line2"})]}),r.jsxs("div",{className:"qr-field qr-field--full",children:[r.jsxs("label",{className:"qr-field__label",htmlFor:"qr-streetName",children:["Street / Area",r.jsx("span",{className:"qr-optional",children:"optional"})]}),r.jsx("input",{id:"qr-streetName",type:"text",className:"qr-field__input",placeholder:"e.g. MG Road, Sector 12",value:c.fields.streetName,onChange:e=>u({type:"SET_FIELD",key:"streetName",value:e.target.value}),autoComplete:"address-level3"})]})]})]}),r.jsxs("div",{className:"qr-form-actions",children:[r.jsxs("button",{type:"button",className:"qr-btn qr-btn--ghost",onClick:s,children:[r.jsx("svg",{"aria-hidden":"true",viewBox:"0 0 24 24",fill:"none",stroke:"currentColor",strokeWidth:"2",strokeLinecap:"round",strokeLinejoin:"round",children:r.jsx("path",{d:"M19 12H5M12 19l-7-7 7-7"})}),"Adjust Pin"]}),r.jsx("button",{type:"submit",className:"qr-btn qr-btn--primary qr-btn--grow",disabled:c.submitting||!c.fields.flatNumber.trim(),children:c.submitting?r.jsxs(r.Fragment,{children:[r.jsx("span",{className:"qr-spinner qr-spinner--sm","aria-hidden":"true"}),"Saving…"]}):r.jsxs(r.Fragment,{children:["Save Address",r.jsx("svg",{"aria-hidden":"true",viewBox:"0 0 24 24",fill:"none",stroke:"currentColor",strokeWidth:"2.5",strokeLinecap:"round",strokeLinejoin:"round",children:r.jsx("path",{d:"M20 6L9 17l-5-5"})})]})})]})]})]})},b=({address:e,onEditAddress:a})=>r.jsxs("div",{className:"qr-success",children:[r.jsx("div",{className:"qr-success__icon","aria-hidden":"true",children:r.jsxs("svg",{viewBox:"0 0 52 52",fill:"none",xmlns:"http://www.w3.org/2000/svg",children:[r.jsx("circle",{cx:"26",cy:"26",r:"26",fill:"var(--qr-success, #10b981)",opacity:"0.12"}),r.jsx("circle",{cx:"26",cy:"26",r:"20",fill:"var(--qr-success, #10b981)"}),r.jsx("path",{d:"M15 26l8 8 14-16",stroke:"white",strokeWidth:"3",strokeLinecap:"round",strokeLinejoin:"round"})]})}),r.jsx("h3",{className:"qr-success__title",children:"Address Saved!"}),r.jsx("p",{className:"qr-success__address",children:e.formattedAddress}),r.jsx("div",{className:"qr-success__meta",children:r.jsxs("span",{className:"qr-digipin-badge qr-digipin-badge--inline",children:[r.jsx("span",{className:"qr-digipin-badge__label",children:"DigiPin"}),r.jsx("span",{className:"qr-digipin-badge__code",children:e.digipin})]})}),r.jsx("button",{type:"button",className:"qr-btn qr-btn--ghost qr-btn--sm",onClick:a,children:"Change Address"})]}),y=({apiKey:e,apiBaseUrl:n="https://api.quantaroute.com",onComplete:t,onError:i,defaultLat:o,defaultLng:l,theme:s="light",className:d="",style:c,mapHeight:h="380px",title:p="Add Delivery Address",indiaBoundaryUrl:m})=>{const[g,f]=a.useState("map"),[y,N]=a.useState(null),[v,_]=a.useState(null)
-return r.jsxs("div",{className:`qr-checkout qr-checkout--${s} ${d}`,style:c,"data-testid":"quantaroute-checkout",children:["done"!==g&&r.jsxs("div",{className:"qr-header",children:[r.jsxs("div",{className:"qr-header__brand",children:[r.jsxs("svg",{className:"qr-header__logo","aria-hidden":"true",viewBox:"0 0 24 24",fill:"none",stroke:"currentColor",strokeWidth:"2",strokeLinecap:"round",strokeLinejoin:"round",children:[r.jsx("path",{d:"M21 10c0 7-9 13-9 13S3 17 3 10a9 9 0 0118 0z"}),r.jsx("circle",{cx:"12",cy:"10",r:"3"})]}),r.jsx("span",{className:"qr-header__title",children:p})]}),r.jsxs("div",{className:"qr-progress","aria-label":"Progress: step ${ step === 'map' ? 1 : 2 } of 2",role:"progressbar",children:[r.jsx("div",{className:"qr-progress__dot "+("map"===g||"form"===g||"done"===g?"qr-progress__dot--active":"")}),r.jsx("div",{className:"qr-progress__line "+("form"===g||"done"===g?"qr-progress__line--active":"")}),r.jsx("div",{className:"qr-progress__dot "+("form"===g||"done"===g?"qr-progress__dot--active":"")})]})]}),"map"===g&&r.jsx(u,{onLocationConfirm:(e,r,a)=>{N({lat:e,lng:r,digipin:a}),f("form")},defaultLat:o,defaultLng:l,mapHeight:h,theme:s,indiaBoundaryUrl:m}),"form"===g&&y&&r.jsx(q,{digipin:y.digipin,lat:y.lat,lng:y.lng,apiKey:e,apiBaseUrl:n,onAddressComplete:e=>{_(e),f("done"),t(e)},onBack:()=>{f("map")},onError:i,theme:s}),"done"===g&&v&&r.jsx(b,{address:v,onEditAddress:()=>{f("map"),N(null),_(null)}}),r.jsxs("div",{className:"qr-footer",children:[r.jsx("span",{children:"Powered by"}),r.jsx("a",{href:"https://quantaroute.com",target:"_blank",rel:"noopener noreferrer",className:"qr-footer__link",children:"QuantaRoute"}),r.jsx("span",{className:"qr-footer__flag","aria-label":"Made in India",children:"🇮🇳"})]})]})}
-e.AddressForm=q,e.CheckoutWidget=y,e.DIGIPIN_BOUNDS=i,e.MapPinSelector=u,e.default=y,e.getDigiPin=o,e.getLatLngFromDigiPin=l,e.isValidDigiPin=function(e){if(!e||"string"!=typeof e)return!1
+try{l(d)}finally{u({type:"SUBMIT_END"})}},[c,e,t,a,l])
+return r.jsxs("div",{className:"qr-form-wrapper",children:[r.jsxs("div",{className:"qr-step-header",children:[r.jsx("button",{type:"button",className:"qr-back-btn",onClick:s,"aria-label":"Back to map",children:r.jsx("svg",{"aria-hidden":"true",viewBox:"0 0 24 24",fill:"none",stroke:"currentColor",strokeWidth:"2.5",strokeLinecap:"round",strokeLinejoin:"round",children:r.jsx("path",{d:"M19 12H5M12 19l-7-7 7-7"})})}),r.jsx("div",{className:"qr-step-badge",children:"2"}),r.jsxs("div",{className:"qr-step-text",children:[r.jsx("span",{className:"qr-step-title",children:"Add Address Details"}),r.jsx("span",{className:"qr-step-sub",children:"Flat number and building info"})]})]}),r.jsxs("div",{className:"qr-form-digipin-strip",children:[r.jsxs("svg",{"aria-hidden":"true",viewBox:"0 0 24 24",fill:"none",stroke:"currentColor",strokeWidth:"2",strokeLinecap:"round",strokeLinejoin:"round",children:[r.jsx("path",{d:"M21 10c0 7-9 13-9 13S3 17 3 10a9 9 0 0118 0z"}),r.jsx("circle",{cx:"12",cy:"10",r:"3"})]}),r.jsx("span",{className:"qr-form-digipin-strip__label",children:"DigiPin"}),r.jsx("span",{className:"qr-form-digipin-strip__code",children:e})]}),"loading"===c.status&&r.jsxs("div",{className:"qr-loading-state","aria-busy":"true","aria-label":"Fetching address details",children:[r.jsx("div",{className:"qr-spinner qr-spinner--lg","aria-hidden":"true"}),r.jsx("p",{className:"qr-loading-state__text",children:"Fetching address details…"})]}),"error"===c.status&&r.jsxs("div",{className:"qr-error-state",role:"alert",children:[r.jsx("div",{className:"qr-error-state__icon","aria-hidden":"true",children:"⚠"}),r.jsx("p",{className:"qr-error-state__msg",children:c.message}),r.jsx("button",{type:"button",className:"qr-btn qr-btn--secondary qr-btn--sm",onClick:()=>{h()},children:"Retry"})]}),"ready"===c.status&&r.jsxs("form",{onSubmit:p,className:"qr-form",noValidate:!0,children:[r.jsxs("fieldset",{className:"qr-fieldset",children:[r.jsxs("legend",{className:"qr-fieldset__legend",children:[r.jsx("span",{className:"qr-fieldset__icon","aria-hidden":"true",children:"📍"}),"Auto-detected from your pin"]}),r.jsxs("div",{className:"qr-auto-grid",children:[r.jsxs("div",{className:"qr-auto-row",children:[r.jsx("span",{className:"qr-auto-row__label",children:"State"}),r.jsx("span",{className:"qr-auto-row__value",children:c.adminInfo.state})]}),r.jsxs("div",{className:"qr-auto-row",children:[r.jsx("span",{className:"qr-auto-row__label",children:"District"}),r.jsx("span",{className:"qr-auto-row__value",children:c.adminInfo.district})]}),r.jsxs("div",{className:"qr-auto-row qr-auto-row--full",children:[r.jsx("span",{className:"qr-auto-row__label",children:"Locality"}),c.alternatives.length>0?r.jsxs("select",{className:"qr-auto-row__select",value:c.selectedLocality,onChange:e=>u({type:"SET_LOCALITY",locality:e.target.value}),"aria-label":"Select locality",children:[r.jsx("option",{value:c.adminInfo.locality,children:c.adminInfo.locality}),c.alternatives.map((e,n)=>r.jsx("option",{value:e.name,children:e.name},n))]}):r.jsx("span",{className:"qr-auto-row__value",children:c.selectedLocality})]}),r.jsxs("div",{className:"qr-auto-row",children:[r.jsx("span",{className:"qr-auto-row__label",children:"Pincode"}),r.jsx("span",{className:"qr-auto-row__value qr-auto-row__value--pin",children:c.adminInfo.pincode})]})]})]}),r.jsxs("fieldset",{className:"qr-fieldset",children:[r.jsxs("legend",{className:"qr-fieldset__legend",children:[r.jsx("span",{className:"qr-fieldset__icon","aria-hidden":"true",children:"🏠"}),"Your details"]}),r.jsxs("div",{className:"qr-fields-grid",children:[r.jsxs("div",{className:"qr-field qr-field--full",children:[r.jsxs("label",{className:"qr-field__label",htmlFor:"qr-flatNumber",children:["Flat / House Number",r.jsx("span",{className:"qr-required","aria-hidden":"true",children:"*"})]}),r.jsx("input",{id:"qr-flatNumber",type:"text",className:"qr-field__input",placeholder:"e.g. 4B, Flat 201, House No. 12",value:c.fields.flatNumber,onChange:e=>u({type:"SET_FIELD",key:"flatNumber",value:e.target.value}),autoComplete:"address-line1",required:!0,"aria-required":"true"})]}),r.jsxs("div",{className:"qr-field",children:[r.jsxs("label",{className:"qr-field__label",htmlFor:"qr-floorNumber",children:["Floor",r.jsx("span",{className:"qr-optional",children:"optional"})]}),r.jsx("input",{id:"qr-floorNumber",type:"text",className:"qr-field__input",placeholder:"e.g. 3rd, Ground",value:c.fields.floorNumber,onChange:e=>u({type:"SET_FIELD",key:"floorNumber",value:e.target.value})})]}),r.jsxs("div",{className:"qr-field",children:[r.jsxs("label",{className:"qr-field__label",htmlFor:"qr-buildingName",children:["Building / Society",r.jsx("span",{className:"qr-optional",children:"optional"})]}),r.jsx("input",{id:"qr-buildingName",type:"text",className:"qr-field__input",placeholder:"e.g. Sunshine Apts, DDA Colony",value:c.fields.buildingName,onChange:e=>u({type:"SET_FIELD",key:"buildingName",value:e.target.value}),autoComplete:"address-line2"})]}),r.jsxs("div",{className:"qr-field qr-field--full",children:[r.jsxs("label",{className:"qr-field__label",htmlFor:"qr-streetName",children:["Street / Area",r.jsx("span",{className:"qr-optional",children:"optional"})]}),r.jsx("input",{id:"qr-streetName",type:"text",className:"qr-field__input",placeholder:"e.g. MG Road, Sector 12",value:c.fields.streetName,onChange:e=>u({type:"SET_FIELD",key:"streetName",value:e.target.value}),autoComplete:"address-level3"})]})]})]}),r.jsxs("div",{className:"qr-form-actions",children:[r.jsxs("button",{type:"button",className:"qr-btn qr-btn--ghost",onClick:s,children:[r.jsx("svg",{"aria-hidden":"true",viewBox:"0 0 24 24",fill:"none",stroke:"currentColor",strokeWidth:"2",strokeLinecap:"round",strokeLinejoin:"round",children:r.jsx("path",{d:"M19 12H5M12 19l-7-7 7-7"})}),"Adjust Pin"]}),r.jsx("button",{type:"submit",className:"qr-btn qr-btn--primary qr-btn--grow",disabled:c.submitting||!c.fields.flatNumber.trim(),children:c.submitting?r.jsxs(r.Fragment,{children:[r.jsx("span",{className:"qr-spinner qr-spinner--sm","aria-hidden":"true"}),"Saving…"]}):r.jsxs(r.Fragment,{children:["Save Address",r.jsx("svg",{"aria-hidden":"true",viewBox:"0 0 24 24",fill:"none",stroke:"currentColor",strokeWidth:"2.5",strokeLinecap:"round",strokeLinejoin:"round",children:r.jsx("path",{d:"M20 6L9 17l-5-5"})})]})})]})]})]})},y=({address:e,onEditAddress:n})=>r.jsxs("div",{className:"qr-success",children:[r.jsx("div",{className:"qr-success__icon","aria-hidden":"true",children:r.jsxs("svg",{viewBox:"0 0 52 52",fill:"none",xmlns:"http://www.w3.org/2000/svg",children:[r.jsx("circle",{cx:"26",cy:"26",r:"26",fill:"var(--qr-success, #10b981)",opacity:"0.12"}),r.jsx("circle",{cx:"26",cy:"26",r:"20",fill:"var(--qr-success, #10b981)"}),r.jsx("path",{d:"M15 26l8 8 14-16",stroke:"white",strokeWidth:"3",strokeLinecap:"round",strokeLinejoin:"round"})]})}),r.jsx("h3",{className:"qr-success__title",children:"Address Saved!"}),r.jsx("p",{className:"qr-success__address",children:e.formattedAddress}),r.jsx("div",{className:"qr-success__meta",children:r.jsxs("span",{className:"qr-digipin-badge qr-digipin-badge--inline",children:[r.jsx("span",{className:"qr-digipin-badge__label",children:"DigiPin"}),r.jsx("span",{className:"qr-digipin-badge__code",children:e.digipin})]})}),r.jsx("button",{type:"button",className:"qr-btn qr-btn--ghost qr-btn--sm",onClick:n,children:"Change Address"})]}),N=({apiKey:e,apiBaseUrl:t="https://api.quantaroute.com",onComplete:a,onError:i,defaultLat:o,defaultLng:l,theme:s="light",className:d="",style:c,mapHeight:h="380px",title:p="Add Delivery Address",indiaBoundaryUrl:m})=>{const[f,g]=n.useState("map"),[b,N]=n.useState(null),[v,_]=n.useState(null)
+return r.jsxs("div",{className:`qr-checkout qr-checkout--${s} ${d}`,style:c,"data-testid":"quantaroute-checkout",children:["done"!==f&&r.jsxs("div",{className:"qr-header",children:[r.jsxs("div",{className:"qr-header__brand",children:[r.jsxs("svg",{className:"qr-header__logo","aria-hidden":"true",viewBox:"0 0 24 24",fill:"none",stroke:"currentColor",strokeWidth:"2",strokeLinecap:"round",strokeLinejoin:"round",children:[r.jsx("path",{d:"M21 10c0 7-9 13-9 13S3 17 3 10a9 9 0 0118 0z"}),r.jsx("circle",{cx:"12",cy:"10",r:"3"})]}),r.jsx("span",{className:"qr-header__title",children:p})]}),r.jsxs("div",{className:"qr-progress","aria-label":"Progress: step ${ step === 'map' ? 1 : 2 } of 2",role:"progressbar",children:[r.jsx("div",{className:"qr-progress__dot "+("map"===f||"form"===f||"done"===f?"qr-progress__dot--active":"")}),r.jsx("div",{className:"qr-progress__line "+("form"===f||"done"===f?"qr-progress__line--active":"")}),r.jsx("div",{className:"qr-progress__dot "+("form"===f||"done"===f?"qr-progress__dot--active":"")})]})]}),"map"===f&&r.jsx(u,{onLocationConfirm:(e,r,n)=>{N({lat:e,lng:r,digipin:n}),g("form")},defaultLat:o,defaultLng:l,mapHeight:h,theme:s,indiaBoundaryUrl:m}),"form"===f&&b&&r.jsx(q,{digipin:b.digipin,lat:b.lat,lng:b.lng,apiKey:e,apiBaseUrl:t,onAddressComplete:e=>{_(e),g("done"),a(e)},onBack:()=>{g("map")},onError:i,theme:s}),"done"===f&&v&&r.jsx(y,{address:v,onEditAddress:()=>{g("map"),N(null),_(null)}}),r.jsxs("div",{className:"qr-footer",children:[r.jsx("span",{children:"Powered by"}),r.jsx("a",{href:"https://quantaroute.com",target:"_blank",rel:"noopener noreferrer",className:"qr-footer__link",children:"QuantaRoute"}),r.jsx("span",{className:"qr-footer__flag","aria-label":"Made in India",children:"🇮🇳"})]})]})}
+e.AddressForm=q,e.CheckoutWidget=N,e.DIGIPIN_BOUNDS=i,e.MapPinSelector=u,e.default=N,e.getDigiPin=o,e.getLatLngFromDigiPin=l,e.isValidDigiPin=function(e){if(!e||"string"!=typeof e)return!1
 if(!/^[A-Z0-9]{3}-[A-Z0-9]{3}-[A-Z0-9]{4}$/i.test(e.trim()))return!1
-try{return l(e.trim().toUpperCase()),!0}catch{return!1}},e.isWithinIndia=s,e.lookupLocation=p,e.reverseGeocode=m,e.useDigiPin=function(e,r){return a.useMemo(()=>{if(!s(e,r))return null
+try{return l(e.trim().toUpperCase()),!0}catch{return!1}},e.isWithinIndia=s,e.lookupLocation=m,e.reverseGeocode=f,e.useDigiPin=function(e,r){return n.useMemo(()=>{if(!s(e,r))return null
 try{return o(e,r)}catch{return null}},[e,r])},e.useGeolocation=d,Object.defineProperties(e,{t:{value:!0},[Symbol.toStringTag]:{value:"Module"}})})

package/expo-plugin.js

@@ -0,0 +1,109 @@
+/**
+ * @quantaroute/checkout — Expo Config Plugin
+ *
+ * Wires up all native permissions and native modules needed by the
+ * checkout widget in one step. Add this to your app.json:
+ *
+ *   "plugins": [
+ *     ["@quantaroute/checkout/plugin", {
+ *       "locationPermissionText": "Used to place your delivery pin on the map"
+ *     }]
+ *   ]
+ *
+ * This plugin internally applies:
+ *   • expo-osm-sdk/plugin  → MapLibre GL native map (iOS/Android)
+ *   • expo-location        → GPS location permission
+ *   • Android manifest     → INTERNET + ACCESS_FINE_LOCATION permissions
+ *   • iOS Info.plist       → NSLocationWhenInUseUsageDescription
+ *
+ * @param {object} [options]
+ * @param {string} [options.locationPermissionText] - Custom permission text shown to the user.
+ *   Defaults to a sensible delivery-address copy.
+ */
+
+const { withAndroidManifest, withInfoPlist, withPlugins } = require('@expo/config-plugins');
+
+const DEFAULT_LOCATION_TEXT =
+  'Allow access to your location to place the delivery pin accurately on the map.';
+
+// ─── Android helper ───────────────────────────────────────────────────────────
+
+function ensurePermission(manifest, name) {
+  if (!manifest['uses-permission']) {
+    manifest['uses-permission'] = [];
+  }
+  const exists = manifest['uses-permission'].some(
+    (p) => p.$?.['android:name'] === name
+  );
+  if (!exists) {
+    manifest['uses-permission'].push({ $: { 'android:name': name } });
+  }
+  return manifest;
+}
+
+const withAndroidPermissions = (config) =>
+  withAndroidManifest(config, (cfg) => {
+    const m = cfg.modResults.manifest;
+    ensurePermission(m, 'android.permission.INTERNET');
+    ensurePermission(m, 'android.permission.ACCESS_FINE_LOCATION');
+    ensurePermission(m, 'android.permission.ACCESS_COARSE_LOCATION');
+    return cfg;
+  });
+
+// ─── iOS helper ───────────────────────────────────────────────────────────────
+
+const withIosPermissions = (config, { locationPermissionText }) =>
+  withInfoPlist(config, (cfg) => {
+    if (!cfg.modResults.NSLocationWhenInUseUsageDescription) {
+      cfg.modResults.NSLocationWhenInUseUsageDescription = locationPermissionText;
+    }
+    return cfg;
+  });
+
+// ─── Main plugin ──────────────────────────────────────────────────────────────
+
+const withQuantaRouteCheckout = (config, options = {}) => {
+  const locationPermissionText =
+    options.locationPermissionText ?? DEFAULT_LOCATION_TEXT;
+
+  return withPlugins(config, [
+    // 1. Apply expo-osm-sdk plugin (MapLibre GL native maps)
+    (cfg) => {
+      try {
+        const osmPlugin = require('expo-osm-sdk/plugin');
+        return osmPlugin(cfg, { locationPermissionText });
+      } catch {
+        console.warn(
+          '[@quantaroute/checkout] expo-osm-sdk/plugin not found. ' +
+          'Make sure expo-osm-sdk is installed: npm install expo-osm-sdk'
+        );
+        return cfg;
+      }
+    },
+
+    // 2. Apply expo-location plugin (GPS location API)
+    (cfg) => {
+      try {
+        const locationPlugin = require('expo-location/build/ExpoLocationPlugin');
+        return locationPlugin(cfg, { locationAlwaysAndWhenInUsePermission: locationPermissionText });
+      } catch {
+        try {
+          // Fallback: expo-location ships its plugin at a different path in some versions
+          const mod = require('expo-location');
+          if (mod.withLocation) return mod.withLocation(cfg);
+        } catch {
+          // Silent: expo-location permissions are handled by withIosPermissions below
+        }
+        return cfg;
+      }
+    },
+
+    // 3. Ensure Android permissions (belt-and-suspenders on top of the above)
+    (cfg) => withAndroidPermissions(cfg),
+
+    // 4. Ensure iOS Info.plist key (belt-and-suspenders)
+    (cfg) => withIosPermissions(cfg, { locationPermissionText }),
+  ]);
+};
+
+module.exports = withQuantaRouteCheckout;

package/package.json

@@ -1,21 +1,30 @@
 {
   "name": "@quantaroute/checkout",
-  "version": "1.1.1",
-  "description": "Embeddable DigiPin-powered smart address checkout widget for Indian e-commerce",
+  "version": "1.2.1",
+  "description": "Embeddable DigiPin-powered smart address checkout widget — React (web), React Native & Expo (iOS/Android)",
   "main": "./dist/lib/quantaroute-checkout.umd.js",
   "module": "./dist/lib/quantaroute-checkout.es.js",
   "types": "./dist/lib/index.d.ts",
+  "source": "src/index.ts",
+  "react-native": "src/index.ts",
   "exports": {
     ".": {
+      "types": "./dist/lib/index.d.ts",
+      "react-native": "./src/index.ts",
       "import": "./dist/lib/quantaroute-checkout.es.js",
-      "require": "./dist/lib/quantaroute-checkout.umd.js",
-      "types": "./dist/lib/index.d.ts"
+      "require": "./dist/lib/quantaroute-checkout.umd.js"
+    },
+    "./plugin": {
+      "default": "./expo-plugin.js"
     },
     "./style.css": "./dist/style.css"
   },
   "files": [
+    "src",
     "dist/lib",
     "dist/style.css",
+    "expo-plugin.js",
+    "babel.config.js",
     "README.md",
     "LICENSE"
   ],
@@ -26,6 +35,7 @@
     "build:demo": "vite build",
     "preview": "vite preview --outDir dist/demo",
     "type-check": "tsc --noEmit",
+    "type-check:native": "tsc --project tsconfig.native.json --noEmit",
     "prepublishOnly": "npm run type-check && npm run build:lib"
   },
   "keywords": [
@@ -36,6 +46,10 @@
     "geocoding",
     "maplibre",
     "react",
+    "react-native",
+    "expo",
+    "ios",
+    "android",
     "ecommerce",
     "india-post",
     "address-autocomplete",
@@ -63,30 +77,53 @@
     "npm": ">=10.0.0"
   },
   "peerDependencies": {
+    "@expo/config-plugins": ">=7.0.0",
+    "expo": ">=49.0.0",
+    "expo-location": ">=17.0.0",
+    "expo-osm-sdk": ">=2.0.0",
     "maplibre-gl": ">=4.0.0",
-    "react": ">=18.2.0",
-    "react-dom": ">=18.2.0"
+    "react": ">=18.0.0",
+    "react-dom": ">=18.2.0",
+    "react-native": ">=0.72.0"
   },
   "peerDependenciesMeta": {
+    "@expo/config-plugins": {
+      "optional": true
+    },
     "react": {
       "optional": false
     },
     "react-dom": {
-      "optional": false
+      "optional": true
     },
     "maplibre-gl": {
-      "optional": false
+      "optional": true
+    },
+    "react-native": {
+      "optional": true
+    },
+    "expo": {
+      "optional": true
+    },
+    "expo-osm-sdk": {
+      "optional": true
+    },
+    "expo-location": {
+      "optional": true
     }
   },
-  "dependencies": {},
   "devDependencies": {
-    "@quantaroute/checkout": "^1.1.1",
+    "@expo/config-plugins": "^54.0.4",
     "@types/react": "^18.3.12",
     "@types/react-dom": "^18.3.1",
+    "@types/react-native": "^0.73.0",
     "@vitejs/plugin-react": "^4.3.4",
+    "expo-location": "^18.1.6",
+    "expo-osm-sdk": "^2.0.0",
     "maplibre-gl": "^4.7.1",
     "react": "^18.3.1",
     "react-dom": "^18.3.1",
+    "react-native": "^0.73.11",
     "terser": "^5.46.0",
     "typescript": "^5.6.3",
     "vite": "^5.4.11",