@thelacanians/vue-native-cli 0.4.2 → 0.4.4

package/native/ios/VueNativeCore/Sources/VueNativeCore/Components/Factories/VInputFactory.swift

@@ -0,0 +1,357 @@
+#if canImport(UIKit)
+import UIKit
+import ObjectiveC
+import FlexLayout
+
+/// Factory for VInput — the text input component.
+/// Maps to a UITextField with FlexLayout enabled.
+/// Supports v-model via text prop and changetext event.
+final class VInputFactory: NativeComponentFactory {
+
+    // MARK: - Associated object keys
+
+    private static var delegateKey: UInt8 = 0
+    private static var changeTextHandlerKey: UInt8 = 0
+    private static var focusHandlerKey: UInt8 = 0
+    private static var blurHandlerKey: UInt8 = 0
+    private static var submitHandlerKey: UInt8 = 0
+
+    // MARK: - Keyboard type mapping
+
+    static let keyboardTypeMap: [String: UIKeyboardType] = [
+        "default": .default,
+        "numeric": .numberPad,
+        "number-pad": .numberPad,
+        "decimal-pad": .decimalPad,
+        "email": .emailAddress,
+        "email-address": .emailAddress,
+        "phone": .phonePad,
+        "phone-pad": .phonePad,
+        "url": .URL,
+        "web-search": .webSearch,
+        "ascii": .asciiCapable,
+    ]
+
+    // MARK: - Return key mapping
+
+    static let returnKeyMap: [String: UIReturnKeyType] = [
+        "default": .default,
+        "done": .done,
+        "go": .go,
+        "next": .next,
+        "search": .search,
+        "send": .send,
+        "join": .join,
+        "route": .route,
+    ]
+
+    // MARK: - Auto-capitalize mapping
+
+    static let autoCapitalizeMap: [String: UITextAutocapitalizationType] = [
+        "none": .none,
+        "words": .words,
+        "sentences": .sentences,
+        "characters": .allCharacters,
+    ]
+
+    // MARK: - NativeComponentFactory
+
+    func createView() -> UIView {
+        let textField = UITextField()
+        textField.borderStyle = .none
+        // Accessing .flex automatically enables Yoga layout.
+        // Set a sensible default height so the text field is not collapsed.
+        textField.flex.height(44)
+        return textField
+    }
+
+    func updateProp(view: UIView, key: String, value: Any?) {
+        guard let textField = view as? UITextField else {
+            StyleEngine.apply(key: key, value: value, to: view)
+            return
+        }
+
+        switch key {
+        case "text", "value":
+            if let text = value as? String {
+                // Only update if different to avoid cursor jump
+                if textField.text != text {
+                    textField.text = text
+                }
+            } else {
+                textField.text = nil
+            }
+
+        case "placeholder":
+            if let placeholder = value as? String {
+                textField.placeholder = placeholder
+            } else {
+                textField.placeholder = nil
+            }
+
+        case "placeholderColor", "placeholderTextColor":
+            if let colorStr = value as? String, let placeholder = textField.placeholder {
+                textField.attributedPlaceholder = NSAttributedString(
+                    string: placeholder,
+                    attributes: [.foregroundColor: UIColor.fromHex(colorStr)]
+                )
+            }
+
+        case "secureTextEntry":
+            if let secure = value as? Bool {
+                textField.isSecureTextEntry = secure
+            } else if let secure = value as? Int {
+                textField.isSecureTextEntry = secure != 0
+            } else {
+                textField.isSecureTextEntry = false
+            }
+
+        case "keyboardType":
+            if let typeStr = value as? String {
+                textField.keyboardType = VInputFactory.keyboardTypeMap[typeStr] ?? .default
+            } else {
+                textField.keyboardType = .default
+            }
+
+        case "returnKeyType":
+            if let typeStr = value as? String {
+                textField.returnKeyType = VInputFactory.returnKeyMap[typeStr] ?? .default
+            } else {
+                textField.returnKeyType = .default
+            }
+
+        case "autoCapitalize", "autocapitalize":
+            if let capStr = value as? String {
+                textField.autocapitalizationType = VInputFactory.autoCapitalizeMap[capStr] ?? .sentences
+            } else {
+                textField.autocapitalizationType = .sentences
+            }
+
+        case "autoCorrect", "autocorrect":
+            if let correct = value as? Bool {
+                textField.autocorrectionType = correct ? .yes : .no
+            } else {
+                textField.autocorrectionType = .default
+            }
+
+        case "editable":
+            if let editable = value as? Bool {
+                textField.isEnabled = editable
+            } else {
+                textField.isEnabled = true
+            }
+
+        case "maxLength":
+            // Store max length for use in delegate
+            if let maxLen = value as? Int {
+                storeMaxLength(maxLen, on: textField)
+            } else if let maxLen = value as? Double {
+                storeMaxLength(Int(maxLen), on: textField)
+            }
+
+        case "color":
+            if let colorStr = value as? String {
+                textField.textColor = UIColor.fromHex(colorStr)
+            } else {
+                textField.textColor = .label
+            }
+
+        case "fontSize":
+            if let size = value as? Double {
+                textField.font = UIFont.systemFont(ofSize: CGFloat(size))
+            } else if let size = value as? Int {
+                textField.font = UIFont.systemFont(ofSize: CGFloat(size))
+            }
+
+        case "textAlign":
+            if let alignStr = value as? String {
+                switch alignStr {
+                case "left": textField.textAlignment = .left
+                case "center": textField.textAlignment = .center
+                case "right": textField.textAlignment = .right
+                default: textField.textAlignment = .natural
+                }
+            }
+
+        default:
+            StyleEngine.apply(key: key, value: value, to: view)
+        }
+    }
+
+    func addEventListener(view: UIView, event: String, handler: @escaping (Any?) -> Void) {
+        guard let textField = view as? UITextField else { return }
+
+        // Ensure we have a delegate proxy set up
+        let delegate = ensureDelegate(for: textField)
+
+        switch event {
+        case "changetext":
+            delegate.onChangeText = handler
+            // Add editingChanged target
+            textField.addTarget(
+                delegate,
+                action: #selector(InputDelegateProxy.textFieldEditingChanged(_:)),
+                for: .editingChanged
+            )
+            objc_setAssociatedObject(
+                view,
+                &VInputFactory.changeTextHandlerKey,
+                handler as AnyObject,
+                .OBJC_ASSOCIATION_RETAIN_NONATOMIC
+            )
+
+        case "focus":
+            delegate.onFocus = handler
+            textField.addTarget(
+                delegate,
+                action: #selector(InputDelegateProxy.textFieldDidBeginEditing(_:)),
+                for: .editingDidBegin
+            )
+            objc_setAssociatedObject(
+                view,
+                &VInputFactory.focusHandlerKey,
+                handler as AnyObject,
+                .OBJC_ASSOCIATION_RETAIN_NONATOMIC
+            )
+
+        case "blur":
+            delegate.onBlur = handler
+            textField.addTarget(
+                delegate,
+                action: #selector(InputDelegateProxy.textFieldDidEndEditing(_:)),
+                for: .editingDidEnd
+            )
+            objc_setAssociatedObject(
+                view,
+                &VInputFactory.blurHandlerKey,
+                handler as AnyObject,
+                .OBJC_ASSOCIATION_RETAIN_NONATOMIC
+            )
+
+        case "submit":
+            delegate.onSubmit = handler
+            textField.addTarget(
+                delegate,
+                action: #selector(InputDelegateProxy.textFieldDidReturn(_:)),
+                for: .editingDidEndOnExit
+            )
+            objc_setAssociatedObject(
+                view,
+                &VInputFactory.submitHandlerKey,
+                handler as AnyObject,
+                .OBJC_ASSOCIATION_RETAIN_NONATOMIC
+            )
+
+        default:
+            break
+        }
+    }
+
+    func removeEventListener(view: UIView, event: String) {
+        guard let textField = view as? UITextField else { return }
+        guard let delegate = objc_getAssociatedObject(textField, &VInputFactory.delegateKey) as? InputDelegateProxy else { return }
+
+        switch event {
+        case "changetext":
+            delegate.onChangeText = nil
+            textField.removeTarget(delegate, action: #selector(InputDelegateProxy.textFieldEditingChanged(_:)), for: .editingChanged)
+        case "focus":
+            delegate.onFocus = nil
+            textField.removeTarget(delegate, action: #selector(InputDelegateProxy.textFieldDidBeginEditing(_:)), for: .editingDidBegin)
+        case "blur":
+            delegate.onBlur = nil
+            textField.removeTarget(delegate, action: #selector(InputDelegateProxy.textFieldDidEndEditing(_:)), for: .editingDidEnd)
+        case "submit":
+            delegate.onSubmit = nil
+            textField.removeTarget(delegate, action: #selector(InputDelegateProxy.textFieldDidReturn(_:)), for: .editingDidEndOnExit)
+        default:
+            break
+        }
+    }
+
+    // MARK: - Private helpers
+
+    private func ensureDelegate(for textField: UITextField) -> InputDelegateProxy {
+        if let existing = objc_getAssociatedObject(textField, &VInputFactory.delegateKey) as? InputDelegateProxy {
+            return existing
+        }
+
+        let delegate = InputDelegateProxy()
+        delegate.maxLengthProvider = { [weak textField] in
+            guard let tf = textField else { return nil }
+            return self.storedMaxLength(on: tf)
+        }
+        textField.delegate = delegate
+        objc_setAssociatedObject(
+            textField,
+            &VInputFactory.delegateKey,
+            delegate,
+            .OBJC_ASSOCIATION_RETAIN_NONATOMIC
+        )
+        return delegate
+    }
+
+    // MARK: - Max length storage
+
+    private static var maxLengthKey: UInt8 = 0
+
+    private func storeMaxLength(_ length: Int, on view: UIView) {
+        objc_setAssociatedObject(view, &VInputFactory.maxLengthKey, length, .OBJC_ASSOCIATION_RETAIN_NONATOMIC)
+    }
+
+    private func storedMaxLength(on view: UIView) -> Int? {
+        return objc_getAssociatedObject(view, &VInputFactory.maxLengthKey) as? Int
+    }
+}
+
+// MARK: - InputDelegateProxy
+
+/// UITextFieldDelegate proxy that routes text field events to closure-based handlers.
+/// Stored as an associated object on the UITextField.
+final class InputDelegateProxy: NSObject, UITextFieldDelegate {
+
+    var onChangeText: ((Any?) -> Void)?
+    var onFocus: ((Any?) -> Void)?
+    var onBlur: ((Any?) -> Void)?
+    var onSubmit: ((Any?) -> Void)?
+    var maxLengthProvider: (() -> Int?)?
+
+    @objc func textFieldEditingChanged(_ textField: UITextField) {
+        onChangeText?(textField.text ?? "")
+    }
+
+    @objc func textFieldDidBeginEditing(_ textField: UITextField) {
+        onFocus?(nil)
+    }
+
+    @objc func textFieldDidEndEditing(_ textField: UITextField) {
+        onBlur?(nil)
+    }
+
+    @objc func textFieldDidReturn(_ textField: UITextField) {
+        onSubmit?(textField.text ?? "")
+    }
+
+    // MARK: - UITextFieldDelegate
+
+    func textField(
+        _ textField: UITextField,
+        shouldChangeCharactersIn range: NSRange,
+        replacementString string: String
+    ) -> Bool {
+        // Enforce max length if set
+        if let maxLength = maxLengthProvider?() {
+            let currentText = textField.text ?? ""
+            let newLength = currentText.count + string.count - range.length
+            return newLength <= maxLength
+        }
+        return true
+    }
+
+    func textFieldShouldReturn(_ textField: UITextField) -> Bool {
+        // Allow return key to trigger editingDidEndOnExit
+        textField.resignFirstResponder()
+        return true
+    }
+}
+#endif

package/native/ios/VueNativeCore/Sources/VueNativeCore/Components/Factories/VKeyboardAvoidingFactory.swift

@@ -0,0 +1,99 @@
+#if canImport(UIKit)
+import UIKit
+import FlexLayout
+
+/// Factory for VKeyboardAvoiding — a container that adjusts its bottom padding
+/// to avoid the system keyboard.
+///
+/// Listens to UIResponder.keyboardWillShowNotification / keyboardWillHideNotification
+/// and updates FlexLayout bottom padding accordingly.
+final class VKeyboardAvoidingFactory: NativeComponentFactory {
+
+    // MARK: - Associated object keys
+
+    private static var observerKey: UInt8 = 0
+
+    // MARK: - NativeComponentFactory
+
+    func createView() -> UIView {
+        let view = KeyboardAvoidingView()
+        _ = view.flex
+        return view
+    }
+
+    func updateProp(view: UIView, key: String, value: Any?) {
+        StyleEngine.apply(key: key, value: value, to: view)
+    }
+
+    func addEventListener(view: UIView, event: String, handler: @escaping (Any?) -> Void) {
+        // No events exposed for keyboard avoiding view
+    }
+}
+
+// MARK: - KeyboardAvoidingView
+
+/// UIView subclass that automatically adjusts its Yoga bottom padding
+/// based on keyboard visibility.
+private final class KeyboardAvoidingView: UIView {
+
+    private var showObserver: NSObjectProtocol?
+    private var hideObserver: NSObjectProtocol?
+
+    override init(frame: CGRect) {
+        super.init(frame: frame)
+        setupKeyboardObservers()
+    }
+
+    required init?(coder: NSCoder) {
+        super.init(coder: coder)
+        setupKeyboardObservers()
+    }
+
+    deinit {
+        if let obs = showObserver { NotificationCenter.default.removeObserver(obs) }
+        if let obs = hideObserver { NotificationCenter.default.removeObserver(obs) }
+    }
+
+    private func setupKeyboardObservers() {
+        showObserver = NotificationCenter.default.addObserver(
+            forName: UIResponder.keyboardWillShowNotification,
+            object: nil,
+            queue: .main
+        ) { [weak self] notification in
+            self?.handleKeyboardShow(notification)
+        }
+
+        hideObserver = NotificationCenter.default.addObserver(
+            forName: UIResponder.keyboardWillHideNotification,
+            object: nil,
+            queue: .main
+        ) { [weak self] _ in
+            self?.handleKeyboardHide()
+        }
+    }
+
+    private func handleKeyboardShow(_ notification: Notification) {
+        guard let keyboardFrame = notification.userInfo?[UIResponder.keyboardFrameEndUserInfoKey] as? CGRect else {
+            return
+        }
+        let keyboardHeight = keyboardFrame.height
+        guard keyboardHeight > 0 else { return }
+        flex.paddingBottom(keyboardHeight)
+        triggerLayout()
+    }
+
+    private func handleKeyboardHide() {
+        flex.paddingBottom(0)
+        triggerLayout()
+    }
+
+    private func triggerLayout() {
+        // Walk up to find the root flex view and trigger layout
+        var view: UIView? = self
+        while let v = view?.superview {
+            view = v
+        }
+        view?.flex.layout()
+    }
+}
+#endif

package/native/ios/VueNativeCore/Sources/VueNativeCore/Components/Factories/VListFactory.swift

@@ -0,0 +1,250 @@
+#if canImport(UIKit)
+import UIKit
+import FlexLayout
+
+// MARK: - VListFactory
+
+/// Factory for VList — a virtualized scrollable list backed by UITableView.
+/// Children inserted via the bridge are stored as table cells, not regular subviews.
+/// Supports scroll and endReached events.
+final class VListFactory: NativeComponentFactory {
+
+    func createView() -> UIView {
+        let container = VListContainerView()
+        _ = container.flex
+        return container
+    }
+
+    func updateProp(view: UIView, key: String, value: Any?) {
+        guard let container = view as? VListContainerView else {
+            StyleEngine.apply(key: key, value: value, to: view)
+            return
+        }
+        switch key {
+        case "estimatedItemHeight":
+            container.estimatedItemHeight = CGFloat(value as? Double ?? 44)
+        case "showsScrollIndicator":
+            container.tableView.showsVerticalScrollIndicator = value as? Bool ?? true
+        case "bounces":
+            container.tableView.bounces = value as? Bool ?? true
+        default:
+            StyleEngine.apply(key: key, value: value, to: view)
+        }
+    }
+
+    func addEventListener(view: UIView, event: String, handler: @escaping (Any?) -> Void) {
+        guard let container = view as? VListContainerView else { return }
+        switch event {
+        case "scroll":
+            container.onScroll = handler
+        case "endReached":
+            container.onEndReached = handler
+        default:
+            break
+        }
+    }
+
+    func removeEventListener(view: UIView, event: String) {
+        guard let container = view as? VListContainerView else { return }
+        switch event {
+        case "scroll": container.onScroll = nil
+        case "endReached": container.onEndReached = nil
+        default: break
+        }
+    }
+
+    // MARK: - Custom child management
+
+    func insertChild(_ child: UIView, into parent: UIView, before anchor: UIView?) {
+        guard let container = parent as? VListContainerView else {
+            // Fallback for non-VList parents (shouldn't happen)
+            if let anchor = anchor, let idx = parent.subviews.firstIndex(of: anchor) {
+                parent.insertSubview(child, at: idx)
+            } else {
+                parent.addSubview(child)
+            }
+            return
+        }
+        let insertIdx: Int
+        if let anchor = anchor, let idx = container.itemViews.firstIndex(where: { $0 === anchor }) {
+            container.itemViews.insert(child, at: idx)
+            insertIdx = idx
+        } else {
+            insertIdx = container.itemViews.count
+            container.itemViews.append(child)
+        }
+        // Trigger layout so Yoga can calculate item height before the cell is displayed
+        container.setNeedsLayout()
+        // Use targeted insert rather than reloadData to avoid triggering layoutSubviews recursively
+        container.tableView.insertRows(at: [IndexPath(row: insertIdx, section: 0)], with: .none)
+    }
+
+    func removeChild(_ child: UIView, from parent: UIView) {
+        guard let container = parent as? VListContainerView else {
+            child.removeFromSuperview()
+            return
+        }
+        guard let idx = container.itemViews.firstIndex(where: { $0 === child }) else {
+            child.removeFromSuperview()
+            return
+        }
+        container.itemViews.remove(at: idx)
+        // Remove from any cell it's currently displayed in
+        child.removeFromSuperview()
+        // Use targeted delete rather than reloadData
+        container.tableView.deleteRows(at: [IndexPath(row: idx, section: 0)], with: .none)
+    }
+}
+
+// MARK: - VListContainerView
+
+/// Container view that hosts a UITableView filling its bounds.
+/// Item views are managed in itemViews array (not as regular subviews).
+final class VListContainerView: UIView {
+
+    let tableView: UITableView
+    var itemViews: [UIView] = []
+    var estimatedItemHeight: CGFloat = 44
+    var onScroll: ((Any?) -> Void)?
+    var onEndReached: ((Any?) -> Void)?
+    fileprivate var firedEndReached = false
+    private lazy var internalDelegate = VListInternalDelegate(container: self)
+
+    init() {
+        tableView = UITableView(frame: .zero, style: .plain)
+        super.init(frame: .zero)
+        tableView.separatorStyle = .none
+        tableView.tableFooterView = UIView()
+        tableView.dataSource = internalDelegate
+        tableView.delegate = internalDelegate
+        tableView.register(VListCell.self, forCellReuseIdentifier: "VListCell")
+        // Add tableView as a real subview of self
+        super.addSubview(tableView)
+
+        // Accessibility: let VoiceOver navigate to individual children within the list
+        isAccessibilityElement = false
+        shouldGroupAccessibilityChildren = true
+    }
+
+    required init?(coder: NSCoder) { fatalError() }
+
+    override func layoutSubviews() {
+        super.layoutSubviews()
+        tableView.frame = bounds
+
+        // Run Yoga layout on each item view to compute its height
+        let width = bounds.width
+        guard width > 0 else { return }
+
+        var changedIndexPaths: [IndexPath] = []
+        for (idx, itemView) in itemViews.enumerated() {
+            // Only recompute if width changed (avoids re-entrant layout loops)
+            if abs(itemView.frame.size.width - width) > 0.5 {
+                itemView.frame.size.width = width
+                itemView.flex.layout(mode: .adjustHeight)
+                changedIndexPaths.append(IndexPath(row: idx, section: 0))
+            }
+        }
+        if !changedIndexPaths.isEmpty {
+            // Reload only the rows whose heights changed, not the entire table
+            tableView.reloadRows(at: changedIndexPaths, with: .none)
+        }
+    }
+}
+
+// MARK: - VListInternalDelegate
+
+private final class VListInternalDelegate: NSObject,
+    UITableViewDataSource, UITableViewDelegate
+{
+    private weak var container: VListContainerView?
+
+    init(container: VListContainerView) {
+        self.container = container
+    }
+
+    func tableView(_ tableView: UITableView, numberOfRowsInSection section: Int) -> Int {
+        container?.itemViews.count ?? 0
+    }
+
+    func tableView(_ tableView: UITableView,
+                   cellForRowAt indexPath: IndexPath) -> UITableViewCell {
+        let cell = tableView.dequeueReusableCell(
+            withIdentifier: "VListCell", for: indexPath) as! VListCell
+        guard let container = container,
+              indexPath.row < container.itemViews.count else { return cell }
+        cell.setItemView(container.itemViews[indexPath.row])
+        return cell
+    }
+
+    func tableView(_ tableView: UITableView,
+                   estimatedHeightForRowAt indexPath: IndexPath) -> CGFloat {
+        container?.estimatedItemHeight ?? 44
+    }
+
+    func tableView(_ tableView: UITableView,
+                   heightForRowAt indexPath: IndexPath) -> CGFloat {
+        guard let container = container,
+              indexPath.row < container.itemViews.count else {
+            return container?.estimatedItemHeight ?? 44
+        }
+        let h = container.itemViews[indexPath.row].frame.size.height
+        return h > 1 ? h : (container.estimatedItemHeight)
+    }
+
+    func scrollViewDidScroll(_ scrollView: UIScrollView) {
+        guard let container = container else { return }
+        let offset = scrollView.contentOffset
+        container.onScroll?(["x": Double(offset.x), "y": Double(offset.y)])
+
+        // endReached detection (threshold = 20% from bottom)
+        let contentH = scrollView.contentSize.height
+        let frameH = scrollView.frame.size.height
+        guard contentH > frameH else { return }
+        let distanceFromBottom = contentH - frameH - offset.y
+        let threshold = frameH * 0.2
+
+        if distanceFromBottom < threshold && !container.firedEndReached {
+            container.firedEndReached = true
+            container.onEndReached?(nil)
+        } else if distanceFromBottom >= threshold {
+            container.firedEndReached = false
+        }
+    }
+}
+
+// MARK: - VListCell
+
+private final class VListCell: UITableViewCell {
+
+    private var currentView: UIView?
+
+    override init(style: UITableViewCell.CellStyle, reuseIdentifier: String?) {
+        super.init(style: style, reuseIdentifier: reuseIdentifier)
+        // Accessibility: cells are containers — VoiceOver should navigate to children inside
+        isAccessibilityElement = false
+        accessibilityTraits = .none
+    }
+
+    required init?(coder: NSCoder) { fatalError() }
+
+    func setItemView(_ view: UIView) {
+        guard currentView !== view else { return }
+        currentView?.removeFromSuperview()
+        currentView = view
+        contentView.addSubview(view)
+        view.frame = contentView.bounds
+    }
+
+    override func layoutSubviews() {
+        super.layoutSubviews()
+        currentView?.frame = contentView.bounds
+    }
+
+    override func prepareForReuse() {
+        super.prepareForReuse()
+        currentView?.removeFromSuperview()
+        currentView = nil
+    }
+}
+#endif