react-native-platform-components 0.6.1 → 0.7.0

package/ios/PCSegmentedControl.mm

@@ -0,0 +1,194 @@
+// PCSegmentedControl.mm
+
+#import "PCSegmentedControl.h"
+
+#import <React/RCTComponentViewFactory.h>
+#import <React/RCTConversions.h>
+#import <React/RCTFabricComponentsPlugins.h>
+
+#import <react/renderer/components/PlatformComponentsViewSpec/ComponentDescriptors.h>
+#import <react/renderer/components/PlatformComponentsViewSpec/EventEmitters.h>
+#import <react/renderer/components/PlatformComponentsViewSpec/Props.h>
+#import <react/renderer/core/LayoutPrimitives.h>
+
+#if __has_include(<PlatformComponents/PlatformComponents-Swift.h>)
+#import <PlatformComponents/PlatformComponents-Swift.h>
+#else
+#import "PlatformComponents-Swift.h"
+#endif
+
+#import "PCSegmentedControlComponentDescriptors-custom.h"
+#import "PCSegmentedControlShadowNode-custom.h"
+#import "PCSegmentedControlState-custom.h"
+
+using namespace facebook::react;
+
+namespace {
+static inline bool SegmentsEqual(
+    const std::vector<facebook::react::PCSegmentedControlSegmentsStruct> &a,
+    const std::vector<facebook::react::PCSegmentedControlSegmentsStruct> &b) {
+  if (a.size() != b.size()) return false;
+  for (size_t i = 0; i < a.size(); i++) {
+    if (a[i].label != b[i].label) return false;
+    if (a[i].value != b[i].value) return false;
+    if (a[i].disabled != b[i].disabled) return false;
+    if (a[i].icon != b[i].icon) return false;
+  }
+  return true;
+}
+} // namespace
+
+@interface PCSegmentedControl ()
+
+- (void)updateMeasurements;
+
+@end
+
+@implementation PCSegmentedControl {
+  PCSegmentedControlView *_view;
+  MeasuringPCSegmentedControlShadowNode::ConcreteState::Shared _state;
+}
+
++ (ComponentDescriptorProvider)componentDescriptorProvider {
+  return concreteComponentDescriptorProvider<
+      MeasuringPCSegmentedControlComponentDescriptor>();
+}
+
+- (instancetype)initWithFrame:(CGRect)frame {
+  if (self = [super initWithFrame:frame]) {
+    _view = [PCSegmentedControlView new];
+    self.contentView = _view;
+
+    __weak __typeof(self) weakSelf = self;
+
+    _view.onSelect = ^(NSInteger index, NSString *value) {
+      __typeof(self) strongSelf = weakSelf;
+      if (!strongSelf) return;
+
+      auto eventEmitter =
+          std::static_pointer_cast<const PCSegmentedControlEventEmitter>(
+              strongSelf->_eventEmitter);
+      if (!eventEmitter) return;
+
+      PCSegmentedControlEventEmitter::OnSelect payload = {
+          .index = (int)index,
+          .value = value.UTF8String,
+      };
+
+      eventEmitter->onSelect(payload);
+    };
+  }
+  return self;
+}
+
+- (void)updateProps:(Props::Shared const &)props
+           oldProps:(Props::Shared const &)oldProps {
+  const auto &newProps =
+      *std::static_pointer_cast<const PCSegmentedControlProps>(props);
+  const auto prevProps =
+      std::static_pointer_cast<const PCSegmentedControlProps>(oldProps);
+
+  // segments: [{label, value, disabled, icon}]
+  if (!prevProps || !SegmentsEqual(newProps.segments, prevProps->segments)) {
+    NSMutableArray *arr = [NSMutableArray new];
+    for (const auto &seg : newProps.segments) {
+      NSString *label = seg.label.empty()
+                            ? @""
+                            : [NSString stringWithUTF8String:seg.label.c_str()];
+      NSString *value = seg.value.empty()
+                            ? @""
+                            : [NSString stringWithUTF8String:seg.value.c_str()];
+      NSString *disabled = seg.disabled.empty()
+                               ? @"enabled"
+                               : [NSString stringWithUTF8String:seg.disabled.c_str()];
+      NSString *icon = seg.icon.empty()
+                           ? @""
+                           : [NSString stringWithUTF8String:seg.icon.c_str()];
+      [arr addObject:@{
+        @"label": label,
+        @"value": value,
+        @"disabled": disabled,
+        @"icon": icon
+      }];
+    }
+    _view.segments = arr;
+  }
+
+  // selectedValue (default "")
+  if (!prevProps || newProps.selectedValue != prevProps->selectedValue) {
+    if (!newProps.selectedValue.empty()) {
+      _view.selectedValue =
+          [NSString stringWithUTF8String:newProps.selectedValue.c_str()];
+    } else {
+      _view.selectedValue = @""; // sentinel for no selection
+    }
+  }
+
+  // interactivity: "enabled" | "disabled"
+  if (!prevProps || newProps.interactivity != prevProps->interactivity) {
+    if (!newProps.interactivity.empty()) {
+      _view.interactivity =
+          [NSString stringWithUTF8String:newProps.interactivity.c_str()];
+    } else {
+      _view.interactivity = @"enabled";
+    }
+  }
+
+  // iOS-specific props
+  const auto &newIos = newProps.ios;
+  const auto &oldIos =
+      prevProps ? prevProps->ios : PCSegmentedControlIosStruct{};
+
+  if (!prevProps || newIos.momentary != oldIos.momentary) {
+    _view.momentary = (newIos.momentary == "true");
+  }
+
+  if (!prevProps || newIos.apportionsSegmentWidthsByContent != oldIos.apportionsSegmentWidthsByContent) {
+    _view.apportionsSegmentWidthsByContent = (newIos.apportionsSegmentWidthsByContent == "true");
+  }
+
+  if (!prevProps || newIos.selectedSegmentTintColor != oldIos.selectedSegmentTintColor) {
+    if (!newIos.selectedSegmentTintColor.empty()) {
+      _view.selectedSegmentTintColor =
+          [NSString stringWithUTF8String:newIos.selectedSegmentTintColor.c_str()];
+    } else {
+      _view.selectedSegmentTintColor = nil;
+    }
+  }
+
+  [super updateProps:props oldProps:oldProps];
+
+  // Update measurements when props change that affect layout
+  [self updateMeasurements];
+}
+
+#pragma mark - State (Measuring)
+
+- (void)updateState:(const State::Shared &)state
+           oldState:(const State::Shared &)oldState {
+  _state = std::static_pointer_cast<
+      const MeasuringPCSegmentedControlShadowNode::ConcreteState>(state);
+
+  if (oldState == nullptr) {
+    // First time: compute initial size.
+    [self updateMeasurements];
+  }
+
+  [super updateState:state oldState:oldState];
+}
+
+- (void)updateMeasurements {
+  if (_state == nullptr)
+    return;
+
+  // Use the real width Yoga gave us
+  const CGFloat w = self.bounds.size.width > 1 ? self.bounds.size.width : 320;
+
+  CGSize size = [_view sizeForLayoutWithConstrainedTo:CGSizeMake(w, 0)];
+
+  PCSegmentedControlStateFrameSize next;
+  next.frameSize = {(Float)size.width, (Float)size.height};
+  _state->updateState(std::move(next));
+}
+
+@end

package/ios/PCSegmentedControl.swift

@@ -0,0 +1,200 @@
+import UIKit
+
+// MARK: - Segment model (bridged from ObjC++ as dictionaries)
+
+struct PCSegmentedControlSegment {
+    let label: String
+    let value: String
+    let disabled: Bool
+    let icon: String
+}
+
+@objcMembers
+public final class PCSegmentedControlView: UIControl {
+    // MARK: - Props (set from ObjC++)
+
+    /// ObjC++ sets this as an array of dictionaries: [{label, value, disabled, icon}]
+    public var segments: [Any] = [] { didSet { rebuildControl() } }
+
+    /// Controlled selection by value. "" = no selection.
+    public var selectedValue: String = "" { didSet { updateSelection() } }
+
+    /// "enabled" | "disabled"
+    public var interactivity: String = "enabled" { didSet { updateEnabled() } }
+
+    /// iOS-specific: momentary mode (segment springs back after touch)
+    public var momentary: Bool = false { didSet { control.isMomentary = momentary } }
+
+    /// iOS-specific: segment widths proportional to content
+    public var apportionsSegmentWidthsByContent: Bool = false {
+        didSet { control.apportionsSegmentWidthsByContent = apportionsSegmentWidthsByContent }
+    }
+
+    /// iOS-specific: selected segment tint color (hex string)
+    public var selectedSegmentTintColor: String? { didSet { updateTintColor() } }
+
+    // MARK: - Events back to ObjC++
+
+    public var onSelect: ((Int, String) -> Void)?  // (index, value)
+
+    // MARK: - Internal
+
+    private let control = UISegmentedControl()
+    private var parsedSegments: [PCSegmentedControlSegment] = []
+
+    // MARK: - Init
+
+    public override init(frame: CGRect) {
+        super.init(frame: frame)
+        setup()
+    }
+
+    public required init?(coder: NSCoder) {
+        super.init(coder: coder)
+        setup()
+    }
+
+    private func setup() {
+        control.translatesAutoresizingMaskIntoConstraints = false
+        addSubview(control)
+
+        NSLayoutConstraint.activate([
+            control.topAnchor.constraint(equalTo: topAnchor),
+            control.bottomAnchor.constraint(equalTo: bottomAnchor),
+            control.leadingAnchor.constraint(equalTo: leadingAnchor),
+            control.trailingAnchor.constraint(equalTo: trailingAnchor),
+        ])
+
+        control.addTarget(self, action: #selector(valueChanged), for: .valueChanged)
+    }
+
+    @objc private func valueChanged() {
+        let index = control.selectedSegmentIndex
+        guard index != UISegmentedControl.noSegment,
+              index >= 0, index < parsedSegments.count else { return }
+
+        let segment = parsedSegments[index]
+        onSelect?(index, segment.value)
+    }
+
+    // MARK: - Props handling
+
+    private func rebuildControl() {
+        parsedSegments = segments.compactMap { any in
+            guard let dict = any as? [String: Any] else { return nil }
+            let label = (dict["label"] as? String) ?? ""
+            let value = (dict["value"] as? String) ?? ""
+            let disabled = (dict["disabled"] as? String) == "disabled"
+            let icon = (dict["icon"] as? String) ?? ""
+            return PCSegmentedControlSegment(
+                label: label,
+                value: value,
+                disabled: disabled,
+                icon: icon
+            )
+        }
+
+        control.removeAllSegments()
+
+        for (index, segment) in parsedSegments.enumerated() {
+            // Try to use SF Symbol icon if available
+            if !segment.icon.isEmpty,
+               let sfImage = UIImage(systemName: segment.icon) {
+                control.insertSegment(with: sfImage, at: index, animated: false)
+            } else {
+                control.insertSegment(withTitle: segment.label, at: index, animated: false)
+            }
+
+            // Set enabled state for this segment
+            control.setEnabled(!segment.disabled, forSegmentAt: index)
+        }
+
+        updateSelection()
+        invalidateIntrinsicContentSize()
+    }
+
+    private func updateSelection() {
+        if selectedValue.isEmpty {
+            control.selectedSegmentIndex = UISegmentedControl.noSegment
+        } else if let index = parsedSegments.firstIndex(where: { $0.value == selectedValue }) {
+            control.selectedSegmentIndex = index
+        } else {
+            control.selectedSegmentIndex = UISegmentedControl.noSegment
+        }
+    }
+
+    private func updateEnabled() {
+        let enabled = interactivity != "disabled"
+        control.isEnabled = enabled
+        alpha = enabled ? 1.0 : 0.5
+    }
+
+    private func updateTintColor() {
+        if let colorString = selectedSegmentTintColor, !colorString.isEmpty {
+            control.selectedSegmentTintColor = UIColor(hex: colorString)
+        } else {
+            control.selectedSegmentTintColor = nil
+        }
+    }
+
+    // MARK: - Sizing
+
+    public override func sizeThatFits(_ size: CGSize) -> CGSize {
+        let fitted = control.sizeThatFits(CGSize(width: size.width, height: .greatestFiniteMagnitude))
+        return CGSize(
+            width: size.width > 0 ? size.width : fitted.width,
+            height: max(PCConstants.minTouchTargetHeight, fitted.height)
+        )
+    }
+
+    public override var intrinsicContentSize: CGSize {
+        let fitted = control.intrinsicContentSize
+        return CGSize(
+            width: fitted.width,
+            height: max(PCConstants.minTouchTargetHeight, fitted.height)
+        )
+    }
+
+    /// Called by the measuring pipeline to get the size for Yoga layout.
+    @objc public func sizeForLayout(withConstrainedTo constrainedSize: CGSize) -> CGSize {
+        let fitted = control.sizeThatFits(
+            CGSize(width: constrainedSize.width > 0 ? constrainedSize.width : .greatestFiniteMagnitude,
+                   height: .greatestFiniteMagnitude)
+        )
+        return CGSize(
+            width: constrainedSize.width > 0 ? constrainedSize.width : fitted.width,
+            height: max(PCConstants.minTouchTargetHeight, fitted.height)
+        )
+    }
+}
+
+// MARK: - UIColor hex extension
+
+private extension UIColor {
+    convenience init?(hex: String) {
+        var hexSanitized = hex.trimmingCharacters(in: .whitespacesAndNewlines)
+        hexSanitized = hexSanitized.replacingOccurrences(of: "#", with: "")
+
+        var rgb: UInt64 = 0
+        guard Scanner(string: hexSanitized).scanHexInt64(&rgb) else { return nil }
+
+        let length = hexSanitized.count
+        if length == 6 {
+            self.init(
+                red: CGFloat((rgb & 0xFF0000) >> 16) / 255.0,
+                green: CGFloat((rgb & 0x00FF00) >> 8) / 255.0,
+                blue: CGFloat(rgb & 0x0000FF) / 255.0,
+                alpha: 1.0
+            )
+        } else if length == 8 {
+            self.init(
+                red: CGFloat((rgb & 0xFF000000) >> 24) / 255.0,
+                green: CGFloat((rgb & 0x00FF0000) >> 16) / 255.0,
+                blue: CGFloat((rgb & 0x0000FF00) >> 8) / 255.0,
+                alpha: CGFloat(rgb & 0x000000FF) / 255.0
+            )
+        } else {
+            return nil
+        }
+    }
+}

package/lib/commonjs/SegmentedControl.js

@@ -0,0 +1,93 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.SegmentedControl = SegmentedControl;
+var _react = _interopRequireWildcard(require("react"));
+var _reactNative = require("react-native");
+var _SegmentedControlNativeComponent = _interopRequireDefault(require("./SegmentedControlNativeComponent"));
+var _jsxRuntime = require("react/jsx-runtime");
+function _interopRequireDefault(e) { return e && e.__esModule ? e : { default: e }; }
+function _interopRequireWildcard(e, t) { if ("function" == typeof WeakMap) var r = new WeakMap(), n = new WeakMap(); return (_interopRequireWildcard = function (e, t) { if (!t && e && e.__esModule) return e; var o, i, f = { __proto__: null, default: e }; if (null === e || "object" != typeof e && "function" != typeof e) return f; if (o = t ? n : r) { if (o.has(e)) return o.get(e); o.set(e, f); } for (const t in e) "default" !== t && {}.hasOwnProperty.call(e, t) && ((i = (o = Object.defineProperty) && Object.getOwnPropertyDescriptor(e, t)) && (i.get || i.set) ? o(f, t, i) : f[t] = e[t]); return f; })(e, t); }
+// SegmentedControl.tsx
+
+// Android: Minimum height to ensure visibility.
+// Fabric's shadow node measurement isn't being called on initial render,
+// so we apply a minHeight that matches Material design touch target guidelines.
+const ANDROID_MIN_HEIGHT = 48;
+function normalizeSelectedValue(selected) {
+  return selected ?? '';
+}
+function SegmentedControl(props) {
+  const {
+    style,
+    segments,
+    selectedValue,
+    disabled,
+    onSelect,
+    ios,
+    android,
+    ...viewProps
+  } = props;
+
+  // Normalize segments for native
+  const nativeSegments = (0, _react.useMemo)(() => {
+    return segments.map(seg => ({
+      label: seg.label,
+      value: seg.value,
+      disabled: seg.disabled ? 'disabled' : 'enabled',
+      icon: seg.icon ?? ''
+    }));
+  }, [segments]);
+  const selectedData = (0, _react.useMemo)(() => normalizeSelectedValue(selectedValue), [selectedValue]);
+  const handleSelect = (0, _react.useCallback)(e => {
+    const {
+      index,
+      value
+    } = e.nativeEvent;
+    onSelect?.(value, index);
+  }, [onSelect]);
+
+  // Normalize iOS props to native string format
+  const nativeIos = (0, _react.useMemo)(() => {
+    if (!ios) return undefined;
+    return {
+      momentary: ios.momentary ? 'true' : 'false',
+      apportionsSegmentWidthsByContent: ios.apportionsSegmentWidthsByContent ? 'true' : 'false',
+      selectedSegmentTintColor: ios.selectedSegmentTintColor ?? ''
+    };
+  }, [ios]);
+
+  // Normalize Android props
+  const nativeAndroid = (0, _react.useMemo)(() => {
+    if (!android) return undefined;
+    return {
+      selectionRequired: android.selectionRequired ? 'true' : 'false'
+    };
+  }, [android]);
+
+  // Merge user style with Android minHeight default
+  const mergedStyle = (0, _react.useMemo)(() => {
+    if (_reactNative.Platform.OS === 'android') {
+      return [styles.androidDefault, style];
+    }
+    return style;
+  }, [style]);
+  return /*#__PURE__*/(0, _jsxRuntime.jsx)(_SegmentedControlNativeComponent.default, {
+    style: mergedStyle,
+    segments: nativeSegments,
+    selectedValue: selectedData,
+    interactivity: disabled ? 'disabled' : 'enabled',
+    onSelect: onSelect ? handleSelect : undefined,
+    ios: nativeIos,
+    android: nativeAndroid,
+    ...viewProps
+  });
+}
+const styles = _reactNative.StyleSheet.create({
+  androidDefault: {
+    minHeight: ANDROID_MIN_HEIGHT
+  }
+});
+//# sourceMappingURL=SegmentedControl.js.map

package/lib/commonjs/SegmentedControl.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["_react","_interopRequireWildcard","require","_reactNative","_SegmentedControlNativeComponent","_interopRequireDefault","_jsxRuntime","e","__esModule","default","t","WeakMap","r","n","o","i","f","__proto__","has","get","set","hasOwnProperty","call","Object","defineProperty","getOwnPropertyDescriptor","ANDROID_MIN_HEIGHT","normalizeSelectedValue","selected","SegmentedControl","props","style","segments","selectedValue","disabled","onSelect","ios","android","viewProps","nativeSegments","useMemo","map","seg","label","value","icon","selectedData","handleSelect","useCallback","index","nativeEvent","nativeIos","undefined","momentary","apportionsSegmentWidthsByContent","selectedSegmentTintColor","nativeAndroid","selectionRequired","mergedStyle","Platform","OS","styles","androidDefault","jsx","interactivity","StyleSheet","create","minHeight"],"sourceRoot":"../../src","sources":["SegmentedControl.tsx"],"mappings":"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","ignoreList":[]}

package/lib/commonjs/SegmentedControlNativeComponent.ts

@@ -0,0 +1,79 @@
+// SegmentedControlNativeComponent.ts
+import type { CodegenTypes, ViewProps } from 'react-native';
+import { codegenNativeComponent } from 'react-native';
+
+/**
+ * A single segment in the control.
+ */
+export type SegmentedControlSegment = Readonly<{
+  label: string;
+  value: string;
+  disabled: string; // 'enabled' | 'disabled'
+  icon: string; // SF Symbol (iOS) or drawable name (Android), empty = none
+}>;
+
+/**
+ * Event emitted when the user selects a segment.
+ */
+export type SegmentedControlSelectEvent = Readonly<{
+  /** Selected segment index */
+  index: CodegenTypes.Int32;
+
+  /** Selected segment value */
+  value: string;
+}>;
+
+/** Interactivity state (no booleans). */
+export type SegmentedControlInteractivity = 'enabled' | 'disabled';
+
+/**
+ * iOS-specific configuration.
+ */
+export type IOSProps = Readonly<{
+  /** Momentary mode: segment springs back after touch */
+  momentary?: string; // 'true' | 'false'
+
+  /** Whether segment widths are proportional to content */
+  apportionsSegmentWidthsByContent?: string; // 'true' | 'false'
+
+  /** Selected segment tint color (hex string) */
+  selectedSegmentTintColor?: string;
+}>;
+
+/**
+ * Android-specific configuration.
+ */
+export type AndroidProps = Readonly<{
+  /** Whether one segment must always be selected */
+  selectionRequired?: string; // 'true' | 'false'
+}>;
+
+export interface SegmentedControlProps extends ViewProps {
+  /**
+   * Segments to display.
+   */
+  segments: ReadonlyArray<SegmentedControlSegment>;
+
+  /**
+   * Controlled selection by `value`.
+   * Empty string means "no selection".
+   */
+  selectedValue?: CodegenTypes.WithDefault<string, ''>;
+
+  /**
+   * Enabled / disabled state.
+   */
+  interactivity?: string; // SegmentedControlInteractivity
+
+  /**
+   * Fired when the user selects a segment.
+   */
+  onSelect?: CodegenTypes.BubblingEventHandler<SegmentedControlSelectEvent>;
+
+  ios?: IOSProps;
+  android?: AndroidProps;
+}
+
+export default codegenNativeComponent<SegmentedControlProps>(
+  'PCSegmentedControl'
+);

package/lib/commonjs/index.js

@@ -36,6 +36,17 @@ Object.keys(_ContextMenu).forEach(function (key) {
     }
   });
 });
+var _SegmentedControl = require("./SegmentedControl");
+Object.keys(_SegmentedControl).forEach(function (key) {
+  if (key === "default" || key === "__esModule") return;
+  if (key in exports && exports[key] === _SegmentedControl[key]) return;
+  Object.defineProperty(exports, key, {
+    enumerable: true,
+    get: function () {
+      return _SegmentedControl[key];
+    }
+  });
+});
 var _sharedTypes = require("./sharedTypes");
 Object.keys(_sharedTypes).forEach(function (key) {
   if (key === "default" || key === "__esModule") return;

package/lib/commonjs/index.js.map

@@ -1 +1 @@
-{"version":3,"names":["_DatePicker","require","Object","keys","forEach","key","exports","defineProperty","enumerable","get","_SelectionMenu","_ContextMenu","_sharedTypes"],"sourceRoot":"../../src","sources":["index.tsx"],"mappings":";;;;;AAAA,IAAAA,WAAA,GAAAC,OAAA;AAAAC,MAAA,CAAAC,IAAA,CAAAH,WAAA,EAAAI,OAAA,WAAAC,GAAA;EAAA,IAAAA,GAAA,kBAAAA,GAAA;EAAA,IAAAA,GAAA,IAAAC,OAAA,IAAAA,OAAA,CAAAD,GAAA,MAAAL,WAAA,CAAAK,GAAA;EAAAH,MAAA,CAAAK,cAAA,CAAAD,OAAA,EAAAD,GAAA;IAAAG,UAAA;IAAAC,GAAA,WAAAA,CAAA;MAAA,OAAAT,WAAA,CAAAK,GAAA;IAAA;EAAA;AAAA;AACA,IAAAK,cAAA,GAAAT,OAAA;AAAAC,MAAA,CAAAC,IAAA,CAAAO,cAAA,EAAAN,OAAA,WAAAC,GAAA;EAAA,IAAAA,GAAA,kBAAAA,GAAA;EAAA,IAAAA,GAAA,IAAAC,OAAA,IAAAA,OAAA,CAAAD,GAAA,MAAAK,cAAA,CAAAL,GAAA;EAAAH,MAAA,CAAAK,cAAA,CAAAD,OAAA,EAAAD,GAAA;IAAAG,UAAA;IAAAC,GAAA,WAAAA,CAAA;MAAA,OAAAC,cAAA,CAAAL,GAAA;IAAA;EAAA;AAAA;AACA,IAAAM,YAAA,GAAAV,OAAA;AAAAC,MAAA,CAAAC,IAAA,CAAAQ,YAAA,EAAAP,OAAA,WAAAC,GAAA;EAAA,IAAAA,GAAA,kBAAAA,GAAA;EAAA,IAAAA,GAAA,IAAAC,OAAA,IAAAA,OAAA,CAAAD,GAAA,MAAAM,YAAA,CAAAN,GAAA;EAAAH,MAAA,CAAAK,cAAA,CAAAD,OAAA,EAAAD,GAAA;IAAAG,UAAA;IAAAC,GAAA,WAAAA,CAAA;MAAA,OAAAE,YAAA,CAAAN,GAAA;IAAA;EAAA;AAAA;AACA,IAAAO,YAAA,GAAAX,OAAA;AAAAC,MAAA,CAAAC,IAAA,CAAAS,YAAA,EAAAR,OAAA,WAAAC,GAAA;EAAA,IAAAA,GAAA,kBAAAA,GAAA;EAAA,IAAAA,GAAA,IAAAC,OAAA,IAAAA,OAAA,CAAAD,GAAA,MAAAO,YAAA,CAAAP,GAAA;EAAAH,MAAA,CAAAK,cAAA,CAAAD,OAAA,EAAAD,GAAA;IAAAG,UAAA;IAAAC,GAAA,WAAAA,CAAA;MAAA,OAAAG,YAAA,CAAAP,GAAA;IAAA;EAAA;AAAA","ignoreList":[]}
+{"version":3,"names":["_DatePicker","require","Object","keys","forEach","key","exports","defineProperty","enumerable","get","_SelectionMenu","_ContextMenu","_SegmentedControl","_sharedTypes"],"sourceRoot":"../../src","sources":["index.tsx"],"mappings":";;;;;AAAA,IAAAA,WAAA,GAAAC,OAAA;AAAAC,MAAA,CAAAC,IAAA,CAAAH,WAAA,EAAAI,OAAA,WAAAC,GAAA;EAAA,IAAAA,GAAA,kBAAAA,GAAA;EAAA,IAAAA,GAAA,IAAAC,OAAA,IAAAA,OAAA,CAAAD,GAAA,MAAAL,WAAA,CAAAK,GAAA;EAAAH,MAAA,CAAAK,cAAA,CAAAD,OAAA,EAAAD,GAAA;IAAAG,UAAA;IAAAC,GAAA,WAAAA,CAAA;MAAA,OAAAT,WAAA,CAAAK,GAAA;IAAA;EAAA;AAAA;AACA,IAAAK,cAAA,GAAAT,OAAA;AAAAC,MAAA,CAAAC,IAAA,CAAAO,cAAA,EAAAN,OAAA,WAAAC,GAAA;EAAA,IAAAA,GAAA,kBAAAA,GAAA;EAAA,IAAAA,GAAA,IAAAC,OAAA,IAAAA,OAAA,CAAAD,GAAA,MAAAK,cAAA,CAAAL,GAAA;EAAAH,MAAA,CAAAK,cAAA,CAAAD,OAAA,EAAAD,GAAA;IAAAG,UAAA;IAAAC,GAAA,WAAAA,CAAA;MAAA,OAAAC,cAAA,CAAAL,GAAA;IAAA;EAAA;AAAA;AACA,IAAAM,YAAA,GAAAV,OAAA;AAAAC,MAAA,CAAAC,IAAA,CAAAQ,YAAA,EAAAP,OAAA,WAAAC,GAAA;EAAA,IAAAA,GAAA,kBAAAA,GAAA;EAAA,IAAAA,GAAA,IAAAC,OAAA,IAAAA,OAAA,CAAAD,GAAA,MAAAM,YAAA,CAAAN,GAAA;EAAAH,MAAA,CAAAK,cAAA,CAAAD,OAAA,EAAAD,GAAA;IAAAG,UAAA;IAAAC,GAAA,WAAAA,CAAA;MAAA,OAAAE,YAAA,CAAAN,GAAA;IAAA;EAAA;AAAA;AACA,IAAAO,iBAAA,GAAAX,OAAA;AAAAC,MAAA,CAAAC,IAAA,CAAAS,iBAAA,EAAAR,OAAA,WAAAC,GAAA;EAAA,IAAAA,GAAA,kBAAAA,GAAA;EAAA,IAAAA,GAAA,IAAAC,OAAA,IAAAA,OAAA,CAAAD,GAAA,MAAAO,iBAAA,CAAAP,GAAA;EAAAH,MAAA,CAAAK,cAAA,CAAAD,OAAA,EAAAD,GAAA;IAAAG,UAAA;IAAAC,GAAA,WAAAA,CAAA;MAAA,OAAAG,iBAAA,CAAAP,GAAA;IAAA;EAAA;AAAA;AACA,IAAAQ,YAAA,GAAAZ,OAAA;AAAAC,MAAA,CAAAC,IAAA,CAAAU,YAAA,EAAAT,OAAA,WAAAC,GAAA;EAAA,IAAAA,GAAA,kBAAAA,GAAA;EAAA,IAAAA,GAAA,IAAAC,OAAA,IAAAA,OAAA,CAAAD,GAAA,MAAAQ,YAAA,CAAAR,GAAA;EAAAH,MAAA,CAAAK,cAAA,CAAAD,OAAA,EAAAD,GAAA;IAAAG,UAAA;IAAAC,GAAA,WAAAA,CAAA;MAAA,OAAAI,YAAA,CAAAR,GAAA;IAAA;EAAA;AAAA","ignoreList":[]}

package/lib/module/SegmentedControl.js

@@ -0,0 +1,87 @@
+"use strict";
+
+// SegmentedControl.tsx
+import React, { useCallback, useMemo } from 'react';
+import { Platform, StyleSheet } from 'react-native';
+import NativeSegmentedControl from './SegmentedControlNativeComponent';
+
+// Android: Minimum height to ensure visibility.
+// Fabric's shadow node measurement isn't being called on initial render,
+// so we apply a minHeight that matches Material design touch target guidelines.
+import { jsx as _jsx } from "react/jsx-runtime";
+const ANDROID_MIN_HEIGHT = 48;
+function normalizeSelectedValue(selected) {
+  return selected ?? '';
+}
+export function SegmentedControl(props) {
+  const {
+    style,
+    segments,
+    selectedValue,
+    disabled,
+    onSelect,
+    ios,
+    android,
+    ...viewProps
+  } = props;
+
+  // Normalize segments for native
+  const nativeSegments = useMemo(() => {
+    return segments.map(seg => ({
+      label: seg.label,
+      value: seg.value,
+      disabled: seg.disabled ? 'disabled' : 'enabled',
+      icon: seg.icon ?? ''
+    }));
+  }, [segments]);
+  const selectedData = useMemo(() => normalizeSelectedValue(selectedValue), [selectedValue]);
+  const handleSelect = useCallback(e => {
+    const {
+      index,
+      value
+    } = e.nativeEvent;
+    onSelect?.(value, index);
+  }, [onSelect]);
+
+  // Normalize iOS props to native string format
+  const nativeIos = useMemo(() => {
+    if (!ios) return undefined;
+    return {
+      momentary: ios.momentary ? 'true' : 'false',
+      apportionsSegmentWidthsByContent: ios.apportionsSegmentWidthsByContent ? 'true' : 'false',
+      selectedSegmentTintColor: ios.selectedSegmentTintColor ?? ''
+    };
+  }, [ios]);
+
+  // Normalize Android props
+  const nativeAndroid = useMemo(() => {
+    if (!android) return undefined;
+    return {
+      selectionRequired: android.selectionRequired ? 'true' : 'false'
+    };
+  }, [android]);
+
+  // Merge user style with Android minHeight default
+  const mergedStyle = useMemo(() => {
+    if (Platform.OS === 'android') {
+      return [styles.androidDefault, style];
+    }
+    return style;
+  }, [style]);
+  return /*#__PURE__*/_jsx(NativeSegmentedControl, {
+    style: mergedStyle,
+    segments: nativeSegments,
+    selectedValue: selectedData,
+    interactivity: disabled ? 'disabled' : 'enabled',
+    onSelect: onSelect ? handleSelect : undefined,
+    ios: nativeIos,
+    android: nativeAndroid,
+    ...viewProps
+  });
+}
+const styles = StyleSheet.create({
+  androidDefault: {
+    minHeight: ANDROID_MIN_HEIGHT
+  }
+});
+//# sourceMappingURL=SegmentedControl.js.map