@astryxdesign/native 0.0.0-stage → 0.7.5-canary.0026f37

package/LICENSE

@@ -0,0 +1,21 @@
+MIT License
+
+Copyright (c) 2026 Meta Platforms, Inc.
+
+Permission is hereby granted, free of charge, to any person obtaining a copy
+of this software and associated documentation files (the "Software"), to deal
+in the Software without restriction, including without limitation the rights
+to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
+copies of the Software, and to permit persons to whom the Software is
+furnished to do so, subject to the following conditions:
+
+The above copyright notice and this permission notice shall be included in all
+copies or substantial portions of the Software.
+
+THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
+IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
+FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
+AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
+LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
+OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
+SOFTWARE.

package/README.md

@@ -1,3 +1,233 @@
-# Temporary Holding Version
+# @astryxdesign/native
 
-This version is a temporary placeholder for this package. An operational version to replace this has been submitted for review and is awaiting a staged release.
+> **Experimental. Canary only.** This package is published only under the
+> `@canary` dist-tag and is never released as a stable version. Its APIs change
+> without notice. Nothing here is supported for production apps.
+
+`@astryxdesign/native` is where Astryx experiments with native platforms
+(iOS, Android, macOS, Windows) under AST-082 (Native-first surfaces). The
+experiment compares ways of building Astryx components on each platform and
+measures them against the same scorecard, so the decision for each platform
+rests on evidence.
+
+## What is here today
+
+| Part           | Path                              | What it does                                                                                                                                                                                                                                 |
+| -------------- | --------------------------------- | -------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- |
+| Contracts      | `src/contract/`                   | Reads a core component's documentation and splits its props into a portable **core contract** and a **web-only** part, with a reason for each web-only prop. Checks prop names against Swift and Kotlin keywords and platform toolkit names. |
+| Platform types | `@astryxdesign/native/components` | TypeScript props per platform, chosen by type-resolution condition: `ios`, `android`, `macos`, `windows`, or `shared` for the core contract only.                                                                                            |
+| Swift binding  | `apple/`                          | A Swift package with props generated from the same contracts. iOS and macOS props sit behind `#if os(...)`.                                                                                                                                  |
+| Native theme   | `defineNativeTheme`               | Durable theme intent (`material: 'opaque' \| 'translucent'`) plus platform entries scoped by OS version, such as Liquid Glass from iOS 26. Never sets tokens.                                                                                |
+| Icons          | `NATIVE_ICON_DEFAULTS`            | Astryx's built-in icon names mapped to SF Symbols on Apple platforms and Material Symbols on Android.                                                                                                                                        |
+| Wire           | `AstryxNode`, `AstryxAction`      | Each component as JSON a TypeScript core sends a native host (arm C), and the action a host sends back when a view calls a callback. Swift decodes `<Name>Node` and turns it into `<Name>Props` with `viewProps(send:)`.                     |
+| Logic core     | `@astryxdesign/native/logic`      | `createLogicCore` holds a screen's state, builds its node tree, and reduces actions; `connectBridge` carries it to a native host as JSON. ECMAScript built-ins only, so it runs in Hermes. Shaped after EJ Campbell's astryx-swift spike.    |
+| Logic host     | `AstryxLogicHost` (Swift)         | Runs a logic core bundle in JavaScriptCore, decodes each tree into `AstryxNode`, and sends views' actions back. A Hermes host speaks the same bridge.                                                                                        |
+
+Contracts cover Badge, Button, Card, Divider, Heading, HStack, ProgressBar,
+Selector, Switch, Text, TextInput, and VStack. React Native and Android
+bindings are not built yet; see [the experiment matrix](#experiment-matrix).
+
+```ts
+// tsconfig.json for an iOS app: "customConditions": ["ios"]
+import type {SelectorProps} from '@astryxdesign/native/components';
+
+const props: SelectorProps = {
+  label: 'Shipping',
+  options: [{value: 'standard', label: 'Standard'}],
+  menuStyle: 'pullDown', // iOS-only prop; an Android build rejects it
+};
+```
+
+How core documentation becomes a contract:
+
+- A callback whose arguments are values followed by the DOM event that caused
+  them, such as `(checked: boolean, e: ChangeEvent) => void`, keeps the values
+  in the core; the event stays on the web.
+- A callback that carries only an event stays on the web, unless the component
+  names it in `callbacks`, as Button does for `onClick`. Its core form takes no
+  arguments. A callback with an event before a value stays on the web either
+  way.
+- Free-form content becomes a typed slot only where a component declares one
+  in `slots`; `text` is a string, as for a badge's label or a heading's words,
+  and `content` is child Astryx components, as for a stack's or a card's
+  children. A SwiftUI view takes content as a view builder, so `<Name>Props`
+  leaves it out; `<Name>Node` carries it as child nodes.
+- A closed set of numbers, such as a heading level, is a Swift enum with raw
+  values.
+- A core prop may share a platform toolkit's name only when the component
+  declares in `sameMeaning` that it means the same thing there.
+
+### The wire (arm C)
+
+A TypeScript core sends a tree of nodes and receives actions. A node lists the
+callbacks the core listens to in `events`; a view gets only those callbacks.
+
+```ts
+// tsconfig: "customConditions": ["ios"]
+import type {AstryxAction, AstryxNode} from '@astryxdesign/native/components';
+
+const screen: AstryxNode = {
+  component: 'VStack',
+  key: 'root',
+  props: {
+    gap: 2,
+    children: [
+      {
+        component: 'Switch',
+        key: 'wifi',
+        props: {label: 'Wi-Fi', value: true},
+        events: ['onChange'],
+      },
+    ],
+  },
+};
+// What the host sends back when the switch is turned off:
+const action: AstryxAction = {
+  key: 'wifi',
+  component: 'Switch',
+  event: 'onChange',
+  args: [false],
+};
+```
+
+```swift
+let host = AstryxLogicHost(bundle: bundleSource) // calls the bundle's global astryxStart(host)
+if case .switch(let wifi) = host.root {
+  let props = wifi.viewProps(send: host.send)
+}
+```
+
+```ts
+// tsconfig: "customConditions": ["ios"]
+import type {AstryxAction, AstryxNode} from '@astryxdesign/native/components';
+import {connectBridge, createLogicCore} from '@astryxdesign/native/logic';
+import type {Bridge, BridgeHost} from '@astryxdesign/native/logic';
+
+const core = createLogicCore<{wifi: boolean}, AstryxNode, AstryxAction>({
+  initial: {wifi: true},
+  view: state => ({
+    component: 'Switch',
+    key: 'wifi',
+    props: {label: 'Wi-Fi', value: state.wifi},
+    events: ['onChange'],
+  }),
+  reduce: (state, action) =>
+    action.component === 'Switch' && action.event === 'onChange'
+      ? {wifi: action.args[0]}
+      : state,
+});
+// The bundle's entry: the native host calls it with its two calls in and
+// gets back the bridge it reads snapshots from and dispatches actions to.
+(globalThis as {astryxStart?: (host: BridgeHost) => Bridge}).astryxStart =
+  host => connectBridge(core, host);
+```
+
+## Working on it
+
+```sh
+pnpm -F @astryxdesign/native typecheck        # source and tests
+pnpm -F @astryxdesign/native build            # dist/, including platform types
+pnpm -F @astryxdesign/native typecheck:types  # every platform's types, after build
+pnpm -F @astryxdesign/native generate:apple   # regenerate apple/Sources/.../Generated
+pnpm vitest run --project node packages/native
+```
+
+Generated Swift is committed so a Swift package can pin a commit. A test fails
+when it drifts from the contracts.
+
+**Cleanup needed.** Committing the generated Swift
+(`apple/Sources/AstryxNative/Generated`) is temporary. It is there only because
+Swift Package Manager installs a package from a git commit and cannot run the
+Node generator. The intended replacement: CI generates the Swift files and
+publishes them to a Swift-only branch or tag that apps pin, and the generated
+files are ignored on `main`.
+
+Boundaries, checked by `pnpm check:package-boundaries`:
+
+- `@astryxdesign/core` never imports this package.
+- No file in this package, in any folder, imports core, apart from the
+  build-time reads AST-082 FR16 lists until core's portable entry ships: the
+  theme generator in `scripts/` may import `@astryxdesign/core/theme` and
+  `@astryxdesign/core/theme/tokens`; `scripts/swift-ios-strings.mjs` may
+  read core's locale catalogs (`@astryxdesign/core/locales/*.json`); and
+  `scripts/core-docs.mjs` reads core's component documentation and built-in
+  icon names as data.
+- The check reads source text in every folder except `node_modules`, `dist`,
+  `.build`, and `.swiftpm`. It flags any other module specifier that names
+  core (`import`, `require`, `require.resolve`, `import.meta.resolve`, or a
+  relative path into `packages/core`). It also flags a path to core's package,
+  written as adjacent string segments (`'@astryxdesign', 'core'`,
+  `'node_modules', '@astryxdesign/core'`, `'packages', 'core'`) or inside one
+  string (`node_modules/@astryxdesign/core`, `packages/core`). In
+  `scripts/core-docs.mjs` it allows exactly one such path, the `CORE_ROOT`
+  definition, and only the listed reads under `CORE_ROOT`. It does not follow
+  paths computed in other ways.
+
+## Experiment matrix
+
+Every arm runs the same subjects on the same devices and is scored against a
+**reference**: the same screens hand-built with the platform toolkit (SwiftUI,
+Jetpack Compose, WinUI).
+
+| Arm                       | How components are built                                                                 | iOS | Android | macOS | Windows |
+| ------------------------- | ---------------------------------------------------------------------------------------- | --- | ------- | ----- | ------- |
+| A. Pure native            | Platform views (SwiftUI, Compose, WinUI) on generated contracts                          | ✓   | ✓       | ✓     | ✓       |
+| B. React Native           | React Native components; desktop through `react-native-macos` and `react-native-windows` | ✓   | ✓       | ✓     | ✓       |
+| C. Shared logic core      | Component logic in TypeScript running in Hermes, driving platform views                  | ✓   | ✓       | ✓     | —       |
+| D. Web on native          | Web React components through a native renderer, such as Expo's experimental fork         | ✓   | ✓       | —     | —       |
+| E. Web in a desktop shell | Astryx's web components unchanged inside Electron                                        | —   | —       | ✓     | ✓       |
+
+Arms D and E are measured but cannot become required runtimes as written:
+arm D depends on a third-party fork and arm E on Electron, a third-party
+runtime (AST-082 FR13). Arm E is the baseline for how far plain web gets on
+desktop.
+
+### Test subjects
+
+Templates come first because their web version is a known reference for
+content and states.
+
+1. **Wave 1:** `checkout-wizard` (forms, stepper, pickers, validation, keyboard),
+   `table-inbox` (long list, row actions, search, compose sheet), `dashboard`
+   (charts, tables, scrolling).
+2. **Wave 2:** `settings`, `kanban-board`, `ai-chat`, `product-detail`.
+3. **Component flows:** Selector, text entry, dialog and sheet, list with row
+   actions.
+
+Each subject has one scripted interaction that every arm replays.
+
+Visual scores come from real screens. Every scripted step is captured as a
+screenshot on the device, every behavior (sheet open and dismiss, navigation
+transitions, gestures, scrolling, press feedback, keyboard) as a short video or
+GIF, and every scenario as a recording, for each arm, the
+reference, and the web version, in light and dark and at the largest text size.
+Reviewers compare captures side by side with arm names hidden, and pixel checks
+read colors and sizes from the captures, never from source.
+
+### Metrics
+
+| Area            | Measure                        | How                                                                                                                                                                                                           | Unit                  |
+| --------------- | ------------------------------ | ------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- | --------------------- |
+| Gate            | Required runtimes              | Dependency manifest against FR13                                                                                                                                                                              | pass/fail             |
+| Gate            | Screen-reader parity           | VoiceOver, TalkBack, Narrator task script                                                                                                                                                                     | pass/fail             |
+| Gate            | Completeness                   | Every subject renders every state                                                                                                                                                                             | pass/fail             |
+| Experience      | Platform feel                  | Blind reviewer rating of captured screens and recordings against the reference, plus a platform-conventions checklist                                                                                         | score, % of checklist |
+| Experience      | Behavior and motion            | Blind reviewer rating of behavior videos against the reference: timing, easing, gesture response, interruptibility                                                                                            | score per behavior    |
+| Experience      | Time to adopt a new OS feature | Days from OS release to shipping it in the arm (for example, Liquid Glass)                                                                                                                                    | days                  |
+| Performance     | Startup to first content       | Release build, cold start, median of runs                                                                                                                                                                     | ms                    |
+| Performance     | Smoothness                     | Dropped frames during the scripted interaction                                                                                                                                                                | % frames              |
+| Performance     | Input latency                  | Touch or key to visible response                                                                                                                                                                              | ms                    |
+| Performance     | Memory and size                | Peak memory during the script; app download size                                                                                                                                                              | MB                    |
+| Maintenance     | Change cost                    | Time to ship one real Astryx change on the arm (a new prop, a new token)                                                                                                                                      | hours                 |
+| Developer speed | Iteration                      | Edit to visible on device                                                                                                                                                                                     | seconds               |
+| Developer speed | Sharing                        | Share of app code reused across platforms                                                                                                                                                                     | % lines               |
+| Design          | Brand preservation             | Blind designer review of whether the brand is recognizable from the web version while the screen still feels native, plus pixel checks on the captures for the theme's color, type, shape, spacing, and icons | score, % token checks |
+| Fidelity        | Match to web                   | Content and states matching the web template                                                                                                                                                                  | % checks              |
+
+### Judging
+
+1. An arm that fails a gate is out for that platform.
+2. The remaining arms are compared per platform, each measure relative to the
+   reference on the same device.
+3. Whether the measures are weighted into one score or ranked side by side is
+   not decided yet.

package/apple/Package.swift

@@ -0,0 +1,18 @@
+// swift-tools-version: 6.0
+// Copyright (c) Meta Platforms, Inc. and affiliates.
+
+// Experimental Astryx for Apple platforms (AST-082). The contract types under
+// Sources/AstryxNative/Generated are generated by `pnpm generate:apple`; do not
+// edit them by hand.
+
+import PackageDescription
+
+let package = Package(
+  name: "AstryxNative",
+  platforms: [.iOS(.v17), .macOS(.v14)],
+  products: [.library(name: "AstryxNative", targets: ["AstryxNative"])],
+  targets: [
+    .target(name: "AstryxNative", path: "Sources/AstryxNative"),
+    .testTarget(name: "AstryxNativeTests", dependencies: ["AstryxNative"], path: "Tests/AstryxNativeTests"),
+  ]
+)

package/apple/Sources/AstryxNative/Generated/AstryxBase.swift

@@ -0,0 +1,12 @@
+// Generated by @astryxdesign/native. Do not edit.
+public enum AstryxBaseTarget: String, Sendable { case root, trigger, control, container }
+
+/// Base props shared by every platform (AST-082 FR7).
+public struct AstryxBaseProps: Equatable, Codable, Sendable {
+  public var id: String?
+  public var isHidden: Bool?
+  public init(id: String? = nil, isHidden: Bool? = nil) {
+    self.id = id
+    self.isHidden = isHidden
+  }
+}

package/apple/Sources/AstryxNative/Generated/AstryxNode.swift

@@ -0,0 +1,69 @@
+// Generated by @astryxdesign/native. Do not edit.
+import Foundation
+
+#if os(iOS) || os(macOS)
+/// One Astryx component in a tree a TypeScript core sends, by its `component` name.
+/// A node this binding cannot read decodes as `unsupported`: an unknown component,
+/// or a known one with a value its enums lack or a required prop missing. An older
+/// app then keeps drawing the rest of a newer core's tree.
+public enum AstryxNode: Decodable, Equatable, Sendable {
+  case badge(BadgeNode)
+  case button(ButtonNode)
+  case card(CardNode)
+  case divider(DividerNode)
+  case heading(HeadingNode)
+  case hStack(HStackNode)
+  case progressBar(ProgressBarNode)
+  case selector(SelectorNode)
+  case `switch`(SwitchNode)
+  case text(TextNode)
+  case textInput(TextInputNode)
+  case vStack(VStackNode)
+  case unsupported(component: String, key: String)
+
+  public var key: String {
+    switch self {
+    case .badge(let node): return node.key
+    case .button(let node): return node.key
+    case .card(let node): return node.key
+    case .divider(let node): return node.key
+    case .heading(let node): return node.key
+    case .hStack(let node): return node.key
+    case .progressBar(let node): return node.key
+    case .selector(let node): return node.key
+    case .`switch`(let node): return node.key
+    case .text(let node): return node.key
+    case .textInput(let node): return node.key
+    case .vStack(let node): return node.key
+    case .unsupported(_, let key): return key
+    }
+  }
+
+  private enum Keys: String, CodingKey { case component, key }
+
+  public init(from decoder: any Decoder) throws {
+    let container = try decoder.container(keyedBy: Keys.self)
+    let component = try container.decode(String.self, forKey: .component)
+    let key = try container.decode(String.self, forKey: .key)
+    do {
+      switch component {
+      case "Badge": self = .badge(try BadgeNode(from: decoder))
+      case "Button": self = .button(try ButtonNode(from: decoder))
+      case "Card": self = .card(try CardNode(from: decoder))
+      case "Divider": self = .divider(try DividerNode(from: decoder))
+      case "Heading": self = .heading(try HeadingNode(from: decoder))
+      case "HStack": self = .hStack(try HStackNode(from: decoder))
+      case "ProgressBar": self = .progressBar(try ProgressBarNode(from: decoder))
+      case "Selector": self = .selector(try SelectorNode(from: decoder))
+      case "Switch": self = .`switch`(try SwitchNode(from: decoder))
+      case "Text": self = .text(try TextNode(from: decoder))
+      case "TextInput": self = .textInput(try TextInputNode(from: decoder))
+      case "VStack": self = .vStack(try VStackNode(from: decoder))
+      default: self = .unsupported(component: component, key: key)
+      }
+    } catch {
+      self = .unsupported(component: component, key: key)
+    }
+  }
+}
+#endif

package/apple/Sources/AstryxNative/Generated/AstryxWire.swift

@@ -0,0 +1,67 @@
+// Generated by @astryxdesign/native. Do not edit.
+import Foundation
+
+/// A JSON value: a portable callback argument on its way to the core.
+public enum AstryxValue: Codable, Equatable, Sendable {
+  case null
+  case bool(Bool)
+  case number(Double)
+  case string(String)
+  case array([AstryxValue])
+  case object([String: AstryxValue])
+
+  /// Any portable value (a contract's strings, numbers, enums, and records) as JSON.
+  public init<T: Encodable>(_ value: T) {
+    guard let data = try? JSONEncoder().encode(value),
+          let decoded = try? JSONDecoder().decode(AstryxValue.self, from: data) else {
+      self = .null
+      return
+    }
+    self = decoded
+  }
+
+  public init(from decoder: any Decoder) throws {
+    let container = try decoder.singleValueContainer()
+    if container.decodeNil() { self = .null }
+    else if let value = try? container.decode(Bool.self) { self = .bool(value) }
+    else if let value = try? container.decode(Double.self) { self = .number(value) }
+    else if let value = try? container.decode(String.self) { self = .string(value) }
+    else if let value = try? container.decode([AstryxValue].self) { self = .array(value) }
+    else { self = .object(try container.decode([String: AstryxValue].self)) }
+  }
+
+  public func encode(to encoder: any Encoder) throws {
+    var container = encoder.singleValueContainer()
+    switch self {
+    case .null: try container.encodeNil()
+    case .bool(let value): try container.encode(value)
+    case .number(let value): try container.encode(value)
+    case .string(let value): try container.encode(value)
+    case .array(let value): try container.encode(value)
+    case .object(let value): try container.encode(value)
+    }
+  }
+}
+
+/// A callback a view called: which node, which prop, and its arguments.
+public struct AstryxAction: Codable, Equatable, Sendable {
+  public let key: String
+  public let component: String
+  public let event: String
+  public let args: [AstryxValue]
+
+  public init(key: String, component: String, event: String, args: [AstryxValue]) {
+    self.key = key
+    self.component = component
+    self.event = event
+    self.args = args
+  }
+
+  /// The JSON the core receives.
+  public var json: String {
+    let encoder = JSONEncoder()
+    encoder.outputFormatting = [.sortedKeys, .withoutEscapingSlashes]
+    guard let data = try? encoder.encode(self) else { return "{}" }
+    return String(decoding: data, as: UTF8.self)
+  }
+}

package/apple/Sources/AstryxNative/Generated/Badge.swift

@@ -0,0 +1,89 @@
+// Generated by @astryxdesign/native. Do not edit.
+public enum BadgeVariant: String, CaseIterable, Codable, Sendable {
+  case neutral = "neutral"
+  case info = "info"
+  case success = "success"
+  case warning = "warning"
+  case error = "error"
+  case blue = "blue"
+  case cyan = "cyan"
+  case green = "green"
+  case orange = "orange"
+  case pink = "pink"
+  case purple = "purple"
+  case red = "red"
+  case teal = "teal"
+  case yellow = "yellow"
+}
+#if os(iOS)
+public struct BadgeProps {
+  /// Base props attach to this part on every platform.
+  public static let baseTarget: AstryxBaseTarget = .root
+  public var base: AstryxBaseProps
+  public var variant: BadgeVariant?
+  public var label: String
+  public init(variant: BadgeVariant? = nil, label: String, base: AstryxBaseProps = AstryxBaseProps()) {
+    self.variant = variant
+    self.label = label
+    self.base = base
+  }
+}
+public struct BadgeNode: Decodable, Equatable, Sendable {
+  public struct Props: Decodable, Equatable, Sendable {
+    public var variant: BadgeVariant?
+    public var label: String
+  }
+  public let key: String
+  public let base: AstryxBaseProps?
+  public let props: Props
+  /// The callbacks the core listens to, by prop name.
+  public let events: [String]?
+
+  public func listens(_ event: String) -> Bool { events?.contains(event) ?? false }
+
+  /// The contract a Badge view takes; its callbacks send actions to the core.
+  public func viewProps(send: @escaping @Sendable (AstryxAction) -> Void) -> BadgeProps {
+    return BadgeProps(
+      variant: props.variant,
+      label: props.label,
+      base: base ?? AstryxBaseProps()
+    )
+  }
+}
+#endif
+#if os(macOS)
+public struct BadgeProps {
+  /// Base props attach to this part on every platform.
+  public static let baseTarget: AstryxBaseTarget = .root
+  public var base: AstryxBaseProps
+  public var variant: BadgeVariant?
+  public var label: String
+  public init(variant: BadgeVariant? = nil, label: String, base: AstryxBaseProps = AstryxBaseProps()) {
+    self.variant = variant
+    self.label = label
+    self.base = base
+  }
+}
+public struct BadgeNode: Decodable, Equatable, Sendable {
+  public struct Props: Decodable, Equatable, Sendable {
+    public var variant: BadgeVariant?
+    public var label: String
+  }
+  public let key: String
+  public let base: AstryxBaseProps?
+  public let props: Props
+  /// The callbacks the core listens to, by prop name.
+  public let events: [String]?
+
+  public func listens(_ event: String) -> Bool { events?.contains(event) ?? false }
+
+  /// The contract a Badge view takes; its callbacks send actions to the core.
+  public func viewProps(send: @escaping @Sendable (AstryxAction) -> Void) -> BadgeProps {
+    return BadgeProps(
+      variant: props.variant,
+      label: props.label,
+      base: base ?? AstryxBaseProps()
+    )
+  }
+}
+#endif

package/apple/Sources/AstryxNative/Generated/Button.swift

@@ -0,0 +1,154 @@
+// Generated by @astryxdesign/native. Do not edit.
+public enum ButtonVariant: String, CaseIterable, Codable, Sendable {
+  case primary = "primary"
+  case secondary = "secondary"
+  case ghost = "ghost"
+  case destructive = "destructive"
+}
+public enum ButtonSize: String, CaseIterable, Codable, Sendable {
+  case sm = "sm"
+  case md = "md"
+  case lg = "lg"
+}
+public enum ButtonElevation: String, CaseIterable, Codable, Sendable {
+  case none = "none"
+  case low = "low"
+  case med = "med"
+  case high = "high"
+}
+#if os(iOS)
+public struct ButtonProps {
+  /// Base props attach to this part on every platform.
+  public static let baseTarget: AstryxBaseTarget = .root
+  public var base: AstryxBaseProps
+  public var label: String
+  public var variant: ButtonVariant?
+  public var size: ButtonSize?
+  public var elevation: ButtonElevation?
+  public var isLoading: Bool?
+  public var isInterruptible: Bool?
+  public var isDisabled: Bool?
+  public var tooltip: String?
+  public var onClick: (() -> Void)?
+  public var href: String?
+  public init(label: String, variant: ButtonVariant? = nil, size: ButtonSize? = nil, elevation: ButtonElevation? = nil, isLoading: Bool? = nil, isInterruptible: Bool? = nil, isDisabled: Bool? = nil, tooltip: String? = nil, onClick: (() -> Void)? = nil, href: String? = nil, base: AstryxBaseProps = AstryxBaseProps()) {
+    self.label = label
+    self.variant = variant
+    self.size = size
+    self.elevation = elevation
+    self.isLoading = isLoading
+    self.isInterruptible = isInterruptible
+    self.isDisabled = isDisabled
+    self.tooltip = tooltip
+    self.onClick = onClick
+    self.href = href
+    self.base = base
+  }
+}
+public struct ButtonNode: Decodable, Equatable, Sendable {
+  public struct Props: Decodable, Equatable, Sendable {
+    public var label: String
+    public var variant: ButtonVariant?
+    public var size: ButtonSize?
+    public var elevation: ButtonElevation?
+    public var isLoading: Bool?
+    public var isInterruptible: Bool?
+    public var isDisabled: Bool?
+    public var tooltip: String?
+    public var href: String?
+  }
+  public let key: String
+  public let base: AstryxBaseProps?
+  public let props: Props
+  /// The callbacks the core listens to, by prop name.
+  public let events: [String]?
+
+  public func listens(_ event: String) -> Bool { events?.contains(event) ?? false }
+
+  /// The contract a Button view takes; its callbacks send actions to the core.
+  public func viewProps(send: @escaping @Sendable (AstryxAction) -> Void) -> ButtonProps {
+    let key = self.key
+    return ButtonProps(
+      label: props.label,
+      variant: props.variant,
+      size: props.size,
+      elevation: props.elevation,
+      isLoading: props.isLoading,
+      isInterruptible: props.isInterruptible,
+      isDisabled: props.isDisabled,
+      tooltip: props.tooltip,
+      onClick: listens("onClick") ? { send(AstryxAction(key: key, component: "Button", event: "onClick", args: [])) } : nil,
+      href: props.href,
+      base: base ?? AstryxBaseProps()
+    )
+  }
+}
+#endif
+#if os(macOS)
+public struct ButtonProps {
+  /// Base props attach to this part on every platform.
+  public static let baseTarget: AstryxBaseTarget = .root
+  public var base: AstryxBaseProps
+  public var label: String
+  public var variant: ButtonVariant?
+  public var size: ButtonSize?
+  public var elevation: ButtonElevation?
+  public var isLoading: Bool?
+  public var isInterruptible: Bool?
+  public var isDisabled: Bool?
+  public var tooltip: String?
+  public var onClick: (() -> Void)?
+  public var href: String?
+  public init(label: String, variant: ButtonVariant? = nil, size: ButtonSize? = nil, elevation: ButtonElevation? = nil, isLoading: Bool? = nil, isInterruptible: Bool? = nil, isDisabled: Bool? = nil, tooltip: String? = nil, onClick: (() -> Void)? = nil, href: String? = nil, base: AstryxBaseProps = AstryxBaseProps()) {
+    self.label = label
+    self.variant = variant
+    self.size = size
+    self.elevation = elevation
+    self.isLoading = isLoading
+    self.isInterruptible = isInterruptible
+    self.isDisabled = isDisabled
+    self.tooltip = tooltip
+    self.onClick = onClick
+    self.href = href
+    self.base = base
+  }
+}
+public struct ButtonNode: Decodable, Equatable, Sendable {
+  public struct Props: Decodable, Equatable, Sendable {
+    public var label: String
+    public var variant: ButtonVariant?
+    public var size: ButtonSize?
+    public var elevation: ButtonElevation?
+    public var isLoading: Bool?
+    public var isInterruptible: Bool?
+    public var isDisabled: Bool?
+    public var tooltip: String?
+    public var href: String?
+  }
+  public let key: String
+  public let base: AstryxBaseProps?
+  public let props: Props
+  /// The callbacks the core listens to, by prop name.
+  public let events: [String]?
+
+  public func listens(_ event: String) -> Bool { events?.contains(event) ?? false }
+
+  /// The contract a Button view takes; its callbacks send actions to the core.
+  public func viewProps(send: @escaping @Sendable (AstryxAction) -> Void) -> ButtonProps {
+    let key = self.key
+    return ButtonProps(
+      label: props.label,
+      variant: props.variant,
+      size: props.size,
+      elevation: props.elevation,
+      isLoading: props.isLoading,
+      isInterruptible: props.isInterruptible,
+      isDisabled: props.isDisabled,
+      tooltip: props.tooltip,
+      onClick: listens("onClick") ? { send(AstryxAction(key: key, component: "Button", event: "onClick", args: [])) } : nil,
+      href: props.href,
+      base: base ?? AstryxBaseProps()
+    )
+  }
+}
+#endif