@onekeyfe/react-native-segment-slider 3.0.40

package/LICENSE

@@ -0,0 +1,21 @@
+MIT License
+
+Copyright (c) 2024 OneKey
+
+Permission is hereby granted, free of charge, to any person obtaining a copy
+of this software and associated documentation files (the "Software"), to deal
+in the Software without restriction, including without limitation the rights
+to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
+copies of the Software, and to permit persons to whom the Software is
+furnished to do so, subject to the following conditions:
+
+The above copyright notice and this permission notice shall be included in all
+copies or substantial portions of the Software.
+
+THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
+IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
+FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
+AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
+LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
+OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
+SOFTWARE.

package/README.md

@@ -0,0 +1,31 @@
+# @onekeyfe/react-native-segment-slider
+
+SegmentSlider view for React Native
+
+## Installation
+
+```sh
+yarn add @onekeyfe/react-native-segment-slider
+```
+
+## Usage
+
+```js
+import { SegmentSliderView } from '@onekeyfe/react-native-segment-slider';
+
+// ...
+
+<SegmentSliderView color="#ff0000" style={{ width: 100, height: 100 }} />
+```
+
+## Contributing
+
+See the [contributing guide](CONTRIBUTING.md) to learn how to contribute to the repository and the development workflow.
+
+## License
+
+MIT
+
+---
+
+Made with [create-react-native-library](https://github.com/callstack/react-native-builder-bob)

package/SegmentSlider.podspec

@@ -0,0 +1,29 @@
+require "json"
+
+package = JSON.parse(File.read(File.join(__dir__, "package.json")))
+
+Pod::Spec.new do |s|
+  s.name         = "SegmentSlider"
+  s.version      = package["version"]
+  s.summary      = package["description"]
+  s.homepage     = package["homepage"]
+  s.license      = package["license"]
+  s.authors      = package["author"]
+
+  s.platforms    = { :ios => min_ios_version_supported }
+  s.source       = { :git => "https://github.com/OneKeyHQ/app-views/react-native-segment-slider.git", :tag => "#{s.version}" }
+
+  s.source_files = [
+    "ios/**/*.{swift}",
+    "ios/**/*.{m,mm}",
+    "cpp/**/*.{hpp,cpp}",
+  ]
+
+  s.dependency 'React-jsi'
+  s.dependency 'React-callinvoker'
+
+  load 'nitrogen/generated/ios/SegmentSlider+autolinking.rb'
+  add_nitrogen_files(s)
+
+  install_modules_dependencies(s)
+end

package/android/CMakeLists.txt

@@ -0,0 +1,26 @@
+project(segmentslider)
+cmake_minimum_required(VERSION 3.9.0)
+
+set(PACKAGE_NAME segmentslider)
+set(CMAKE_VERBOSE_MAKEFILE ON)
+set(CMAKE_CXX_STANDARD 20)
+
+# Define the C++ library and add the local adapter source.
+add_library(${PACKAGE_NAME} SHARED src/main/cpp/cpp-adapter.cpp)
+
+# Add the Nitrogen-generated specs + Nitro core linking. This resolves
+# react-native-nitro-modules via find_package (monorepo-safe), instead of a
+# hardcoded ../node_modules path that breaks once nitro-modules is hoisted.
+include(${CMAKE_SOURCE_DIR}/../nitrogen/generated/android/segmentslider+autolinking.cmake)
+
+# Local includes.
+include_directories("src/main/cpp")
+
+find_library(LOG_LIB log)
+
+# Link everything together.
+target_link_libraries(
+        ${PACKAGE_NAME}
+        ${LOG_LIB}
+        android
+)

package/android/build.gradle

@@ -0,0 +1,128 @@
+buildscript {
+  ext.getExtOrDefault = {name ->
+    return rootProject.ext.has(name) ? rootProject.ext.get(name) : project.properties['SegmentSlider_' + name]
+  }
+
+  repositories {
+    google()
+    mavenCentral()
+  }
+
+  dependencies {
+    classpath "com.android.tools.build:gradle:8.7.2"
+    // noinspection DifferentKotlinGradleVersion
+    classpath "org.jetbrains.kotlin:kotlin-gradle-plugin:${getExtOrDefault('kotlinVersion')}"
+  }
+}
+
+def reactNativeArchitectures() {
+  def value = rootProject.getProperties().get("reactNativeArchitectures")
+  return value ? value.split(",") : ["armeabi-v7a", "x86", "x86_64", "arm64-v8a"]
+}
+
+apply plugin: "com.android.library"
+apply plugin: "kotlin-android"
+apply from: '../nitrogen/generated/android/segmentslider+autolinking.gradle'
+
+apply plugin: "com.facebook.react"
+
+def getExtOrIntegerDefault(name) {
+  return rootProject.ext.has(name) ? rootProject.ext.get(name) : (project.properties["SegmentSlider_" + name]).toInteger()
+}
+
+android {
+  namespace "com.margelo.nitro.segmentslider"
+
+  compileSdkVersion getExtOrIntegerDefault("compileSdkVersion")
+
+  defaultConfig {
+    minSdkVersion getExtOrIntegerDefault("minSdkVersion")
+    targetSdkVersion getExtOrIntegerDefault("targetSdkVersion")
+
+    externalNativeBuild {
+      cmake {
+        cppFlags "-frtti -fexceptions -Wall -fstack-protector-all"
+        arguments "-DANDROID_STL=c++_shared", "-DANDROID_SUPPORT_FLEXIBLE_PAGE_SIZES=ON"
+        abiFilters (*reactNativeArchitectures())
+
+        buildTypes {
+          debug {
+            cppFlags "-O1 -g"
+          }
+          release {
+            cppFlags "-O2"
+          }
+        }
+      }
+    }
+  }
+
+  externalNativeBuild {
+    cmake {
+      path "CMakeLists.txt"
+    }
+  }
+
+  packagingOptions {
+    excludes = [
+            "META-INF",
+            "META-INF/**",
+            "**/libc++_shared.so",
+            "**/libfbjni.so",
+            "**/libjsi.so",
+            "**/libfolly_json.so",
+            "**/libfolly_runtime.so",
+            "**/libglog.so",
+            "**/libhermes.so",
+            "**/libhermes-executor-debug.so",
+            "**/libhermes_executor.so",
+            "**/libreactnative.so",
+            "**/libreactnativejni.so",
+            "**/libturbomodulejsijni.so",
+            "**/libreact_nativemodule_core.so",
+            "**/libjscexecutor.so"
+    ]
+  }
+
+  buildFeatures {
+    buildConfig true
+    prefab true
+  }
+
+  buildTypes {
+    release {
+      minifyEnabled false
+    }
+  }
+
+  lintOptions {
+    disable "GradleCompatible"
+  }
+
+  compileOptions {
+    sourceCompatibility JavaVersion.VERSION_1_8
+    targetCompatibility JavaVersion.VERSION_1_8
+  }
+
+  sourceSets {
+    main {
+      java.srcDirs += [
+        "generated/java",
+        "generated/jni"
+      ]
+    }
+  }
+}
+
+repositories {
+  mavenCentral()
+  google()
+}
+
+def kotlin_version = getExtOrDefault("kotlinVersion")
+
+dependencies {
+  implementation "com.facebook.react:react-android"
+  implementation "org.jetbrains.kotlin:kotlin-stdlib:$kotlin_version"
+  implementation project(":react-native-nitro-modules")
+}

package/android/src/main/AndroidManifest.xml

@@ -0,0 +1,2 @@
+<manifest xmlns:android="http://schemas.android.com/apk/res/android">
+</manifest>

package/android/src/main/cpp/cpp-adapter.cpp

@@ -0,0 +1,6 @@
+#include <jni.h>
+#include "segmentsliderOnLoad.hpp"
+
+JNIEXPORT jint JNICALL JNI_OnLoad(JavaVM* vm, void*) {
+  return margelo::nitro::segmentslider::initialize(vm);
+}

package/android/src/main/java/com/margelo/nitro/segmentslider/HybridSegmentSlider.kt

@@ -0,0 +1,364 @@
+package com.margelo.nitro.segmentslider
+
+import android.animation.ValueAnimator
+import android.graphics.Canvas
+import android.graphics.Paint
+import android.graphics.RectF
+import android.view.HapticFeedbackConstants
+import android.view.MotionEvent
+import android.view.View
+import com.facebook.proguard.annotations.DoNotStrip
+import com.facebook.react.uimanager.ThemedReactContext
+
+/**
+ * Native segmented slider. Draws the track, fill bar, segment marks, thumb and
+ * value bubble in [View.onDraw] and handles the drag in [View.onTouchEvent], so
+ * a drag never crosses the JS bridge per frame. Mirrors the web variant
+ * (`composite/SegmentSlider/index.tsx`) pixel-for-pixel.
+ */
+@DoNotStrip
+class HybridSegmentSlider(val context: ThemedReactContext) : HybridSegmentSliderSpec() {
+
+  private val density = context.resources.displayMetrics.density
+
+  // Geometry (dp), identical to the web constants.
+  private val thumbSizePx = 16f * density
+  private val markSizePx = 10f * density
+  private val insetPx = thumbSizePx / 2f
+  private val haloRingPx = 4f * density // translucent halo width beyond each mark
+
+  // Paints.
+  private val trackPaint = Paint(Paint.ANTI_ALIAS_FLAG).apply { style = Paint.Style.FILL }
+  private val fillPaint = Paint(Paint.ANTI_ALIAS_FLAG).apply { style = Paint.Style.FILL }
+  private val thumbFillPaint = Paint(Paint.ANTI_ALIAS_FLAG).apply { style = Paint.Style.FILL }
+  private val thumbStrokePaint = Paint(Paint.ANTI_ALIAS_FLAG).apply {
+    style = Paint.Style.STROKE; strokeWidth = density
+  }
+  private val markFillPaint = Paint(Paint.ANTI_ALIAS_FLAG).apply { style = Paint.Style.FILL }
+  private val markStrokePaint = Paint(Paint.ANTI_ALIAS_FLAG).apply {
+    style = Paint.Style.STROKE; strokeWidth = density
+  }
+  // Translucent highlight around the node the thumb is over while dragging.
+  private val markHaloPaint = Paint(Paint.ANTI_ALIAS_FLAG).apply { style = Paint.Style.FILL }
+  private val bubblePaint = Paint(Paint.ANTI_ALIAS_FLAG).apply { style = Paint.Style.FILL }
+  private val bubbleTextPaint = Paint(Paint.ANTI_ALIAS_FLAG).apply {
+    textAlign = Paint.Align.CENTER
+    textSize = 12f * density
+    isFakeBoldText = true
+  }
+  private val rect = RectF()
+
+  // Cached colors.
+  private var cFill = 0
+  private var cTrack = 0
+  private var cThumb = 0
+  private var cThumbBorder = 0
+  private var cMarkActive = 0
+  private var cMarkInactive = 0
+  private var cMarkBorder = 0
+
+  // Interaction state.
+  private var currentValue = 0.0
+  private var lastEmitted = Double.NaN
+  private var isDragging = false
+  private var thumbScale = 1f
+  private var thumbScaleAnimator: ValueAnimator? = null
+  private var isDisposed = 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
+
+  override val view: View = object : View(context) {
+    override fun onDraw(canvas: Canvas) {
+      drawSlider(canvas)
+    }
+
+    override fun onTouchEvent(event: MotionEvent): Boolean {
+      if (disabled || isDisposed) return false
+      when (event.action) {
+        MotionEvent.ACTION_DOWN -> {
+          isDragging = true
+          onSlideStart?.invoke()
+          animateThumbScale(1.15f)
+          commitDragValue(valueFromX(event.x))
+          parent?.requestDisallowInterceptTouchEvent(true)
+          return true
+        }
+        MotionEvent.ACTION_MOVE -> {
+          if (isDragging) commitDragValue(valueFromX(event.x))
+          return true
+        }
+        MotionEvent.ACTION_UP, MotionEvent.ACTION_CANCEL -> {
+          if (isDragging) {
+            isDragging = false
+            hoverMarkIndex = -1
+            animateThumbScale(1f)
+            view.invalidate()
+            onSlideComplete?.invoke()
+          }
+          parent?.requestDisallowInterceptTouchEvent(false)
+          return true
+        }
+      }
+      return super.onTouchEvent(event)
+    }
+  }.apply {
+    isClickable = true
+    isFocusable = false
+    isHapticFeedbackEnabled = true
+  }
+
+  // MARK: - Props
+  override var value: Double = 0.0
+    get() = field
+    set(v) {
+      field = v
+      // While dragging, the finger owns the value (mirrors web).
+      if (!isDragging && !isDisposed) {
+        currentValue = v
+        view.invalidate()
+      }
+    }
+
+  override var min: Double = 0.0
+    get() = field
+    set(v) { field = v; invalidateIfAlive() }
+
+  override var max: Double = 100.0
+    get() = field
+    set(v) { field = v; invalidateIfAlive() }
+
+  override var segments: Double = 0.0
+    get() = field
+    set(v) { field = v; invalidateIfAlive() }
+
+  override var sliderHeight: Double = 4.0
+    get() = field
+    set(v) { field = v; invalidateIfAlive() }
+
+  override var disabled: Boolean = false
+    get() = field
+    set(v) {
+      field = v
+      view.alpha = if (v) 0.5f else 1f
+      invalidateIfAlive()
+    }
+
+  override var showBubble: Boolean = true
+    get() = field
+    set(v) { field = v; invalidateIfAlive() }
+
+  override var centerOrigin: Boolean = false
+    get() = field
+    set(v) { field = v; invalidateIfAlive() }
+
+  override var epoch: Double = 0.0
+    get() = field
+    set(v) { field = v }
+
+  override var fillColor: String = ""
+    get() = field
+    set(v) { field = v; cFill = parse(v); fillPaint.color = cFill; invalidateIfAlive() }
+
+  override var trackColor: String = ""
+    get() = field
+    set(v) { field = v; cTrack = parse(v); trackPaint.color = cTrack; invalidateIfAlive() }
+
+  override var thumbColor: String = ""
+    get() = field
+    set(v) { field = v; cThumb = parse(v); thumbFillPaint.color = cThumb; invalidateIfAlive() }
+
+  override var thumbBorderColor: String = ""
+    get() = field
+    set(v) { field = v; cThumbBorder = parse(v); thumbStrokePaint.color = cThumbBorder; invalidateIfAlive() }
+
+  override var markActiveColor: String = ""
+    get() = field
+    set(v) { field = v; cMarkActive = parse(v); invalidateIfAlive() }
+
+  override var markInactiveColor: String = ""
+    get() = field
+    set(v) { field = v; cMarkInactive = parse(v); invalidateIfAlive() }
+
+  override var markBorderColor: String = ""
+    get() = field
+    set(v) { field = v; cMarkBorder = parse(v); invalidateIfAlive() }
+
+  override var bubbleColor: String = ""
+    get() = field
+    set(v) { field = v; bubblePaint.color = parse(v); invalidateIfAlive() }
+
+  override var bubbleTextColor: String = ""
+    get() = field
+    set(v) { field = v; bubbleTextPaint.color = parse(v); invalidateIfAlive() }
+
+  // MARK: - Callbacks
+  override var onChange: ((value: Double) -> Unit)? = null
+  override var onSlideStart: (() -> Unit)? = null
+  override var onSlideComplete: (() -> Unit)? = null
+
+  private fun parse(v: String) = SegmentSliderColorParser.parse(v)
+
+  private fun invalidateIfAlive() {
+    if (!isDisposed) view.invalidate()
+  }
+
+  // MARK: - Geometry helpers
+  private val trackWidth: Float get() = (view.width - thumbSizePx).coerceAtLeast(0f)
+  private val rangeSafe: Double get() = (max - min).let { if (it == 0.0) 1.0 else it }
+  private val markCount: Int get() = if (segments >= 1) segments.toInt() + 1 else 0
+
+  private fun valueToFrac(v: Double): Float {
+    val clamped = v.coerceIn(min, max)
+    return ((clamped - min) / rangeSafe).toFloat()
+  }
+
+  private fun valueFromX(x: Float): Double {
+    val w = trackWidth
+    if (w <= 0f) return currentValue
+    val clampedX = x.coerceIn(insetPx, insetPx + w)
+    val frac = ((clampedX - insetPx) / w).toDouble()
+    return min + frac * (max - min)
+  }
+
+  private fun commitDragValue(raw: Double) {
+    val rounded = raw.coerceIn(min, max).let { Math.round(it).toDouble() }
+    currentValue = rounded
+    updateHover()
+    view.invalidate()
+    if (rounded != lastEmitted) {
+      lastEmitted = rounded
+      onChange?.invoke(rounded)
+    }
+  }
+
+  /// Highlights the node the thumb is over and fires a light haptic tick once
+  /// per node entered. Only while dragging; does NOT snap (parity with web/perp).
+  private fun updateHover() {
+    val tw = trackWidth
+    if (!isDragging || markCount <= 0 || tw <= 0f) {
+      hoverMarkIndex = -1
+      return
+    }
+    val thumbX = insetPx + valueToFrac(currentValue) * tw
+    val threshold = 12f * density // half of the 24dp mark hit area
+    var best = -1
+    var bestDist = threshold
+    for (i in 0 until markCount) {
+      val mf = if (markCount > 1) i.toFloat() / (markCount - 1) else 0f
+      val mx = insetPx + mf * tw
+      val d = Math.abs(thumbX - mx)
+      if (d <= bestDist) { bestDist = d; best = i }
+    }
+    if (best != hoverMarkIndex) {
+      hoverMarkIndex = best
+      if (best != -1) {
+        view.performHapticFeedback(HapticFeedbackConstants.CLOCK_TICK)
+      }
+    }
+  }
+
+  private fun animateThumbScale(target: Float) {
+    thumbScaleAnimator?.cancel()
+    thumbScaleAnimator = ValueAnimator.ofFloat(thumbScale, target).apply {
+      duration = 120L
+      addUpdateListener { a ->
+        if (isDisposed) return@addUpdateListener
+        thumbScale = a.animatedValue as Float
+        view.invalidate()
+      }
+      start()
+    }
+  }
+
+  // MARK: - Drawing
+  private fun drawSlider(canvas: Canvas) {
+    val w = view.width.toFloat()
+    if (w <= 0f) return
+    val h = (sliderHeight * density).toFloat()
+    val midY = view.height / 2f
+    val trackTop = midY - h / 2f
+    val tw = trackWidth
+    val frac = valueToFrac(currentValue)
+    val radius = h / 2f
+
+    // Track.
+    rect.set(insetPx, trackTop, insetPx + tw, trackTop + h)
+    canvas.drawRoundRect(rect, radius, radius, trackPaint)
+
+    // Fill.
+    if (centerOrigin) {
+      if (currentValue != 0.0) {
+        val centerFrac = valueToFrac(0.0)
+        val leftFrac = minOf(frac, centerFrac)
+        val widthFrac = Math.abs(frac - centerFrac)
+        rect.set(insetPx + leftFrac * tw, trackTop, insetPx + (leftFrac + widthFrac) * tw, trackTop + h)
+        canvas.drawRoundRect(rect, radius, radius, fillPaint)
+      }
+    } else if (frac > 0f) {
+      rect.set(insetPx, trackTop, insetPx + frac * tw, trackTop + h)
+      canvas.drawRoundRect(rect, radius, radius, fillPaint)
+    }
+
+    // Thumb (drawn BELOW the marks so a node under the thumb shows through its
+    // centre — the "white ring + dark centre" bullseye, matching web where the
+    // mark zIndex 3 sits above the thumb zIndex 2).
+    val thumbX = insetPx + frac * tw
+    val thumbR = thumbSizePx / 2f * thumbScale
+    canvas.drawCircle(thumbX, midY, thumbR, thumbFillPaint)
+    canvas.drawCircle(thumbX, midY, thumbR - density / 2f, thumbStrokePaint)
+
+    // Node halo (drag-time highlight) — drawn under the marks so the node dot
+    // stays crisp on top. Translucent markActive color (25% alpha).
+    if (isDragging && hoverMarkIndex in 0 until markCount) {
+      val mf = if (markCount > 1) hoverMarkIndex.toFloat() / (markCount - 1) else 0f
+      val hx = insetPx + mf * tw
+      markHaloPaint.color = (cMarkActive and 0x00FFFFFF) or (0x3F shl 24)
+      canvas.drawCircle(hx, midY, markSizePx / 2f + haloRingPx, markHaloPaint)
+    }
+
+    // Marks (on top of the thumb).
+    val centerFrac = valueToFrac(0.0)
+    val markR = markSizePx / 2f
+    for (i in 0 until markCount) {
+      val markFrac = if (markCount > 1) i.toFloat() / (markCount - 1) else 0f
+      val cx = insetPx + markFrac * tw
+      val active = when {
+        centerOrigin && currentValue == 0.0 -> false
+        centerOrigin && currentValue > 0 -> markFrac > centerFrac && markFrac <= frac
+        centerOrigin && currentValue < 0 -> markFrac >= frac && markFrac < centerFrac
+        else -> markFrac <= frac
+      }
+      markFillPaint.color = if (active) cMarkActive else cMarkInactive
+      markStrokePaint.color = if (active) cMarkActive else cMarkBorder
+      canvas.drawCircle(cx, midY, markR - density / 2f, markFillPaint)
+      canvas.drawCircle(cx, midY, markR - density / 2f, markStrokePaint)
+    }
+
+    // Bubble.
+    if (isDragging && showBubble) {
+      val text = "${Math.round(currentValue)}%"
+      val textW = bubbleTextPaint.measureText(text)
+      val padH = 8f * density
+      val bw = textW + padH * 2
+      val bh = 20f * density
+      val left = thumbX - bw / 2f
+      val top = trackTop - 8f * density - bh
+      rect.set(left, top, left + bw, top + bh)
+      canvas.drawRoundRect(rect, 4f * density, 4f * density, bubblePaint)
+      val baseline = top + bh / 2f - (bubbleTextPaint.descent() + bubbleTextPaint.ascent()) / 2f
+      canvas.drawText(text, thumbX, baseline, bubbleTextPaint)
+    }
+  }
+
+  override fun afterUpdate() {
+    super.afterUpdate()
+    invalidateIfAlive()
+  }
+
+  override fun dispose() {
+    isDisposed = true
+    thumbScaleAnimator?.cancel()
+    thumbScaleAnimator = null
+  }
+}

package/android/src/main/java/com/margelo/nitro/segmentslider/SegmentSliderColorParser.kt

@@ -0,0 +1,56 @@
+package com.margelo.nitro.segmentslider
+
+import android.graphics.Color
+
+/**
+ * Parses color strings from JS. Supports `#rgb`/`#rrggbb`/`#rrggbbaa` and
+ * `rgb(...)`/`rgba(...)` (alpha 0..1). Returns [fallback] on failure.
+ *
+ * Note: Android's [Color.parseColor] expects `#AARRGGBB`, while web/JS emit
+ * `#RRGGBBAA`, so 8-digit hex is reordered here before parsing.
+ */
+object SegmentSliderColorParser {
+  fun parse(value: String?, fallback: Int = Color.TRANSPARENT): Int {
+    val raw = value?.trim().orEmpty()
+    if (raw.isEmpty()) return fallback
+    return try {
+      when {
+        raw.startsWith("#") -> parseHex(raw) ?: fallback
+        raw.startsWith("rgb", ignoreCase = true) -> parseRgb(raw) ?: fallback
+        else -> fallback
+      }
+    } catch (e: Exception) {
+      fallback
+    }
+  }
+
+  private fun parseHex(hex: String): Int? {
+    var s = hex.substring(1)
+    if (s.length == 3) {
+      s = s.map { "$it$it" }.joinToString("")
+    }
+    return when (s.length) {
+      6 -> Color.parseColor("#$s")
+      8 -> {
+        // #RRGGBBAA (JS) -> #AARRGGBB (Android)
+        val rgb = s.substring(0, 6)
+        val a = s.substring(6, 8)
+        Color.parseColor("#$a$rgb")
+      }
+      else -> null
+    }
+  }
+
+  private fun parseRgb(value: String): Int? {
+    val open = value.indexOf('(')
+    val close = value.indexOf(')')
+    if (open < 0 || close < 0 || close <= open) return null
+    val parts = value.substring(open + 1, close).split(",").map { it.trim() }
+    if (parts.size < 3) return null
+    val r = parts[0].toFloatOrNull()?.toInt() ?: return null
+    val g = parts[1].toFloatOrNull()?.toInt() ?: return null
+    val b = parts[2].toFloatOrNull()?.toInt() ?: return null
+    val a = if (parts.size >= 4) ((parts[3].toFloatOrNull() ?: 1f) * 255f).toInt() else 255
+    return Color.argb(a.coerceIn(0, 255), r.coerceIn(0, 255), g.coerceIn(0, 255), b.coerceIn(0, 255))
+  }
+}

package/android/src/main/java/com/margelo/nitro/segmentslider/SegmentSliderPackage.kt

@@ -0,0 +1,29 @@
+package com.margelo.nitro.segmentslider
+
+import com.facebook.react.BaseReactPackage
+import com.facebook.react.bridge.NativeModule
+import com.facebook.react.bridge.ReactApplicationContext
+import com.facebook.react.module.model.ReactModuleInfoProvider
+import com.facebook.react.uimanager.ViewManager
+
+import com.margelo.nitro.segmentslider.views.HybridSegmentSliderManager
+
+class SegmentSliderPackage : BaseReactPackage() {
+  override fun getModule(name: String, reactContext: ReactApplicationContext): NativeModule? {
+    return null
+  }
+
+  override fun getReactModuleInfoProvider(): ReactModuleInfoProvider {
+    return ReactModuleInfoProvider { HashMap() }
+  }
+
+  override fun createViewManagers(reactContext: ReactApplicationContext): List<ViewManager<*, *>> {
+    return listOf(HybridSegmentSliderManager())
+  }
+
+  companion object {
+    init {
+      System.loadLibrary("segmentslider")
+    }
+  }
+}