manuo/dist/index.js

UI component library for React Native + NativeWind, mobile-first and platform-specific.

"use strict";
var __defProp = Object.defineProperty;
var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
var __getOwnPropNames = Object.getOwnPropertyNames;
var __hasOwnProp = Object.prototype.hasOwnProperty;
var __export = (target, all) => {
  for (var name in all)
    __defProp(target, name, { get: all[name], enumerable: true });
};
var __copyProps = (to, from, except, desc) => {
  if (from && typeof from === "object" || typeof from === "function") {
    for (let key of __getOwnPropNames(from))
      if (!__hasOwnProp.call(to, key) && key !== except)
        __defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });
  }
  return to;
};
var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);

// src/index.ts
var index_exports = {};
__export(index_exports, {
  Button: () => Button,
  ButtonAndroid: () => ButtonAndroid,
  ButtonIOS: () => ButtonIOS,
  Card: () => Card,
  CardAndroid: () => CardAndroid,
  CardIOS: () => CardIOS,
  ListItemAndroid: () => ListItemAndroid,
  ListItemIOS: () => ListItemIOS,
  ListSection: () => ListSection,
  ProgressBar: () => ProgressBar,
  SegmentedControl: () => SegmentedControl,
  SegmentedControlAndroid: () => SegmentedControlAndroid,
  SegmentedControlIOS: () => SegmentedControlIOS,
  TextDemo: () => TextDemo,
  cn: () => cn
});
module.exports = __toCommonJS(index_exports);

// src/nativeWindInterop.ts
var import_react_native = require("react-native");
var import_nativewind = require("nativewind");
(0, import_nativewind.cssInterop)(import_react_native.Text, { className: "style" });

// src/components/Button.tsx
var import_react_native4 = require("react-native");

// src/components/ios/ButtonIOS.tsx
var import_react_native2 = require("react-native");
var import_nativewind2 = require("nativewind");
var import_jsx_runtime = require("react/jsx-runtime");
var Text2 = (0, import_nativewind2.cssInterop)(import_react_native2.Text, { className: "style" });
var View = (0, import_nativewind2.cssInterop)(import_react_native2.View, { className: "style" });
var ButtonIOS = ({
  title,
  icon,
  onPress,
  className,
  textClassName,
  variant = "primary",
  loading = false,
  loaderColor,
  ...rest
}) => {
  const baseContainer = "px-4 py-2 min-w-[44px] min-h-[44px] rounded-xl flex-row items-center justify-center gap-2 active:opacity-70 transition";
  const variants = {
    primary: "bg-blue-500",
    secondary: "bg-white border border-blue-500",
    tonal: "bg-blue-100",
    plain: "bg-transparent"
  };
  const textStyles = {
    primary: "text-white text-xl font-semibold",
    // ⬅️ mai mare, bold
    secondary: "text-blue-500 text-xl font-medium",
    // ⬅️ mai mic, ca în poză
    tonal: "text-blue-700 text-base font-semibold",
    // ⬅️ ca primary, dar cu altă culoare
    plain: "text-blue-500 text-base font-medium"
    // ⬅️ subtil
  };
  const defaultLoaderColor = loaderColor ?? (variant === "primary" ? "#ffffff" : "#007AFF");
  return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
    import_react_native2.Pressable,
    {
      onPress,
      disabled: loading,
      accessibilityRole: "button",
      accessibilityLabel: title,
      ...rest,
      children: /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(View, { className: `${baseContainer} ${variants[variant]} ${className ?? ""}`, children: [
        loading ? /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_react_native2.ActivityIndicator, { size: "small", color: defaultLoaderColor }) : icon,
        !!title && /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
          Text2,
          {
            className: `${textStyles[variant]} ${textClassName ?? ""}`,
            children: title
          }
        )
      ] })
    }
  );
};

// src/components/android/ButtonAndroid.tsx
var import_react_native3 = require("react-native");
var import_nativewind3 = require("nativewind");
var import_jsx_runtime2 = require("react/jsx-runtime");
var Text3 = (0, import_nativewind3.cssInterop)(import_react_native3.Text, { className: "style" });
var View2 = (0, import_nativewind3.cssInterop)(import_react_native3.View, { className: "style" });
var ButtonAndroid = ({
  title,
  icon,
  onPress,
  className,
  textClassName,
  variant = "primary",
  loading = false,
  loaderColor
}) => {
  const baseContainer = "px-4 py-2 min-w-[48px] min-h-[48px] rounded-full flex-row items-center justify-center gap-2 overflow-hidden";
  const variants = {
    primary: "bg-blue-500",
    secondary: "bg-white border border-gray-400",
    tonal: "bg-blue-100",
    plain: "bg-transparent"
  };
  const textStyles = {
    primary: "text-white text-lg font-semibold uppercase",
    secondary: "text-black text-lg font-medium uppercase",
    tonal: "text-blue-800 text-base font-semibold uppercase",
    plain: "text-black text-base font-medium uppercase"
  };
  const defaultLoaderColor = loaderColor ?? (variant === "primary" ? "#fff" : "#2196F3");
  return /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(
    import_react_native3.TouchableNativeFeedback,
    {
      onPress,
      disabled: loading,
      background: import_react_native3.TouchableNativeFeedback.Ripple("#B0BEC5", false),
      children: /* @__PURE__ */ (0, import_jsx_runtime2.jsxs)(View2, { className: `${baseContainer} ${variants[variant]} ${className ?? ""}`, children: [
        loading ? /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(import_react_native3.ActivityIndicator, { size: "small", color: defaultLoaderColor }) : icon,
        !!title && /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(Text3, { className: `${textStyles[variant]} ${textClassName ?? ""}`, children: title })
      ] })
    }
  );
};

// src/components/Button.tsx
var import_jsx_runtime3 = require("react/jsx-runtime");
var Button = (props) => {
  const isIOS = import_react_native4.Platform.OS === "ios" || import_react_native4.Platform.OS === "web";
  return isIOS ? /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(ButtonIOS, { ...props }) : /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(ButtonAndroid, { ...props });
};

// src/components/TextDemo.tsx
var import_react_native5 = require("react-native");
var import_nativewind4 = require("nativewind");
var import_jsx_runtime4 = require("react/jsx-runtime");
var Text4 = (0, import_nativewind4.cssInterop)(import_react_native5.Text, { className: "style" });
var TextDemo = ({ children, className, ...props }) => {
  return /* @__PURE__ */ (0, import_jsx_runtime4.jsx)(Text4, { className: `text-base ${className ?? ""}`, ...props, children });
};

// src/utils/cn.ts
function cn(...classes) {
  return classes.filter(Boolean).join(" ");
}

// src/components/Card.tsx
var import_react_native8 = require("react-native");

// src/components/ios/CardIOS.tsx
var import_react_native6 = require("react-native");
var import_nativewind5 = require("nativewind");
var import_jsx_runtime5 = require("react/jsx-runtime");
var View3 = (0, import_nativewind5.cssInterop)(import_react_native6.View, { className: "style" });
var Text5 = (0, import_nativewind5.cssInterop)(import_react_native6.Text, { className: "style" });
var Image = (0, import_nativewind5.cssInterop)(import_react_native6.Image, { className: "style" });
var CardIOS = ({
  image,
  badge,
  title,
  subtitle,
  description,
  buttonLabel = "GET",
  icon,
  onPress,
  className
}) => {
  return /* @__PURE__ */ (0, import_jsx_runtime5.jsx)(import_react_native6.Pressable, { onPress, className: `rounded-2xl bg-white shadow-md ${className ?? ""}`, children: /* @__PURE__ */ (0, import_jsx_runtime5.jsxs)(View3, { className: "overflow-hidden rounded-2xl p-4", children: [
    badge && /* @__PURE__ */ (0, import_jsx_runtime5.jsx)(Text5, { className: "mb-2 rounded-full bg-gray-100 px-2 py-0.5 text-xs font-semibold uppercase text-gray-500 w-fit", children: badge }),
    image && /* @__PURE__ */ (0, import_jsx_runtime5.jsx)(
      Image,
      {
        source: { uri: image },
        className: "h-48 w-full rounded-xl mb-3",
        resizeMode: "cover"
      }
    ),
    /* @__PURE__ */ (0, import_jsx_runtime5.jsx)(Text5, { className: "text-xl font-bold text-black", children: title }),
    subtitle && /* @__PURE__ */ (0, import_jsx_runtime5.jsx)(Text5, { className: "text-sm text-gray-500", children: subtitle }),
    description && /* @__PURE__ */ (0, import_jsx_runtime5.jsx)(Text5, { className: "mt-1 text-sm text-gray-600", children: description }),
    /* @__PURE__ */ (0, import_jsx_runtime5.jsxs)(View3, { className: "mt-4 flex-row items-center justify-between", children: [
      /* @__PURE__ */ (0, import_jsx_runtime5.jsxs)(View3, { className: "flex-row items-center gap-2", children: [
        icon,
        !!subtitle && /* @__PURE__ */ (0, import_jsx_runtime5.jsxs)(View3, { children: [
          /* @__PURE__ */ (0, import_jsx_runtime5.jsx)(Text5, { className: "text-sm font-medium text-black", children: subtitle }),
          !!description && /* @__PURE__ */ (0, import_jsx_runtime5.jsx)(Text5, { className: "text-xs text-gray-400", children: description })
        ] })
      ] }),
      /* @__PURE__ */ (0, import_jsx_runtime5.jsx)(View3, { className: "rounded-full bg-blue-500 px-4 py-1.5", children: /* @__PURE__ */ (0, import_jsx_runtime5.jsx)(Text5, { className: "text-sm font-bold text-white", children: buttonLabel }) })
    ] })
  ] }) });
};

// src/components/android/CardAndroid.tsx
var import_react_native7 = require("react-native");
var import_nativewind6 = require("nativewind");
var import_jsx_runtime6 = require("react/jsx-runtime");
var View4 = (0, import_nativewind6.cssInterop)(import_react_native7.View, { className: "style" });
var Text6 = (0, import_nativewind6.cssInterop)(import_react_native7.Text, { className: "style" });
var Image2 = (0, import_nativewind6.cssInterop)(import_react_native7.Image, { className: "style" });
var CardAndroid = ({
  image,
  title,
  subtitle,
  description,
  buttonLabel = "Install",
  onPress,
  className,
  icon
}) => {
  return /* @__PURE__ */ (0, import_jsx_runtime6.jsx)(
    import_react_native7.TouchableNativeFeedback,
    {
      onPress,
      background: import_react_native7.TouchableNativeFeedback.Ripple("#E0E0E0", false),
      children: /* @__PURE__ */ (0, import_jsx_runtime6.jsxs)(View4, { className: `bg-white rounded-xl shadow-sm p-4 ${className ?? ""}`, children: [
        image && /* @__PURE__ */ (0, import_jsx_runtime6.jsx)(
          Image2,
          {
            source: { uri: image },
            className: "mb-4 h-40 w-full rounded-lg",
            resizeMode: "cover"
          }
        ),
        /* @__PURE__ */ (0, import_jsx_runtime6.jsx)(Text6, { className: "text-lg font-bold text-black", children: title }),
        !!subtitle && /* @__PURE__ */ (0, import_jsx_runtime6.jsx)(Text6, { className: "mt-0.5 text-xs uppercase text-gray-500 tracking-wider", children: subtitle }),
        !!description && /* @__PURE__ */ (0, import_jsx_runtime6.jsx)(Text6, { className: "mt-1 text-sm text-gray-600 leading-tight", children: description }),
        /* @__PURE__ */ (0, import_jsx_runtime6.jsxs)(View4, { className: "mt-4 flex-row items-center justify-between", children: [
          /* @__PURE__ */ (0, import_jsx_runtime6.jsxs)(View4, { className: "flex-row items-center gap-2", children: [
            icon,
            !!subtitle && /* @__PURE__ */ (0, import_jsx_runtime6.jsx)(Text6, { className: "text-xs text-gray-500", children: subtitle })
          ] }),
          /* @__PURE__ */ (0, import_jsx_runtime6.jsx)(View4, { className: "rounded-full bg-gray-100 px-4 py-1", children: /* @__PURE__ */ (0, import_jsx_runtime6.jsx)(Text6, { className: "text-sm font-semibold text-blue-600", children: buttonLabel }) })
        ] })
      ] })
    }
  );
};

// src/components/Card.tsx
var import_jsx_runtime7 = require("react/jsx-runtime");
var Card = (props) => {
  const isIOS = import_react_native8.Platform.OS === "ios" || import_react_native8.Platform.OS === "web";
  return isIOS ? /* @__PURE__ */ (0, import_jsx_runtime7.jsx)(CardIOS, { ...props }) : /* @__PURE__ */ (0, import_jsx_runtime7.jsx)(CardAndroid, { ...props });
};

// src/components/ListItem.tsx
var import_react_native11 = require("react-native");

// src/components/ios/ListItemIOS.tsx
var import_react_native9 = require("react-native");
var import_nativewind7 = require("nativewind");
var import_jsx_runtime8 = require("react/jsx-runtime");
var View5 = (0, import_nativewind7.cssInterop)(import_react_native9.View, { className: "style" });
var Text7 = (0, import_nativewind7.cssInterop)(import_react_native9.Text, { className: "style" });
var Image3 = (0, import_nativewind7.cssInterop)(import_react_native9.Image, { className: "style" });
var ListItemIOS = ({
  title,
  subtitle,
  rightText = "100+",
  icon,
  className,
  onPress
}) => {
  return /* @__PURE__ */ (0, import_jsx_runtime8.jsx)(import_react_native9.Pressable, { onPress, children: /* @__PURE__ */ (0, import_jsx_runtime8.jsxs)(View5, { className: `flex-row items-center justify-between bg-white px-4 py-3 ${className ?? ""}`, children: [
    /* @__PURE__ */ (0, import_jsx_runtime8.jsxs)(View5, { className: "flex-row items-center gap-3", children: [
      icon ?? /* @__PURE__ */ (0, import_jsx_runtime8.jsx)(View5, { className: "h-10 w-10 rounded-xl bg-blue-500" }),
      /* @__PURE__ */ (0, import_jsx_runtime8.jsxs)(View5, { children: [
        /* @__PURE__ */ (0, import_jsx_runtime8.jsx)(Text7, { className: "text-base font-semibold text-black", children: title }),
        /* @__PURE__ */ (0, import_jsx_runtime8.jsx)(Text7, { className: "text-sm text-gray-500", children: subtitle })
      ] })
    ] }),
    /* @__PURE__ */ (0, import_jsx_runtime8.jsx)(Text7, { className: "text-xs text-gray-500", children: rightText })
  ] }) });
};

// src/components/android/ListItemAndroid.tsx
var import_react_native10 = require("react-native");
var import_nativewind8 = require("nativewind");
var import_jsx_runtime9 = require("react/jsx-runtime");
var View6 = (0, import_nativewind8.cssInterop)(import_react_native10.View, { className: "style" });
var Text8 = (0, import_nativewind8.cssInterop)(import_react_native10.Text, { className: "style" });
var ListItemAndroid = ({
  title,
  subtitle,
  rightText = "100+",
  icon,
  className,
  onPress
}) => {
  return /* @__PURE__ */ (0, import_jsx_runtime9.jsx)(import_react_native10.TouchableNativeFeedback, { onPress, background: import_react_native10.TouchableNativeFeedback.Ripple("#E0E0E0", false), children: /* @__PURE__ */ (0, import_jsx_runtime9.jsxs)(View6, { className: `flex-row items-center justify-between bg-white px-4 py-3 border-b border-gray-100 ${className ?? ""}`, children: [
    /* @__PURE__ */ (0, import_jsx_runtime9.jsxs)(View6, { className: "flex-row items-center gap-3", children: [
      icon ?? /* @__PURE__ */ (0, import_jsx_runtime9.jsx)(View6, { className: "h-10 w-10 rounded-md bg-blue-500" }),
      /* @__PURE__ */ (0, import_jsx_runtime9.jsxs)(View6, { children: [
        /* @__PURE__ */ (0, import_jsx_runtime9.jsx)(Text8, { className: "text-sm font-semibold text-black", children: title }),
        /* @__PURE__ */ (0, import_jsx_runtime9.jsx)(Text8, { className: "text-xs text-gray-500", children: subtitle })
      ] })
    ] }),
    /* @__PURE__ */ (0, import_jsx_runtime9.jsx)(Text8, { className: "text-xs text-gray-500", children: rightText })
  ] }) });
};

// src/components/ListItem.tsx
var import_jsx_runtime10 = require("react/jsx-runtime");
var ListSection = ({
  sections,
  renderItem,
  sectionHeaderClassName
}) => {
  const renderDefaultItem = ({ item }) => import_react_native11.Platform.OS === "ios" ? /* @__PURE__ */ (0, import_jsx_runtime10.jsx)(ListItemIOS, { ...item }) : /* @__PURE__ */ (0, import_jsx_runtime10.jsx)(ListItemAndroid, { ...item });
  return /* @__PURE__ */ (0, import_jsx_runtime10.jsx)(
    import_react_native11.SectionList,
    {
      sections,
      keyExtractor: (item, index) => `${item.title}-${index}`,
      renderItem: renderItem ?? renderDefaultItem,
      renderSectionHeader: ({ section }) => /* @__PURE__ */ (0, import_jsx_runtime10.jsx)(
        import_react_native11.Text,
        {
          className: `text-xs uppercase font-bold text-gray-400 px-4 py-2 ${sectionHeaderClassName ?? ""}`,
          children: section.title
        }
      ),
      stickySectionHeadersEnabled: true,
      contentContainerStyle: { paddingBottom: 24 }
    }
  );
};

// src/components/ProgressIndicator.tsx
var import_react = require("react");
var import_react_native12 = require("react-native");
var import_nativewind9 = require("nativewind");
var import_jsx_runtime11 = require("react/jsx-runtime");
var View8 = (0, import_nativewind9.cssInterop)(import_react_native12.View, { className: "style" });
var Text10 = (0, import_nativewind9.cssInterop)(import_react_native12.Text, { className: "style" });
var AnimatedView = (0, import_nativewind9.cssInterop)(import_react_native12.Animated.View, { className: "style" });
var ProgressBar = ({
  progress,
  label = "Progress Indicator",
  className = "",
  barClassName = "",
  trackClassName = "",
  thickness = 5
}) => {
  const animatedWidth = (0, import_react.useRef)(new import_react_native12.Animated.Value(0)).current;
  (0, import_react.useEffect)(() => {
    import_react_native12.Animated.timing(animatedWidth, {
      toValue: progress,
      duration: 300,
      useNativeDriver: false
    }).start();
  }, [progress]);
  const widthInterpolation = animatedWidth.interpolate({
    inputRange: [0, 1],
    outputRange: ["0%", "100%"]
  });
  return /* @__PURE__ */ (0, import_jsx_runtime11.jsxs)(View8, { className: `w-full ${className}`, children: [
    !!label && /* @__PURE__ */ (0, import_jsx_runtime11.jsx)(Text10, { className: "mb-2 text-center text-xs font-medium text-gray-600", children: label }),
    /* @__PURE__ */ (0, import_jsx_runtime11.jsx)(
      View8,
      {
        style: { height: thickness },
        className: `w-full overflow-hidden rounded-full bg-gray-200 ${trackClassName}`,
        children: /* @__PURE__ */ (0, import_jsx_runtime11.jsx)(
          AnimatedView,
          {
            style: { width: widthInterpolation, height: thickness },
            className: `rounded-full bg-blue-500 ${barClassName}`
          }
        )
      }
    )
  ] });
};

// src/components/SegmentControl.tsx
var import_react_native15 = require("react-native");

// src/components/ios/SegmentedControlIOS.tsx
var import_react2 = require("react");
var import_react_native13 = require("react-native");
var import_nativewind10 = require("nativewind");
var import_jsx_runtime12 = require("react/jsx-runtime");
var View9 = (0, import_nativewind10.cssInterop)(import_react_native13.View, { className: "style" });
var Text11 = (0, import_nativewind10.cssInterop)(import_react_native13.Text, { className: "style" });
var AnimatedView2 = (0, import_nativewind10.cssInterop)(import_react_native13.Animated.View, { className: "style" });
var SegmentedControlIOS = ({
  options,
  selectedIndex = 0,
  onChange
}) => {
  const [containerWidth, setContainerWidth] = (0, import_react2.useState)(0);
  const [itemWidth, setItemWidth] = (0, import_react2.useState)(0);
  const translateX = (0, import_react2.useRef)(new import_react_native13.Animated.Value(0)).current;
  const [currentIndex, setCurrentIndex] = (0, import_react2.useState)(selectedIndex);
  (0, import_react2.useEffect)(() => {
    if (itemWidth === 0) return;
    animateToIndex(currentIndex, selectedIndex);
    setCurrentIndex(selectedIndex);
  }, [selectedIndex, itemWidth]);
  const animateToIndex = (from, to) => {
    const steps = Math.abs(to - from);
    const direction = to > from ? 1 : -1;
    const delay = 70;
    for (let i = 1; i <= steps; i++) {
      setTimeout(() => {
        import_react_native13.Animated.timing(translateX, {
          toValue: (from + i * direction) * itemWidth,
          duration: delay,
          useNativeDriver: false
        }).start();
      }, delay * i);
    }
  };
  const onContainerLayout = (e) => {
    const width = e.nativeEvent.layout.width;
    setContainerWidth(width);
    setItemWidth(width / options.length);
  };
  return /* @__PURE__ */ (0, import_jsx_runtime12.jsxs)(
    View9,
    {
      onLayout: onContainerLayout,
      className: "flex-row bg-[#f0f0f5] rounded-[12px] p-[2px] overflow-hidden",
      children: [
        itemWidth > 0 && /* @__PURE__ */ (0, import_jsx_runtime12.jsx)(
          AnimatedView2,
          {
            style: {
              width: itemWidth,
              transform: [{ translateX }]
            },
            className: "absolute top-[2px] bottom-[2px] left-0 rounded-[9px] bg-white shadow-sm z-0"
          }
        ),
        options.map((option, index) => {
          const isActive = index === currentIndex;
          return /* @__PURE__ */ (0, import_jsx_runtime12.jsx)(
            import_react_native13.Pressable,
            {
              onPress: () => onChange?.(index),
              className: `z-10 flex-1 items-center justify-center px-3 py-2 relative ${index !== 0 && index !== options.length - 1 ? "border-l border-gray-300" : ""}`,
              children: /* @__PURE__ */ (0, import_jsx_runtime12.jsx)(
                Text11,
                {
                  className: `text-base font-semibold ${isActive ? "text-black" : "text-gray-500"}`,
                  children: option
                }
              )
            },
            index
          );
        })
      ]
    }
  );
};

// src/components/android/SegmentedControlAndroid.tsx
var import_react_native14 = require("react-native");
var import_jsx_runtime13 = require("react/jsx-runtime");
var SegmentedControlAndroid = ({
  options,
  selectedIndex = 0,
  onChange
}) => {
  return /* @__PURE__ */ (0, import_jsx_runtime13.jsx)(
    import_react_native14.View,
    {
      style: {
        flexDirection: "row",
        borderWidth: 1,
        borderColor: "#D1D5DB",
        borderRadius: 24,
        overflow: "hidden"
      },
      children: options.map((option, index) => {
        const isFirst = index === 0;
        const isLast = index === options.length - 1;
        const isSelected = selectedIndex === index;
        return /* @__PURE__ */ (0, import_jsx_runtime13.jsx)(
          import_react_native14.Pressable,
          {
            onPress: () => onChange?.(index),
            style: {
              flex: 1,
              backgroundColor: isSelected ? "#E0F2FE" : "#fff",
              paddingVertical: 10,
              alignItems: "center",
              borderRightWidth: index < options.length - 1 ? 1 : 0,
              borderRightColor: "#D1D5DB",
              borderTopLeftRadius: isFirst ? 999 : 0,
              borderBottomLeftRadius: isFirst ? 999 : 0,
              borderTopRightRadius: isLast ? 999 : 0,
              borderBottomRightRadius: isLast ? 999 : 0
            },
            children: /* @__PURE__ */ (0, import_jsx_runtime13.jsx)(
              import_react_native14.Text,
              {
                style: {
                  fontSize: 14,
                  fontWeight: isSelected ? "600" : "400",
                  color: "#111827"
                },
                children: option
              }
            )
          },
          index
        );
      })
    }
  );
};

// src/components/SegmentControl.tsx
var import_jsx_runtime14 = require("react/jsx-runtime");
var SegmentedControl = (props) => {
  const isIOS = import_react_native15.Platform.OS === "ios" || import_react_native15.Platform.OS === "web";
  return isIOS ? /* @__PURE__ */ (0, import_jsx_runtime14.jsx)(SegmentedControlIOS, { ...props }) : /* @__PURE__ */ (0, import_jsx_runtime14.jsx)(SegmentedControlAndroid, { ...props });
};
// Annotate the CommonJS export names for ESM import in node:
0 && (module.exports = {
  Button,
  ButtonAndroid,
  ButtonIOS,
  Card,
  CardAndroid,
  CardIOS,
  ListItemAndroid,
  ListItemIOS,
  ListSection,
  ProgressBar,
  SegmentedControl,
  SegmentedControlAndroid,
  SegmentedControlIOS,
  TextDemo,
  cn
});