@webview-native-ui/engine 0.0.0-stage → 0.0.1

package/ios/Sources/WebViewNativeUIEngine/NativeUIProjection.swift

@@ -0,0 +1,311 @@
+import UIKit
+import WebKit
+
+/// One fixed DOM fallback and its native view. The plugin retains this registration.
+/// Existing notifyListeners events drive projection; no public plugin method is intercepted.
+public final class NativeUIProjection: NSObject, WKScriptMessageHandler {
+    public enum Runtime: String { case capacitor, cordova }
+    public enum FailedFallback: String { case web, native }
+
+    public struct ReceiveListeners {
+        public struct Projection {
+            public let native: [String]
+            public let web: [String]
+            public let none: [String]
+            public init(native: [String] = [], web: [String] = [], none: [String] = []) {
+                self.native = native; self.web = web; self.none = none
+            }
+        }
+        public let update: [String]
+        public let projection: Projection
+        public let match: [String: Any]
+        public init(update: [String] = [], projection: Projection = .init(), match: [String: Any] = [:]) {
+            self.update = update; self.projection = projection; self.match = match
+        }
+        fileprivate var configuration: [String: Any] {
+            ["update": update, "projection": ["native": projection.native, "web": projection.web, "none": projection.none], "match": match]
+        }
+    }
+    private weak var webView: WKWebView?
+    private let views: () -> [String: UIView]
+    private let snapshots: NativeUICoveredSnapshots
+    private let scrolling = NativeUIScrollBindings()
+    private var masks: [String: CAShapeLayer] = [:]
+    private let id = "nativeUI" + UUID().uuidString.replacingOccurrences(of: "-", with: "")
+    private let origins: Set<String>
+    private let allowedOriginsJSON: String
+    private let canCapture: () -> Bool
+    private let runtime: Runtime
+    private let receiveListeners: ReceiveListeners
+    private let notificationLock = NSLock()
+    private var notificationDestination: String?
+    private var recordedDestination: String? {
+        notificationLock.lock(); defer { notificationLock.unlock() }
+        return notificationDestination
+    }
+    private var script: WKUserScript?
+    private var documentID: String?
+    private var destination = "native"
+    private var connected = false
+    private var restoreAccepted = true
+    private var hiddenByProjection: [UIView] = []
+    private var visible = true
+    private var closed = false
+    private struct Anchor { let native: CGRect; let image: CGRect }
+    private var anchors: [String: [String: Anchor]] = [:]
+    private var captured: [String: [String: UIView]] = [:]
+
+    public convenience init(webView: WKWebView?, plugin: String, projectionSelector: String,
+                receiveListeners: ReceiveListeners = .init(),
+                allowedOrigins: Set<String> = ["capacitor://localhost", "app://localhost", "https://localhost", "http://localhost"],
+                failedFallback: FailedFallback = .web, runtime: Runtime = .capacitor,
+                canCapture: @escaping () -> Bool = { true }, view: @escaping () -> UIView?) throws {
+        try self.init(webView: webView, plugin: plugin, projectionSelector: projectionSelector,
+                      receiveListeners: receiveListeners, allowedOrigins: allowedOrigins, failedFallback: failedFallback, runtime: runtime,
+                      canCapture: canCapture, snapshots: NativeUICoveredSnapshots(), view: view)
+    }
+    init(webView: WKWebView?, plugin: String, projectionSelector: String,
+         receiveListeners: ReceiveListeners = .init(),
+         allowedOrigins: Set<String> = ["capacitor://localhost", "app://localhost", "https://localhost", "http://localhost"],
+         failedFallback: FailedFallback = .web, runtime: Runtime = .capacitor,
+         canCapture: @escaping () -> Bool = { true }, snapshots: NativeUICoveredSnapshots,
+         view: @escaping () -> UIView?) throws {
+        self.allowedOriginsJSON = String(data: try JSONSerialization.data(withJSONObject: Array(allowedOrigins)), encoding: .utf8)!
+        self.runtime = runtime
+        self.snapshots = snapshots
+        self.receiveListeners = receiveListeners
+        guard let webView else { throw ProjectionError.missingWebView }
+        self.webView = webView; self.views = { view().map { ["view": $0] } ?? [:] }; self.origins = allowedOrigins; self.canCapture = canCapture
+        super.init()
+        precondition(Thread.isMainThread)
+        guard !projectionSelector.trimmingCharacters(in: .whitespacesAndNewlines).isEmpty else { throw ProjectionError.invalidConfiguration }
+        let config: [String: Any] = ["id": id, "plugin": plugin, "projectionSelector": projectionSelector,
+                                     "receiveListeners": receiveListeners.configuration, "failedFallback": failedFallback.rawValue, "runtime": runtime.rawValue]
+        let json = String(data: try JSONSerialization.data(withJSONObject: config), encoding: .utf8)!
+        let allowed = allowedOriginsJSON
+        let runtime = try Self.runtime()
+        let source = "if (!globalThis.WebViewNativeUIEngineRuntime) { \(runtime) } WebViewNativeUIEngineRuntime.start(\(json)).catch(console.error);"
+        let script = WKUserScript(source: "if (\(allowed).includes(location.origin)) { \(source) }", injectionTime: .atDocumentEnd, forMainFrameOnly: true)
+        self.script = script
+        webView.configuration.userContentController.add(WeakProjectionHandler(self), name: id)
+        webView.configuration.userContentController.addUserScript(script)
+        evaluate(source)
+    }
+    /// Observe the plugin's existing notification before forwarding it to Capacitor.
+    /// Cordova also forwards notifications to the Engine session, never to application listeners.
+    public func receive(_ eventName: String, data: [String: Any]? = nil) {
+        guard receiveListeners.match.allSatisfy({ key, expected in
+            guard let actual = data?[key] else { return false }
+            if let a = actual as? NSNumber, let b = expected as? NSNumber {
+                return CFGetTypeID(a) == CFGetTypeID(b) && a == b
+            }
+            return (actual as? String).map { $0 == expected as? String } ?? false
+        }) else { return }
+        let routes = receiveListeners.projection
+        let matches = [("native", routes.native), ("web", routes.web), ("none", routes.none)]
+            .filter { $0.1.contains(eventName) }
+        if matches.count == 1 {
+            notificationLock.lock()
+            notificationDestination = matches[0].0
+            notificationLock.unlock()
+        }
+        guard runtime == .cordova, !matches.isEmpty || receiveListeners.update.contains(eventName),
+              let json = try? JSONSerialization.data(withJSONObject: [id, eventName, data ?? [:]]),
+              let args = String(data: json, encoding: .utf8) else { return }
+        DispatchQueue.main.async { [weak self] in
+            guard let self, !self.closed else { return }
+            self.evaluate("globalThis.WebViewNativeUIEngineRuntime?.notify(...\(args))")
+        }
+    }
+    // Check in the executing document: a native URL check can race navigation.
+    private func evaluate(_ source: String) {
+        webView?.evaluateJavaScript("if (\(allowedOriginsJSON).includes(location.origin)) { \(source) }", completionHandler: nil)
+    }
+    private enum ProjectionError: Error { case missingWebView, invalidConfiguration, missingRuntime }
+    private static func runtime() throws -> String {
+        #if SWIFT_PACKAGE
+        let bundle = Bundle.module
+        #else
+        let containing = Bundle(for: NativeUIProjection.self)
+        let bundle = containing.url(forResource: "WebViewNativeUIEngine", withExtension: "bundle").flatMap(Bundle.init(url:)) ?? containing
+        #endif
+        guard let url = bundle.url(forResource: "native-ui-engine", withExtension: "js") else { throw ProjectionError.missingRuntime }
+        return try String(contentsOf: url, encoding: .utf8)
+    }
+    public func userContentController(_ userContentController: WKUserContentController, didReceive message: WKScriptMessage) {
+        let origin = message.frameInfo.securityOrigin
+        let defaultPort = origin.port == 0 || (origin.protocol == "https" && origin.port == 443) || (origin.protocol == "http" && origin.port == 80)
+        guard origins.contains("\(origin.protocol)://\(origin.host)" + (defaultPort ? "" : ":\(origin.port)")),
+              !closed, message.frameInfo.isMainFrame, let webView,
+              let text = message.body as? String, let data = text.data(using: .utf8),
+              let message = try? JSONSerialization.jsonObject(with: data) as? [String: Any],
+              let key = message["key"] as? String, key.hasPrefix(id + ":"),
+              let request = message["request"] as? [String: Any] else { return }
+        let page = key.split(separator: ":").dropFirst().first.map(String.init)
+        if documentID != page { snapshots.reset(); scrolling.reset(); captured.removeAll(); anchors.removeAll(); documentID = page }
+        let complete: ([String: Any]) -> Void = { [weak self] value in
+            guard let self, !self.closed, self.documentID == page else { return }
+            self.reply(key, value)
+        }
+        let token = request["token"] as? String ?? ""
+        switch request["action"] as? String {
+        case "connect":
+            if !connected { destination = (views().values.contains(where: { !$0.isHidden }) ? "native" : "none"); connected = true }
+            complete(["destination": recordedDestination ?? destination])
+        case "destination":
+            if let next = request["destination"] as? String, ["native", "web", "none"].contains(next) { destination = next; connected = true }
+            complete([:])
+        case "track":
+            scrolling.reset()
+            for (id, mask) in masks { if views()[id]?.layer.mask === mask { views()[id]?.layer.mask = nil } }
+            masks.removeAll()
+            guard let raw = request["scroll"] as? [String: Any], let width = request["viewportWidth"] as? Double, width.isFinite, width > 0,
+                  let data = try? JSONSerialization.data(withJSONObject: raw),
+                  let placement = try? JSONDecoder().decode(NativeUIScrollPlacement.self, from: data), placement.isValid else {
+                complete(["tracked": false]); return
+            }
+            let scale = webView.bounds.width / width
+            let current = views()
+            guard !current.isEmpty, current.values.allSatisfy({ $0.layer.mask == nil }) else { complete(["tracked": false]); return }
+            let nodes = current.map { id, view -> NativeUIScrollNode in
+                let frame = view.convert(view.bounds, to: webView)
+                return NativeUIScrollNode(id: id, scroll: NativeUIScrollPlacement(id: placement.id,
+                    offsetX: placement.offsetX, offsetY: placement.offsetY, viewport: placement.viewport, clip: placement.clip,
+                    contentWidth: placement.contentWidth, contentHeight: placement.contentHeight,
+                    frame: NativeUIFrame(x: frame.minX/scale-placement.viewport.x+placement.offsetX,
+                        y: frame.minY/scale-placement.viewport.y+placement.offsetY, width: frame.width/scale, height: frame.height/scale)))
+            }
+            let rejected = scrolling.replace(nodes, in: webView, scale: scale) { [weak self, weak webView] id, frame, clip in
+                guard let self, let webView, self.visible, !self.snapshots.hidesNativeControls,
+                      let view = self.views()[id], current[id] === view, let parent = view.superview else { return }
+                let old = view.convert(view.bounds, to: webView)
+                let from = parent.convert(CGPoint(x: old.midX, y: old.midY), from: webView)
+                let to = parent.convert(CGPoint(x: frame.midX, y: frame.midY), from: webView)
+                view.transform.tx += to.x-from.x; view.transform.ty += to.y-from.y
+                let mask = self.masks[id] ?? CAShapeLayer()
+                self.masks[id] = mask
+                mask.frame = view.bounds
+                mask.path = UIBezierPath(rect: clip.isNull ? .zero : view.convert(clip, from: webView).intersection(view.bounds)).cgPath
+                view.layer.mask = mask
+            }
+            complete(["tracked": rejected.isEmpty])
+        case "prepare":
+            guard visible, canCapture(), let ids = request["ids"] as? [String], let width = request["viewportWidth"] as? Double, width.isFinite, width > 0,
+                  let window = webView.window else { complete([:]); return }
+            let selected = views().filter { ids.contains($0.key) }
+            guard selected.count == ids.count else { complete([:]); return }
+            snapshots.observe(window) { [weak self] active in self?.reply(nil, ["active": active]) }
+            snapshots.prepare(frames: { [weak self, weak webView] in
+                guard let self, let webView, self.visible, self.canCapture() else { return [:] }
+                let current = self.views()
+                guard selected.allSatisfy({ current[$0.key] === $0.value && !$0.value.isHidden && $0.value.window != nil }) else { return [:] }
+                return selected.mapValues { $0.convert($0.bounds, to: webView) }
+            }, in: webView, viewportWidth: width) { [weak self] result in
+                if let self, let token = result["token"] as? String, let parts = result["parts"] as? [[String: Any]] {
+                    self.captured[token] = selected
+                    let scale = webView.bounds.width / width
+                    var entries: [String: Anchor] = [:]
+                    for part in parts {
+                        guard let ids = part["ids"] as? [String], let x = part["x"] as? CGFloat, let y = part["y"] as? CGFloat,
+                              let w = part["width"] as? CGFloat, let h = part["height"] as? CGFloat else { continue }
+                        let image = CGRect(x: x*scale, y: y*scale, width: w*scale, height: h*scale)
+                        for id in ids { if let view = selected[id] { entries[id] = Anchor(native: view.convert(view.bounds, to: webView), image: image) } }
+                    }
+                    self.anchors[token] = entries
+                }
+                complete(result)
+            }
+        case "cover":
+            let selected = captured[token] ?? [:], current = views()
+            let valid = visible && canCapture() && !selected.isEmpty && selected.allSatisfy { current[$0.key] === $0.value }
+            restoreAccepted = true
+            complete(["shown": valid && snapshots.cover(token, in: webView, views: Array(Dictionary(grouping: selected.values, by: { ObjectIdentifier($0) }).values.compactMap { $0.first }), transient: true)])
+        case "restore":
+            restoreAccepted = false
+            guard let width = request["viewportWidth"] as? Double, width.isFinite, width > 0,
+                  let parts = request["parts"] as? [[String: Any]] else { complete(["shown": false]); return }
+            var frames: [String: CGRect] = [:]
+            let scale = webView.bounds.width / width
+            for part in parts {
+                guard let ids = part["ids"] as? [String], let x = part["x"] as? Double, let y = part["y"] as? Double,
+                      let w = part["width"] as? Double, let h = part["height"] as? Double,
+                      [x,y,w,h].allSatisfy({ $0.isFinite }), w > 0, h > 0 else { complete(["shown": false]); return }
+                for id in ids { frames[id] = CGRect(x: x*scale, y: y*scale, width: w*scale, height: h*scale) }
+            }
+            guard Set(frames.keys) == snapshots.identifiers(for: token), !frames.isEmpty else { complete(["shown": false]); return }
+            let current = views()
+            // Preserve renderer-owned constraints. Translation follows the corresponding DOM's movement.
+            for (id, frame) in frames {
+                guard let view = current[id], captured[token]?[id] === view, let anchor = anchors[token]?[id] else { complete(["shown": false]); return }
+                let old = view.convert(view.bounds, to: webView)
+                guard abs(old.width-anchor.native.width) < 0.1, abs(old.height-anchor.native.height) < 0.1,
+                      abs(frame.width-anchor.image.width) < 0.1, abs(frame.height-anchor.image.height) < 0.1 else { complete(["shown": false]); return }
+            }
+            for (id, frame) in frames {
+                guard let view = current[id], let parent = view.superview, let anchor = anchors[token]?[id] else { continue }
+                let old = view.convert(view.bounds, to: webView)
+                let from = parent.convert(CGPoint(x: old.midX, y: old.midY), from: webView)
+                let to = parent.convert(CGPoint(x: anchor.native.midX+frame.minX-anchor.image.minX,
+                                               y: anchor.native.midY+frame.minY-anchor.image.minY), from: webView)
+                view.transform.tx += to.x-from.x; view.transform.ty += to.y-from.y
+            }
+            restoreAccepted = snapshots.restore(in: webView, token: token, frames: frames)
+            complete(["shown": restoreAccepted])
+        case "resume":
+            guard restoreAccepted else { reply(key, [:], error: "Native UI geometry changed"); return }
+            snapshots.restoreControls(); snapshots.finishCovering()
+            webView.window?.layoutIfNeeded()
+            CATransaction.begin()
+            CATransaction.setCompletionBlock { complete([:]) }
+            views().values.forEach { $0.setNeedsDisplay() }
+            CATransaction.commit()
+        case "visibility":
+            visible = request["visible"] as? Bool ?? false
+            snapshots.restoreControls()
+            if visible {
+                hiddenByProjection.forEach { $0.isHidden = false }; hiddenByProjection.removeAll()
+            } else {
+                for view in views().values where !view.isHidden {
+                    hiddenByProjection.append(view); view.isHidden = true
+                }
+            }
+            complete([:])
+        case "painted": snapshots.retireCopy(token); complete([:])
+        case "restored": snapshots.retireCopy(token, entry: false); complete([:])
+        case "release": snapshots.release(token); captured.removeValue(forKey: token); anchors.removeValue(forKey: token); complete([:])
+        case "reset": snapshots.reset(); captured.removeAll(); anchors.removeAll(); complete([:])
+        default: complete([:])
+        }
+    }
+    private func reply(_ key: String?, _ value: [String: Any], error: String? = nil) {
+        guard !closed else { return }
+        let values: [Any] = [id, key as Any? ?? NSNull(), value, error as Any? ?? NSNull()]
+        guard let data = try? JSONSerialization.data(withJSONObject: values), let json = String(data: data, encoding: .utf8) else { return }
+        evaluate("globalThis.WebViewNativeUIEngineRuntime?.receive(...\(json))")
+    }
+    /// Call with the plugin's teardown. Does not destroy the renderer's views or DOM.
+    deinit { destroy() }
+    public func destroy() {
+        guard !closed else { return }
+        closed = true
+        evaluate("globalThis.WebViewNativeUIEngineRuntime?.stop('\(id)')")
+        if let controller = webView?.configuration.userContentController {
+            controller.removeScriptMessageHandler(forName: id)
+            let remaining = controller.userScripts.filter { $0 !== script }
+            controller.removeAllUserScripts()
+            remaining.forEach { controller.addUserScript($0) }
+        }
+        snapshots.reset(); scrolling.reset(); captured.removeAll(); anchors.removeAll()
+        if destination != "none" { hiddenByProjection.forEach { $0.isHidden = false } }
+        hiddenByProjection.removeAll()
+        for (id, mask) in masks { if views()[id]?.layer.mask === mask { views()[id]?.layer.mask = nil } }
+        masks.removeAll()
+    }
+}
+private final class WeakProjectionHandler: NSObject, WKScriptMessageHandler {
+    weak var owner: NativeUIProjection?
+    init(_ owner: NativeUIProjection) { self.owner = owner }
+    func userContentController(_ controller: WKUserContentController, didReceive message: WKScriptMessage) {
+        owner?.userContentController(controller, didReceive: message)
+    }
+}

package/ios/Sources/WebViewNativeUIEngine/Resources/native-ui-engine.js

@@ -0,0 +1,14 @@
+"use strict";var WebViewNativeUIEngineRuntime=(()=>{var Ie=Object.defineProperty;var rt=Object.getOwnPropertyDescriptor;var it=Object.getOwnPropertyNames;var st=Object.prototype.hasOwnProperty;var at=(e,o)=>{for(var n in o)Ie(e,n,{get:o[n],enumerable:!0})},ct=(e,o,n,l)=>{if(o&&typeof o=="object"||typeof o=="function")for(let d of it(o))!st.call(e,d)&&d!==n&&Ie(e,d,{get:()=>o[d],enumerable:!(l=rt(o,d))||l.enumerable});return e};var lt=e=>ct(Ie({},"__esModule",{value:!0}),e);var jt={};at(jt,{hide:()=>Tt,notify:()=>gt,receive:()=>Et,show:()=>Pt,start:()=>St,stop:()=>Lt});var dt=Symbol.for("webview-native-ui-engine.projection-placement");var Fe=e=>e?.[dt];var ut=(e,o)=>{if(e.matches("ion-toast, ion-menu"))return!1;let n=e;if(n.showBackdrop===!1)return!1;if(!e.matches("ion-modal"))return!0;let l=o??n.initialBreakpoint;return l===void 0||l>(n.backdropBreakpoint??0)},pt=Symbol.for("@webview-native-ui/engine/overlays/v1"),ft=e=>{let o=new Set,n=new Set,l=new Set,d=new WeakMap,r=new WeakSet,T=new Map,h=[],v={},P=new Map,S,x=p=>{for(let f of[...l])try{f(p)}catch(a){console.error("Native UI overlay listener failed",a)}},C=(p,f,a)=>{f==="willPresent"||f==="didPresent"?(r.delete(p),o.add(p)):f==="didDismiss"&&(r.add(p),o.delete(p),n.delete(p),d.delete(p));let E=a?.detail?.breakpoint;typeof E=="number"&&E>0&&d.set(p,E),x({element:p,phase:f,event:a})},U=(p=!1)=>{let f=!1;for(let a of o)(!a.isConnected||a.ownerDocument!==e||!h.some(({selector:E})=>a.matches(E)))&&(o.delete(a),n.delete(a),f=!0);for(let a of e.querySelectorAll(h.map(({selector:E})=>E).join(",")))!o.has(a)&&!r.has(a)&&(p||!a.matches("ion-popover"))&&(a.presented||a.classList.contains("show-menu"))&&(o.add(a),f=!0);f&&x({phase:"change"})};return{get active(){return o},subscribe(p){return l.add(p),()=>{l.delete(p)}},setNative(p,f){n.has(p)!==f&&(f?n.add(p):n.delete(p),x({element:p,phase:"change"}))},isExcluded(p){return!!v.exclude&&p.matches(v.exclude)},isNative(p){return n.has(p)},get stack(){let p=[...o].filter(a=>a.isConnected&&a.ownerDocument===e),f=a=>{let E=Number.parseFloat(e.defaultView.getComputedStyle(a).zIndex);return Number.isFinite(E)?E:a.overlayIndex??0};return p.sort((a,E)=>f(a)-f(E)),p},isCovered(p){let f=this.stack,a=f.reduce((E,F,m)=>F.contains(p)?m:E,-1);return f.some((E,F)=>{if(n.has(E)||v.exclude&&E.matches(v.exclude))return!1;let m=v.covers?.(E,p);return m!==void 0?m:F>a&&!E.contains(p)&&(E.matches("ion-menu")||ut(E,d.get(E)))})},enable(p,f){let a={...v,...f},E=[...p,...a.additional??[]];a.exclude&&e.querySelector(a.exclude);let F=new Map;for(let k of E){e.querySelector(k.selector);for(let[D,R]of Object.entries(k.events)){let $=F.get(R);if($&&$.phase!==D)throw new TypeError(`Overlay event "${R}" has conflicting phases`);F.set(R,{phase:D,selector:$?`${$.selector}, ${k.selector}`:k.selector})}}v=a,h=E,P=F;for(let k of P.keys()){if(T.has(k))continue;let D=R=>{let $=P.get(k),W=R.composedPath().find(oe=>oe instanceof e.defaultView.HTMLElement&&oe.matches($.selector));W&&C(W,$.phase,R)};e.addEventListener(k,D,!0),T.set(k,()=>e.removeEventListener(k,D,!0))}for(let[k,D]of T)P.has(k)||(D(),T.delete(k));let m=!S;S||(S=new MutationObserver(()=>U()),S.observe(e.documentElement,{childList:!0,subtree:!0}),e.addEventListener("nativeUIOverlayAdopted",k=>{let D=k.detail;D?.ownerDocument===e&&C(D,"willPresent",k)})),U(m),(m||f)&&x({phase:"change"})}}},qe=e=>{let o=e;return o[pt]??=ft(e)};function*le(e){let o=e;for(;o;){let n=o.getRootNode();o=o.assignedSlot??o.parentElement??(n instanceof ShadowRoot?n.host:null),o&&(yield o)}}var mt=({x:e,y:o,width:n,height:l})=>({x:e,y:o,width:n,height:l}),_e=e=>{let o=e.getBoundingClientRect(),n=getComputedStyle(e),l=parseFloat(n.borderLeftWidth)||0,d=parseFloat(n.borderTopWidth)||0;return{x:o.left+l,y:o.top+d,width:o.width-l-(parseFloat(n.borderRightWidth)||0),height:o.height-d-(parseFloat(n.borderBottomWidth)||0)}},ze=(e,o,n)=>{let l=[e,...le(e)],d=l.indexOf(o);if(d<=0||o===e.ownerDocument.scrollingElement)return;let r=e.ownerDocument.defaultView;if(r.visualViewport&&(r.visualViewport.scale!==1||r.visualViewport.offsetLeft||r.visualViewport.offsetTop))return;let T=0,h=0,v=r.innerWidth,P=r.innerHeight;for(let[U,p]of l.entries()){let f=getComputedStyle(p);if(f.transform!=="none"&&!new DOMMatrixReadOnly(f.transform).isIdentity||f.zoom&&f.zoom!=="normal"&&Number(f.zoom)!==1||[f.translate,f.rotate,f.scale,f.perspective].some(m=>m&&m!=="none")||f.writingMode&&f.writingMode!=="horizontal-tb"||U<d&&/^(fixed|sticky)$/.test(f.position))return;if(U===0)continue;if(f.scrollbarGutter&&f.scrollbarGutter!=="auto")return;let a=/^(auto|scroll|hidden|clip)$/.test(f.overflowX),E=/^(auto|scroll|hidden|clip)$/.test(f.overflowY);if(U<d&&(a||E))return;let F=p===e.ownerDocument.scrollingElement;if(U>d&&((a||F)&&p.scrollWidth>p.clientWidth||(E||F)&&p.scrollHeight>p.clientHeight)||(a||E)&&[f.borderTopLeftRadius,f.borderTopRightRadius,f.borderBottomLeftRadius,f.borderBottomRightRadius].some(m=>parseFloat(m)>0)||f.clipPath&&f.clipPath!=="none"||f.maskImage&&f.maskImage!=="none")return;if(U>=d){let m=_e(p);a&&(T=Math.max(T,m.x),v=Math.min(v,m.x+m.width)),E&&(h=Math.max(h,m.y),P=Math.min(P,m.y+m.height))}}let S=getComputedStyle(o);if(!/^(auto|scroll)$/.test(S.overflowX)&&!/^(auto|scroll)$/.test(S.overflowY))return;let x=_e(o);if(v<=T||P<=h||!x.width||!x.height)return;let C=mt(e.getBoundingClientRect());return{id:n(o),offsetX:o.scrollLeft,offsetY:o.scrollTop,viewport:x,clip:{x:T,y:h,width:v-T,height:P-h},contentWidth:o.scrollWidth,contentHeight:o.scrollHeight,frame:{...C,x:C.x-x.x+o.scrollLeft,y:C.y-x.y+o.scrollTop}}};var Ke=e=>{let o=globalThis;if(o.Capacitor?.convertFileSrc)return o.Capacitor.convertFileSrc(e);if(!e.startsWith("file:"))return e;if(o.WkWebView?.convertFilePath)return o.WkWebView.convertFilePath(e);throw new Error("Native UI file URL requires a host resource handler")};var de=e=>new Promise((o,n)=>{let l=setTimeout(()=>n(new Error("Native UI bridge timed out")),5e3);e.then(o,n).finally(()=>clearTimeout(l))}),$e=async e=>{try{return await de(e)}catch(o){throw e.then(n=>n.remove()).catch(()=>{}),o}};var Ne=async(e,o)=>{let n=new Map;for(let h of e.update??[])n.set(h,{updated:!0});for(let h of["native","web","none"])for(let v of e.projection?.[h]??[]){let P=n.get(v)??{updated:!1};if(P.destination&&P.destination!==h)throw new TypeError(`Projection event "${v}" has conflicting destinations`);n.set(v,{...P,destination:h})}let l=!1,d=[],r=async()=>{l=!0;let v=(await Promise.allSettled(d.splice(0).map(P=>Promise.resolve().then(()=>P.remove())))).find(P=>P.status==="rejected");if(v?.status==="rejected")throw v.reason},T=[...n].map(async([h,v])=>{let P=await $e(Promise.resolve().then(()=>e.addListener(h,S=>{!l&&(!e.accepts||e.accepts(S))&&o(v.destination,v.updated)})));l?await P.remove():d.push(P)});try{return await Promise.all(T),{remove:r}}catch(h){throw await r().catch(()=>{}),h}};var Ge=`
+:is([data-native-ui-snapshot-source], [data-native-ui-snapshot-prepared]),
+:is([data-native-ui-snapshot-source], [data-native-ui-snapshot-prepared]) *,
+:is([data-native-ui-snapshot-source], [data-native-ui-snapshot-prepared])::after,
+:is([data-native-ui-snapshot-source], [data-native-ui-snapshot-prepared])::part(native) { visibility: hidden !important; }
+[data-native-ui-snapshot][data-native-ui-snapshot]::before {
+ all:initial!important;content:""!important;display:block!important;position:absolute!important;
+ visibility:visible!important;opacity:0!important;will-change:opacity!important;
+ pointer-events:none!important;image-rendering:pixelated!important;
+}
+[data-native-ui-snapshot-visible] { opacity:1!important;overflow:visible!important; }
+[data-native-ui-snapshot-visible][data-native-ui-snapshot][data-native-ui-snapshot]::before { opacity:1!important; }
+`;var vt=(e,o=!1)=>JSON.stringify(e.map(({control:n})=>[n.id,n.kind,n.placement,o?0:n.x,o?0:n.y,n.width,n.height,n.dark,n.rtl])),Je=(e,o,n=o.getComputedStyle(e))=>{let l=e.getBoundingClientRect(),d=(S,x)=>{let C=parseFloat(S);return n.display!=="inline"&&Number.isFinite(C)?C+(n.boxSizing==="border-box"?0:x.reduce((U,p)=>U+(parseFloat(n.getPropertyValue(p))||0),0)):NaN},r=d(n.width,["padding-left","padding-right","border-left-width","border-right-width"]),T=d(n.height,["padding-top","padding-bottom","border-top-width","border-bottom-width"]),h=1;if(!(r>0&&T>0))for(let S of[e,...le(e)]){let x=(S===e?n:o.getComputedStyle(S)).getPropertyValue("zoom");h*=(parseFloat(x)||1)/(x.endsWith("%")?100:1)}let v=r>0?l.width/r:h,P=T>0?l.height/T:h;return{x:l.x,y:l.y,scaleX:v||1,scaleY:P||1,left:(parseFloat(n.borderLeftWidth)||0)-e.scrollLeft,top:(parseFloat(n.borderTopWidth)||0)-e.scrollTop,position:n.position}},ht=async(e,o,n)=>{let l="native",d=e.element.ownerDocument,r=d.defaultView,T=Array.from(r.crypto.getRandomValues(new Uint32Array(4)),t=>t.toString(16)).join("-"),h=t=>t.isConnected&&t.ownerDocument===d,v=t=>!!t?.isConnected&&t.ownerDocument===d,P=o.send.bind(o),S="data-native-ui-snapshot",x=`${e.namespace}:sources-change`,C=new Set,U=new Set,p=new Set,f=new WeakMap,a=0,E=t=>JSON.stringify(t.map(c=>(f.has(c.scope)||f.set(c.scope,++a),[f.get(c.scope),vt([c],!!n.opaqueUnderlay)]))),F=new Map,m=t=>{let c=t.getRootNode();return c.nodeType===11&&"host"in c?c:d},k=t=>{let c=F.get(t);if(!c){let g=d.createElement("style"),i=d.createElement("style");g.setAttribute("data-native-ui-snapshot-base",""),i.setAttribute(S,""),g.textContent=Ge,(t.nodeType===11?t:t.head).append(g,i),c={base:g,image:i},F.set(t,c)}return c.image},D=()=>`${r.innerWidth}:${r.innerHeight}:${r.devicePixelRatio}`,R=!1,$=!1,W=0,oe=0,O,u,ie=!1,B=!1,ae=0,ge=0,K=0,N=0,se=0,X=-1,Z=!1,we=!1,q,ce=new Set,ke=(t,c,g)=>{let i=()=>{ce.delete(i)&&P({action:t,token:c}).catch(()=>{})};ce.add(i),g&&!Z?r.requestAnimationFrame(()=>r.requestAnimationFrame(i)):i()},V=new Set,be=()=>{V.forEach(t=>p.delete(t)),V.clear()},fe=(t,c=!1)=>{!t||t===O||t===u||(t.images.forEach(g=>{g.src=""}),ke("release",t.data.token,c))},Q=t=>t.filter(c=>{if(!v(c.scope.element)||![c.element,...c.sources??[]].every(h))return!1;if(c.control.scroll){let g=c.element.getBoundingClientRect(),i=c.control.scroll.clip;if(g.right<=i.x||g.bottom<=i.y||g.left>=i.x+i.width||g.top>=i.y+i.height)return!1}return n.eligible?.(c)??!0}),We=async()=>{if(N=0,Z||l!=="native"||we||ie||u||n.blocked()||!q||O?.revision===q.revision&&X===se)return;let{revision:t,candidates:c}=q,g=K,i=se,L=D(),j=Q(c);if(!j.length)return;we=!0;let H,_=!1,te=[];try{let ne=!1,he=P({action:"prepare",revision:n.captureRevision?.()??t,viewportWidth:r.innerWidth,ids:j.map(w=>w.control.id)});he.then(w=>{ne&&w.token&&P({action:"release",token:w.token}).catch(()=>{})}).catch(()=>{});try{H=await de(he)}finally{ne=!0}if(!H.token||!H.parts?.length)return;let ye=new Set(j.map(w=>w.control.id));if(H.parts.some(w=>!w.url.startsWith("file:")&&!/^\/__native_ui_engine__\/nativeUI[a-fA-F0-9]+\/[a-fA-F0-9-]+-[0-9]+\.png$/.test(w.url)||!w.ids.length||w.ids.some(z=>!ye.has(z))||![w.x,w.y,w.width,w.height].every(Number.isFinite)||w.width<=0||w.height<=0)||new Set(H.parts.flatMap(w=>w.ids)).size!==ye.size||H.parts.some(w=>new Set(w.ids.map(z=>j.find(Be=>Be.control.id===z).scope)).size!==1)||(await de(Promise.all(H.parts.map(async w=>{let z=d.createElement("img");return te.push(z),z.src=Ke(w.url),await z.decode(),z}))),Z||l!=="native"||ie||u||n.blocked()||K!==g||D()!==L||q?.revision!==t||j.some(w=>!v(w.scope.element)||![w.element,...w.sources??[]].every(h))))return;let Le=O;O={data:H,images:te,sources:Array.from(new Set(j.flatMap(w=>[w.element,...w.sources??[]]))),targets:H.parts.map(w=>j.find(z=>w.ids.includes(z.control.id)).element),scopes:H.parts.map(w=>j.find(z=>w.ids.includes(z.control.id)).scope),parents:H.parts.map(w=>j.find(z=>w.ids.includes(z.control.id)).scope.element.parentNode),frames:[],viewport:L,revision:t,layout:E(j)},be(),O.sources.forEach(w=>{p.add(w),V.add(w)}),Re(),n.opaqueUnderlay&&P({action:"prepared",token:H.token}).catch(()=>{}),r.dispatchEvent(new Event(x)),X=i,_=!0,fe(Le)}catch{}finally{_||te.forEach(ne=>{ne.src=""}),H?.token&&!_&&P({action:"release",token:H.token}).catch(()=>{}),we=!1,q&&(q.revision!==t||se!==i)&&G()}},G=()=>{r.clearTimeout(N),!Z&&l==="native"&&!u&&!ie&&!n.blocked()&&(N=r.setTimeout(()=>{We()},50))},Ee,Se=(t,c)=>{if(c.some(i=>i.scope.element.ownerDocument!==d||[i.element,...i.sources??[]].some(L=>L.ownerDocument!==d)))throw new TypeError("All projection sources and fallback scopes must share one Document");if(n.blocked())return;!u&&O&&O.layout!==E(Q(c))&&ve();let g=E(c);Ee!==g&&(Ee=g,se++,K++),q?.revision!==t&&K++,q={revision:t,candidates:c},(O?.revision!==t||X!==se)&&G()},je=t=>{!u&&O&&t&&q?.candidates.some(c=>c.scrollElement===t&&O.sources.includes(c.element))&&ve(),u&&(Me(),Oe()),se++,K++,G()},me=await $e(o.listen(({active:t})=>{ie=t,K++,r.clearTimeout(N),t||G()})),Ce=new Set,Pe=t=>{Ce.delete(t)&&t.removeAttribute("data-native-ui-snapshot-prepared"),t.removeAttribute("data-native-ui-snapshot-visible"),t.removeAttribute(S),t.removeAttribute("data-native-ui-snapshot-source")},Te=()=>{oe++,r.cancelAnimationFrame(W),r.cancelAnimationFrame(Y),Y=0,J.clear(),W=0,R=!1,$=!1,be(),u?.sources.forEach(t=>{C.delete(t),U.delete(t)}),A.forEach(Pe),A.clear(),F.forEach(({base:t,image:c})=>{t.remove(),c.remove()}),F.clear()},s=(t=u,c=B)=>{if(u!==t)return;let g=new Set([u,O]);Te(),u=void 0,O=void 0,B=!1,r.clearTimeout(ae),g.forEach(i=>fe(i,c)),n.wake()},y=()=>{if(!u)return;if(O!==u){s();return}let t=u;Te(),u=void 0,B=!1,r.clearTimeout(ae),ke("restored",t.data.token,!0),t.sources.forEach(c=>{p.add(c),V.add(c)}),Re(),n.wake()},b=()=>{B&&y(),ce.forEach(t=>t())},I=t=>t.scopes.map(c=>v(c.element)?c.element:void 0),A=new Set,ee=new Map,J=new Map,Y=0,Me=()=>{for(let[t,c]of J){if(!t.isConnected)continue;let g=r.getComputedStyle(t),i=`${c.x-(parseFloat(g.borderLeftWidth)||0)+t.scrollLeft}px`,L=`${c.y-(parseFloat(g.borderTopWidth)||0)+t.scrollTop}px`;c.style.left!==i&&c.style.setProperty("left",i,"important"),c.style.top!==L&&c.style.setProperty("top",L,"important")}},Oe=()=>{if(Y||!u)return;[...J.keys()].some(c=>c.getAnimations?.().some(g=>g.playState==="running"&&g.effect?.getKeyframes().some(i=>["borderLeftWidth","borderTopWidth","borderWidth"].some(L=>L in i))))&&(Y=r.requestAnimationFrame(()=>{Y=0,Me(),Oe()}))},Re=()=>{let t=u??O;if(!t||B)return;if(!t.sources.every(h)||I(t).some(i=>!i)){ve();return}let c=I(t);if(u){if(c.some(L=>!L?.isConnected||!F.has(m(L)))){s(u,!1);return}let i=new Set;for(let[L,j]of t.targets.entries()){let H=ee.get(j),_=c[L];!H||!_?.isConnected||(_.setAttribute(S,H),_.setAttribute("data-native-ui-snapshot-source",""),_.toggleAttribute("data-native-ui-snapshot-visible",$),i.add(_))}for(let L of A)i.has(L)||Pe(L);A.clear(),i.forEach(L=>A.add(L));return}ee.clear(),J.clear(),A.forEach(Pe),A.clear();let g=new Map;for(let i of new Set(c)){if(!i)continue;A.add(i);let L=k(m(i)),j=g.get(L);j||(j={rules:[],positions:[]},g.set(L,j));let{rules:H,positions:_}=j;i!==t.targets[c.indexOf(i)]&&!i.hasAttribute("data-native-ui-snapshot-prepared")&&(i.setAttribute("data-native-ui-snapshot-prepared",""),Ce.add(i)),i.toggleAttribute("data-native-ui-snapshot-visible",!!u||!!n.opaqueUnderlay),u&&i.setAttribute("data-native-ui-snapshot-source","");let te=c.flatMap((M,re)=>M===i?[re]:[]),ne=r.getComputedStyle(i);{let M=Je(i,r,ne);te.forEach(re=>{let De=t.data.parts[re];n.opaqueUnderlay&&t.frames[re]||(t.frames[re]={x:n.opaqueUnderlay?0:(De.x-M.x)/M.scaleX,y:n.opaqueUnderlay?0:(De.y-M.y)/M.scaleY,width:De.width/M.scaleX,height:De.height/M.scaleY})})}let he=te.map(M=>t.frames[M]),ye=Math.min(...he.map(M=>M.x)),Le=Math.min(...he.map(M=>M.y)),w=Math.max(...he.map(M=>M.x+M.width)),z=Math.max(...he.map(M=>M.y+M.height)),Be=(parseFloat(ne.borderLeftWidth)||0)-i.scrollLeft,nt=(parseFloat(ne.borderTopWidth)||0)-i.scrollTop,Ae=`${T}-${te[0]}`;te.forEach(M=>ee.set(t.targets[M],Ae)),i.setAttribute(S,Ae),H.push(`[${S}="${Ae}"][data-native-ui-snapshot-visible] { ${ne.position==="static"?"position:relative!important;":""} }`);let ot=te.map(M=>{let re=t.frames[M];return`url(${JSON.stringify(t.images[M].src)}) ${re.x-ye}px ${re.y-Le}px / ${re.width}px ${re.height}px no-repeat`}),xe=d.createElement("span").style;xe.cssText=`left:${ye-Be}px;top:${Le-nt}px;width:${w-ye}px;height:${z-Le}px;background:${ot.join(",")};`;for(let M of Array.from(xe))xe.setProperty(M,xe.getPropertyValue(M),"important");H.push(`[${S}="${Ae}"][${S}][${S}]::before { ${xe.cssText} }`),_.push({target:i,x:ye,y:Le})}t.parents=t.scopes.map(i=>i.element.parentNode);for(let[i,{rules:L,positions:j}]of g)i.textContent=L.join(`
+`),j.forEach(({target:H,x:_,y:te},ne)=>J.set(H,{x:_,y:te,style:i.sheet.cssRules[ne*2+1].style}))},Ve=()=>{if(b(),Z||l==="none"||u)return;let t=O;if(!t||t.viewport!==D()||!t.sources.every(h)||n.current&&!n.current(t.targets)||t.targets.some(i=>!ee.has(i))||I(t).some(i=>!i?.isConnected)||[...A].some(i=>!i.isConnected))return;t.scopes.some((i,L)=>i.element.parentNode!==t.parents[L])&&Re(),Me();let c=++oe,g=()=>oe===c;R=!0,$=!!n.opaqueUnderlay,u=t,K++,r.clearTimeout(N),t.sources.forEach(i=>{C.add(i)}),A.forEach(i=>{i.setAttribute("data-native-ui-snapshot-source",""),i.toggleAttribute("data-native-ui-snapshot-visible",$)}),W=r.requestAnimationFrame(()=>{W=0,g()&&(R=!1,n.wake())}),de(P({action:"cover",token:t.data.token,...n.transient?{transient:!0}:{}})).then(i=>{if(g()){if(R=!1,i?.shown!==!0){s(t,!1);return}B||($=!0,t.sources.forEach(L=>U.add(L)),Re(),Me(),Oe()),r.cancelAnimationFrame(W),W=r.requestAnimationFrame(()=>{W=0,g()&&P({action:"painted",token:t.data.token}).catch(()=>{g()&&s(t,!1)})}),n.wake()}}).catch(()=>{g()&&s(t,!1)})},Xe=()=>{if(!(!u||Z||B)){if(!u.sources.every(h)||I(u).some(t=>!t)||n.current&&!n.current(u.targets)){s(u,!1);return}if(!n.blocked()){if(n.transient){let t=u,c=I(t);if(c.some(i=>!i?.isConnected)){s(t,!1);return}let g=c.map((i,L)=>{let j=Je(i,r),H=t.frames[L];return{...t.data.parts[L],x:j.x+H.x*j.scaleX,y:j.y+H.y*j.scaleY,width:H.width*j.scaleX,height:H.height*j.scaleY}});g.some((i,L)=>["x","y","width","height"].some(j=>i[j]!==t.data.parts[L][j]))&&(n.opaqueUnderlay?t.data={...t.data,parts:g}:O=void 0),P({action:"restore",token:t.data.token,viewportWidth:r.innerWidth,parts:g}).catch(()=>{})}ge=n.revision?.()??q?.revision??0,B=!0,u.sources.forEach(t=>C.delete(t)),ae=r.setTimeout(()=>{B&&s(u,!1)},250),n.wake()}}},tt=(t,c,g)=>{!B||!u||g===void 0||g<=ge||!n.transient&&t||u.data.parts.every(i=>i.ids.every(L=>c?.includes(L)))&&(y(),G())},ve=()=>{ce.forEach(c=>c()),K++,r.clearTimeout(N);let t=O;O=void 0,fe(t),u?s(u,!1):(Te(),ee.clear(),r.dispatchEvent(new Event(x)))},Ye;try{n.events&&(Ye=await Ne(n.events,(t,c)=>{if(!Z){if(t&&(l=t),l==="none"){ve();return}t==="web"&&Ve(),t==="native"&&(Xe(),G()),c&&je()}}))}catch(t){throw Z=!0,ve(),await de(Promise.resolve(me.remove())).catch(()=>{}),t}return{get owners(){return[...C]},get visibleOwners(){return[...U]},get preparedOwners(){return[...p]},consider:Se,changed:je,moved:()=>{Me(),Oe()},get token(){return B?void 0:u?.data.token},begin:Ve,get restoring(){return B},get handoffPending(){return R},retireRestoration:b,end:Xe,updated:tt,invalidate:ve,async destroy(){Z=!0,ve(),await Promise.allSettled([de(Promise.resolve().then(()=>me?.remove())),de(Promise.resolve().then(()=>Ye?.remove()))])}}},Ze=async(e,o,n)=>{let l=await ht(e,o,n),d=l.consider;return Object.assign(l,{consider:(r,T)=>d(r,T.map(h=>({...h,scope:e})))})};var Qe=(e,o)=>{if(e.nodeType!==1||e.namespaceURI!=="http://www.w3.org/1999/xhtml"||!e.ownerDocument||!("style"in e))throw new TypeError("A Web projection scope requires an HTMLElement fallback");if(e.matches("img, input, textarea, select, video, audio, canvas, iframe, embed, object, br, hr, area, base, link, meta, source, track, wbr"))throw new TypeError("A Web projection fallback must support ::before; use its existing container element");return Object.freeze({element:e,namespace:o})};var et=async(e,o,n={addListener:async(l,d)=>globalThis.Capacitor.addListener(e.plugin,l,d)})=>{let l="view",d=e.receiveListeners,r=!1,T=!1,h="native",v="native",P=qe(document),S=()=>h==="native"&&m&&P.isCovered(m)?"web":h,x=!1,C=!1,U=!1,p,f,a,E=!1,F=()=>{let s=E;E=!0;try{a?.begin()}finally{E=s}},m,k={},D,R=0,$=()=>{R++,D=void 0;let s=Fe(m);s?.owner===k&&(s.projected=!1,s.owner=void 0)},W={listen:s=>o.listen(s),send:s=>{if(!e.placementHandoff)return o.send(s);let y=Fe(m);if(s.action==="cover"){let J=++R;return D=s.token,y&&(y.owner=k,y.projected=!1),o.send(s).then(Y=>(J===R&&y===Fe(m)&&y?.owner===k&&(y.projected=Y?.shown===!0),Y)).catch(Y=>{throw J===R&&y?.owner===k&&($(),y.invalidate()),Y})}let b=s.action==="release"&&s.token===D,I=D&&(s.action==="restore"||b||s.action==="reset"||s.action==="visibility"&&s.visible);I&&R++;let A=R,ee=()=>{A!==R||y?.owner!==k||($(),y.invalidate())};try{let J=I&&y?.owner===k?{...s,token:"token"in s?s.token:D,placement:y.measure()}:s;return o.send(J).then(Y=>(A===R&&(s.action==="resume"||b||s.action==="reset"||s.action==="visibility")&&$(),Y)).catch(Y=>{throw ee(),Y})}catch(J){return ee(),Promise.reject(J)}}},oe=0,O=0,u=0,ie=!1,B=!1,ae=!1,ge=!1,K=document.createElement("style"),N=`data-native-ui-session-${e.id.replace(/[^a-zA-Z0-9-]/g,"")}`;K.textContent=`[${N}="native"], [${N}="native"] *, [${N}="none"], [${N}="none"] * {visibility:hidden!important}`,document.documentElement.append(K);let se=()=>{let s=document.querySelectorAll(e.projectionSelector);return s.length===1&&s[0]instanceof HTMLElement?s[0]:void 0},X=()=>{m&&(v==="web"||v==="native"&&C?m.removeAttribute(N):m.setAttribute(N,v))},Z=()=>{if(!m?.isConnected)return[];let s=m.getBoundingClientRect(),y={x:s.x,y:s.y,width:s.width,height:s.height},b=p&&ze(m,p,()=>e.id);return[{element:m,scrollElement:p,control:{id:l,...y,...b?{scroll:b}:{}}}]},we=async()=>{if(r)return;let s=u,y=e.failedFallback==="native"&&S()==="native"&&!!m?.isConnected;await W.send({action:"visibility",visible:y}).catch(()=>{}),!(r||s!==u)&&(y||v==="none"?X():m?.removeAttribute(N))},q=()=>{if(!x||v!=="native"||!m?.isConnected||a?.token||a?.restoring)return;let s=e.failedFallback==="native";W.send({action:"visibility",visible:s}).catch(()=>{}),s?X():m.removeAttribute(N)},ce=()=>{if(r||E)return;if(q(),v==="web"&&a&&!a.token&&!a.restoring){W.send({action:"visibility",visible:!1}).catch(()=>{}),m?.removeAttribute(N);return}if(ie||!a?.restoring||v!=="native")return;ie=!0;let s=u,y=a;W.send({action:"resume"}).then(()=>{r||s!==u||y!==a||(C=!1,y.updated(void 0,[l],++oe),X(),V())}).catch(()=>{s!==u||r||(y.invalidate(),we())}).finally(()=>{ie=!1,ce()})},ke=async()=>{if(r||B||x)return;if(a?.restoring){ce();return}let s=se();if(s!==m){if(u++,$(),m?.removeAttribute(N),await a?.destroy(),a=void 0,r)return;m=s,C=!1,fe.disconnect(),m&&fe.observe(m)}if(Ee(),v=S(),!m){await W.send({action:"visibility",visible:!1});return}if(!a){B=!0;let y=u;try{let b=await Ze(Qe(m,e.id),W,{wake:ce,blocked:()=>v!=="native"||x||C&&!a?.token,revision:()=>oe,captureRevision:e.captureMode==="view"?()=>O:void 0,transient:!0,opaqueUnderlay:e.captureMode==="view"});if(r||y!==u){await b.destroy();return}a=b}finally{B=!1}}if(!r){if(v==="native"&&C){await W.send({action:"visibility",visible:!1}),X();return}if(v==="native"){let y=u;if(await W.send({action:"visibility",visible:!0}),r||y!==u||v!=="native")return;X(),p=[...le(m)].find(A=>{let ee=getComputedStyle(A);return/auto|scroll/.test(ee.overflowX+ee.overflowY)&&(A.scrollHeight>A.clientHeight||A.scrollWidth>A.clientWidth)});let b=p&&ze(m,p,()=>e.id),I=await W.send({action:"track",viewportWidth:innerWidth,...b?{scroll:b}:{}});if(r||y!==u)return;U=I?.tracked===!0,a.consider(e.captureMode==="view"?O:++oe,Z())}else await W.send({action:"visibility",visible:!1}),X()}},V=()=>{r||(ae=!0,!(!T||ge)&&(ge=!0,Promise.resolve().then(async()=>{try{for(;ae&&!r;)ae=!1,await ke()}catch{await we()}finally{ge=!1,ae&&V()}})))},be=()=>{a?.invalidate(),V()},fe=new ResizeObserver(be);window.addEventListener("resize",be);let Q=new Set,We=new WeakSet,G=s=>{let y=s.composedPath()[0]??s.target;if(!(r||v!=="native"||!m||We.has(s)||y!==document&&![...le(m)].includes(y))){if(We.add(s),U&&y===p){a?.changed(y);return}x?e.captureMode==="view"?a?.moved():a?.changed():((ie||a?.restoring)&&u++,x=!0,F(),C=e.failedFallback!=="native",a?.token?m.removeAttribute(N):q()),clearTimeout(f),f=setTimeout(()=>{x=!1,!(r||v!=="native")&&(a?.end(),a?.restoring||V())},100)}},Ee=()=>{let s=new Set(m?le(m):[]),y=s.size!==Q.size||[...s].some(b=>!Q.has(b));for(let b of Q)s.has(b)||(b.removeEventListener("scroll",G),b.removeEventListener("slotchange",Se),Q.delete(b));for(let b of s)Q.has(b)||(b.addEventListener("scroll",G,{passive:!0}),b.addEventListener("slotchange",Se),Q.add(b));y&&(U=!1,p=void 0,a?.invalidate(),V())},Se=()=>{Ee(),V()};document.addEventListener("scroll",G,!0);let je=new MutationObserver(s=>{Ee(),se()!==m?V():m&&s.some(y=>y.type==="childList")&&me(S())});je.observe(document.documentElement,{childList:!0,attributes:!0,subtree:!0});let me=(s,y=!1)=>{if(r||!y&&s===v)return;x=!1,clearTimeout(f),v=s,u++;let b=u;v==="none"?W.send({action:"visibility",visible:!1}).then(()=>{v!=="none"||b!==u||r||(a?.invalidate(),X())}).catch(()=>{v!=="none"||b!==u||r||(a?.invalidate(),X())}):v==="web"?(F(),a?.token||W.send({action:"visibility",visible:!1}).catch(()=>{}),X()):v==="native"&&(a?.end(),a?.restoring||V())},Ce=P.subscribe(()=>queueMicrotask(()=>me(S()))),Pe,Te=async()=>{if(!r){r=!0,$(),u++,Ce(),je.disconnect(),fe.disconnect(),window.removeEventListener("resize",be),document.removeEventListener("scroll",G,!0);for(let s of Q)s.removeEventListener("scroll",G),s.removeEventListener("slotchange",Se);Q.clear(),clearTimeout(f),m?.removeAttribute(N),K.remove(),await Promise.allSettled([Promise.resolve(Pe?.remove()),a?.destroy()])}};try{let s=u;Pe=await Ne({addListener:(b,I)=>n.addListener(b,I),update:d?.update,projection:d?.projection,accepts:b=>!d?.match||Object.entries(d?.match).every(([I,A])=>typeof b=="object"&&b!==null&&b[I]===A)},(b,I)=>{r||(b&&(b==="native"&&(C=!1),h=b,W.send({action:"destination",destination:b}).catch(()=>{}),me(S(),!0)),I&&(O++,a?.changed(),v==="native"&&V()))});let y=await W.send({action:"connect"});return u===s&&["native","web","none"].includes(y?.destination)&&(h=y.destination),v=S(),T=!0,V(),{destroy:Te,show:()=>{C=!1,h="native",me(S(),!0)},hide:()=>{h=v="none",u++,x=!1,clearTimeout(f),a?.invalidate(),X()}}}catch(s){throw await Te(),s}};var ue=new Map,pe=new Map,He=new Map,yt=Array.from(crypto.getRandomValues(new Uint32Array(4)),e=>e.toString(16)).join("-"),Ue=new Map,gt=(e,o,n)=>Ue.get(e)?.get(o)?.(n),wt=0,bt=(e,o)=>new Promise((n,l)=>{let d=`${e}:${yt}:${++wt}`,r=setTimeout(()=>{pe.delete(d),l(new Error("Native UI session timed out"))},5e3);pe.set(d,{resolve:n,reject:l,timer:r});let T=JSON.stringify({key:d,request:o}),h=globalThis,v=h.webkit?.messageHandlers?.[e]??h[e]??h.nativeUIEngine;if(!v){clearTimeout(r),pe.delete(d),l(new Error("Native UI session unavailable"));return}try{v.postMessage(T)}catch(P){clearTimeout(r),pe.delete(d),l(P)}}),Et=(e,o,n,l)=>{if(o===null){He.get(e)?.(n);return}let d=pe.get(o);!d||!o.startsWith(`${e}:`)||(pe.delete(o),clearTimeout(d.timer),l?d.reject(new Error(l)):d.resolve(n))},Pt=e=>{ue.get(e)?.show()},Tt=e=>(ue.get(e)?.hide(),!0),Lt=async e=>{let o=ue.get(e);ue.delete(e),Ue.delete(e),He.delete(e);for(let[n,l]of pe)n.startsWith(`${e}:`)&&(pe.delete(n),clearTimeout(l.timer),l.reject(new Error("Native UI session closed")));await o?.destroy()},St=async e=>{if(ue.has(e.id))return;let o,n=!1,l,d={show:()=>{l="native",o?.show()},hide:()=>{l="none",o?.hide()},destroy:async()=>{n=!0,await o?.destroy()}};ue.set(e.id,d);try{if(document.readyState==="loading"&&await new Promise(T=>document.addEventListener("DOMContentLoaded",()=>T(),{once:!0})),n)return;let r=new Map;e.runtime==="cordova"&&Ue.set(e.id,r),o=await et(e,{send:T=>bt(e.id,T),listen:async T=>(He.set(e.id,T),{remove:()=>{He.get(e.id)===T&&He.delete(e.id)}})},e.runtime==="cordova"?{addListener:async(T,h)=>(r.set(T,h),{remove:()=>{r.delete(T)}})}:void 0),l==="none"?o.hide():l==="native"&&o.show(),n&&await o.destroy()}catch(r){throw ue.get(e.id)===d&&(ue.delete(e.id),Ue.delete(e.id)),r}};return lt(jt);})();

package/ios/Sources/WebViewNativeUIEngine/ScrollBindings.swift

@@ -0,0 +1,27 @@
+import UIKit
+import WebKit
+
+/// One tracker per DOM scroll owner. A lost established mapping is rejected;
+/// the host's normal acknowledgement path can then request a fresh acquisition.
+public final class NativeUIScrollBindings {
+    private var trackers: [String: NativeUIScrollTracker] = [:]
+    public init() {}
+    public func replace(_ nodes: [NativeUIScrollNode], in webView: WKWebView, scale: CGFloat,
+                        render: @escaping (String, CGRect, CGRect) -> Void) -> [String] {
+        let previous = trackers
+        trackers.removeAll()
+        var rejected: [String] = []
+        for (id, group) in Dictionary(grouping: nodes.filter { $0.scroll != nil }, by: { $0.scroll!.id }) {
+            if group.contains(where: { $0.scroll?.reuse == true }) {
+                if let tracker = previous[id], tracker.replace(group, webView: webView, scale: scale) {
+                    trackers[id] = tracker
+                } else { rejected.append(contentsOf: group.map(\.id)) }
+            } else if let tracker = NativeUIScrollTracker(webView: webView, nodes: group, scale: scale, render: render) {
+                trackers[id] = tracker
+            } else { rejected.append(contentsOf: group.map(\.id)) }
+        }
+        return rejected
+    }
+    public func update() { trackers.values.forEach { $0.update() } }
+    public func reset() { trackers.removeAll() }
+}

package/ios/Sources/WebViewNativeUIEngine/ScrollTracker.swift

@@ -0,0 +1,117 @@
+import UIKit
+import WebKit
+
+public struct NativeUIScrollPlacement: Decodable, Equatable {
+    public let id: String
+    public let reuse: Bool?
+    public let offsetX: Double
+    public let offsetY: Double
+    public let viewport: NativeUIFrame
+    public let clip: NativeUIFrame
+    public let contentWidth: Double
+    public let contentHeight: Double
+    public let frame: NativeUIFrame
+
+    public init(id: String, reuse: Bool? = nil, offsetX: Double, offsetY: Double,
+                viewport: NativeUIFrame, clip: NativeUIFrame, contentWidth: Double, contentHeight: Double, frame: NativeUIFrame) {
+        self.id = id; self.reuse = reuse; self.offsetX = offsetX; self.offsetY = offsetY
+        self.viewport = viewport; self.clip = clip; self.contentWidth = contentWidth; self.contentHeight = contentHeight; self.frame = frame
+    }
+
+    public var isValid: Bool {
+        !id.isEmpty && viewport.isValid && clip.isValid && frame.isValid &&
+        offsetX.isFinite && offsetY.isFinite && contentWidth.isFinite && contentHeight.isFinite && contentWidth > 0 && contentHeight > 0
+    }
+}
+
+/// One observer per overflow container. Web measures layout; native owns scrolling.
+/// WKWebView's overflow hierarchy is not a public DOM mapping: only bind a unique match.
+public final class NativeUIScrollTracker {
+    private weak var webView: WKWebView?
+    private weak var scrollView: UIScrollView?
+    private let placement: NativeUIScrollPlacement
+    private let scale: CGFloat
+    private let contentOrigin: CGPoint
+    private let viewportCorrection: CGPoint
+    private var frames: [String: CGRect] = [:]
+    private let render: (String, CGRect, CGRect) -> Void
+    private var observation: NSKeyValueObservation?
+
+    public init?(webView: WKWebView, nodes: [NativeUIScrollNode], scale: CGFloat,
+          render: @escaping (String, CGRect, CGRect) -> Void) {
+        guard let placement = nodes.first?.scroll, placement.isValid,
+              nodes.allSatisfy({ $0.scroll?.id == placement.id && $0.scroll?.viewport == placement.viewport &&
+                  $0.scroll?.clip == placement.clip && $0.scroll?.contentWidth == placement.contentWidth &&
+                  $0.scroll?.contentHeight == placement.contentHeight }), scale.isFinite, scale > 0 else { return nil }
+        let transform = CGAffineTransform(scaleX: scale, y: scale)
+        let viewport = placement.viewport.rect.applying(transform)
+        let candidates = Self.scrollViews(in: webView).filter { scroll in
+            let frame = scroll.convert(scroll.bounds, to: webView)
+            return scroll !== webView.scrollView && !scroll.isHidden && scroll.window != nil &&
+                abs(scroll.zoomScale - 1) < 0.001 &&
+                abs(frame.minX - viewport.minX) < 2 && abs(frame.minY - viewport.minY) < 2 &&
+                abs(frame.width - viewport.width) < 2 && abs(frame.height - viewport.height) < 2 &&
+                abs(scroll.contentSize.width - placement.contentWidth * scale) < 3 &&
+                abs(scroll.contentSize.height - placement.contentHeight * scale) < 3
+        }
+        guard candidates.count == 1, let scroll = candidates.first, !scroll.isDragging, !scroll.isDecelerating else { return nil }
+        self.webView = webView
+        self.scrollView = scroll
+        self.placement = placement
+        self.scale = scale
+        // Calibrate coordinate origins once while acquiring a resting scroller.
+        // CSS RTL scroll origins and UIKit dimensions can differ by rounded pixels.
+        // Keep this mapping for content updates during motion; never recalibrate per tick.
+        self.contentOrigin = CGPoint(x: scroll.contentOffset.x - placement.offsetX * scale,
+                                     y: scroll.contentOffset.y - placement.offsetY * scale)
+        let actual = scroll.convert(scroll.bounds, to: webView)
+        self.viewportCorrection = CGPoint(x: viewport.minX - actual.minX, y: viewport.minY - actual.minY)
+        self.render = render
+        setFrames(nodes)
+        observation = scroll.observe(\.contentOffset, options: [.new]) { [weak self] _, _ in self?.update() }
+    }
+
+    /// Reuse the observer and coordinate origin when only source content/layout changes.
+    public func replace(_ nodes: [NativeUIScrollNode], webView: WKWebView, scale: CGFloat) -> Bool {
+        guard self.webView === webView, let scrollView, scrollView.isDescendant(of: webView),
+              !scrollView.isHidden, scrollView.window != nil, self.scale == scale,
+              nodes.allSatisfy({ node in
+                  guard let next = node.scroll else { return false }
+                  return next.id == placement.id && next.viewport == placement.viewport && next.clip == placement.clip &&
+                      next.contentWidth == placement.contentWidth && next.contentHeight == placement.contentHeight
+              }) else { return false }
+        setFrames(nodes)
+        return true
+    }
+
+    private func setFrames(_ nodes: [NativeUIScrollNode]) {
+        frames = Dictionary(uniqueKeysWithValues: nodes.map {
+            ($0.id, $0.scroll!.frame.rect.applying(CGAffineTransform(scaleX: scale, y: scale))
+                .offsetBy(dx: contentOrigin.x, dy: contentOrigin.y))
+        })
+    }
+
+    public func update() {
+        guard let webView, let scrollView, scrollView.isDescendant(of: webView) else {
+            frames.forEach { render($0.key, $0.value, .null) }
+            return
+        }
+        let origin = scrollView.convert(scrollView.bounds, to: webView).origin
+        let viewport = CGRect(x: origin.x + viewportCorrection.x, y: origin.y + viewportCorrection.y,
+                              width: placement.viewport.width * scale, height: placement.viewport.height * scale)
+        let visible = placement.clip.rect.applying(CGAffineTransform(scaleX: scale, y: scale))
+            .intersection(viewport).intersection(webView.bounds)
+        UIView.performWithoutAnimation {
+            for (id, frame) in frames {
+                render(id, frame.offsetBy(dx: viewport.minX - scrollView.contentOffset.x,
+                                          dy: viewport.minY - scrollView.contentOffset.y), visible)
+            }
+        }
+    }
+
+    private static func scrollViews(in view: UIView) -> [UIScrollView] {
+        view.subviews.flatMap { child in
+            ((child as? UIScrollView).map { [$0] } ?? []) + scrollViews(in: child)
+        }
+    }
+}

package/package.json

@@ -1,6 +1,66 @@
 {
   "name": "@webview-native-ui/engine",
-  "version": "0.0.0-stage",
-  "stub": true,
-  "description": "Temporary package placeholder for staged publishing"
-}
+  "version": "0.0.1",
+  "description": "Native UI placement, scroll tracking, and Web projection for Capacitor and Cordova plugin maintainers.",
+  "type": "module",
+  "license": "Zlib",
+  "repository": {
+    "type": "git",
+    "url": "git+https://github.com/webview-native-ui/engine.git"
+  },
+  "exports": {
+    ".": {
+      "types": "./dist/index.d.ts",
+      "import": "./dist/index.js"
+    },
+    "./ionic": {
+      "types": "./dist/ionic.d.ts",
+      "import": "./dist/ionic.js"
+    }
+  },
+  "files": [
+    "dist",
+    "ios/Sources",
+    "WebViewNativeUIEngine.podspec",
+    "README.md",
+    "LICENSE",
+    "NOTICE",
+    "docs"
+  ],
+  "scripts": {
+    "build": "rm -rf dist && tsc -p tsconfig.json && node scripts/build-runtime.mjs",
+    "typecheck": "tsc --noEmit",
+    "test": "playwright test",
+    "lint": "npm run typecheck && eslint . --max-warnings 0 && npm run format:check",
+    "format": "prettier --write \"**/*.{ts,js,mjs,cjs,json,md,yml,yaml,html}\"",
+    "prepublishOnly": "npm run build",
+    "test:release": "node --test scripts/native-ui-engine-release/publish.test.mjs",
+    "test:package": "node scripts/verify-package.mjs",
+    "release": "np --no-publish --no-tests --branch main",
+    "test:cordova": "node scripts/verify-cordova.mjs",
+    "format:check": "prettier --check \"**/*.{ts,js,mjs,cjs,json,md,yml,yaml,html}\""
+  },
+  "devDependencies": {
+    "@eslint/js": "^10.0.1",
+    "@playwright/test": "^1.58.0",
+    "esbuild": "^0.27.0",
+    "eslint": "^10.13.0",
+    "globals": "^17.13.0",
+    "np": "^10.2.0",
+    "prettier": "^3.6.2",
+    "typescript": "^5.9.3",
+    "typescript-eslint": "^8.72.1"
+  },
+  "publishConfig": {
+    "access": "public"
+  },
+  "peerDependencies": {
+    "@capacitor/core": ">=8.0.0 <9"
+  },
+  "types": "./dist/index.d.ts",
+  "peerDependenciesMeta": {
+    "@capacitor/core": {
+      "optional": true
+    }
+  }
+}