@kashifd/jwero-components 0.7.71 → 0.7.72

package/dist/index.es.js

@@ -46456,9 +46456,10 @@ const Na = ({ stroke: e = "#000", ...t }) => /* @__PURE__ */ v.jsxs(
   variant: a = "primary",
   enterDelay: s = 400,
   enterNextDelay: c = 200,
-  sx: u
+  sx: u,
+  childrenSx: g
 }) => {
-  const g = Ot(), m = a === "primary" ? g.colors.secondary : a === "secondary" ? "#ffffff" : g.colors.positive, b = a === "primary" ? "#ffffff" : a === "secondary" ? "black" : g.colors.positive;
+  const m = Ot(), b = a === "primary" ? m.colors.secondary : a === "secondary" ? "#ffffff" : m.colors.positive, w = a === "primary" ? "#ffffff" : a === "secondary" ? "black" : m.colors.positive;
   return /* @__PURE__ */ v.jsx(
     av,
     {
@@ -46472,8 +46473,8 @@ const Na = ({ stroke: e = "#000", ...t }) => /* @__PURE__ */ v.jsxs(
           sx: {
             fontSize: "0.875rem",
             fontWeight: 500,
-            backgroundColor: m,
-            color: b,
+            backgroundColor: b,
+            color: w,
             padding: "0.75rem",
             borderRadius: "0.5rem",
             boxShadow: a === "secondary" ? "0px 8px 16px -2px rgba(27, 33, 44, 0.12)" : null,
@@ -46482,11 +46483,11 @@ const Na = ({ stroke: e = "#000", ...t }) => /* @__PURE__ */ v.jsxs(
         },
         arrow: {
           sx: {
-            color: m
+            color: b
           }
         }
       },
-      children: /* @__PURE__ */ v.jsx(Fe, { children: e })
+      children: /* @__PURE__ */ v.jsx(Fe, { sx: { ...g }, children: e })
     }
   );
 }, Xx = ({
@@ -48374,36 +48375,43 @@ const SW = ({
       children: e == null ? void 0 : e.map((c, u) => {
         var b, w, S, O;
         const g = u === 0, m = u === e.length - 1;
-        return /* @__PURE__ */ v.jsx(pr, { title: (c == null ? void 0 : c.tooltip) || "", children: /* @__PURE__ */ v.jsxs(
-          Fe,
+        return /* @__PURE__ */ v.jsx(
+          pr,
           {
-            onClick: () => r == null ? void 0 : r(c.value),
-            direction: "row",
-            alignItems: "center",
-            sx: {
-              gap: "0.25rem",
-              padding: "0.4rem 0.75rem",
-              transition: "0.3s ease",
-              overflow: "hidden",
-              height: "100%",
-              borderRight: m ? "1px solid transparent" : `1px solid ${s.colors.surface2_lightgrey}`,
-              backgroundColor: t === c.value ? s.colors.surface2_lightgrey : s.palette.background.paper,
-              borderTopLeftRadius: g ? "0.625rem" : 0,
-              borderBottomLeftRadius: g ? "0.625rem" : 0,
-              borderTopRightRadius: m ? "0.625rem" : 0,
-              borderBottomRightRadius: m ? "0.625rem" : 0,
-              "&:hover": {
-                backgroundColor: s.colors.surface2_lightgrey
-              }
-            },
-            children: [
-              ((b = c.labelProps) == null ? void 0 : b.position) === "left" && /* @__PURE__ */ v.jsx(ot, { ...c == null ? void 0 : c.labelTypographyProps, children: (w = c.labelProps) == null ? void 0 : w.text }),
-              c.icon,
-              ((S = c.labelProps) == null ? void 0 : S.position) === "right" && /* @__PURE__ */ v.jsx(ot, { ...c == null ? void 0 : c.labelTypographyProps, children: (O = c.labelProps) == null ? void 0 : O.text })
-            ]
-          },
-          c.value
-        ) });
+            title: (c == null ? void 0 : c.tooltip) || "",
+            childrenSx: { height: "100%", width: "100%" },
+            children: /* @__PURE__ */ v.jsxs(
+              Fe,
+              {
+                onClick: () => r == null ? void 0 : r(c.value),
+                direction: "row",
+                alignItems: "center",
+                sx: {
+                  gap: "0.25rem",
+                  padding: "0.4rem 0.75rem",
+                  transition: "0.3s ease",
+                  overflow: "hidden",
+                  height: "100%",
+                  borderRight: m ? "1px solid transparent" : `1px solid ${s.colors.surface2_lightgrey}`,
+                  backgroundColor: t === c.value ? s.colors.surface2_lightgrey : s.palette.background.paper,
+                  borderTopLeftRadius: g ? "0.625rem" : 0,
+                  borderBottomLeftRadius: g ? "0.625rem" : 0,
+                  borderTopRightRadius: m ? "0.625rem" : 0,
+                  borderBottomRightRadius: m ? "0.625rem" : 0,
+                  "&:hover": {
+                    backgroundColor: s.colors.surface2_lightgrey
+                  }
+                },
+                children: [
+                  ((b = c.labelProps) == null ? void 0 : b.position) === "left" && /* @__PURE__ */ v.jsx(ot, { ...c == null ? void 0 : c.labelTypographyProps, children: (w = c.labelProps) == null ? void 0 : w.text }),
+                  c.icon,
+                  ((S = c.labelProps) == null ? void 0 : S.position) === "right" && /* @__PURE__ */ v.jsx(ot, { ...c == null ? void 0 : c.labelTypographyProps, children: (O = c.labelProps) == null ? void 0 : O.text })
+                ]
+              },
+              c.value
+            )
+          }
+        );
       })
     }
   );