@rehagro/ui 1.0.40 → 1.0.41

package/dist/native.mjs

@@ -1498,7 +1498,124 @@ var RadioGroup = forwardRef(function RadioGroup2({
     }
   );
 });
+var THICKNESS_MAP = {
+  xs: 2,
+  sm: 4,
+  md: 8,
+  lg: 12,
+  xl: 16
+};
+var PRESET_COLORS5 = /* @__PURE__ */ new Set([
+  "primary",
+  "secondary",
+  "danger",
+  "warning",
+  "success",
+  "info"
+]);
+var isPresetColor5 = (color) => PRESET_COLORS5.has(color);
+var resolveColor2 = (color, theme) => {
+  if (isPresetColor5(color)) {
+    return theme[color] ?? "#538CC6";
+  }
+  return color;
+};
+var resolveThickness = (thickness) => typeof thickness === "number" ? thickness : THICKNESS_MAP[thickness];
+var ProgressBar = forwardRef(function ProgressBar2({
+  value,
+  label,
+  variant = "inline",
+  thickness = "sm",
+  showPercentage = true,
+  color = "primary",
+  bgColor,
+  style
+}, ref) {
+  const theme = useRehagroTheme();
+  const clampedValue = Math.min(100, Math.max(0, value));
+  const heightPx = resolveThickness(thickness);
+  const resolvedBarColor = resolveColor2(color, theme);
+  const resolvedBgColor = bgColor ?? theme.border ?? "#E5E7EB";
+  const trackStyle = {
+    width: "100%",
+    height: heightPx,
+    borderRadius: 40,
+    overflow: "hidden",
+    backgroundColor: resolvedBgColor
+  };
+  const fillStyle = {
+    width: `${clampedValue}%`,
+    height: "100%",
+    borderRadius: 40,
+    backgroundColor: resolvedBarColor
+  };
+  const percentageTextStyle = {
+    fontSize: theme.fontSizeSm ?? 14,
+    color: theme.textMuted ?? "#9CA3AF",
+    ...theme.fontFamilyBody ? { fontFamily: theme.fontFamilyBody } : {}
+  };
+  if (variant === "stacked") {
+    return /* @__PURE__ */ jsxs(
+      View,
+      {
+        ref,
+        accessibilityRole: "progressbar",
+        accessibilityValue: { now: clampedValue, min: 0, max: 100 },
+        style: [{ flexDirection: "column", alignItems: "stretch", gap: 8 }, style],
+        children: [
+          (label || showPercentage) && /* @__PURE__ */ jsxs(
+            View,
+            {
+              style: {
+                flexDirection: "row",
+                justifyContent: "space-between",
+                alignItems: "flex-start",
+                width: "100%"
+              },
+              children: [
+                label ? /* @__PURE__ */ jsx(
+                  Text,
+                  {
+                    style: {
+                      flex: 1,
+                      fontSize: theme.fontSizeMd ?? 16,
+                      fontWeight: "700",
+                      color: theme.text ?? "#374151",
+                      ...theme.fontFamilyDisplay ? { fontFamily: theme.fontFamilyDisplay } : {}
+                    },
+                    children: label
+                  }
+                ) : /* @__PURE__ */ jsx(View, { style: { flex: 1 } }),
+                showPercentage && /* @__PURE__ */ jsxs(Text, { style: [percentageTextStyle, { textAlign: "right" }], children: [
+                  clampedValue,
+                  "%"
+                ] })
+              ]
+            }
+          ),
+          /* @__PURE__ */ jsx(View, { style: trackStyle, children: /* @__PURE__ */ jsx(View, { style: fillStyle }) })
+        ]
+      }
+    );
+  }
+  return /* @__PURE__ */ jsxs(
+    View,
+    {
+      ref,
+      accessibilityRole: "progressbar",
+      accessibilityValue: { now: clampedValue, min: 0, max: 100 },
+      style: [{ flexDirection: "row", alignItems: "center", gap: 8 }, style],
+      children: [
+        /* @__PURE__ */ jsx(View, { style: [trackStyle, { flex: 1, width: void 0 }], children: /* @__PURE__ */ jsx(View, { style: fillStyle }) }),
+        showPercentage && /* @__PURE__ */ jsxs(Text, { style: [percentageTextStyle, { minWidth: 40, textAlign: "right" }], children: [
+          clampedValue,
+          "%"
+        ] })
+      ]
+    }
+  );
+});
 
-export { ActivityIndicator3 as ActivityIndicator, Avatar, Button, Card2 as Card, CardContent, CardFooter, CardHeader, Checkbox, IconButton, Radio, RadioGroup, RadioOption, RehagroNativeProvider, Select, Tag, Text5 as Text, TextInput, useRehagroTheme };
+export { ActivityIndicator3 as ActivityIndicator, Avatar, Button, Card2 as Card, CardContent, CardFooter, CardHeader, Checkbox, IconButton, ProgressBar, Radio, RadioGroup, RadioOption, RehagroNativeProvider, Select, Tag, Text5 as Text, TextInput, useRehagroTheme };
 //# sourceMappingURL=native.mjs.map
 //# sourceMappingURL=native.mjs.map