socketry · May 4, 2024
diff --git a/‎gems.rb
+3 b/‎gems.rb
+3
diff --git a/‎guides/getting-started/README.md ‎guides/getting-started/readme.md b/‎guides/getting-started/README.md ‎guides/getting-started/readme.md
diff --git a/‎lib/live/element.rb
+11-3 b/‎lib/live/element.rb
+11-3
diff --git a/‎lib/live/view.rb
+28-9 b/‎lib/live/view.rb
+28-9
diff --git a/‎test/live/.website/index.html
+22 b/‎test/live/.website/index.html
+22
diff --git a/‎test/live/.website/node_modules/.package-lock.json
+20 b/‎test/live/.website/node_modules/.package-lock.json
+20
diff --git a/‎test/live/.website/node_modules/@socketry/live/Live.js
+214 b/‎test/live/.website/node_modules/@socketry/live/Live.js
+214
diff --git a/‎test/live/.website/node_modules/@socketry/live/package.json
+33 b/‎test/live/.website/node_modules/@socketry/live/package.json
+33
@@ -20,4 +20,7 @@
 
 	gem "bake-test"
 	gem "bake-test-external"
+	
+	gem "sus-fixtures-async-http"
+	gem "sus-fixtures-async-webdriver"
 end
@@ -23,11 +23,19 @@ def initialize(id, **data)
 
 		# Generate a JavaScript string which forwards the specified event to the server.
 		# @parameter details [Hash] The details associated with the forwarded event.
-		def forward(details = nil)
+		def forward_event(details = nil)
 			if details
-				"live.forward(#{JSON.dump(@id)}, event, #{JSON.dump(details)})"
+				"live.forwardEvent(#{JSON.dump(@id)}, event, #{JSON.dump(details)})"
 			else
-				"live.forward(#{JSON.dump(@id)}, event)"
+				"live.forwardEvent(#{JSON.dump(@id)}, event)"
+			end
+		end
+		
+		def forward_form_event(details = nil)
+			if details
+				"live.forwardFormEvent(#{JSON.dump(@id)}, event, #{JSON.dump(details)})"
+			else
+				"live.forwardFormEvent(#{JSON.dump(@id)}, event)"
 			end
 		end
 
 
@@ -9,21 +9,40 @@
 module Live
 	# Represents a single division of content on the page an provides helpers for rendering the content.
 	class View < Element
+		# Update the content of the client-side element by rendering this view.
+		def update!(**options)
+			rpc(:update, [@id, self.to_html, options])
+		end
+		
 		# Replace the content of the client-side element by rendering this view.
-		def replace!
-			rpc(:replace, [@id, self.to_html])
+		# @parameter selector [String] The CSS selector to replace.
+		# @parameter node [String] The HTML to replace.
+		def replace(selector, node, **options)
+			rpc(:replace, [selector, node.to_s, options])
+		end
+		
+		# Prepend to the content of the client-side element by appending the specified element.
+		# @parameter selector [String] The CSS selector to prepend to.
+		# @parameter node [String] The HTML to prepend.
+		def prepend(selector, node, **options)
+			rpc(:prepend, [selector, node.to_s, options])
 		end
 
 		# Append to the content of the client-side element by appending the specified element.
-		# @parameter node [Live::Element] The element to append.
-		def append!(element)
-			rpc(:append, [@id, element.to_html])
+		# @parameter selector [String] The CSS selector to append to.
+		# @parameter node [String] The HTML to prepend.
+		def append(selector, node, **options)
+			rpc(:append, [selector, node.to_s, options])
 		end
 
-		# Prepend to the content of the client-side element by appending the specified element.
-		# @parameter node [Live::Element] The element to prepend.
-		def prepend!(element)
-			rpc(:prepend, [@id, element.to_html])
+		# Remove the specified element from the client-side element.
+		# @parameter selector [String] The CSS selector to remove.
+		def remove(selector, **options)
+			rpc(:remove, [selector, options])
+		end
+		
+		def dispatch_event(selector, type, **options)
+			rpc(:dispatch_event, [selector, event, options])
 		end
 
 		# Render the element.
 
@@ -0,0 +1,22 @@
+<!DOCTYPE html>
+<html>
+<head>
+	<title>Live Test</title>
+	<script type="importmap">
+	{
+		"imports": {
+			"live": "/node_modules/@socketry/live/Live.js",
+			"morphdom": "/node_modules/morphdom/dist/morphdom-esm.js"
+		}
+	}
+	</script>
+</head>
+<body>
+	<div class="live" id="test" data-class="TestTag"></div>
+	<script type="module">
+		import {Live} from 'live';
+		// Use the Live module here
+		let live = Live.start();
+	</script>
+</body>
+</html>