[Feature] Allow TabsTrigger to render as an anchor via as:

docs/app/views/docs/tabs.rb

@@ -102,6 +102,20 @@ def view_template
         RUBY
       end
 
+      render Docs::VisualCodeExample.new(title: "As navigation links", context: self) do
+        <<~RUBY
+          # Render triggers as `<a>` instead of `<button>` for tabs that navigate
+          # (e.g. server-rendered tabs driven by a query param). This avoids
+          # nesting interactive elements and keeps the markup valid and accessible.
+          Tabs(default_value: "account", class: 'w-96') do
+            TabsList do
+              TabsTrigger(value: "account", as: :a, href: "?tab=account") { "Account" }
+              TabsTrigger(value: "password", as: :a, href: "?tab=password") { "Password" }
+            end
+          end
+        RUBY
+      end
+
       render Docs::VisualCodeExample.new(title: "Change default value", context: self) do
         <<~RUBY
           Tabs(default: "password", class: 'w-96') do

gem/lib/ruby_ui/tabs/tabs_trigger.rb

@@ -2,20 +2,24 @@
 
 module RubyUI
   class TabsTrigger < Base
-    def initialize(value:, **attrs)
+    def initialize(value:, as: :button, **attrs)
       @value = value
+      @as = as
       super(**attrs)
     end
 
     def view_template(&)
-      button(**attrs, &)
+      if @as == :a
+        a(**attrs, &)
+      else
+        button(**attrs, &)
+      end
     end
 
     private
 
     def default_attrs
-      {
-        type: :button,
+      base = {
         data: {
           ruby_ui__tabs_target: "trigger",
           action: "click->ruby-ui--tabs#show",
@@ -29,6 +33,8 @@ def default_attrs
           "focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-2"
         ]
       }
+      base[:type] = :button if @as == :button
+      base
     end
   end
 end

gem/test/ruby_ui/tabs_trigger_test.rb

@@ -0,0 +1,31 @@
+# frozen_string_literal: true
+
+require "test_helper"
+
+class RubyUI::TabsTriggerTest < ComponentTest
+  def test_renders_as_button_by_default
+    output = phlex { RubyUI.TabsTrigger(value: "account") { "Account" } }
+
+    assert_match(/\A<button/, output)
+    assert_match(/type="button"/, output)
+    assert_match(/Account/, output)
+    refute_match(/<a[\s>]/, output)
+  end
+
+  def test_renders_as_anchor_with_href_when_as_a
+    output = phlex { RubyUI.TabsTrigger(value: "account", as: :a, href: "/account") { "Account" } }
+
+    assert_match(/\A<a/, output)
+    assert_match(/href="\/account"/, output)
+    assert_match(/Account/, output)
+    refute_match(/<button/, output)
+    refute_match(/type="button"/, output)
+  end
+
+  def test_keeps_trigger_data_attributes_when_rendered_as_anchor
+    output = phlex { RubyUI.TabsTrigger(value: "account", as: :a, href: "/account") { "Account" } }
+
+    assert_match(/data-ruby-ui--tabs-target="trigger"/, output)
+    assert_match(/data-value="account"/, output)
+  end
+end