change utils location

docs/components/swap.md

@@ -46,8 +46,7 @@ const BasicDemo = () => {
   return Swap({
     value: isOn,
     on: "🌟 ON",
-    off: "💫 OFF",
-    onclick: () => isOn(!isOn())
+    off: "💫 OFF"
   });
 };
 Mount(BasicDemo, '#demo-basic');
@@ -69,8 +68,7 @@ const IconsDemo = () => {
   return Swap({
     value: isOn,
     on: "👁️",
-    off: "👁️‍🗨️",
-    onclick: () => isOn(!isOn())
+    off: "👁️‍🗨️"
   });
 };
 Mount(IconsDemo, '#demo-icons');
@@ -92,8 +90,7 @@ const EmojiDemo = () => {
   return Swap({
     value: isOn,
     on: "❤️",
-    off: "🖤",
-    onclick: () => isOn(!isOn())
+    off: "🖤"
   });
 };
 Mount(EmojiDemo, '#demo-emoji');
@@ -115,8 +112,7 @@ const CustomDemo = () => {
   return Swap({
     value: isOn,
     on: Div({ class: "badge badge-success gap-1" }, ["✅", " Active"]),
-    off: Div({ class: "badge badge-ghost gap-1" }, ["⭕", " Inactive"]),
-    onclick: () => isOn(!isOn())
+    off: Div({ class: "badge badge-ghost gap-1" }, ["⭕", " Inactive"])
   });
 };
 Mount(CustomDemo, '#demo-custom');
@@ -139,8 +135,7 @@ const ReactiveDemo = () => {
     Swap({
       value: isOn,
       on: "👁️",
-      off: "👁️‍🗨️",
-      onclick: () => isOn(!isOn())
+      off: "👁️‍🗨️"
     }),
     Div({ class: 'text-center' }, () => 
       isOn() 
@@ -173,8 +168,7 @@ const ModeDemo = () => {
       Swap({
         value: darkMode,
         on: "🌙",
-        off: "☀️",
-        onclick: () => darkMode(!darkMode())
+        off: "☀️"
       })
     ]),
     Div({ class: 'flex justify-between items-center' }, [
@@ -182,8 +176,7 @@ const ModeDemo = () => {
       Swap({
         value: notifications,
         on: "🔔",
-        off: "🔕",
-        onclick: () => notifications(!notifications())
+        off: "🔕"
       })
     ]),
     Div({ class: 'flex justify-between items-center' }, [
@@ -191,8 +184,7 @@ const ModeDemo = () => {
       Swap({
         value: sound,
         on: "🔊",
-        off: "🔇",
-        onclick: () => sound(!sound())
+        off: "🔇"
       })
     ]),
     Div({ class: 'mt-2 p-3 rounded-lg', style: () => darkMode() ? 'background: #1f2937; color: white' : 'background: #f3f4f6' }, [
@@ -277,8 +269,7 @@ const TodoDemo = () => {
         Swap({
           value: todo.completed,
           on: "✅",
-          off: "⬜",
-          onclick: () => todo.completed(!todo.completed())
+          off: "⬜"
         })
       ])
     ),