zui 0.0.1

data/Components/Builtins/Snackbar.qml

@@ -0,0 +1,181 @@
+import QtQuick
+import QtQuick.Controls as QQC
+import "../../Theme"
+
+QQC.Popup {
+  id: snackbarRoot
+
+  required property var renderer
+  readonly property bool requestedOpen: renderer.prop("opened", false) === true
+    && renderer.prop("visible", true) !== false
+  readonly property real popupMargin: Number(renderer.prop("margin", Style.spacing.lg))
+  readonly property real maximumWidth: Number(renderer.prop("max_width", 560))
+  readonly property string popupPosition: String(renderer.prop("position", "bottom_center"))
+  property real remainingDuration: 0
+  property double timeoutDeadline: 0
+
+  function syncOpenState() {
+    if (requestedOpen === opened) return
+    if (requestedOpen) open()
+    else close()
+  }
+
+  function timed() {
+    return renderer.prop("persistent", false) !== true
+      && Number(renderer.prop("duration", 4000)) > 0
+  }
+
+  function startTimeout() {
+    dismissTimer.stop()
+    if (!visible || !timed()) return
+    remainingDuration = Number(renderer.prop("duration", 4000))
+    resumeTimeout()
+  }
+
+  function pauseTimeout() {
+    if (!dismissTimer.running) return
+    remainingDuration = Math.max(1, timeoutDeadline - Date.now())
+    dismissTimer.stop()
+  }
+
+  function resumeTimeout() {
+    if (!visible || !timed() || remainingDuration <= 0) return
+    timeoutDeadline = Date.now() + remainingDuration
+    dismissTimer.interval = remainingDuration
+    dismissTimer.restart()
+  }
+
+  function dismiss(reason) {
+    renderer.bridge.sendEvent(renderer.surfaceName, renderer.controlId, "dismiss", { reason: reason })
+    close()
+  }
+
+  x: {
+    if (!parent) return popupMargin
+    if (popupPosition.indexOf("left") >= 0) return popupMargin
+    if (popupPosition.indexOf("right") >= 0) return parent.width - width - popupMargin
+    return Math.max(popupMargin, (parent.width - width) / 2)
+  }
+  y: {
+    if (!parent) return popupMargin
+    if (popupPosition.indexOf("top") === 0) return popupMargin
+    return parent.height - height - popupMargin
+  }
+  width: {
+    var available = parent ? Math.max(0, parent.width - popupMargin * 2) : maximumWidth
+    return Math.min(Number(renderer.prop("width", maximumWidth)), available, maximumWidth)
+  }
+  modal: false
+  dim: false
+  focus: false
+  closePolicy: QQC.Popup.NoAutoClose
+  enabled: renderer.prop("enabled", true) !== false
+  padding: Number(renderer.prop("padding", Style.spacing.md))
+
+  background: Rectangle {
+    color: renderer.prop("background", Color.popups.background)
+    radius: Number(renderer.prop("radius", Style.cornerRadius))
+    border.width: String(renderer.prop("border_color", "")).length > 0 ? Style.normalBorderWidth : 0
+    border.color: renderer.prop("border_color", "transparent")
+  }
+
+  contentItem: Row {
+    spacing: Number(renderer.prop("spacing", Style.spacing.md))
+
+    Text {
+      width: Math.max(0, parent.width - (actionButton.visible ? actionButton.width + parent.spacing : 0))
+      anchors.verticalCenter: parent.verticalCenter
+      text: String(renderer.prop("message", ""))
+      color: renderer.prop("foreground", renderer.foreground)
+      font.family: String(renderer.prop("font_family", renderer.fontFamily))
+      font.pixelSize: Number(renderer.prop("font_size", Style.font.body))
+      wrapMode: Text.Wrap
+    }
+
+    QQC.Button {
+      id: actionButton
+      anchors.verticalCenter: parent.verticalCenter
+      visible: text.length > 0
+      text: String(renderer.prop("action_text", ""))
+      font.family: String(renderer.prop("font_family", renderer.fontFamily))
+      font.pixelSize: Number(renderer.prop("font_size", Style.font.body))
+      contentItem: Text {
+        text: actionButton.text
+        color: renderer.prop("action_color", Color.accent)
+        font: actionButton.font
+        horizontalAlignment: Text.AlignHCenter
+        verticalAlignment: Text.AlignVCenter
+      }
+      background: Rectangle { color: "transparent" }
+      onClicked: {
+        renderer.bridge.sendEvent(renderer.surfaceName, renderer.controlId, "action", {})
+        if (renderer.prop("close_on_action", true) !== false) snackbarRoot.dismiss("action")
+      }
+    }
+  }
+
+  HoverHandler {
+    enabled: renderer.prop("pause_on_hover", true) !== false
+    onHoveredChanged: {
+      renderer.bridge.sendEvent(renderer.surfaceName, renderer.controlId, "hover", { value: hovered })
+      if (hovered) snackbarRoot.pauseTimeout()
+      else snackbarRoot.resumeTimeout()
+    }
+  }
+
+  Timer {
+    id: dismissTimer
+    repeat: false
+    onTriggered: {
+      renderer.bridge.sendEvent(renderer.surfaceName, renderer.controlId, "timeout", {})
+      snackbarRoot.dismiss("timeout")
+    }
+  }
+
+  enter: Transition {
+    ParallelAnimation {
+      NumberAnimation {
+        property: "opacity"; from: 0; to: 1
+        duration: renderer.prop("animated", true) !== false
+          ? Number(renderer.prop("animation_duration", 180)) : 0
+        easing.type: renderer.easingType(renderer.prop("easing", "out_cubic"))
+      }
+      NumberAnimation {
+        property: "scale"; from: 0.96; to: 1
+        duration: renderer.prop("animated", true) !== false
+          ? Number(renderer.prop("animation_duration", 180)) : 0
+        easing.type: renderer.easingType(renderer.prop("easing", "out_cubic"))
+      }
+    }
+  }
+
+  exit: Transition {
+    ParallelAnimation {
+      NumberAnimation {
+        property: "opacity"; from: 1; to: 0
+        duration: renderer.prop("animated", true) !== false
+          ? Number(renderer.prop("animation_duration", 140)) : 0
+        easing.type: renderer.easingType("in_cubic")
+      }
+      NumberAnimation {
+        property: "scale"; from: 1; to: 0.96
+        duration: renderer.prop("animated", true) !== false
+          ? Number(renderer.prop("animation_duration", 140)) : 0
+        easing.type: renderer.easingType("in_cubic")
+      }
+    }
+  }
+
+  Component.onCompleted: syncOpenState()
+  onRequestedOpenChanged: syncOpenState()
+  onOpened: {
+    renderer.bridge.sendEvent(renderer.surfaceName, renderer.controlId, "open", {})
+    startTimeout()
+  }
+  onClosed: {
+    dismissTimer.stop()
+    renderer.bridge.sendEvent(renderer.surfaceName, renderer.controlId, "close", {})
+  }
+  onVisibleChanged: renderer.bridge.sendEvent(renderer.surfaceName, renderer.controlId,
+    visible ? "show" : "hide", {})
+}

data/Components/Builtins/SortFilterProxyModel.qml

@@ -0,0 +1,16 @@
+import QtQuick
+import QtQml.Models
+
+Item {
+  id:proxyRoot;property var renderer:null;property alias model:nativeProxy
+  function rebuild(){sourceModel.clear();var items=renderer?renderer.prop("items",[]):[];var requested=String(renderer?renderer.prop("filter",""):"");var field=String(renderer?renderer.prop("filter_field","value"):"value");var sensitive=renderer&&renderer.prop("filter_case_sensitive",false)===true;for(var i=0;i<items.length;i++){var item=items[i];var row=item!==null&&typeof item==="object"&&!Array.isArray(item)?item:{value:item};var value=String(row[field]===undefined?"":row[field]);if(requested!==""&&(sensitive?value.indexOf(requested)<0:value.toLowerCase().indexOf(requested.toLowerCase())<0))continue;sourceModel.append(row)}nativeProxy.invalidate();if(renderer)renderer.bridge.sendEvent(renderer.surfaceName,renderer.controlId,"change",{count:nativeProxy.rowCount()})}
+  ListModel{id:sourceModel}
+  SortFilterProxyModel{
+    id:nativeProxy;model:sourceModel;dynamicSortFilter:!renderer||renderer.prop("dynamic",true)!==false;recursiveFiltering:renderer&&renderer.prop("recursive",false)===true;autoAcceptChildRows:renderer&&renderer.prop("auto_accept_children",false)===true
+    filters:[]
+    sorters:[StringSorter{enabled:renderer&&String(renderer.prop("sort_field",""))!=="";roleName:String(renderer?renderer.prop("sort_field","value"):"value");sortOrder:String(renderer?renderer.prop("sort_order","ascending"):"ascending")==="descending"?Qt.DescendingOrder:Qt.AscendingOrder;caseSensitivity:renderer&&renderer.prop("sort_case_sensitive",false)===true?Qt.CaseSensitive:Qt.CaseInsensitive}]
+    onRowsInserted:function(parent,first,last){if(renderer)renderer.bridge.sendEvent(renderer.surfaceName,renderer.controlId,"count_change",{value:rowCount()})}
+    onRowsRemoved:function(parent,first,last){if(renderer)renderer.bridge.sendEvent(renderer.surfaceName,renderer.controlId,"count_change",{value:rowCount()})}
+  }
+  Component.onCompleted:rebuild();Connections{target:renderer;function onNodeChanged(){proxyRoot.rebuild()}}
+}

data/Components/Builtins/SoundEffect.qml

@@ -0,0 +1,10 @@
+import QtQuick
+import QtMultimedia
+
+Item {
+  id:soundRoot;property var renderer:null;property alias soundEffect:nativeSound;property int handledCommandRevision:-1
+  function send(name,payload){if(renderer&&renderer.subscribed(name))renderer.bridge.sendEvent(renderer.surfaceName,renderer.controlId,name,payload||{})}
+  function command(){if(!renderer)return;var revision=Number(renderer.prop("command_revision",0));if(revision===handledCommandRevision)return;handledCommandRevision=revision;var value=String(renderer.prop("command",renderer.prop("playback","")));if(value==="play")nativeSound.play();else if(value==="stop")nativeSound.stop()}
+  SoundEffect{id:nativeSound;source:renderer?renderer.assetUrl(renderer.prop("source","")):"";loops:Number(renderer?renderer.prop("loops",1):1);volume:Math.max(0,Math.min(1,Number(renderer?renderer.prop("volume",1):1)));muted:renderer&&renderer.prop("muted",false)===true;onPlayingChanged:soundRoot.send(playing?"play":"stop",{});onStatusChanged:{soundRoot.send("status",{value:status});if(status===SoundEffect.Error)renderer.componentError("sound_effect_load_failed","Unable to load the declared sound effect",{source:String(source)})}onLoopsRemainingChanged:soundRoot.send("loops_remaining",{value:loopsRemaining})}
+  Component.onCompleted:command();Connections{target:renderer;function onNodeChanged(){soundRoot.command()}}
+}

data/Components/Builtins/Spacer.qml

@@ -0,0 +1,13 @@
+import QtQuick
+import QtQuick.Controls as QQC
+import QtQuick.Layouts
+import QtMultimedia
+import QtQuick.VectorImage
+import "../../Theme"
+import "../../Controls" as ZuiControls
+
+Item {
+  required property var renderer
+      implicitWidth: Number(renderer.prop("width", 0))
+      implicitHeight: Number(renderer.prop("height", Style.space(8)))
+    }

data/Components/Builtins/Sparkline.qml

@@ -0,0 +1,3 @@
+import QtQuick
+import "Support" as Support
+Support.ChartCanvas { renderer: null; chartType: "sparkline" }

data/Components/Builtins/SpinBox.qml

@@ -0,0 +1,44 @@
+import QtQuick
+import QtQuick.Controls as QQC
+import QtQuick.Layouts
+import QtMultimedia
+import QtQuick.VectorImage
+import "../../Theme"
+import "../../Controls" as ZuiControls
+
+QQC.SpinBox {
+  required property var renderer
+      id: nativeSpinBox
+      from: Number(renderer.prop("minimum", 0))
+      to: Number(renderer.prop("maximum", 100))
+      value: Number(renderer.prop("value", from))
+      stepSize: Number(renderer.prop("step", 1))
+      editable: renderer.prop("editable", true) !== false
+      wrap: renderer.prop("wrap", false) === true
+      enabled: renderer.prop("enabled", true) !== false
+      implicitWidth: Number(renderer.prop("width", 140))
+      font.family: String(renderer.prop("font_family", renderer.fontFamily))
+      font.pixelSize: Number(renderer.prop("font_size", Style.font.body))
+      palette.text: renderer.prop("foreground", renderer.foreground)
+      palette.buttonText: renderer.prop("foreground", renderer.foreground)
+      palette.button: renderer.prop("background", Color.popups.background)
+      palette.highlight: renderer.prop("accent", Color.accent)
+      textFromValue: function(value, locale) {
+        return String(renderer.prop("prefix", "")) + Number(value).toLocaleString(locale, "f", 0) + String(renderer.prop("suffix", ""))
+      }
+      valueFromText: function(text, locale) {
+        var prefix = String(renderer.prop("prefix", ""))
+        var suffix = String(renderer.prop("suffix", ""))
+        var numeric = String(text)
+        if (prefix.length > 0 && numeric.indexOf(prefix) === 0) numeric = numeric.slice(prefix.length)
+        if (suffix.length > 0 && numeric.lastIndexOf(suffix) === numeric.length - suffix.length) numeric = numeric.slice(0, -suffix.length)
+        return Number.fromLocaleString(locale, numeric)
+      }
+      onValueModified: renderer.bridge.sendEvent(renderer.surfaceName, renderer.controlId, "change", { value: value })
+      up.onPressedChanged: {
+        if (up.pressed) renderer.bridge.sendEvent(renderer.surfaceName, renderer.controlId, "increase", { value: value })
+      }
+      down.onPressedChanged: {
+        if (down.pressed) renderer.bridge.sendEvent(renderer.surfaceName, renderer.controlId, "decrease", { value: value })
+      }
+    }

data/Components/Builtins/SplitView.qml

@@ -0,0 +1,31 @@
+import QtQuick
+import QtQuick.Controls as QQC
+import QtQuick.Layouts
+import QtMultimedia
+import QtQuick.VectorImage
+import "../../Theme"
+import "../../Controls" as ZuiControls
+
+QQC.SplitView {
+  required property var renderer
+      implicitWidth: Number(renderer.prop("width", 560))
+      implicitHeight: Number(renderer.prop("height", 320))
+      orientation: String(renderer.prop("orientation", "horizontal")) === "vertical" ? Qt.Vertical : Qt.Horizontal
+      function currentSizes() {
+        var sizes = []
+        for (var index = 0; index < splitChildren.count; index++) {
+          var child = splitChildren.itemAt(index)
+          sizes.push(orientation === Qt.Horizontal ? child.width : child.height)
+        }
+        return sizes
+      }
+      onResizingChanged: {
+        if (!resizing && renderer.subscribed("resize"))
+          renderer.bridge.sendEvent(renderer.surfaceName, renderer.controlId, "resize", { sizes: currentSizes() })
+      }
+      Repeater {
+        id: splitChildren
+        model: renderer.node.children || []
+        delegate: renderer.splitChildDelegateComponent
+      }
+    }

data/Components/Builtins/SpringAnimation.qml

@@ -0,0 +1,3 @@
+import QtQuick
+import "Support" as Support
+Support.AnimationDriver { renderer: null; animationType: "spring" }

data/Components/Builtins/Stack.qml

@@ -0,0 +1,14 @@
+import QtQuick
+import QtQuick.Controls as QQC
+import QtQuick.Layouts
+import QtMultimedia
+import QtQuick.VectorImage
+import "../../Theme"
+import "../../Controls" as ZuiControls
+
+Item {
+  required property var renderer
+      implicitWidth: childrenRect.width
+      implicitHeight: childrenRect.height
+      Repeater { model: renderer.node.children || []; delegate: renderer.childDelegateComponent }
+    }

data/Components/Builtins/StackLayout.qml

@@ -0,0 +1,19 @@
+import QtQuick
+import QtQuick.Controls as QQC
+import QtQuick.Layouts
+import QtMultimedia
+import QtQuick.VectorImage
+import "../../Theme"
+import "../../Controls" as ZuiControls
+
+StackLayout {
+  required property var renderer
+      implicitWidth: Number(renderer.prop("width", 420))
+      implicitHeight: Number(renderer.prop("height", 280))
+      currentIndex: Math.max(0, Math.min(count - 1, Number(renderer.prop("current_index", 0))))
+      onCurrentIndexChanged: {
+        if (renderer.subscribed("change"))
+          renderer.bridge.sendEvent(renderer.surfaceName, renderer.controlId, "change", { value: currentIndex })
+      }
+      Repeater { model: renderer.node.children || []; delegate: renderer.layoutChildDelegateComponent }
+    }

data/Components/Builtins/StackView.qml

@@ -0,0 +1,122 @@
+import QtQuick
+import QtQuick.Controls as QQC
+import "../../Theme"
+
+QQC.StackView {
+  id: stackRoot
+
+  required property var renderer
+  readonly property int childCount: renderer.node && Array.isArray(renderer.node.children)
+    ? renderer.node.children.length : 0
+  readonly property string childSignature: {
+    var ids = []
+    for (var index = 0; index < childCount; index++) ids.push(String(renderer.node.children[index].id))
+    return ids.join("\u001f")
+  }
+  readonly property int requestedIndex: Number(renderer.prop("current_index", 0))
+  property var pageObjects: []
+  property bool initialized: false
+  property bool rebuilding: false
+
+  function boundedIndex(value) {
+    return childCount === 0 ? -1 : Math.max(0, Math.min(childCount - 1, Number(value)))
+  }
+
+  function operationFor(target) {
+    return renderer.prop("animated", true) !== false && initialized
+      && Math.abs(target - (depth - 1)) === 1
+      ? QQC.StackView.PushTransition : QQC.StackView.Immediate
+  }
+
+  function pageAt(index) {
+    if (pageObjects[index]) return pageObjects[index]
+    var page = renderer.childDelegateComponent.createObject(stackRoot, {
+      modelData: renderer.node.children[index]
+    })
+    if (!page) return null
+    var pages = pageObjects.slice(0)
+    pages[index] = page
+    pageObjects = pages
+    return page
+  }
+
+  function syncNavigation() {
+    if (!initialized || rebuilding || busy) return
+    var target = boundedIndex(requestedIndex)
+    if (target < 0) {
+      if (depth > 0) clear(QQC.StackView.Immediate)
+      return
+    }
+
+    var current = depth - 1
+    if (current < target) {
+      var nextIndex = current + 1
+      var page = pageAt(nextIndex)
+      if (!page) return
+      push(page, {}, operationFor(target))
+      if (renderer.subscribed("push"))
+        renderer.bridge.sendEvent(renderer.surfaceName, renderer.controlId, "push",
+          { value: nextIndex, depth: depth })
+      if (!busy) Qt.callLater(syncNavigation)
+    } else if (current > target) {
+      pop(operationFor(target) === QQC.StackView.PushTransition
+        ? QQC.StackView.PopTransition : QQC.StackView.Immediate)
+      if (renderer.subscribed("pop"))
+        renderer.bridge.sendEvent(renderer.surfaceName, renderer.controlId, "pop",
+          { value: Math.max(-1, depth - 1), depth: depth })
+      if (!busy) Qt.callLater(syncNavigation)
+    }
+  }
+
+  function rebuildPages() {
+    if (!initialized) return
+    rebuilding = true
+    clear(QQC.StackView.Immediate)
+    var oldPages = pageObjects
+    pageObjects = []
+    for (var index = 0; index < oldPages.length; index++) {
+      if (oldPages[index]) oldPages[index].destroy()
+    }
+    rebuilding = false
+    Qt.callLater(syncNavigation)
+  }
+
+  implicitWidth: Number(renderer.prop("width", 640))
+  implicitHeight: Number(renderer.prop("height", 420))
+  enabled: renderer.prop("enabled", true) !== false
+  visible: renderer.prop("visible", true) !== false
+  clip: renderer.prop("clip", true) !== false
+
+  background: Rectangle {
+    color: renderer.prop("background", Color.background)
+    radius: Number(renderer.prop("radius", 0))
+    border.width: String(renderer.prop("border_color", "")).length > 0 ? Style.normalBorderWidth : 0
+    border.color: renderer.prop("border_color", "transparent")
+  }
+
+  Component.onCompleted: {
+    initialized = true
+    syncNavigation()
+  }
+  onRequestedIndexChanged: syncNavigation()
+  onChildSignatureChanged: rebuildPages()
+  onBusyChanged: {
+    if (renderer.subscribed("busy_change"))
+      renderer.bridge.sendEvent(renderer.surfaceName, renderer.controlId, "busy_change", { value: busy })
+    if (!busy) Qt.callLater(syncNavigation)
+  }
+  onDepthChanged: {
+    if (!initialized || rebuilding) return
+    var index = depth - 1
+    if (renderer.subscribed("depth_change"))
+      renderer.bridge.sendEvent(renderer.surfaceName, renderer.controlId, "depth_change",
+        { value: depth, index: index })
+    if (renderer.subscribed("change"))
+      renderer.bridge.sendEvent(renderer.surfaceName, renderer.controlId, "change",
+        { value: index, depth: depth })
+  }
+  onVisibleChanged: renderer.bridge.sendEvent(renderer.surfaceName, renderer.controlId,
+    visible ? "show" : "hide", {})
+  onActiveFocusChanged: renderer.bridge.sendEvent(renderer.surfaceName, renderer.controlId,
+    activeFocus ? "focus" : "blur", {})
+}

data/Components/Builtins/StackedBarChart.qml

@@ -0,0 +1,3 @@
+import QtQuick
+import "Support" as Support
+Support.ChartCanvas { renderer: null; chartType: "stacked_bar" }

data/Components/Builtins/StandardPaths.qml

@@ -0,0 +1,9 @@
+import QtQuick
+import QtCore
+
+Item {
+  id:pathsRoot;property var renderer:null
+  function locationType(){var name=String(renderer?renderer.prop("location","home"):"home");var values={desktop:StandardPaths.DesktopLocation,documents:StandardPaths.DocumentsLocation,fonts:StandardPaths.FontsLocation,applications:StandardPaths.ApplicationsLocation,music:StandardPaths.MusicLocation,movies:StandardPaths.MoviesLocation,pictures:StandardPaths.PicturesLocation,temp:StandardPaths.TempLocation,home:StandardPaths.HomeLocation,cache:StandardPaths.CacheLocation,generic_data:StandardPaths.GenericDataLocation,runtime:StandardPaths.RuntimeLocation,config:StandardPaths.ConfigLocation,download:StandardPaths.DownloadLocation,generic_cache:StandardPaths.GenericCacheLocation,generic_config:StandardPaths.GenericConfigLocation,app_data:StandardPaths.AppDataLocation,app_config:StandardPaths.AppConfigLocation};return values[name]===undefined?StandardPaths.HomeLocation:values[name]}
+  function resolve(){if(!renderer)return;var type=locationType();var payload={location:String(StandardPaths.writableLocation(type)),locations:StandardPaths.standardLocations(type).map(String),display_name:StandardPaths.displayName(type)};var file=String(renderer.prop("locate_file",""));if(file!=="")payload.located=String(StandardPaths.locate(type,file));var executable=String(renderer.prop("executable",""));if(executable!=="")payload.executable=String(StandardPaths.findExecutable(executable));renderer.bridge.sendEvent(renderer.surfaceName,renderer.controlId,"resolved",payload)}
+  Component.onCompleted:resolve();Connections{target:renderer;function onNodeChanged(){pathsRoot.resolve()}}
+}

data/Components/Builtins/State.qml

@@ -0,0 +1,13 @@
+import QtQuick
+
+Item {
+  id: stateRoot
+  property var renderer: null
+  property bool active: false
+  property var previousValues: ({})
+  readonly property var targetItem: renderer ? renderer.findRenderedItem(renderer.prop("target", "")) : null
+  function applyProperties(values){if(!targetItem||!values||typeof values!=="object")return;for(var key in values)if(targetItem.hasOwnProperty(key))targetItem[key]=values[key]}
+  function synchronize(){if(!renderer||!targetItem)return;var shouldEnter=renderer.prop("when",true)===true;if(shouldEnter===active)return;if(shouldEnter){previousValues={};var inherited=renderer.prop("extend",{});var values={};if(inherited&&typeof inherited==="object")for(var inheritedKey in inherited)values[inheritedKey]=inherited[inheritedKey];var requested=renderer.prop("properties",{});for(var requestedKey in requested)values[requestedKey]=requested[requestedKey];for(var key in values)if(targetItem.hasOwnProperty(key))previousValues[key]=targetItem[key];applyProperties(values);active=true;renderer.bridge.sendEvent(renderer.surfaceName,renderer.controlId,"enter",{name:renderer.prop("name","")})}else{if(renderer.prop("restore_entry_values",true)!==false)applyProperties(previousValues);active=false;renderer.bridge.sendEvent(renderer.surfaceName,renderer.controlId,"exit",{name:renderer.prop("name","")})}renderer.bridge.sendEvent(renderer.surfaceName,renderer.controlId,"change",{value:active,name:renderer.prop("name","")})}
+  Connections{target:renderer;function onNodeChanged(){stateRoot.synchronize()}}
+  Component.onCompleted:synchronize()
+}

data/Components/Builtins/StateGroup.qml

@@ -0,0 +1,11 @@
+import QtQuick
+
+Item {
+  id: groupRoot
+  property var renderer: null
+  property string activeState: ""
+  readonly property var targetItem: renderer ? renderer.findRenderedItem(renderer.prop("target", "")) : null
+  function synchronize(){if(!renderer||!targetItem)return;var name=String(renderer.prop("current",""));var states=renderer.prop("states",[]);for(var index=0;index<states.length;index++){var state=states[index]||{};if(String(state.name)===name){var values=state.properties||{};for(var key in values)if(targetItem.hasOwnProperty(key))targetItem[key]=values[key];break}}if(name!==activeState){var old=activeState;activeState=name;renderer.bridge.sendEvent(renderer.surfaceName,renderer.controlId,"change",{value:name,previous:old})}}
+  Connections{target:renderer;function onNodeChanged(){groupRoot.synchronize()}}
+  Component.onCompleted:synchronize()
+}

data/Components/Builtins/Support/AnimationDriver.qml

@@ -0,0 +1,79 @@
+import QtQuick
+
+Item {
+  id: driver
+  required property var renderer
+  required property string animationType
+  readonly property var targetItem: renderer ? renderer.findRenderedItem(renderer.prop("target", "")) : null
+  property bool requestedRunning: false
+
+  function send(name, payload) {
+    if (renderer && renderer.subscribed(name)) renderer.bridge.sendEvent(renderer.surfaceName, renderer.controlId, name, payload || {})
+  }
+  function loopsValue() {
+    var value = renderer.prop("loops", 1)
+    return String(value) === "infinite" || Number(value) < 0 ? Animation.Infinite : Math.max(1, Number(value))
+  }
+  function vectorValue(value) {
+    return Array.isArray(value) ? Qt.vector3d(Number(value[0] || 0), Number(value[1] || 0), Number(value[2] || 0)) : value
+  }
+  function currentAnimation() {
+    if (animationType === "number") return numberAnimation
+    if (animationType === "color") return colorAnimation
+    if (animationType === "rotation") return rotationAnimation
+    if (animationType === "vector") return vectorAnimation
+    if (animationType === "path") return pathAnimation
+    if (animationType === "spring") return springAnimation
+    if (animationType === "smoothed") return smoothedAnimation
+    if (animationType === "anchor") return anchorAnimation
+    if (animationType === "parent") return parentAnimation
+    if (animationType === "opacity_animator") return opacityAnimator
+    if (animationType === "rotation_animator") return rotationAnimator
+    if (animationType === "scale_animator") return scaleAnimator
+    if (animationType === "x_animator") return xAnimator
+    if (animationType === "y_animator") return yAnimator
+    if (animationType === "uniform_animator") return uniformAnimator
+    if (animationType === "pause") return pauseAnimation
+    return propertyAnimation
+  }
+  function synchronize(restart) {
+    var animation = currentAnimation(); if (!animation || !renderer) return
+    requestedRunning = renderer.prop("running", false) === true
+    if (renderer.prop("paused", false) === true) { animation.pause(); return }
+    if (!requestedRunning) { delayTimer.stop(); animation.stop(); return }
+    if (restart || !animation.running) {
+      animation.stop()
+      var delay = Math.max(0, Number(renderer.prop("delay", 0)))
+      if (delay > 0) { delayTimer.interval = delay; delayTimer.restart() } else animation.start()
+    } else if (animation.paused) animation.resume()
+  }
+
+  Timer { id: delayTimer; repeat: false; onTriggered: if (driver.requestedRunning) driver.currentAnimation().start() }
+  Connections {
+    target: driver.currentAnimation()
+    function onStarted() { driver.send("start", {}) }
+    function onStopped() { driver.send("stop", {}) }
+    function onFinished() { driver.send("finish", {}) }
+    function onRunningChanged() { driver.send("running_change", { value: driver.currentAnimation().running }) }
+  }
+  Connections { target: renderer; function onNodeChanged() { driver.synchronize(true) } }
+  Component.onCompleted: synchronize(false)
+
+  PropertyAnimation { id: propertyAnimation; target: driver.targetItem; property: String(renderer.prop("property", "opacity")); from: renderer.prop("from", 0); to: renderer.prop("to", 1); duration: Number(renderer.prop("duration", 250)); easing.type: renderer.easingType(renderer.prop("easing", "in_out_quad")); loops: driver.loopsValue(); alwaysRunToEnd: renderer.prop("always_run", false) === true }
+  NumberAnimation { id: numberAnimation; target: driver.targetItem; property: String(renderer.prop("property", "opacity")); from: Number(renderer.prop("from", 0)); to: Number(renderer.prop("to", 1)); duration: Number(renderer.prop("duration", 250)); easing.type: renderer.easingType(renderer.prop("easing", "in_out_quad")); loops: driver.loopsValue() }
+  ColorAnimation { id: colorAnimation; target: driver.targetItem; property: String(renderer.prop("property", "color")); from: renderer.prop("from", "transparent"); to: renderer.prop("to", "white"); duration: Number(renderer.prop("duration", 250)); easing.type: renderer.easingType(renderer.prop("easing", "in_out_quad")); loops: driver.loopsValue() }
+  RotationAnimation { id: rotationAnimation; target: driver.targetItem; property: String(renderer.prop("property", "rotation")); from: Number(renderer.prop("from", 0)); to: Number(renderer.prop("to", 360)); duration: Number(renderer.prop("duration", 250)); easing.type: renderer.easingType(renderer.prop("easing", "in_out_quad")); direction: { var d=String(renderer.prop("direction","numerical"));if(d==="clockwise")return RotationAnimation.Clockwise;if(d==="counterclockwise")return RotationAnimation.Counterclockwise;if(d==="shortest")return RotationAnimation.Shortest;return RotationAnimation.Numerical } loops: driver.loopsValue() }
+  Vector3dAnimation { id: vectorAnimation; target: driver.targetItem; property: String(renderer.prop("property", "scale3d")); from: driver.vectorValue(renderer.prop("from", [0,0,0])); to: driver.vectorValue(renderer.prop("to", [1,1,1])); duration: Number(renderer.prop("duration", 250)); easing.type: renderer.easingType(renderer.prop("easing", "in_out_quad")); loops: driver.loopsValue() }
+  PathAnimation { id: pathAnimation; target: driver.targetItem; duration: Number(renderer.prop("duration", 250)); easing.type: renderer.easingType(renderer.prop("easing", "in_out_quad")); loops: driver.loopsValue(); anchorPoint: Qt.point(Number(renderer.prop("anchor_x", 0)), Number(renderer.prop("anchor_y", 0))); orientation: { var o=String(renderer.prop("orientation","fixed"));if(o==="right_first")return PathAnimation.RightFirst;if(o==="left_first")return PathAnimation.LeftFirst;if(o==="bottom_first")return PathAnimation.BottomFirst;if(o==="top_first")return PathAnimation.TopFirst;return PathAnimation.Fixed } path: Path { PathSvg { path: String(renderer.prop("path", "")) } } }
+  SpringAnimation { id: springAnimation; target: driver.targetItem; property: String(renderer.prop("property", "opacity")); from: Number(renderer.prop("from", 0)); to: Number(renderer.prop("to", 1)); spring: Number(renderer.prop("spring", 2)); damping: Number(renderer.prop("damping", 0.2)); epsilon: Number(renderer.prop("epsilon", 0.01)); mass: Number(renderer.prop("mass", 1)); modulus: Number(renderer.prop("modulus", 0)); velocity: Number(renderer.prop("velocity", 0)); loops: driver.loopsValue() }
+  SmoothedAnimation { id: smoothedAnimation; target: driver.targetItem; property: String(renderer.prop("property", "opacity")); from: Number(renderer.prop("from", 0)); to: Number(renderer.prop("to", 1)); velocity: Number(renderer.prop("velocity", 200)); duration: Number(renderer.prop("duration", -1)); reversingMode: { var m=String(renderer.prop("reversing_mode","eased"));if(m==="immediate")return SmoothedAnimation.Immediate;if(m==="sync")return SmoothedAnimation.Sync;return SmoothedAnimation.Eased } loops: driver.loopsValue() }
+  AnchorAnimation { id: anchorAnimation; targets: driver.targetItem ? [driver.targetItem] : []; duration: Number(renderer.prop("duration", 250)); easing.type: renderer.easingType(renderer.prop("easing", "in_out_quad")); loops: driver.loopsValue() }
+  ParentAnimation { id: parentAnimation; target: driver.targetItem; newParent: renderer.findRenderedItem(renderer.prop("new_parent", "")); via: renderer.findRenderedItem(renderer.prop("via", "")); loops: driver.loopsValue(); NumberAnimation { properties: "x,y,width,height,scale,rotation"; duration: Number(renderer.prop("duration", 250)); easing.type: renderer.easingType(renderer.prop("easing", "in_out_quad")) } }
+  OpacityAnimator { id: opacityAnimator; target: driver.targetItem; from: Number(renderer.prop("from", 0)); to: Number(renderer.prop("to", 1)); duration: Number(renderer.prop("duration", 250)); easing.type: renderer.easingType(renderer.prop("easing", "in_out_quad")); loops: driver.loopsValue() }
+  RotationAnimator { id: rotationAnimator; target: driver.targetItem; from: Number(renderer.prop("from", 0)); to: Number(renderer.prop("to", 360)); duration: Number(renderer.prop("duration", 250)); easing.type: renderer.easingType(renderer.prop("easing", "in_out_quad")); loops: driver.loopsValue() }
+  ScaleAnimator { id: scaleAnimator; target: driver.targetItem; from: Number(renderer.prop("from", 0)); to: Number(renderer.prop("to", 1)); duration: Number(renderer.prop("duration", 250)); easing.type: renderer.easingType(renderer.prop("easing", "in_out_quad")); loops: driver.loopsValue() }
+  XAnimator { id: xAnimator; target: driver.targetItem; from: Number(renderer.prop("from", 0)); to: Number(renderer.prop("to", 100)); duration: Number(renderer.prop("duration", 250)); easing.type: renderer.easingType(renderer.prop("easing", "in_out_quad")); loops: driver.loopsValue() }
+  YAnimator { id: yAnimator; target: driver.targetItem; from: Number(renderer.prop("from", 0)); to: Number(renderer.prop("to", 100)); duration: Number(renderer.prop("duration", 250)); easing.type: renderer.easingType(renderer.prop("easing", "in_out_quad")); loops: driver.loopsValue() }
+  UniformAnimator { id: uniformAnimator; target: driver.targetItem; uniform: String(renderer.prop("uniform", "progress")); from: Number(renderer.prop("from", 0)); to: Number(renderer.prop("to", 1)); duration: Number(renderer.prop("duration", 250)); easing.type: renderer.easingType(renderer.prop("easing", "in_out_quad")); loops: driver.loopsValue() }
+  PauseAnimation { id: pauseAnimation; duration: Number(renderer.prop("duration", 0)); loops: driver.loopsValue() }
+}

data/Components/Builtins/Support/AnimationGroupDriver.qml

@@ -0,0 +1,32 @@
+import QtQuick
+
+Item {
+  id: groupRoot
+  required property var renderer
+  required property bool sequential
+  property var createdAnimations: []
+
+  function factoryFor(type) { if(type==="color")return colorFactory;if(type==="pause")return pauseFactory;if(type==="rotation")return rotationFactory;return numberFactory }
+  function rebuild() {
+    nativeGroup.stop(); for(var oldIndex=0;oldIndex<createdAnimations.length;oldIndex++)createdAnimations[oldIndex].destroy();createdAnimations=[]
+    var definitions=renderer.prop("animations",[]);if(!Array.isArray(definitions))return
+    for(var index=0;index<definitions.length;index++){
+      var definition=definitions[index]||{};var type=String(definition.type||"number");var properties={duration:Number(definition.duration||250)}
+      if(type!=="pause"){properties.target=renderer.findRenderedItem(definition.target||renderer.prop("target",""));properties.property=String(definition.property||"opacity");properties.from=definition.from===undefined?0:definition.from;properties.to=definition.to===undefined?1:definition.to}
+      var object=factoryFor(type).createObject(nativeGroup,properties)
+      nativeGroup.animations.push(object);createdAnimations.push(object)
+    }
+    nativeGroup.loops=String(renderer.prop("loops",1))==="infinite"?Animation.Infinite:Math.max(1,Number(renderer.prop("loops",1)))
+    if(renderer.prop("running",false)===true){nativeGroup.start();if(renderer.prop("paused",false)===true)nativeGroup.pause()}
+  }
+  function send(name,payload){if(renderer.subscribed(name))renderer.bridge.sendEvent(renderer.surfaceName,renderer.controlId,name,payload||{})}
+  Component { id:numberFactory; NumberAnimation{} }
+  Component { id:colorFactory; ColorAnimation{} }
+  Component { id:rotationFactory; RotationAnimation{} }
+  Component { id:pauseFactory; PauseAnimation{} }
+  ParallelAnimation { id:parallelGroup; onStarted:groupRoot.send("start",{});onStopped:groupRoot.send("stop",{});onFinished:groupRoot.send("finish",{}) }
+  SequentialAnimation { id:sequentialGroup; onStarted:groupRoot.send("start",{});onStopped:groupRoot.send("stop",{});onFinished:groupRoot.send("finish",{}) }
+  readonly property var nativeGroup: sequential ? sequentialGroup : parallelGroup
+  Connections{target:renderer;function onNodeChanged(){groupRoot.rebuild()}}
+  Component.onCompleted:rebuild()
+}