@ambuj.bhaskar/react-component-library 0.20.2-alpha → 0.20.3-alpha

package/dist/index.d.ts

@@ -962,6 +962,8 @@ export declare type MapViewProps = {
     navClassName?: string;
     navButtonColor?: Color;
     className?: string;
+    focusedIndex?: number;
+    onFocusedIndexChange?: (index: number) => void;
 };
 
 export declare const MathAnnotationHelper: {

package/dist/index.js

@@ -81749,8 +81749,22 @@ const EOe = /* @__PURE__ */ Ve(_Oe), SOe = bOe(function({ position: t, ...n }, r
   defaultZoom: BOe,
   defaultCenter: LOe,
   defaultMapProvider: IOe.osm
-}, ROe = "../../src/assets/images/map_pin.svg", POe = new zc.Icon({
-  iconUrl: ROe,
+}, ROe = ({ items: e }) => {
+  const t = tP();
+  return $t(() => {
+    if (!(e != null && e.length)) return;
+    const n = zc.latLngBounds(e == null ? void 0 : e.map((r) => r == null ? void 0 : r.position));
+    t.fitBounds(n, { padding: [50, 50] });
+  }, [e, t]), null;
+}, POe = ({
+  mapRef: e
+}) => {
+  const t = tP();
+  return $t(() => {
+    e.current = t;
+  }, [t]), null;
+}, DOe = "../../src/assets/images/map_pin.svg", NOe = new zc.Icon({
+  iconUrl: DOe,
   iconSize: new zc.Point(32, 32),
   iconAnchor: new zc.Point(16, 32),
   className: "leaflet-div-icon",
@@ -81759,27 +81773,13 @@ const EOe = /* @__PURE__ */ Ve(_Oe), SOe = bOe(function({ position: t, ...n }, r
   SOe,
   {
     position: e,
-    icon: POe,
+    icon: NOe,
     draggable: !1,
     ref: r,
     ...n,
     children: t
   }
-)), DOe = ({ items: e }) => {
-  const t = tP();
-  return $t(() => {
-    if (!(e != null && e.length)) return;
-    const n = zc.latLngBounds(e == null ? void 0 : e.map((r) => r == null ? void 0 : r.position));
-    t.fitBounds(n, { padding: [50, 50] });
-  }, [e, t]), null;
-}, NOe = ({
-  mapRef: e
-}) => {
-  const t = tP();
-  return $t(() => {
-    e.current = t;
-  }, [t]), null;
-}, fLe = ({
+)), fLe = ({
   items: e,
   width: t = "500px",
   height: n = "500px",
@@ -81787,35 +81787,39 @@ const EOe = /* @__PURE__ */ Ve(_Oe), SOe = bOe(function({ position: t, ...n }, r
   showNavigation: o = !0,
   navClassName: i,
   navButtonColor: a,
-  className: s
+  className: s,
+  focusedIndex: l,
+  onFocusedIndexChange: u
 }) => {
-  const [l, u] = Ut(!1), [d, h] = Ut(0);
+  const [d, h] = Ut(!1), [C, m] = Ut(0), A = typeof l == "number", b = A ? l : C;
   $t(() => {
-    u(!0);
+    h(!0);
   }, []);
-  const C = () => {
-    h((w) => (w - 1 + (e == null ? void 0 : e.length)) % (e == null ? void 0 : e.length));
-  }, m = () => {
-    h((w) => (w + 1) % (e == null ? void 0 : e.length));
-  }, A = s1(
-    () => e == null ? void 0 : e[d],
-    [e, d]
-  ), b = St(null);
+  const p = () => {
+    const M = (b - 1 + e.length) % e.length;
+    A && u ? u(M) : m(M);
+  }, _ = () => {
+    const M = (b + 1) % e.length;
+    A && u ? u(M) : m(M);
+  }, w = s1(
+    () => e == null ? void 0 : e[b],
+    [e, b]
+  ), x = St(null);
   $t(() => {
-    if (!l) return;
-    const w = requestAnimationFrame(() => {
-      var x;
-      (x = b == null ? void 0 : b.current) == null || x.openPopup();
+    if (!d) return;
+    const M = requestAnimationFrame(() => {
+      var H;
+      (H = x == null ? void 0 : x.current) == null || H.openPopup();
     });
-    return () => cancelAnimationFrame(w);
-  }, [d, l]);
-  const p = a || "var(--awi-color-common-highlight, #ffcc00)", _ = St(null);
+    return () => cancelAnimationFrame(M);
+  }, [b, d]);
+  const E = a || "var(--awi-color-common-highlight, #ffcc00)", S = St(null);
   return $t(() => {
-    const w = _.current;
-    w && (A != null && A.position) && w.setView(A.position, w.getZoom(), {
+    const M = S.current;
+    M && (w != null && w.position) && M.setView(w.position, M.getZoom(), {
       animate: !0
     });
-  }, [A, l]), typeof window > "u" || !l || !(e != null && e.length) ? null : /* @__PURE__ */ Q.jsxs(
+  }, [w, d]), typeof window > "u" || !d || !(e != null && e.length) ? null : /* @__PURE__ */ Q.jsxs(
     "div",
     {
       className: `map_view_container ${s}`,
@@ -81824,7 +81828,7 @@ const EOe = /* @__PURE__ */ Ve(_Oe), SOe = bOe(function({ position: t, ...n }, r
         /* @__PURE__ */ Q.jsxs(
           EOe,
           {
-            center: A == null ? void 0 : A.position,
+            center: w == null ? void 0 : w.position,
             zoom: yf.defaultZoom,
             className: "static_map",
             zoomControl: !1,
@@ -81837,48 +81841,42 @@ const EOe = /* @__PURE__ */ Ve(_Oe), SOe = bOe(function({ position: t, ...n }, r
                   attribution: yf.defaultMapProvider.attribution
                 }
               ),
-              /* @__PURE__ */ Q.jsx(NOe, { mapRef: _ }),
-              /* @__PURE__ */ Q.jsx(DOe, { items: e }),
+              /* @__PURE__ */ Q.jsx(POe, { mapRef: S }),
+              /* @__PURE__ */ Q.jsx(ROe, { items: e }),
               /* @__PURE__ */ Q.jsx(OOe, { position: "bottomright" }),
               e == null ? void 0 : e.map(
-                (w, x) => x === d ? /* @__PURE__ */ Q.jsx(G_, { position: w == null ? void 0 : w.position, ref: b, children: r ? /* @__PURE__ */ Q.jsx(MOe, { closeButton: !1, autoPan: !1, children: w == null ? void 0 : w.element }) : /* @__PURE__ */ Q.jsx(Q.Fragment, {}) }, x) : /* @__PURE__ */ Q.jsx(G_, { position: w == null ? void 0 : w.position }, x)
+                (M, H) => H === b ? /* @__PURE__ */ Q.jsx(G_, { position: M == null ? void 0 : M.position, ref: x, children: r ? /* @__PURE__ */ Q.jsx(MOe, { closeButton: !1, autoPan: !1, children: M == null ? void 0 : M.element }) : null }, H) : /* @__PURE__ */ Q.jsx(G_, { position: M == null ? void 0 : M.position }, H)
               )
             ]
           }
         ),
-        o ? /* @__PURE__ */ Q.jsxs(
-          "div",
-          {
-            className: `map_view_nav_container ${i || ""}`,
-            children: [
-              /* @__PURE__ */ Q.jsx(
-                Mi,
-                {
-                  variant: "primary",
-                  onClick: C,
-                  size: "s",
-                  icon: "leftArrow",
-                  backgroundColor: p,
-                  borderColor: p,
-                  title: "Previous"
-                }
-              ),
-              /* @__PURE__ */ Q.jsx(
-                Mi,
-                {
-                  variant: "primary",
-                  onClick: m,
-                  size: "s",
-                  icon: "rightArrow",
-                  iconPosition: "after",
-                  backgroundColor: p,
-                  borderColor: p,
-                  title: "Next"
-                }
-              )
-            ]
-          }
-        ) : /* @__PURE__ */ Q.jsx(Q.Fragment, {})
+        o ? /* @__PURE__ */ Q.jsxs("div", { className: `map_view_nav_container ${i ?? ""}`, children: [
+          /* @__PURE__ */ Q.jsx(
+            Mi,
+            {
+              variant: "primary",
+              onClick: p,
+              size: "s",
+              icon: "leftArrow",
+              backgroundColor: E,
+              borderColor: E,
+              title: "Previous"
+            }
+          ),
+          /* @__PURE__ */ Q.jsx(
+            Mi,
+            {
+              variant: "primary",
+              onClick: _,
+              size: "s",
+              icon: "rightArrow",
+              iconPosition: "after",
+              backgroundColor: E,
+              borderColor: E,
+              title: "Next"
+            }
+          )
+        ] }) : null
       ]
     }
   );