@pix3/cli 1.6.3 → 2.0.0-alpha.0

package/templates/recipe-grid-3d/files/scripts/ScoreHud.ts

@@ -1,94 +0,0 @@
-/**
- * ScoreHud — signal-driven HUD. Display only, no game logic.
- *
- * Listens on `sourceNode` (the node carrying `GameRules`) for:
- *   `score-changed` (score)
- *   `lives-changed` (lives, maxLives)
- *   `time-changed`  (seconds)
- *
- * If a HUD widget is missing from the scene it is quietly skipped, so you can
- * delete the timer or the lives bar without touching any script.
- */
-import { Bar2D, Label2D, Script, type PropertySchema } from '@pix3/runtime';
-
-export class ScoreHud extends Script {
-  constructor(id: string, type: string) {
-    super(id, type);
-    this.config = {
-      // Node that emits the HUD signals (the GameRules host).
-      sourceNode: 'game-root',
-      scoreLabel: 'score-label',
-      scoreFormat: 'SCORE {value}',
-      timeLabel: 'time-label',
-      timeFormat: '{value}',
-      livesBar: 'lives-bar',
-    };
-  }
-
-  static getPropertySchema(): PropertySchema {
-    const str = (name: string, label: string, description?: string) => ({
-      name,
-      type: 'string' as const,
-      ui: { label, group: 'HUD', description },
-      getValue: (s: unknown) => (s as ScoreHud).config[name],
-      setValue: (s: unknown, v: unknown) => {
-        (s as ScoreHud).config[name] = typeof v === 'string' ? v : '';
-      },
-    });
-
-    return {
-      nodeType: 'ScoreHud',
-      properties: [
-        str('sourceNode', 'Source Node', 'Node that emits score-changed / lives-changed / time-changed'),
-        str('scoreLabel', 'Score Label'),
-        str('scoreFormat', 'Score Format', '{value} is replaced by the score'),
-        str('timeLabel', 'Time Label'),
-        str('timeFormat', 'Time Format', '{value} is replaced by whole seconds'),
-        str('livesBar', 'Lives Bar'),
-      ],
-      groups: { HUD: { label: 'HUD', expanded: true } },
-    };
-  }
-
-  onStart(): void {
-    const source = this.findNode(String(this.config.sourceNode ?? ''));
-    if (!source) {
-      console.warn(`[ScoreHud] Source node "${this.config.sourceNode}" not found.`);
-      return;
-    }
-    source.connect('score-changed', this, (...args: unknown[]) => this.setScore(Number(args[0]) || 0));
-    source.connect('time-changed', this, (...args: unknown[]) => this.setTime(Number(args[0]) || 0));
-    source.connect('lives-changed', this, (...args: unknown[]) =>
-      this.setLives(Number(args[0]) || 0, Number(args[1]) || 0)
-    );
-    // Ask for the opening values now that the listeners are live: GameRules
-    // starts before this HUD (parent components tick before children).
-    source.emit('hud-ready');
-  }
-
-  private setScore(score: number): void {
-    const label = this.findNode(String(this.config.scoreLabel ?? ''));
-    if (label instanceof Label2D) {
-      label.setText(String(this.config.scoreFormat ?? '{value}').replace('{value}', String(Math.round(score))));
-    }
-  }
-
-  private setTime(seconds: number): void {
-    const label = this.findNode(String(this.config.timeLabel ?? ''));
-    if (label instanceof Label2D) {
-      label.setText(
-        String(this.config.timeFormat ?? '{value}').replace('{value}', String(Math.max(0, Math.ceil(seconds))))
-      );
-    }
-  }
-
-  private setLives(lives: number, maxLives: number): void {
-    const bar = this.findNode(String(this.config.livesBar ?? ''));
-    if (bar instanceof Bar2D) {
-      if (maxLives > 0) {
-        bar.maxValue = maxLives;
-      }
-      bar.setValue(lives);
-    }
-  }
-}

package/templates/recipe-grid-3d/template.yaml

@@ -1,10 +0,0 @@
-id: recipe-grid-3d
-title: Grid 3D
-description: A solid block of cubes you carve by tapping — clear every cube except the hidden core ones. Voxel carving, 3D minesweeper, layer puzzles, tap-to-mine.
-projectType: 3d
-targetPlatform: mobile
-viewport: { width: 1080, height: 1920 }
-# The build/full-run entry scene (Project Settings → Default Export Scene Path).
-# The menu boots first; PLAY transitions to main.pix3scene (the board).
-entryScene: scenes/menu.pix3scene
-order: 63

package/templates/recipe-tapper-2d/files/README.md

@@ -1,39 +0,0 @@
-# Tapper 2D
-
-A playable skeleton: objects fall into the field, tapping them is the whole
-game, one bad type punishes, and a countdown ends the run. It plays as
-shipped — press play in `scenes/main.pix3scene` before changing anything.
-
-**`design/recipe.md` is the contract.** Stable node ids, tunables with ranges,
-extension points and what must not be renamed. Read it first.
-
-## Layout
-
-```
-scenes/menu.pix3scene       entry / export scene — PLAY transitions to the game
-scenes/main.pix3scene       the GAME (editor startup scene — iterate here)
-scenes/ui/result.pix3scene  win/lose overlay, instanced into main hidden (editor-only)
-scenes/prefabs/*.pix3scene  what the spawners instantiate
-scripts/Spawner.ts          timed instantiate + drift + despawn
-scripts/TouchRules.ts       a tap → semantic signals
-scripts/ScoreHud.ts         signals → HUD widgets
-scripts/GameRules.ts        score / lives / timer / win / lose / end flow
-scripts/MenuFlow.ts         menu PLAY button
-sprites/ph-*.png            near-white placeholders (tinted via core:tint)
-```
-
-Same script names and roles as the other recipes — `Spawner`, `TouchRules`,
-`ScoreHud`, `GameRules` mean the same thing everywhere, only their contact
-source differs (here: a pointer-down hit-test instead of a proximity test).
-
-## The rule that keeps it workable
-
-One file, one responsibility, 70–140 lines. Small files can be edited
-surgically; monoliths get rewritten wholesale and lose the changes that were
-already working. When you add a mechanic, add a script.
-
-```
-TouchRules --touch-scored/touch-damaged--> GameRules --score-changed--> ScoreHud
-                                                     --lives-changed-->
-                                                     --time-changed-->
-```

package/templates/recipe-tapper-2d/files/design/recipe.md

@@ -1,132 +0,0 @@
-# Recipe: recipe-tapper-2d
-
-## What this is
-
-Objects fall into a field; tapping them is the whole game. One "bad" type
-punishes instead of scoring. A countdown ends the run and a target score decides
-win or lose. Playable before any edit.
-
-Same script names and roles as the other recipes — `Spawner`, `TouchRules`,
-`ScoreHud`, `GameRules` — so what you learn here transfers.
-
-## Node map
-
-| id | what |
-| --- | --- |
-| `game-root` | root; hosts `GameRules` + `TouchRules`; all HUD signals emitted here |
-| `game-background` | full-screen `ColorRect2D` (palette background) |
-| `board` | the field (`Group2D`) |
-| `board-floor` | the field's visible plate |
-| `spawner-targets` | spawn band for tappable things; hosts `Spawner` |
-| `spawner-hazards` | spawn band for the bad type; hosts `Spawner` |
-| `hud` | `CanvasLayer2D` overlay, hosts `ScoreHud` |
-| `score-label` / `time-label` / `lives-bar` / `menu-button` | HUD |
-| `result-overlay` / `result-label` / `retry-button` | end screen in `scenes/ui/result.pix3scene`, instanced into main hidden (`visible: false` is editor-only) |
-
-Signals: `TouchRules` emits `touch-scored` / `touch-damaged` on `game-root`;
-`GameRules` answers `score-changed`, `lives-changed`, `time-changed`,
-`game-won` / `game-lost`.
-
-## Placeholders
-
-Near-white PNGs carrying a `core:tint` effect: set `effects[0].params.color` and
-the multiply gives you that palette colour.
-
-| role | file | node/prefab |
-| --- | --- | --- |
-| collectible | `sprites/ph-target.png` | `prefabs/target.pix3scene` |
-| threat | `sprites/ph-hazard.png` | `prefabs/hazard.pix3scene` |
-
-## Tunables
-
-```yaml
-tunables:
-  targetRate: { node: spawner-targets, component: "user:Spawner", property: intervalSec, min: 0.05, max: 20, default: 0.85 }
-  targetMaxAlive: { node: spawner-targets, component: "user:Spawner", property: maxAlive, min: 1, max: 200, default: 8 }
-  targetFallSpeed: { node: spawner-targets, component: "user:Spawner", property: driftY, min: -3000, max: 3000, default: -230 }
-  targetLifetime: { node: spawner-targets, component: "user:Spawner", property: lifetimeSec, min: 0, max: 120, default: 8 }
-  hazardRate: { node: spawner-hazards, component: "user:Spawner", property: intervalSec, min: 0.05, max: 20, default: 2.2 }
-  hazardFallSpeed: { node: spawner-hazards, component: "user:Spawner", property: driftY, min: -3000, max: 3000, default: -260 }
-  tapRadius: { node: game-root, component: "user:TouchRules", property: tapRadius, min: 0, max: 400, default: 40 }
-  missPenalty: { node: game-root, component: "user:TouchRules", property: missPenalty, min: 0, max: 10, default: 0 }
-  touchRules: { node: game-root, component: "user:TouchRules", property: rules, default: "target:score:1;hazard:damage:1" }
-  winMode: { node: game-root, component: "user:GameRules", property: winMode, default: time }
-  targetScore: { node: game-root, component: "user:GameRules", property: targetScore, min: 1, max: 99999, default: 18 }
-  timeLimitSec: { node: game-root, component: "user:GameRules", property: timeLimitSec, min: 0, max: 600, default: 30 }
-  startingLives: { node: game-root, component: "user:GameRules", property: startingLives, min: 1, max: 20, default: 3 }
-  bgColor: { node: game-background, property: color, default: "#141a2e" }
-  boardColor: { node: board-floor, property: color, default: "#1d2743" }
-```
-
-`component` present → `set_component_property`; absent → `set_property`. The
-schema clamps out-of-range values rather than rejecting them.
-
-## Extension points
-
-- **Popping instead of falling (whack-a-mole).** Set `targetFallSpeed: 0` and
-  `targetLifetime` to ~1.2 s: things appear in place and vanish if not tapped.
-  Set `gridSnap` on the spawner (e.g. 220) and raise `spawnHeight` to get a mole
-  grid instead of a band.
-- **Combos / multipliers.** A new script on `hud` that listens for
-  `touch-scored` on `game-root`, counts hits inside a time window, and adds
-  only the **extra** points: `game-root.emit('touch-scored', amount * (m - 1), x, y)`
-  under a re-entrancy guard (`if (this.emitting) return; this.emitting = true;
-  try { emit(...) } finally { this.emitting = false; }`). `GameRules` already
-  counted the base `amount` and needs no change. Show the multiplier through a
-  signal of its own (`combo-changed`), never through `touch-scored`.
-  **The trap:** a listener on `touch-scored` that emits `touch-scored` on the
-  same node is called again by its own emit — without the guard, the first tap
-  recurses until the stack overflows (and re-emitting the *full* amount would
-  double-count the base). No offline check sees it: `pix3 check` and
-  `pix3 smoke` are green, because smoke taps nothing. Say so, and have the human
-  tap three targets in a row.
-- **A third type.** Copy a prefab, give its `core:Hitbox2D` a new group, add a
-  node with a third `Spawner` (`create_node` + `add_component`), and append
-  `<group>:score:5` to `touchRules`.
-- **Punish misses.** Raise `missPenalty` — a tap that hits nothing then costs a
-  life, which turns a relaxed collector into a precision game.
-- **Sudden death.** `startingLives: 1`, or `winMode: survive` with a longer
-  `timeLimitSec` so surviving the clock is the win.
-
-Replacing a whole script the list above names is expected: use `fs_write` with
-`overwrite: true` and a short `reason` (the size guard only blocks *silent*
-wholesale rewrites).
-
-## Ending a run belongs to GameRules
-
-The result overlay and RETRY are **owned by `GameRules`**: it hides the overlay on
-start and keeps `retry-button` **disabled**, then `finish(won)` shows the overlay,
-writes the result text, enables RETRY and freezes the `freezeNodes` subtrees
-(every component on them and on what they spawned). For a custom
-win/lose condition call `finish(true|false)` on that component — do NOT show the
-overlay yourself. A hand-rolled ending leaves RETRY on screen with its handler bound
-and `enabled: false`, i.e. a button that can never be pressed (`game_observe` reports
-`control: { enabled: false }`; that is the tell).
-
-## Do not touch
-
-- The node ids above (rename `name`, never `id`), and the signal names.
-- Component config on a **prefab instance** — the editor locks it. Prefabs carry
-  fixed defaults only (their hitbox group); tunables live on plain nodes in
-  `main.pix3scene`.
-- The prefab hitbox groups must stay in sync with `touchRules`; the group is the
-  only thing that separates "good" from "bad".
-
-## Playtest contract
-
-terminalVisual: static
-terminalRestartRoutine: terminal-retry
-
-After the result overlay appears, the screen should remain still until RETRY. The
-playtest samples five rendered frames at 15-frame intervals after the terminal
-phase has held for 120 frames. The `terminal-retry` routine physically taps RETRY
-and checks that the game returns to its playing phase.
-
-## Verify
-
-1. `play_start` on `scenes/main.pix3scene`.
-2. After ~2 s, children exist under `spawner-targets` and are falling.
-3. `game_input` a tap on one of them → it disappears, `score-label` climbs, and
-   the punch-scale fires.
-4. Tap three hazards → `lives-bar` empties and `result-overlay` shows
-   `GAME OVER`; `retry-button` restarts the scene.

package/templates/recipe-tapper-2d/files/design/tests/reachability.json

@@ -1,4 +0,0 @@
-{
-  "version": 1,
-  "proven": []
-}

package/templates/recipe-tapper-2d/files/design/tests/routines/terminal-retry.json

@@ -1,23 +0,0 @@
-{
-  "name": "terminal-retry",
-  "description": "From the result screen, physically tap RETRY and check that play resumes.",
-  "scope": "scenes/main.pix3scene",
-  "params": {},
-  "uses": ["result-overlay", "retry-button"],
-  "steps": [
-    {
-      "type": "tap",
-      "target": "retry-button",
-      "holdMs": 200,
-      "why": "A real pointer press proves the button is visible, enabled and reachable."
-    },
-    {
-      "type": "wait",
-      "frames": 30,
-      "why": "Let the scene transition finish before reading the new game's phase."
-    }
-  ],
-  "expect": [
-    { "kind": "gameState", "path": "phase", "op": "eq", "value": "playing" }
-  ]
-}

package/templates/recipe-tapper-2d/files/scenes/main.pix3scene

@@ -1,269 +0,0 @@
-# Pix3 Scene File (YAML)
-# Tapper 2D — the GAME scene, and the editor's startup scene: iterate here.
-# A full build boots the MENU (menu.pix3scene), whose PLAY transitions here.
-#
-# Objects fall into the board; tapping them is the whole game. A tap is
-# hit-tested (scripts/TouchRules.ts) against the `core:Hitbox2D` group each
-# prefab carries: `target` scores, `hazard` costs a life.
-#
-# Stable node ids (design/recipe.md is the contract — do not rename these):
-#   game-root, game-background, board, spawner-targets, spawner-hazards,
-#   hud, score-label, time-label, lives-bar, menu-button,
-#   result-overlay, result-label, retry-button (scenes/ui/result.pix3scene)
-#
-# Full-screen UI lives in its own file under scenes/ui/ and is instanced here
-# hidden (`visible: false` = editor only), so opening this scene shows the game
-# rather than a GAME OVER card.
-#
-# 2D coordinates: origin at the canvas centre, X right, Y UP. Node order in the
-# tree is paint order (later/deeper draws on top).
-version: 1.0.0
-metadata:
-  author: Pix3 Recipe
-  description: Tapper gameplay — falling objects, tap the good ones, avoid the bad
-root:
-  - id: game-root
-    type: Group2D
-    name: Game Root
-    properties:
-      width: 1080
-      height: 1920
-      layout:
-        enabled: true
-        horizontalAlign: stretch
-        verticalAlign: stretch
-    components:
-      - id: game-rules
-        type: user:GameRules
-        enabled: true
-        config:
-          winMode: time
-          targetScore: 18
-          timeLimitSec: 30
-          startingLives: 3
-          resultNode: result-overlay
-          resultLabel: result-label
-          winText: "YOU WIN!"
-          loseText: "GAME OVER"
-          retryButton: retry-button
-          menuButton: menu-button
-          menuScene: res://scenes/menu.pix3scene
-          gameScene: res://scenes/main.pix3scene
-          freezeNodes: spawner-targets,spawner-hazards
-      - id: touch-rules
-        type: user:TouchRules
-        enabled: true
-        config:
-          rules: "target:score:1;hazard:damage:1"
-          tapRadius: 40
-          missPenalty: 0
-          consume: true
-          scoreSound: ""
-          damageSound: ""
-    children:
-      - id: game-background
-        type: ColorRect2D
-        name: Game Background
-        properties:
-          width: 1080
-          height: 1920
-          color: "#141a2e"
-          transform:
-            position: [0, 0]
-            scale: [1, 1]
-            rotation: 0
-          layout:
-            enabled: true
-            horizontalAlign: stretch
-            verticalAlign: stretch
-        children: []
-      - id: board
-        type: Group2D
-        name: Board
-        properties:
-          width: 980
-          height: 1480
-          transform:
-            position: [0, -80]
-            scale: [1, 1]
-            rotation: 0
-        children:
-          - id: board-floor
-            type: ColorRect2D
-            name: Board Floor
-            properties:
-              width: 980
-              height: 1480
-              color: "#1d2743"
-              transform:
-                position: [0, 0]
-                scale: [1, 1]
-                rotation: 0
-            children: []
-          - id: spawner-targets
-            type: Group2D
-            name: Spawner Targets
-            properties:
-              width: 900
-              height: 60
-              transform:
-                position: [0, 690]
-                scale: [1, 1]
-                rotation: 0
-            components:
-              - id: target-spawner
-                type: user:Spawner
-                enabled: true
-                config:
-                  prefab: res://scenes/prefabs/target.pix3scene
-                  parentNode: ""
-                  intervalSec: 0.85
-                  intervalJitter: 0.3
-                  maxAlive: 8
-                  spawnWidth: 820
-                  spawnHeight: 60
-                  gridSnap: 0
-                  driftX: 0
-                  driftY: -230
-                  lifetimeSec: 8
-                  despawnRadius: 1450
-                  startDelaySec: 0.3
-            children: []
-          - id: spawner-hazards
-            type: Group2D
-            name: Spawner Hazards
-            properties:
-              width: 900
-              height: 60
-              transform:
-                position: [0, 690]
-                scale: [1, 1]
-                rotation: 0
-            components:
-              - id: hazard-spawner
-                type: user:Spawner
-                enabled: true
-                config:
-                  prefab: res://scenes/prefabs/hazard.pix3scene
-                  parentNode: ""
-                  intervalSec: 2.2
-                  intervalJitter: 0.8
-                  maxAlive: 5
-                  spawnWidth: 820
-                  spawnHeight: 60
-                  gridSnap: 0
-                  driftX: 0
-                  driftY: -260
-                  lifetimeSec: 8
-                  despawnRadius: 1450
-                  startDelaySec: 1.5
-            children: []
-      - id: hud
-        type: CanvasLayer2D
-        name: HUD
-        properties:
-          width: 1080
-          height: 1920
-          layout:
-            enabled: true
-            horizontalAlign: stretch
-            verticalAlign: stretch
-        components:
-          - id: score-hud
-            type: user:ScoreHud
-            enabled: true
-            config:
-              sourceNode: game-root
-              scoreLabel: score-label
-              scoreFormat: "SCORE {value}"
-              timeLabel: time-label
-              timeFormat: "{value}"
-              livesBar: lives-bar
-        children:
-          - id: score-label
-            type: Label2D
-            name: Score Label
-            properties:
-              label: "SCORE 0"
-              labelFontSize: 44
-              labelColor: "#ffffff"
-              labelAlign: left
-              transform:
-                position: [-340, 850]
-                scale: [1, 1]
-                rotation: 0
-              layout:
-                enabled: true
-                horizontalAlign: left
-                verticalAlign: top
-            children: []
-          - id: time-label
-            type: Label2D
-            name: Time Label
-            properties:
-              label: "30"
-              labelFontSize: 44
-              labelColor: "#f5ae39"
-              labelAlign: center
-              transform:
-                position: [0, 850]
-                scale: [1, 1]
-                rotation: 0
-              layout:
-                enabled: true
-                horizontalAlign: center
-                verticalAlign: top
-            children: []
-          - id: lives-bar
-            type: Bar2D
-            name: Lives Bar
-            properties:
-              width: 240
-              height: 28
-              minValue: 0
-              maxValue: 3
-              value: 3
-              barColor: "#ff4d6d"
-              backBackgroundColor: "#2a3352"
-              showBorder: false
-              transform:
-                position: [340, 855]
-                scale: [1, 1]
-                rotation: 0
-              layout:
-                enabled: true
-                horizontalAlign: right
-                verticalAlign: top
-            children: []
-          - id: menu-button
-            type: Button2D
-            name: Menu Button
-            properties:
-              width: 200
-              height: 72
-              label: "MENU"
-              labelFontSize: 30
-              labelColor: "#ffffff"
-              backgroundColor: "#2a3352"
-              hoverColor: "#3a446b"
-              pressedColor: "#1d2743"
-              buttonAction: back-to-menu
-              transform:
-                position: [-400, -880]
-                scale: [1, 1]
-                rotation: 0
-              layout:
-                enabled: true
-                horizontalAlign: left
-                verticalAlign: bottom
-            children: []
-          # Win/lose screen — authored in scenes/ui/result.pix3scene so this
-          # scene opens on the GAME, not on a GAME OVER card. `visible: false`
-          # hides it in the EDITOR only; `initiallyVisible` (in the overlay
-          # file) is what play mode reads, and GameRules reveals it on the
-          # win/lose transition. Tick the eye to preview it over the field.
-          - id: result-overlay
-            name: Result Overlay
-            instance: res://scenes/ui/result.pix3scene
-            properties:
-              visible: false

package/templates/recipe-tapper-2d/files/scenes/menu.pix3scene

@@ -1,100 +0,0 @@
-# Pix3 Scene File (YAML)
-# Tapper 2D — the MENU scene. This is the project's ENTRY / export scene
-# (Project Settings → Default Export Scene Path): a full build and "Play Game (Entry Scene)"
-# boot here. PLAY transitions to the game scene (main.pix3scene) via a fade.
-# Wired by scripts/MenuFlow.ts. Iterate on the GAME in main.pix3scene.
-version: 1.0.0
-metadata:
-  author: Pix3 Recipe
-  description: Menu scene — entry point; PLAY transitions to the game
-root:
-  - id: menu-root
-    type: Group2D
-    name: Menu Root
-    properties:
-      width: 1080
-      height: 1920
-      layout:
-        enabled: true
-        horizontalAlign: stretch
-        verticalAlign: stretch
-    components:
-      - id: menu-flow
-        type: user:MenuFlow
-        enabled: true
-        config:
-          gameScene: res://scenes/main.pix3scene
-          playButton: play-button
-    children:
-      - id: menu-background
-        type: ColorRect2D
-        name: Menu Background
-        properties:
-          width: 1080
-          height: 1920
-          color: "#141a2e"
-          transform:
-            position: [0, 0]
-            scale: [1, 1]
-            rotation: 0
-          layout:
-            enabled: true
-            horizontalAlign: stretch
-            verticalAlign: stretch
-        children: []
-      - id: title-label
-        type: Label2D
-        name: Title Label
-        properties:
-          label: "{{PROJECT_NAME}}"
-          labelFontSize: 96
-          labelColor: "#ffffff"
-          labelAlign: center
-          transform:
-            position: [0, 420]
-            scale: [1, 1]
-            rotation: 0
-          layout:
-            enabled: true
-            horizontalAlign: center
-            verticalAlign: center
-        children: []
-      - id: subtitle-label
-        type: Label2D
-        name: Subtitle Label
-        properties:
-          label: "TAP FAST. MISS NOTHING."
-          labelFontSize: 40
-          labelColor: "#93a3c9"
-          labelAlign: center
-          transform:
-            position: [0, 300]
-            scale: [1, 1]
-            rotation: 0
-          layout:
-            enabled: true
-            horizontalAlign: center
-            verticalAlign: center
-        children: []
-      - id: play-button
-        type: Button2D
-        name: Play Button
-        properties:
-          width: 480
-          height: 140
-          label: "PLAY"
-          labelFontSize: 56
-          labelColor: "#141a2e"
-          backgroundColor: "#f5ae39"
-          hoverColor: "#ffc862"
-          pressedColor: "#d4922a"
-          buttonAction: play
-          transform:
-            position: [0, -60]
-            scale: [1, 1]
-            rotation: 0
-          layout:
-            enabled: true
-            horizontalAlign: center
-            verticalAlign: center
-        children: []