@ccslabs/xtend 0.1.0-rc.1

package/xtendrmt/rmt-first-demo-app.rmt

@@ -0,0 +1,737 @@
+{
+  "kind": "rmt_document",
+  "version": "1.0",
+  "manifest": {
+    "documentId": "demo.xtend.rmt-first-app",
+    "namespace": "demo.xtend.rmtFirstApp",
+    "metadata": {
+      "contractVersion": "xtend.epic10.rmt-first-demo-app.v1",
+      "workpackage": "WP-E10-13",
+      "status": "accepted-demo",
+      "renderMode": "shell-first",
+      "appModel": "rmt-first-xtend-app",
+      "componentContract": "xtend.component.contract.v2",
+      "rmtAppAuthoring": "xtend.rmt.first-class-app-authoring.v1",
+      "componentLab": "xtend.epic10.component-lab-rmt-inspector.v1",
+      "fabricApi": "@xtend-fabric",
+      "manualShellAllowed": false,
+      "templateOwnership": "rmt-document",
+      "hostShellMarkup": false,
+      "kernelBoundary": "RMT owns app shell, routes, templates, schedules and metadata only. XTend component execution, Fabric execution, manifest lookup, DOM materialization and XRouter registration stay in host adapters."
+    }
+  },
+  "adapters": [
+    {
+      "id": "xtend.component",
+      "kind": "component_adapter",
+      "runtimeSurface": ["esm", "browser_classic"],
+      "providedCapabilities": [
+        "components",
+        "customElements",
+        "manifestLookup",
+        "props",
+        "attributes",
+        "slots",
+        "events",
+        "hydration",
+        "scheduleRefs",
+        "fabricContext",
+        "componentTelemetry",
+        "diagnostics"
+      ],
+      "kernelVisible": false
+    },
+    {
+      "id": "xtend.xrouter",
+      "kind": "router_adapter",
+      "runtimeSurface": ["esm", "browser_classic"],
+      "providedCapabilities": ["routes", "navigation", "params", "query", "scheduleRefs", "diagnostics"],
+      "kernelVisible": false
+    },
+    {
+      "id": "rmt.state-scheduler-diagnostics",
+      "kind": "scheduler_adapter",
+      "runtimeSurface": ["esm", "browser_classic"],
+      "providedCapabilities": [
+        "stateBridge",
+        "schedulerEndpoints",
+        "diagnostics",
+        "adapterResults",
+        "performanceBudgets",
+        "lifecycleEvents"
+      ],
+      "kernelVisible": false
+    },
+    {
+      "id": "xtend.fabric-telemetry",
+      "kind": "telemetry_adapter",
+      "runtimeSurface": ["esm", "browser_classic"],
+      "providedCapabilities": ["fabricSnapshot", "componentTelemetry", "backpressureSignals", "performanceWarnings"],
+      "kernelVisible": false
+    }
+  ],
+  "components": [
+    {
+      "id": "app.shell",
+      "kind": "custom_element",
+      "adapter": "xtend.component",
+      "tag": "x-section",
+      "schedule": "app.shell.render",
+      "props": {
+        "label": "RMT-first XTend App"
+      },
+      "attributes": {
+        "layout": "column",
+        "data-rmt-shell": "rmt-first-demo"
+      },
+      "slots": {
+        "header": { "template": "app.header" },
+        "default": { "component": "app.router" }
+      },
+      "hydration": {
+        "mode": "runtime_render",
+        "ownershipMode": "managed_subtree"
+      },
+      "metadata": {
+        "fabric": {
+          "lane": "visible",
+          "fiber": "component.render",
+          "telemetry": true
+        }
+      }
+    },
+    {
+      "id": "app.router",
+      "kind": "custom_element",
+      "adapter": "xtend.component",
+      "tag": "x-router",
+      "schedule": "route.visible.render",
+      "attributes": {
+        "mode": "hash",
+        "data-rmt-router": "xtend.xrouter"
+      },
+      "metadata": {
+        "fabric": {
+          "lane": "visible",
+          "fiber": "route.render",
+          "telemetry": true
+        }
+      }
+    },
+    {
+      "id": "page.dashboard",
+      "kind": "custom_element",
+      "adapter": "xtend.component",
+      "tag": "x-section",
+      "schedule": "component.visible.mount",
+      "props": {
+        "label": "Dashboard"
+      },
+      "attributes": {
+        "layout": "column",
+        "data-rmt-route": "dashboard"
+      },
+      "slots": {
+        "default": { "template": "page.dashboard.template" }
+      },
+      "metadata": {
+        "fabric": {
+          "lane": "visible",
+          "fiber": "component.mount",
+          "telemetry": true
+        }
+      }
+    },
+    {
+      "id": "dashboard.status",
+      "kind": "custom_element",
+      "adapter": "xtend.component",
+      "tag": "x-status",
+      "schedule": "diagnostics.snapshot",
+      "props": {
+        "type": "success",
+        "message": "RMT shell, routes and schedules are active."
+      },
+      "attributes": {
+        "data-rmt-telemetry": "component-status"
+      },
+      "metadata": {
+        "fabric": {
+          "lane": "diagnostics",
+          "fiber": "component.telemetry",
+          "telemetry": true
+        }
+      }
+    },
+    {
+      "id": "dashboard.progress",
+      "kind": "custom_element",
+      "adapter": "xtend.component",
+      "tag": "x-progress",
+      "schedule": "diagnostics.snapshot",
+      "props": {
+        "label": "Shell-first coverage",
+        "value": 100,
+        "max": 100
+      },
+      "metadata": {
+        "fabric": {
+          "lane": "diagnostics",
+          "fiber": "performance.measure",
+          "telemetry": true
+        }
+      }
+    },
+    {
+      "id": "page.settings",
+      "kind": "custom_element",
+      "adapter": "xtend.component",
+      "tag": "x-form",
+      "schedule": "component.idle.hydrate",
+      "props": {
+        "label": "Settings"
+      },
+      "attributes": {
+        "data-rmt-route": "settings"
+      },
+      "slots": {
+        "default": { "template": "page.settings.template" }
+      },
+      "events": {
+        "submit": {
+          "command": "settings.save"
+        },
+        "invalid": {
+          "command": "settings.validation.failed"
+        }
+      },
+      "hydration": {
+        "mode": "runtime_render",
+        "ownershipMode": "managed_subtree"
+      },
+      "metadata": {
+        "fabric": {
+          "lane": "idle",
+          "fiber": "component.hydrate",
+          "telemetry": true
+        }
+      }
+    },
+    {
+      "id": "settings.delivery",
+      "kind": "custom_element",
+      "adapter": "xtend.component",
+      "tag": "x-select",
+      "schedule": "ui.user-blocking.input",
+      "props": {
+        "name": "delivery",
+        "label": "Delivery lane",
+        "value": "visible"
+      },
+      "attributes": {
+        "aria-label": "Delivery lane"
+      },
+      "events": {
+        "select-changed": {
+          "command": "settings.delivery.changed"
+        }
+      },
+      "metadata": {
+        "options": [
+          { "label": "Visible", "value": "visible" },
+          { "label": "Idle", "value": "idle" },
+          { "label": "Background", "value": "background" }
+        ],
+        "fabric": {
+          "lane": "user-blocking",
+          "fiber": "component.event",
+          "telemetry": true
+        }
+      }
+    },
+    {
+      "id": "settings.telemetry",
+      "kind": "custom_element",
+      "adapter": "xtend.component",
+      "tag": "x-checkbox",
+      "schedule": "ui.user-blocking.input",
+      "props": {
+        "name": "telemetry",
+        "label": "Enable telemetry lane hints",
+        "checked": true
+      },
+      "events": {
+        "checkbox-changed": {
+          "command": "settings.telemetry.changed"
+        }
+      },
+      "metadata": {
+        "fabric": {
+          "lane": "user-blocking",
+          "fiber": "component.event",
+          "telemetry": true
+        }
+      }
+    },
+    {
+      "id": "settings.renderMode",
+      "kind": "custom_element",
+      "adapter": "xtend.component",
+      "tag": "x-radio",
+      "schedule": "ui.user-blocking.input",
+      "props": {
+        "name": "renderMode",
+        "label": "Shell-first",
+        "value": "shell-first",
+        "checked": true
+      },
+      "events": {
+        "radio-changed": {
+          "command": "settings.renderMode.changed"
+        }
+      },
+      "metadata": {
+        "fabric": {
+          "lane": "user-blocking",
+          "fiber": "component.event",
+          "telemetry": true
+        }
+      }
+    },
+    {
+      "id": "settings.notes",
+      "kind": "custom_element",
+      "adapter": "xtend.component",
+      "tag": "x-textarea",
+      "schedule": "component.idle.hydrate",
+      "props": {
+        "name": "notes",
+        "label": "Release notes",
+        "value": "The host provides only the RMT root. The shell is rendered from this document."
+      },
+      "events": {
+        "textarea-changed": {
+          "command": "settings.notes.changed"
+        }
+      },
+      "metadata": {
+        "fabric": {
+          "lane": "idle",
+          "fiber": "component.hydrate",
+          "telemetry": true
+        }
+      }
+    },
+    {
+      "id": "page.overlays",
+      "kind": "custom_element",
+      "adapter": "xtend.component",
+      "tag": "x-section",
+      "schedule": "component.visible.mount",
+      "props": {
+        "label": "Overlays"
+      },
+      "attributes": {
+        "layout": "column",
+        "data-rmt-route": "overlays"
+      },
+      "slots": {
+        "default": { "template": "page.overlays.template" }
+      },
+      "metadata": {
+        "fabric": {
+          "lane": "visible",
+          "fiber": "component.mount",
+          "telemetry": true
+        }
+      }
+    },
+    {
+      "id": "overlays.tooltip",
+      "kind": "custom_element",
+      "adapter": "xtend.component",
+      "tag": "x-tooltip",
+      "schedule": "overlay.visible.mount",
+      "props": {
+        "text": "RMT provides the tooltip record; XTend owns the custom element."
+      },
+      "metadata": {
+        "fabric": {
+          "lane": "visible",
+          "fiber": "overlay.mount",
+          "telemetry": true
+        }
+      }
+    },
+    {
+      "id": "overlays.popover",
+      "kind": "custom_element",
+      "adapter": "xtend.component",
+      "tag": "x-popover",
+      "schedule": "overlay.visible.mount",
+      "props": {
+        "label": "Route diagnostics"
+      },
+      "slots": {
+        "default": { "template": "overlays.popover.content" }
+      },
+      "metadata": {
+        "fabric": {
+          "lane": "visible",
+          "fiber": "overlay.mount",
+          "telemetry": true
+        }
+      }
+    },
+    {
+      "id": "overlays.drawer",
+      "kind": "custom_element",
+      "adapter": "xtend.component",
+      "tag": "x-drawer",
+      "schedule": "overlay.idle.hydrate",
+      "props": {
+        "label": "RMT Inspector"
+      },
+      "slots": {
+        "default": { "template": "overlays.drawer.content" }
+      },
+      "metadata": {
+        "fabric": {
+          "lane": "idle",
+          "fiber": "overlay.hydrate",
+          "telemetry": true
+        }
+      }
+    }
+  ],
+  "routes": [
+    {
+      "id": "dashboard",
+      "path": "/",
+      "router": "xtend.xrouter",
+      "component": "page.dashboard",
+      "template": "page.dashboard.template",
+      "shell": "app.shell.template",
+      "schedule": "route.visible.render",
+      "metadata": {
+        "title": "Dashboard",
+        "contentKind": "xtendComponentTree"
+      }
+    },
+    {
+      "id": "settings",
+      "path": "/settings",
+      "router": "xtend.xrouter",
+      "component": "page.settings",
+      "template": "page.settings.template",
+      "shell": "app.shell.template",
+      "schedule": "route.transition.render",
+      "metadata": {
+        "title": "Settings",
+        "contentKind": "xtendFormControls"
+      }
+    },
+    {
+      "id": "overlays",
+      "path": "/overlays",
+      "router": "xtend.xrouter",
+      "component": "page.overlays",
+      "template": "page.overlays.template",
+      "shell": "app.shell.template",
+      "schedule": "route.transition.render",
+      "metadata": {
+        "title": "Overlays",
+        "contentKind": "xtendOverlayControls"
+      }
+    }
+  ],
+  "schedules": [
+    {
+      "id": "app.shell.render",
+      "lane": "visible",
+      "fiber": "component.render",
+      "endpointName": "xtendrmt.shell.render",
+      "priority": 10,
+      "budgetMs": 16
+    },
+    {
+      "id": "route.visible.render",
+      "lane": "visible",
+      "fiber": "route.render",
+      "endpointName": "xtendrmt.route.render",
+      "priority": 20,
+      "budgetMs": 16
+    },
+    {
+      "id": "route.transition.render",
+      "lane": "user-blocking",
+      "fiber": "route.transition",
+      "endpointName": "xtendrmt.route.transition",
+      "priority": 30,
+      "budgetMs": 24
+    },
+    {
+      "id": "component.visible.mount",
+      "lane": "visible",
+      "fiber": "component.mount",
+      "endpointName": "xtendrmt.component.mount",
+      "priority": 40,
+      "budgetMs": 24
+    },
+    {
+      "id": "component.idle.hydrate",
+      "lane": "idle",
+      "fiber": "component.hydrate",
+      "endpointName": "xtendrmt.component.hydrate",
+      "priority": 70,
+      "budgetMs": 32,
+      "preferIdle": true
+    },
+    {
+      "id": "ui.user-blocking.input",
+      "lane": "user-blocking",
+      "fiber": "component.event",
+      "endpointName": "xtendrmt.component.input",
+      "priority": 15,
+      "budgetMs": 12
+    },
+    {
+      "id": "overlay.visible.mount",
+      "lane": "visible",
+      "fiber": "overlay.mount",
+      "endpointName": "xtendrmt.overlay.mount",
+      "priority": 35,
+      "budgetMs": 24
+    },
+    {
+      "id": "overlay.idle.hydrate",
+      "lane": "idle",
+      "fiber": "overlay.hydrate",
+      "endpointName": "xtendrmt.overlay.hydrate",
+      "priority": 80,
+      "budgetMs": 32,
+      "preferIdle": true
+    },
+    {
+      "id": "diagnostics.snapshot",
+      "lane": "diagnostics",
+      "fiber": "telemetry.snapshot",
+      "endpointName": "xtendrmt.diagnostics.snapshot",
+      "priority": 90,
+      "budgetMs": 16
+    }
+  ],
+  "templates": [
+    {
+      "id": "app.shell.template",
+      "mode": "dom_descriptor",
+      "metadata": {
+        "renderMode": "shell-first",
+        "manualShellAllowed": false
+      },
+      "nodes": [
+        {
+          "component": "app.shell"
+        }
+      ]
+    },
+    {
+      "id": "app.header",
+      "mode": "dom_descriptor",
+      "nodes": [
+        {
+          "tag": "header",
+          "attributes": {
+            "class": "rmt-first-demo-header"
+          },
+          "children": [
+            {
+              "tag": "div",
+              "attributes": {
+                "class": "rmt-first-demo-brand"
+              },
+              "children": [
+                {
+                  "tag": "strong",
+                  "text": "XTend RMT-first Demo"
+                },
+                {
+                  "tag": "span",
+                  "text": "Shell, routes and UI come from .rmt"
+                }
+              ]
+            },
+            {
+              "tag": "nav",
+              "attributes": {
+                "aria-label": "RMT first demo navigation"
+              },
+              "children": [
+                {
+                  "tag": "x-link",
+                  "attributes": {
+                    "href": "#/",
+                    "data-route": "dashboard"
+                  },
+                  "text": "Dashboard"
+                },
+                {
+                  "tag": "x-link",
+                  "attributes": {
+                    "href": "#/settings",
+                    "data-route": "settings"
+                  },
+                  "text": "Settings"
+                },
+                {
+                  "tag": "x-link",
+                  "attributes": {
+                    "href": "#/overlays",
+                    "data-route": "overlays"
+                  },
+                  "text": "Overlays"
+                }
+              ]
+            }
+          ]
+        }
+      ]
+    },
+    {
+      "id": "page.dashboard.template",
+      "mode": "dom_descriptor",
+      "nodes": [
+        {
+          "tag": "main",
+          "attributes": {
+            "class": "rmt-first-demo-page"
+          },
+          "children": [
+            {
+              "tag": "h1",
+              "text": "RMT orchestrates the app shell."
+            },
+            {
+              "tag": "p",
+              "text": "The host only provides a root node. RMT schedules the shell, routes, diagnostics and XTend component tree."
+            },
+            {
+              "component": "dashboard.status"
+            },
+            {
+              "component": "dashboard.progress"
+            }
+          ]
+        }
+      ]
+    },
+    {
+      "id": "page.settings.template",
+      "mode": "dom_descriptor",
+      "metadata": {
+        "route": "settings",
+        "lazySchedule": "component.idle.hydrate"
+      },
+      "nodes": [
+        {
+          "tag": "section",
+          "attributes": {
+            "class": "rmt-first-demo-page"
+          },
+          "children": [
+            {
+              "tag": "h1",
+              "text": "Controls are XTend components."
+            },
+            {
+              "tag": "p",
+              "text": "The RMT document provides props, attributes, events, lanes and schedules for each control."
+            },
+            {
+              "component": "settings.delivery"
+            },
+            {
+              "component": "settings.telemetry"
+            },
+            {
+              "component": "settings.renderMode"
+            },
+            {
+              "component": "settings.notes"
+            }
+          ]
+        }
+      ]
+    },
+    {
+      "id": "page.overlays.template",
+      "mode": "dom_descriptor",
+      "metadata": {
+        "route": "overlays",
+        "lazySchedule": "overlay.visible.mount"
+      },
+      "nodes": [
+        {
+          "tag": "section",
+          "attributes": {
+            "class": "rmt-first-demo-page"
+          },
+          "children": [
+            {
+              "tag": "h1",
+              "text": "Overlays stay scheduled."
+            },
+            {
+              "tag": "p",
+              "text": "Tooltip, popover and drawer records carry their own lane and fiber metadata."
+            },
+            {
+              "component": "overlays.tooltip"
+            },
+            {
+              "component": "overlays.popover"
+            },
+            {
+              "component": "overlays.drawer"
+            }
+          ]
+        }
+      ]
+    },
+    {
+      "id": "overlays.popover.content",
+      "mode": "dom_descriptor",
+      "nodes": [
+        {
+          "tag": "p",
+          "text": "Route diagnostics are available through the RMT registries and Fabric telemetry bridge."
+        }
+      ]
+    },
+    {
+      "id": "overlays.drawer.content",
+      "mode": "dom_descriptor",
+      "nodes": [
+        {
+          "tag": "p",
+          "text": "This drawer is an XTend component scheduled by an RMT overlay hydration lane."
+        }
+      ]
+    }
+  ],
+  "diagnostics": {
+    "schema": "xtend.epic10.rmt-first-demo-diagnostics.v1",
+    "manualShellChecks": [
+      "host-html-no-static-x-section",
+      "host-html-no-static-x-router",
+      "renderer-no-innerHTML",
+      "shell-template-from-rmt-document"
+    ],
+    "requiredBrowserChecks": [
+      "rmt-first demo document loaded",
+      "rmt-first demo shell rendered from rmt",
+      "rmt-first demo routes derived from rmt",
+      "rmt-first demo telemetry schedule visible"
+    ]
+  }
+}