Add test widget stubs

druid/widget/properties_panel/properties/property_button.gui

@@ -0,0 +1,328 @@
+script: ""
+fonts {
+  name: "text_bold"
+  font: "/druid/fonts/text_bold.font"
+}
+textures {
+  name: "druid"
+  texture: "/druid/druid.atlas"
+}
+background_color {
+  x: 0.0
+  y: 0.0
+  z: 0.0
+  w: 0.0
+}
+nodes {
+  position {
+    x: 0.0
+    y: 0.0
+    z: 0.0
+    w: 1.0
+  }
+  rotation {
+    x: 0.0
+    y: 0.0
+    z: 0.0
+    w: 1.0
+  }
+  scale {
+    x: 1.0
+    y: 1.0
+    z: 1.0
+    w: 1.0
+  }
+  size {
+    x: 400.0
+    y: 40.0
+    z: 0.0
+    w: 1.0
+  }
+  color {
+    x: 1.0
+    y: 1.0
+    z: 1.0
+    w: 1.0
+  }
+  type: TYPE_BOX
+  blend_mode: BLEND_MODE_ALPHA
+  texture: "druid/empty"
+  id: "root"
+  xanchor: XANCHOR_NONE
+  yanchor: YANCHOR_NONE
+  pivot: PIVOT_NW
+  adjust_mode: ADJUST_MODE_STRETCH
+  layer: ""
+  inherit_alpha: true
+  slice9 {
+    x: 0.0
+    y: 0.0
+    z: 0.0
+    w: 0.0
+  }
+  clipping_mode: CLIPPING_MODE_NONE
+  clipping_visible: true
+  clipping_inverted: false
+  alpha: 1.0
+  template_node_child: false
+  size_mode: SIZE_MODE_MANUAL
+  custom_type: 0
+  enabled: true
+  visible: false
+  material: ""
+}
+nodes {
+  position {
+    x: 0.0
+    y: -20.0
+    z: 0.0
+    w: 1.0
+  }
+  rotation {
+    x: 0.0
+    y: 0.0
+    z: 0.0
+    w: 1.0
+  }
+  scale {
+    x: 0.65
+    y: 0.65
+    z: 1.0
+    w: 1.0
+  }
+  size {
+    x: 200.0
+    y: 40.0
+    z: 0.0
+    w: 1.0
+  }
+  color {
+    x: 0.463
+    y: 0.475
+    z: 0.49
+    w: 1.0
+  }
+  type: TYPE_TEXT
+  blend_mode: BLEND_MODE_ALPHA
+  text: "Button"
+  font: "text_bold"
+  id: "text_name"
+  xanchor: XANCHOR_NONE
+  yanchor: YANCHOR_NONE
+  pivot: PIVOT_W
+  outline {
+    x: 1.0
+    y: 1.0
+    z: 1.0
+    w: 1.0
+  }
+  shadow {
+    x: 1.0
+    y: 1.0
+    z: 1.0
+    w: 1.0
+  }
+  adjust_mode: ADJUST_MODE_FIT
+  line_break: false
+  parent: "root"
+  layer: ""
+  inherit_alpha: true
+  alpha: 1.0
+  outline_alpha: 0.0
+  shadow_alpha: 0.0
+  template_node_child: false
+  text_leading: 1.0
+  text_tracking: 0.0
+  custom_type: 0
+  enabled: true
+  visible: true
+  material: ""
+}
+nodes {
+  position {
+    x: 267.0
+    y: -20.0
+    z: 0.0
+    w: 1.0
+  }
+  rotation {
+    x: 0.0
+    y: 0.0
+    z: 0.0
+    w: 1.0
+  }
+  scale {
+    x: 1.0
+    y: 1.0
+    z: 1.0
+    w: 1.0
+  }
+  size {
+    x: 226.0
+    y: 40.0
+    z: 0.0
+    w: 1.0
+  }
+  color {
+    x: 0.463
+    y: 0.475
+    z: 0.49
+    w: 1.0
+  }
+  type: TYPE_BOX
+  blend_mode: BLEND_MODE_ALPHA
+  texture: "druid/rect_round2_width1"
+  id: "button"
+  xanchor: XANCHOR_NONE
+  yanchor: YANCHOR_NONE
+  pivot: PIVOT_CENTER
+  adjust_mode: ADJUST_MODE_FIT
+  parent: "root"
+  layer: ""
+  inherit_alpha: true
+  slice9 {
+    x: 4.0
+    y: 4.0
+    z: 4.0
+    w: 4.0
+  }
+  clipping_mode: CLIPPING_MODE_NONE
+  clipping_visible: true
+  clipping_inverted: false
+  alpha: 1.0
+  template_node_child: false
+  size_mode: SIZE_MODE_MANUAL
+  custom_type: 0
+  enabled: true
+  visible: true
+  material: ""
+}
+nodes {
+  position {
+    x: 0.0
+    y: -20.0
+    z: 0.0
+    w: 1.0
+  }
+  rotation {
+    x: 0.0
+    y: 0.0
+    z: 0.0
+    w: 1.0
+  }
+  scale {
+    x: 1.0
+    y: 1.0
+    z: 1.0
+    w: 1.0
+  }
+  size {
+    x: 226.0
+    y: 4.0
+    z: 0.0
+    w: 1.0
+  }
+  color {
+    x: 0.894
+    y: 0.506
+    z: 0.333
+    w: 1.0
+  }
+  type: TYPE_BOX
+  blend_mode: BLEND_MODE_ALPHA
+  texture: "druid/pixel"
+  id: "selected"
+  xanchor: XANCHOR_NONE
+  yanchor: YANCHOR_NONE
+  pivot: PIVOT_S
+  adjust_mode: ADJUST_MODE_STRETCH
+  parent: "button"
+  layer: ""
+  inherit_alpha: true
+  slice9 {
+    x: 0.0
+    y: 0.0
+    z: 0.0
+    w: 0.0
+  }
+  clipping_mode: CLIPPING_MODE_NONE
+  clipping_visible: true
+  clipping_inverted: false
+  alpha: 1.0
+  template_node_child: false
+  size_mode: SIZE_MODE_MANUAL
+  custom_type: 0
+  enabled: true
+  visible: true
+  material: ""
+}
+nodes {
+  position {
+    x: 0.0
+    y: 0.0
+    z: 0.0
+    w: 1.0
+  }
+  rotation {
+    x: 0.0
+    y: 0.0
+    z: 0.0
+    w: 1.0
+  }
+  scale {
+    x: 0.65
+    y: 0.65
+    z: 1.0
+    w: 1.0
+  }
+  size {
+    x: 250.0
+    y: 30.0
+    z: 0.0
+    w: 1.0
+  }
+  color {
+    x: 0.722
+    y: 0.741
+    z: 0.761
+    w: 1.0
+  }
+  type: TYPE_TEXT
+  blend_mode: BLEND_MODE_ALPHA
+  text: "Button"
+  font: "text_bold"
+  id: "text_button"
+  xanchor: XANCHOR_NONE
+  yanchor: YANCHOR_NONE
+  pivot: PIVOT_CENTER
+  outline {
+    x: 1.0
+    y: 1.0
+    z: 1.0
+    w: 1.0
+  }
+  shadow {
+    x: 1.0
+    y: 1.0
+    z: 1.0
+    w: 1.0
+  }
+  adjust_mode: ADJUST_MODE_FIT
+  line_break: false
+  parent: "button"
+  layer: ""
+  inherit_alpha: true
+  alpha: 1.0
+  outline_alpha: 0.0
+  shadow_alpha: 0.0
+  template_node_child: false
+  text_leading: 1.0
+  text_tracking: 0.0
+  custom_type: 0
+  enabled: true
+  visible: true
+  material: ""
+}
+material: "/builtins/materials/gui.material"
+adjust_reference: ADJUST_REFERENCE_PARENT
+max_nodes: 512

druid/widget/properties_panel/properties/property_button.lua

@@ -0,0 +1,33 @@
+local component = require("druid.component")
+local lang_text = require("druid.extended.lang_text")
+
+---@class property_button: druid.base_component
+---@field root node
+---@field text_name druid.lang_text
+---@field button druid.button
+---@field text_button druid.text
+---@field druid druid_instance
+local M = component.create("property_button")
+
+---@param template string
+---@param nodes table<hash, node>
+function M:init(template, nodes)
+	self.druid = self:get_druid(template, nodes)
+
+	self.root = self:get_node("root")
+	self.text_name = self.druid:new(lang_text, "text_name") --[[@as druid.lang_text]]
+	self.selected = self:get_node("selected")
+	gui.set_alpha(self.selected, 0)
+
+	self.button = self.druid:new_button("button", self.on_click)
+	self.text_button = self.druid:new_text("text_button")
+end
+
+
+function M:on_click()
+	gui.set_alpha(self.selected, 1)
+	gui.animate(self.selected, "color.w", 0, gui.EASING_INSINE, 0.16)
+end
+
+
+return M

druid/widget/properties_panel/properties/property_checkbox.gui

@@ -0,0 +1,120 @@
+fonts {
+  name: "text_bold"
+  font: "/druid/fonts/text_bold.font"
+}
+textures {
+  name: "druid"
+  texture: "/druid/druid.atlas"
+}
+nodes {
+  size {
+    x: 400.0
+    y: 40.0
+  }
+  type: TYPE_BOX
+  texture: "druid/empty"
+  id: "root"
+  pivot: PIVOT_NW
+  adjust_mode: ADJUST_MODE_STRETCH
+  inherit_alpha: true
+  visible: false
+}
+nodes {
+  position {
+    y: -20.0
+  }
+  scale {
+    x: 0.65
+    y: 0.65
+  }
+  size {
+    x: 200.0
+    y: 40.0
+  }
+  color {
+    x: 0.463
+    y: 0.475
+    z: 0.49
+  }
+  type: TYPE_TEXT
+  text: "Checkbox"
+  font: "text_bold"
+  id: "text_name"
+  pivot: PIVOT_W
+  outline {
+    x: 1.0
+    y: 1.0
+    z: 1.0
+  }
+  shadow {
+    x: 1.0
+    y: 1.0
+    z: 1.0
+  }
+  parent: "root"
+  inherit_alpha: true
+  outline_alpha: 0.0
+  shadow_alpha: 0.0
+}
+nodes {
+  position {
+    x: 174.0
+    y: -20.0
+  }
+  size {
+    x: 40.0
+    y: 40.0
+  }
+  color {
+    x: 0.463
+    y: 0.475
+    z: 0.49
+  }
+  type: TYPE_BOX
+  texture: "druid/rect_round2_width1"
+  id: "button"
+  parent: "root"
+  inherit_alpha: true
+  slice9 {
+    x: 4.0
+    y: 4.0
+    z: 4.0
+    w: 4.0
+  }
+}
+nodes {
+  color {
+    x: 0.722
+    y: 0.741
+    z: 0.761
+  }
+  type: TYPE_BOX
+  texture: "druid/ui_circle_16"
+  id: "icon"
+  parent: "button"
+  inherit_alpha: true
+  size_mode: SIZE_MODE_AUTO
+}
+nodes {
+  position {
+    y: -20.0
+  }
+  size {
+    x: 40.0
+    y: 4.0
+  }
+  color {
+    x: 0.894
+    y: 0.506
+    z: 0.333
+  }
+  type: TYPE_BOX
+  texture: "druid/pixel"
+  id: "selected"
+  pivot: PIVOT_S
+  adjust_mode: ADJUST_MODE_STRETCH
+  parent: "button"
+  inherit_alpha: true
+}
+material: "/builtins/materials/gui.material"
+adjust_reference: ADJUST_REFERENCE_PARENT

druid/widget/properties_panel/properties/property_checkbox.lua

@@ -0,0 +1,59 @@
+local component = require("druid.component")
+local container = require("example.components.container.container")
+local lang_text = require("druid.extended.lang_text")
+
+---@class property_checkbox: druid.base_component
+---@field druid druid_instance
+---@field root druid.container
+---@field text_name druid.lang_text
+---@field button druid.button
+---@field selected node
+local M = component.create("property_checkbox")
+
+
+---@param template string
+---@param nodes table<hash, node>
+function M:init(template, nodes)
+	self.druid = self:get_druid(template, nodes)
+	self.root = self.druid:new(container, "root") --[[@as druid.container]]
+
+	self.icon = self:get_node("icon")
+	gui.set_enabled(self.icon, false)
+
+	self.selected = self:get_node("selected")
+	gui.set_alpha(self.selected, 0)
+
+	self.text_name = self.druid:new(lang_text, "text_name") --[[@as druid.lang_text]]
+
+	self.button = self.druid:new_button("button", self.on_click)
+end
+
+
+---@param value boolean
+function M:set_value(value, is_instant)
+	if self._value == value then
+		return
+	end
+
+	self._value = value
+	gui.set_enabled(self.icon, value)
+
+	if not is_instant then
+		gui.set_alpha(self.selected, 1)
+		gui.animate(self.selected, "color.w", 0, gui.EASING_INSINE, 0.16)
+	end
+end
+
+
+---@return boolean
+function M:get_value()
+	return self._value
+end
+
+
+function M:on_click()
+	self:set_value(not self:get_value())
+end
+
+
+return M

druid/widget/properties_panel/properties/property_slider.gui

@@ -0,0 +1,211 @@
+fonts {
+  name: "text_bold"
+  font: "/druid/fonts/text_bold.font"
+}
+textures {
+  name: "druid"
+  texture: "/druid/druid.atlas"
+}
+nodes {
+  size {
+    x: 400.0
+    y: 40.0
+  }
+  type: TYPE_BOX
+  texture: "druid/empty"
+  id: "root"
+  pivot: PIVOT_NW
+  adjust_mode: ADJUST_MODE_STRETCH
+  inherit_alpha: true
+  visible: false
+}
+nodes {
+  position {
+    y: -20.0
+  }
+  scale {
+    x: 0.65
+    y: 0.65
+  }
+  size {
+    x: 200.0
+    y: 40.0
+  }
+  color {
+    x: 0.463
+    y: 0.475
+    z: 0.49
+  }
+  type: TYPE_TEXT
+  text: "Slider"
+  font: "text_bold"
+  id: "text_name"
+  pivot: PIVOT_W
+  outline {
+    x: 1.0
+    y: 1.0
+    z: 1.0
+  }
+  shadow {
+    x: 1.0
+    y: 1.0
+    z: 1.0
+  }
+  parent: "root"
+  inherit_alpha: true
+  outline_alpha: 0.0
+  shadow_alpha: 0.0
+}
+nodes {
+  position {
+    x: 234.0
+    y: -20.0
+  }
+  size {
+    x: 160.0
+    y: 40.0
+  }
+  color {
+    x: 0.129
+    y: 0.141
+    z: 0.157
+  }
+  type: TYPE_BOX
+  texture: "druid/empty"
+  id: "slider"
+  parent: "root"
+  inherit_alpha: true
+}
+nodes {
+  size {
+    x: 160.0
+    y: 8.0
+  }
+  color {
+    x: 0.129
+    y: 0.141
+    z: 0.157
+  }
+  type: TYPE_BOX
+  texture: "druid/ui_circle_8"
+  id: "slider_back"
+  parent: "slider"
+  inherit_alpha: true
+  slice9 {
+    x: 4.0
+    y: 4.0
+    z: 4.0
+    w: 4.0
+  }
+}
+nodes {
+  position {
+    x: -68.0
+  }
+  size {
+    x: 24.0
+    y: 24.0
+  }
+  color {
+    x: 0.722
+    y: 0.741
+    z: 0.761
+  }
+  type: TYPE_BOX
+  texture: "druid/ui_circle_8"
+  id: "slider_pin"
+  parent: "slider"
+  inherit_alpha: true
+  slice9 {
+    x: 4.0
+    y: 4.0
+    z: 4.0
+    w: 4.0
+  }
+}
+nodes {
+  position {
+    x: 380.0
+    y: -20.0
+  }
+  size {
+    x: 60.0
+    y: 40.0
+  }
+  color {
+    x: 0.463
+    y: 0.475
+    z: 0.49
+  }
+  type: TYPE_BOX
+  texture: "druid/rect_round2_width1"
+  id: "button"
+  pivot: PIVOT_E
+  parent: "root"
+  inherit_alpha: true
+  slice9 {
+    x: 4.0
+    y: 4.0
+    z: 4.0
+    w: 4.0
+  }
+}
+nodes {
+  position {
+    y: -20.0
+  }
+  size {
+    x: 60.0
+    y: 4.0
+  }
+  color {
+    x: 0.894
+    y: 0.506
+    z: 0.333
+  }
+  type: TYPE_BOX
+  texture: "druid/pixel"
+  id: "selected"
+  pivot: PIVOT_SE
+  adjust_mode: ADJUST_MODE_STRETCH
+  parent: "button"
+  inherit_alpha: true
+}
+nodes {
+  position {
+    x: -30.0
+  }
+  scale {
+    x: 0.55
+    y: 0.55
+  }
+  size {
+    x: 100.0
+    y: 40.0
+  }
+  color {
+    x: 0.722
+    y: 0.741
+    z: 0.761
+  }
+  type: TYPE_TEXT
+  text: "25 %"
+  font: "text_bold"
+  id: "text_value"
+  outline {
+    x: 1.0
+    y: 1.0
+    z: 1.0
+  }
+  shadow {
+    x: 1.0
+    y: 1.0
+    z: 1.0
+  }
+  parent: "button"
+  inherit_alpha: true
+  outline_alpha: 0.0
+  shadow_alpha: 0.0
+}
+material: "/builtins/materials/gui.material"
+adjust_reference: ADJUST_REFERENCE_PARENT

druid/widget/properties_panel/properties/property_slider.lua

@@ -0,0 +1,75 @@
+local component = require("druid.component")
+local container = require("example.components.container.container")
+local lang_text = require("druid.extended.lang_text")
+local slider = require("druid.extended.slider")
+
+---@class property_slider: druid.base_component
+---@field druid druid_instance
+---@field root druid.container
+---@field text_name druid.lang_text
+---@field text_value druid.text
+---@field slider druid.slider
+local M = component.create("property_slider")
+
+
+---@param template string
+---@param nodes table<hash, node>
+function M:init(template, nodes)
+	self.druid = self:get_druid(template, nodes)
+
+	self.root = self.druid:new(container, "root") --[[@as druid.container]]
+	self.selected = self:get_node("selected")
+	gui.set_alpha(self.selected, 0)
+	self._value = 0
+
+	self.text_name = self.druid:new(lang_text, "text_name") --[[@as druid.lang_text]]
+	self.text_value = self.druid:new_text("text_value")
+	self.slider = self.druid:new(slider, "slider_pin", vmath.vector3(68, 0, 0), self._on_slider_change_by_user) --[[@as druid.slider]]
+	self.slider:set_input_node("slider")
+
+	self:set_text_function(function(value)
+		return math.floor(value * 100) .. "%"
+	end)
+end
+
+
+---@param callback fun(value:number):string
+function M:set_text_function(callback)
+	self._text_function = callback
+	self.text_value:set_to(self._text_function(self._value))
+end
+
+
+---@param value number
+function M:set_value(value, is_instant)
+	if self._value == value then
+		return
+	end
+
+	self._value = value
+	self.slider:set(value, true)
+	self.text_value:set_to(self._text_function(value))
+
+	if not is_instant then
+		gui.set_alpha(self.selected, 1)
+		gui.animate(self.selected, "color.w", 0, gui.EASING_INSINE, 0.16)
+	end
+end
+
+
+---@return number
+function M:get_value()
+	return self._value
+end
+
+
+function M:_on_slider_change_by_user(value)
+	self._value = value
+	self.text_value:set_to(self._text_function(value))
+
+	gui.set_alpha(self.selected, 1)
+	gui.animate(self.selected, "color.w", 0, gui.EASING_INSINE, 0.16)
+end
+
+
+return M