listbox choose

examples/list_box_choose.rb

@@ -0,0 +1,17 @@
+Shoes.app(title: "Guessing secret word", width: 500, height: 450) do
+  secret_word = "apple"
+  guess_label = para "Guess the secret word:"
+  guess_input = list_box items: ["apple", "banana", "orange"], choose: "orange"
+
+  button "Guess" do
+    guess = guess_input.selected_item
+
+    if guess == secret_word
+      alert("Yayyy! that's right.")
+    else
+      alert("No, better luck next time😕")
+    end
+
+    guess_input.selected_item = ""
+  end
+end

lacci/lib/shoes/widgets/list_box.rb

@@ -2,10 +2,12 @@
 
 module Shoes
   class ListBox < Shoes::Widget
-    display_properties :selected_item, :items, :height, :width
+    display_properties :selected_item, :items, :height, :width, :choose
 
     def initialize(args = {}, &block)
       @items = args[:items] || []
+      @choose = args[:choose]
+
       @selected_item = args[:selected_item]
       super()
 

lib/scarpe/wv/list_box.rb

@@ -2,7 +2,7 @@
 
 module Scarpe::Webview
   class ListBox < Widget
-    attr_reader :selected_item, :items, :height, :width
+    attr_reader :selected_item, :items, :height, :width, :choose
 
     def initialize(properties)
       super(properties)

scarpe-components/lib/scarpe/components/calzini/misc.rb

@@ -51,11 +51,13 @@ def list_box_element(props)
     HTML.render do |h|
       h.select(id: html_id, onchange:, style: list_box_style(props)) do
         (props["items"] || []).each do |item|
-          h.option(
-            **option_attrs,
+          option_attrs = {
             value: item,
-            selected: (item == props["selected_item"]),
-          ) do
+          }
+          if item == props["choose"]
+            option_attrs[:selected] = "selected"
+          end
+          h.option(**option_attrs) do
             item
           end
         end
@@ -68,7 +70,15 @@ def radio_element(props)
     group_name = props["group"] || "no_group"
 
     HTML.render do |h|
-      h.input(type: :radio, id: html_id, onclick: handler_js_code("click"), name: group_name, value: props["text"], checked: props["checked"], style: widget_style(props))
+      h.input(
+        type: :radio,
+        id: html_id,
+        onclick: handler_js_code("click"),
+        name: group_name,
+        value: props["text"],
+        checked: props["checked"],
+        style: widget_style(props),
+      )
     end
   end