@onekeyfe/react-native-segment-slider 3.0.40

package/ios/HybridSegmentSlider.swift

@@ -0,0 +1,412 @@
+import Foundation
+import UIKit
+
+/// Native segmented slider. Renders the track, fill bar, segment marks, thumb
+/// and value bubble as CALayers and handles the drag gesture itself, so a drag
+/// never crosses the JS bridge per frame. Mirrors the web variant
+/// (`composite/SegmentSlider/index.tsx`) pixel-for-pixel.
+final class HybridSegmentSlider: HybridSegmentSliderSpec {
+
+  // MARK: - Geometry (points), identical to the web constants
+  private let thumbSize: CGFloat = 16
+  private let markSize: CGFloat = 10
+  private let haloRing: CGFloat = 4 // translucent halo width beyond each mark
+  private var inset: CGFloat { thumbSize / 2 }
+
+  // MARK: - HybridView
+  var view: UIView = SegmentSliderUIView()
+
+  // MARK: - Layers
+  private let trackLayer = CALayer()
+  private let fillLayer = CALayer()
+  private let thumbLayer = CALayer()
+  private var markLayers: [CALayer] = []
+  private let bubbleLayer = CALayer()
+  private let bubbleTextLayer = CATextLayer()
+  // Translucent highlight shown around the segment node the thumb is over while
+  // dragging (mobile analogue of the web mark hover halo). One shared layer,
+  // repositioned to the active node; below the marks so the node dot stays crisp.
+  private let haloLayer = CALayer()
+
+  // MARK: - Cached colors
+  private var cFill = UIColor.clear.cgColor
+  private var cTrack = UIColor.clear.cgColor
+  private var cThumb = UIColor.white.cgColor
+  private var cThumbBorder = UIColor.gray.cgColor
+  private var cMarkActive = UIColor.clear.cgColor
+  private var cMarkInactive = UIColor.white.cgColor
+  private var cMarkBorder = UIColor.gray.cgColor
+  private var cBubble = UIColor.black.cgColor
+  private var cBubbleText = UIColor.white.cgColor
+
+  // MARK: - Interaction state
+  private var currentValue: Double = 0
+  private var lastEmitted: Double = .nan
+  private var isDragging = false
+  private var hasLaidOut = false
+  // Segment node the thumb currently sits on (-1 = none). Drives the halo +
+  // a light haptic tick fired once each time the thumb enters a new node.
+  private var hoverMarkIndex = -1
+  private lazy var haptic = UIImpactFeedbackGenerator(style: .light)
+
+  // MARK: - Props (required props are non-optional in the generated spec)
+  var value: Double = 0 {
+    didSet {
+      // While dragging, the finger owns the value — ignore controlled updates
+      // (web skips its useLayoutEffect when draggingRef.current is true).
+      if !isDragging {
+        currentValue = value
+        applyVisual(value)
+      }
+    }
+  }
+  var min: Double = 0 { didSet { scheduleLayout() } }
+  var max: Double = 100 { didSet { scheduleLayout() } }
+  var segments: Double = 0 { didSet { scheduleLayout() } }
+  var sliderHeight: Double = 4 { didSet { scheduleLayout() } }
+  var disabled: Bool = false {
+    didSet {
+      view.alpha = disabled ? 0.5 : 1
+      view.isUserInteractionEnabled = !disabled
+    }
+  }
+  var showBubble: Bool = true { didSet { scheduleLayout() } }
+  var centerOrigin: Bool = false { didSet { scheduleLayout() } }
+  var epoch: Double = 0 { didSet { scheduleLayout() } }
+
+  var fillColor: String = "" {
+    didSet { cFill = parse(fillColor); fillLayer.backgroundColor = cFill; scheduleLayout() }
+  }
+  var trackColor: String = "" {
+    didSet { cTrack = parse(trackColor); trackLayer.backgroundColor = cTrack }
+  }
+  var thumbColor: String = "" {
+    didSet { cThumb = parse(thumbColor); thumbLayer.backgroundColor = cThumb }
+  }
+  var thumbBorderColor: String = "" {
+    didSet { cThumbBorder = parse(thumbBorderColor); thumbLayer.borderColor = cThumbBorder }
+  }
+  var markActiveColor: String = "" {
+    didSet { cMarkActive = parse(markActiveColor); scheduleLayout() }
+  }
+  var markInactiveColor: String = "" {
+    didSet { cMarkInactive = parse(markInactiveColor); scheduleLayout() }
+  }
+  var markBorderColor: String = "" {
+    didSet { cMarkBorder = parse(markBorderColor); scheduleLayout() }
+  }
+  var bubbleColor: String = "" {
+    didSet { cBubble = parse(bubbleColor); bubbleLayer.backgroundColor = cBubble }
+  }
+  var bubbleTextColor: String = "" {
+    didSet { cBubbleText = parse(bubbleTextColor); bubbleTextLayer.foregroundColor = cBubbleText }
+  }
+
+  // MARK: - Callbacks
+  var onChange: ((Double) -> Void)?
+  var onSlideStart: (() -> Void)?
+  var onSlideComplete: (() -> Void)?
+
+  // MARK: - Init
+  override init() {
+    super.init()
+    view.backgroundColor = .clear
+    view.isUserInteractionEnabled = true
+
+    trackLayer.cornerRadius = CGFloat(sliderHeight) / 2
+    fillLayer.cornerRadius = CGFloat(sliderHeight) / 2
+
+    thumbLayer.cornerRadius = thumbSize / 2
+    thumbLayer.borderWidth = 1
+    thumbLayer.shadowColor = UIColor.black.cgColor
+    thumbLayer.shadowOpacity = 0.08
+    thumbLayer.shadowRadius = 1
+    thumbLayer.shadowOffset = CGSize(width: 0, height: 1)
+
+    bubbleLayer.cornerRadius = 4
+    bubbleLayer.opacity = 0
+    bubbleTextLayer.contentsScale = UIScreen.main.scale
+    bubbleTextLayer.alignmentMode = .center
+    bubbleTextLayer.fontSize = 12
+    bubbleTextLayer.font = UIFont.systemFont(ofSize: 12, weight: .semibold)
+    bubbleLayer.addSublayer(bubbleTextLayer)
+
+    let haloSize = markSize + haloRing * 2
+    haloLayer.bounds = CGRect(x: 0, y: 0, width: haloSize, height: haloSize)
+    haloLayer.cornerRadius = haloSize / 2
+    haloLayer.opacity = 0
+
+    view.layer.addSublayer(trackLayer)
+    view.layer.addSublayer(fillLayer)
+    view.layer.addSublayer(thumbLayer)
+    view.layer.addSublayer(haloLayer)
+    view.layer.addSublayer(bubbleLayer)
+
+    if let v = view as? SegmentSliderUIView {
+      v.onLayout = { [weak self] in self?.performLayout() }
+      v.onTouchBegan = { [weak self] x in self?.handleTouchBegan(x) }
+      v.onTouchMoved = { [weak self] x in self?.handleTouchMoved(x) }
+      v.onTouchEnded = { [weak self] in self?.handleTouchEnded() }
+    }
+  }
+
+  // MARK: - Color helper
+  private func parse(_ s: String) -> CGColor {
+    SegmentSliderColorParser.parse(s).cgColor
+  }
+
+  private func scheduleLayout() {
+    view.setNeedsLayout()
+  }
+
+  // MARK: - Geometry helpers
+  private var trackWidth: CGFloat { Swift.max(view.bounds.width - thumbSize, 0) }
+  private var trackLeft: CGFloat { inset }
+  private var range: Double { let r = max - min; return r == 0 ? 1 : r }
+  private var markCount: Int { segments >= 1 ? Int(segments) + 1 : 0 }
+
+  /// value -> fraction 0..1
+  private func valueToFrac(_ v: Double) -> CGFloat {
+    let clamped = Swift.max(min, Swift.min(max, v))
+    return CGFloat((clamped - min) / range)
+  }
+
+  private func valueFromX(_ x: CGFloat) -> Double {
+    let w = trackWidth
+    if w <= 0 { return currentValue }
+    let clampedX = Swift.max(trackLeft, Swift.min(trackLeft + w, x))
+    let frac = Double((clampedX - trackLeft) / w)
+    return min + frac * (max - min)
+  }
+
+  // MARK: - Layout
+  private func performLayout() {
+    let bounds = view.bounds
+    guard bounds.width > 0 else { return }
+
+    syncMarkLayers(markCount)
+
+    let h = CGFloat(sliderHeight)
+    let trackTop = bounds.midY - h / 2
+
+    CATransaction.begin()
+    CATransaction.setDisableActions(true)
+
+    trackLayer.frame = CGRect(x: trackLeft, y: trackTop, width: trackWidth, height: h)
+    trackLayer.cornerRadius = h / 2
+    trackLayer.backgroundColor = cTrack
+    fillLayer.cornerRadius = h / 2
+
+    // Marks sit on the track line, centred vertically on it.
+    for i in 0..<markLayers.count {
+      let layer = markLayers[i]
+      let frac = markCount > 1 ? CGFloat(i) / CGFloat(markCount - 1) : 0
+      let cx = trackLeft + frac * trackWidth
+      layer.bounds = CGRect(x: 0, y: 0, width: markSize, height: markSize)
+      layer.position = CGPoint(x: cx, y: bounds.midY)
+      layer.cornerRadius = markSize / 2
+      layer.borderWidth = 1
+    }
+
+    // Thumb sizing (position set in applyVisual).
+    thumbLayer.bounds = CGRect(x: 0, y: 0, width: thumbSize, height: thumbSize)
+    thumbLayer.cornerRadius = thumbSize / 2
+    thumbLayer.backgroundColor = cThumb
+    thumbLayer.borderColor = cThumbBorder
+
+    CATransaction.commit()
+
+    hasLaidOut = true
+    applyVisual(currentValue)
+  }
+
+  private func syncMarkLayers(_ count: Int) {
+    if markLayers.count < count {
+      for _ in markLayers.count..<count {
+        let l = CALayer()
+        l.borderWidth = 1
+        // Marks render ABOVE the thumb + halo (web parity: mark zIndex 3 >
+        // thumb 2). So when the thumb sits on a segment node the node's dot
+        // shows through the thumb's centre — the "white ring + dark centre"
+        // bullseye look. Inserting above the halo keeps order
+        // track < fill < thumb < halo < marks < bubble.
+        view.layer.insertSublayer(l, above: haloLayer)
+        markLayers.append(l)
+      }
+    } else if markLayers.count > count {
+      for l in markLayers[count...] { l.removeFromSuperlayer() }
+      markLayers.removeLast(markLayers.count - count)
+    }
+  }
+
+  // MARK: - Visual application (no implicit animations)
+  private func applyVisual(_ v: Double) {
+    guard hasLaidOut, view.bounds.width > 0 else { return }
+    let bounds = view.bounds
+    let h = CGFloat(sliderHeight)
+    let trackTop = bounds.midY - h / 2
+    let frac = valueToFrac(v)
+    let thumbX = trackLeft + frac * trackWidth
+
+    CATransaction.begin()
+    CATransaction.setDisableActions(true)
+
+    // Fill bar.
+    if centerOrigin {
+      if v == 0 {
+        fillLayer.frame = CGRect(x: trackLeft, y: trackTop, width: 0, height: h)
+      } else {
+        let centerFrac = valueToFrac(0)
+        let leftFrac = Swift.min(frac, centerFrac)
+        let widthFrac = abs(frac - centerFrac)
+        fillLayer.frame = CGRect(
+          x: trackLeft + leftFrac * trackWidth, y: trackTop,
+          width: widthFrac * trackWidth, height: h)
+      }
+    } else {
+      fillLayer.frame = CGRect(
+        x: trackLeft, y: trackTop, width: frac * trackWidth, height: h)
+    }
+    fillLayer.backgroundColor = cFill
+
+    // Marks active states.
+    let centerFrac = valueToFrac(0)
+    for i in 0..<markLayers.count {
+      let markFrac = markLayers.count > 1 ? CGFloat(i) / CGFloat(markLayers.count - 1) : 0
+      var active: Bool
+      if centerOrigin {
+        if v == 0 {
+          active = false
+        } else if v > 0 {
+          active = markFrac > centerFrac && markFrac <= frac
+        } else {
+          active = markFrac >= frac && markFrac < centerFrac
+        }
+      } else {
+        active = markFrac <= frac
+      }
+      let layer = markLayers[i]
+      layer.backgroundColor = active ? cMarkActive : cMarkInactive
+      layer.borderColor = active ? cMarkActive : cMarkBorder
+    }
+
+    // Thumb position (keep current scale transform).
+    thumbLayer.position = CGPoint(x: thumbX, y: bounds.midY)
+
+    // Bubble.
+    if showBubble {
+      let text = "\(Int(v.rounded()))%"
+      bubbleTextLayer.string = text
+      let font = UIFont.systemFont(ofSize: 12, weight: .semibold)
+      let textW = (text as NSString)
+        .size(withAttributes: [.font: font]).width
+      let padH: CGFloat = 8
+      let bw = ceil(textW) + padH * 2
+      let bh: CGFloat = 20
+      let by = trackTop - 8 - bh
+      bubbleLayer.frame = CGRect(x: thumbX - bw / 2, y: by, width: bw, height: bh)
+      bubbleTextLayer.frame = CGRect(x: 0, y: 2, width: bw, height: 16)
+    }
+
+    CATransaction.commit()
+
+    updateHover(thumbX: thumbX)
+  }
+
+  // MARK: - Node halo + haptic (mobile analogue of the web mark hover)
+  /// Highlights the node the thumb is over and fires a light haptic tick once
+  /// per node entered. Only while dragging — controlled value syncs just keep
+  /// the halo hidden. Does NOT snap the value (parity with web/perp).
+  private func updateHover(thumbX: CGFloat) {
+    guard isDragging, markCount > 0 else {
+      if hoverMarkIndex != -1 { hoverMarkIndex = -1; setHalo(visible: false, index: 0) }
+      return
+    }
+    let threshold: CGFloat = 12 // half of the 24pt mark hit area
+    var best = -1
+    var bestDist = threshold
+    for i in 0..<markCount {
+      let frac = markCount > 1 ? CGFloat(i) / CGFloat(markCount - 1) : 0
+      let mx = trackLeft + frac * trackWidth
+      let d = abs(thumbX - mx)
+      if d <= bestDist { bestDist = d; best = i }
+    }
+    guard best != hoverMarkIndex else { return }
+    hoverMarkIndex = best
+    if best == -1 {
+      setHalo(visible: false, index: 0)
+    } else {
+      setHalo(visible: true, index: best)
+      haptic.impactOccurred(intensity: 0.6)
+      haptic.prepare()
+    }
+  }
+
+  private func setHalo(visible: Bool, index: Int) {
+    CATransaction.begin()
+    CATransaction.setDisableActions(true)
+    if visible {
+      let frac = markCount > 1 ? CGFloat(index) / CGFloat(markCount - 1) : 0
+      let mx = trackLeft + frac * trackWidth
+      haloLayer.position = CGPoint(x: mx, y: view.bounds.midY)
+      haloLayer.backgroundColor = UIColor(cgColor: cMarkActive)
+        .withAlphaComponent(0.25).cgColor
+      haloLayer.opacity = 1
+    } else {
+      haloLayer.opacity = 0
+    }
+    CATransaction.commit()
+  }
+
+  // MARK: - Touch handling
+  private func handleTouchBegan(_ x: CGFloat) {
+    guard !disabled else { return }
+    isDragging = true
+    haptic.prepare()
+    onSlideStart?()
+    animateThumbScale(1.15)
+    setBubbleVisible(true)
+    setValue(valueFromX(x))
+  }
+
+  private func handleTouchMoved(_ x: CGFloat) {
+    guard isDragging else { return }
+    setValue(valueFromX(x))
+  }
+
+  private func handleTouchEnded() {
+    guard isDragging else { return }
+    isDragging = false
+    hoverMarkIndex = -1
+    setHalo(visible: false, index: 0)
+    animateThumbScale(1.0)
+    setBubbleVisible(false)
+    onSlideComplete?()
+  }
+
+  private func setValue(_ raw: Double) {
+    let clamped = Swift.max(min, Swift.min(max, raw))
+    let rounded = clamped.rounded()
+    currentValue = rounded
+    applyVisual(rounded)
+    if rounded != lastEmitted {
+      lastEmitted = rounded
+      onChange?(rounded)
+    }
+  }
+
+  private func animateThumbScale(_ s: CGFloat) {
+    CATransaction.begin()
+    CATransaction.setAnimationDuration(0.12)
+    thumbLayer.transform = CATransform3DMakeScale(s, s, 1)
+    CATransaction.commit()
+  }
+
+  private func setBubbleVisible(_ visible: Bool) {
+    guard showBubble else { return }
+    CATransaction.begin()
+    CATransaction.setAnimationDuration(0.15)
+    bubbleLayer.opacity = visible ? 1 : 0
+    CATransaction.commit()
+  }
+}

package/ios/SegmentSliderColorParser.swift

@@ -0,0 +1,152 @@
+import Foundation
+import UIKit
+
+/// Parses a color string coming from JS. Supports:
+///   - `#rgb`, `#rrggbb`, `#rrggbbaa`
+///   - `rgb(r, g, b)` / `rgba(r, g, b, a)` where a is 0..1
+/// Falls back to `fallback` on parse failure.
+enum SegmentSliderColorParser {
+  static func parse(_ value: String?, fallback: UIColor = .clear) -> UIColor {
+    guard let raw = value?.trimmingCharacters(in: .whitespacesAndNewlines),
+          !raw.isEmpty else {
+      return fallback
+    }
+
+    if raw.hasPrefix("#") {
+      return parseHex(raw) ?? fallback
+    }
+    if raw.lowercased().hasPrefix("rgb") {
+      return parseRGB(raw) ?? fallback
+    }
+    return fallback
+  }
+
+  private static func parseHex(_ hex: String) -> UIColor? {
+    var s = hex
+    s.removeFirst() // '#'
+
+    // Expand shorthand #rgb -> #rrggbb
+    if s.count == 3 {
+      s = s.map { "\($0)\($0)" }.joined()
+    }
+
+    guard s.count == 6 || s.count == 8 else { return nil }
+    var int: UInt64 = 0
+    guard Scanner(string: s).scanHexInt64(&int) else { return nil }
+
+    let r, g, b, a: CGFloat
+    if s.count == 8 {
+      r = CGFloat((int >> 24) & 0xFF) / 255.0
+      g = CGFloat((int >> 16) & 0xFF) / 255.0
+      b = CGFloat((int >> 8) & 0xFF) / 255.0
+      a = CGFloat(int & 0xFF) / 255.0
+    } else {
+      r = CGFloat((int >> 16) & 0xFF) / 255.0
+      g = CGFloat((int >> 8) & 0xFF) / 255.0
+      b = CGFloat(int & 0xFF) / 255.0
+      a = 1.0
+    }
+    return UIColor(red: r, green: g, blue: b, alpha: a)
+  }
+
+  private static func parseRGB(_ value: String) -> UIColor? {
+    guard let open = value.firstIndex(of: "("),
+          let close = value.firstIndex(of: ")") else { return nil }
+    let inner = value[value.index(after: open)..<close]
+    let parts = inner.split(separator: ",").map {
+      $0.trimmingCharacters(in: .whitespaces)
+    }
+    guard parts.count >= 3,
+          let r = Double(parts[0]),
+          let g = Double(parts[1]),
+          let b = Double(parts[2]) else { return nil }
+    let a = parts.count >= 4 ? (Double(parts[3]) ?? 1.0) : 1.0
+    return UIColor(
+      red: CGFloat(r) / 255.0,
+      green: CGFloat(g) / 255.0,
+      blue: CGFloat(b) / 255.0,
+      alpha: CGFloat(a)
+    )
+  }
+}
+
+/// UIControl subclass that forwards `layoutSubviews` and raw touch positions to
+/// closures so the Nitro HybridView can re-lay-out its CALayers and drive the
+/// drag entirely on the native UI thread.
+///
+/// It subclasses `UIControl` (not `UIView`) on purpose: an enclosing
+/// `UIScrollView` returns `false` from `touchesShouldCancel(in:)` for
+/// `UIControl` subviews, so a horizontal drag on the slider is NOT cancelled
+/// and stolen by the scroll view's pan gesture. This is the same mechanism
+/// `UISlider` relies on to stay draggable inside a scroll view.
+final class SegmentSliderUIView: UIControl {
+  var onLayout: (() -> Void)?
+  /// Touch began at x (points, view coordinates).
+  var onTouchBegan: ((CGFloat) -> Void)?
+  /// Touch moved to x (points, view coordinates).
+  var onTouchMoved: ((CGFloat) -> Void)?
+  /// Touch ended or was cancelled.
+  var onTouchEnded: (() -> Void)?
+
+  override func layoutSubviews() {
+    super.layoutSubviews()
+    onLayout?()
+  }
+
+  // While the user is dragging the slider, NO ancestor pan gesture may act —
+  // not the enclosing scroll view's scroll, not the navigation stack's
+  // swipe-back, not a parent pager. UIKit's UIControl exemption
+  // (`touchesShouldCancelInContentView:`) does NOT help, because the scroll
+  // view passes its *direct* content subview to that method, not this
+  // deeply-nested view. So on touch-down we walk the ancestor chain and
+  // temporarily disable every pan-type recognizer (UIScrollView pan,
+  // UIScreenEdgePan / RNSPanGestureRecognizer back-swipe, pager pans — all are
+  // UIPanGestureRecognizer subclasses), restoring them on touch-up. This is the
+  // iOS analogue of Android's `requestDisallowInterceptTouchEvent(true)`.
+  private var disabledRecognizers: [UIGestureRecognizer] = []
+
+  private func lockAncestorGestures() {
+    var v: UIView? = superview
+    while let cur = v {
+      if let grs = cur.gestureRecognizers {
+        for gr in grs where gr is UIPanGestureRecognizer && gr.isEnabled {
+          gr.isEnabled = false // cancels it if mid-recognition, blocks it otherwise
+          disabledRecognizers.append(gr)
+        }
+      }
+      v = cur.superview
+    }
+  }
+
+  private func unlockAncestorGestures() {
+    for gr in disabledRecognizers {
+      gr.isEnabled = true
+    }
+    disabledRecognizers.removeAll()
+  }
+
+  override func touchesBegan(_ touches: Set<UITouch>, with event: UIEvent?) {
+    super.touchesBegan(touches, with: event)
+    lockAncestorGestures()
+    guard let t = touches.first else { return }
+    onTouchBegan?(t.location(in: self).x)
+  }
+
+  override func touchesMoved(_ touches: Set<UITouch>, with event: UIEvent?) {
+    super.touchesMoved(touches, with: event)
+    guard let t = touches.first else { return }
+    onTouchMoved?(t.location(in: self).x)
+  }
+
+  override func touchesEnded(_ touches: Set<UITouch>, with event: UIEvent?) {
+    super.touchesEnded(touches, with: event)
+    unlockAncestorGestures()
+    onTouchEnded?()
+  }
+
+  override func touchesCancelled(_ touches: Set<UITouch>, with event: UIEvent?) {
+    super.touchesCancelled(touches, with: event)
+    unlockAncestorGestures()
+    onTouchEnded?()
+  }
+}

package/lib/module/SegmentSlider.nitro.js

@@ -0,0 +1,4 @@
+"use strict";
+
+export {};
+//# sourceMappingURL=SegmentSlider.nitro.js.map

package/lib/module/SegmentSlider.nitro.js.map

@@ -0,0 +1 @@
+{"version":3,"names":[],"sourceRoot":"../../src","sources":["SegmentSlider.nitro.ts"],"mappings":"","ignoreList":[]}

package/lib/module/index.js

@@ -0,0 +1,43 @@
+"use strict";
+
+import { useCallback, useRef } from 'react';
+import { callback, getHostComponent } from 'react-native-nitro-modules';
+import { jsx as _jsx } from "react/jsx-runtime";
+const SegmentSliderConfig = require('../nitrogen/generated/shared/json/SegmentSliderConfig.json');
+const SegmentSliderHost = getHostComponent('SegmentSlider', () => SegmentSliderConfig);
+
+/**
+ * Thin wrapper so consumers pass plain functions. Nitro view callbacks must be
+ * wrapped with `callback(...)` to cross the JSI boundary; we encapsulate that
+ * here behind refs so the underlying functions stay stable across re-renders
+ * (otherwise every parent render would re-create the native callback).
+ */
+export function SegmentSliderView({
+  onChange,
+  onSlideStart,
+  onSlideComplete,
+  ...props
+}) {
+  const onChangeRef = useRef(onChange);
+  onChangeRef.current = onChange;
+  const onSlideStartRef = useRef(onSlideStart);
+  onSlideStartRef.current = onSlideStart;
+  const onSlideCompleteRef = useRef(onSlideComplete);
+  onSlideCompleteRef.current = onSlideComplete;
+  const stableOnChange = useCallback(value => {
+    onChangeRef.current?.(value);
+  }, []);
+  const stableOnSlideStart = useCallback(() => {
+    onSlideStartRef.current?.();
+  }, []);
+  const stableOnSlideComplete = useCallback(() => {
+    onSlideCompleteRef.current?.();
+  }, []);
+  return /*#__PURE__*/_jsx(SegmentSliderHost, {
+    ...props,
+    onChange: onChange ? callback(stableOnChange) : undefined,
+    onSlideStart: onSlideStart ? callback(stableOnSlideStart) : undefined,
+    onSlideComplete: onSlideComplete ? callback(stableOnSlideComplete) : undefined
+  });
+}
+//# sourceMappingURL=index.js.map

package/lib/module/index.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["useCallback","useRef","callback","getHostComponent","jsx","_jsx","SegmentSliderConfig","require","SegmentSliderHost","SegmentSliderView","onChange","onSlideStart","onSlideComplete","props","onChangeRef","current","onSlideStartRef","onSlideCompleteRef","stableOnChange","value","stableOnSlideStart","stableOnSlideComplete","undefined"],"sourceRoot":"../../src","sources":["index.tsx"],"mappings":";;AAAA,SAASA,WAAW,EAAEC,MAAM,QAAQ,OAAO;AAG3C,SAASC,QAAQ,EAAEC,gBAAgB,QAAQ,4BAA4B;AAAC,SAAAC,GAAA,IAAAC,IAAA;AAOxE,MAAMC,mBAAmB,GAAGC,OAAO,CAAC,4DAA4D,CAAC;AAIjG,MAAMC,iBAAiB,GAAGL,gBAAgB,CAGxC,eAAe,EAAE,MAAMG,mBAAmB,CAAC;;AAE7C;AACA;AACA;AACA;AACA;AACA;AACA,OAAO,SAASG,iBAAiBA,CAAC;EAChCC,QAAQ;EACRC,YAAY;EACZC,eAAe;EACf,GAAGC;AAC2B,CAAC,EAAE;EACjC,MAAMC,WAAW,GAAGb,MAAM,CAACS,QAAQ,CAAC;EACpCI,WAAW,CAACC,OAAO,GAAGL,QAAQ;EAC9B,MAAMM,eAAe,GAAGf,MAAM,CAACU,YAAY,CAAC;EAC5CK,eAAe,CAACD,OAAO,GAAGJ,YAAY;EACtC,MAAMM,kBAAkB,GAAGhB,MAAM,CAACW,eAAe,CAAC;EAClDK,kBAAkB,CAACF,OAAO,GAAGH,eAAe;EAE5C,MAAMM,cAAc,GAAGlB,WAAW,CAAEmB,KAAa,IAAK;IACpDL,WAAW,CAACC,OAAO,GAAGI,KAAK,CAAC;EAC9B,CAAC,EAAE,EAAE,CAAC;EACN,MAAMC,kBAAkB,GAAGpB,WAAW,CAAC,MAAM;IAC3CgB,eAAe,CAACD,OAAO,GAAG,CAAC;EAC7B,CAAC,EAAE,EAAE,CAAC;EACN,MAAMM,qBAAqB,GAAGrB,WAAW,CAAC,MAAM;IAC9CiB,kBAAkB,CAACF,OAAO,GAAG,CAAC;EAChC,CAAC,EAAE,EAAE,CAAC;EAEN,oBACEV,IAAA,CAACG,iBAAiB;IAAA,GACZK,KAAK;IACTH,QAAQ,EAAEA,QAAQ,GAAGR,QAAQ,CAACgB,cAAc,CAAC,GAAGI,SAAU;IAC1DX,YAAY,EAAEA,YAAY,GAAGT,QAAQ,CAACkB,kBAAkB,CAAC,GAAGE,SAAU;IACtEV,eAAe,EACbA,eAAe,GAAGV,QAAQ,CAACmB,qBAAqB,CAAC,GAAGC;EACrD,CACF,CAAC;AAEN","ignoreList":[]}

package/lib/module/package.json

@@ -0,0 +1 @@
+{"type":"module"}

package/lib/nitrogen/generated/android/c++/JFunc_void.hpp

@@ -0,0 +1,75 @@
+///
+/// JFunc_void.hpp
+/// This file was generated by nitrogen. DO NOT MODIFY THIS FILE.
+/// https://github.com/mrousavy/nitro
+/// Copyright © 2026 Marc Rousavy @ Margelo
+///
+
+#pragma once
+
+#include <fbjni/fbjni.h>
+#include <functional>
+
+#include <functional>
+#include <NitroModules/JNICallable.hpp>
+
+namespace margelo::nitro::segmentslider {
+
+  using namespace facebook;
+
+  /**
+   * Represents the Java/Kotlin callback `() -> Unit`.
+   * This can be passed around between C++ and Java/Kotlin.
+   */
+  struct JFunc_void: public jni::JavaClass<JFunc_void> {
+  public:
+    static auto constexpr kJavaDescriptor = "Lcom/margelo/nitro/segmentslider/Func_void;";
+
+  public:
+    /**
+     * Invokes the function this `JFunc_void` instance holds through JNI.
+     */
+    void invoke() const {
+      static const auto method = javaClassStatic()->getMethod<void()>("invoke");
+      method(self());
+    }
+  };
+
+  /**
+   * An implementation of Func_void that is backed by a C++ implementation (using `std::function<...>`)
+   */
+  class JFunc_void_cxx final: public jni::HybridClass<JFunc_void_cxx, JFunc_void> {
+  public:
+    static jni::local_ref<JFunc_void::javaobject> fromCpp(const std::function<void()>& func) {
+      return JFunc_void_cxx::newObjectCxxArgs(func);
+    }
+
+  public:
+    /**
+     * Invokes the C++ `std::function<...>` this `JFunc_void_cxx` instance holds.
+     */
+    void invoke_cxx() {
+      _func();
+    }
+
+  public:
+    [[nodiscard]]
+    inline const std::function<void()>& getFunction() const {
+      return _func;
+    }
+
+  public:
+    static auto constexpr kJavaDescriptor = "Lcom/margelo/nitro/segmentslider/Func_void_cxx;";
+    static void registerNatives() {
+      registerHybrid({makeNativeMethod("invoke_cxx", JFunc_void_cxx::invoke_cxx)});
+    }
+
+  private:
+    explicit JFunc_void_cxx(const std::function<void()>& func): _func(func) { }
+
+  private:
+    friend HybridBase;
+    std::function<void()> _func;
+  };
+
+} // namespace margelo::nitro::segmentslider