@almadar/std 16.241.0 → 16.242.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (109) hide show
  1. package/behaviors/behaviors-registry.json +4650 -535
  2. package/behaviors/lolo/agent/atoms/std-agent-memory.lolo +38 -1
  3. package/behaviors/lolo/agent/atoms/std-agent-session.lolo +1074 -47
  4. package/behaviors/lolo/agent/atoms/std-agent-tool-loop.lolo +8 -7
  5. package/behaviors/lolo/agent/organisms/std-agent-assistant.lolo +56 -37
  6. package/behaviors/lolo/infra/atoms/std-page-open.lolo +59 -0
  7. package/behaviors/lolo/infra/atoms/std-page-search.lolo +134 -0
  8. package/behaviors/lolo/infra/atoms/std-page-treat.lolo +59 -0
  9. package/behaviors/lolo/infra/atoms/std-page-watch.lolo +86 -0
  10. package/behaviors/lolo/ui/core/atoms/std-book-reader.lolo +25 -1
  11. package/behaviors/lolo/ui/core/atoms/std-card-grid.lolo +9 -0
  12. package/behaviors/lolo/ui/core/atoms/std-doc-page.lolo +153 -0
  13. package/behaviors/lolo/ui/learning/atoms/std-learn-arrangement.lolo +124 -92
  14. package/behaviors/lolo/ui/learning/atoms/std-learn-classify.lolo +114 -55
  15. package/behaviors/lolo/ui/learning/atoms/std-learn-compare.lolo +40 -14
  16. package/behaviors/lolo/ui/learning/atoms/std-learn-coupled-sim.lolo +363 -123
  17. package/behaviors/lolo/ui/learning/atoms/std-learn-derivation.lolo +93 -48
  18. package/behaviors/lolo/ui/learning/atoms/std-learn-diagram.lolo +60 -28
  19. package/behaviors/lolo/ui/learning/atoms/std-learn-doser.lolo +193 -96
  20. package/behaviors/lolo/ui/learning/atoms/std-learn-estimate.lolo +75 -32
  21. package/behaviors/lolo/ui/learning/atoms/std-learn-goal-seek.lolo +142 -86
  22. package/behaviors/lolo/ui/learning/atoms/std-learn-grid-sim.lolo +266 -98
  23. package/behaviors/lolo/ui/learning/atoms/std-learn-hotspot.lolo +103 -65
  24. package/behaviors/lolo/ui/learning/atoms/std-learn-live-sim.lolo +223 -109
  25. package/behaviors/lolo/ui/learning/atoms/std-learn-measure.lolo +232 -64
  26. package/behaviors/lolo/ui/learning/atoms/std-learn-param-explorer.lolo +69 -29
  27. package/behaviors/lolo/ui/learning/atoms/std-learn-perturb.lolo +363 -123
  28. package/behaviors/lolo/ui/learning/atoms/std-learn-predict.lolo +73 -41
  29. package/behaviors/lolo/ui/learning/atoms/std-learn-sample-accumulator.lolo +96 -38
  30. package/behaviors/lolo/ui/learning/atoms/std-learn-sandbox.lolo +65 -45
  31. package/behaviors/lolo/ui/learning/atoms/std-learn-scatter-fit.lolo +243 -117
  32. package/behaviors/lolo/ui/learning/atoms/std-learn-scenario.lolo +76 -28
  33. package/behaviors/lolo/ui/learning/atoms/std-learn-sim-3d.lolo +228 -109
  34. package/behaviors/lolo/ui/learning/atoms/std-learn-speed-drill.lolo +95 -44
  35. package/behaviors/lolo/ui/learning/atoms/std-learn-stepper.lolo +199 -125
  36. package/behaviors/lolo/ui/learning/atoms/std-learn-tour-3d.lolo +92 -48
  37. package/behaviors/lolo/ui/learning/atoms/std-learn-trace-player.lolo +239 -78
  38. package/behaviors/lolo/ui/learning/atoms/std-learn-transport.lolo +147 -38
  39. package/behaviors/lolo/ui/learning/atoms/std-learn-tree.lolo +123 -58
  40. package/behaviors/lolo/ui/learning/atoms/ui-algo-graph-canvas.lolo +22 -0
  41. package/behaviors/lolo/ui/learning/atoms/ui-algorithm-canvas.lolo +26 -0
  42. package/behaviors/lolo/ui/learning/atoms/ui-biology-canvas.lolo +26 -0
  43. package/behaviors/lolo/ui/learning/atoms/ui-chemistry-canvas.lolo +27 -1
  44. package/behaviors/lolo/ui/learning/atoms/ui-learning-canvas.lolo +27 -1
  45. package/behaviors/lolo/ui/learning/atoms/ui-math-canvas.lolo +29 -9
  46. package/behaviors/lolo/ui/learning/atoms/ui-physics-canvas.lolo +26 -0
  47. package/behaviors/lolo-behavior-contracts.json +1 -1
  48. package/behaviors/registry/agent/atoms/std-agent-memory.orb +372 -2
  49. package/behaviors/registry/agent/atoms/std-agent-session.orb +4752 -348
  50. package/behaviors/registry/agent/atoms/std-agent-tool-loop.orb +54 -42
  51. package/behaviors/registry/agent/organisms/std-agent-assistant.orb +356 -122
  52. package/behaviors/registry/factory-signatures.json +1 -1
  53. package/behaviors/registry/infra/atoms/std-page-open.orb +435 -0
  54. package/behaviors/registry/infra/atoms/std-page-search.orb +867 -0
  55. package/behaviors/registry/infra/atoms/std-page-treat.orb +494 -0
  56. package/behaviors/registry/infra/atoms/std-page-watch.orb +554 -0
  57. package/behaviors/registry/ui/core/atoms/std-book-reader.orb +119 -0
  58. package/behaviors/registry/ui/core/atoms/std-card-grid.orb +61 -0
  59. package/behaviors/registry/ui/core/atoms/std-doc-page.orb +594 -0
  60. package/behaviors/registry/ui/learning/atoms/std-learn-arrangement.orb +903 -369
  61. package/behaviors/registry/ui/learning/atoms/std-learn-classify.orb +1002 -232
  62. package/behaviors/registry/ui/learning/atoms/std-learn-compare.orb +253 -74
  63. package/behaviors/registry/ui/learning/atoms/std-learn-coupled-sim.orb +3624 -921
  64. package/behaviors/registry/ui/learning/atoms/std-learn-derivation.orb +685 -144
  65. package/behaviors/registry/ui/learning/atoms/std-learn-diagram.orb +404 -52
  66. package/behaviors/registry/ui/learning/atoms/std-learn-doser.orb +1787 -210
  67. package/behaviors/registry/ui/learning/atoms/std-learn-estimate.orb +699 -71
  68. package/behaviors/registry/ui/learning/atoms/std-learn-goal-seek.orb +1102 -578
  69. package/behaviors/registry/ui/learning/atoms/std-learn-grid-sim.orb +2760 -872
  70. package/behaviors/registry/ui/learning/atoms/std-learn-hotspot.orb +689 -152
  71. package/behaviors/registry/ui/learning/atoms/std-learn-live-sim.orb +1431 -633
  72. package/behaviors/registry/ui/learning/atoms/std-learn-measure.orb +2485 -512
  73. package/behaviors/registry/ui/learning/atoms/std-learn-param-explorer.orb +501 -197
  74. package/behaviors/registry/ui/learning/atoms/std-learn-perturb.orb +3642 -928
  75. package/behaviors/registry/ui/learning/atoms/std-learn-predict.orb +705 -125
  76. package/behaviors/registry/ui/learning/atoms/std-learn-sample-accumulator.orb +624 -114
  77. package/behaviors/registry/ui/learning/atoms/std-learn-sandbox.orb +405 -153
  78. package/behaviors/registry/ui/learning/atoms/std-learn-scatter-fit.orb +1911 -611
  79. package/behaviors/registry/ui/learning/atoms/std-learn-scenario.orb +436 -128
  80. package/behaviors/registry/ui/learning/atoms/std-learn-sim-3d.orb +2482 -485
  81. package/behaviors/registry/ui/learning/atoms/std-learn-speed-drill.orb +896 -192
  82. package/behaviors/registry/ui/learning/atoms/std-learn-stepper.orb +2001 -759
  83. package/behaviors/registry/ui/learning/atoms/std-learn-tour-3d.orb +734 -228
  84. package/behaviors/registry/ui/learning/atoms/std-learn-trace-player.orb +2501 -764
  85. package/behaviors/registry/ui/learning/atoms/std-learn-transport.orb +1591 -173
  86. package/behaviors/registry/ui/learning/atoms/std-learn-tree.orb +883 -122
  87. package/behaviors/registry/ui/learning/atoms/ui-algo-graph-canvas.orb +176 -0
  88. package/behaviors/registry/ui/learning/atoms/ui-algorithm-canvas.orb +211 -0
  89. package/behaviors/registry/ui/learning/atoms/ui-biology-canvas.orb +211 -0
  90. package/behaviors/registry/ui/learning/atoms/ui-chemistry-canvas.orb +212 -1
  91. package/behaviors/registry/ui/learning/atoms/ui-learning-canvas.orb +212 -1
  92. package/behaviors/registry/ui/learning/atoms/ui-math-canvas.orb +203 -9
  93. package/behaviors/registry/ui/learning/atoms/ui-physics-canvas.orb +211 -0
  94. package/behaviors/signatures.lolo +325 -655
  95. package/dist/behaviors/exports-reader.js +16092 -9747
  96. package/dist/behaviors/functions/index.d.ts +1052 -136
  97. package/dist/behaviors/functions/index.js +16063 -9745
  98. package/dist/behaviors/index.d.ts +1 -1
  99. package/dist/behaviors/index.js +16093 -9748
  100. package/dist/behaviors/query.js +16092 -9747
  101. package/dist/behaviors-embeddings.hash.json +3 -3
  102. package/dist/behaviors-embeddings.json +45 -25
  103. package/dist/behaviors-registry.json +4650 -535
  104. package/dist/index.d.ts +1 -1
  105. package/dist/index.js +16093 -9748
  106. package/dist/knob-embeddings.hash.json +3 -3
  107. package/dist/knob-embeddings.json +607 -263
  108. package/dist/registry/factory-signatures.json +1 -1
  109. package/package.json +3 -3
package/behaviors/registry/ui/learning/atoms/std-learn-sim-3d.orb CHANGED
@@ -1,5 +1,5 @@
1
1
  {
2
- "description": "Generic 3D simulation-transport (clock) instrument. Contract: the atom owns the transport and the clock but NOT the physics — Run/Pause/Reset plus a 0.5x/1x/2x/4x speed row drive a running flag and speed multiplier, and a 32ms tick advances steps and simTime by dt x speedMultiplier, emitting SIM_3D_TICK { dt, simTime } each step WITHOUT rendering; a composed sibling trait transitions directly on the SIM_3D_TICK / SIM_3D_UPDATED broadcasts (the same bare-event cascade the lab routers use), applies the domain physics, and owns the scene render — this atom renders no canvas. A caption readout shows steps, sim time, and current speed. Standalone by default; behind a lab router set matchMode and it renders only when MODE_SELECTED matches.",
2
+ "description": "Generic 3D simulation-transport (clock) instrument. Contract: the atom owns the transport and the clock but NOT the physics — a Play/Pause toggle, Reset and a SPEED_SET 0.5x/1x/2x/4x group (legacy RUN, PAUSE and SPEED_HALF/NORMAL/DOUBLE/QUAD events are still honored) drive a running flag and speed multiplier, and a 32ms tick advances steps and simTime by dt x speedMultiplier, emitting SIM_3D_TICK { dt, simTime } each step WITHOUT rendering; a composed sibling trait transitions directly on the SIM_3D_TICK / SIM_3D_UPDATED broadcasts (the same bare-event cascade the lab routers use), applies the domain physics, and owns the scene render — this atom renders no canvas. A caption readout shows steps, sim time, and current speed. Standalone by default; behind a lab router set matchMode and it renders only when MODE_SELECTED matches.",
3
3
  "ledger": {
4
4
  "entries": {
5
5
  "ent_01M07REZ9E71GXFJBWFQNRRKP9": {
@@ -109,6 +109,24 @@
109
109
  "parent": "trt_01M07REZ9E0HF8ACCCVGGXXQ8E",
110
110
  "renames": []
111
111
  },
112
+ "evt_01M41KTHJRFT85TD7FQH97101Z": {
113
+ "bakedName": "SPEED_SET",
114
+ "curName": "SPEED_SET",
115
+ "id": "evt_01M41KTHJRFT85TD7FQH97101Z",
116
+ "kind": "event",
117
+ "owner": "workspace",
118
+ "parent": "trt_01M07REZ9E0HF8ACCCVGGXXQ8E",
119
+ "renames": []
120
+ },
121
+ "evt_01M41KTHJRSYNYDKA3NGYWAYJR": {
122
+ "bakedName": "TOGGLE_RUN",
123
+ "curName": "TOGGLE_RUN",
124
+ "id": "evt_01M41KTHJRSYNYDKA3NGYWAYJR",
125
+ "kind": "event",
126
+ "owner": "workspace",
127
+ "parent": "trt_01M07REZ9E0HF8ACCCVGGXXQ8E",
128
+ "renames": []
129
+ },
112
130
  "orb_01M07REZ9EHW5BRQW5R24KSKAZ": {
113
131
  "bakedName": "LearnSim3DOrbital",
114
132
  "curName": "LearnSim3DOrbital",
@@ -220,9 +238,16 @@
220
238
  "tier": "domain",
221
239
  "type": "boolean"
222
240
  },
241
+ "summary": {
242
+ "default": "",
243
+ "description": "One line under the title saying what the learner is looking at (keep it under ~65 characters). Empty shows no line.",
244
+ "label": "Concept",
245
+ "tier": "presentation",
246
+ "type": "string"
247
+ },
223
248
  "title": {
224
249
  "default": "3D Simulation",
225
- "description": "Title shown above the transport controls.",
250
+ "description": "The instrument's name, the header's one hero.",
226
251
  "label": "Title",
227
252
  "tier": "presentation",
228
253
  "type": "string"
@@ -367,6 +392,24 @@
367
392
  ],
368
393
  "tier": "domain"
369
394
  },
395
+ {
396
+ "id": "evt_01M41KTHJRSYNYDKA3NGYWAYJR",
397
+ "key": "TOGGLE_RUN",
398
+ "name": "Toggle Run"
399
+ },
400
+ {
401
+ "description": "The learner picked a playback speed; the clock advances that many times faster.",
402
+ "id": "evt_01M41KTHJRFT85TD7FQH97101Z",
403
+ "key": "SPEED_SET",
404
+ "name": "Speed Set",
405
+ "payloadSchema": [
406
+ {
407
+ "name": "speed",
408
+ "type": "number"
409
+ }
410
+ ],
411
+ "tier": "presentation"
412
+ },
370
413
  {
371
414
  "id": "evt_01M07REZ9GQTKWE3EAS9FSE63G",
372
415
  "key": "RUN",
@@ -494,83 +537,234 @@
494
537
  {
495
538
  "children": [
496
539
  {
497
- "content": "@entity.title",
498
- "type": "typography",
499
- "variant": "h4"
500
- },
501
- {
540
+ "align": "start",
502
541
  "children": [
503
542
  {
504
- "action": "RUN",
505
- "label": "Run",
506
- "type": "button",
507
- "variant": "primary"
543
+ "children": [
544
+ {
545
+ "content": "@entity.title",
546
+ "type": "typography",
547
+ "variant": "h4"
548
+ },
549
+ [
550
+ "if",
551
+ [
552
+ "==",
553
+ "@config.summary",
554
+ ""
555
+ ],
556
+ null,
557
+ {
558
+ "color": "muted",
559
+ "content": "@config.summary",
560
+ "type": "typography",
561
+ "variant": "body2"
562
+ }
563
+ ]
564
+ ],
565
+ "direction": "vertical",
566
+ "gap": "xs",
567
+ "type": "stack"
508
568
  },
509
569
  {
510
- "action": "PAUSE",
511
- "label": "Pause",
512
- "type": "button",
513
- "variant": "secondary"
514
- },
515
- {
516
- "action": "RESET",
517
- "label": "Reset",
518
- "type": "button",
519
- "variant": "ghost"
570
+ "label": [
571
+ "if",
572
+ "@entity.running",
573
+ "Running",
574
+ "Paused"
575
+ ],
576
+ "type": "badge",
577
+ "variant": [
578
+ "if",
579
+ "@entity.running",
580
+ "primary",
581
+ "neutral"
582
+ ]
520
583
  }
521
584
  ],
522
585
  "direction": "horizontal",
523
- "gap": "sm",
586
+ "gap": "md",
587
+ "justify": "between",
524
588
  "type": "stack"
525
589
  },
526
590
  {
591
+ "align": "center",
527
592
  "children": [
593
+ [
594
+ "if",
595
+ "@entity.running",
596
+ {
597
+ "action": "TOGGLE_RUN",
598
+ "aria-pressed": "true",
599
+ "icon": "pause",
600
+ "label": "Pause",
601
+ "type": "button",
602
+ "variant": "primary"
603
+ },
604
+ {
605
+ "action": "TOGGLE_RUN",
606
+ "aria-pressed": "false",
607
+ "icon": "play",
608
+ "label": "Play",
609
+ "type": "button",
610
+ "variant": "primary"
611
+ }
612
+ ],
528
613
  {
529
- "action": "SPEED_HALF",
530
- "label": "0.5x",
614
+ "action": "RESET",
615
+ "icon": "rotate-ccw",
616
+ "label": "Reset",
531
617
  "type": "button",
532
618
  "variant": "ghost"
533
619
  },
534
620
  {
535
- "action": "SPEED_NORMAL",
536
- "label": "1x",
537
- "type": "button",
538
- "variant": "ghost"
621
+ "align": "center",
622
+ "aria-label": "Speed",
623
+ "children": [
624
+ {
625
+ "action": "SPEED_SET",
626
+ "actionPayload": {
627
+ "speed": 0.5
628
+ },
629
+ "aria-pressed": [
630
+ "if",
631
+ [
632
+ "==",
633
+ "@entity.speedMultiplier",
634
+ 0.5
635
+ ],
636
+ "true",
637
+ "false"
638
+ ],
639
+ "label": "0.5×",
640
+ "size": "sm",
641
+ "type": "button",
642
+ "variant": [
643
+ "if",
644
+ [
645
+ "==",
646
+ "@entity.speedMultiplier",
647
+ 0.5
648
+ ],
649
+ "secondary",
650
+ "ghost"
651
+ ]
652
+ },
653
+ {
654
+ "action": "SPEED_SET",
655
+ "actionPayload": {
656
+ "speed": 1.0
657
+ },
658
+ "aria-pressed": [
659
+ "if",
660
+ [
661
+ "==",
662
+ "@entity.speedMultiplier",
663
+ 1.0
664
+ ],
665
+ "true",
666
+ "false"
667
+ ],
668
+ "label": "1×",
669
+ "size": "sm",
670
+ "type": "button",
671
+ "variant": [
672
+ "if",
673
+ [
674
+ "==",
675
+ "@entity.speedMultiplier",
676
+ 1.0
677
+ ],
678
+ "secondary",
679
+ "ghost"
680
+ ]
681
+ },
682
+ {
683
+ "action": "SPEED_SET",
684
+ "actionPayload": {
685
+ "speed": 2.0
686
+ },
687
+ "aria-pressed": [
688
+ "if",
689
+ [
690
+ "==",
691
+ "@entity.speedMultiplier",
692
+ 2.0
693
+ ],
694
+ "true",
695
+ "false"
696
+ ],
697
+ "label": "2×",
698
+ "size": "sm",
699
+ "type": "button",
700
+ "variant": [
701
+ "if",
702
+ [
703
+ "==",
704
+ "@entity.speedMultiplier",
705
+ 2.0
706
+ ],
707
+ "secondary",
708
+ "ghost"
709
+ ]
710
+ },
711
+ {
712
+ "action": "SPEED_SET",
713
+ "actionPayload": {
714
+ "speed": 4.0
715
+ },
716
+ "aria-pressed": [
717
+ "if",
718
+ [
719
+ "==",
720
+ "@entity.speedMultiplier",
721
+ 4.0
722
+ ],
723
+ "true",
724
+ "false"
725
+ ],
726
+ "label": "4×",
727
+ "size": "sm",
728
+ "type": "button",
729
+ "variant": [
730
+ "if",
731
+ [
732
+ "==",
733
+ "@entity.speedMultiplier",
734
+ 4.0
735
+ ],
736
+ "secondary",
737
+ "ghost"
738
+ ]
739
+ }
740
+ ],
741
+ "direction": "horizontal",
742
+ "gap": "xs",
743
+ "role": "group",
744
+ "type": "stack"
539
745
  },
540
746
  {
541
- "action": "SPEED_DOUBLE",
542
- "label": "2x",
543
- "type": "button",
544
- "variant": "ghost"
545
- },
546
- {
547
- "action": "SPEED_QUAD",
548
- "label": "4x",
549
- "type": "button",
550
- "variant": "ghost"
747
+ "color": "muted",
748
+ "content": [
749
+ "str/concat",
750
+ "Step ",
751
+ "@entity.steps",
752
+ " · ",
753
+ [
754
+ "math/round",
755
+ "@entity.simTime",
756
+ 1.0
757
+ ],
758
+ " s"
759
+ ],
760
+ "type": "typography",
761
+ "variant": "caption"
551
762
  }
552
763
  ],
553
764
  "direction": "horizontal",
554
765
  "gap": "sm",
555
- "type": "stack"
556
- },
557
- {
558
- "content": [
559
- "str/concat",
560
- "Steps: ",
561
- "@entity.steps",
562
- " — sim time: ",
563
- [
564
- "math/round",
565
- "@entity.simTime",
566
- 1.0
567
- ],
568
- " s — speed: ",
569
- "@entity.speedMultiplier",
570
- "x"
571
- ],
572
- "type": "typography",
573
- "variant": "caption"
766
+ "type": "stack",
767
+ "wrap": true
574
768
  }
575
769
  ],
576
770
  "direction": "vertical",
@@ -603,6 +797,48 @@
603
797
  ],
604
798
  "to": "idle"
605
799
  },
800
+ {
801
+ "effects": [
802
+ [
803
+ "set",
804
+ "@entity.active",
805
+ false
806
+ ],
807
+ [
808
+ "set",
809
+ "@entity.running",
810
+ false
811
+ ],
812
+ [
813
+ "render-ui",
814
+ "main",
815
+ null
816
+ ]
817
+ ],
818
+ "event": "MODE_SELECTED",
819
+ "eventId": "evt_01M07REZ9GB3B15PX19TD5V8FG",
820
+ "from": "idle",
821
+ "guard": [
822
+ "and",
823
+ [
824
+ "not",
825
+ [
826
+ "==",
827
+ "@config.matchMode",
828
+ ""
829
+ ]
830
+ ],
831
+ [
832
+ "not",
833
+ [
834
+ "==",
835
+ "@payload.mode",
836
+ "@config.matchMode"
837
+ ]
838
+ ]
839
+ ],
840
+ "to": "idle"
841
+ },
606
842
  {
607
843
  "effects": [
608
844
  [
@@ -643,83 +879,234 @@
643
879
  {
644
880
  "children": [
645
881
  {
646
- "content": "@entity.title",
647
- "type": "typography",
648
- "variant": "h4"
649
- },
650
- {
882
+ "align": "start",
651
883
  "children": [
652
884
  {
653
- "action": "RUN",
654
- "label": "Run",
655
- "type": "button",
656
- "variant": "primary"
657
- },
658
- {
659
- "action": "PAUSE",
660
- "label": "Pause",
661
- "type": "button",
662
- "variant": "secondary"
885
+ "children": [
886
+ {
887
+ "content": "@entity.title",
888
+ "type": "typography",
889
+ "variant": "h4"
890
+ },
891
+ [
892
+ "if",
893
+ [
894
+ "==",
895
+ "@config.summary",
896
+ ""
897
+ ],
898
+ null,
899
+ {
900
+ "color": "muted",
901
+ "content": "@config.summary",
902
+ "type": "typography",
903
+ "variant": "body2"
904
+ }
905
+ ]
906
+ ],
907
+ "direction": "vertical",
908
+ "gap": "xs",
909
+ "type": "stack"
663
910
  },
664
911
  {
665
- "action": "RESET",
666
- "label": "Reset",
667
- "type": "button",
668
- "variant": "ghost"
912
+ "label": [
913
+ "if",
914
+ "@entity.running",
915
+ "Running",
916
+ "Paused"
917
+ ],
918
+ "type": "badge",
919
+ "variant": [
920
+ "if",
921
+ "@entity.running",
922
+ "primary",
923
+ "neutral"
924
+ ]
669
925
  }
670
926
  ],
671
927
  "direction": "horizontal",
672
- "gap": "sm",
928
+ "gap": "md",
929
+ "justify": "between",
673
930
  "type": "stack"
674
931
  },
675
932
  {
933
+ "align": "center",
676
934
  "children": [
935
+ [
936
+ "if",
937
+ "@entity.running",
938
+ {
939
+ "action": "TOGGLE_RUN",
940
+ "aria-pressed": "true",
941
+ "icon": "pause",
942
+ "label": "Pause",
943
+ "type": "button",
944
+ "variant": "primary"
945
+ },
946
+ {
947
+ "action": "TOGGLE_RUN",
948
+ "aria-pressed": "false",
949
+ "icon": "play",
950
+ "label": "Play",
951
+ "type": "button",
952
+ "variant": "primary"
953
+ }
954
+ ],
677
955
  {
678
- "action": "SPEED_HALF",
679
- "label": "0.5x",
680
- "type": "button",
681
- "variant": "ghost"
682
- },
683
- {
684
- "action": "SPEED_NORMAL",
685
- "label": "1x",
956
+ "action": "RESET",
957
+ "icon": "rotate-ccw",
958
+ "label": "Reset",
686
959
  "type": "button",
687
960
  "variant": "ghost"
688
961
  },
689
962
  {
690
- "action": "SPEED_DOUBLE",
691
- "label": "2x",
692
- "type": "button",
693
- "variant": "ghost"
963
+ "align": "center",
964
+ "aria-label": "Speed",
965
+ "children": [
966
+ {
967
+ "action": "SPEED_SET",
968
+ "actionPayload": {
969
+ "speed": 0.5
970
+ },
971
+ "aria-pressed": [
972
+ "if",
973
+ [
974
+ "==",
975
+ "@entity.speedMultiplier",
976
+ 0.5
977
+ ],
978
+ "true",
979
+ "false"
980
+ ],
981
+ "label": "0.5×",
982
+ "size": "sm",
983
+ "type": "button",
984
+ "variant": [
985
+ "if",
986
+ [
987
+ "==",
988
+ "@entity.speedMultiplier",
989
+ 0.5
990
+ ],
991
+ "secondary",
992
+ "ghost"
993
+ ]
994
+ },
995
+ {
996
+ "action": "SPEED_SET",
997
+ "actionPayload": {
998
+ "speed": 1.0
999
+ },
1000
+ "aria-pressed": [
1001
+ "if",
1002
+ [
1003
+ "==",
1004
+ "@entity.speedMultiplier",
1005
+ 1.0
1006
+ ],
1007
+ "true",
1008
+ "false"
1009
+ ],
1010
+ "label": "1×",
1011
+ "size": "sm",
1012
+ "type": "button",
1013
+ "variant": [
1014
+ "if",
1015
+ [
1016
+ "==",
1017
+ "@entity.speedMultiplier",
1018
+ 1.0
1019
+ ],
1020
+ "secondary",
1021
+ "ghost"
1022
+ ]
1023
+ },
1024
+ {
1025
+ "action": "SPEED_SET",
1026
+ "actionPayload": {
1027
+ "speed": 2.0
1028
+ },
1029
+ "aria-pressed": [
1030
+ "if",
1031
+ [
1032
+ "==",
1033
+ "@entity.speedMultiplier",
1034
+ 2.0
1035
+ ],
1036
+ "true",
1037
+ "false"
1038
+ ],
1039
+ "label": "2×",
1040
+ "size": "sm",
1041
+ "type": "button",
1042
+ "variant": [
1043
+ "if",
1044
+ [
1045
+ "==",
1046
+ "@entity.speedMultiplier",
1047
+ 2.0
1048
+ ],
1049
+ "secondary",
1050
+ "ghost"
1051
+ ]
1052
+ },
1053
+ {
1054
+ "action": "SPEED_SET",
1055
+ "actionPayload": {
1056
+ "speed": 4.0
1057
+ },
1058
+ "aria-pressed": [
1059
+ "if",
1060
+ [
1061
+ "==",
1062
+ "@entity.speedMultiplier",
1063
+ 4.0
1064
+ ],
1065
+ "true",
1066
+ "false"
1067
+ ],
1068
+ "label": "4×",
1069
+ "size": "sm",
1070
+ "type": "button",
1071
+ "variant": [
1072
+ "if",
1073
+ [
1074
+ "==",
1075
+ "@entity.speedMultiplier",
1076
+ 4.0
1077
+ ],
1078
+ "secondary",
1079
+ "ghost"
1080
+ ]
1081
+ }
1082
+ ],
1083
+ "direction": "horizontal",
1084
+ "gap": "xs",
1085
+ "role": "group",
1086
+ "type": "stack"
694
1087
  },
695
1088
  {
696
- "action": "SPEED_QUAD",
697
- "label": "4x",
698
- "type": "button",
699
- "variant": "ghost"
1089
+ "color": "muted",
1090
+ "content": [
1091
+ "str/concat",
1092
+ "Step ",
1093
+ "@entity.steps",
1094
+ " · ",
1095
+ [
1096
+ "math/round",
1097
+ "@entity.simTime",
1098
+ 1.0
1099
+ ],
1100
+ " s"
1101
+ ],
1102
+ "type": "typography",
1103
+ "variant": "caption"
700
1104
  }
701
1105
  ],
702
1106
  "direction": "horizontal",
703
1107
  "gap": "sm",
704
- "type": "stack"
705
- },
706
- {
707
- "content": [
708
- "str/concat",
709
- "Steps: ",
710
- "@entity.steps",
711
- " — sim time: ",
712
- [
713
- "math/round",
714
- "@entity.simTime",
715
- 1.0
716
- ],
717
- " s — speed: ",
718
- "@entity.speedMultiplier",
719
- "x"
720
- ],
721
- "type": "typography",
722
- "variant": "caption"
1108
+ "type": "stack",
1109
+ "wrap": true
723
1110
  }
724
1111
  ],
725
1112
  "direction": "vertical",
@@ -757,7 +1144,10 @@
757
1144
  [
758
1145
  "set",
759
1146
  "@entity.running",
760
- true
1147
+ [
1148
+ "not",
1149
+ "@entity.running"
1150
+ ]
761
1151
  ],
762
1152
  [
763
1153
  "render-ui",
@@ -767,83 +1157,784 @@
767
1157
  {
768
1158
  "children": [
769
1159
  {
770
- "content": "@entity.title",
771
- "type": "typography",
772
- "variant": "h4"
773
- },
774
- {
1160
+ "align": "start",
775
1161
  "children": [
776
1162
  {
777
- "action": "RUN",
778
- "label": "Run",
779
- "type": "button",
780
- "variant": "primary"
1163
+ "children": [
1164
+ {
1165
+ "content": "@entity.title",
1166
+ "type": "typography",
1167
+ "variant": "h4"
1168
+ },
1169
+ [
1170
+ "if",
1171
+ [
1172
+ "==",
1173
+ "@config.summary",
1174
+ ""
1175
+ ],
1176
+ null,
1177
+ {
1178
+ "color": "muted",
1179
+ "content": "@config.summary",
1180
+ "type": "typography",
1181
+ "variant": "body2"
1182
+ }
1183
+ ]
1184
+ ],
1185
+ "direction": "vertical",
1186
+ "gap": "xs",
1187
+ "type": "stack"
781
1188
  },
782
1189
  {
783
- "action": "PAUSE",
784
- "label": "Pause",
785
- "type": "button",
786
- "variant": "secondary"
787
- },
1190
+ "label": [
1191
+ "if",
1192
+ "@entity.running",
1193
+ "Running",
1194
+ "Paused"
1195
+ ],
1196
+ "type": "badge",
1197
+ "variant": [
1198
+ "if",
1199
+ "@entity.running",
1200
+ "primary",
1201
+ "neutral"
1202
+ ]
1203
+ }
1204
+ ],
1205
+ "direction": "horizontal",
1206
+ "gap": "md",
1207
+ "justify": "between",
1208
+ "type": "stack"
1209
+ },
1210
+ {
1211
+ "align": "center",
1212
+ "children": [
1213
+ [
1214
+ "if",
1215
+ "@entity.running",
1216
+ {
1217
+ "action": "TOGGLE_RUN",
1218
+ "aria-pressed": "true",
1219
+ "icon": "pause",
1220
+ "label": "Pause",
1221
+ "type": "button",
1222
+ "variant": "primary"
1223
+ },
1224
+ {
1225
+ "action": "TOGGLE_RUN",
1226
+ "aria-pressed": "false",
1227
+ "icon": "play",
1228
+ "label": "Play",
1229
+ "type": "button",
1230
+ "variant": "primary"
1231
+ }
1232
+ ],
788
1233
  {
789
1234
  "action": "RESET",
1235
+ "icon": "rotate-ccw",
790
1236
  "label": "Reset",
791
1237
  "type": "button",
792
1238
  "variant": "ghost"
1239
+ },
1240
+ {
1241
+ "align": "center",
1242
+ "aria-label": "Speed",
1243
+ "children": [
1244
+ {
1245
+ "action": "SPEED_SET",
1246
+ "actionPayload": {
1247
+ "speed": 0.5
1248
+ },
1249
+ "aria-pressed": [
1250
+ "if",
1251
+ [
1252
+ "==",
1253
+ "@entity.speedMultiplier",
1254
+ 0.5
1255
+ ],
1256
+ "true",
1257
+ "false"
1258
+ ],
1259
+ "label": "0.5×",
1260
+ "size": "sm",
1261
+ "type": "button",
1262
+ "variant": [
1263
+ "if",
1264
+ [
1265
+ "==",
1266
+ "@entity.speedMultiplier",
1267
+ 0.5
1268
+ ],
1269
+ "secondary",
1270
+ "ghost"
1271
+ ]
1272
+ },
1273
+ {
1274
+ "action": "SPEED_SET",
1275
+ "actionPayload": {
1276
+ "speed": 1.0
1277
+ },
1278
+ "aria-pressed": [
1279
+ "if",
1280
+ [
1281
+ "==",
1282
+ "@entity.speedMultiplier",
1283
+ 1.0
1284
+ ],
1285
+ "true",
1286
+ "false"
1287
+ ],
1288
+ "label": "1×",
1289
+ "size": "sm",
1290
+ "type": "button",
1291
+ "variant": [
1292
+ "if",
1293
+ [
1294
+ "==",
1295
+ "@entity.speedMultiplier",
1296
+ 1.0
1297
+ ],
1298
+ "secondary",
1299
+ "ghost"
1300
+ ]
1301
+ },
1302
+ {
1303
+ "action": "SPEED_SET",
1304
+ "actionPayload": {
1305
+ "speed": 2.0
1306
+ },
1307
+ "aria-pressed": [
1308
+ "if",
1309
+ [
1310
+ "==",
1311
+ "@entity.speedMultiplier",
1312
+ 2.0
1313
+ ],
1314
+ "true",
1315
+ "false"
1316
+ ],
1317
+ "label": "2×",
1318
+ "size": "sm",
1319
+ "type": "button",
1320
+ "variant": [
1321
+ "if",
1322
+ [
1323
+ "==",
1324
+ "@entity.speedMultiplier",
1325
+ 2.0
1326
+ ],
1327
+ "secondary",
1328
+ "ghost"
1329
+ ]
1330
+ },
1331
+ {
1332
+ "action": "SPEED_SET",
1333
+ "actionPayload": {
1334
+ "speed": 4.0
1335
+ },
1336
+ "aria-pressed": [
1337
+ "if",
1338
+ [
1339
+ "==",
1340
+ "@entity.speedMultiplier",
1341
+ 4.0
1342
+ ],
1343
+ "true",
1344
+ "false"
1345
+ ],
1346
+ "label": "4×",
1347
+ "size": "sm",
1348
+ "type": "button",
1349
+ "variant": [
1350
+ "if",
1351
+ [
1352
+ "==",
1353
+ "@entity.speedMultiplier",
1354
+ 4.0
1355
+ ],
1356
+ "secondary",
1357
+ "ghost"
1358
+ ]
1359
+ }
1360
+ ],
1361
+ "direction": "horizontal",
1362
+ "gap": "xs",
1363
+ "role": "group",
1364
+ "type": "stack"
1365
+ },
1366
+ {
1367
+ "color": "muted",
1368
+ "content": [
1369
+ "str/concat",
1370
+ "Step ",
1371
+ "@entity.steps",
1372
+ " · ",
1373
+ [
1374
+ "math/round",
1375
+ "@entity.simTime",
1376
+ 1.0
1377
+ ],
1378
+ " s"
1379
+ ],
1380
+ "type": "typography",
1381
+ "variant": "caption"
793
1382
  }
794
1383
  ],
795
1384
  "direction": "horizontal",
796
1385
  "gap": "sm",
1386
+ "type": "stack",
1387
+ "wrap": true
1388
+ }
1389
+ ],
1390
+ "direction": "vertical",
1391
+ "gap": "md",
1392
+ "type": "stack"
1393
+ }
1394
+ ],
1395
+ "padding": "md",
1396
+ "type": "box"
1397
+ }
1398
+ ],
1399
+ [
1400
+ "emit",
1401
+ "SIM_3D_UPDATED",
1402
+ {
1403
+ "running": "@entity.running",
1404
+ "simTime": "@entity.simTime",
1405
+ "speedMultiplier": "@entity.speedMultiplier",
1406
+ "steps": "@entity.steps"
1407
+ }
1408
+ ]
1409
+ ],
1410
+ "event": "TOGGLE_RUN",
1411
+ "eventId": "evt_01M41KTHJRSYNYDKA3NGYWAYJR",
1412
+ "from": "idle",
1413
+ "guard": [
1414
+ "==",
1415
+ "@entity.active",
1416
+ true
1417
+ ],
1418
+ "to": "idle"
1419
+ },
1420
+ {
1421
+ "effects": [
1422
+ [
1423
+ "set",
1424
+ "@entity.speedMultiplier",
1425
+ "@payload.speed"
1426
+ ],
1427
+ [
1428
+ "render-ui",
1429
+ "main",
1430
+ {
1431
+ "children": [
1432
+ {
1433
+ "children": [
1434
+ {
1435
+ "align": "start",
1436
+ "children": [
1437
+ {
1438
+ "children": [
1439
+ {
1440
+ "content": "@entity.title",
1441
+ "type": "typography",
1442
+ "variant": "h4"
1443
+ },
1444
+ [
1445
+ "if",
1446
+ [
1447
+ "==",
1448
+ "@config.summary",
1449
+ ""
1450
+ ],
1451
+ null,
1452
+ {
1453
+ "color": "muted",
1454
+ "content": "@config.summary",
1455
+ "type": "typography",
1456
+ "variant": "body2"
1457
+ }
1458
+ ]
1459
+ ],
1460
+ "direction": "vertical",
1461
+ "gap": "xs",
1462
+ "type": "stack"
1463
+ },
1464
+ {
1465
+ "label": [
1466
+ "if",
1467
+ "@entity.running",
1468
+ "Running",
1469
+ "Paused"
1470
+ ],
1471
+ "type": "badge",
1472
+ "variant": [
1473
+ "if",
1474
+ "@entity.running",
1475
+ "primary",
1476
+ "neutral"
1477
+ ]
1478
+ }
1479
+ ],
1480
+ "direction": "horizontal",
1481
+ "gap": "md",
1482
+ "justify": "between",
797
1483
  "type": "stack"
798
1484
  },
799
1485
  {
1486
+ "align": "center",
800
1487
  "children": [
1488
+ [
1489
+ "if",
1490
+ "@entity.running",
1491
+ {
1492
+ "action": "TOGGLE_RUN",
1493
+ "aria-pressed": "true",
1494
+ "icon": "pause",
1495
+ "label": "Pause",
1496
+ "type": "button",
1497
+ "variant": "primary"
1498
+ },
1499
+ {
1500
+ "action": "TOGGLE_RUN",
1501
+ "aria-pressed": "false",
1502
+ "icon": "play",
1503
+ "label": "Play",
1504
+ "type": "button",
1505
+ "variant": "primary"
1506
+ }
1507
+ ],
801
1508
  {
802
- "action": "SPEED_HALF",
803
- "label": "0.5x",
1509
+ "action": "RESET",
1510
+ "icon": "rotate-ccw",
1511
+ "label": "Reset",
804
1512
  "type": "button",
805
1513
  "variant": "ghost"
806
1514
  },
807
1515
  {
808
- "action": "SPEED_NORMAL",
809
- "label": "1x",
810
- "type": "button",
811
- "variant": "ghost"
1516
+ "align": "center",
1517
+ "aria-label": "Speed",
1518
+ "children": [
1519
+ {
1520
+ "action": "SPEED_SET",
1521
+ "actionPayload": {
1522
+ "speed": 0.5
1523
+ },
1524
+ "aria-pressed": [
1525
+ "if",
1526
+ [
1527
+ "==",
1528
+ "@entity.speedMultiplier",
1529
+ 0.5
1530
+ ],
1531
+ "true",
1532
+ "false"
1533
+ ],
1534
+ "label": "0.5×",
1535
+ "size": "sm",
1536
+ "type": "button",
1537
+ "variant": [
1538
+ "if",
1539
+ [
1540
+ "==",
1541
+ "@entity.speedMultiplier",
1542
+ 0.5
1543
+ ],
1544
+ "secondary",
1545
+ "ghost"
1546
+ ]
1547
+ },
1548
+ {
1549
+ "action": "SPEED_SET",
1550
+ "actionPayload": {
1551
+ "speed": 1.0
1552
+ },
1553
+ "aria-pressed": [
1554
+ "if",
1555
+ [
1556
+ "==",
1557
+ "@entity.speedMultiplier",
1558
+ 1.0
1559
+ ],
1560
+ "true",
1561
+ "false"
1562
+ ],
1563
+ "label": "1×",
1564
+ "size": "sm",
1565
+ "type": "button",
1566
+ "variant": [
1567
+ "if",
1568
+ [
1569
+ "==",
1570
+ "@entity.speedMultiplier",
1571
+ 1.0
1572
+ ],
1573
+ "secondary",
1574
+ "ghost"
1575
+ ]
1576
+ },
1577
+ {
1578
+ "action": "SPEED_SET",
1579
+ "actionPayload": {
1580
+ "speed": 2.0
1581
+ },
1582
+ "aria-pressed": [
1583
+ "if",
1584
+ [
1585
+ "==",
1586
+ "@entity.speedMultiplier",
1587
+ 2.0
1588
+ ],
1589
+ "true",
1590
+ "false"
1591
+ ],
1592
+ "label": "2×",
1593
+ "size": "sm",
1594
+ "type": "button",
1595
+ "variant": [
1596
+ "if",
1597
+ [
1598
+ "==",
1599
+ "@entity.speedMultiplier",
1600
+ 2.0
1601
+ ],
1602
+ "secondary",
1603
+ "ghost"
1604
+ ]
1605
+ },
1606
+ {
1607
+ "action": "SPEED_SET",
1608
+ "actionPayload": {
1609
+ "speed": 4.0
1610
+ },
1611
+ "aria-pressed": [
1612
+ "if",
1613
+ [
1614
+ "==",
1615
+ "@entity.speedMultiplier",
1616
+ 4.0
1617
+ ],
1618
+ "true",
1619
+ "false"
1620
+ ],
1621
+ "label": "4×",
1622
+ "size": "sm",
1623
+ "type": "button",
1624
+ "variant": [
1625
+ "if",
1626
+ [
1627
+ "==",
1628
+ "@entity.speedMultiplier",
1629
+ 4.0
1630
+ ],
1631
+ "secondary",
1632
+ "ghost"
1633
+ ]
1634
+ }
1635
+ ],
1636
+ "direction": "horizontal",
1637
+ "gap": "xs",
1638
+ "role": "group",
1639
+ "type": "stack"
812
1640
  },
813
1641
  {
814
- "action": "SPEED_DOUBLE",
815
- "label": "2x",
816
- "type": "button",
817
- "variant": "ghost"
1642
+ "color": "muted",
1643
+ "content": [
1644
+ "str/concat",
1645
+ "Step ",
1646
+ "@entity.steps",
1647
+ " · ",
1648
+ [
1649
+ "math/round",
1650
+ "@entity.simTime",
1651
+ 1.0
1652
+ ],
1653
+ " s"
1654
+ ],
1655
+ "type": "typography",
1656
+ "variant": "caption"
1657
+ }
1658
+ ],
1659
+ "direction": "horizontal",
1660
+ "gap": "sm",
1661
+ "type": "stack",
1662
+ "wrap": true
1663
+ }
1664
+ ],
1665
+ "direction": "vertical",
1666
+ "gap": "md",
1667
+ "type": "stack"
1668
+ }
1669
+ ],
1670
+ "padding": "md",
1671
+ "type": "box"
1672
+ }
1673
+ ],
1674
+ [
1675
+ "emit",
1676
+ "SIM_3D_UPDATED",
1677
+ {
1678
+ "running": "@entity.running",
1679
+ "simTime": "@entity.simTime",
1680
+ "speedMultiplier": "@entity.speedMultiplier",
1681
+ "steps": "@entity.steps"
1682
+ }
1683
+ ]
1684
+ ],
1685
+ "event": "SPEED_SET",
1686
+ "eventId": "evt_01M41KTHJRFT85TD7FQH97101Z",
1687
+ "from": "idle",
1688
+ "guard": [
1689
+ "==",
1690
+ "@entity.active",
1691
+ true
1692
+ ],
1693
+ "to": "idle"
1694
+ },
1695
+ {
1696
+ "effects": [
1697
+ [
1698
+ "set",
1699
+ "@entity.running",
1700
+ true
1701
+ ],
1702
+ [
1703
+ "render-ui",
1704
+ "main",
1705
+ {
1706
+ "children": [
1707
+ {
1708
+ "children": [
1709
+ {
1710
+ "align": "start",
1711
+ "children": [
1712
+ {
1713
+ "children": [
1714
+ {
1715
+ "content": "@entity.title",
1716
+ "type": "typography",
1717
+ "variant": "h4"
1718
+ },
1719
+ [
1720
+ "if",
1721
+ [
1722
+ "==",
1723
+ "@config.summary",
1724
+ ""
1725
+ ],
1726
+ null,
1727
+ {
1728
+ "color": "muted",
1729
+ "content": "@config.summary",
1730
+ "type": "typography",
1731
+ "variant": "body2"
1732
+ }
1733
+ ]
1734
+ ],
1735
+ "direction": "vertical",
1736
+ "gap": "xs",
1737
+ "type": "stack"
818
1738
  },
819
1739
  {
820
- "action": "SPEED_QUAD",
821
- "label": "4x",
822
- "type": "button",
823
- "variant": "ghost"
1740
+ "label": [
1741
+ "if",
1742
+ "@entity.running",
1743
+ "Running",
1744
+ "Paused"
1745
+ ],
1746
+ "type": "badge",
1747
+ "variant": [
1748
+ "if",
1749
+ "@entity.running",
1750
+ "primary",
1751
+ "neutral"
1752
+ ]
824
1753
  }
825
1754
  ],
826
1755
  "direction": "horizontal",
827
- "gap": "sm",
1756
+ "gap": "md",
1757
+ "justify": "between",
828
1758
  "type": "stack"
829
1759
  },
830
1760
  {
831
- "content": [
832
- "str/concat",
833
- "Steps: ",
834
- "@entity.steps",
835
- " — sim time: ",
1761
+ "align": "center",
1762
+ "children": [
836
1763
  [
837
- "math/round",
838
- "@entity.simTime",
839
- 1.0
1764
+ "if",
1765
+ "@entity.running",
1766
+ {
1767
+ "action": "TOGGLE_RUN",
1768
+ "aria-pressed": "true",
1769
+ "icon": "pause",
1770
+ "label": "Pause",
1771
+ "type": "button",
1772
+ "variant": "primary"
1773
+ },
1774
+ {
1775
+ "action": "TOGGLE_RUN",
1776
+ "aria-pressed": "false",
1777
+ "icon": "play",
1778
+ "label": "Play",
1779
+ "type": "button",
1780
+ "variant": "primary"
1781
+ }
840
1782
  ],
841
- " s — speed: ",
842
- "@entity.speedMultiplier",
843
- "x"
1783
+ {
1784
+ "action": "RESET",
1785
+ "icon": "rotate-ccw",
1786
+ "label": "Reset",
1787
+ "type": "button",
1788
+ "variant": "ghost"
1789
+ },
1790
+ {
1791
+ "align": "center",
1792
+ "aria-label": "Speed",
1793
+ "children": [
1794
+ {
1795
+ "action": "SPEED_SET",
1796
+ "actionPayload": {
1797
+ "speed": 0.5
1798
+ },
1799
+ "aria-pressed": [
1800
+ "if",
1801
+ [
1802
+ "==",
1803
+ "@entity.speedMultiplier",
1804
+ 0.5
1805
+ ],
1806
+ "true",
1807
+ "false"
1808
+ ],
1809
+ "label": "0.5×",
1810
+ "size": "sm",
1811
+ "type": "button",
1812
+ "variant": [
1813
+ "if",
1814
+ [
1815
+ "==",
1816
+ "@entity.speedMultiplier",
1817
+ 0.5
1818
+ ],
1819
+ "secondary",
1820
+ "ghost"
1821
+ ]
1822
+ },
1823
+ {
1824
+ "action": "SPEED_SET",
1825
+ "actionPayload": {
1826
+ "speed": 1.0
1827
+ },
1828
+ "aria-pressed": [
1829
+ "if",
1830
+ [
1831
+ "==",
1832
+ "@entity.speedMultiplier",
1833
+ 1.0
1834
+ ],
1835
+ "true",
1836
+ "false"
1837
+ ],
1838
+ "label": "1×",
1839
+ "size": "sm",
1840
+ "type": "button",
1841
+ "variant": [
1842
+ "if",
1843
+ [
1844
+ "==",
1845
+ "@entity.speedMultiplier",
1846
+ 1.0
1847
+ ],
1848
+ "secondary",
1849
+ "ghost"
1850
+ ]
1851
+ },
1852
+ {
1853
+ "action": "SPEED_SET",
1854
+ "actionPayload": {
1855
+ "speed": 2.0
1856
+ },
1857
+ "aria-pressed": [
1858
+ "if",
1859
+ [
1860
+ "==",
1861
+ "@entity.speedMultiplier",
1862
+ 2.0
1863
+ ],
1864
+ "true",
1865
+ "false"
1866
+ ],
1867
+ "label": "2×",
1868
+ "size": "sm",
1869
+ "type": "button",
1870
+ "variant": [
1871
+ "if",
1872
+ [
1873
+ "==",
1874
+ "@entity.speedMultiplier",
1875
+ 2.0
1876
+ ],
1877
+ "secondary",
1878
+ "ghost"
1879
+ ]
1880
+ },
1881
+ {
1882
+ "action": "SPEED_SET",
1883
+ "actionPayload": {
1884
+ "speed": 4.0
1885
+ },
1886
+ "aria-pressed": [
1887
+ "if",
1888
+ [
1889
+ "==",
1890
+ "@entity.speedMultiplier",
1891
+ 4.0
1892
+ ],
1893
+ "true",
1894
+ "false"
1895
+ ],
1896
+ "label": "4×",
1897
+ "size": "sm",
1898
+ "type": "button",
1899
+ "variant": [
1900
+ "if",
1901
+ [
1902
+ "==",
1903
+ "@entity.speedMultiplier",
1904
+ 4.0
1905
+ ],
1906
+ "secondary",
1907
+ "ghost"
1908
+ ]
1909
+ }
1910
+ ],
1911
+ "direction": "horizontal",
1912
+ "gap": "xs",
1913
+ "role": "group",
1914
+ "type": "stack"
1915
+ },
1916
+ {
1917
+ "color": "muted",
1918
+ "content": [
1919
+ "str/concat",
1920
+ "Step ",
1921
+ "@entity.steps",
1922
+ " · ",
1923
+ [
1924
+ "math/round",
1925
+ "@entity.simTime",
1926
+ 1.0
1927
+ ],
1928
+ " s"
1929
+ ],
1930
+ "type": "typography",
1931
+ "variant": "caption"
1932
+ }
844
1933
  ],
845
- "type": "typography",
846
- "variant": "caption"
1934
+ "direction": "horizontal",
1935
+ "gap": "sm",
1936
+ "type": "stack",
1937
+ "wrap": true
847
1938
  }
848
1939
  ],
849
1940
  "direction": "vertical",
@@ -891,83 +1982,234 @@
891
1982
  {
892
1983
  "children": [
893
1984
  {
894
- "content": "@entity.title",
895
- "type": "typography",
896
- "variant": "h4"
897
- },
898
- {
1985
+ "align": "start",
899
1986
  "children": [
900
1987
  {
901
- "action": "RUN",
902
- "label": "Run",
903
- "type": "button",
904
- "variant": "primary"
905
- },
906
- {
907
- "action": "PAUSE",
908
- "label": "Pause",
909
- "type": "button",
910
- "variant": "secondary"
1988
+ "children": [
1989
+ {
1990
+ "content": "@entity.title",
1991
+ "type": "typography",
1992
+ "variant": "h4"
1993
+ },
1994
+ [
1995
+ "if",
1996
+ [
1997
+ "==",
1998
+ "@config.summary",
1999
+ ""
2000
+ ],
2001
+ null,
2002
+ {
2003
+ "color": "muted",
2004
+ "content": "@config.summary",
2005
+ "type": "typography",
2006
+ "variant": "body2"
2007
+ }
2008
+ ]
2009
+ ],
2010
+ "direction": "vertical",
2011
+ "gap": "xs",
2012
+ "type": "stack"
911
2013
  },
912
2014
  {
913
- "action": "RESET",
914
- "label": "Reset",
915
- "type": "button",
916
- "variant": "ghost"
2015
+ "label": [
2016
+ "if",
2017
+ "@entity.running",
2018
+ "Running",
2019
+ "Paused"
2020
+ ],
2021
+ "type": "badge",
2022
+ "variant": [
2023
+ "if",
2024
+ "@entity.running",
2025
+ "primary",
2026
+ "neutral"
2027
+ ]
917
2028
  }
918
2029
  ],
919
2030
  "direction": "horizontal",
920
- "gap": "sm",
2031
+ "gap": "md",
2032
+ "justify": "between",
921
2033
  "type": "stack"
922
2034
  },
923
2035
  {
2036
+ "align": "center",
924
2037
  "children": [
2038
+ [
2039
+ "if",
2040
+ "@entity.running",
2041
+ {
2042
+ "action": "TOGGLE_RUN",
2043
+ "aria-pressed": "true",
2044
+ "icon": "pause",
2045
+ "label": "Pause",
2046
+ "type": "button",
2047
+ "variant": "primary"
2048
+ },
2049
+ {
2050
+ "action": "TOGGLE_RUN",
2051
+ "aria-pressed": "false",
2052
+ "icon": "play",
2053
+ "label": "Play",
2054
+ "type": "button",
2055
+ "variant": "primary"
2056
+ }
2057
+ ],
925
2058
  {
926
- "action": "SPEED_HALF",
927
- "label": "0.5x",
928
- "type": "button",
929
- "variant": "ghost"
930
- },
931
- {
932
- "action": "SPEED_NORMAL",
933
- "label": "1x",
2059
+ "action": "RESET",
2060
+ "icon": "rotate-ccw",
2061
+ "label": "Reset",
934
2062
  "type": "button",
935
2063
  "variant": "ghost"
936
2064
  },
937
2065
  {
938
- "action": "SPEED_DOUBLE",
939
- "label": "2x",
940
- "type": "button",
941
- "variant": "ghost"
2066
+ "align": "center",
2067
+ "aria-label": "Speed",
2068
+ "children": [
2069
+ {
2070
+ "action": "SPEED_SET",
2071
+ "actionPayload": {
2072
+ "speed": 0.5
2073
+ },
2074
+ "aria-pressed": [
2075
+ "if",
2076
+ [
2077
+ "==",
2078
+ "@entity.speedMultiplier",
2079
+ 0.5
2080
+ ],
2081
+ "true",
2082
+ "false"
2083
+ ],
2084
+ "label": "0.5×",
2085
+ "size": "sm",
2086
+ "type": "button",
2087
+ "variant": [
2088
+ "if",
2089
+ [
2090
+ "==",
2091
+ "@entity.speedMultiplier",
2092
+ 0.5
2093
+ ],
2094
+ "secondary",
2095
+ "ghost"
2096
+ ]
2097
+ },
2098
+ {
2099
+ "action": "SPEED_SET",
2100
+ "actionPayload": {
2101
+ "speed": 1.0
2102
+ },
2103
+ "aria-pressed": [
2104
+ "if",
2105
+ [
2106
+ "==",
2107
+ "@entity.speedMultiplier",
2108
+ 1.0
2109
+ ],
2110
+ "true",
2111
+ "false"
2112
+ ],
2113
+ "label": "1×",
2114
+ "size": "sm",
2115
+ "type": "button",
2116
+ "variant": [
2117
+ "if",
2118
+ [
2119
+ "==",
2120
+ "@entity.speedMultiplier",
2121
+ 1.0
2122
+ ],
2123
+ "secondary",
2124
+ "ghost"
2125
+ ]
2126
+ },
2127
+ {
2128
+ "action": "SPEED_SET",
2129
+ "actionPayload": {
2130
+ "speed": 2.0
2131
+ },
2132
+ "aria-pressed": [
2133
+ "if",
2134
+ [
2135
+ "==",
2136
+ "@entity.speedMultiplier",
2137
+ 2.0
2138
+ ],
2139
+ "true",
2140
+ "false"
2141
+ ],
2142
+ "label": "2×",
2143
+ "size": "sm",
2144
+ "type": "button",
2145
+ "variant": [
2146
+ "if",
2147
+ [
2148
+ "==",
2149
+ "@entity.speedMultiplier",
2150
+ 2.0
2151
+ ],
2152
+ "secondary",
2153
+ "ghost"
2154
+ ]
2155
+ },
2156
+ {
2157
+ "action": "SPEED_SET",
2158
+ "actionPayload": {
2159
+ "speed": 4.0
2160
+ },
2161
+ "aria-pressed": [
2162
+ "if",
2163
+ [
2164
+ "==",
2165
+ "@entity.speedMultiplier",
2166
+ 4.0
2167
+ ],
2168
+ "true",
2169
+ "false"
2170
+ ],
2171
+ "label": "4×",
2172
+ "size": "sm",
2173
+ "type": "button",
2174
+ "variant": [
2175
+ "if",
2176
+ [
2177
+ "==",
2178
+ "@entity.speedMultiplier",
2179
+ 4.0
2180
+ ],
2181
+ "secondary",
2182
+ "ghost"
2183
+ ]
2184
+ }
2185
+ ],
2186
+ "direction": "horizontal",
2187
+ "gap": "xs",
2188
+ "role": "group",
2189
+ "type": "stack"
942
2190
  },
943
2191
  {
944
- "action": "SPEED_QUAD",
945
- "label": "4x",
946
- "type": "button",
947
- "variant": "ghost"
2192
+ "color": "muted",
2193
+ "content": [
2194
+ "str/concat",
2195
+ "Step ",
2196
+ "@entity.steps",
2197
+ " · ",
2198
+ [
2199
+ "math/round",
2200
+ "@entity.simTime",
2201
+ 1.0
2202
+ ],
2203
+ " s"
2204
+ ],
2205
+ "type": "typography",
2206
+ "variant": "caption"
948
2207
  }
949
2208
  ],
950
2209
  "direction": "horizontal",
951
2210
  "gap": "sm",
952
- "type": "stack"
953
- },
954
- {
955
- "content": [
956
- "str/concat",
957
- "Steps: ",
958
- "@entity.steps",
959
- " — sim time: ",
960
- [
961
- "math/round",
962
- "@entity.simTime",
963
- 1.0
964
- ],
965
- " s — speed: ",
966
- "@entity.speedMultiplier",
967
- "x"
968
- ],
969
- "type": "typography",
970
- "variant": "caption"
2211
+ "type": "stack",
2212
+ "wrap": true
971
2213
  }
972
2214
  ],
973
2215
  "direction": "vertical",
@@ -1030,83 +2272,234 @@
1030
2272
  {
1031
2273
  "children": [
1032
2274
  {
1033
- "content": "@entity.title",
1034
- "type": "typography",
1035
- "variant": "h4"
1036
- },
1037
- {
2275
+ "align": "start",
1038
2276
  "children": [
1039
2277
  {
1040
- "action": "RUN",
1041
- "label": "Run",
1042
- "type": "button",
1043
- "variant": "primary"
2278
+ "children": [
2279
+ {
2280
+ "content": "@entity.title",
2281
+ "type": "typography",
2282
+ "variant": "h4"
2283
+ },
2284
+ [
2285
+ "if",
2286
+ [
2287
+ "==",
2288
+ "@config.summary",
2289
+ ""
2290
+ ],
2291
+ null,
2292
+ {
2293
+ "color": "muted",
2294
+ "content": "@config.summary",
2295
+ "type": "typography",
2296
+ "variant": "body2"
2297
+ }
2298
+ ]
2299
+ ],
2300
+ "direction": "vertical",
2301
+ "gap": "xs",
2302
+ "type": "stack"
1044
2303
  },
1045
2304
  {
1046
- "action": "PAUSE",
1047
- "label": "Pause",
1048
- "type": "button",
1049
- "variant": "secondary"
1050
- },
1051
- {
1052
- "action": "RESET",
1053
- "label": "Reset",
1054
- "type": "button",
1055
- "variant": "ghost"
2305
+ "label": [
2306
+ "if",
2307
+ "@entity.running",
2308
+ "Running",
2309
+ "Paused"
2310
+ ],
2311
+ "type": "badge",
2312
+ "variant": [
2313
+ "if",
2314
+ "@entity.running",
2315
+ "primary",
2316
+ "neutral"
2317
+ ]
1056
2318
  }
1057
2319
  ],
1058
2320
  "direction": "horizontal",
1059
- "gap": "sm",
2321
+ "gap": "md",
2322
+ "justify": "between",
1060
2323
  "type": "stack"
1061
2324
  },
1062
2325
  {
2326
+ "align": "center",
1063
2327
  "children": [
2328
+ [
2329
+ "if",
2330
+ "@entity.running",
2331
+ {
2332
+ "action": "TOGGLE_RUN",
2333
+ "aria-pressed": "true",
2334
+ "icon": "pause",
2335
+ "label": "Pause",
2336
+ "type": "button",
2337
+ "variant": "primary"
2338
+ },
2339
+ {
2340
+ "action": "TOGGLE_RUN",
2341
+ "aria-pressed": "false",
2342
+ "icon": "play",
2343
+ "label": "Play",
2344
+ "type": "button",
2345
+ "variant": "primary"
2346
+ }
2347
+ ],
1064
2348
  {
1065
- "action": "SPEED_HALF",
1066
- "label": "0.5x",
1067
- "type": "button",
1068
- "variant": "ghost"
1069
- },
1070
- {
1071
- "action": "SPEED_NORMAL",
1072
- "label": "1x",
2349
+ "action": "RESET",
2350
+ "icon": "rotate-ccw",
2351
+ "label": "Reset",
1073
2352
  "type": "button",
1074
2353
  "variant": "ghost"
1075
2354
  },
1076
2355
  {
1077
- "action": "SPEED_DOUBLE",
1078
- "label": "2x",
1079
- "type": "button",
1080
- "variant": "ghost"
2356
+ "align": "center",
2357
+ "aria-label": "Speed",
2358
+ "children": [
2359
+ {
2360
+ "action": "SPEED_SET",
2361
+ "actionPayload": {
2362
+ "speed": 0.5
2363
+ },
2364
+ "aria-pressed": [
2365
+ "if",
2366
+ [
2367
+ "==",
2368
+ "@entity.speedMultiplier",
2369
+ 0.5
2370
+ ],
2371
+ "true",
2372
+ "false"
2373
+ ],
2374
+ "label": "0.5×",
2375
+ "size": "sm",
2376
+ "type": "button",
2377
+ "variant": [
2378
+ "if",
2379
+ [
2380
+ "==",
2381
+ "@entity.speedMultiplier",
2382
+ 0.5
2383
+ ],
2384
+ "secondary",
2385
+ "ghost"
2386
+ ]
2387
+ },
2388
+ {
2389
+ "action": "SPEED_SET",
2390
+ "actionPayload": {
2391
+ "speed": 1.0
2392
+ },
2393
+ "aria-pressed": [
2394
+ "if",
2395
+ [
2396
+ "==",
2397
+ "@entity.speedMultiplier",
2398
+ 1.0
2399
+ ],
2400
+ "true",
2401
+ "false"
2402
+ ],
2403
+ "label": "1×",
2404
+ "size": "sm",
2405
+ "type": "button",
2406
+ "variant": [
2407
+ "if",
2408
+ [
2409
+ "==",
2410
+ "@entity.speedMultiplier",
2411
+ 1.0
2412
+ ],
2413
+ "secondary",
2414
+ "ghost"
2415
+ ]
2416
+ },
2417
+ {
2418
+ "action": "SPEED_SET",
2419
+ "actionPayload": {
2420
+ "speed": 2.0
2421
+ },
2422
+ "aria-pressed": [
2423
+ "if",
2424
+ [
2425
+ "==",
2426
+ "@entity.speedMultiplier",
2427
+ 2.0
2428
+ ],
2429
+ "true",
2430
+ "false"
2431
+ ],
2432
+ "label": "2×",
2433
+ "size": "sm",
2434
+ "type": "button",
2435
+ "variant": [
2436
+ "if",
2437
+ [
2438
+ "==",
2439
+ "@entity.speedMultiplier",
2440
+ 2.0
2441
+ ],
2442
+ "secondary",
2443
+ "ghost"
2444
+ ]
2445
+ },
2446
+ {
2447
+ "action": "SPEED_SET",
2448
+ "actionPayload": {
2449
+ "speed": 4.0
2450
+ },
2451
+ "aria-pressed": [
2452
+ "if",
2453
+ [
2454
+ "==",
2455
+ "@entity.speedMultiplier",
2456
+ 4.0
2457
+ ],
2458
+ "true",
2459
+ "false"
2460
+ ],
2461
+ "label": "4×",
2462
+ "size": "sm",
2463
+ "type": "button",
2464
+ "variant": [
2465
+ "if",
2466
+ [
2467
+ "==",
2468
+ "@entity.speedMultiplier",
2469
+ 4.0
2470
+ ],
2471
+ "secondary",
2472
+ "ghost"
2473
+ ]
2474
+ }
2475
+ ],
2476
+ "direction": "horizontal",
2477
+ "gap": "xs",
2478
+ "role": "group",
2479
+ "type": "stack"
1081
2480
  },
1082
2481
  {
1083
- "action": "SPEED_QUAD",
1084
- "label": "4x",
1085
- "type": "button",
1086
- "variant": "ghost"
2482
+ "color": "muted",
2483
+ "content": [
2484
+ "str/concat",
2485
+ "Step ",
2486
+ "@entity.steps",
2487
+ " · ",
2488
+ [
2489
+ "math/round",
2490
+ "@entity.simTime",
2491
+ 1.0
2492
+ ],
2493
+ " s"
2494
+ ],
2495
+ "type": "typography",
2496
+ "variant": "caption"
1087
2497
  }
1088
2498
  ],
1089
2499
  "direction": "horizontal",
1090
2500
  "gap": "sm",
1091
- "type": "stack"
1092
- },
1093
- {
1094
- "content": [
1095
- "str/concat",
1096
- "Steps: ",
1097
- "@entity.steps",
1098
- " — sim time: ",
1099
- [
1100
- "math/round",
1101
- "@entity.simTime",
1102
- 1.0
1103
- ],
1104
- " s — speed: ",
1105
- "@entity.speedMultiplier",
1106
- "x"
1107
- ],
1108
- "type": "typography",
1109
- "variant": "caption"
2501
+ "type": "stack",
2502
+ "wrap": true
1110
2503
  }
1111
2504
  ],
1112
2505
  "direction": "vertical",
@@ -1154,83 +2547,234 @@
1154
2547
  {
1155
2548
  "children": [
1156
2549
  {
1157
- "content": "@entity.title",
1158
- "type": "typography",
1159
- "variant": "h4"
1160
- },
1161
- {
2550
+ "align": "start",
1162
2551
  "children": [
1163
2552
  {
1164
- "action": "RUN",
1165
- "label": "Run",
1166
- "type": "button",
1167
- "variant": "primary"
1168
- },
1169
- {
1170
- "action": "PAUSE",
1171
- "label": "Pause",
1172
- "type": "button",
1173
- "variant": "secondary"
2553
+ "children": [
2554
+ {
2555
+ "content": "@entity.title",
2556
+ "type": "typography",
2557
+ "variant": "h4"
2558
+ },
2559
+ [
2560
+ "if",
2561
+ [
2562
+ "==",
2563
+ "@config.summary",
2564
+ ""
2565
+ ],
2566
+ null,
2567
+ {
2568
+ "color": "muted",
2569
+ "content": "@config.summary",
2570
+ "type": "typography",
2571
+ "variant": "body2"
2572
+ }
2573
+ ]
2574
+ ],
2575
+ "direction": "vertical",
2576
+ "gap": "xs",
2577
+ "type": "stack"
1174
2578
  },
1175
2579
  {
1176
- "action": "RESET",
1177
- "label": "Reset",
1178
- "type": "button",
1179
- "variant": "ghost"
2580
+ "label": [
2581
+ "if",
2582
+ "@entity.running",
2583
+ "Running",
2584
+ "Paused"
2585
+ ],
2586
+ "type": "badge",
2587
+ "variant": [
2588
+ "if",
2589
+ "@entity.running",
2590
+ "primary",
2591
+ "neutral"
2592
+ ]
1180
2593
  }
1181
2594
  ],
1182
2595
  "direction": "horizontal",
1183
- "gap": "sm",
2596
+ "gap": "md",
2597
+ "justify": "between",
1184
2598
  "type": "stack"
1185
2599
  },
1186
2600
  {
2601
+ "align": "center",
1187
2602
  "children": [
2603
+ [
2604
+ "if",
2605
+ "@entity.running",
2606
+ {
2607
+ "action": "TOGGLE_RUN",
2608
+ "aria-pressed": "true",
2609
+ "icon": "pause",
2610
+ "label": "Pause",
2611
+ "type": "button",
2612
+ "variant": "primary"
2613
+ },
2614
+ {
2615
+ "action": "TOGGLE_RUN",
2616
+ "aria-pressed": "false",
2617
+ "icon": "play",
2618
+ "label": "Play",
2619
+ "type": "button",
2620
+ "variant": "primary"
2621
+ }
2622
+ ],
1188
2623
  {
1189
- "action": "SPEED_HALF",
1190
- "label": "0.5x",
1191
- "type": "button",
1192
- "variant": "ghost"
1193
- },
1194
- {
1195
- "action": "SPEED_NORMAL",
1196
- "label": "1x",
2624
+ "action": "RESET",
2625
+ "icon": "rotate-ccw",
2626
+ "label": "Reset",
1197
2627
  "type": "button",
1198
2628
  "variant": "ghost"
1199
2629
  },
1200
2630
  {
1201
- "action": "SPEED_DOUBLE",
1202
- "label": "2x",
1203
- "type": "button",
1204
- "variant": "ghost"
2631
+ "align": "center",
2632
+ "aria-label": "Speed",
2633
+ "children": [
2634
+ {
2635
+ "action": "SPEED_SET",
2636
+ "actionPayload": {
2637
+ "speed": 0.5
2638
+ },
2639
+ "aria-pressed": [
2640
+ "if",
2641
+ [
2642
+ "==",
2643
+ "@entity.speedMultiplier",
2644
+ 0.5
2645
+ ],
2646
+ "true",
2647
+ "false"
2648
+ ],
2649
+ "label": "0.5×",
2650
+ "size": "sm",
2651
+ "type": "button",
2652
+ "variant": [
2653
+ "if",
2654
+ [
2655
+ "==",
2656
+ "@entity.speedMultiplier",
2657
+ 0.5
2658
+ ],
2659
+ "secondary",
2660
+ "ghost"
2661
+ ]
2662
+ },
2663
+ {
2664
+ "action": "SPEED_SET",
2665
+ "actionPayload": {
2666
+ "speed": 1.0
2667
+ },
2668
+ "aria-pressed": [
2669
+ "if",
2670
+ [
2671
+ "==",
2672
+ "@entity.speedMultiplier",
2673
+ 1.0
2674
+ ],
2675
+ "true",
2676
+ "false"
2677
+ ],
2678
+ "label": "1×",
2679
+ "size": "sm",
2680
+ "type": "button",
2681
+ "variant": [
2682
+ "if",
2683
+ [
2684
+ "==",
2685
+ "@entity.speedMultiplier",
2686
+ 1.0
2687
+ ],
2688
+ "secondary",
2689
+ "ghost"
2690
+ ]
2691
+ },
2692
+ {
2693
+ "action": "SPEED_SET",
2694
+ "actionPayload": {
2695
+ "speed": 2.0
2696
+ },
2697
+ "aria-pressed": [
2698
+ "if",
2699
+ [
2700
+ "==",
2701
+ "@entity.speedMultiplier",
2702
+ 2.0
2703
+ ],
2704
+ "true",
2705
+ "false"
2706
+ ],
2707
+ "label": "2×",
2708
+ "size": "sm",
2709
+ "type": "button",
2710
+ "variant": [
2711
+ "if",
2712
+ [
2713
+ "==",
2714
+ "@entity.speedMultiplier",
2715
+ 2.0
2716
+ ],
2717
+ "secondary",
2718
+ "ghost"
2719
+ ]
2720
+ },
2721
+ {
2722
+ "action": "SPEED_SET",
2723
+ "actionPayload": {
2724
+ "speed": 4.0
2725
+ },
2726
+ "aria-pressed": [
2727
+ "if",
2728
+ [
2729
+ "==",
2730
+ "@entity.speedMultiplier",
2731
+ 4.0
2732
+ ],
2733
+ "true",
2734
+ "false"
2735
+ ],
2736
+ "label": "4×",
2737
+ "size": "sm",
2738
+ "type": "button",
2739
+ "variant": [
2740
+ "if",
2741
+ [
2742
+ "==",
2743
+ "@entity.speedMultiplier",
2744
+ 4.0
2745
+ ],
2746
+ "secondary",
2747
+ "ghost"
2748
+ ]
2749
+ }
2750
+ ],
2751
+ "direction": "horizontal",
2752
+ "gap": "xs",
2753
+ "role": "group",
2754
+ "type": "stack"
1205
2755
  },
1206
2756
  {
1207
- "action": "SPEED_QUAD",
1208
- "label": "4x",
1209
- "type": "button",
1210
- "variant": "ghost"
2757
+ "color": "muted",
2758
+ "content": [
2759
+ "str/concat",
2760
+ "Step ",
2761
+ "@entity.steps",
2762
+ " · ",
2763
+ [
2764
+ "math/round",
2765
+ "@entity.simTime",
2766
+ 1.0
2767
+ ],
2768
+ " s"
2769
+ ],
2770
+ "type": "typography",
2771
+ "variant": "caption"
1211
2772
  }
1212
2773
  ],
1213
2774
  "direction": "horizontal",
1214
2775
  "gap": "sm",
1215
- "type": "stack"
1216
- },
1217
- {
1218
- "content": [
1219
- "str/concat",
1220
- "Steps: ",
1221
- "@entity.steps",
1222
- " — sim time: ",
1223
- [
1224
- "math/round",
1225
- "@entity.simTime",
1226
- 1.0
1227
- ],
1228
- " s — speed: ",
1229
- "@entity.speedMultiplier",
1230
- "x"
1231
- ],
1232
- "type": "typography",
1233
- "variant": "caption"
2776
+ "type": "stack",
2777
+ "wrap": true
1234
2778
  }
1235
2779
  ],
1236
2780
  "direction": "vertical",
@@ -1278,83 +2822,234 @@
1278
2822
  {
1279
2823
  "children": [
1280
2824
  {
1281
- "content": "@entity.title",
1282
- "type": "typography",
1283
- "variant": "h4"
1284
- },
1285
- {
2825
+ "align": "start",
1286
2826
  "children": [
1287
2827
  {
1288
- "action": "RUN",
1289
- "label": "Run",
1290
- "type": "button",
1291
- "variant": "primary"
1292
- },
1293
- {
1294
- "action": "PAUSE",
1295
- "label": "Pause",
1296
- "type": "button",
1297
- "variant": "secondary"
2828
+ "children": [
2829
+ {
2830
+ "content": "@entity.title",
2831
+ "type": "typography",
2832
+ "variant": "h4"
2833
+ },
2834
+ [
2835
+ "if",
2836
+ [
2837
+ "==",
2838
+ "@config.summary",
2839
+ ""
2840
+ ],
2841
+ null,
2842
+ {
2843
+ "color": "muted",
2844
+ "content": "@config.summary",
2845
+ "type": "typography",
2846
+ "variant": "body2"
2847
+ }
2848
+ ]
2849
+ ],
2850
+ "direction": "vertical",
2851
+ "gap": "xs",
2852
+ "type": "stack"
1298
2853
  },
1299
2854
  {
1300
- "action": "RESET",
1301
- "label": "Reset",
1302
- "type": "button",
1303
- "variant": "ghost"
2855
+ "label": [
2856
+ "if",
2857
+ "@entity.running",
2858
+ "Running",
2859
+ "Paused"
2860
+ ],
2861
+ "type": "badge",
2862
+ "variant": [
2863
+ "if",
2864
+ "@entity.running",
2865
+ "primary",
2866
+ "neutral"
2867
+ ]
1304
2868
  }
1305
2869
  ],
1306
2870
  "direction": "horizontal",
1307
- "gap": "sm",
2871
+ "gap": "md",
2872
+ "justify": "between",
1308
2873
  "type": "stack"
1309
2874
  },
1310
2875
  {
2876
+ "align": "center",
1311
2877
  "children": [
2878
+ [
2879
+ "if",
2880
+ "@entity.running",
2881
+ {
2882
+ "action": "TOGGLE_RUN",
2883
+ "aria-pressed": "true",
2884
+ "icon": "pause",
2885
+ "label": "Pause",
2886
+ "type": "button",
2887
+ "variant": "primary"
2888
+ },
2889
+ {
2890
+ "action": "TOGGLE_RUN",
2891
+ "aria-pressed": "false",
2892
+ "icon": "play",
2893
+ "label": "Play",
2894
+ "type": "button",
2895
+ "variant": "primary"
2896
+ }
2897
+ ],
1312
2898
  {
1313
- "action": "SPEED_HALF",
1314
- "label": "0.5x",
2899
+ "action": "RESET",
2900
+ "icon": "rotate-ccw",
2901
+ "label": "Reset",
1315
2902
  "type": "button",
1316
2903
  "variant": "ghost"
1317
2904
  },
1318
2905
  {
1319
- "action": "SPEED_NORMAL",
1320
- "label": "1x",
1321
- "type": "button",
1322
- "variant": "ghost"
2906
+ "align": "center",
2907
+ "aria-label": "Speed",
2908
+ "children": [
2909
+ {
2910
+ "action": "SPEED_SET",
2911
+ "actionPayload": {
2912
+ "speed": 0.5
2913
+ },
2914
+ "aria-pressed": [
2915
+ "if",
2916
+ [
2917
+ "==",
2918
+ "@entity.speedMultiplier",
2919
+ 0.5
2920
+ ],
2921
+ "true",
2922
+ "false"
2923
+ ],
2924
+ "label": "0.5×",
2925
+ "size": "sm",
2926
+ "type": "button",
2927
+ "variant": [
2928
+ "if",
2929
+ [
2930
+ "==",
2931
+ "@entity.speedMultiplier",
2932
+ 0.5
2933
+ ],
2934
+ "secondary",
2935
+ "ghost"
2936
+ ]
2937
+ },
2938
+ {
2939
+ "action": "SPEED_SET",
2940
+ "actionPayload": {
2941
+ "speed": 1.0
2942
+ },
2943
+ "aria-pressed": [
2944
+ "if",
2945
+ [
2946
+ "==",
2947
+ "@entity.speedMultiplier",
2948
+ 1.0
2949
+ ],
2950
+ "true",
2951
+ "false"
2952
+ ],
2953
+ "label": "1×",
2954
+ "size": "sm",
2955
+ "type": "button",
2956
+ "variant": [
2957
+ "if",
2958
+ [
2959
+ "==",
2960
+ "@entity.speedMultiplier",
2961
+ 1.0
2962
+ ],
2963
+ "secondary",
2964
+ "ghost"
2965
+ ]
2966
+ },
2967
+ {
2968
+ "action": "SPEED_SET",
2969
+ "actionPayload": {
2970
+ "speed": 2.0
2971
+ },
2972
+ "aria-pressed": [
2973
+ "if",
2974
+ [
2975
+ "==",
2976
+ "@entity.speedMultiplier",
2977
+ 2.0
2978
+ ],
2979
+ "true",
2980
+ "false"
2981
+ ],
2982
+ "label": "2×",
2983
+ "size": "sm",
2984
+ "type": "button",
2985
+ "variant": [
2986
+ "if",
2987
+ [
2988
+ "==",
2989
+ "@entity.speedMultiplier",
2990
+ 2.0
2991
+ ],
2992
+ "secondary",
2993
+ "ghost"
2994
+ ]
2995
+ },
2996
+ {
2997
+ "action": "SPEED_SET",
2998
+ "actionPayload": {
2999
+ "speed": 4.0
3000
+ },
3001
+ "aria-pressed": [
3002
+ "if",
3003
+ [
3004
+ "==",
3005
+ "@entity.speedMultiplier",
3006
+ 4.0
3007
+ ],
3008
+ "true",
3009
+ "false"
3010
+ ],
3011
+ "label": "4×",
3012
+ "size": "sm",
3013
+ "type": "button",
3014
+ "variant": [
3015
+ "if",
3016
+ [
3017
+ "==",
3018
+ "@entity.speedMultiplier",
3019
+ 4.0
3020
+ ],
3021
+ "secondary",
3022
+ "ghost"
3023
+ ]
3024
+ }
3025
+ ],
3026
+ "direction": "horizontal",
3027
+ "gap": "xs",
3028
+ "role": "group",
3029
+ "type": "stack"
1323
3030
  },
1324
3031
  {
1325
- "action": "SPEED_DOUBLE",
1326
- "label": "2x",
1327
- "type": "button",
1328
- "variant": "ghost"
1329
- },
1330
- {
1331
- "action": "SPEED_QUAD",
1332
- "label": "4x",
1333
- "type": "button",
1334
- "variant": "ghost"
3032
+ "color": "muted",
3033
+ "content": [
3034
+ "str/concat",
3035
+ "Step ",
3036
+ "@entity.steps",
3037
+ " · ",
3038
+ [
3039
+ "math/round",
3040
+ "@entity.simTime",
3041
+ 1.0
3042
+ ],
3043
+ " s"
3044
+ ],
3045
+ "type": "typography",
3046
+ "variant": "caption"
1335
3047
  }
1336
3048
  ],
1337
3049
  "direction": "horizontal",
1338
3050
  "gap": "sm",
1339
- "type": "stack"
1340
- },
1341
- {
1342
- "content": [
1343
- "str/concat",
1344
- "Steps: ",
1345
- "@entity.steps",
1346
- " — sim time: ",
1347
- [
1348
- "math/round",
1349
- "@entity.simTime",
1350
- 1.0
1351
- ],
1352
- " s — speed: ",
1353
- "@entity.speedMultiplier",
1354
- "x"
1355
- ],
1356
- "type": "typography",
1357
- "variant": "caption"
3051
+ "type": "stack",
3052
+ "wrap": true
1358
3053
  }
1359
3054
  ],
1360
3055
  "direction": "vertical",
@@ -1402,83 +3097,234 @@
1402
3097
  {
1403
3098
  "children": [
1404
3099
  {
1405
- "content": "@entity.title",
1406
- "type": "typography",
1407
- "variant": "h4"
1408
- },
1409
- {
3100
+ "align": "start",
1410
3101
  "children": [
1411
3102
  {
1412
- "action": "RUN",
1413
- "label": "Run",
1414
- "type": "button",
1415
- "variant": "primary"
1416
- },
1417
- {
1418
- "action": "PAUSE",
1419
- "label": "Pause",
1420
- "type": "button",
1421
- "variant": "secondary"
3103
+ "children": [
3104
+ {
3105
+ "content": "@entity.title",
3106
+ "type": "typography",
3107
+ "variant": "h4"
3108
+ },
3109
+ [
3110
+ "if",
3111
+ [
3112
+ "==",
3113
+ "@config.summary",
3114
+ ""
3115
+ ],
3116
+ null,
3117
+ {
3118
+ "color": "muted",
3119
+ "content": "@config.summary",
3120
+ "type": "typography",
3121
+ "variant": "body2"
3122
+ }
3123
+ ]
3124
+ ],
3125
+ "direction": "vertical",
3126
+ "gap": "xs",
3127
+ "type": "stack"
1422
3128
  },
1423
3129
  {
1424
- "action": "RESET",
1425
- "label": "Reset",
1426
- "type": "button",
1427
- "variant": "ghost"
3130
+ "label": [
3131
+ "if",
3132
+ "@entity.running",
3133
+ "Running",
3134
+ "Paused"
3135
+ ],
3136
+ "type": "badge",
3137
+ "variant": [
3138
+ "if",
3139
+ "@entity.running",
3140
+ "primary",
3141
+ "neutral"
3142
+ ]
1428
3143
  }
1429
3144
  ],
1430
3145
  "direction": "horizontal",
1431
- "gap": "sm",
3146
+ "gap": "md",
3147
+ "justify": "between",
1432
3148
  "type": "stack"
1433
3149
  },
1434
3150
  {
3151
+ "align": "center",
1435
3152
  "children": [
3153
+ [
3154
+ "if",
3155
+ "@entity.running",
3156
+ {
3157
+ "action": "TOGGLE_RUN",
3158
+ "aria-pressed": "true",
3159
+ "icon": "pause",
3160
+ "label": "Pause",
3161
+ "type": "button",
3162
+ "variant": "primary"
3163
+ },
3164
+ {
3165
+ "action": "TOGGLE_RUN",
3166
+ "aria-pressed": "false",
3167
+ "icon": "play",
3168
+ "label": "Play",
3169
+ "type": "button",
3170
+ "variant": "primary"
3171
+ }
3172
+ ],
1436
3173
  {
1437
- "action": "SPEED_HALF",
1438
- "label": "0.5x",
1439
- "type": "button",
1440
- "variant": "ghost"
1441
- },
1442
- {
1443
- "action": "SPEED_NORMAL",
1444
- "label": "1x",
3174
+ "action": "RESET",
3175
+ "icon": "rotate-ccw",
3176
+ "label": "Reset",
1445
3177
  "type": "button",
1446
3178
  "variant": "ghost"
1447
3179
  },
1448
3180
  {
1449
- "action": "SPEED_DOUBLE",
1450
- "label": "2x",
1451
- "type": "button",
1452
- "variant": "ghost"
3181
+ "align": "center",
3182
+ "aria-label": "Speed",
3183
+ "children": [
3184
+ {
3185
+ "action": "SPEED_SET",
3186
+ "actionPayload": {
3187
+ "speed": 0.5
3188
+ },
3189
+ "aria-pressed": [
3190
+ "if",
3191
+ [
3192
+ "==",
3193
+ "@entity.speedMultiplier",
3194
+ 0.5
3195
+ ],
3196
+ "true",
3197
+ "false"
3198
+ ],
3199
+ "label": "0.5×",
3200
+ "size": "sm",
3201
+ "type": "button",
3202
+ "variant": [
3203
+ "if",
3204
+ [
3205
+ "==",
3206
+ "@entity.speedMultiplier",
3207
+ 0.5
3208
+ ],
3209
+ "secondary",
3210
+ "ghost"
3211
+ ]
3212
+ },
3213
+ {
3214
+ "action": "SPEED_SET",
3215
+ "actionPayload": {
3216
+ "speed": 1.0
3217
+ },
3218
+ "aria-pressed": [
3219
+ "if",
3220
+ [
3221
+ "==",
3222
+ "@entity.speedMultiplier",
3223
+ 1.0
3224
+ ],
3225
+ "true",
3226
+ "false"
3227
+ ],
3228
+ "label": "1×",
3229
+ "size": "sm",
3230
+ "type": "button",
3231
+ "variant": [
3232
+ "if",
3233
+ [
3234
+ "==",
3235
+ "@entity.speedMultiplier",
3236
+ 1.0
3237
+ ],
3238
+ "secondary",
3239
+ "ghost"
3240
+ ]
3241
+ },
3242
+ {
3243
+ "action": "SPEED_SET",
3244
+ "actionPayload": {
3245
+ "speed": 2.0
3246
+ },
3247
+ "aria-pressed": [
3248
+ "if",
3249
+ [
3250
+ "==",
3251
+ "@entity.speedMultiplier",
3252
+ 2.0
3253
+ ],
3254
+ "true",
3255
+ "false"
3256
+ ],
3257
+ "label": "2×",
3258
+ "size": "sm",
3259
+ "type": "button",
3260
+ "variant": [
3261
+ "if",
3262
+ [
3263
+ "==",
3264
+ "@entity.speedMultiplier",
3265
+ 2.0
3266
+ ],
3267
+ "secondary",
3268
+ "ghost"
3269
+ ]
3270
+ },
3271
+ {
3272
+ "action": "SPEED_SET",
3273
+ "actionPayload": {
3274
+ "speed": 4.0
3275
+ },
3276
+ "aria-pressed": [
3277
+ "if",
3278
+ [
3279
+ "==",
3280
+ "@entity.speedMultiplier",
3281
+ 4.0
3282
+ ],
3283
+ "true",
3284
+ "false"
3285
+ ],
3286
+ "label": "4×",
3287
+ "size": "sm",
3288
+ "type": "button",
3289
+ "variant": [
3290
+ "if",
3291
+ [
3292
+ "==",
3293
+ "@entity.speedMultiplier",
3294
+ 4.0
3295
+ ],
3296
+ "secondary",
3297
+ "ghost"
3298
+ ]
3299
+ }
3300
+ ],
3301
+ "direction": "horizontal",
3302
+ "gap": "xs",
3303
+ "role": "group",
3304
+ "type": "stack"
1453
3305
  },
1454
3306
  {
1455
- "action": "SPEED_QUAD",
1456
- "label": "4x",
1457
- "type": "button",
1458
- "variant": "ghost"
3307
+ "color": "muted",
3308
+ "content": [
3309
+ "str/concat",
3310
+ "Step ",
3311
+ "@entity.steps",
3312
+ " · ",
3313
+ [
3314
+ "math/round",
3315
+ "@entity.simTime",
3316
+ 1.0
3317
+ ],
3318
+ " s"
3319
+ ],
3320
+ "type": "typography",
3321
+ "variant": "caption"
1459
3322
  }
1460
3323
  ],
1461
3324
  "direction": "horizontal",
1462
3325
  "gap": "sm",
1463
- "type": "stack"
1464
- },
1465
- {
1466
- "content": [
1467
- "str/concat",
1468
- "Steps: ",
1469
- "@entity.steps",
1470
- " — sim time: ",
1471
- [
1472
- "math/round",
1473
- "@entity.simTime",
1474
- 1.0
1475
- ],
1476
- " s — speed: ",
1477
- "@entity.speedMultiplier",
1478
- "x"
1479
- ],
1480
- "type": "typography",
1481
- "variant": "caption"
3326
+ "type": "stack",
3327
+ "wrap": true
1482
3328
  }
1483
3329
  ],
1484
3330
  "direction": "vertical",
@@ -1526,83 +3372,234 @@
1526
3372
  {
1527
3373
  "children": [
1528
3374
  {
1529
- "content": "@entity.title",
1530
- "type": "typography",
1531
- "variant": "h4"
1532
- },
1533
- {
3375
+ "align": "start",
1534
3376
  "children": [
1535
3377
  {
1536
- "action": "RUN",
1537
- "label": "Run",
1538
- "type": "button",
1539
- "variant": "primary"
1540
- },
1541
- {
1542
- "action": "PAUSE",
1543
- "label": "Pause",
1544
- "type": "button",
1545
- "variant": "secondary"
3378
+ "children": [
3379
+ {
3380
+ "content": "@entity.title",
3381
+ "type": "typography",
3382
+ "variant": "h4"
3383
+ },
3384
+ [
3385
+ "if",
3386
+ [
3387
+ "==",
3388
+ "@config.summary",
3389
+ ""
3390
+ ],
3391
+ null,
3392
+ {
3393
+ "color": "muted",
3394
+ "content": "@config.summary",
3395
+ "type": "typography",
3396
+ "variant": "body2"
3397
+ }
3398
+ ]
3399
+ ],
3400
+ "direction": "vertical",
3401
+ "gap": "xs",
3402
+ "type": "stack"
1546
3403
  },
1547
3404
  {
1548
- "action": "RESET",
1549
- "label": "Reset",
1550
- "type": "button",
1551
- "variant": "ghost"
3405
+ "label": [
3406
+ "if",
3407
+ "@entity.running",
3408
+ "Running",
3409
+ "Paused"
3410
+ ],
3411
+ "type": "badge",
3412
+ "variant": [
3413
+ "if",
3414
+ "@entity.running",
3415
+ "primary",
3416
+ "neutral"
3417
+ ]
1552
3418
  }
1553
3419
  ],
1554
3420
  "direction": "horizontal",
1555
- "gap": "sm",
3421
+ "gap": "md",
3422
+ "justify": "between",
1556
3423
  "type": "stack"
1557
3424
  },
1558
3425
  {
3426
+ "align": "center",
1559
3427
  "children": [
3428
+ [
3429
+ "if",
3430
+ "@entity.running",
3431
+ {
3432
+ "action": "TOGGLE_RUN",
3433
+ "aria-pressed": "true",
3434
+ "icon": "pause",
3435
+ "label": "Pause",
3436
+ "type": "button",
3437
+ "variant": "primary"
3438
+ },
3439
+ {
3440
+ "action": "TOGGLE_RUN",
3441
+ "aria-pressed": "false",
3442
+ "icon": "play",
3443
+ "label": "Play",
3444
+ "type": "button",
3445
+ "variant": "primary"
3446
+ }
3447
+ ],
1560
3448
  {
1561
- "action": "SPEED_HALF",
1562
- "label": "0.5x",
1563
- "type": "button",
1564
- "variant": "ghost"
1565
- },
1566
- {
1567
- "action": "SPEED_NORMAL",
1568
- "label": "1x",
3449
+ "action": "RESET",
3450
+ "icon": "rotate-ccw",
3451
+ "label": "Reset",
1569
3452
  "type": "button",
1570
3453
  "variant": "ghost"
1571
3454
  },
1572
3455
  {
1573
- "action": "SPEED_DOUBLE",
1574
- "label": "2x",
1575
- "type": "button",
1576
- "variant": "ghost"
3456
+ "align": "center",
3457
+ "aria-label": "Speed",
3458
+ "children": [
3459
+ {
3460
+ "action": "SPEED_SET",
3461
+ "actionPayload": {
3462
+ "speed": 0.5
3463
+ },
3464
+ "aria-pressed": [
3465
+ "if",
3466
+ [
3467
+ "==",
3468
+ "@entity.speedMultiplier",
3469
+ 0.5
3470
+ ],
3471
+ "true",
3472
+ "false"
3473
+ ],
3474
+ "label": "0.5×",
3475
+ "size": "sm",
3476
+ "type": "button",
3477
+ "variant": [
3478
+ "if",
3479
+ [
3480
+ "==",
3481
+ "@entity.speedMultiplier",
3482
+ 0.5
3483
+ ],
3484
+ "secondary",
3485
+ "ghost"
3486
+ ]
3487
+ },
3488
+ {
3489
+ "action": "SPEED_SET",
3490
+ "actionPayload": {
3491
+ "speed": 1.0
3492
+ },
3493
+ "aria-pressed": [
3494
+ "if",
3495
+ [
3496
+ "==",
3497
+ "@entity.speedMultiplier",
3498
+ 1.0
3499
+ ],
3500
+ "true",
3501
+ "false"
3502
+ ],
3503
+ "label": "1×",
3504
+ "size": "sm",
3505
+ "type": "button",
3506
+ "variant": [
3507
+ "if",
3508
+ [
3509
+ "==",
3510
+ "@entity.speedMultiplier",
3511
+ 1.0
3512
+ ],
3513
+ "secondary",
3514
+ "ghost"
3515
+ ]
3516
+ },
3517
+ {
3518
+ "action": "SPEED_SET",
3519
+ "actionPayload": {
3520
+ "speed": 2.0
3521
+ },
3522
+ "aria-pressed": [
3523
+ "if",
3524
+ [
3525
+ "==",
3526
+ "@entity.speedMultiplier",
3527
+ 2.0
3528
+ ],
3529
+ "true",
3530
+ "false"
3531
+ ],
3532
+ "label": "2×",
3533
+ "size": "sm",
3534
+ "type": "button",
3535
+ "variant": [
3536
+ "if",
3537
+ [
3538
+ "==",
3539
+ "@entity.speedMultiplier",
3540
+ 2.0
3541
+ ],
3542
+ "secondary",
3543
+ "ghost"
3544
+ ]
3545
+ },
3546
+ {
3547
+ "action": "SPEED_SET",
3548
+ "actionPayload": {
3549
+ "speed": 4.0
3550
+ },
3551
+ "aria-pressed": [
3552
+ "if",
3553
+ [
3554
+ "==",
3555
+ "@entity.speedMultiplier",
3556
+ 4.0
3557
+ ],
3558
+ "true",
3559
+ "false"
3560
+ ],
3561
+ "label": "4×",
3562
+ "size": "sm",
3563
+ "type": "button",
3564
+ "variant": [
3565
+ "if",
3566
+ [
3567
+ "==",
3568
+ "@entity.speedMultiplier",
3569
+ 4.0
3570
+ ],
3571
+ "secondary",
3572
+ "ghost"
3573
+ ]
3574
+ }
3575
+ ],
3576
+ "direction": "horizontal",
3577
+ "gap": "xs",
3578
+ "role": "group",
3579
+ "type": "stack"
1577
3580
  },
1578
3581
  {
1579
- "action": "SPEED_QUAD",
1580
- "label": "4x",
1581
- "type": "button",
1582
- "variant": "ghost"
3582
+ "color": "muted",
3583
+ "content": [
3584
+ "str/concat",
3585
+ "Step ",
3586
+ "@entity.steps",
3587
+ " · ",
3588
+ [
3589
+ "math/round",
3590
+ "@entity.simTime",
3591
+ 1.0
3592
+ ],
3593
+ " s"
3594
+ ],
3595
+ "type": "typography",
3596
+ "variant": "caption"
1583
3597
  }
1584
3598
  ],
1585
3599
  "direction": "horizontal",
1586
3600
  "gap": "sm",
1587
- "type": "stack"
1588
- },
1589
- {
1590
- "content": [
1591
- "str/concat",
1592
- "Steps: ",
1593
- "@entity.steps",
1594
- " — sim time: ",
1595
- [
1596
- "math/round",
1597
- "@entity.simTime",
1598
- 1.0
1599
- ],
1600
- " s — speed: ",
1601
- "@entity.speedMultiplier",
1602
- "x"
1603
- ],
1604
- "type": "typography",
1605
- "variant": "caption"
3601
+ "type": "stack",
3602
+ "wrap": true
1606
3603
  }
1607
3604
  ],
1608
3605
  "direction": "vertical",