react-native-platform-components 0.5.5 → 0.6.1

package/android/src/main/java/com/platformcomponents/PCContextMenuView.kt

@@ -0,0 +1,419 @@
+package com.platformcomponents
+
+import android.annotation.SuppressLint
+import android.content.Context
+import android.graphics.Color
+import android.graphics.drawable.Drawable
+import android.util.Log
+import android.view.Menu
+import android.view.MotionEvent
+import android.view.View
+import android.view.ViewConfiguration
+import androidx.appcompat.widget.PopupMenu
+import androidx.core.content.ContextCompat
+import androidx.core.graphics.drawable.DrawableCompat
+import com.facebook.react.views.view.ReactViewGroup
+
+class PCContextMenuView(context: Context) : ReactViewGroup(context) {
+
+  data class Action(
+    val id: String,
+    val title: String,
+    val subtitle: String?,
+    val image: String?,
+    val imageColor: String?,
+    val destructive: Boolean,
+    val disabled: Boolean,
+    val hidden: Boolean,
+    val state: String?, // "off" | "on" | "mixed"
+    val subactions: List<Action>
+  )
+
+  companion object {
+    private const val TAG = "PCContextMenu"
+  }
+
+  // --- Props ---
+  var menuTitle: String? = null
+  var actions: List<Action> = emptyList()
+  var interactivity: String = "enabled" // "enabled" | "disabled"
+  var trigger: String = "longPress"     // "longPress" | "tap"
+  var androidVisible: String = "closed" // "open" | "closed" (Android-only programmatic)
+  var androidAnchorPosition: String? = "left" // "left" | "right"
+
+  // --- Events ---
+  var onPressAction: ((id: String, title: String) -> Unit)? = null
+  var onMenuOpen: (() -> Unit)? = null
+  var onMenuClose: (() -> Unit)? = null
+
+  // --- Internal ---
+  private var popupMenu: PopupMenu? = null
+  private var popupShowing = false
+  private var dismissProgrammatic = false
+  private var dismissAfterSelect = false
+  private var openToken = 0
+
+  // Long-press detection
+  private var longPressRunnable: Runnable? = null
+  private var touchDownX = 0f
+  private var touchDownY = 0f
+  private val touchSlop = ViewConfiguration.get(context).scaledTouchSlop
+  private val longPressTimeout = ViewConfiguration.getLongPressTimeout().toLong()
+
+  init {
+    // Enable long-click for longPress mode
+    isLongClickable = true
+    setOnLongClickListener { handleLongClick() }
+    // Enable click for tap mode
+    setOnClickListener { handleTap() }
+  }
+
+  override fun onInterceptTouchEvent(ev: MotionEvent): Boolean {
+    if (interactivity != "enabled") {
+      return super.onInterceptTouchEvent(ev)
+    }
+
+    when (ev.action) {
+      MotionEvent.ACTION_DOWN -> {
+        touchDownX = ev.x
+        touchDownY = ev.y
+        // In longPress mode, schedule long-press detection
+        if (trigger == "longPress") {
+          longPressRunnable = Runnable {
+            if (handleLongClick()) {
+              // Cancel any pending touch events on children
+              val cancel = MotionEvent.obtain(
+                ev.downTime, System.currentTimeMillis(),
+                MotionEvent.ACTION_CANCEL, ev.x, ev.y, 0
+              )
+              super.dispatchTouchEvent(cancel)
+              cancel.recycle()
+            }
+          }
+          postDelayed(longPressRunnable, longPressTimeout)
+        }
+      }
+      MotionEvent.ACTION_MOVE -> {
+        // Cancel if moved too much
+        if (Math.abs(ev.x - touchDownX) > touchSlop ||
+            Math.abs(ev.y - touchDownY) > touchSlop) {
+          cancelPendingLongPress()
+        }
+      }
+      MotionEvent.ACTION_UP -> {
+        cancelPendingLongPress()
+        // In tap mode, handle tap on ACTION_UP if within slop
+        if (trigger == "tap" &&
+            Math.abs(ev.x - touchDownX) <= touchSlop &&
+            Math.abs(ev.y - touchDownY) <= touchSlop) {
+          handleTap()
+          return true // Consume the event
+        }
+      }
+      MotionEvent.ACTION_CANCEL -> {
+        cancelPendingLongPress()
+      }
+    }
+
+    return super.onInterceptTouchEvent(ev)
+  }
+
+  private fun cancelPendingLongPress() {
+    longPressRunnable?.let {
+      removeCallbacks(it)
+      longPressRunnable = null
+    }
+  }
+
+  private fun handleLongClick(): Boolean {
+    if (trigger != "longPress") return false
+    if (interactivity != "enabled") return false
+
+    showPopupMenu()
+    return true
+  }
+
+  private fun handleTap() {
+    if (trigger != "tap") return
+    if (interactivity != "enabled") return
+
+    showPopupMenu()
+  }
+
+  // ---- Public apply* (called by manager) ----
+
+  fun applyMenuTitle(value: String?) {
+    menuTitle = value
+  }
+
+  fun applyActions(newActions: List<Action>) {
+    actions = newActions
+    Log.d(TAG, "applyActions size=${actions.size}")
+  }
+
+  fun applyInteractivity(value: String?) {
+    interactivity = if (value == "disabled") "disabled" else "enabled"
+    Log.d(TAG, "applyInteractivity interactivity=$interactivity")
+    updateEnabledState()
+
+    // If disabled while menu is open, dismiss
+    if (interactivity != "enabled" && popupShowing) {
+      Log.d(TAG, "applyInteractivity disabled while open -> dismiss")
+      dismissProgrammatic = true
+      popupMenu?.dismiss()
+    }
+  }
+
+  fun applyTrigger(value: String?) {
+    trigger = when (value) {
+      "longPress", "tap" -> value
+      else -> "longPress"
+    }
+    Log.d(TAG, "applyTrigger trigger=$trigger")
+    updateTriggerState()
+  }
+
+  fun applyAndroidVisible(value: String?) {
+    androidVisible = when (value) {
+      "open", "closed" -> value
+      else -> "closed"
+    }
+    Log.d(TAG, "applyAndroidVisible androidVisible=$androidVisible")
+    openToken += 1
+    val token = openToken
+
+    if (androidVisible == "open") {
+      presentIfNeeded(token)
+    } else {
+      if (popupShowing) {
+        dismissProgrammatic = true
+        popupMenu?.dismiss()
+      }
+    }
+  }
+
+  fun applyAndroidAnchorPosition(value: String?) {
+    androidAnchorPosition = value ?: "left"
+  }
+
+  // ---- Internal ----
+
+  private fun updateEnabledState() {
+    val enabled = interactivity == "enabled"
+    alpha = if (enabled) 1f else 0.5f
+    isLongClickable = enabled && trigger == "longPress"
+    isClickable = enabled && trigger == "tap"
+  }
+
+  private fun updateTriggerState() {
+    val enabled = interactivity == "enabled"
+    isLongClickable = enabled && trigger == "longPress"
+    isClickable = enabled && trigger == "tap"
+  }
+
+  private fun presentIfNeeded(token: Int) {
+    post {
+      if (token != openToken) {
+        Log.d(TAG, "presentIfNeeded stale token -> skip")
+        return@post
+      }
+      if (androidVisible != "open") {
+        Log.d(TAG, "presentIfNeeded no longer open -> skip")
+        return@post
+      }
+      if (interactivity != "enabled") {
+        Log.d(TAG, "presentIfNeeded disabled -> skip")
+        return@post
+      }
+      if (!isAttachedToWindow) {
+        Log.d(TAG, "presentIfNeeded not attached -> skip")
+        return@post
+      }
+
+      showPopupMenu()
+    }
+  }
+
+  @SuppressLint("RestrictedApi")
+  private fun showPopupMenu() {
+    val visibleActions = actions.filter { !it.hidden }
+    if (visibleActions.isEmpty()) {
+      Log.d(TAG, "showPopupMenu: no visible actions")
+      return
+    }
+
+    if (popupShowing) {
+      Log.d(TAG, "showPopupMenu: already showing")
+      return
+    }
+
+    Log.d(TAG, "showPopupMenu: creating popup with ${visibleActions.size} actions")
+
+    val popup = PopupMenu(context, this)
+
+    // Try to enable icons in the popup menu
+    try {
+      val menuHelper = PopupMenu::class.java.getDeclaredField("mPopup")
+      menuHelper.isAccessible = true
+      val menuPopupHelper = menuHelper.get(popup)
+      val setForceShowIcon = menuPopupHelper.javaClass.getDeclaredMethod(
+        "setForceShowIcon",
+        Boolean::class.java
+      )
+      setForceShowIcon.invoke(menuPopupHelper, true)
+    } catch (e: Exception) {
+      Log.d(TAG, "Could not enable popup menu icons: ${e.message}")
+    }
+
+    buildMenu(popup.menu, visibleActions, 0)
+
+    popup.setOnMenuItemClickListener { item ->
+      val actionId = item.intent?.getStringExtra("actionId") ?: ""
+      val actionTitle = item.title?.toString() ?: ""
+      Log.d(TAG, "popup onMenuItemClick id=$actionId title=$actionTitle")
+      dismissAfterSelect = true
+      onPressAction?.invoke(actionId, actionTitle)
+      true
+    }
+
+    popup.setOnDismissListener {
+      val programmatic = dismissProgrammatic || dismissAfterSelect
+      dismissProgrammatic = false
+      dismissAfterSelect = false
+      popupShowing = false
+      popupMenu = null
+
+      if (!programmatic) {
+        Log.d(TAG, "popup onDismiss user-initiated")
+      }
+      onMenuClose?.invoke()
+    }
+
+    popupMenu = popup
+    popupShowing = true
+    dismissProgrammatic = false
+    dismissAfterSelect = false
+
+    onMenuOpen?.invoke()
+    popup.show()
+  }
+
+  private fun buildMenu(menu: Menu, actions: List<Action>, groupId: Int) {
+    var order = 0
+    for (action in actions) {
+      if (action.hidden) continue
+
+      if (action.subactions.isNotEmpty()) {
+        // Create submenu
+        val subMenu = menu.addSubMenu(groupId, order, order, action.title)
+        buildMenu(subMenu, action.subactions, groupId + 1)
+
+        // Set icon on submenu header if available
+        action.image?.let { imageName ->
+          getDrawableByName(imageName)?.let { drawable ->
+            val tintedDrawable = tintDrawable(drawable, action.imageColor)
+            subMenu.item.icon = tintedDrawable
+          }
+        }
+      } else {
+        // Create regular item
+        val item = menu.add(groupId, order, order, buildTitle(action))
+
+        // Store action ID in intent for retrieval
+        item.intent = android.content.Intent().apply {
+          putExtra("actionId", action.id)
+        }
+
+        // Set enabled state
+        item.isEnabled = !action.disabled
+
+        // Set icon
+        action.image?.let { imageName ->
+          getDrawableByName(imageName)?.let { drawable ->
+            val tintedDrawable = tintDrawable(drawable, action.imageColor)
+            item.icon = tintedDrawable
+          }
+        }
+
+        // Set checkable state
+        when (action.state) {
+          "on" -> {
+            item.isCheckable = true
+            item.isChecked = true
+          }
+          "mixed" -> {
+            item.isCheckable = true
+            item.isChecked = true // Android doesn't have "mixed", treat as checked
+          }
+          else -> {
+            item.isCheckable = false
+          }
+        }
+      }
+      order++
+    }
+  }
+
+  private fun buildTitle(action: Action): String {
+    // On Android, we can't easily style text as destructive in PopupMenu
+    // We could prefix with emoji or special character, but keeping it simple
+    return action.title
+  }
+
+  private fun getDrawableByName(name: String): Drawable? {
+    // First try as a drawable resource
+    val resourceId = context.resources.getIdentifier(
+      name,
+      "drawable",
+      context.packageName
+    )
+
+    if (resourceId != 0) {
+      return ContextCompat.getDrawable(context, resourceId)
+    }
+
+    // Try common Material icons (ic_ prefix)
+    val icResourceId = context.resources.getIdentifier(
+      "ic_$name",
+      "drawable",
+      context.packageName
+    )
+
+    if (icResourceId != 0) {
+      return ContextCompat.getDrawable(context, icResourceId)
+    }
+
+    Log.d(TAG, "Drawable not found: $name")
+    return null
+  }
+
+  private fun tintDrawable(drawable: Drawable, colorString: String?): Drawable {
+    if (colorString.isNullOrEmpty()) return drawable
+
+    val color = parseColor(colorString) ?: return drawable
+
+    val wrappedDrawable = DrawableCompat.wrap(drawable.mutate())
+    DrawableCompat.setTint(wrappedDrawable, color)
+    return wrappedDrawable
+  }
+
+  private fun parseColor(colorString: String): Int? {
+    return try {
+      // Support hex colors like "#FF0000" or "FF0000"
+      val hex = if (colorString.startsWith("#")) colorString else "#$colorString"
+      Color.parseColor(hex)
+    } catch (e: Exception) {
+      Log.d(TAG, "Failed to parse color: $colorString")
+      null
+    }
+  }
+
+  override fun onDetachedFromWindow() {
+    cancelPendingLongPress()
+    if (popupShowing) {
+      dismissProgrammatic = true
+      popupMenu?.dismiss()
+    }
+    super.onDetachedFromWindow()
+  }
+}

package/android/src/main/java/com/platformcomponents/PCContextMenuViewManager.kt

@@ -0,0 +1,200 @@
+package com.platformcomponents
+
+import android.view.View
+import com.facebook.react.bridge.ReadableArray
+import com.facebook.react.bridge.ReadableMap
+import com.facebook.react.uimanager.ThemedReactContext
+import com.facebook.react.uimanager.UIManagerHelper
+import com.facebook.react.uimanager.ViewGroupManager
+import com.facebook.react.uimanager.ViewManagerDelegate
+import com.facebook.react.uimanager.events.Event
+import com.facebook.react.uimanager.events.RCTEventEmitter
+import com.facebook.react.viewmanagers.PCContextMenuManagerDelegate
+import com.facebook.react.viewmanagers.PCContextMenuManagerInterface
+
+class PCContextMenuViewManager :
+  ViewGroupManager<PCContextMenuView>(),
+  PCContextMenuManagerInterface<PCContextMenuView> {
+
+  companion object {
+    private const val TAG = "PCContextMenu"
+  }
+
+  private val delegate: ViewManagerDelegate<PCContextMenuView> =
+    PCContextMenuManagerDelegate(this)
+
+  override fun getName(): String = "PCContextMenu"
+
+  override fun getDelegate(): ViewManagerDelegate<PCContextMenuView> = delegate
+
+  override fun createViewInstance(reactContext: ThemedReactContext): PCContextMenuView {
+    return PCContextMenuView(reactContext)
+  }
+
+  override fun addEventEmitters(reactContext: ThemedReactContext, view: PCContextMenuView) {
+    val dispatcher = UIManagerHelper.getEventDispatcherForReactTag(reactContext, view.id)
+
+    view.onPressAction = { id, title ->
+      dispatcher?.dispatchEvent(PressActionEvent(view.id, id, title))
+    }
+
+    view.onMenuOpen = {
+      dispatcher?.dispatchEvent(MenuOpenEvent(view.id))
+    }
+
+    view.onMenuClose = {
+      dispatcher?.dispatchEvent(MenuCloseEvent(view.id))
+    }
+  }
+
+  override fun setTitle(view: PCContextMenuView, value: String?) {
+    view.applyMenuTitle(value)
+  }
+
+  override fun setActions(view: PCContextMenuView, value: ReadableArray?) {
+    val out = ArrayList<PCContextMenuView.Action>()
+    if (value != null) {
+      for (i in 0 until value.size()) {
+        val m = value.getMap(i) ?: continue
+        out.add(parseAction(m))
+      }
+    }
+    view.applyActions(out)
+  }
+
+  private fun parseAction(map: ReadableMap): PCContextMenuView.Action {
+    val id = map.getStringOrEmpty("id")
+    val title = map.getStringOrEmpty("title")
+    val subtitle = map.getStringOrNull("subtitle")
+    val image = map.getStringOrNull("image")
+    val imageColor = map.getStringOrNull("imageColor")
+    val state = map.getStringOrNull("state")
+
+    // Parse attributes
+    var destructive = false
+    var disabled = false
+    var hidden = false
+    if (map.hasKey("attributes") && !map.isNull("attributes")) {
+      val attrs = map.getMap("attributes")
+      if (attrs != null) {
+        destructive = attrs.getStringOrEmpty("destructive") == "true"
+        disabled = attrs.getStringOrEmpty("disabled") == "true"
+        hidden = attrs.getStringOrEmpty("hidden") == "true"
+      }
+    }
+
+    // Parse subactions recursively
+    val subactions = ArrayList<PCContextMenuView.Action>()
+    if (map.hasKey("subactions") && !map.isNull("subactions")) {
+      val subs = map.getArray("subactions")
+      if (subs != null) {
+        for (j in 0 until subs.size()) {
+          val subMap = subs.getMap(j) ?: continue
+          subactions.add(parseAction(subMap))
+        }
+      }
+    }
+
+    return PCContextMenuView.Action(
+      id = id,
+      title = title,
+      subtitle = subtitle,
+      image = image,
+      imageColor = imageColor,
+      destructive = destructive,
+      disabled = disabled,
+      hidden = hidden,
+      state = state,
+      subactions = subactions
+    )
+  }
+
+  private fun ReadableMap.getStringOrEmpty(key: String): String {
+    return if (hasKey(key) && !isNull(key)) getString(key) ?: "" else ""
+  }
+
+  private fun ReadableMap.getStringOrNull(key: String): String? {
+    return if (hasKey(key) && !isNull(key)) getString(key) else null
+  }
+
+  override fun setInteractivity(view: PCContextMenuView, value: String?) {
+    view.applyInteractivity(value)
+  }
+
+  override fun setTrigger(view: PCContextMenuView, value: String?) {
+    view.applyTrigger(value)
+  }
+
+  override fun setIos(view: PCContextMenuView, value: ReadableMap?) {
+    // Android ignores iOS config
+  }
+
+  override fun setAndroid(view: PCContextMenuView, value: ReadableMap?) {
+    if (value == null) {
+      view.applyAndroidAnchorPosition(null)
+      view.applyAndroidVisible(null)
+      return
+    }
+
+    val anchorPosition = if (value.hasKey("anchorPosition") && !value.isNull("anchorPosition")) {
+      value.getString("anchorPosition")
+    } else {
+      null
+    }
+    view.applyAndroidAnchorPosition(anchorPosition)
+
+    val visible = if (value.hasKey("visible") && !value.isNull("visible")) {
+      value.getString("visible")
+    } else {
+      null
+    }
+    view.applyAndroidVisible(visible)
+  }
+
+  // --- ViewGroupManager child management ---
+  override fun addView(parent: PCContextMenuView, child: View, index: Int) {
+    parent.addView(child, index)
+  }
+
+  override fun removeViewAt(parent: PCContextMenuView, index: Int) {
+    parent.removeViewAt(index)
+  }
+
+  override fun getChildCount(parent: PCContextMenuView): Int {
+    return parent.childCount
+  }
+
+  override fun getChildAt(parent: PCContextMenuView, index: Int): View? {
+    return parent.getChildAt(index)
+  }
+
+  // --- Events ---
+  private class PressActionEvent(
+    surfaceId: Int,
+    private val actionId: String,
+    private val actionTitle: String
+  ) : Event<PressActionEvent>(surfaceId) {
+    override fun getEventName(): String = "topPressAction"
+    override fun dispatch(rctEventEmitter: RCTEventEmitter) {
+      val payload = com.facebook.react.bridge.Arguments.createMap().apply {
+        putString("actionId", actionId)
+        putString("actionTitle", actionTitle)
+      }
+      rctEventEmitter.receiveEvent(viewTag, eventName, payload)
+    }
+  }
+
+  private class MenuOpenEvent(surfaceId: Int) : Event<MenuOpenEvent>(surfaceId) {
+    override fun getEventName(): String = "topMenuOpen"
+    override fun dispatch(rctEventEmitter: RCTEventEmitter) {
+      rctEventEmitter.receiveEvent(viewTag, eventName, com.facebook.react.bridge.Arguments.createMap())
+    }
+  }
+
+  private class MenuCloseEvent(surfaceId: Int) : Event<MenuCloseEvent>(surfaceId) {
+    override fun getEventName(): String = "topMenuClose"
+    override fun dispatch(rctEventEmitter: RCTEventEmitter) {
+      rctEventEmitter.receiveEvent(viewTag, eventName, com.facebook.react.bridge.Arguments.createMap())
+    }
+  }
+}

package/android/src/main/java/com/platformcomponents/PCSelectionMenuView.kt

@@ -341,12 +341,16 @@ class PCSelectionMenuView(context: Context) : FrameLayout(context), ReactScrollV
 
     if (mode == MaterialMode.M3) {
       // M3 exposed dropdown menu - the standard Material 3 way
+      // Must set box background mode BEFORE setting endIconMode to avoid IllegalStateException
       val til = TextInputLayout(context).apply {
         layoutParams = FrameLayout.LayoutParams(
           FrameLayout.LayoutParams.MATCH_PARENT,
           FrameLayout.LayoutParams.WRAP_CONTENT
         )
+        // Set box background mode first - required for END_ICON_DROPDOWN_MENU
+        boxBackgroundMode = TextInputLayout.BOX_BACKGROUND_OUTLINE
         hint = placeholder
+        // Now safe to set the dropdown icon
         endIconMode = TextInputLayout.END_ICON_DROPDOWN_MENU
       }
 

package/android/src/main/java/com/platformcomponents/PlatformComponentsPackage.kt

@@ -13,6 +13,7 @@ class PlatformComponentsViewPackage : ReactPackage {
       return listOf(
           PCSelectionMenuViewManager(),
           PCDatePickerViewManager(),
+          PCContextMenuViewManager(),
       )
   }
 

package/app.plugin.cjs

@@ -0,0 +1,4 @@
+// Expo config plugin entry point
+// This file is used by Expo to locate the config plugin
+
+module.exports = require('./plugin/build/index.cjs').default;

package/expo-module.config.json

@@ -0,0 +1,4 @@
+{
+  "name": "react-native-platform-components",
+  "platforms": ["ios", "android"]
+}

package/ios/PCContextMenu.h

@@ -0,0 +1,12 @@
+// PCContextMenu.h
+
+#import <React/RCTViewComponentView.h>
+#import <UIKit/UIKit.h>
+
+NS_ASSUME_NONNULL_BEGIN
+
+@interface PCContextMenu : RCTViewComponentView
+
+@end
+
+NS_ASSUME_NONNULL_END