Task board

A draggable issue board driven by A2UI. Columns and cards bind to the data model; dragging a card to another column rewrites its column and order in the model — the A2UI two-way binding, no agent round-trip.

[  {    "createSurface": {      "surfaceId": "main",      "catalogId": "urn:flab-ui:a2ui:catalog:v1"    },    "version": "v1.0"  },  {    "updateComponents": {      "surfaceId": "main",      "components": [        {          "id": "root",          "component": "Column",          "children": [            "title",            "board"          ],          "gap": "md"        },        {          "id": "title",          "component": "Text",          "text": "Sprint 24",          "variant": "title"        },        {          "id": "board",          "component": "TaskBoard",          "columns": {            "path": "/columns"          },          "cards": {            "path": "/cards"          }        }      ]    },    "version": "v1.0"  },  {    "updateDataModel": {      "surfaceId": "main",      "value": {        "columns": [          {            "id": "todo",            "title": "To do",            "tone": "neutral"          },          {            "id": "doing",            "title": "In progress",            "tone": "warning",            "wipLimit": 2          },          {            "id": "done",            "title": "Done",            "tone": "success"          }        ],        "cards": [          {            "id": "c1",            "columnId": "todo",            "title": "Spec the public API",            "issueKey": "A2UI-11",            "tag": {              "label": "Renderer",              "tone": "info"            },            "points": 3          },          {            "id": "c2",            "columnId": "todo",            "title": "Design empty states",            "issueKey": "A2UI-12",            "points": 2          },          {            "id": "c3",            "columnId": "doing",            "title": "Build the catalog",            "issueKey": "A2UI-9",            "tag": {              "label": "Core",              "tone": "alt"            },            "progress": 60,            "points": 5          },          {            "id": "c4",            "columnId": "done",            "title": "Transport layer",            "issueKey": "A2UI-4",            "accent": "success",            "done": true          }        ]      }    },    "version": "v1.0"  }]

[
  {
    "createSurface": {
      "surfaceId": "main",
      "catalogId": "urn:flab-ui:a2ui:catalog:v1"
    },
    "version": "v1.0"
  },
  {
    "updateComponents": {
      "surfaceId": "main",
      "components": [
        {
          "id": "root",
          "component": "Column",
          "children": [
            "title",
            "board"
          ],
          "gap": "md"
        },
        {
          "id": "title",
          "component": "Text",
          "text": "Sprint 24",
          "variant": "title"
        },
        {
          "id": "board",
          "component": "TaskBoard",
          "columns": {
            "path": "/columns"
          },
          "cards": {
            "path": "/cards"
          }
        }
      ]
    },
    "version": "v1.0"
  },
  {
    "updateDataModel": {
      "surfaceId": "main",
      "value": {
        "columns": [
          {
            "id": "todo",
            "title": "To do",
            "tone": "neutral"
          },
          {
            "id": "doing",
            "title": "In progress",
            "tone": "warning",
            "wipLimit": 2
          },
          {
            "id": "done",
            "title": "Done",
            "tone": "success"
          }
        ],
        "cards": [
          {
            "id": "c1",
            "columnId": "todo",
            "title": "Spec the public API",
            "issueKey": "A2UI-11",
            "tag": {
              "label": "Renderer",
              "tone": "info"
            },
            "points": 3
          },
          {
            "id": "c2",
            "columnId": "todo",
            "title": "Design empty states",
            "issueKey": "A2UI-12",
            "points": 2
          },
          {
            "id": "c3",
            "columnId": "doing",
            "title": "Build the catalog",
            "issueKey": "A2UI-9",
            "tag": {
              "label": "Core",
              "tone": "alt"
            },
            "progress": 60,
            "points": 5
          },
          {
            "id": "c4",
            "columnId": "done",
            "title": "Transport layer",
            "issueKey": "A2UI-4",
            "accent": "success",
            "done": true
          }
        ]
      }
    },
    "version": "v1.0"
  }
]

Rendered with Flab components

Sprint 24

To do2

Renderer

Spec the public API

A2UI-113

Design empty states

A2UI-122

In progress1/2

Core

Build the catalog

60%

A2UI-95

Done1

Transport layer

A2UI-4