@thelacanians/vue-native-cli 0.4.3 → 0.4.4

package/native/android/VueNativeCore/src/main/kotlin/com/vuenative/core/Components/Factories/VInputFactory.kt

@@ -0,0 +1,210 @@
+package com.vuenative.core
+
+import android.content.Context
+import android.graphics.Color
+import android.text.Editable
+import android.text.InputFilter
+import android.text.InputType
+import android.text.TextWatcher
+import android.view.View
+import android.view.ViewGroup
+import android.view.inputmethod.EditorInfo
+import android.widget.EditText
+
+class VInputFactory : NativeComponentFactory {
+    private val changeHandlers = mutableMapOf<EditText, (Any?) -> Unit>()
+    private val submitHandlers = mutableMapOf<EditText, (Any?) -> Unit>()
+    private val focusHandlers = mutableMapOf<EditText, (Any?) -> Unit>()
+    private val blurHandlers = mutableMapOf<EditText, (Any?) -> Unit>()
+    private val textWatchers = mutableMapOf<EditText, TextWatcher>()
+
+    override fun createView(context: Context): View {
+        return EditText(context).apply {
+            setBackgroundColor(Color.TRANSPARENT)
+            setPadding(0, 0, 0, 0)
+            textSize = 16f
+            setTextColor(Color.BLACK)
+            layoutParams = ViewGroup.LayoutParams(
+                ViewGroup.LayoutParams.WRAP_CONTENT,
+                ViewGroup.LayoutParams.WRAP_CONTENT
+            )
+        }
+    }
+
+    override fun updateProp(view: View, key: String, value: Any?) {
+        val et = view as? EditText ?: return
+        when (key) {
+            "text", "value" -> {
+                val newText = value?.toString() ?: ""
+                if (et.text.toString() != newText) {
+                    et.setText(newText)
+                    et.setSelection(newText.length)
+                }
+            }
+            "placeholder" -> et.hint = value?.toString()
+            "placeholderColor", "placeholderTextColor" -> {
+                val color = StyleEngine.parseColor(value)
+                if (color != null) et.setHintTextColor(color)
+            }
+            "editable" -> et.isEnabled = value != false && value != "false"
+            "keyboardType" -> {
+                et.inputType = when (value) {
+                    "numeric", "number-pad", "decimal-pad" ->
+                        InputType.TYPE_CLASS_NUMBER or InputType.TYPE_NUMBER_FLAG_DECIMAL
+                    "email-address", "email" ->
+                        InputType.TYPE_CLASS_TEXT or InputType.TYPE_TEXT_VARIATION_EMAIL_ADDRESS
+                    "phone-pad", "phone" -> InputType.TYPE_CLASS_PHONE
+                    "url" -> InputType.TYPE_CLASS_TEXT or InputType.TYPE_TEXT_VARIATION_URI
+                    else -> InputType.TYPE_CLASS_TEXT
+                }
+            }
+            "secureTextEntry" -> {
+                if (value == true || value == "true") {
+                    et.inputType = InputType.TYPE_CLASS_TEXT or InputType.TYPE_TEXT_VARIATION_PASSWORD
+                }
+            }
+            "multiline" -> {
+                if (value == true || value == "true") {
+                    et.inputType = et.inputType or InputType.TYPE_TEXT_FLAG_MULTI_LINE
+                    et.isSingleLine = false
+                }
+            }
+            "returnKeyType" -> {
+                et.imeOptions = when (value) {
+                    "done"   -> EditorInfo.IME_ACTION_DONE
+                    "go"     -> EditorInfo.IME_ACTION_GO
+                    "next"   -> EditorInfo.IME_ACTION_NEXT
+                    "search" -> EditorInfo.IME_ACTION_SEARCH
+                    "send"   -> EditorInfo.IME_ACTION_SEND
+                    else     -> EditorInfo.IME_ACTION_DONE
+                }
+            }
+            "maxLength" -> {
+                val n = StyleEngine.toInt(value, 0)
+                if (n > 0) {
+                    et.filters = arrayOf(InputFilter.LengthFilter(n))
+                } else {
+                    // Remove length filter
+                    et.filters = et.filters.filter { it !is InputFilter.LengthFilter }.toTypedArray()
+                }
+            }
+            "autoCapitalize", "autocapitalize" -> {
+                // Clear existing cap flags first
+                val baseType = et.inputType and
+                    (InputType.TYPE_TEXT_FLAG_CAP_CHARACTERS or
+                     InputType.TYPE_TEXT_FLAG_CAP_WORDS or
+                     InputType.TYPE_TEXT_FLAG_CAP_SENTENCES).inv()
+                et.inputType = when (value) {
+                    "characters", "allCharacters" -> baseType or InputType.TYPE_TEXT_FLAG_CAP_CHARACTERS
+                    "words"      -> baseType or InputType.TYPE_TEXT_FLAG_CAP_WORDS
+                    "sentences"  -> baseType or InputType.TYPE_TEXT_FLAG_CAP_SENTENCES
+                    "none"       -> baseType
+                    else         -> baseType or InputType.TYPE_TEXT_FLAG_CAP_SENTENCES
+                }
+            }
+            "autoCorrect", "autocorrect" -> {
+                if (value == true || value == "true") {
+                    et.inputType = et.inputType or InputType.TYPE_TEXT_FLAG_AUTO_CORRECT
+                } else if (value == false || value == "false") {
+                    et.inputType = et.inputType and InputType.TYPE_TEXT_FLAG_AUTO_CORRECT.inv()
+                }
+            }
+            "textAlign", "textAlignment" -> {
+                et.textAlignment = when (value) {
+                    "left"   -> View.TEXT_ALIGNMENT_TEXT_START
+                    "center" -> View.TEXT_ALIGNMENT_CENTER
+                    "right"  -> View.TEXT_ALIGNMENT_TEXT_END
+                    else     -> View.TEXT_ALIGNMENT_TEXT_START
+                }
+            }
+            "color" -> {
+                val color = StyleEngine.parseColor(value)
+                if (color != null) et.setTextColor(color)
+            }
+            "fontSize" -> {
+                val size = when (value) {
+                    is Number -> value.toFloat()
+                    is String -> value.toFloatOrNull()
+                    else -> null
+                }
+                if (size != null) et.textSize = size
+            }
+            else -> StyleEngine.apply(key, value, view)
+        }
+    }
+
+    override fun addEventListener(view: View, event: String, handler: (Any?) -> Unit) {
+        val et = view as? EditText ?: return
+        when (event) {
+            "change", "input", "changetext" -> {
+                changeHandlers[et] = handler
+                // Remove old watcher if any
+                textWatchers[et]?.let { et.removeTextChangedListener(it) }
+                val watcher = object : TextWatcher {
+                    override fun beforeTextChanged(s: CharSequence?, start: Int, count: Int, after: Int) {}
+                    override fun onTextChanged(s: CharSequence?, start: Int, before: Int, count: Int) {}
+                    override fun afterTextChanged(s: Editable?) {
+                        changeHandlers[et]?.invoke(mapOf("value" to (s?.toString() ?: "")))
+                    }
+                }
+                textWatchers[et] = watcher
+                et.addTextChangedListener(watcher)
+            }
+            "submit" -> {
+                submitHandlers[et] = handler
+                et.setOnEditorActionListener { _, _, _ ->
+                    submitHandlers[et]?.invoke(mapOf("value" to et.text.toString()))
+                    true
+                }
+            }
+            "focus" -> {
+                focusHandlers[et] = handler
+                ensureFocusListener(et)
+            }
+            "blur" -> {
+                blurHandlers[et] = handler
+                ensureFocusListener(et)
+            }
+        }
+    }
+
+    override fun removeEventListener(view: View, event: String) {
+        val et = view as? EditText ?: return
+        when (event) {
+            "change", "input", "changetext" -> {
+                changeHandlers.remove(et)
+                textWatchers.remove(et)?.let { et.removeTextChangedListener(it) }
+            }
+            "submit" -> {
+                submitHandlers.remove(et)
+                et.setOnEditorActionListener(null)
+            }
+            "focus" -> {
+                focusHandlers.remove(et)
+                if (blurHandlers[et] == null) {
+                    et.onFocusChangeListener = null
+                }
+            }
+            "blur" -> {
+                blurHandlers.remove(et)
+                if (focusHandlers[et] == null) {
+                    et.onFocusChangeListener = null
+                }
+            }
+        }
+    }
+
+    /**
+     * Sets a single OnFocusChangeListener that dispatches to both focus and blur handlers.
+     * This avoids the problem of one listener overwriting the other.
+     */
+    private fun ensureFocusListener(et: EditText) {
+        et.onFocusChangeListener = View.OnFocusChangeListener { _, hasFocus ->
+            if (hasFocus) {
+                focusHandlers[et]?.invoke(null)
+            } else {
+                blurHandlers[et]?.invoke(null)
+            }
+        }
+    }
+}

package/native/android/VueNativeCore/src/main/kotlin/com/vuenative/core/Components/Factories/VKeyboardAvoidingFactory.kt

@@ -0,0 +1,31 @@
+package com.vuenative.core
+
+import android.content.Context
+import android.view.View
+import android.view.ViewGroup
+import android.view.ViewTreeObserver
+import com.google.android.flexbox.FlexDirection
+import com.google.android.flexbox.FlexboxLayout
+
+class VKeyboardAvoidingFactory : NativeComponentFactory {
+    override fun createView(context: Context): View {
+        val flex = FlexboxLayout(context).apply {
+            flexDirection = FlexDirection.COLUMN
+            layoutParams = ViewGroup.LayoutParams(
+                ViewGroup.LayoutParams.MATCH_PARENT,
+                ViewGroup.LayoutParams.MATCH_PARENT
+            )
+        }
+        // The Activity sets android:windowSoftInputMode="adjustResize" which
+        // makes the system handle keyboard avoidance automatically on Android.
+        return flex
+    }
+    override fun updateProp(view: View, key: String, value: Any?) = StyleEngine.apply(key, value, view)
+    override fun addEventListener(view: View, event: String, handler: (Any?) -> Unit) {}
+    override fun removeEventListener(view: View, event: String) {}
+    override fun insertChild(parent: View, child: View, index: Int) {
+        val flex = parent as? FlexboxLayout ?: return
+        val lp = StyleEngine.buildFlexLayoutParams(child)
+        if (index >= flex.childCount) flex.addView(child, lp) else flex.addView(child, index, lp)
+    }
+}

package/native/android/VueNativeCore/src/main/kotlin/com/vuenative/core/Components/Factories/VListFactory.kt

@@ -0,0 +1,183 @@
+package com.vuenative.core
+
+import android.content.Context
+import android.view.View
+import android.view.ViewGroup
+import androidx.recyclerview.widget.LinearLayoutManager
+import androidx.recyclerview.widget.RecyclerView
+
+class VListFactory : NativeComponentFactory {
+    // For each RecyclerView, store child views managed by the bridge.
+    // All maps are cleaned up in cleanupRecyclerView() when the view is removed.
+    private val childViews = mutableMapOf<RecyclerView, MutableList<View>>()
+    private val scrollHandlers = mutableMapOf<RecyclerView, (Any?) -> Unit>()
+    private val endReachedHandlers = mutableMapOf<RecyclerView, (Any?) -> Unit>()
+    private val scrollListeners = mutableMapOf<RecyclerView, RecyclerView.OnScrollListener>()
+    private val firedEndReached = mutableMapOf<RecyclerView, Boolean>()
+    private val estimatedItemHeights = mutableMapOf<RecyclerView, Int>()
+
+    override fun createView(context: Context): View {
+        val rv = RecyclerView(context).apply {
+            layoutManager = LinearLayoutManager(context)
+            layoutParams = ViewGroup.LayoutParams(
+                ViewGroup.LayoutParams.MATCH_PARENT,
+                ViewGroup.LayoutParams.MATCH_PARENT
+            )
+        }
+        childViews[rv] = mutableListOf()
+        firedEndReached[rv] = false
+        rv.adapter = VListAdapter(childViews[rv]!!)
+        return rv
+    }
+
+    override fun updateProp(view: View, key: String, value: Any?) {
+        val rv = view as? RecyclerView ?: return
+        when (key) {
+            "horizontal" -> {
+                if (value == true) {
+                    rv.layoutManager = LinearLayoutManager(rv.context, LinearLayoutManager.HORIZONTAL, false)
+                }
+            }
+            "bounces" -> {
+                rv.overScrollMode = if (value == false || value == "false")
+                    View.OVER_SCROLL_NEVER else View.OVER_SCROLL_ALWAYS
+            }
+            "showsScrollIndicator" -> {
+                val show = value != false && value != "false"
+                rv.isVerticalScrollBarEnabled = show
+                rv.isHorizontalScrollBarEnabled = show
+            }
+            "estimatedItemHeight" -> {
+                val h = when (value) {
+                    is Number -> value.toInt()
+                    is String -> value.toIntOrNull() ?: 44
+                    else -> 44
+                }
+                estimatedItemHeights[rv] = h
+            }
+            else -> StyleEngine.apply(key, value, view)
+        }
+    }
+
+    override fun addEventListener(view: View, event: String, handler: (Any?) -> Unit) {
+        val rv = view as? RecyclerView ?: return
+        when (event) {
+            "scroll" -> {
+                scrollHandlers[rv] = handler
+                ensureScrollListener(rv)
+            }
+            "endReached" -> {
+                endReachedHandlers[rv] = handler
+                ensureScrollListener(rv)
+            }
+        }
+    }
+
+    override fun removeEventListener(view: View, event: String) {
+        val rv = view as? RecyclerView ?: return
+        when (event) {
+            "scroll" -> scrollHandlers.remove(rv)
+            "endReached" -> endReachedHandlers.remove(rv)
+        }
+        // Remove listener if neither handler is registered
+        if (!scrollHandlers.containsKey(rv) && !endReachedHandlers.containsKey(rv)) {
+            scrollListeners.remove(rv)?.let { rv.removeOnScrollListener(it) }
+        }
+    }
+
+    private fun ensureScrollListener(rv: RecyclerView) {
+        if (scrollListeners.containsKey(rv)) return
+        // Track cumulative scroll position
+        var cumulativeX = 0
+        var cumulativeY = 0
+        val listener = object : RecyclerView.OnScrollListener() {
+            override fun onScrolled(recyclerView: RecyclerView, dx: Int, dy: Int) {
+                cumulativeX += dx
+                cumulativeY += dy
+
+                // Dispatch scroll event with cumulative position
+                scrollHandlers[recyclerView]?.invoke(
+                    mapOf("x" to cumulativeX, "y" to cumulativeY)
+                )
+
+                // endReached detection (threshold = 20% from bottom)
+                val lm = recyclerView.layoutManager as? LinearLayoutManager ?: return
+                val totalItems = lm.itemCount
+                if (totalItems == 0) return
+                val lastVisible = lm.findLastVisibleItemPosition()
+                val threshold = (totalItems * 0.2).toInt().coerceAtLeast(1)
+
+                if (lastVisible >= totalItems - threshold) {
+                    if (firedEndReached[recyclerView] != true) {
+                        firedEndReached[recyclerView] = true
+                        endReachedHandlers[recyclerView]?.invoke(null)
+                    }
+                } else {
+                    // Reset when scrolled back up significantly
+                    firedEndReached[recyclerView] = false
+                }
+            }
+        }
+        scrollListeners[rv] = listener
+        rv.addOnScrollListener(listener)
+    }
+
+    override fun insertChild(parent: View, child: View, index: Int) {
+        val rv = parent as? RecyclerView ?: return
+        val list = childViews[rv] ?: return
+        val insertIdx = if (index >= list.size) list.size else index
+        list.add(insertIdx, child)
+        rv.adapter?.notifyItemInserted(insertIdx)
+    }
+
+    override fun removeChild(parent: View, child: View) {
+        val rv = parent as? RecyclerView ?: return
+        val list = childViews[rv] ?: return
+        val idx = list.indexOf(child)
+        if (idx >= 0) {
+            list.removeAt(idx)
+            rv.adapter?.notifyItemRemoved(idx)
+        }
+    }
+
+    /**
+     * Clean up all state associated with a RecyclerView when it is removed from the tree.
+     * Prevents memory leaks by clearing all map entries that reference the view.
+     */
+    fun cleanupRecyclerView(rv: RecyclerView) {
+        scrollListeners.remove(rv)?.let { rv.removeOnScrollListener(it) }
+        scrollHandlers.remove(rv)
+        endReachedHandlers.remove(rv)
+        firedEndReached.remove(rv)
+        estimatedItemHeights.remove(rv)
+        childViews.remove(rv)
+        rv.adapter = null
+    }
+
+    /**
+     * Called when the parent view is being destroyed. Cleans up the RecyclerView.
+     */
+    fun destroyView(view: View) {
+        val rv = view as? RecyclerView ?: return
+        cleanupRecyclerView(rv)
+    }
+}
+
+class VListAdapter(private val items: List<View>) : RecyclerView.Adapter<VListAdapter.VH>() {
+    class VH(val view: View) : RecyclerView.ViewHolder(view)
+
+    override fun onCreateViewHolder(parent: ViewGroup, viewType: Int): VH {
+        val v = items.getOrNull(viewType) ?: android.widget.FrameLayout(parent.context)
+        // Remove from any existing parent
+        (v.parent as? ViewGroup)?.removeView(v)
+        v.layoutParams = RecyclerView.LayoutParams(
+            RecyclerView.LayoutParams.MATCH_PARENT,
+            RecyclerView.LayoutParams.WRAP_CONTENT
+        )
+        return VH(v)
+    }
+
+    override fun onBindViewHolder(holder: VH, position: Int) {}
+    override fun getItemCount(): Int = items.size
+    override fun getItemViewType(position: Int): Int = position
+}

package/native/android/VueNativeCore/src/main/kotlin/com/vuenative/core/Components/Factories/VModalFactory.kt

@@ -0,0 +1,105 @@
+package com.vuenative.core
+
+import android.app.Dialog
+import android.content.Context
+import android.graphics.Color
+import android.graphics.drawable.ColorDrawable
+import android.view.View
+import android.view.ViewGroup
+import android.view.Window
+import com.google.android.flexbox.FlexDirection
+import com.google.android.flexbox.FlexboxLayout
+
+class VModalFactory : NativeComponentFactory {
+    private val dialogs = mutableMapOf<View, Dialog>()
+    private val contentContainers = mutableMapOf<View, FlexboxLayout>()
+    private val dismissHandlers = mutableMapOf<View, (Any?) -> Unit>()
+
+    override fun createView(context: Context): View {
+        // Return a zero-size placeholder view
+        return View(context).apply {
+            layoutParams = ViewGroup.LayoutParams(0, 0)
+            visibility = View.GONE
+        }
+    }
+
+    override fun updateProp(view: View, key: String, value: Any?) {
+        when (key) {
+            "visible" -> {
+                val show = value == true || value == "true"
+                if (show) showModal(view) else dismissModal(view)
+            }
+            "animationType" -> {} // TODO: dialog animation
+            "transparent" -> {
+                if (value == true) {
+                    dialogs[view]?.window?.setBackgroundDrawable(ColorDrawable(Color.TRANSPARENT))
+                }
+            }
+        }
+    }
+
+    private fun showModal(view: View) {
+        val ctx = view.context
+        if (dialogs[view]?.isShowing == true) return
+        val dialog = Dialog(ctx, android.R.style.Theme_Translucent_NoTitleBar_Fullscreen)
+        dialog.requestWindowFeature(Window.FEATURE_NO_TITLE)
+        dialog.window?.setBackgroundDrawable(ColorDrawable(Color.TRANSPARENT))
+
+        val content = contentContainers.getOrPut(view) {
+            FlexboxLayout(ctx).apply {
+                flexDirection = FlexDirection.COLUMN
+                layoutParams = ViewGroup.LayoutParams(
+                    ViewGroup.LayoutParams.MATCH_PARENT,
+                    ViewGroup.LayoutParams.MATCH_PARENT
+                )
+            }
+        }
+        (content.parent as? ViewGroup)?.removeView(content)
+        dialog.setContentView(content)
+        dialog.setOnDismissListener { dismissHandlers[view]?.invoke(null) }
+        dialog.show()
+        dialogs[view] = dialog
+    }
+
+    private fun dismissModal(view: View) {
+        dialogs[view]?.dismiss()
+        dialogs.remove(view)
+    }
+
+    override fun addEventListener(view: View, event: String, handler: (Any?) -> Unit) {
+        if (event == "dismiss") dismissHandlers[view] = handler
+    }
+
+    override fun removeEventListener(view: View, event: String) {
+        if (event == "dismiss") dismissHandlers.remove(view)
+    }
+
+    override fun insertChild(parent: View, child: View, index: Int) {
+        val container = contentContainers.getOrPut(parent) {
+            FlexboxLayout(parent.context).apply {
+                flexDirection = FlexDirection.COLUMN
+            }
+        }
+        val lp = StyleEngine.buildFlexLayoutParams(child)
+        if (index >= container.childCount) container.addView(child, lp)
+        else container.addView(child, index, lp)
+    }
+
+    override fun removeChild(parent: View, child: View) {
+        contentContainers[parent]?.removeView(child)
+    }
+
+    /**
+     * Clean up all state associated with a modal view when it is removed from the tree.
+     * Dismisses the dialog and clears all map entries that reference the view,
+     * preventing memory leaks.
+     */
+    fun destroyView(view: View) {
+        dialogs[view]?.let { dialog ->
+            if (dialog.isShowing) dialog.dismiss()
+        }
+        dialogs.remove(view)
+        contentContainers.remove(view)
+        dismissHandlers.remove(view)
+    }
+}

package/native/android/VueNativeCore/src/main/kotlin/com/vuenative/core/Components/Factories/VPickerFactory.kt

@@ -0,0 +1,57 @@
+package com.vuenative.core
+
+import android.content.Context
+import android.view.View
+import android.view.ViewGroup
+import android.widget.DatePicker
+import android.widget.TimePicker
+import java.util.Calendar
+
+class VPickerFactory : NativeComponentFactory {
+    private val changeHandlers = mutableMapOf<View, (Any?) -> Unit>()
+
+    override fun createView(context: Context): View {
+        return DatePicker(context).apply {
+            layoutParams = ViewGroup.LayoutParams(
+                ViewGroup.LayoutParams.WRAP_CONTENT,
+                ViewGroup.LayoutParams.WRAP_CONTENT
+            )
+        }
+    }
+
+    override fun updateProp(view: View, key: String, value: Any?) {
+        val dp = view as? DatePicker ?: return
+        when (key) {
+            "value" -> {
+                val ms = StyleEngine.toFloat(value, 0f).toLong()
+                val cal = Calendar.getInstance().apply { timeInMillis = ms }
+                dp.updateDate(cal.get(Calendar.YEAR), cal.get(Calendar.MONTH), cal.get(Calendar.DAY_OF_MONTH))
+            }
+            "minimumDate" -> {
+                val ms = StyleEngine.toFloat(value, 0f).toLong()
+                dp.minDate = ms
+            }
+            "maximumDate" -> {
+                val ms = StyleEngine.toFloat(value, 0f).toLong()
+                dp.maxDate = ms
+            }
+            "mode" -> {} // DatePicker handles date mode; TimePicker for time
+            else -> StyleEngine.apply(key, value, view)
+        }
+    }
+
+    override fun addEventListener(view: View, event: String, handler: (Any?) -> Unit) {
+        val dp = view as? DatePicker ?: return
+        if (event == "change") {
+            changeHandlers[view] = handler
+            dp.init(
+                dp.year, dp.month, dp.dayOfMonth
+            ) { _, year, month, day ->
+                val cal = Calendar.getInstance().apply { set(year, month, day) }
+                changeHandlers[view]?.invoke(mapOf("value" to cal.timeInMillis.toDouble()))
+            }
+        }
+    }
+
+    override fun removeEventListener(view: View, event: String) { changeHandlers.remove(view) }
+}