From 3023b5d371bb571f9b910a5aaae1105d6f59a648 Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?Jean=20Mendon=C3=A7a?= Date: Thu, 8 May 2025 11:36:17 -0300 Subject: [PATCH] aria-disabled for Switch --- app/components/ruby_ui/switch/switch.rb | 14 ++++++++++++-- app/views/docs/switch.rb | 6 ++++++ 2 files changed, 18 insertions(+), 2 deletions(-) diff --git a/app/components/ruby_ui/switch/switch.rb b/app/components/ruby_ui/switch/switch.rb index 1dcf275a..e1499825 100644 --- a/app/components/ruby_ui/switch/switch.rb +++ b/app/components/ruby_ui/switch/switch.rb @@ -12,12 +12,22 @@ def initialize(include_hidden: true, checked_value: "1", unchecked_value: "0", * def view_template label( role: "switch", - class: "peer inline-flex h-6 w-11 shrink-0 cursor-pointer items-center rounded-full border-2 border-transparent transition-colors focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-2 focus-visible:ring-offset-background has-[:disabled]:cursor-not-allowed has-[:disabled]:opacity-50 bg-input has-[:checked]:bg-primary" + class: [ + "peer inline-flex h-6 w-11 shrink-0 cursor-pointer items-center rounded-full border-2 border-transparent transition-colors bg-input", + "has-checked:bg-primary", + "has-disabled:cursor-not-allowed has-disabled:opacity-50", + "has-aria-disabled:cursor-not-allowed has-aria-disabled:opacity-50 has-aria-disabled:pointer-events-none", + "focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-2 focus-visible:ring-offset-background" + ] ) do input(type: "hidden", name: attrs[:name], value: @unchecked_value) if @include_hidden + input(**attrs.merge(type: "checkbox", class: "hidden peer", value: @checked_value)) - span(class: "pointer-events-none block h-5 w-5 rounded-full bg-background shadow-lg ring-0 transition-transform translate-x-0 peer-checked:translate-x-5 ") + span(class: [ + "pointer-events-none block h-5 w-5 rounded-full bg-background shadow-lg ring-0 transition-transform translate-x-0", + "peer-checked:translate-x-5" + ]) end end end diff --git a/app/views/docs/switch.rb b/app/views/docs/switch.rb index 81936e69..8f4dcdc7 100644 --- a/app/views/docs/switch.rb +++ b/app/views/docs/switch.rb @@ -27,6 +27,12 @@ def view_template RUBY end + render Docs::VisualCodeExample.new(title: "Aria Disabled", context: self) do + <<~RUBY + Switch(name: "switch", aria: {disabled: "true"}) + RUBY + end + render Docs::VisualCodeExample.new(title: "With flag include_hidden false", context: self) do <<~RUBY # Supports the creation of a hidden input to be used in forms inspired by the Ruby on Rails implementation of check_box. Default is true.