craft-native 0.0.184 → 0.0.186

package/dist/cli.js

@@ -3303,7 +3303,7 @@ function pinCraftNativeDependency(packagePath, craftVersion) {
 `);
 }
 // package.json
-var version = "0.0.184";
+var version = "0.0.186";
 
 // bin/cli.ts
 var spawnedFrom = process6.env[CRAFT_CLI_SPAWN_MARKER];

package/dist/index.cjs

@@ -310,7 +310,7 @@ function craftBinaryNotFoundMessage(triedPath) {
 `);
 }
 // package.json
-var version = "0.0.184";
+var version = "0.0.186";
 
 // src/sdk-version.ts
 var SDK_VERSION = version;

package/dist/index.js

@@ -58,7 +58,7 @@ function craftBinaryNotFoundMessage(triedPath) {
 `);
 }
 // package.json
-var version = "0.0.184";
+var version = "0.0.186";
 
 // src/sdk-version.ts
 var SDK_VERSION = version;

package/dist/ios/templates/CraftNativeScreen.swift

@@ -577,6 +577,9 @@ private final class CraftNativeVideoView: UIView, AVPlayerViewControllerDelegate
         // A muted video makes no sound, so it leaves the session as it is.
         if muted { releaseSession() } else { claimSession() }
         playerController.showsPlaybackControls = controls
+        // The system's controls are for VoiceOver too; a bare video stays one element.
+        playerController.view.accessibilityElementsHidden = !controls
+        isUserInteractionEnabled = true
         playerController.videoGravity = resizeMode == "cover" ? .resizeAspectFill
             : resizeMode == "stretch" ? .resize
             : .resizeAspect
@@ -5687,6 +5690,13 @@ final class CraftNativeScreenController: UIViewController, UIScrollViewDelegate,
         return handler
     }
 
+    /// Views that take their own touches whatever handlers the screen gives
+    /// them: a scroll view, a modal, and a video's system controls (with
+    /// interaction off, its play, scrubber and full screen never answered).
+    private func ownsTouches(_ view: UIView) -> Bool {
+        view is UIScrollView || view is CraftNativeModalView || view is CraftNativeVideoView
+    }
+
     private func updatePressHandler(_ handler: String?, for view: UIView) {
         let id = ObjectIdentifier(view)
         let handler = handler?.isEmpty == false ? handler : nil
@@ -5701,7 +5711,7 @@ final class CraftNativeScreenController: UIViewController, UIScrollViewDelegate,
         }
         // A container keeps receiving touches without a handler of its own,
         // or every control inside it (and the screen root) would be dead.
-        if !(view is UIScrollView || view is CraftNativeModalView) { view.isUserInteractionEnabled = actionable || longPressHandlers[id] != nil || view is CraftNativeFlowView }
+        if !ownsTouches(view) { view.isUserInteractionEnabled = actionable || longPressHandlers[id] != nil || view is CraftNativeFlowView }
     }
 
     private func updatePressFeedback(_ pressIn: String?, _ pressOut: String?, for view: UIView) {
@@ -5710,7 +5720,7 @@ final class CraftNativeScreenController: UIViewController, UIScrollViewDelegate,
         if let pressOut, !pressOut.isEmpty { pressOutHandlers[id] = pressOut } else { pressOutHandlers.removeValue(forKey: id) }
         guard pressInHandlers[id] != nil || pressOutHandlers[id] != nil else {
             if let recognizer = pressFeedbackRecognizers.removeValue(forKey: id) { view.removeGestureRecognizer(recognizer) }
-            if !(view is UIScrollView || view is CraftNativeModalView) { view.isUserInteractionEnabled = handlers[id] != nil || linkTargets[id] != nil || longPressHandlers[id] != nil || view is CraftNativeFlowView }
+            if !ownsTouches(view) { view.isUserInteractionEnabled = handlers[id] != nil || linkTargets[id] != nil || longPressHandlers[id] != nil || view is CraftNativeFlowView }
             return
         }
         if pressFeedbackRecognizers[id] == nil {
@@ -5722,14 +5732,14 @@ final class CraftNativeScreenController: UIViewController, UIScrollViewDelegate,
             pressFeedbackRecognizers[id] = recognizer
             view.addGestureRecognizer(recognizer)
         }
-        if !(view is UIScrollView || view is CraftNativeModalView) { view.isUserInteractionEnabled = true }
+        if !ownsTouches(view) { view.isUserInteractionEnabled = true }
     }
 
     private func updateLongPressHandler(_ handler: String?, for view: UIView) {
         let id = ObjectIdentifier(view)
         if let handler, !handler.isEmpty {
             longPressHandlers[id] = handler
-            if !(view is UIScrollView || view is CraftNativeModalView) { view.isUserInteractionEnabled = true }
+            if !ownsTouches(view) { view.isUserInteractionEnabled = true }
             if longPressRecognizers[id] == nil {
                 let recognizer = UILongPressGestureRecognizer(target: self, action: #selector(viewLongPressed(_:)))
                 longPressRecognizers[id] = recognizer
@@ -5740,7 +5750,7 @@ final class CraftNativeScreenController: UIViewController, UIScrollViewDelegate,
             if let recognizer = longPressRecognizers.removeValue(forKey: id) {
                 view.removeGestureRecognizer(recognizer)
             }
-            if !(view is UIScrollView || view is CraftNativeModalView) { view.isUserInteractionEnabled = handlers[id] != nil || linkTargets[id] != nil || view is CraftNativeFlowView }
+            if !ownsTouches(view) { view.isUserInteractionEnabled = handlers[id] != nil || linkTargets[id] != nil || view is CraftNativeFlowView }
         }
     }
 
@@ -6336,10 +6346,14 @@ final class CraftNativeScreenController: UIViewController, UIScrollViewDelegate,
         // reads: its label names the group, as a tab strip or a pager's
         // name, and never stands in for its content. As an element of its
         // own, a labelled pager hid every page from VoiceOver.
+        // A video with its system controls is a group too: VoiceOver reaches
+        // play, the scrubber, skipping and full screen inside it.
+        let controlledVideo = type == "Video" && (props["controls"] as? Bool) == true
         let container = ["ScrollView", "FlatList", "SectionList"].contains(type)
             || ["tablist", "radiogroup", "list", "menu", "menubar", "toolbar"].contains(role ?? "")
+            || controlledVideo
         view.isAccessibilityElement = !container && role != "none" && (view.accessibilityLabel != nil || role != nil || ["Text", "Button", "Link", "Checkbox", "Image", "ImageBackground", "Video", "TextInput", "Picker", "DatePicker", "Switch", "Slider"].contains(type))
-        view.accessibilityContainerType = container && view.accessibilityLabel != nil ? .semanticGroup : .none
+        view.accessibilityContainerType = container && (view.accessibilityLabel != nil || controlledVideo) ? .semanticGroup : .none
         var traits: UIAccessibilityTraits = []
         switch role ?? type.lowercased() {
         case "tablist": traits.insert(.tabBar)
@@ -6925,10 +6939,15 @@ final class CraftNativeAnimationRecord {
     let fontSize: CGFloat?
     let textColor: UIColor?
     let transitionID: String?
+    /// Where it sat in its parent, to be put back after it faded elsewhere.
+    let index: Int?
+    let arrangedIndex: Int?
 
     init(view: UIView, screen: UIView, transitionID: String?) {
         self.view = view
         superview = view.superview
+        index = view.superview?.subviews.firstIndex(of: view)
+        arrangedIndex = (view.superview as? UIStackView)?.arrangedSubviews.firstIndex(of: view)
         frame = view.frame
         frameOnScreen = view.superview?.convert(view.frame, to: screen) ?? view.frame
         alpha = view.alpha
@@ -6947,6 +6966,10 @@ final class CraftNativeAnimationTransaction {
     var screenBackground: UIColor?
     /// Reduce Motion: the screen as it was, crossfaded into the new one.
     var picture: UIView?
+    /// Commits the change as the run loop finishes the pass it came in.
+    var observer: CFRunLoopObserver?
+    /// The screen as it was, drawn over it until the animation is set up.
+    var cover: UIView?
 
     init(spec: CraftNativeAnimationSpec, reduceMotion: Bool) {
         self.spec = spec
@@ -6956,7 +6979,11 @@ final class CraftNativeAnimationTransaction {
 
 /// An animation under way: finished at once if another change comes first.
 final class CraftNativeRunningAnimation {
+    /// The Core Animation key every animation of a change goes under.
+    static let key = "craft.change"
     var animators: [UIViewPropertyAnimator] = []
+    /// Live layers carrying an animation of the change, under `key` + a suffix.
+    var layers: [(CALayer, String)] = []
     var cleanup: [() -> Void] = []
     private var done = false
 
@@ -6967,6 +6994,10 @@ final class CraftNativeRunningAnimation {
             animator.stopAnimation(false)
             animator.finishAnimation(at: .end)
         }
+        // A live view's own values were never touched: taking the animation
+        // off leaves it exactly as the screen last drew it.
+        for (layer, key) in layers { layer.removeAnimation(forKey: key) }
+        layers.removeAll()
         cleanup.forEach { $0() }
         cleanup.removeAll()
     }
@@ -6991,16 +7022,40 @@ extension CraftNativeScreenController {
         let transaction = CraftNativeAnimationTransaction(spec: CraftNativeAnimationSpec(payload), reduceMotion: UIAccessibility.isReduceMotionEnabled)
         transaction.screenBackground = view.backgroundColor
         if transaction.reduceMotion {
-            transaction.picture = view.window == nil ? nil : view.snapshotView(afterScreenUpdates: false)
+            // Held over the screen until the change is in, then faded away.
+            if view.window != nil, let picture = view.snapshotView(afterScreenUpdates: false) {
+                picture.frame = view.bounds
+                picture.isUserInteractionEnabled = false
+                view.addSubview(picture)
+                transaction.picture = picture
+            }
         } else {
             view.layoutIfNeeded()
             recordAnimationState(renderedRoot, into: transaction)
+            // The screen as it is, held over it until the change's animation
+            // is set up: UIKit can draw the new screen before the run loop's
+            // pass ends, which showed it for a frame before it animated.
+            if view.window != nil, let cover = view.snapshotView(afterScreenUpdates: false) {
+                cover.frame = view.bounds
+                cover.isUserInteractionEnabled = false
+                view.addSubview(cover)
+                transaction.cover = cover
+            }
         }
         animationTransaction = transaction
         CraftNativeAnimationClock.duration = transaction.spec.duration
         // The change comes from the same turn of the script (the state it
-        // changed renders in a microtask); a slow one still animates.
-        DispatchQueue.main.async { [weak self] in self?.commitAnimatedChange() }
+        // changed renders in a microtask), so it is set up as the run loop
+        // finishes this pass, before Core Animation draws it: drawn first, the
+        // new screen showed for a frame and then jumped back to animate. A
+        // change that comes later still animates.
+        let observer = CFRunLoopObserverCreateWithHandler(kCFAllocatorDefault, CFRunLoopActivity.beforeWaiting.rawValue, false, 0) { [weak self] _, _ in
+            self?.commitAnimatedChange()
+        }
+        if let observer {
+            CFRunLoopAddObserver(CFRunLoopGetMain(), observer, .commonModes)
+            transaction.observer = observer
+        }
         DispatchQueue.main.asyncAfter(deadline: .now() + 0.15) { [weak self] in self?.commitAnimatedChange() }
     }
 
@@ -7020,6 +7075,13 @@ extension CraftNativeScreenController {
     private func commitAnimatedChange() {
         guard let transaction = animationTransaction else { return }
         animationTransaction = nil
+        if let observer = transaction.observer {
+            CFRunLoopRemoveObserver(CFRunLoopGetMain(), observer, .commonModes)
+            transaction.observer = nil
+        }
+        // Taken off in the same transaction the animations start in.
+        transaction.cover?.removeFromSuperview()
+        transaction.cover = nil
         let spec = transaction.spec
         let running = CraftNativeRunningAnimation()
         runningAnimation = running
@@ -7027,9 +7089,6 @@ extension CraftNativeScreenController {
 
         if transaction.reduceMotion {
             guard let picture = transaction.picture else { running.finish(); return }
-            picture.frame = view.bounds
-            picture.isUserInteractionEnabled = false
-            view.addSubview(picture)
             let fade = UIViewPropertyAnimator(duration: 0.3, curve: .easeInOut) { picture.alpha = 0 }
             fade.addCompletion { _ in running.finish() }
             running.animators.append(fade)
@@ -7073,26 +7132,69 @@ extension CraftNativeScreenController {
         view.addSubview(overlay)
         running.cleanup.append { overlay.removeFromSuperview() }
 
-        let main = UIViewPropertyAnimator(duration: spec.duration, timingParameters: spec.timing)
-        // Fades take the first part, so nothing is half there for long.
+        // Views that are going are the change's own now: they move into the
+        // overlay where they were and fade there. Put back as they were
+        // afterwards, in case the screen shows them again.
         let fadeOut = UIViewPropertyAnimator(duration: spec.duration * 0.5, curve: .easeOut)
-        let fadeIn = UIViewPropertyAnimator(duration: spec.duration * 0.6, curve: .easeInOut)
-        running.animators = [main, fadeOut, fadeIn]
-
-        // Removed views fade where they were, over what replaced them.
-        for record in removedRoots {
+        let quickFade = UIViewPropertyAnimator(duration: spec.duration * 0.35, curve: .easeOut)
+        let travel = UIViewPropertyAnimator(duration: spec.duration, timingParameters: spec.timing)
+        running.animators = [fadeOut, quickFade, travel]
+        func adopt(_ record: CraftNativeAnimationRecord, fading fade: UIViewPropertyAnimator) {
             let going = record.view
+            let resizes = going.translatesAutoresizingMaskIntoConstraints
+            let base = going.transform
             going.translatesAutoresizingMaskIntoConstraints = true
             going.transform = .identity
             going.frame = record.frameOnScreen
+            going.alpha = record.alpha
             overlay.addSubview(going)
-            fadeOut.addAnimations { going.alpha = 0 }
+            fade.addAnimations { going.alpha = 0 }
+            running.cleanup.append {
+                going.removeFromSuperview()
+                going.transform = base
+                going.alpha = record.alpha
+                going.translatesAutoresizingMaskIntoConstraints = resizes
+                going.frame = record.frame
+                // Back in a parent that went with it, as it was: a screen
+                // that shows that subtree again finds it whole.
+                if let parent = record.superview, parent.window == nil {
+                    if let stack = parent as? UIStackView, let at = record.arrangedIndex {
+                        stack.insertArrangedSubview(going, at: min(at, stack.arrangedSubviews.count))
+                    } else if let at = record.index {
+                        parent.insertSubview(going, at: min(at, parent.subviews.count))
+                    }
+                }
+            }
+        }
+        for record in removedRoots { adopt(record, fading: fadeOut) }
+
+        // Live views are animated on their layers only, from how they were to
+        // how the screen draws them now: nothing the screen sets on them
+        // meanwhile (the next second on a timer, a style patch) is undone.
+        let fades = spec.duration * 0.6
+        func animate(_ layer: CALayer, _ keyPath: String, from: Any, duration: TimeInterval? = nil, spring: Bool = true) {
+            let animation: CABasicAnimation
+            if spring, duration == nil, spec.curve == "spring" {
+                let bouncy = CASpringAnimation(keyPath: keyPath)
+                bouncy.mass = 1
+                bouncy.stiffness = pow(2 * .pi / spec.duration, 2)
+                bouncy.damping = 2 * sqrt(bouncy.stiffness) * (1 - spec.bounce)
+                bouncy.duration = bouncy.settlingDuration
+                animation = bouncy
+            } else {
+                animation = CABasicAnimation(keyPath: keyPath)
+                animation.duration = duration ?? spec.duration
+                animation.timingFunction = CAMediaTimingFunction(name: spec.curve == "linear" ? .linear : .easeInEaseOut)
+            }
+            animation.fromValue = from
+            let key = "\(CraftNativeRunningAnimation.key).\(keyPath)"
+            layer.add(animation, forKey: key)
+            running.layers.append((layer, key))
         }
 
-        // The background, the screen's own included, goes from the old colour.
+        // The background, the screen's own included, comes from the old colour.
         if let before = transaction.screenBackground, let now = view.backgroundColor, !before.isEqual(now) {
-            view.backgroundColor = before
-            main.addAnimations { self.view.backgroundColor = now }
+            animate(view.layer, "backgroundColor", from: before.cgColor, spring: false)
         }
 
         // Shared elements: the new view starts where the old one was, at its
@@ -7100,58 +7202,56 @@ extension CraftNativeScreenController {
         for (old, new) in pairs {
             let target = new.superview?.convert(new.frame, to: view) ?? new.frame
             let move = morph(from: old.frameOnScreen, to: target, uniform: true)
-            let finalAlpha = new.alpha
-            let base = new.transform
-            new.transform = base.concatenating(move)
-            new.alpha = 0
-            main.addAnimations { new.transform = base }
-            fadeIn.addAnimations { new.alpha = finalAlpha }
+            animate(new.layer, "transform", from: CATransform3DMakeAffineTransform(new.transform.concatenating(move)))
+            // Crossed quickly, so the two are never both half there for long.
+            animate(new.layer, "opacity", from: 0, duration: spec.duration * 0.35)
+            adopt(old, fading: quickFade)
             let going = old.view
-            going.translatesAutoresizingMaskIntoConstraints = true
-            going.transform = .identity
-            going.frame = old.frameOnScreen
-            going.alpha = old.alpha
-            overlay.addSubview(going)
-            main.addAnimations { going.transform = move.inverted() }
-            fadeOut.addAnimations { going.alpha = 0 }
-            running.cleanup.append { new.transform = base; new.alpha = finalAlpha }
+            travel.addAnimations { going.transform = move.inverted() }
         }
 
         // New views fade in. A new container holding a shared element keeps it
         // in sight: only the rest of it fades, and its colour comes up.
+        func fadeIn(_ added: UIView) {
+            if pairedNew.contains(ObjectIdentifier(added)) { return }
+            guard containsShared(added, pairedNew: pairedNew) else {
+                animate(added.layer, "opacity", from: 0, duration: fades)
+                return
+            }
+            if let colour = added.backgroundColor, colour != .clear {
+                animate(added.layer, "backgroundColor", from: colour.withAlphaComponent(0).cgColor, duration: fades)
+            }
+            added.subviews.forEach(fadeIn)
+        }
         for added in inserted where !(added.superview.map { insertedIds.contains(ObjectIdentifier($0)) } ?? false) {
-            fadeInInserted(added, pairedNew: pairedNew, animator: fadeIn, running: running)
+            fadeIn(added)
         }
 
         // Views that stay go to their new places and sizes.
         for record in records.values where present.contains(ObjectIdentifier(record.view)) {
             let stays = record.view
             if let label = stays as? UILabel, let before = record.fontSize, abs(before - label.font.pointSize) > 0.5 {
-                let base = label.transform
                 let target = label.superview?.convert(label.frame, to: view) ?? label.frame
-                label.transform = base.concatenating(morph(from: record.frameOnScreen, to: target, uniform: true))
-                main.addAnimations { label.transform = base }
-                running.cleanup.append { label.transform = base }
-            } else if record.superview === stays.superview, record.frame != stays.frame {
-                let final = stays.frame
-                stays.frame = record.frame
-                main.addAnimations { stays.frame = final }
+                let move = morph(from: record.frameOnScreen, to: target, uniform: true)
+                animate(label.layer, "transform", from: CATransform3DMakeAffineTransform(label.transform.concatenating(move)))
+            } else if record.superview === stays.superview, record.frame != stays.frame, stays.transform.isIdentity {
+                animate(stays.layer, "position", from: CGPoint(x: record.frame.midX, y: record.frame.midY))
+                if record.frame.size != stays.frame.size {
+                    animate(stays.layer, "bounds.size", from: record.frame.size)
+                }
             }
             if let before = record.backgroundColor, let now = stays.backgroundColor, !before.isEqual(now) {
-                stays.backgroundColor = before
-                main.addAnimations { stays.backgroundColor = now }
-            }
-            if let label = stays as? UILabel, let before = record.textColor, !before.isEqual(label.textColor) {
-                let now = label.textColor
-                label.textColor = before
-                UIView.transition(with: label, duration: spec.duration * 0.6, options: [.transitionCrossDissolve, .allowAnimatedContent]) { label.textColor = now }
+                animate(stays.layer, "backgroundColor", from: before.cgColor, spring: false)
             }
         }
 
-        main.addCompletion { _ in running.finish() }
+        travel.addCompletion { _ in running.finish() }
         fadeOut.startAnimation()
-        fadeIn.startAnimation()
-        main.startAnimation()
+        quickFade.startAnimation()
+        travel.startAnimation()
+        // The springs settle a little after `duration`; the views are already
+        // where the screen draws them, so finishing then changes nothing.
+        DispatchQueue.main.asyncAfter(deadline: .now() + spec.duration * 2) { running.finish() }
     }
 
     /// The transform that puts a view at `final` where `start` was: moved
@@ -7166,23 +7266,6 @@ extension CraftNativeScreenController {
         return CGAffineTransform(translationX: dx, y: dy).scaledBy(x: sx, y: sy)
     }
 
-    private func fadeInInserted(_ view: UIView, pairedNew: Set<ObjectIdentifier>, animator: UIViewPropertyAnimator, running: CraftNativeRunningAnimation) {
-        if pairedNew.contains(ObjectIdentifier(view)) { return }
-        guard containsShared(view, pairedNew: pairedNew) else {
-            let finalAlpha = view.alpha
-            view.alpha = 0
-            animator.addAnimations { view.alpha = finalAlpha }
-            running.cleanup.append { view.alpha = finalAlpha }
-            return
-        }
-        if let colour = view.backgroundColor, colour != .clear {
-            view.backgroundColor = colour.withAlphaComponent(0)
-            animator.addAnimations { view.backgroundColor = colour }
-            running.cleanup.append { view.backgroundColor = colour }
-        }
-        for child in view.subviews { fadeInInserted(child, pairedNew: pairedNew, animator: animator, running: running) }
-    }
-
     private func containsShared(_ view: UIView, pairedNew: Set<ObjectIdentifier>) -> Bool {
         if pairedNew.contains(ObjectIdentifier(view)) { return true }
         return view.subviews.contains { containsShared($0, pairedNew: pairedNew) }

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "craft-native",
-  "version": "0.0.184",
+  "version": "0.0.186",
   "type": "module",
   "description": "Build desktop apps with web languages - TypeScript SDK for Craft",
   "author": "Chris Breuer <chris@stacksjs.org>",