react-native-platform-components 0.8.9 → 0.9.0

package/lib/module/SegmentedControl.js

@@ -2,7 +2,7 @@
 
 // SegmentedControl.tsx
 import React, { useCallback, useMemo } from 'react';
-import { Platform, StyleSheet } from 'react-native';
+import { Image, Platform, StyleSheet } from 'react-native';
 import NativeSegmentedControl from './SegmentedControlNativeComponent';
 
 // Android: Minimum height to ensure visibility.
@@ -10,6 +10,101 @@ import NativeSegmentedControl from './SegmentedControlNativeComponent';
 // 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;
+
+/**
+ * A single icon source.
+ *
+ * - `string`: shorthand for an SF Symbol name on iOS and a drawable resource
+ *   name on Android (the original API).
+ * - `{ type: 'sfSymbol' }`: an SF Symbol. iOS only; ignored on Android.
+ * - `{ type: 'drawable' }`: a drawable from the app's `res/drawable`.
+ *   Android only; ignored on iOS.
+ * - `{ type: 'image' }`: an image asset (`require('./icon.png')`) or a
+ *   `{ uri }` source. Works on both platforms. Images are drawn as tinted
+ *   templates unless `tinted` is `false`.
+ */
+
+/**
+ * An icon for a segment: a single source used on both platforms, or a
+ * per-platform pair so callers don't need to branch on `Platform.OS`.
+ */
+
+/**
+ * How labels and icons combine for segments that have an icon.
+ *
+ * - `auto` (default): platform behavior. iOS shows the icon in place of the
+ *   label (UISegmentedControl cannot show both); Android shows icon and label.
+ * - `labeled`: always show the label. iOS drops the icon; Android shows both.
+ * - `unlabeled`: show only the icon. Segments without an icon still show
+ *   their label. Screen readers still announce the label on both platforms.
+ */
+
+/**
+ * Font for segment labels. Each field falls back to the platform default.
+ */
+
+/**
+ * Badge colors. Both default to the platform look (red with white text).
+ */
+
+const NO_ICON = {
+  iconType: '',
+  iconName: '',
+  iconUri: '',
+  iconScale: 1,
+  iconTinted: 'true'
+};
+function pickIconSource(icon) {
+  if (icon === undefined || typeof icon === 'string' || 'type' in icon) {
+    return icon;
+  }
+  return Platform.OS === 'ios' ? icon.ios : icon.android;
+}
+
+/**
+ * Flattens the public icon shape into the strings native expects, dropping
+ * sources that don't apply to the current platform.
+ */
+export function resolveSegmentIcon(icon) {
+  const source = pickIconSource(icon);
+  if (source === undefined) return NO_ICON;
+  if (typeof source === 'string') {
+    if (source.length === 0) return NO_ICON;
+    return {
+      ...NO_ICON,
+      iconType: Platform.OS === 'ios' ? 'sfSymbol' : 'drawable',
+      iconName: source
+    };
+  }
+  switch (source.type) {
+    case 'sfSymbol':
+      return Platform.OS === 'ios' ? {
+        ...NO_ICON,
+        iconType: 'sfSymbol',
+        iconName: source.name
+      } : NO_ICON;
+    case 'drawable':
+      return Platform.OS === 'android' ? {
+        ...NO_ICON,
+        iconType: 'drawable',
+        iconName: source.name
+      } : NO_ICON;
+    case 'image':
+      {
+        const resolved = Image.resolveAssetSource(source.source);
+        if (!resolved?.uri) return NO_ICON;
+        return {
+          iconType: 'image',
+          iconName: '',
+          iconUri: resolved.uri,
+          iconScale: resolved.scale > 0 ? resolved.scale : 1,
+          iconTinted: source.tinted === false ? 'false' : 'true'
+        };
+      }
+    default:
+      return NO_ICON;
+  }
+}
 function normalizeSelectedValue(selected) {
   return selected ?? '';
 }
@@ -19,7 +114,14 @@ export function SegmentedControl(props) {
     segments,
     selectedValue,
     disabled,
+    labelVisibility,
+    selectedSegmentColor,
+    activeTintColor,
+    inactiveTintColor,
+    labelStyle,
+    badgeStyle,
     onSelect,
+    onDeselect,
     ios,
     android,
     ...viewProps
@@ -31,7 +133,9 @@ export function SegmentedControl(props) {
       label: seg.label,
       value: seg.value,
       disabled: seg.disabled ? 'disabled' : 'enabled',
-      icon: seg.icon ?? ''
+      badge: seg.badge === undefined || seg.badge === null ? '' : String(seg.badge),
+      accessibilityLabel: seg.accessibilityLabel ?? '',
+      ...resolveSegmentIcon(seg.icon)
     }));
   }, [segments]);
   const selectedData = useMemo(() => normalizeSelectedValue(selectedValue), [selectedValue]);
@@ -40,24 +144,42 @@ export function SegmentedControl(props) {
       index,
       value
     } = e.nativeEvent;
+    // Native reports a cleared selection as index -1 with an empty value.
+    if (index < 0) {
+      onDeselect?.();
+      return;
+    }
     onSelect?.(value, index);
-  }, [onSelect]);
+  }, [onSelect, onDeselect]);
 
   // 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 ?? ''
+      apportionsSegmentWidthsByContent: ios.apportionsSegmentWidthsByContent ? 'true' : 'false'
     };
   }, [ios]);
 
+  // Deprecated iOS-only tint falls back to the cross-platform prop
+  const nativeSelectedSegmentColor = selectedSegmentColor ?? (Platform.OS === 'ios' ? ios?.selectedSegmentTintColor : undefined);
+
+  // Normalize the label font; empty / 0 means platform default
+  const nativeLabelStyle = useMemo(() => {
+    if (!labelStyle) return undefined;
+    return {
+      fontFamily: labelStyle.fontFamily ?? '',
+      fontSize: labelStyle.fontSize ?? 0,
+      fontWeight: labelStyle.fontWeight === undefined ? '' : String(labelStyle.fontWeight),
+      fontStyle: labelStyle.fontStyle ?? ''
+    };
+  }, [labelStyle]);
+
   // Normalize Android props
   const nativeAndroid = useMemo(() => {
     if (!android) return undefined;
     return {
-      selectionRequired: android.selectionRequired ? 'true' : 'false'
+      selectionRequired: android.selectionRequired === false ? 'false' : 'true'
     };
   }, [android]);
 
@@ -73,7 +195,16 @@ export function SegmentedControl(props) {
     segments: nativeSegments,
     selectedValue: selectedData,
     interactivity: disabled ? 'disabled' : 'enabled',
-    onSelect: onSelect ? handleSelect : undefined,
+    labelVisibility: labelVisibility ?? 'auto',
+    selectedSegmentColor: nativeSelectedSegmentColor,
+    activeTintColor: activeTintColor,
+    inactiveTintColor: inactiveTintColor,
+    androidRippleColor: android?.rippleColor,
+    androidStrokeColor: android?.strokeColor,
+    labelStyle: nativeLabelStyle,
+    badgeBackgroundColor: badgeStyle?.backgroundColor,
+    badgeTextColor: badgeStyle?.color,
+    onSelect: onSelect || onDeselect ? handleSelect : undefined,
     ios: nativeIos,
     android: nativeAndroid,
     ...viewProps

package/lib/module/SegmentedControl.js.map

@@ -1 +1 @@
-{"version":3,"names":["React","useCallback","useMemo","Platform","StyleSheet","NativeSegmentedControl","jsx","_jsx","ANDROID_MIN_HEIGHT","normalizeSelectedValue","selected","SegmentedControl","props","style","segments","selectedValue","disabled","onSelect","ios","android","viewProps","nativeSegments","map","seg","label","value","icon","selectedData","handleSelect","e","index","nativeEvent","nativeIos","undefined","momentary","apportionsSegmentWidthsByContent","selectedSegmentTintColor","nativeAndroid","selectionRequired","mergedStyle","OS","styles","androidDefault","interactivity","create","minHeight"],"sourceRoot":"../../src","sources":["SegmentedControl.tsx"],"mappings":"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","ignoreList":[]}
+{"version":3,"names":["React","useCallback","useMemo","Image","Platform","StyleSheet","NativeSegmentedControl","jsx","_jsx","ANDROID_MIN_HEIGHT","NO_ICON","iconType","iconName","iconUri","iconScale","iconTinted","pickIconSource","icon","undefined","OS","ios","android","resolveSegmentIcon","source","length","type","name","resolved","resolveAssetSource","uri","scale","tinted","normalizeSelectedValue","selected","SegmentedControl","props","style","segments","selectedValue","disabled","labelVisibility","selectedSegmentColor","activeTintColor","inactiveTintColor","labelStyle","badgeStyle","onSelect","onDeselect","viewProps","nativeSegments","map","seg","label","value","badge","String","accessibilityLabel","selectedData","handleSelect","e","index","nativeEvent","nativeIos","momentary","apportionsSegmentWidthsByContent","nativeSelectedSegmentColor","selectedSegmentTintColor","nativeLabelStyle","fontFamily","fontSize","fontWeight","fontStyle","nativeAndroid","selectionRequired","mergedStyle","styles","androidDefault","interactivity","androidRippleColor","rippleColor","androidStrokeColor","strokeColor","badgeBackgroundColor","backgroundColor","badgeTextColor","color","create","minHeight"],"sourceRoot":"../../src","sources":["SegmentedControl.tsx"],"mappings":"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","ignoreList":[]}

package/lib/module/SegmentedControlNativeComponent.ts

@@ -1,31 +1,59 @@
 // SegmentedControlNativeComponent.ts
-import type { CodegenTypes, ViewProps } from 'react-native';
+import type {
+  CodegenTypes,
+  ColorValue,
+  HostComponent,
+  ViewProps,
+} from 'react-native';
 import { codegenNativeComponent } from 'react-native';
 
 /**
  * A single segment in the control.
+ *
+ * Icons are pre-resolved on the JS side so native only deals with flat
+ * strings: `iconType` selects the source, `iconName` carries an SF Symbol or
+ * drawable name, and `iconUri` / `iconScale` carry a resolved image asset.
  */
 export type SegmentedControlSegment = Readonly<{
   label: string;
   value: string;
   disabled: string; // 'enabled' | 'disabled'
-  icon: string; // SF Symbol (iOS) or drawable name (Android), empty = none
+  iconType: string; // '' | 'sfSymbol' | 'drawable' | 'image'
+  iconName: string; // SF Symbol (iOS) or drawable resource name (Android)
+  iconUri: string; // Resolved image URI when iconType === 'image'
+  iconScale: CodegenTypes.Double; // Resolved image scale when iconType === 'image'
+  iconTinted: string; // 'true' | 'false' — draw the image as a tinted template
+  badge: string; // Badge text, empty = no badge
+  accessibilityLabel: string; // Screen-reader label, empty = use label
 }>;
 
 /**
  * Event emitted when the user selects a segment.
  */
 export type SegmentedControlSelectEvent = Readonly<{
-  /** Selected segment index */
+  /** Selected segment index. -1 means the selection was cleared. */
   index: CodegenTypes.Int32;
 
-  /** Selected segment value */
+  /** Selected segment value. Empty when the selection was cleared. */
   value: string;
 }>;
 
 /** Interactivity state (no booleans). */
 export type SegmentedControlInteractivity = 'enabled' | 'disabled';
 
+/** How labels and icons combine (no booleans). */
+export type SegmentedControlLabelVisibility = 'auto' | 'labeled' | 'unlabeled';
+
+/**
+ * Label font. Empty strings / 0 mean "platform default".
+ */
+export type LabelStyleProps = Readonly<{
+  fontFamily?: string;
+  fontSize?: CodegenTypes.Double;
+  fontWeight?: string; // 'normal' | 'bold' | '100'..'900'
+  fontStyle?: string; // 'normal' | 'italic'
+}>;
+
 /**
  * iOS-specific configuration.
  */
@@ -35,9 +63,6 @@ export type IOSProps = Readonly<{
 
   /** Whether segment widths are proportional to content */
   apportionsSegmentWidthsByContent?: string; // 'true' | 'false'
-
-  /** Selected segment tint color (hex string) */
-  selectedSegmentTintColor?: string;
 }>;
 
 /**
@@ -65,6 +90,35 @@ export interface SegmentedControlProps extends ViewProps {
    */
   interactivity?: string; // SegmentedControlInteractivity
 
+  /**
+   * How segment labels and icons combine.
+   */
+  labelVisibility?: string; // SegmentedControlLabelVisibility
+
+  /** Background of the selected segment. */
+  selectedSegmentColor?: ColorValue;
+
+  /** Text / icon color of the selected segment. */
+  activeTintColor?: ColorValue;
+
+  /** Text / icon color of unselected segments. */
+  inactiveTintColor?: ColorValue;
+
+  /** Android: ripple color when pressing a segment. */
+  androidRippleColor?: ColorValue;
+
+  /** Android: outline color of the segments. */
+  androidStrokeColor?: ColorValue;
+
+  /** Label font. */
+  labelStyle?: LabelStyleProps;
+
+  /** Badge background (default: system red). */
+  badgeBackgroundColor?: ColorValue;
+
+  /** Badge text color (default: white). */
+  badgeTextColor?: ColorValue;
+
   /**
    * Fired when the user selects a segment.
    */
@@ -76,4 +130,4 @@ export interface SegmentedControlProps extends ViewProps {
 
 export default codegenNativeComponent<SegmentedControlProps>(
   'PCSegmentedControl'
-);
+) as HostComponent<SegmentedControlProps>;

package/lib/module/SelectionMenuNativeComponent.ts

@@ -1,5 +1,5 @@
 // SelectionMenuNativeComponent.ts
-import type { CodegenTypes, ViewProps } from 'react-native';
+import type { CodegenTypes, HostComponent, ViewProps } from 'react-native';
 import { codegenNativeComponent } from 'react-native';
 
 /**
@@ -94,4 +94,6 @@ export interface SelectionMenuProps extends ViewProps {
   android?: AndroidProps;
 }
 
-export default codegenNativeComponent<SelectionMenuProps>('PCSelectionMenu');
+export default codegenNativeComponent<SelectionMenuProps>(
+  'PCSelectionMenu'
+) as HostComponent<SelectionMenuProps>;

package/lib/module/index.web.js.map

@@ -1 +1 @@
-{"version":3,"names":["React","Fragment","_Fragment","jsx","_jsx","DatePicker","_props","SelectionMenu","ContextMenu","children","SegmentedControl","LiquidGlass","isLiquidGlassSupported"],"sourceRoot":"../../src","sources":["index.web.tsx"],"mappings":";;AAAA;AACA;AACA;AACA;;AAEA,OAAOA,KAAK,MAAM,OAAO;;AAIzB;AACA;AACA;;AAMA;AACA;AACA;AAAA,SAAAC,QAAA,IAAAC,SAAA,EAAAC,GAAA,IAAAC,IAAA;AAoBA,OAAO,MAAMC,UAAU,GACrBC,MAAuB,IACO,IAAI;;AAEpC;AACA;AACA;;AAoBA,OAAO,MAAMC,aAAa,GACxBD,MAA0B,IACI,IAAI;;AAEpC;AACA;AACA;;AAgCA,OAAO,MAAME,WAAW,GAAGA,CAAC;EAC1BC;AACgB,CAAC,KAAgC;EACjD,oBAAOL,IAAA,CAAAF,SAAA;IAAAO,QAAA,EAAGA;EAAQ,CAAG,CAAC;AACxB,CAAC;;AAED;AACA;AACA;;AAkBA,OAAO,MAAMC,gBAAgB,GAC3BJ,MAA6B,IACC,IAAI;;AAEpC;AACA;AACA;;AASA,OAAO,MAAMK,WAAW,GAAGA,CAAC;EAC1BF;AACgB,CAAC,KAAgC;EACjD,oBAAOL,IAAA,CAAAF,SAAA;IAAAO,QAAA,EAAGA;EAAQ,CAAG,CAAC;AACxB,CAAC;AAED,OAAO,MAAMG,sBAAsB,GAAG,KAAK","ignoreList":[]}
+{"version":3,"names":["React","Fragment","_Fragment","jsx","_jsx","DatePicker","_props","SelectionMenu","ContextMenu","children","SegmentedControl","LiquidGlass","isLiquidGlassSupported"],"sourceRoot":"../../src","sources":["index.web.tsx"],"mappings":";;AAAA;AACA;AACA;AACA;;AAEA,OAAOA,KAAK,MAAM,OAAO;;AAIzB;AACA;AACA;;AAMA;AACA;AACA;AAAA,SAAAC,QAAA,IAAAC,SAAA,EAAAC,GAAA,IAAAC,IAAA;AAoBA,OAAO,MAAMC,UAAU,GACrBC,MAAuB,IACO,IAAI;;AAEpC;AACA;AACA;;AAoBA,OAAO,MAAMC,aAAa,GACxBD,MAA0B,IACI,IAAI;;AAEpC;AACA;AACA;;AAgCA,OAAO,MAAME,WAAW,GAAGA,CAAC;EAC1BC;AACgB,CAAC,KAAgC;EACjD,oBAAOL,IAAA,CAAAF,SAAA;IAAAO,QAAA,EAAGA;EAAQ,CAAG,CAAC;AACxB,CAAC;;AAED;AACA;AACA;;AAmDA,OAAO,MAAMC,gBAAgB,GAC3BJ,MAA6B,IACC,IAAI;;AAEpC;AACA;AACA;;AASA,OAAO,MAAMK,WAAW,GAAGA,CAAC;EAC1BF;AACgB,CAAC,KAAgC;EACjD,oBAAOL,IAAA,CAAAF,SAAA;IAAAO,QAAA,EAAGA;EAAQ,CAAG,CAAC;AACxB,CAAC;AAED,OAAO,MAAMG,sBAAsB,GAAG,KAAK","ignoreList":[]}

package/lib/typescript/commonjs/src/DatePickerNativeComponent.d.ts

@@ -1,4 +1,4 @@
-import type { CodegenTypes, ViewProps } from 'react-native';
+import type { CodegenTypes, HostComponent, ViewProps } from 'react-native';
 export type TimestampMs = CodegenTypes.Double;
 export type DateChangeEvent = {
     timestampMs: CodegenTypes.Double;
@@ -52,6 +52,6 @@ export interface NativeProps extends ViewProps, CommonProps {
     onConfirm?: CodegenTypes.BubblingEventHandler<DateChangeEvent>;
     onClosed?: CodegenTypes.BubblingEventHandler<Readonly<{}>>;
 }
-declare const _default: import("react-native/types_generated/Libraries/Utilities/codegenNativeComponent").NativeComponentType<NativeProps>;
+declare const _default: HostComponent<NativeProps>;
 export default _default;
 //# sourceMappingURL=DatePickerNativeComponent.d.ts.map

package/lib/typescript/commonjs/src/DatePickerNativeComponent.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"DatePickerNativeComponent.d.ts","sourceRoot":"","sources":["../../../../src/DatePickerNativeComponent.ts"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAE,YAAY,EAAE,SAAS,EAAE,MAAM,cAAc,CAAC;AAG5D,MAAM,MAAM,WAAW,GAAG,YAAY,CAAC,MAAM,CAAC;AAE9C,MAAM,MAAM,eAAe,GAAG;IAC5B,WAAW,EAAE,YAAY,CAAC,MAAM,CAAC;IACjC,SAAS,EAAE,OAAO,CAAC;CACpB,CAAC;AAEF,MAAM,MAAM,cAAc,GAAG,MAAM,GAAG,MAAM,GAAG,aAAa,GAAG,gBAAgB,CAAC;AAChF,MAAM,MAAM,sBAAsB,GAAG,OAAO,GAAG,UAAU,CAAC;AAE1D,MAAM,MAAM,kBAAkB,GAAG,WAAW,GAAG,SAAS,GAAG,QAAQ,GAAG,QAAQ,CAAC;AAC/E,MAAM,MAAM,yBAAyB,GAAG,SAAS,GAAG,OAAO,GAAG,SAAS,CAAC;AACxE,MAAM,MAAM,iBAAiB,GAAG,MAAM,GAAG,MAAM,CAAC;AAEhD,MAAM,MAAM,QAAQ,GAAG;IACrB,cAAc,CAAC,EAAE,MAAM,CAAC;IACxB,wBAAwB,CAAC,EAAE,YAAY,CAAC,MAAM,CAAC;IAC/C,cAAc,CAAC,EAAE,YAAY,CAAC,KAAK,CAAC;IACpC,sBAAsB,CAAC,EAAE,MAAM,CAAC;IAChC,cAAc,CAAC,EAAE,MAAM,CAAC;CACzB,CAAC;AAEF,MAAM,MAAM,YAAY,GAAG;IACzB,cAAc,CAAC,EAAE,YAAY,CAAC,KAAK,CAAC;IACpC,QAAQ,CAAC,EAAE,MAAM,CAAC;IAClB,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB,mBAAmB,CAAC,EAAE,MAAM,CAAC;IAC7B,mBAAmB,CAAC,EAAE,MAAM,CAAC;CAC9B,CAAC;AAEF,MAAM,MAAM,QAAQ,GAAG,QAAQ,CAAC,EAAE,CAAC,CAAC;AACpC,MAAM,MAAM,YAAY,GAAG,QAAQ,CAAC,EAAE,CAAC,CAAC;AACxC,MAAM,MAAM,UAAU,GAAG,QAAQ,CAAC,EAAE,CAAC,CAAC;AAEtC;;;;GAIG;AACH,MAAM,MAAM,WAAW,GAAG;IACxB,IAAI,CAAC,EAAE,MAAM,CAAC;IAEd,MAAM,CAAC,EAAE,YAAY,CAAC,WAAW,CAAC,WAAW,EAAE,CAAC,gBAAgB,CAAC,CAAC;IAClE,SAAS,CAAC,EAAE,YAAY,CAAC,WAAW,CAAC,WAAW,EAAE,CAAC,gBAAgB,CAAC,CAAC;IACrE,SAAS,CAAC,EAAE,YAAY,CAAC,WAAW,CAAC,WAAW,EAAE,CAAC,gBAAgB,CAAC,CAAC;IAErE,MAAM,CAAC,EAAE,MAAM,CAAC;IAChB,YAAY,CAAC,EAAE,MAAM,CAAC;IAEtB;;;OAGG;IACH,OAAO,CAAC,EAAE,MAAM,CAAC;IAEjB,8DAA8D;IAC9D,YAAY,CAAC,EAAE,MAAM,CAAC;CACvB,CAAC;AAEF,MAAM,WAAW,WAAY,SAAQ,SAAS,EAAE,WAAW;IACzD,GAAG,CAAC,EAAE,QAAQ,CAAC;IACf,OAAO,CAAC,EAAE,YAAY,CAAC;IAEvB,SAAS,CAAC,EAAE,YAAY,CAAC,oBAAoB,CAAC,eAAe,CAAC,CAAC;IAC/D,QAAQ,CAAC,EAAE,YAAY,CAAC,oBAAoB,CAAC,QAAQ,CAAC,EAAE,CAAC,CAAC,CAAC;CAC5D;;AAED,wBAAmE"}
+{"version":3,"file":"DatePickerNativeComponent.d.ts","sourceRoot":"","sources":["../../../../src/DatePickerNativeComponent.ts"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAE,YAAY,EAAE,aAAa,EAAE,SAAS,EAAE,MAAM,cAAc,CAAC;AAG3E,MAAM,MAAM,WAAW,GAAG,YAAY,CAAC,MAAM,CAAC;AAE9C,MAAM,MAAM,eAAe,GAAG;IAC5B,WAAW,EAAE,YAAY,CAAC,MAAM,CAAC;IACjC,SAAS,EAAE,OAAO,CAAC;CACpB,CAAC;AAEF,MAAM,MAAM,cAAc,GAAG,MAAM,GAAG,MAAM,GAAG,aAAa,GAAG,gBAAgB,CAAC;AAChF,MAAM,MAAM,sBAAsB,GAAG,OAAO,GAAG,UAAU,CAAC;AAE1D,MAAM,MAAM,kBAAkB,GAAG,WAAW,GAAG,SAAS,GAAG,QAAQ,GAAG,QAAQ,CAAC;AAC/E,MAAM,MAAM,yBAAyB,GAAG,SAAS,GAAG,OAAO,GAAG,SAAS,CAAC;AACxE,MAAM,MAAM,iBAAiB,GAAG,MAAM,GAAG,MAAM,CAAC;AAEhD,MAAM,MAAM,QAAQ,GAAG;IACrB,cAAc,CAAC,EAAE,MAAM,CAAC;IACxB,wBAAwB,CAAC,EAAE,YAAY,CAAC,MAAM,CAAC;IAC/C,cAAc,CAAC,EAAE,YAAY,CAAC,KAAK,CAAC;IACpC,sBAAsB,CAAC,EAAE,MAAM,CAAC;IAChC,cAAc,CAAC,EAAE,MAAM,CAAC;CACzB,CAAC;AAEF,MAAM,MAAM,YAAY,GAAG;IACzB,cAAc,CAAC,EAAE,YAAY,CAAC,KAAK,CAAC;IACpC,QAAQ,CAAC,EAAE,MAAM,CAAC;IAClB,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB,mBAAmB,CAAC,EAAE,MAAM,CAAC;IAC7B,mBAAmB,CAAC,EAAE,MAAM,CAAC;CAC9B,CAAC;AAEF,MAAM,MAAM,QAAQ,GAAG,QAAQ,CAAC,EAAE,CAAC,CAAC;AACpC,MAAM,MAAM,YAAY,GAAG,QAAQ,CAAC,EAAE,CAAC,CAAC;AACxC,MAAM,MAAM,UAAU,GAAG,QAAQ,CAAC,EAAE,CAAC,CAAC;AAEtC;;;;GAIG;AACH,MAAM,MAAM,WAAW,GAAG;IACxB,IAAI,CAAC,EAAE,MAAM,CAAC;IAEd,MAAM,CAAC,EAAE,YAAY,CAAC,WAAW,CAAC,WAAW,EAAE,CAAC,gBAAgB,CAAC,CAAC;IAClE,SAAS,CAAC,EAAE,YAAY,CAAC,WAAW,CAAC,WAAW,EAAE,CAAC,gBAAgB,CAAC,CAAC;IACrE,SAAS,CAAC,EAAE,YAAY,CAAC,WAAW,CAAC,WAAW,EAAE,CAAC,gBAAgB,CAAC,CAAC;IAErE,MAAM,CAAC,EAAE,MAAM,CAAC;IAChB,YAAY,CAAC,EAAE,MAAM,CAAC;IAEtB;;;OAGG;IACH,OAAO,CAAC,EAAE,MAAM,CAAC;IAEjB,8DAA8D;IAC9D,YAAY,CAAC,EAAE,MAAM,CAAC;CACvB,CAAC;AAEF,MAAM,WAAW,WAAY,SAAQ,SAAS,EAAE,WAAW;IACzD,GAAG,CAAC,EAAE,QAAQ,CAAC;IACf,OAAO,CAAC,EAAE,YAAY,CAAC;IAEvB,SAAS,CAAC,EAAE,YAAY,CAAC,oBAAoB,CAAC,eAAe,CAAC,CAAC;IAC/D,QAAQ,CAAC,EAAE,YAAY,CAAC,oBAAoB,CAAC,QAAQ,CAAC,EAAE,CAAC,CAAC,CAAC;CAC5D;wBAII,aAAa,CAAC,WAAW,CAAC;AAF/B,wBAEgC"}

package/lib/typescript/commonjs/src/SegmentedControl.d.ts

@@ -1,5 +1,63 @@
 import React from 'react';
-import { type ViewProps } from 'react-native';
+import { type ColorValue, type ImageRequireSource, type ImageURISource, type TextStyle, type ViewProps } from 'react-native';
+import { type SegmentedControlSegment as NativeSegment } from './SegmentedControlNativeComponent';
+/**
+ * A single icon source.
+ *
+ * - `string`: shorthand for an SF Symbol name on iOS and a drawable resource
+ *   name on Android (the original API).
+ * - `{ type: 'sfSymbol' }`: an SF Symbol. iOS only; ignored on Android.
+ * - `{ type: 'drawable' }`: a drawable from the app's `res/drawable`.
+ *   Android only; ignored on iOS.
+ * - `{ type: 'image' }`: an image asset (`require('./icon.png')`) or a
+ *   `{ uri }` source. Works on both platforms. Images are drawn as tinted
+ *   templates unless `tinted` is `false`.
+ */
+export type SegmentedControlIconSource = string | {
+    type: 'sfSymbol';
+    name: string;
+} | {
+    type: 'drawable';
+    name: string;
+} | {
+    type: 'image';
+    source: ImageRequireSource | ImageURISource;
+    tinted?: boolean;
+};
+/**
+ * An icon for a segment: a single source used on both platforms, or a
+ * per-platform pair so callers don't need to branch on `Platform.OS`.
+ */
+export type SegmentedControlIcon = SegmentedControlIconSource | {
+    ios?: SegmentedControlIconSource;
+    android?: SegmentedControlIconSource;
+};
+/**
+ * How labels and icons combine for segments that have an icon.
+ *
+ * - `auto` (default): platform behavior. iOS shows the icon in place of the
+ *   label (UISegmentedControl cannot show both); Android shows icon and label.
+ * - `labeled`: always show the label. iOS drops the icon; Android shows both.
+ * - `unlabeled`: show only the icon. Segments without an icon still show
+ *   their label. Screen readers still announce the label on both platforms.
+ */
+export type SegmentedControlLabelVisibility = 'auto' | 'labeled' | 'unlabeled';
+/**
+ * Font for segment labels. Each field falls back to the platform default.
+ */
+export interface SegmentedControlLabelStyle {
+    fontFamily?: string;
+    fontSize?: number;
+    fontWeight?: TextStyle['fontWeight'];
+    fontStyle?: 'normal' | 'italic';
+}
+/**
+ * Badge colors. Both default to the platform look (red with white text).
+ */
+export interface SegmentedControlBadgeStyle {
+    backgroundColor?: ColorValue;
+    color?: ColorValue;
+}
 export interface SegmentedControlSegmentProps {
     /** Display label for the segment */
     label: string;
@@ -7,8 +65,19 @@ export interface SegmentedControlSegmentProps {
     value: string;
     /** Whether this specific segment is disabled */
     disabled?: boolean;
-    /** Optional SF Symbol name (iOS) or drawable resource name (Android) */
-    icon?: string;
+    /** Optional icon. See {@link SegmentedControlIcon}. */
+    icon?: SegmentedControlIcon;
+    /**
+     * Badge shown at the segment's top-right corner, e.g. an unread count.
+     * Numbers are shown as-is; use `undefined` to hide the badge.
+     */
+    badge?: string | number;
+    /**
+     * Screen-reader label. Defaults to `label`.
+     * On iOS this applies to segments rendered as icons; text segments are
+     * announced by their title.
+     */
+    accessibilityLabel?: string;
 }
 export interface SegmentedControlProps extends ViewProps {
     /** Array of segments to display */
@@ -24,8 +93,32 @@ export interface SegmentedControlProps extends ViewProps {
      * @param index - The selected segment's index
      */
     onSelect?: (value: string, index: number) => void;
+    /**
+     * Called when the user clears the selection by tapping the selected segment.
+     * Only possible on Android with `android.selectionRequired` set to `false`;
+     * iOS never clears a selection from a tap.
+     */
+    onDeselect?: () => void;
     /** Whether the entire control is disabled */
     disabled?: boolean;
+    /**
+     * How labels and icons combine. Default: `'auto'`.
+     * See {@link SegmentedControlLabelVisibility}.
+     */
+    labelVisibility?: SegmentedControlLabelVisibility;
+    /**
+     * Background color of the selected segment.
+     * iOS: `selectedSegmentTintColor`. Android: checked button background.
+     */
+    selectedSegmentColor?: ColorValue;
+    /** Text and icon color of the selected segment. */
+    activeTintColor?: ColorValue;
+    /** Text and icon color of unselected segments. */
+    inactiveTintColor?: ColorValue;
+    /** Font for segment labels. See {@link SegmentedControlLabelStyle}. */
+    labelStyle?: SegmentedControlLabelStyle;
+    /** Colors for segment badges. See {@link SegmentedControlBadgeStyle}. */
+    badgeStyle?: SegmentedControlBadgeStyle;
     /**
      * iOS-specific configuration
      */
@@ -41,7 +134,7 @@ export interface SegmentedControlProps extends ViewProps {
          */
         apportionsSegmentWidthsByContent?: boolean;
         /**
-         * Selected segment tint color (hex string, e.g., "#007AFF")
+         * @deprecated Use `selectedSegmentColor`, which works on both platforms.
          */
         selectedSegmentTintColor?: string;
     };
@@ -50,13 +143,25 @@ export interface SegmentedControlProps extends ViewProps {
      */
     android?: {
         /**
-         * Whether one segment must always be selected.
-         * Default: false
+         * Whether one segment must always be selected. When `false`, tapping the
+         * selected segment clears the selection and calls `onDeselect`.
+         * Default: true (matches iOS, which cannot clear a selection by tapping)
          */
         selectionRequired?: boolean;
+        /** Ripple color shown while pressing a segment. */
+        rippleColor?: ColorValue;
+        /** Outline color of the segments. */
+        strokeColor?: ColorValue;
     };
     /** Test identifier */
     testID?: string;
 }
+type NativeIconFields = Pick<NativeSegment, 'iconType' | 'iconName' | 'iconUri' | 'iconScale' | 'iconTinted'>;
+/**
+ * Flattens the public icon shape into the strings native expects, dropping
+ * sources that don't apply to the current platform.
+ */
+export declare function resolveSegmentIcon(icon: SegmentedControlIcon | undefined): NativeIconFields;
 export declare function SegmentedControl(props: SegmentedControlProps): React.ReactElement;
+export {};
 //# sourceMappingURL=SegmentedControl.d.ts.map

package/lib/typescript/commonjs/src/SegmentedControl.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"SegmentedControl.d.ts","sourceRoot":"","sources":["../../../../src/SegmentedControl.tsx"],"names":[],"mappings":"AACA,OAAO,KAA+B,MAAM,OAAO,CAAC;AACpD,OAAO,EAIL,KAAK,SAAS,EAEf,MAAM,cAAc,CAAC;AAWtB,MAAM,WAAW,4BAA4B;IAC3C,oCAAoC;IACpC,KAAK,EAAE,MAAM,CAAC;IAEd,8CAA8C;IAC9C,KAAK,EAAE,MAAM,CAAC;IAEd,gDAAgD;IAChD,QAAQ,CAAC,EAAE,OAAO,CAAC;IAEnB,wEAAwE;IACxE,IAAI,CAAC,EAAE,MAAM,CAAC;CACf;AAED,MAAM,WAAW,qBAAsB,SAAQ,SAAS;IACtD,mCAAmC;IACnC,QAAQ,EAAE,SAAS,4BAA4B,EAAE,CAAC;IAElD;;;OAGG;IACH,aAAa,EAAE,MAAM,GAAG,IAAI,CAAC;IAE7B;;;;OAIG;IACH,QAAQ,CAAC,EAAE,CAAC,KAAK,EAAE,MAAM,EAAE,KAAK,EAAE,MAAM,KAAK,IAAI,CAAC;IAElD,6CAA6C;IAC7C,QAAQ,CAAC,EAAE,OAAO,CAAC;IAEnB;;OAEG;IACH,GAAG,CAAC,EAAE;QACJ;;;WAGG;QACH,SAAS,CAAC,EAAE,OAAO,CAAC;QAEpB;;;WAGG;QACH,gCAAgC,CAAC,EAAE,OAAO,CAAC;QAE3C;;WAEG;QACH,wBAAwB,CAAC,EAAE,MAAM,CAAC;KACnC,CAAC;IAEF;;OAEG;IACH,OAAO,CAAC,EAAE;QACR;;;WAGG;QACH,iBAAiB,CAAC,EAAE,OAAO,CAAC;KAC7B,CAAC;IAEF,sBAAsB;IACtB,MAAM,CAAC,EAAE,MAAM,CAAC;CACjB;AAMD,wBAAgB,gBAAgB,CAC9B,KAAK,EAAE,qBAAqB,GAC3B,KAAK,CAAC,YAAY,CA2EpB"}
+{"version":3,"file":"SegmentedControl.d.ts","sourceRoot":"","sources":["../../../../src/SegmentedControl.tsx"],"names":[],"mappings":"AACA,OAAO,KAA+B,MAAM,OAAO,CAAC;AACpD,OAAO,EAIL,KAAK,UAAU,EACf,KAAK,kBAAkB,EACvB,KAAK,cAAc,EAEnB,KAAK,SAAS,EACd,KAAK,SAAS,EAEf,MAAM,cAAc,CAAC;AAEtB,OAA+B,EAC7B,KAAK,uBAAuB,IAAI,aAAa,EAE9C,MAAM,mCAAmC,CAAC;AAO3C;;;;;;;;;;;GAWG;AACH,MAAM,MAAM,0BAA0B,GAClC,MAAM,GACN;IAAE,IAAI,EAAE,UAAU,CAAC;IAAC,IAAI,EAAE,MAAM,CAAA;CAAE,GAClC;IAAE,IAAI,EAAE,UAAU,CAAC;IAAC,IAAI,EAAE,MAAM,CAAA;CAAE,GAClC;IACE,IAAI,EAAE,OAAO,CAAC;IACd,MAAM,EAAE,kBAAkB,GAAG,cAAc,CAAC;IAC5C,MAAM,CAAC,EAAE,OAAO,CAAC;CAClB,CAAC;AAEN;;;GAGG;AACH,MAAM,MAAM,oBAAoB,GAC5B,0BAA0B,GAC1B;IACE,GAAG,CAAC,EAAE,0BAA0B,CAAC;IACjC,OAAO,CAAC,EAAE,0BAA0B,CAAC;CACtC,CAAC;AAEN;;;;;;;;GAQG;AACH,MAAM,MAAM,+BAA+B,GAAG,MAAM,GAAG,SAAS,GAAG,WAAW,CAAC;AAE/E;;GAEG;AACH,MAAM,WAAW,0BAA0B;IACzC,UAAU,CAAC,EAAE,MAAM,CAAC;IACpB,QAAQ,CAAC,EAAE,MAAM,CAAC;IAClB,UAAU,CAAC,EAAE,SAAS,CAAC,YAAY,CAAC,CAAC;IACrC,SAAS,CAAC,EAAE,QAAQ,GAAG,QAAQ,CAAC;CACjC;AAED;;GAEG;AACH,MAAM,WAAW,0BAA0B;IACzC,eAAe,CAAC,EAAE,UAAU,CAAC;IAC7B,KAAK,CAAC,EAAE,UAAU,CAAC;CACpB;AAED,MAAM,WAAW,4BAA4B;IAC3C,oCAAoC;IACpC,KAAK,EAAE,MAAM,CAAC;IAEd,8CAA8C;IAC9C,KAAK,EAAE,MAAM,CAAC;IAEd,gDAAgD;IAChD,QAAQ,CAAC,EAAE,OAAO,CAAC;IAEnB,uDAAuD;IACvD,IAAI,CAAC,EAAE,oBAAoB,CAAC;IAE5B;;;OAGG;IACH,KAAK,CAAC,EAAE,MAAM,GAAG,MAAM,CAAC;IAExB;;;;OAIG;IACH,kBAAkB,CAAC,EAAE,MAAM,CAAC;CAC7B;AAED,MAAM,WAAW,qBAAsB,SAAQ,SAAS;IACtD,mCAAmC;IACnC,QAAQ,EAAE,SAAS,4BAA4B,EAAE,CAAC;IAElD;;;OAGG;IACH,aAAa,EAAE,MAAM,GAAG,IAAI,CAAC;IAE7B;;;;OAIG;IACH,QAAQ,CAAC,EAAE,CAAC,KAAK,EAAE,MAAM,EAAE,KAAK,EAAE,MAAM,KAAK,IAAI,CAAC;IAElD;;;;OAIG;IACH,UAAU,CAAC,EAAE,MAAM,IAAI,CAAC;IAExB,6CAA6C;IAC7C,QAAQ,CAAC,EAAE,OAAO,CAAC;IAEnB;;;OAGG;IACH,eAAe,CAAC,EAAE,+BAA+B,CAAC;IAElD;;;OAGG;IACH,oBAAoB,CAAC,EAAE,UAAU,CAAC;IAElC,mDAAmD;IACnD,eAAe,CAAC,EAAE,UAAU,CAAC;IAE7B,kDAAkD;IAClD,iBAAiB,CAAC,EAAE,UAAU,CAAC;IAE/B,uEAAuE;IACvE,UAAU,CAAC,EAAE,0BAA0B,CAAC;IAExC,yEAAyE;IACzE,UAAU,CAAC,EAAE,0BAA0B,CAAC;IAExC;;OAEG;IACH,GAAG,CAAC,EAAE;QACJ;;;WAGG;QACH,SAAS,CAAC,EAAE,OAAO,CAAC;QAEpB;;;WAGG;QACH,gCAAgC,CAAC,EAAE,OAAO,CAAC;QAE3C;;WAEG;QACH,wBAAwB,CAAC,EAAE,MAAM,CAAC;KACnC,CAAC;IAEF;;OAEG;IACH,OAAO,CAAC,EAAE;QACR;;;;WAIG;QACH,iBAAiB,CAAC,EAAE,OAAO,CAAC;QAE5B,mDAAmD;QACnD,WAAW,CAAC,EAAE,UAAU,CAAC;QAEzB,qCAAqC;QACrC,WAAW,CAAC,EAAE,UAAU,CAAC;KAC1B,CAAC;IAEF,sBAAsB;IACtB,MAAM,CAAC,EAAE,MAAM,CAAC;CACjB;AAED,KAAK,gBAAgB,GAAG,IAAI,CAC1B,aAAa,EACb,UAAU,GAAG,UAAU,GAAG,SAAS,GAAG,WAAW,GAAG,YAAY,CACjE,CAAC;AAmBF;;;GAGG;AACH,wBAAgB,kBAAkB,CAChC,IAAI,EAAE,oBAAoB,GAAG,SAAS,GACrC,gBAAgB,CAoClB;AAMD,wBAAgB,gBAAgB,CAC9B,KAAK,EAAE,qBAAqB,GAC3B,KAAK,CAAC,YAAY,CAqHpB"}

package/lib/typescript/commonjs/src/SegmentedControlNativeComponent.d.ts

@@ -1,24 +1,45 @@
-import type { CodegenTypes, ViewProps } from 'react-native';
+import type { CodegenTypes, ColorValue, HostComponent, ViewProps } from 'react-native';
 /**
  * A single segment in the control.
+ *
+ * Icons are pre-resolved on the JS side so native only deals with flat
+ * strings: `iconType` selects the source, `iconName` carries an SF Symbol or
+ * drawable name, and `iconUri` / `iconScale` carry a resolved image asset.
  */
 export type SegmentedControlSegment = Readonly<{
     label: string;
     value: string;
     disabled: string;
-    icon: string;
+    iconType: string;
+    iconName: string;
+    iconUri: string;
+    iconScale: CodegenTypes.Double;
+    iconTinted: string;
+    badge: string;
+    accessibilityLabel: string;
 }>;
 /**
  * Event emitted when the user selects a segment.
  */
 export type SegmentedControlSelectEvent = Readonly<{
-    /** Selected segment index */
+    /** Selected segment index. -1 means the selection was cleared. */
     index: CodegenTypes.Int32;
-    /** Selected segment value */
+    /** Selected segment value. Empty when the selection was cleared. */
     value: string;
 }>;
 /** Interactivity state (no booleans). */
 export type SegmentedControlInteractivity = 'enabled' | 'disabled';
+/** How labels and icons combine (no booleans). */
+export type SegmentedControlLabelVisibility = 'auto' | 'labeled' | 'unlabeled';
+/**
+ * Label font. Empty strings / 0 mean "platform default".
+ */
+export type LabelStyleProps = Readonly<{
+    fontFamily?: string;
+    fontSize?: CodegenTypes.Double;
+    fontWeight?: string;
+    fontStyle?: string;
+}>;
 /**
  * iOS-specific configuration.
  */
@@ -27,8 +48,6 @@ export type IOSProps = Readonly<{
     momentary?: string;
     /** Whether segment widths are proportional to content */
     apportionsSegmentWidthsByContent?: string;
-    /** Selected segment tint color (hex string) */
-    selectedSegmentTintColor?: string;
 }>;
 /**
  * Android-specific configuration.
@@ -51,6 +70,26 @@ export interface SegmentedControlProps extends ViewProps {
      * Enabled / disabled state.
      */
     interactivity?: string;
+    /**
+     * How segment labels and icons combine.
+     */
+    labelVisibility?: string;
+    /** Background of the selected segment. */
+    selectedSegmentColor?: ColorValue;
+    /** Text / icon color of the selected segment. */
+    activeTintColor?: ColorValue;
+    /** Text / icon color of unselected segments. */
+    inactiveTintColor?: ColorValue;
+    /** Android: ripple color when pressing a segment. */
+    androidRippleColor?: ColorValue;
+    /** Android: outline color of the segments. */
+    androidStrokeColor?: ColorValue;
+    /** Label font. */
+    labelStyle?: LabelStyleProps;
+    /** Badge background (default: system red). */
+    badgeBackgroundColor?: ColorValue;
+    /** Badge text color (default: white). */
+    badgeTextColor?: ColorValue;
     /**
      * Fired when the user selects a segment.
      */
@@ -58,6 +97,6 @@ export interface SegmentedControlProps extends ViewProps {
     ios?: IOSProps;
     android?: AndroidProps;
 }
-declare const _default: import("react-native/types_generated/Libraries/Utilities/codegenNativeComponent").NativeComponentType<SegmentedControlProps>;
+declare const _default: HostComponent<SegmentedControlProps>;
 export default _default;
 //# sourceMappingURL=SegmentedControlNativeComponent.d.ts.map

package/lib/typescript/commonjs/src/SegmentedControlNativeComponent.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"SegmentedControlNativeComponent.d.ts","sourceRoot":"","sources":["../../../../src/SegmentedControlNativeComponent.ts"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAE,YAAY,EAAE,SAAS,EAAE,MAAM,cAAc,CAAC;AAG5D;;GAEG;AACH,MAAM,MAAM,uBAAuB,GAAG,QAAQ,CAAC;IAC7C,KAAK,EAAE,MAAM,CAAC;IACd,KAAK,EAAE,MAAM,CAAC;IACd,QAAQ,EAAE,MAAM,CAAC;IACjB,IAAI,EAAE,MAAM,CAAC;CACd,CAAC,CAAC;AAEH;;GAEG;AACH,MAAM,MAAM,2BAA2B,GAAG,QAAQ,CAAC;IACjD,6BAA6B;IAC7B,KAAK,EAAE,YAAY,CAAC,KAAK,CAAC;IAE1B,6BAA6B;IAC7B,KAAK,EAAE,MAAM,CAAC;CACf,CAAC,CAAC;AAEH,yCAAyC;AACzC,MAAM,MAAM,6BAA6B,GAAG,SAAS,GAAG,UAAU,CAAC;AAEnE;;GAEG;AACH,MAAM,MAAM,QAAQ,GAAG,QAAQ,CAAC;IAC9B,uDAAuD;IACvD,SAAS,CAAC,EAAE,MAAM,CAAC;IAEnB,yDAAyD;IACzD,gCAAgC,CAAC,EAAE,MAAM,CAAC;IAE1C,+CAA+C;IAC/C,wBAAwB,CAAC,EAAE,MAAM,CAAC;CACnC,CAAC,CAAC;AAEH;;GAEG;AACH,MAAM,MAAM,YAAY,GAAG,QAAQ,CAAC;IAClC,kDAAkD;IAClD,iBAAiB,CAAC,EAAE,MAAM,CAAC;CAC5B,CAAC,CAAC;AAEH,MAAM,WAAW,qBAAsB,SAAQ,SAAS;IACtD;;OAEG;IACH,QAAQ,EAAE,aAAa,CAAC,uBAAuB,CAAC,CAAC;IAEjD;;;OAGG;IACH,aAAa,CAAC,EAAE,YAAY,CAAC,WAAW,CAAC,MAAM,EAAE,EAAE,CAAC,CAAC;IAErD;;OAEG;IACH,aAAa,CAAC,EAAE,MAAM,CAAC;IAEvB;;OAEG;IACH,QAAQ,CAAC,EAAE,YAAY,CAAC,oBAAoB,CAAC,2BAA2B,CAAC,CAAC;IAE1E,GAAG,CAAC,EAAE,QAAQ,CAAC;IACf,OAAO,CAAC,EAAE,YAAY,CAAC;CACxB;;AAED,wBAEE"}
+{"version":3,"file":"SegmentedControlNativeComponent.d.ts","sourceRoot":"","sources":["../../../../src/SegmentedControlNativeComponent.ts"],"names":[],"mappings":"AACA,OAAO,KAAK,EACV,YAAY,EACZ,UAAU,EACV,aAAa,EACb,SAAS,EACV,MAAM,cAAc,CAAC;AAGtB;;;;;;GAMG;AACH,MAAM,MAAM,uBAAuB,GAAG,QAAQ,CAAC;IAC7C,KAAK,EAAE,MAAM,CAAC;IACd,KAAK,EAAE,MAAM,CAAC;IACd,QAAQ,EAAE,MAAM,CAAC;IACjB,QAAQ,EAAE,MAAM,CAAC;IACjB,QAAQ,EAAE,MAAM,CAAC;IACjB,OAAO,EAAE,MAAM,CAAC;IAChB,SAAS,EAAE,YAAY,CAAC,MAAM,CAAC;IAC/B,UAAU,EAAE,MAAM,CAAC;IACnB,KAAK,EAAE,MAAM,CAAC;IACd,kBAAkB,EAAE,MAAM,CAAC;CAC5B,CAAC,CAAC;AAEH;;GAEG;AACH,MAAM,MAAM,2BAA2B,GAAG,QAAQ,CAAC;IACjD,kEAAkE;IAClE,KAAK,EAAE,YAAY,CAAC,KAAK,CAAC;IAE1B,oEAAoE;IACpE,KAAK,EAAE,MAAM,CAAC;CACf,CAAC,CAAC;AAEH,yCAAyC;AACzC,MAAM,MAAM,6BAA6B,GAAG,SAAS,GAAG,UAAU,CAAC;AAEnE,kDAAkD;AAClD,MAAM,MAAM,+BAA+B,GAAG,MAAM,GAAG,SAAS,GAAG,WAAW,CAAC;AAE/E;;GAEG;AACH,MAAM,MAAM,eAAe,GAAG,QAAQ,CAAC;IACrC,UAAU,CAAC,EAAE,MAAM,CAAC;IACpB,QAAQ,CAAC,EAAE,YAAY,CAAC,MAAM,CAAC;IAC/B,UAAU,CAAC,EAAE,MAAM,CAAC;IACpB,SAAS,CAAC,EAAE,MAAM,CAAC;CACpB,CAAC,CAAC;AAEH;;GAEG;AACH,MAAM,MAAM,QAAQ,GAAG,QAAQ,CAAC;IAC9B,uDAAuD;IACvD,SAAS,CAAC,EAAE,MAAM,CAAC;IAEnB,yDAAyD;IACzD,gCAAgC,CAAC,EAAE,MAAM,CAAC;CAC3C,CAAC,CAAC;AAEH;;GAEG;AACH,MAAM,MAAM,YAAY,GAAG,QAAQ,CAAC;IAClC,kDAAkD;IAClD,iBAAiB,CAAC,EAAE,MAAM,CAAC;CAC5B,CAAC,CAAC;AAEH,MAAM,WAAW,qBAAsB,SAAQ,SAAS;IACtD;;OAEG;IACH,QAAQ,EAAE,aAAa,CAAC,uBAAuB,CAAC,CAAC;IAEjD;;;OAGG;IACH,aAAa,CAAC,EAAE,YAAY,CAAC,WAAW,CAAC,MAAM,EAAE,EAAE,CAAC,CAAC;IAErD;;OAEG;IACH,aAAa,CAAC,EAAE,MAAM,CAAC;IAEvB;;OAEG;IACH,eAAe,CAAC,EAAE,MAAM,CAAC;IAEzB,0CAA0C;IAC1C,oBAAoB,CAAC,EAAE,UAAU,CAAC;IAElC,iDAAiD;IACjD,eAAe,CAAC,EAAE,UAAU,CAAC;IAE7B,gDAAgD;IAChD,iBAAiB,CAAC,EAAE,UAAU,CAAC;IAE/B,qDAAqD;IACrD,kBAAkB,CAAC,EAAE,UAAU,CAAC;IAEhC,8CAA8C;IAC9C,kBAAkB,CAAC,EAAE,UAAU,CAAC;IAEhC,kBAAkB;IAClB,UAAU,CAAC,EAAE,eAAe,CAAC;IAE7B,8CAA8C;IAC9C,oBAAoB,CAAC,EAAE,UAAU,CAAC;IAElC,yCAAyC;IACzC,cAAc,CAAC,EAAE,UAAU,CAAC;IAE5B;;OAEG;IACH,QAAQ,CAAC,EAAE,YAAY,CAAC,oBAAoB,CAAC,2BAA2B,CAAC,CAAC;IAE1E,GAAG,CAAC,EAAE,QAAQ,CAAC;IACf,OAAO,CAAC,EAAE,YAAY,CAAC;CACxB;wBAII,aAAa,CAAC,qBAAqB,CAAC;AAFzC,wBAE0C"}