add extended Button example

Button/button.json

+{
+  "svg": "button.svg",
+  "items": [
+    {
+      "id": "button",
+      "attr": "fill",
+      "value": "IF button=TRUE THEN \"green\" ELSE \"red\" END"
+    },
+    {
+      "id": "button",
+      "attr": "stroke-width",
+      "value": "IF ENABLED(\"press_button\") THEN 6 ELSE 1 END"
+    },
+    {
+      "id": "button_%0",
+      "attr": "visibility",
+      "value": "IF button=%0 THEN \"visible\" ELSE \"hidden\" END",
+      "repeat": [ "TRUE", "FALSE" ]
+    }
+  ],
+  "events": [
+    {
+      "id": "button",
+      "event": "toggle_button"
+    },
+    {
+      "id": "button_TRUE",
+      "event": "toggle_button"
+    },
+    {
+      "id": "button_FALSE",
+      "event": "press_button"
+    }
+  ]
+}

Button/button.mch

+MACHINE button
+DEFINITIONS "LibraryMeta.def"
+VARIABLES
+  button
+INVARIANT
+  button:BOOL
+INITIALISATION
+  button := FALSE
+OPERATIONS
+  press_button = PRE button=FALSE THEN
+    button:=TRUE
+  END;
+  toggle_button = BEGIN
+    button:= bool(button=FALSE)
+  END
+END
\ No newline at end of file

Button/button.svg

+<svg height="230" width="200">
+  <circle id="button" cx="100" cy="100" r="80"
+    stroke="black" stroke-width="3" fill="green" />
+    <text  text-align="left"  x="50"  y="190"
+        font-family="sans-serif">
+       <tspan dx="0" dy = "0.6em" id="visb_debug_messages">1.</tspan>
+    </text>
+    <circle id="button_TRUE" cx="10" cy="200" r="8"
+    stroke="black" stroke-width="3" fill="green" />
+    <circle id="button_FALSE" cx="30" cy="200" r="8"
+    stroke="black" stroke-width="3" fill="red" />
+</svg>