{
  "type": "document",
  "pos": {
    "line": 1,
    "column": 1
  },
  "endLine": 51,
  "meta": {
    "filename": "/Users/andreaferrarelli/code/noma/examples/interactive-projection.noma",
    "title": "Interactive Projection Demo",
    "author": "ferax564",
    "date": "2026-06-04T00:00:00.000Z"
  },
  "children": [
    {
      "type": "frontmatter",
      "data": {
        "title": "Interactive Projection Demo",
        "author": "ferax564",
        "date": "2026-06-04T00:00:00.000Z"
      },
      "raw": "title: Interactive Projection Demo\nauthor: ferax564\ndate: 2026-06-04",
      "pos": {
        "line": 1,
        "column": 1
      },
      "endLine": 5
    },
    {
      "type": "section",
      "id": "interactive-projection-demo",
      "level": 1,
      "title": "Interactive Projection Demo",
      "children": [
        {
          "type": "paragraph",
          "content": "This artifact models a simple account expansion plan. The controls update\ncomputed metrics, a chart, and a table in the browser; the current control\nstate is stored in the URL hash so the scenario can be shared.",
          "pos": {
            "line": 9,
            "column": 1
          },
          "endLine": 11
        },
        {
          "type": "directive",
          "name": "grid",
          "attrs": {
            "columns": 3,
            "min": "13rem",
            "gap": "0.8rem",
            "wide": true,
            "compact": true
          },
          "children": [
            {
              "type": "directive",
              "name": "control",
              "attrs": {
                "id": "accounts",
                "type": "number",
                "min": 50,
                "max": 1000,
                "step": 25,
                "default": 250,
                "label": "Starting accounts",
                "unit": "accounts"
              },
              "children": [],
              "pos": {
                "line": 14,
                "column": 1
              },
              "endLine": 15,
              "id": "accounts"
            },
            {
              "type": "directive",
              "name": "control",
              "attrs": {
                "id": "growth_rate",
                "type": "slider",
                "min": 0,
                "max": 45,
                "step": 1,
                "default": 18,
                "label": "Annual growth",
                "unit": "%"
              },
              "children": [],
              "pos": {
                "line": 17,
                "column": 1
              },
              "endLine": 18,
              "id": "growth_rate"
            },
            {
              "type": "directive",
              "name": "control",
              "attrs": {
                "id": "retention",
                "type": "slider",
                "min": 70,
                "max": 100,
                "step": 1,
                "default": 92,
                "label": "Retention",
                "unit": "%"
              },
              "children": [],
              "pos": {
                "line": 20,
                "column": 1
              },
              "endLine": 21,
              "id": "retention"
            }
          ],
          "pos": {
            "line": 13,
            "column": 1
          },
          "endLine": 22
        },
        {
          "type": "directive",
          "name": "grid",
          "attrs": {
            "columns": 3,
            "min": "14rem",
            "gap": "0.8rem",
            "wide": true,
            "compact": true
          },
          "children": [
            {
              "type": "directive",
              "name": "computed_metric",
              "attrs": {
                "id": "year_3_accounts",
                "label": "Year 3 accounts",
                "formula": "round(accounts * pow(1 + growth_rate / 100, 3) * pow(retention / 100, 3), 0)",
                "unit": "accounts"
              },
              "children": [
                {
                  "type": "paragraph",
                  "content": "The static value comes from defaults; browser controls recompute it instantly.",
                  "pos": {
                    "line": 26,
                    "column": 1
                  },
                  "endLine": 26
                }
              ],
              "pos": {
                "line": 25,
                "column": 1
              },
              "endLine": 27,
              "id": "year_3_accounts",
              "body": "The static value comes from defaults; browser controls recompute it instantly."
            },
            {
              "type": "directive",
              "name": "computed_metric",
              "attrs": {
                "id": "year_5_accounts",
                "label": "Year 5 accounts",
                "formula": "round(accounts * pow(1 + growth_rate / 100, 5) * pow(retention / 100, 5), 0)",
                "unit": "accounts"
              },
              "children": [
                {
                  "type": "paragraph",
                  "content": "This block can be referenced by downstream computed blocks or exported to LLM context.",
                  "pos": {
                    "line": 30,
                    "column": 1
                  },
                  "endLine": 30
                }
              ],
              "pos": {
                "line": 29,
                "column": 1
              },
              "endLine": 31,
              "id": "year_5_accounts",
              "body": "This block can be referenced by downstream computed blocks or exported to LLM context."
            },
            {
              "type": "directive",
              "name": "computed_metric",
              "attrs": {
                "id": "net_growth",
                "label": "Net annual growth",
                "formula": "round(((1 + growth_rate / 100) * (retention / 100) - 1) * 100, 1)",
                "unit": "%"
              },
              "children": [
                {
                  "type": "paragraph",
                  "content": "The formula language supports arithmetic, comparisons, and simple functions.",
                  "pos": {
                    "line": 34,
                    "column": 1
                  },
                  "endLine": 34
                }
              ],
              "pos": {
                "line": 33,
                "column": 1
              },
              "endLine": 35,
              "id": "net_growth",
              "body": "The formula language supports arithmetic, comparisons, and simple functions."
            }
          ],
          "pos": {
            "line": 24,
            "column": 1
          },
          "endLine": 36
        },
        {
          "type": "directive",
          "name": "computed_plot",
          "attrs": {
            "id": "accounts_curve",
            "label": "Account curve",
            "formula": "round(accounts * pow(1 + growth_rate / 100, year) * pow(retention / 100, year), 0)",
            "domain": "year:0..5",
            "type": "bar",
            "width": 720,
            "height": 220,
            "x_label_wrap": 6
          },
          "children": [],
          "pos": {
            "line": 38,
            "column": 1
          },
          "endLine": 39,
          "id": "accounts_curve"
        },
        {
          "type": "directive",
          "name": "computed_table",
          "attrs": {
            "id": "accounts_table",
            "label": "Scenario table",
            "formula": "round(accounts * pow(1 + growth_rate / 100, year) * pow(retention / 100, year), 0)",
            "domain": "year:0..5",
            "unit": "accounts",
            "variable_label": "Year",
            "value_label": "Projected accounts"
          },
          "children": [
            {
              "type": "paragraph",
              "content": "Share a scenario by copying the URL after moving the controls.",
              "pos": {
                "line": 42,
                "column": 1
              },
              "endLine": 42
            }
          ],
          "pos": {
            "line": 41,
            "column": 1
          },
          "endLine": 43,
          "id": "accounts_table",
          "body": "Share a scenario by copying the URL after moving the controls."
        },
        {
          "type": "directive",
          "name": "export_button",
          "attrs": {
            "format": "llm",
            "target": "document"
          },
          "children": [
            {
              "type": "paragraph",
              "content": "Label: Copy LLM context",
              "pos": {
                "line": 46,
                "column": 1
              },
              "endLine": 46
            }
          ],
          "pos": {
            "line": 45,
            "column": 1
          },
          "endLine": 47,
          "body": "Label: Copy LLM context"
        },
        {
          "type": "directive",
          "name": "export_button",
          "attrs": {
            "format": "json",
            "target": "document"
          },
          "children": [
            {
              "type": "paragraph",
              "content": "Label: Copy JSON AST",
              "pos": {
                "line": 50,
                "column": 1
              },
              "endLine": 50
            }
          ],
          "pos": {
            "line": 49,
            "column": 1
          },
          "endLine": 51,
          "body": "Label: Copy JSON AST"
        }
      ],
      "pos": {
        "line": 7,
        "column": 1
      },
      "endLine": 51,
      "aliases": [
        "interactive-projection"
      ]
    }
  ]
}