Skip to content

Commit 1e75692

Browse files
authored
aria-disabled for Link (#230)
1 parent 91de69b commit 1e75692

File tree

2 files changed

+37
-16
lines changed

2 files changed

+37
-16
lines changed

app/components/ruby_ui/link/link.rb

Lines changed: 31 additions & 16 deletions
Original file line numberDiff line numberDiff line change
@@ -2,6 +2,13 @@
22

33
module RubyUI
44
class Link < Base
5+
BASE_CLASSES = [
6+
"whitespace-nowrap inline-flex items-center justify-center rounded-md font-medium transition-colors",
7+
"disabled:pointer-events-none disabled:opacity-50",
8+
"focus-visible:outline-none focus-visible:ring-1 focus-visible:ring-ring",
9+
"aria-disabled:pointer-events-none aria-disabled:opacity-50 aria-disabled:cursor-not-allowed"
10+
].freeze
11+
512
def initialize(href: "#", variant: :link, size: :md, icon: false, **attrs)
613
@href = href
714
@variant = variant.to_sym
@@ -36,43 +43,54 @@ def size_classes
3643

3744
def primary_classes
3845
[
39-
"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",
40-
size_classes
46+
BASE_CLASSES,
47+
size_classes,
48+
"bg-primary text-primary-foreground shadow",
49+
"hover:bg-primary/90"
4150
]
4251
end
4352

4453
def link_classes
4554
[
46-
"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",
47-
size_classes
55+
BASE_CLASSES,
56+
size_classes,
57+
"text-primary underline-offset-4",
58+
"hover:underline"
4859
]
4960
end
5061

5162
def secondary_classes
5263
[
53-
"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",
54-
size_classes
64+
BASE_CLASSES,
65+
size_classes,
66+
"bg-secondary text-secondary-foreground",
67+
"hover:bg-opacity-80"
5568
]
5669
end
5770

5871
def destructive_classes
5972
[
60-
"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",
61-
size_classes
73+
BASE_CLASSES,
74+
size_classes,
75+
"bg-destructive text-destructive-foreground shadow-sm",
76+
"hover:bg-destructive/90"
6277
]
6378
end
6479

6580
def outline_classes
6681
[
67-
"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",
68-
size_classes
82+
BASE_CLASSES,
83+
size_classes,
84+
"border border-input bg-background shadow-sm",
85+
"hover:bg-accent hover:text-accent-foreground"
6986
]
7087
end
7188

7289
def ghost_classes
7390
[
74-
"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",
75-
size_classes
91+
BASE_CLASSES,
92+
size_classes,
93+
"hover:bg-accent hover:text-accent-foreground"
7694
]
7795
end
7896

@@ -88,10 +106,7 @@ def default_classes
88106
end
89107

90108
def default_attrs
91-
{
92-
type: "button",
93-
class: default_classes
94-
}
109+
{type: "button", class: default_classes}
95110
end
96111
end
97112
end

app/views/docs/link.rb

Lines changed: 6 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -15,6 +15,12 @@ def view_template
1515
RUBY
1616
end
1717

18+
render Docs::VisualCodeExample.new(title: "Aria Disabled", context: self) do
19+
<<~RUBY
20+
Link(aria: {disabled: "true"}, href: "#") { "Link" }
21+
RUBY
22+
end
23+
1824
render Docs::VisualCodeExample.new(title: "Primary", description: "This is the primary variant of a Link", context: self) do
1925
<<~RUBY
2026
Link(href: "#", variant: :primary) { "Primary" }

0 commit comments

Comments
 (0)