openproject-primer_view_components 0.52.1 → 0.52.3
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- checksums.yaml +4 -4
- data/CHANGELOG.md +22 -0
- data/app/assets/javascripts/primer_view_components.js +1 -1
- data/app/assets/javascripts/primer_view_components.js.map +1 -1
- data/app/assets/styles/primer_view_components.css +1 -1
- data/app/assets/styles/primer_view_components.css.map +1 -1
- data/app/components/primer/alpha/action_menu/action_menu_element.js +1 -0
- data/app/components/primer/alpha/action_menu/action_menu_element.ts +1 -0
- data/app/components/primer/alpha/text_field.css +1 -1
- data/app/components/primer/alpha/text_field.css.json +14 -0
- data/app/components/primer/alpha/text_field.css.map +1 -1
- data/app/components/primer/alpha/text_field.pcss +89 -2
- data/app/components/primer/beta/button.html.erb +1 -1
- data/app/components/primer/beta/button.rb +2 -1
- data/app/lib/primer/forms/acts_as_component.rb +32 -17
- data/app/lib/primer/forms/base_component.rb +5 -12
- data/app/lib/primer/forms/dsl/text_field_input.rb +10 -7
- data/app/lib/primer/forms/text_field.html.erb +5 -0
- data/app/lib/primer/forms/text_field.rb +37 -0
- data/lib/primer/classify/utilities.yml +1 -1
- data/lib/primer/view_components/version.rb +1 -1
- data/previews/primer/alpha/text_field_preview.rb +30 -0
- data/previews/primer/alpha/tooltip_preview.rb +1 -1
- data/static/arguments.json +6 -0
- data/static/info_arch.json +71 -0
- data/static/previews.json +65 -0
- metadata +2 -2
@@ -17,5 +17,10 @@
|
|
17
17
|
<%= render(Primer::Beta::Octicon.new(icon: :"x-circle-fill")) %>
|
18
18
|
</button>
|
19
19
|
<% end %>
|
20
|
+
<% if @input.trailing_visual %>
|
21
|
+
<div class="FormControl-input-trailingVisualWrap">
|
22
|
+
<%= render(trailing_visual_component) %>
|
23
|
+
</div>
|
24
|
+
<% end %>
|
20
25
|
<% end %>
|
21
26
|
<% end %>
|
@@ -23,6 +23,7 @@ module Primer
|
|
23
23
|
"FormControl-input-wrap",
|
24
24
|
INPUT_WRAP_SIZE[input.size],
|
25
25
|
{ "FormControl-input-wrap--trailingAction": @input.show_clear_button? },
|
26
|
+
{ "FormControl-input-wrap--trailingVisual": @input.trailing_visual? },
|
26
27
|
{ "FormControl-input-wrap--leadingVisual": @input.leading_visual? }
|
27
28
|
]
|
28
29
|
wrap_classes << Primer::Forms::Dsl::Input::INPUT_WIDTH_MAPPINGS[@input.input_width] if @input.input_width
|
@@ -43,6 +44,42 @@ module Primer
|
|
43
44
|
)
|
44
45
|
end
|
45
46
|
end
|
47
|
+
|
48
|
+
def trailing_visual_component
|
49
|
+
return @trailing_visual_component if defined?(@trailing_visual_component)
|
50
|
+
visual = @input.trailing_visual
|
51
|
+
|
52
|
+
# Render icon if specified
|
53
|
+
@trailing_visual_component =
|
54
|
+
if (icon_arguments = visual[:icon])
|
55
|
+
Primer::Beta::Octicon.new(**icon_arguments)
|
56
|
+
elsif (label_arguments = visual[:label])
|
57
|
+
# Render label if specified
|
58
|
+
label_arguments[:classes] = class_names(
|
59
|
+
label_arguments.delete(:classes),
|
60
|
+
"FormControl-input-trailingVisualLabel"
|
61
|
+
)
|
62
|
+
|
63
|
+
text = label_arguments.delete(:text)
|
64
|
+
Primer::Beta::Label.new(**label_arguments).with_content(text)
|
65
|
+
elsif (counter_arguments = visual[:counter])
|
66
|
+
# Render counter if specified
|
67
|
+
counter_arguments[:classes] = class_names(
|
68
|
+
counter_arguments.delete(:classes),
|
69
|
+
"FormControl-input-trailingVisualCounter"
|
70
|
+
)
|
71
|
+
|
72
|
+
Primer::Beta::Counter.new(**counter_arguments)
|
73
|
+
elsif (truncate_arguments = visual[:text])
|
74
|
+
# Render text if specified
|
75
|
+
truncate_arguments[:classes] = class_names(
|
76
|
+
truncate_arguments.delete(:classes),
|
77
|
+
"FormControl-input-trailingVisualText"
|
78
|
+
)
|
79
|
+
text = truncate_arguments.delete(:text)
|
80
|
+
Primer::Beta::Truncate.new(**truncate_arguments).with_content(text)
|
81
|
+
end
|
82
|
+
end
|
46
83
|
end
|
47
84
|
end
|
48
85
|
end
|
@@ -175,6 +175,36 @@ module Primer
|
|
175
175
|
render(Primer::Alpha::TextField.new(monospace: true, name: "my-text-field", label: "My text field"))
|
176
176
|
end
|
177
177
|
|
178
|
+
# @label With trailing icon
|
179
|
+
# @snapshot
|
180
|
+
def with_trailing_icon
|
181
|
+
render(Primer::Alpha::TextField.new(trailing_visual: { icon: { icon: :search } }, name: "my-text-field", label: "My text field"))
|
182
|
+
end
|
183
|
+
|
184
|
+
# @label With trailing text
|
185
|
+
# @snapshot
|
186
|
+
def with_trailing_text
|
187
|
+
render(Primer::Alpha::TextField.new(trailing_visual: { text: { text: "minute" } }, name: "my-text-field", label: "My text field"))
|
188
|
+
end
|
189
|
+
|
190
|
+
# @label With trailing long text
|
191
|
+
# @snapshot
|
192
|
+
def with_trailing_long_text
|
193
|
+
render(Primer::Alpha::TextField.new(trailing_visual: { text: { text: "Long trailing text" } }, name: "my-text-field", label: "My text field"))
|
194
|
+
end
|
195
|
+
|
196
|
+
# @label With trailing counter
|
197
|
+
# @snapshot
|
198
|
+
def with_trailing_counter
|
199
|
+
render(Primer::Alpha::TextField.new(trailing_visual: { counter: { count: 5 } }, name: "my-text-field", label: "My text field"))
|
200
|
+
end
|
201
|
+
|
202
|
+
# @label With trailing label
|
203
|
+
# @snapshot
|
204
|
+
def with_trailing_label
|
205
|
+
render(Primer::Alpha::TextField.new(trailing_visual: { label: { text: "Hello" } }, name: "my-text-field", label: "My text field"))
|
206
|
+
end
|
207
|
+
|
178
208
|
# @label With leading visual
|
179
209
|
# @snapshot
|
180
210
|
def with_leading_visual
|
@@ -65,7 +65,7 @@ module Primer
|
|
65
65
|
|
66
66
|
# @label Tooltip with Primer::Beta::Link
|
67
67
|
def tooltip_with_link(direction: :s, tooltip_text: "You can press a button")
|
68
|
-
render(Primer::Beta::Link.new(href: "#link-with-tooltip", id: "link-with-tooltip")) do |component|
|
68
|
+
render(Primer::Beta::Link.new(href: "#link-with-tooltip", id: "link-with-tooltip", underline: true)) do |component|
|
69
69
|
component.with_tooltip(text: tooltip_text, direction: direction)
|
70
70
|
"Button"
|
71
71
|
end
|
data/static/arguments.json
CHANGED
@@ -3646,6 +3646,12 @@
|
|
3646
3646
|
"default": "`:button`",
|
3647
3647
|
"description": "One of `:button`, `:reset`, or `:submit`."
|
3648
3648
|
},
|
3649
|
+
{
|
3650
|
+
"name": "inactive",
|
3651
|
+
"type": "Boolean",
|
3652
|
+
"default": "N/A",
|
3653
|
+
"description": "Whether the button looks visually disabled, but can still accept all the same interactions as an enabled button."
|
3654
|
+
},
|
3649
3655
|
{
|
3650
3656
|
"name": "disabled",
|
3651
3657
|
"type": "Boolean",
|
data/static/info_arch.json
CHANGED
@@ -9360,6 +9360,71 @@
|
|
9360
9360
|
]
|
9361
9361
|
}
|
9362
9362
|
},
|
9363
|
+
{
|
9364
|
+
"preview_path": "primer/alpha/text_field/with_trailing_icon",
|
9365
|
+
"name": "with_trailing_icon",
|
9366
|
+
"snapshot": "true",
|
9367
|
+
"skip_rules": {
|
9368
|
+
"wont_fix": [
|
9369
|
+
"region"
|
9370
|
+
],
|
9371
|
+
"will_fix": [
|
9372
|
+
"color-contrast"
|
9373
|
+
]
|
9374
|
+
}
|
9375
|
+
},
|
9376
|
+
{
|
9377
|
+
"preview_path": "primer/alpha/text_field/with_trailing_text",
|
9378
|
+
"name": "with_trailing_text",
|
9379
|
+
"snapshot": "true",
|
9380
|
+
"skip_rules": {
|
9381
|
+
"wont_fix": [
|
9382
|
+
"region"
|
9383
|
+
],
|
9384
|
+
"will_fix": [
|
9385
|
+
"color-contrast"
|
9386
|
+
]
|
9387
|
+
}
|
9388
|
+
},
|
9389
|
+
{
|
9390
|
+
"preview_path": "primer/alpha/text_field/with_trailing_long_text",
|
9391
|
+
"name": "with_trailing_long_text",
|
9392
|
+
"snapshot": "true",
|
9393
|
+
"skip_rules": {
|
9394
|
+
"wont_fix": [
|
9395
|
+
"region"
|
9396
|
+
],
|
9397
|
+
"will_fix": [
|
9398
|
+
"color-contrast"
|
9399
|
+
]
|
9400
|
+
}
|
9401
|
+
},
|
9402
|
+
{
|
9403
|
+
"preview_path": "primer/alpha/text_field/with_trailing_counter",
|
9404
|
+
"name": "with_trailing_counter",
|
9405
|
+
"snapshot": "true",
|
9406
|
+
"skip_rules": {
|
9407
|
+
"wont_fix": [
|
9408
|
+
"region"
|
9409
|
+
],
|
9410
|
+
"will_fix": [
|
9411
|
+
"color-contrast"
|
9412
|
+
]
|
9413
|
+
}
|
9414
|
+
},
|
9415
|
+
{
|
9416
|
+
"preview_path": "primer/alpha/text_field/with_trailing_label",
|
9417
|
+
"name": "with_trailing_label",
|
9418
|
+
"snapshot": "true",
|
9419
|
+
"skip_rules": {
|
9420
|
+
"wont_fix": [
|
9421
|
+
"region"
|
9422
|
+
],
|
9423
|
+
"will_fix": [
|
9424
|
+
"color-contrast"
|
9425
|
+
]
|
9426
|
+
}
|
9427
|
+
},
|
9363
9428
|
{
|
9364
9429
|
"preview_path": "primer/alpha/text_field/with_leading_visual",
|
9365
9430
|
"name": "with_leading_visual",
|
@@ -12121,6 +12186,12 @@
|
|
12121
12186
|
"default": "`:button`",
|
12122
12187
|
"description": "One of `:button`, `:reset`, or `:submit`."
|
12123
12188
|
},
|
12189
|
+
{
|
12190
|
+
"name": "inactive",
|
12191
|
+
"type": "Boolean",
|
12192
|
+
"default": "N/A",
|
12193
|
+
"description": "Whether the button looks visually disabled, but can still accept all the same interactions as an enabled button."
|
12194
|
+
},
|
12124
12195
|
{
|
12125
12196
|
"name": "disabled",
|
12126
12197
|
"type": "Boolean",
|
data/static/previews.json
CHANGED
@@ -7894,6 +7894,71 @@
|
|
7894
7894
|
]
|
7895
7895
|
}
|
7896
7896
|
},
|
7897
|
+
{
|
7898
|
+
"preview_path": "primer/alpha/text_field/with_trailing_icon",
|
7899
|
+
"name": "with_trailing_icon",
|
7900
|
+
"snapshot": "true",
|
7901
|
+
"skip_rules": {
|
7902
|
+
"wont_fix": [
|
7903
|
+
"region"
|
7904
|
+
],
|
7905
|
+
"will_fix": [
|
7906
|
+
"color-contrast"
|
7907
|
+
]
|
7908
|
+
}
|
7909
|
+
},
|
7910
|
+
{
|
7911
|
+
"preview_path": "primer/alpha/text_field/with_trailing_text",
|
7912
|
+
"name": "with_trailing_text",
|
7913
|
+
"snapshot": "true",
|
7914
|
+
"skip_rules": {
|
7915
|
+
"wont_fix": [
|
7916
|
+
"region"
|
7917
|
+
],
|
7918
|
+
"will_fix": [
|
7919
|
+
"color-contrast"
|
7920
|
+
]
|
7921
|
+
}
|
7922
|
+
},
|
7923
|
+
{
|
7924
|
+
"preview_path": "primer/alpha/text_field/with_trailing_long_text",
|
7925
|
+
"name": "with_trailing_long_text",
|
7926
|
+
"snapshot": "true",
|
7927
|
+
"skip_rules": {
|
7928
|
+
"wont_fix": [
|
7929
|
+
"region"
|
7930
|
+
],
|
7931
|
+
"will_fix": [
|
7932
|
+
"color-contrast"
|
7933
|
+
]
|
7934
|
+
}
|
7935
|
+
},
|
7936
|
+
{
|
7937
|
+
"preview_path": "primer/alpha/text_field/with_trailing_counter",
|
7938
|
+
"name": "with_trailing_counter",
|
7939
|
+
"snapshot": "true",
|
7940
|
+
"skip_rules": {
|
7941
|
+
"wont_fix": [
|
7942
|
+
"region"
|
7943
|
+
],
|
7944
|
+
"will_fix": [
|
7945
|
+
"color-contrast"
|
7946
|
+
]
|
7947
|
+
}
|
7948
|
+
},
|
7949
|
+
{
|
7950
|
+
"preview_path": "primer/alpha/text_field/with_trailing_label",
|
7951
|
+
"name": "with_trailing_label",
|
7952
|
+
"snapshot": "true",
|
7953
|
+
"skip_rules": {
|
7954
|
+
"wont_fix": [
|
7955
|
+
"region"
|
7956
|
+
],
|
7957
|
+
"will_fix": [
|
7958
|
+
"color-contrast"
|
7959
|
+
]
|
7960
|
+
}
|
7961
|
+
},
|
7897
7962
|
{
|
7898
7963
|
"preview_path": "primer/alpha/text_field/with_leading_visual",
|
7899
7964
|
"name": "with_leading_visual",
|
metadata
CHANGED
@@ -1,7 +1,7 @@
|
|
1
1
|
--- !ruby/object:Gem::Specification
|
2
2
|
name: openproject-primer_view_components
|
3
3
|
version: !ruby/object:Gem::Version
|
4
|
-
version: 0.52.
|
4
|
+
version: 0.52.3
|
5
5
|
platform: ruby
|
6
6
|
authors:
|
7
7
|
- GitHub Open Source
|
@@ -9,7 +9,7 @@ authors:
|
|
9
9
|
autorequire:
|
10
10
|
bindir: bin
|
11
11
|
cert_chain: []
|
12
|
-
date: 2025-01-
|
12
|
+
date: 2025-01-28 00:00:00.000000000 Z
|
13
13
|
dependencies:
|
14
14
|
- !ruby/object:Gem::Dependency
|
15
15
|
name: actionview
|