Autocomplete works with array and objects

docs/demo.md

@@ -59,26 +59,45 @@ mount(
 <div id="demo-autocomplete"></div>
 
 ```js
-const selected = $("");
-const items = [
-  "Apple",
-  "Banana",
-  "Orange",
-  "Mango",
-  "Carrot",
-  "Broccoli",
-  "Spinach",
-  "Potato",
+const selectedFruit = $("");
+const fruitItems = [
+  { label: "Apple", value: "apple" },
+  { label: "Banana", value: "banana" },
+  { label: "Orange", value: "orange" },
+  { label: "Mango", value: "mango" },
+  { label: "Carrot", value: "carrot" },
+  { label: "Broccoli", value: "broccoli" },
+  { label: "Spinach", value: "spinach" },
+  { label: "Potato", value: "potato" },
 ];
 
+const selectedColor = $("");
+const colorItems = ["Red", "Blue", "Green", "Yellow", "Black", "White", "Purple", "Cyan"];
+
 mount(
-  Autocomplete({
-    items,
-    value: selected,
-    placeholder: "Search fruit or vegetable…",
-    onselect: (val) => console.log("Selected:", val),
-  }),
-  "#demo-autocomplete",
+  h('div', { class: 'p-8 flex flex-col gap-10' }, [
+    h('div', {}, [
+      h('h3', { class: 'font-bold mb-2' }, 'Objetos:'),
+      Autocomplete({
+        items: fruitItems,
+        value: selectedFruit,
+        placeholder: "Search fruit...",
+        onselect: (v) => console.log("Obj:", v)
+      }),
+      h('span', { class: 'text-xs' }, () => `Signal: ${selectedFruit()}`)
+    ]),
+    h('div', {}, [
+      h('h3', { class: 'font-bold mb-2' }, 'Array Plano:'),
+      Autocomplete({
+        items: colorItems,
+        value: selectedColor,
+        placeholder: "Search color...",
+        onselect: (v) => console.log("Str:", v)
+      }),
+      h('span', { class: 'text-xs' }, () => `Signal: ${selectedColor()}`)
+    ])
+  ]),
+  "#demo-autocomplete"
 );
 ```
 

docs/install.md

@@ -24,7 +24,7 @@ bun add sigpro-ui
 ### ESM / Module usage
 
 ```javascript
-import { Input, Button, Alert } from "sigpro-ui";
+import { $, Input, Button, Alert } from "sigpro-ui";
 import "sigpro-ui/css";
 
 const App = () => {