craft-native 0.0.346 → 0.0.350

package/dist/binary-resolver.d.ts

@@ -29,7 +29,7 @@
  * @returns The string to pass to `spawn(...)`. Either `explicit`,
  *   `process.env.CRAFT_BIN`, or the bare `'craft'` for PATH lookup.
  */
-export declare function resolveCraftBinary(explicit?: string): string;
+export declare function resolveCraftBinary(explicit?: string, profile?: 'full' | 'webview'): string;
 /**
  * Set on the child environment whenever the CLI spawns what it believes is
  * the native binary.

package/dist/cli.js

@@ -242,7 +242,9 @@ async function packageApp(config) {
   return results;
 }
 function macOSAppStoreRuntimePath(providerPath) {
-  const runtime = basename(providerPath) === "craft-app-store" ? providerPath : join2(dirname(providerPath), "craft-app-store");
+  const providerName = basename(providerPath);
+  const storeName = providerName.startsWith("craft-webview") ? "craft-webview-app-store" : "craft-app-store";
+  const runtime = providerName === storeName ? providerPath : join2(dirname(providerPath), storeName);
   if (!existsSync4(runtime))
     throw new Error("App Store packaging requires Pantry\u2019s craft-app-store runtime. Upgrade Craft with Pantry before building.");
   const bytes = readFileSync2(runtime);
@@ -299,6 +301,17 @@ async function packageMacOS(config, outDir) {
   }
   try {
     const contents = join2(appBundlePath, "Contents");
+    if (opts.appStore && opts.appBundlePath && existsSync4(join2(contents, "Resources", "craft.json"))) {
+      if (!nativeRuntimePath)
+        throw new Error("App Store packaging of a prebuilt Craft bundle requires macos.nativeRuntimePath from Pantry.");
+      const plist = join2(contents, "Info.plist");
+      const executable = spawnSync("plutil", ["-extract", "CFBundleExecutable", "raw", "-o", "-", plist], { encoding: "utf8" });
+      const name = executable.stdout.trim();
+      if (executable.status !== 0 || !name || basename(name) !== name || name === "." || name === "..")
+        throw new Error("Prebuilt Craft bundle has an invalid CFBundleExecutable");
+      copyFileSync(nativeRuntimePath, join2(contents, "MacOS", name));
+      chmodSync(join2(contents, "MacOS", name), 493);
+    }
     if (opts.provisioningProfile) {
       const profile = join2(contents, "embedded.provisionprofile");
       copyFileSync(opts.provisioningProfile, profile);
@@ -2947,7 +2960,7 @@ import process6 from "process";
 
 // src/binary-resolver.ts
 import { existsSync as existsSync2 } from "fs";
-function resolveCraftBinary(explicit) {
+function resolveCraftBinary(explicit, profile = "full") {
   if (explicit) {
     if (!existsSync2(explicit)) {
       throw new Error(`Custom Craft binary path not found: ${explicit}`);
@@ -2961,7 +2974,7 @@ function resolveCraftBinary(explicit) {
     }
     return fromEnv;
   }
-  return "craft";
+  return profile === "webview" ? "craft-webview" : "craft";
 }
 var CRAFT_CLI_SPAWN_MARKER = "CRAFT_CLI_SPAWNED_FROM";
 function craftBinaryIsCliShimMessage(spawnedFrom) {
@@ -3022,7 +3035,7 @@ function pinCraftNativeDependency(packagePath, craftVersion) {
 `);
 }
 // package.json
-var version = "0.0.346";
+var version = "0.0.350";
 
 // bin/cli.ts
 var spawnedFrom = process6.env[CRAFT_CLI_SPAWN_MARKER];

package/dist/index.cjs

@@ -341,7 +341,7 @@ var import_node_util = require("node:util");
 
 // src/binary-resolver.ts
 var import_node_fs = require("node:fs");
-function resolveCraftBinary(explicit) {
+function resolveCraftBinary(explicit, profile = "full") {
   if (explicit) {
     if (!import_node_fs.existsSync(explicit)) {
       throw new Error(`Custom Craft binary path not found: ${explicit}`);
@@ -355,7 +355,7 @@ function resolveCraftBinary(explicit) {
     }
     return fromEnv;
   }
-  return "craft";
+  return profile === "webview" ? "craft-webview" : "craft";
 }
 var CRAFT_CLI_SPAWN_MARKER = "CRAFT_CLI_SPAWNED_FROM";
 function craftBinaryNotFoundMessage(triedPath) {
@@ -375,7 +375,7 @@ function craftBinaryNotFoundMessage(triedPath) {
 `);
 }
 // package.json
-var version = "0.0.346";
+var version = "0.0.350";
 
 // src/sdk-version.ts
 var SDK_VERSION = version;
@@ -608,7 +608,9 @@ async function packageApp(config) {
   return results;
 }
 function macOSAppStoreRuntimePath(providerPath) {
-  const runtime = import_path.basename(providerPath) === "craft-app-store" ? providerPath : import_path.join(import_path.dirname(providerPath), "craft-app-store");
+  const providerName = import_path.basename(providerPath);
+  const storeName = providerName.startsWith("craft-webview") ? "craft-webview-app-store" : "craft-app-store";
+  const runtime = providerName === storeName ? providerPath : import_path.join(import_path.dirname(providerPath), storeName);
   if (!import_fs.existsSync(runtime))
     throw new Error("App Store packaging requires Pantry’s craft-app-store runtime. Upgrade Craft with Pantry before building.");
   const bytes = import_fs.readFileSync(runtime);
@@ -665,6 +667,17 @@ async function packageMacOS(config, outDir) {
   }
   try {
     const contents = import_path.join(appBundlePath, "Contents");
+    if (opts.appStore && opts.appBundlePath && import_fs.existsSync(import_path.join(contents, "Resources", "craft.json"))) {
+      if (!nativeRuntimePath)
+        throw new Error("App Store packaging of a prebuilt Craft bundle requires macos.nativeRuntimePath from Pantry.");
+      const plist = import_path.join(contents, "Info.plist");
+      const executable = import_child_process.spawnSync("plutil", ["-extract", "CFBundleExecutable", "raw", "-o", "-", plist], { encoding: "utf8" });
+      const name = executable.stdout.trim();
+      if (executable.status !== 0 || !name || import_path.basename(name) !== name || name === "." || name === "..")
+        throw new Error("Prebuilt Craft bundle has an invalid CFBundleExecutable");
+      import_fs.copyFileSync(nativeRuntimePath, import_path.join(contents, "MacOS", name));
+      import_fs.chmodSync(import_path.join(contents, "MacOS", name), 493);
+    }
     if (opts.provisioningProfile) {
       const profile = import_path.join(contents, "embedded.provisionprofile");
       import_fs.copyFileSync(opts.provisioningProfile, profile);
@@ -11785,7 +11798,7 @@ class CraftApp {
     return args;
   }
   async findCraftBinary() {
-    return resolveCraftBinary(this.config.craftPath);
+    return resolveCraftBinary(this.config.craftPath, this.config.runtimeProfile);
   }
 }
 function createApp(config) {

package/dist/index.js

@@ -83,7 +83,7 @@ import { promisify as promisify2 } from "util";
 
 // src/binary-resolver.ts
 import { existsSync } from "fs";
-function resolveCraftBinary(explicit) {
+function resolveCraftBinary(explicit, profile = "full") {
   if (explicit) {
     if (!existsSync(explicit)) {
       throw new Error(`Custom Craft binary path not found: ${explicit}`);
@@ -97,7 +97,7 @@ function resolveCraftBinary(explicit) {
     }
     return fromEnv;
   }
-  return "craft";
+  return profile === "webview" ? "craft-webview" : "craft";
 }
 var CRAFT_CLI_SPAWN_MARKER = "CRAFT_CLI_SPAWNED_FROM";
 function craftBinaryNotFoundMessage(triedPath) {
@@ -117,7 +117,7 @@ function craftBinaryNotFoundMessage(triedPath) {
 `);
 }
 // package.json
-var version = "0.0.346";
+var version = "0.0.350";
 
 // src/sdk-version.ts
 var SDK_VERSION = version;
@@ -364,7 +364,9 @@ async function packageApp(config) {
   return results;
 }
 function macOSAppStoreRuntimePath(providerPath) {
-  const runtime = basename(providerPath) === "craft-app-store" ? providerPath : join2(dirname(providerPath), "craft-app-store");
+  const providerName = basename(providerPath);
+  const storeName = providerName.startsWith("craft-webview") ? "craft-webview-app-store" : "craft-app-store";
+  const runtime = providerName === storeName ? providerPath : join2(dirname(providerPath), storeName);
   if (!existsSync3(runtime))
     throw new Error("App Store packaging requires Pantry\u2019s craft-app-store runtime. Upgrade Craft with Pantry before building.");
   const bytes = readFileSync(runtime);
@@ -421,6 +423,17 @@ async function packageMacOS(config, outDir) {
   }
   try {
     const contents = join2(appBundlePath, "Contents");
+    if (opts.appStore && opts.appBundlePath && existsSync3(join2(contents, "Resources", "craft.json"))) {
+      if (!nativeRuntimePath)
+        throw new Error("App Store packaging of a prebuilt Craft bundle requires macos.nativeRuntimePath from Pantry.");
+      const plist = join2(contents, "Info.plist");
+      const executable = spawnSync("plutil", ["-extract", "CFBundleExecutable", "raw", "-o", "-", plist], { encoding: "utf8" });
+      const name = executable.stdout.trim();
+      if (executable.status !== 0 || !name || basename(name) !== name || name === "." || name === "..")
+        throw new Error("Prebuilt Craft bundle has an invalid CFBundleExecutable");
+      copyFileSync(nativeRuntimePath, join2(contents, "MacOS", name));
+      chmodSync(join2(contents, "MacOS", name), 493);
+    }
     if (opts.provisioningProfile) {
       const profile = join2(contents, "embedded.provisionprofile");
       copyFileSync(opts.provisioningProfile, profile);
@@ -11541,7 +11554,7 @@ class CraftApp {
     return args;
   }
   async findCraftBinary() {
-    return resolveCraftBinary(this.config.craftPath);
+    return resolveCraftBinary(this.config.craftPath, this.config.runtimeProfile);
   }
 }
 function createApp(config) {

package/dist/macos/templates/CraftMacApplication.swift

@@ -18,12 +18,16 @@ final class CraftMacScene: NSObject, NSWindowDelegate {
         super.init()
         runtime.scene = self; renderer.window = window
         window.title = options["title"] as? String ?? application.appName
+        if (options["titlebarStyle"] as? String ?? application.titlebarStyle) == "transparent" {
+            window.titlebarAppearsTransparent = true
+            window.titleVisibility = .hidden
+        }
         window.minSize = CGSize(width: number(options["minWidth"]) ?? 640, height: number(options["minHeight"]) ?? 400)
         window.isReleasedWhenClosed = false
         renderer.root.autoresizingMask = [.width, .height]
         window.contentView = renderer.root
         window.delegate = self; window.center()
-        if name == "main" { window.setFrameAutosaveName("\(application.appName)NativeMain") }
+        if name == "main" && application.testDirectory == nil { window.setFrameAutosaveName("\(application.appName)NativeMain") }
         window.makeKeyAndOrderFront(nil)
         runtime.load(application.bundle)
     }
@@ -49,6 +53,8 @@ final class CraftMacApplication: NSObject, NSApplicationDelegate, UNUserNotifica
     var appName = "Craft"
     var bundle = ""
     var initialRoute = "Main"
+    var titlebarStyle = "standard"
+    var mainWindowOptions: [String: Any] = [:]
     var network: CraftMacNetwork!
     var scenes: [String: CraftMacScene] = [:]
     var panels: [NSWindow] = []
@@ -73,7 +79,7 @@ final class CraftMacApplication: NSObject, NSApplicationDelegate, UNUserNotifica
                 guard error == nil, (response as? HTTPURLResponse)?.statusCode == 200 else {
                     let alert = NSAlert(); alert.messageText = "Could not connect to the app"; alert.informativeText = error?.localizedDescription ?? "The local agent did not issue a native session."; alert.runModal(); NSApp.terminate(nil); return
                 }
-                self.open(name: "main", route: self.initialRoute, options: ["title": self.appName])
+                self.open(name: "main", route: self.initialRoute, options: self.mainWindowOptions.merging(["title": self.appName]) { _, new in new })
                 self.startTestDriver()
             }
         }.resume()
@@ -91,6 +97,8 @@ final class CraftMacApplication: NSObject, NSApplicationDelegate, UNUserNotifica
     }
     func broadcast(_ id: String) { for scene in scenes.values { scene.runtime.send("CRAFT_EVENT", ["event": "craftDesktopCommand", "detail": ["id": id]]) } }
     func appearanceChanged() {
+        CATransaction.begin(); CATransaction.setDisableActions(true)
+        defer { CATransaction.commit() }
         let scheme = CraftMacColor.isDark ? "dark" : "light"
         for scene in scenes.values {
             scene.runtime.context.evaluateScript("__stxNativeBridge.colorScheme = '\(scheme)';")
@@ -266,6 +274,11 @@ final class CraftMacApplication: NSObject, NSApplicationDelegate, UNUserNotifica
         let scene = scenes[action["window"] as? String ?? "main"]
         guard let scene else { return ["ok": false, "error": "Window not found"] }
         if kind == "close" { scene.window.performClose(nil); return ["ok": true] }
+        if kind == "resize", let width = number(action["width"]), let height = number(action["height"]), width.isFinite, height.isFinite {
+            scene.window.setContentSize(CGSize(width: max(scene.window.minSize.width, width), height: max(scene.window.minSize.height, height)))
+            scene.renderer.root.layoutSubtreeIfNeeded()
+            return ["ok": true]
+        }
         if kind == "screenshot" {
             guard let directory = testDirectory, let view = scene.window.contentView?.superview,
                   let bitmap = view.bitmapImageRepForCachingDisplay(in: view.bounds) else { return ["ok": false, "error": "Window cannot be rendered"] }
@@ -305,9 +318,15 @@ final class CraftMacApplication: NSObject, NSApplicationDelegate, UNUserNotifica
         let windows: [[String: Any]] = scenes.values.map { scene in
             let nodes: [[String: Any]] = scene.renderer.boxes.values.map { box in
                 var node: [String: Any] = ["id": box.props["testID"] as? String ?? box.props["testId"] as? String ?? box.id, "type": box.kind,
-                    "nativeClass": box.control.map { String(describing: type(of: $0)) } ?? "NSView", "visible": !box.isHidden && box.window?.isVisible == true && box.frame.width > 0 && box.frame.height > 0,
+                    "nativeClass": box.control.map { String(describing: type(of: $0)) } ?? "NSView", "visible": !box.isHiddenOrHasHiddenAncestor && box.window?.isVisible == true && !box.visibleRect.isEmpty,
                     "frame": [box.frame.minX, box.frame.minY, box.frame.width, box.frame.height]]
                 if let field = box.control as? NSTextField { node["value"] = field.stringValue }
+                if let field = box.control as? NSTextField { node["fontSize"] = field.font?.pointSize; node["lines"] = field.maximumNumberOfLines }
+                let frame = box.convert(box.bounds, to: scene.renderer.root)
+                node["windowFrame"] = [frame.minX, frame.minY, frame.width, frame.height]
+                node["style"] = box.style
+                node["hiddenAncestor"] = box.isHiddenOrHasHiddenAncestor
+                node["visibleRect"] = [box.visibleRect.minX, box.visibleRect.minY, box.visibleRect.width, box.visibleRect.height]
                 if let text = (box.control as? NSScrollView)?.documentView as? NSTextView { node["value"] = text.string; node["editorClass"] = NSStringFromClass(type(of: text)) }
                 if let button = box.control as? NSButton { node["label"] = button.title; node["enabled"] = button.isEnabled }
                 if let picker = box.control as? NSPopUpButton { node["value"] = picker.selectedItem?.representedObject ?? "" }
@@ -333,6 +352,10 @@ final class CraftMacApplication: NSObject, NSApplicationDelegate, UNUserNotifica
         application.bundle = try String(contentsOfFile: bundlePath, encoding: .utf8)
         application.appName = argument("--title", fallback: "Craft")
         application.initialRoute = argument("--route", fallback: "Main")
+        application.titlebarStyle = argument("--titlebar-style", fallback: "standard")
+        for (flag, key) in [("--width", "width"), ("--height", "height"), ("--min-width", "minWidth"), ("--min-height", "minHeight")] {
+            if let value = Double(argument(flag)), value.isFinite, value > 0 { application.mainWindowOptions[key] = value }
+        }
         application.network = CraftMacNetwork(base: api)
         let testDirectory = argument("--test-dir")
         if !testDirectory.isEmpty { application.testDirectory = URL(fileURLWithPath: testDirectory, isDirectory: true) }

package/dist/macos/templates/CraftMacRenderer.swift

@@ -45,12 +45,20 @@ enum CraftMacFlex {
 final class CraftMacFlow: NSView {
     var boxes: [CraftMacBox] = []
     var style: [String: Any] = [:]
+    var componentScope = false
     override var isFlipped: Bool { true }
     override func layout() {
         super.layout()
         layoutBoxes(in: bounds.size)
     }
     func layoutBoxes(in size: CGSize) {
+        // AppKit can lay out this inner flow after its owning box. Component
+        // scopes must preserve the root's allocation on that later pass too.
+        if componentScope, boxes.count == 1, boxes[0].kind != "Modal", boxes[0].superview === self {
+            boxes[0].frame = CGRect(origin: .zero, size: size)
+            boxes[0].layoutSubtreeIfNeeded()
+            return
+        }
         let horizontal = style["flexDirection"] as? String == "row"
         let padding = dimension(style["padding"], base: size.width) ?? 0
         let left = dimension(style["paddingLeft"], base: size.width) ?? dimension(style["paddingHorizontal"], base: size.width) ?? padding
@@ -58,41 +66,75 @@ final class CraftMacFlow: NSView {
         let top = dimension(style["paddingTop"], base: size.height) ?? dimension(style["paddingVertical"], base: size.height) ?? padding
         let bottom = dimension(style["paddingBottom"], base: size.height) ?? dimension(style["paddingVertical"], base: size.height) ?? padding
         let inner = CGSize(width: max(0, size.width - left - right), height: max(0, size.height - top - bottom))
-        let visible = boxes.filter { !$0.isHidden && $0.kind != "Modal" }
+        let visible = boxes.filter { !$0.isHidden && $0.kind != "Modal" && $0.layoutStyle["position"] as? String != "absolute" }
         let gap = dimension(style["gap"], base: inner.width) ?? 0
-        let sizes = visible.map { $0.measure(width: inner.width) }
+        let sizes = visible.map { box in
+            let alignment = box.layoutStyle["alignSelf"] as? String ?? style["alignItems"] as? String ?? "stretch"
+            return box.measure(width: inner.width, stretch: !horizontal && alignment == "stretch")
+        }
         let items = visible.enumerated().map { index, box -> CraftMacFlex.Item in
             let main = horizontal ? sizes[index].width : sizes[index].height
-            let basis = dimension(box.style["flexBasis"], base: horizontal ? inner.width : inner.height) ?? main
-            let grow = number(box.style["flexGrow"]) ?? number(box.style["flex"]) ?? 0
-            let shrink = number(box.style["flexShrink"]) ?? (grow > 0 ? 1 : 0)
-            let minimum = dimension(box.style[horizontal ? "minWidth" : "minHeight"], base: horizontal ? inner.width : inner.height)
-            let maximum = dimension(box.style[horizontal ? "maxWidth" : "maxHeight"], base: horizontal ? inner.width : inner.height)
-            return .init(basis: Float(basis), grow: Float(grow), shrink: Float(shrink), min: minimum.map(Float.init) ?? .nan, max: maximum.map(Float.init) ?? .nan, start: 0, end: 0)
+            let layout = box.layoutStyle
+            let grow = number(layout["flexGrow"]) ?? number(layout["flex"]) ?? 0
+            let basis = dimension(layout["flexBasis"], base: horizontal ? inner.width : inner.height) ?? (number(layout["flex"]) != nil ? 0 : main)
+            let shrink = number(layout["flexShrink"]) ?? (grow > 0 ? 1 : 0)
+            let minimum = dimension(layout[horizontal ? "minWidth" : "minHeight"], base: horizontal ? inner.width : inner.height)
+            let maximum = dimension(layout[horizontal ? "maxWidth" : "maxHeight"], base: horizontal ? inner.width : inner.height)
+            let margin = number(layout["margin"]) ?? 0
+            let start = number(layout[horizontal ? "marginLeft" : "marginTop"]) ?? number(layout[horizontal ? "marginHorizontal" : "marginVertical"]) ?? margin
+            let end = number(layout[horizontal ? "marginRight" : "marginBottom"]) ?? number(layout[horizontal ? "marginHorizontal" : "marginVertical"]) ?? margin
+            return .init(basis: Float(basis), grow: Float(grow), shrink: Float(shrink), min: minimum.map(Float.init) ?? .nan, max: maximum.map(Float.init) ?? .nan, start: Float(start), end: Float(end))
         }
         let frames = CraftMacFlex.layout(items, available: horizontal ? inner.width : inner.height, gap: gap, justify: style["justifyContent"] as? String ?? "flex-start")
         for (index, box) in visible.enumerated() {
             let crossAvailable = horizontal ? inner.height : inner.width
-            let crossExplicit = dimension(box.style[horizontal ? "height" : "width"], base: crossAvailable)
-            let alignment = box.style["alignSelf"] as? String ?? style["alignItems"] as? String ?? "stretch"
-            let cross = min(crossAvailable, crossExplicit ?? (alignment == "stretch" ? crossAvailable : (horizontal ? sizes[index].height : sizes[index].width)))
+            let crossExplicit = dimension(box.layoutStyle[horizontal ? "height" : "width"], base: crossAvailable)
+            let alignment = box.layoutStyle["alignSelf"] as? String ?? style["alignItems"] as? String ?? "stretch"
+            let measured = horizontal ? box.measure(width: frames[index].0, stretch: true) : sizes[index]
+            let cross = min(crossAvailable, crossExplicit ?? (alignment == "stretch" ? crossAvailable : (horizontal ? measured.height : measured.width)))
             let offset = alignment == "center" ? (crossAvailable - cross) / 2 : alignment == "flex-end" ? crossAvailable - cross : 0
             box.frame = horizontal ? CGRect(x: left + frames[index].1, y: top + offset, width: frames[index].0, height: cross)
                 : CGRect(x: left + offset, y: top + frames[index].1, width: cross, height: frames[index].0)
             box.layoutSubtreeIfNeeded()
         }
+        for box in boxes where !box.isHidden && box.layoutStyle["position"] as? String == "absolute" {
+            let measured = box.measure(width: size.width)
+            let leading = dimension(box.layoutStyle["left"], base: size.width), trailing = dimension(box.layoutStyle["right"], base: size.width)
+            let above = dimension(box.layoutStyle["top"], base: size.height), below = dimension(box.layoutStyle["bottom"], base: size.height)
+            let width = dimension(box.layoutStyle["width"], base: size.width) ?? (leading != nil && trailing != nil ? max(0, size.width - leading! - trailing!) : measured.width)
+            let height = dimension(box.layoutStyle["height"], base: size.height) ?? (above != nil && below != nil ? max(0, size.height - above! - below!) : measured.height)
+            box.frame = CGRect(x: (leading ?? (trailing.map { size.width - $0 - width } ?? 0)), y: (above ?? (below.map { size.height - $0 - height } ?? 0)), width: width, height: height)
+            box.layoutSubtreeIfNeeded()
+        }
     }
-    func fitting(width: CGFloat) -> CGSize {
+    func fitting(width: CGFloat, stretchChildren: Bool = true) -> CGSize {
         let padding = number(style["padding"]) ?? 0
         let horizontalPadding = (number(style["paddingLeft"]) ?? number(style["paddingHorizontal"]) ?? padding) + (number(style["paddingRight"]) ?? number(style["paddingHorizontal"]) ?? padding)
         let verticalPadding = (number(style["paddingTop"]) ?? number(style["paddingVertical"]) ?? padding) + (number(style["paddingBottom"]) ?? number(style["paddingVertical"]) ?? padding)
-        let visible = boxes.filter { !$0.isHidden && $0.kind != "Modal" }
-        let sizes = visible.map { $0.measure(width: max(0, width - horizontalPadding)) }
+        let visible = boxes.filter { !$0.isHidden && $0.kind != "Modal" && $0.layoutStyle["position"] as? String != "absolute" }
+        let available = max(0, width - horizontalPadding)
+        var sizes = visible.map { box in
+            let alignment = box.layoutStyle["alignSelf"] as? String ?? style["alignItems"] as? String ?? "stretch"
+            return box.measure(width: available, stretch: stretchChildren && style["flexDirection"] as? String != "row" && alignment == "stretch")
+        }
         let gaps = CGFloat(max(0, sizes.count - 1)) * (number(style["gap"]) ?? 0)
         if style["flexDirection"] as? String == "row" {
+            let items = visible.enumerated().map { index, box -> CraftMacFlex.Item in
+                let layout = box.layoutStyle
+                let grow = number(layout["flexGrow"]) ?? number(layout["flex"]) ?? 0
+                let basis = dimension(layout["flexBasis"], base: available) ?? (number(layout["flex"]) != nil ? 0 : sizes[index].width)
+                return .init(basis: Float(basis), grow: Float(grow), shrink: Float(number(layout["flexShrink"]) ?? (grow > 0 ? 1 : 0)), min: dimension(layout["minWidth"], base: available).map(Float.init) ?? .nan, max: dimension(layout["maxWidth"], base: available).map(Float.init) ?? .nan, start: 0, end: 0)
+            }
+            let frames = CraftMacFlex.layout(items, available: available, gap: number(style["gap"]) ?? 0, justify: "flex-start")
+            sizes = visible.enumerated().map { index, box in box.measure(width: frames[index].0, stretch: stretchChildren) }
             return CGSize(width: sizes.reduce(0) { $0 + $1.width } + horizontalPadding + gaps, height: (sizes.map(\.height).max() ?? 0) + verticalPadding)
         }
-        return CGSize(width: (sizes.map(\.width).max() ?? 0) + horizontalPadding, height: sizes.reduce(0) { $0 + $1.height } + verticalPadding + gaps)
+        let margins = visible.reduce(CGFloat(0)) { total, box in
+            let layout = box.layoutStyle
+            let margin = number(layout["marginVertical"]) ?? number(layout["margin"]) ?? 0
+            return total + (number(layout["marginTop"]) ?? margin) + (number(layout["marginBottom"]) ?? margin)
+        }
+        return CGSize(width: (sizes.map(\.width).max() ?? 0) + horizontalPadding, height: sizes.reduce(0) { $0 + $1.height } + verticalPadding + gaps + margins)
     }
 }
 
@@ -134,12 +176,23 @@ final class CraftMacBox: NSView, NSTextFieldDelegate, NSTextViewDelegate {
     var imageSource = ""
     var scrollKey = ""
     var modal: NSPanel?
+    var material: NSVisualEffectView?
+    var edgeBorders: [String: CALayer] = [:]
+    var componentRoot: CraftMacBox? { props["data-stx-component-wrapper"] != nil && flow?.boxes.count == 1 && flow?.boxes.first?.kind != "Modal" ? flow?.boxes.first : nil }
+    var layoutStyle: [String: Any] {
+        guard let child = componentRoot else { return style }
+        let keys = ["width", "height", "minWidth", "minHeight", "maxWidth", "maxHeight", "flex", "flexGrow", "flexShrink", "flexBasis", "alignSelf", "position", "left", "right", "top", "bottom", "margin", "marginTop", "marginRight", "marginBottom", "marginLeft", "marginHorizontal", "marginVertical"]
+        var result = style
+        for key in keys where result[key] == nil { result[key] = child.layoutStyle[key] }
+        return result
+    }
     override var isFlipped: Bool { true }
 
     init(id: String, kind: String, renderer: CraftMacRenderer) {
         self.id = id; self.kind = kind; self.renderer = renderer
         super.init(frame: .zero)
         wantsLayer = true
+        clipsToBounds = true
         setAccessibilityElement(false)
         switch kind {
         case "Text":
@@ -171,12 +224,13 @@ final class CraftMacBox: NSView, NSTextFieldDelegate, NSTextViewDelegate {
             let text = NSTextField(labelWithString: "Unsupported native control: \(kind)"); control = text
             renderer.runtime.errors.append("Unsupported native control: \(kind)")
         }
-        if let control { addSubview(control) }
+        if let control { control.clipsToBounds = true; addSubview(control) }
     }
     required init?(coder: NSCoder) { fatalError("Native controls are created from STX") }
 
     func configure(_ node: [String: Any]) {
         props = node["props"] as? [String: Any] ?? [:]
+        flow?.componentScope = props["data-stx-component-wrapper"] != nil
         style = node["style"] as? [String: Any] ?? [:]
         events = node["events"] as? [String: String] ?? [:]
         isHidden = style["display"] as? String == "none" || props["hidden"] as? Bool == true
@@ -186,6 +240,22 @@ final class CraftMacBox: NSView, NSTextFieldDelegate, NSTextViewDelegate {
         }
         layer?.cornerRadius = number(style["borderRadius"]) ?? 0
         layer?.borderWidth = number(style["borderWidth"]) ?? 0
+        // AppKit views may draw their entire visibleRect, which can extend
+        // through adjacent panes on newer macOS releases. Native controls
+        // stay inside their authored boxes unless overflow is explicit.
+        clipsToBounds = style["overflow"] as? String != "visible"
+        if let container = control as? CraftMacFlow { container.clipsToBounds = clipsToBounds }
+        layer?.masksToBounds = clipsToBounds || (number(style["borderRadius"]) ?? 0) > 0
+        for edge in ["Top", "Right", "Bottom", "Left"] {
+            let border = edgeBorders[edge] ?? CALayer()
+            if edgeBorders[edge] == nil { edgeBorders[edge] = border; layer?.addSublayer(border) }
+            border.backgroundColor = CraftMacColor.parse(style["borderColor"], fallback: .separatorColor).cgColor
+            border.isHidden = (number(style["border\(edge)Width"]) ?? 0) <= 0
+        }
+        if let name = props["material"] as? String {
+            if material == nil { let effect = NSVisualEffectView(); effect.blendingMode = .behindWindow; effect.state = .followsWindowActiveState; addSubview(effect, positioned: .below, relativeTo: control); material = effect }
+            material?.material = name == "sidebar" ? .sidebar : .headerView
+        } else { material?.removeFromSuperview(); material = nil }
         alphaValue = number(style["opacity"]) ?? 1
         let identifier = props["testID"] as? String ?? props["testId"] as? String ?? props["accessibilityIdentifier"] as? String ?? id
         control?.setAccessibilityIdentifier(identifier)
@@ -204,12 +274,18 @@ final class CraftMacBox: NSView, NSTextFieldDelegate, NSTextViewDelegate {
             text.lineBreakMode = text.maximumNumberOfLines == 1 ? .byTruncatingTail : .byWordWrapping
         }
         if let button = control as? NSButton {
-            button.title = props["title"] as? String ?? nativeText(node)
+            let title = props["title"] as? String ?? nativeText(node)
+            button.title = props["iconOnly"] as? Bool == true ? "" : title
+            button.setAccessibilityLabel(label ?? title)
             button.font = font
+            button.alignment = style["textAlign"] as? String == "left" ? .left : style["textAlign"] as? String == "right" ? .right : .center
             button.isEnabled = props["disabled"] as? Bool != true
             if kind == "Switch" || kind == "Checkbox" { button.state = (props["value"] as? Bool ?? props["checked"] as? Bool ?? false) ? .on : .off }
             button.bezelStyle = props["variant"] as? String == "toolbar" ? .texturedRounded : .rounded
+            button.isBordered = !["toolbar", "ghost"].contains(props["variant"] as? String ?? "")
+            button.contentTintColor = CraftMacColor.parse(style["color"], fallback: .controlAccentColor)
             if let symbol = props["symbol"] as? String { button.image = NSImage(systemSymbolName: symbol, accessibilityDescription: button.title); button.imagePosition = button.title.isEmpty ? .imageOnly : .imageLeading }
+            if button.image != nil { button.symbolConfiguration = NSImage.SymbolConfiguration(pointSize: number(style["fontSize"]) ?? 16, weight: .regular) }
             if props["variant"] as? String == "primary" { button.bezelColor = .controlAccentColor }
             if props["variant"] as? String == "danger" { button.contentTintColor = .systemRed }
         }
@@ -261,6 +337,12 @@ final class CraftMacBox: NSView, NSTextFieldDelegate, NSTextViewDelegate {
         }
         let value = props["value"] as? String ?? ""
         if let text = (control as? NSScrollView)?.documentView as? NSTextView {
+            if let scroll = control as? NSScrollView {
+                let bordered = props["bordered"] as? Bool ?? true
+                scroll.borderType = bordered ? .bezelBorder : .noBorder
+                scroll.drawsBackground = bordered
+                text.drawsBackground = bordered
+            }
             if text.string != value { text.string = value }
             text.isEditable = props["disabled"] as? Bool != true; text.font = font
             if let editor = text as? CraftMacTextView { editor.placeholder = props["placeholder"] as? String ?? ""; editor.needsDisplay = true }
@@ -270,6 +352,7 @@ final class CraftMacBox: NSView, NSTextFieldDelegate, NSTextViewDelegate {
             if field.stringValue != value { field.stringValue = value }
             field.placeholderString = props["placeholder"] as? String
             field.font = font; field.isEnabled = props["disabled"] as? Bool != true
+            if let bordered = props["bordered"] as? Bool { field.isBordered = bordered; field.drawsBackground = bordered }
             field.setAccessibilityIdentifier(props["testID"] as? String ?? props["testId"] as? String ?? id)
         }
     }
@@ -289,26 +372,35 @@ final class CraftMacBox: NSView, NSTextFieldDelegate, NSTextViewDelegate {
         }; imageTask?.resume()
     }
 
-    func measure(width: CGFloat) -> CGSize {
+    var textPadding: NSEdgeInsets {
+        let all = number(style["padding"]) ?? 0
+        let horizontal = number(style["paddingHorizontal"]) ?? all
+        let vertical = number(style["paddingVertical"]) ?? all
+        return NSEdgeInsets(top: number(style["paddingTop"]) ?? vertical, left: number(style["paddingLeft"]) ?? horizontal, bottom: number(style["paddingBottom"]) ?? vertical, right: number(style["paddingRight"]) ?? horizontal)
+    }
+    func measure(width: CGFloat, stretch: Bool = false) -> CGSize {
         if isHidden { return .zero }
+        if let child = componentRoot { return child.measure(width: width, stretch: stretch) }
         let specifiedWidth = dimension(style["width"], base: width)
         let limit = min(specifiedWidth ?? width, dimension(style["maxWidth"], base: width) ?? width)
         var size = CGSize(width: limit, height: 0)
         if let text = control as? NSTextField, kind == "Text" {
-            let rect = (text.stringValue as NSString).boundingRect(with: CGSize(width: max(1, limit - 6), height: 1_000_000), options: [.usesLineFragmentOrigin, .usesFontLeading], attributes: [.font: text.font ?? NSFont.systemFont(ofSize: 13)])
-            size = CGSize(width: min(limit, ceil(rect.width) + 6), height: max(18, ceil(rect.height) + 2))
+            let rect = (text.stringValue as NSString).boundingRect(with: CGSize(width: max(1, limit - 6 - textPadding.left - textPadding.right), height: 1_000_000), options: [.usesLineFragmentOrigin, .usesFontLeading], attributes: [.font: text.font ?? NSFont.systemFont(ofSize: 13)])
+            size = CGSize(width: min(limit, ceil(rect.width) + 6 + textPadding.left + textPadding.right), height: max(18, ceil(rect.height) + 2))
+            if text.maximumNumberOfLines > 0 { size.height = min(size.height, ceil((text.font?.ascender ?? 13) - (text.font?.descender ?? -3) + (text.font?.leading ?? 0)) * CGFloat(text.maximumNumberOfLines) + 2) }
             if text.maximumNumberOfLines == 1 { size.height = max(18, (text.font?.pointSize ?? 13) + 5) }
+            size.height += textPadding.top + textPadding.bottom
         } else if kind == "ScrollView" || kind == "FlatList" || kind == "Sidebar" { size = CGSize(width: limit, height: 100) }
         else if kind == "Icon" { size = CGSize(width: 18, height: 18) }
         else if kind == "Image" || kind == "Video" { size = CGSize(width: limit, height: 160) }
         else if kind == "TextInput" { size = CGSize(width: limit, height: props["multiline"] as? Bool == true ? 48 : 28) }
         else if let control = control as? NSControl { size = control.intrinsicContentSize; size.width = max(24, size.width); size.height = max(26, size.height) }
-        else if let flow { size = flow.fitting(width: limit) }
-        size.width = specifiedWidth ?? min(limit, size.width)
+        else if let flow { size = flow.fitting(width: limit, stretchChildren: false) }
+        size.width = specifiedWidth ?? (flow != nil && stretch ? limit : min(limit, size.width))
         if let maximum = dimension(style["maxWidth"], base: width) { size.width = min(size.width, maximum) }
         // A naturally sized column can be narrower than its measurement limit.
         // Measure its wrapped children again at the width it will actually get.
-        if let flow, style["flexDirection"] as? String != "row" {
+        if let flow, !(control is NSScrollView), style["flexDirection"] as? String != "row" {
             size.height = flow.fitting(width: size.width).height
         }
         size.height = dimension(style["height"], base: 1000) ?? size.height
@@ -318,9 +410,27 @@ final class CraftMacBox: NSView, NSTextFieldDelegate, NSTextViewDelegate {
         return size
     }
     override func layout() {
+        CATransaction.begin(); CATransaction.setDisableActions(true)
+        defer { CATransaction.commit() }
         super.layout()
-        control?.frame = bounds
-        if let scroll = control as? NSScrollView {
+        layer?.cornerRadius = min(number(style["borderRadius"]) ?? 0, min(bounds.width, bounds.height) / 2)
+        if kind == "Text" {
+            let padding = textPadding
+            control?.frame = CGRect(x: padding.left, y: padding.top, width: max(0, bounds.width - padding.left - padding.right), height: max(0, bounds.height - padding.top - padding.bottom))
+        } else { control?.frame = bounds }
+        material?.frame = bounds
+        for (edge, border) in edgeBorders {
+            let thickness = number(style["border\(edge)Width"]) ?? 0
+            switch edge {
+            case "Top": border.frame = CGRect(x: 0, y: 0, width: bounds.width, height: thickness)
+            case "Bottom": border.frame = CGRect(x: 0, y: bounds.height - thickness, width: bounds.width, height: thickness)
+            case "Left": border.frame = CGRect(x: 0, y: 0, width: thickness, height: bounds.height)
+            default: border.frame = CGRect(x: bounds.width - thickness, y: 0, width: thickness, height: bounds.height)
+            }
+        }
+        if let child = componentRoot {
+            child.frame = bounds; child.layoutSubtreeIfNeeded()
+        } else if let scroll = control as? NSScrollView {
             if let flow {
                 let width = scroll.contentSize.width
                 flow.frame = CGRect(x: 0, y: 0, width: width, height: max(scroll.contentSize.height, flow.fitting(width: width).height))
@@ -364,8 +474,8 @@ final class CraftMacSidebarRow: NSTableRowView {
 }
 
 final class CraftMacSidebar: NSScrollView, NSOutlineViewDataSource, NSOutlineViewDelegate {
-    final class Item { let id: String; let label: String; let icon: String; let badge: String; let children: [Item]
-        init(_ raw: [String: Any]) { id = raw["id"] as? String ?? ""; label = raw["label"] as? String ?? raw["header"] as? String ?? ""; icon = raw["icon"] as? String ?? ""; badge = raw["badge"].map { $0 is NSNull ? "" : String(describing: $0) } ?? ""; children = (raw["items"] as? [[String: Any]] ?? []).map(Item.init) }
+    final class Item { let id: String; let label: String; let icon: String; let badge: String; let color: NSColor; let children: [Item]
+        init(_ raw: [String: Any]) { id = raw["id"] as? String ?? ""; label = raw["label"] as? String ?? raw["header"] as? String ?? ""; icon = raw["icon"] as? String ?? ""; badge = raw["badge"].map { $0 is NSNull ? "" : String(describing: $0) } ?? ""; color = CraftMacColor.parse(raw["color"], fallback: .controlAccentColor); children = (raw["items"] as? [[String: Any]] ?? []).map(Item.init) }
     }
     weak var box: CraftMacBox?
     let outline = NSOutlineView()
@@ -375,7 +485,7 @@ final class CraftMacSidebar: NSScrollView, NSOutlineViewDataSource, NSOutlineVie
         self.box = box; super.init(frame: .zero)
         hasVerticalScroller = true; drawsBackground = false
         let column = NSTableColumn(identifier: NSUserInterfaceItemIdentifier("label")); outline.addTableColumn(column); outline.outlineTableColumn = column
-        outline.headerView = nil; outline.style = .plain; outline.backgroundColor = .windowBackgroundColor
+        outline.headerView = nil; outline.style = .plain; outline.backgroundColor = .clear
         outline.rowSizeStyle = .default; outline.indentationPerLevel = 0
         outline.dataSource = self; outline.delegate = self; outline.autoresizesOutlineColumn = true; documentView = outline
     }
@@ -402,12 +512,14 @@ final class CraftMacSidebar: NSScrollView, NSOutlineViewDataSource, NSOutlineVie
     }
     func outlineView(_ outlineView: NSOutlineView, viewFor tableColumn: NSTableColumn?, item: Any) -> NSView? {
         let item = item as! Item
-        let cell = NSTableCellView(); let label = NSTextField(labelWithString: item.label + (item.badge.isEmpty ? "" : "  \(item.badge)"))
+        let cell = NSTableCellView(); let label = NSTextField(labelWithString: item.label)
         label.font = NSFont.systemFont(ofSize: 13); label.lineBreakMode = .byTruncatingTail; cell.textField = label; cell.addSubview(label)
         if !item.children.isEmpty { label.font = NSFont.systemFont(ofSize: 11, weight: .semibold); label.textColor = .secondaryLabelColor }
         label.translatesAutoresizingMaskIntoConstraints = false
-        NSLayoutConstraint.activate([label.leadingAnchor.constraint(equalTo: cell.leadingAnchor, constant: item.icon.isEmpty ? 4 : 27), label.trailingAnchor.constraint(equalTo: cell.trailingAnchor, constant: -6), label.centerYAnchor.constraint(equalTo: cell.centerYAnchor)])
-        if !item.icon.isEmpty { let image = NSImageView(image: NSImage(systemSymbolName: item.icon, accessibilityDescription: nil) ?? NSImage()); image.frame = CGRect(x: 4, y: 7, width: 18, height: 18); cell.imageView = image; cell.addSubview(image) }
+        let badge = NSTextField(labelWithString: item.badge); badge.font = NSFont.systemFont(ofSize: 11); badge.textColor = .secondaryLabelColor
+        badge.translatesAutoresizingMaskIntoConstraints = false; badge.setContentHuggingPriority(.required, for: .horizontal); cell.addSubview(badge)
+        NSLayoutConstraint.activate([label.leadingAnchor.constraint(equalTo: cell.leadingAnchor, constant: item.icon.isEmpty ? 16 : 39), label.trailingAnchor.constraint(lessThanOrEqualTo: badge.leadingAnchor, constant: -8), label.centerYAnchor.constraint(equalTo: cell.centerYAnchor), badge.trailingAnchor.constraint(equalTo: cell.trailingAnchor, constant: -16), badge.centerYAnchor.constraint(equalTo: cell.centerYAnchor)])
+        if !item.icon.isEmpty { let image = NSImageView(image: NSImage(systemSymbolName: item.icon, accessibilityDescription: nil) ?? NSImage()); image.contentTintColor = item.color; image.frame = CGRect(x: 16, y: 8, width: 16, height: 16); cell.imageView = image; cell.addSubview(image) }
         cell.setAccessibilityIdentifier(item.id); cell.setAccessibilityLabel(item.label)
         return cell
     }
@@ -426,6 +538,8 @@ final class CraftMacRenderer {
     var sheets: [String: NSPanel] = [:]
     init(runtime: CraftMacRuntime) { self.runtime = runtime }
     func render(_ document: [String: Any]) {
+        CATransaction.begin(); CATransaction.setDisableActions(true)
+        defer { CATransaction.commit() }
         var retained = Set<String>()
         var scrolls: [(CraftMacBox, CGPoint, Bool)] = []
         for box in boxes.values { if let scroll = box.control as? NSScrollView, box.kind != "Sidebar" {
@@ -473,7 +587,8 @@ final class CraftMacRenderer {
             guard let scroll = box.control as? NSScrollView, box.kind != "TextInput" else { continue }
             let key = box.props["scrollKey"] as? String ?? ""
             let changed = key != box.scrollKey; box.scrollKey = key
-            let y = (bottom || changed) && box.props["autoScrollBottom"] as? Bool == true ? max(0, (scroll.documentView?.frame.height ?? 0) - scroll.contentSize.height) : origin.y
+            let maximum = max(0, (scroll.documentView?.frame.height ?? 0) - scroll.contentSize.height)
+            let y = (bottom || changed) && box.props["autoScrollBottom"] as? Bool == true ? maximum : min(maximum, max(0, origin.y))
             scroll.contentView.scroll(to: CGPoint(x: origin.x, y: y)); scroll.reflectScrolledClipView(scroll.contentView)
         }
         root.needsLayout = true

package/dist/types.d.ts

@@ -558,6 +558,8 @@ export interface AppConfig {
      * Path to Craft binary (auto-detected if not provided)
      */
     craftPath?: string;
+    /** macOS webview apps may omit the separate headless scripting engine. */
+    runtimeProfile?: 'full' | 'webview';
     /**
      * Suppress all non-error output from the native binary.
      * When true, the binary runs with --quiet and stdio is piped.

package/package.json

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