Skip to content
This repository was archived by the owner on May 11, 2026. It is now read-only.
Merged
Show file tree
Hide file tree
Changes from all commits
Commits
File filter

Filter by extension

Filter by extension


Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
4 changes: 2 additions & 2 deletions Gemfile.lock
Original file line number Diff line number Diff line change
Expand Up @@ -14,10 +14,10 @@ GIT

GIT
remote: https://github.com/ruby-ui/ruby_ui.git
revision: eea116e5fa397a1b544fb8574a8014e132193e90
revision: 6e6b50ef39f08ec25db2db58a80d5b461e44837f
branch: main
specs:
ruby_ui (1.0.0.rc1)
ruby_ui (1.0.1)

GEM
remote: https://rubygems.org/
Expand Down
47 changes: 31 additions & 16 deletions app/components/ruby_ui/button/button.rb
Original file line number Diff line number Diff line change
Expand Up @@ -2,6 +2,13 @@

module RubyUI
class Button < Base
BASE_CLASSES = [
"whitespace-nowrap inline-flex items-center justify-center rounded-md font-medium transition-colors",
"disabled:pointer-events-none disabled:opacity-50",
"focus-visible:outline-none focus-visible:ring-1 focus-visible:ring-ring",
"aria-disabled:pointer-events-none aria-disabled:opacity-50 aria-disabled:cursor-not-allowed"
].freeze

def initialize(type: :button, variant: :primary, size: :md, icon: false, **attrs)
@type = type
@variant = variant.to_sym
Expand Down Expand Up @@ -36,43 +43,54 @@ def size_classes

def primary_classes
[
"whitespace-nowrap inline-flex items-center justify-center rounded-md font-medium transition-colors focus-visible:outline-none focus-visible:ring-1 focus-visible:ring-ring disabled:pointer-events-none disabled:opacity-50 bg-primary text-primary-foreground shadow hover:bg-primary/90",
size_classes
BASE_CLASSES,
size_classes,
"bg-primary text-primary-foreground shadow",
"hover:bg-primary/90"
]
end

def link_classes
[
"whitespace-nowrap inline-flex items-center justify-center rounded-md font-medium transition-colors focus-visible:outline-none focus-visible:ring-1 focus-visible:ring-ring disabled:pointer-events-none disabled:opacity-50 text-primary underline-offset-4 hover:underline",
size_classes
BASE_CLASSES,
size_classes,
"text-primary underline-offset-4",
"hover:underline"
]
end

def secondary_classes
[
"whitespace-nowrap inline-flex items-center justify-center rounded-md font-medium transition-colors focus-visible:outline-none focus-visible:ring-1 focus-visible:ring-ring disabled:pointer-events-none disabled:opacity-50 bg-secondary text-secondary-foreground hover:bg-opacity-80",
size_classes
BASE_CLASSES,
size_classes,
"bg-secondary text-secondary-foreground",
"hover:bg-opacity-80"
]
end

def destructive_classes
[
"whitespace-nowrap inline-flex items-center justify-center rounded-md font-medium transition-colors focus-visible:outline-none focus-visible:ring-1 focus-visible:ring-ring disabled:pointer-events-none disabled:opacity-50 bg-destructive text-destructive-foreground shadow-sm hover:bg-destructive/90",
size_classes
BASE_CLASSES,
size_classes,
"bg-destructive text-destructive-foreground shadow-sm",
"hover:bg-destructive/90"
]
end

def outline_classes
[
"whitespace-nowrap inline-flex items-center justify-center rounded-md font-medium transition-colors focus-visible:outline-none focus-visible:ring-1 focus-visible:ring-ring disabled:pointer-events-none disabled:opacity-50 border border-input bg-background shadow-sm hover:bg-accent hover:text-accent-foreground",
size_classes
BASE_CLASSES,
size_classes,
"border border-input bg-background shadow-sm",
"hover:bg-accent hover:text-accent-foreground"
]
end

def ghost_classes
[
"whitespace-nowrap inline-flex items-center justify-center rounded-md font-medium transition-colors focus-visible:outline-none focus-visible:ring-1 focus-visible:ring-ring disabled:pointer-events-none disabled:opacity-50 hover:bg-accent hover:text-accent-foreground",
size_classes
BASE_CLASSES,
size_classes,
"hover:bg-accent hover:text-accent-foreground"
]
end

Expand All @@ -88,10 +106,7 @@ def default_classes
end

def default_attrs
{
type: @type,
class: default_classes
}
{type: @type, class: default_classes}
end
end
end
12 changes: 12 additions & 0 deletions app/views/docs/button.rb
Original file line number Diff line number Diff line change
Expand Up @@ -51,6 +51,18 @@ def view_template
RUBY
end

render Docs::VisualCodeExample.new(title: "Disabled", context: self) do
<<~RUBY
Button(disabled: true) { "Disabled" }
RUBY
end

render Docs::VisualCodeExample.new(title: "Aria Disabled", context: self) do
<<~RUBY
Button(aria: {disabled: "true"}) { "Aria Disabled" }
RUBY
end

render Docs::VisualCodeExample.new(title: "Icon", context: self) do
<<~RUBY
Button(variant: :outline, icon: true) do
Expand Down
Loading