Files
webstudio/apps
Bogdan Chadkin 09d2b77151 Support effectful expression arguments (#1967)
Here added support for expression arguments to utilize callback based
state management. So for example Form component can expose onStateChange
action with "newState" value and update any variable with it. So all
state management inside form becomes prop and callback.

You can test it by pasting

<details>
<summary>You can test by pasting this template and clicking on
+</summary>

```ison
{
  "@webstudio/template": [
    {
      "type": "instance",
      "component": "Box",
      "props": [
        {
          "type": "number",
          "name": "data-count",
          "value": 0,
          "dataSourceRef": {
            "type": "variable",
            "name": "count"
          }
        }
      ],
      "styles": [
        {
          "property": "display",
          "value": { "type": "keyword", "value": "flex" }
        }
      ],
      "children": [
        {
          "type": "instance",
          "component": "Button",
          "props": [
            {
              "type": "action",
              "name": "onClick",
              "value": [
                {
                  "type": "execute",
                  "code": "count = count - 1"
                }
              ]
            }
          ],
          "children": [{ "type": "text", "value": "-" }]
        },
        {
          "type": "instance",
          "component": "Box",
          "props": [
            {
              "type": "string",
              "name": "data-count",
              "value": "",
              "dataSourceRef": {
                "type": "expression",
                "name": "countString",
                "code": "\"0\" + count"
              }
            }
          ],
          "styles": [
            {
              "state": "::before",
              "property": "content",
              "value": { "type": "unparsed", "value": "attr(data-count)" }
            }
          ],
          "children": []
        },
        {
          "type": "instance",
          "component": "Button",
          "props": [
            {
              "type": "action",
              "name": "onClick",
              "value": [
                {
                  "type": "execute",
                  "args": ["event"],
                  "code": "count = count + 1 + event"
                }
              ]
            }
          ],
          "children": [{ "type": "text", "value": "+" }]
        }
      ]
    }
  ]
}
```

</details>
2023-07-24 20:14:01 +03:00
..