openproject-primer_view_components 0.6.3 → 0.7.0
Sign up to get free protection for your applications and to get access to all the features.
- checksums.yaml +4 -4
- data/CHANGELOG.md +28 -0
- data/README.md +13 -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_bar.rb +0 -7
- data/app/components/primer/alpha/action_list.css +1 -1
- data/app/components/primer/alpha/action_list.css.map +1 -1
- data/app/components/primer/alpha/action_menu.rb +0 -269
- data/app/components/primer/alpha/auto_complete/item.rb +0 -12
- data/app/components/primer/alpha/auto_complete.css +1 -1
- data/app/components/primer/alpha/auto_complete.css.map +1 -1
- data/app/components/primer/alpha/auto_complete.rb +0 -47
- data/app/components/primer/alpha/banner.css +1 -1
- data/app/components/primer/alpha/banner.css.map +1 -1
- data/app/components/primer/alpha/banner.rb +0 -31
- data/app/components/primer/alpha/button_marketing.rb +0 -12
- data/app/components/primer/alpha/dialog.css +1 -1
- data/app/components/primer/alpha/dialog.css.map +1 -1
- data/app/components/primer/alpha/dialog.rb +0 -17
- data/app/components/primer/alpha/dropdown.css +1 -1
- data/app/components/primer/alpha/dropdown.css.map +1 -1
- data/app/components/primer/alpha/dropdown.rb +0 -105
- data/app/components/primer/alpha/form_control.rb +0 -11
- data/app/components/primer/alpha/hellip_button.rb +0 -9
- data/app/components/primer/alpha/hidden_text_expander.rb +0 -9
- data/app/components/primer/alpha/image.rb +0 -16
- data/app/components/primer/alpha/image_crop.rb +0 -11
- data/app/components/primer/alpha/layout.css +1 -1
- data/app/components/primer/alpha/layout.css.map +1 -1
- data/app/components/primer/alpha/layout.pcss +1 -1
- data/app/components/primer/alpha/layout.rb +0 -118
- data/app/components/primer/alpha/menu.css +1 -1
- data/app/components/primer/alpha/menu.css.map +1 -1
- data/app/components/primer/alpha/menu.rb +0 -19
- data/app/components/primer/alpha/multi_input.rb +0 -33
- data/app/components/primer/alpha/nav_list.rb +0 -69
- data/app/components/primer/alpha/navigation/tab.rb +0 -35
- data/app/components/primer/alpha/octicon_symbols.rb +0 -6
- data/app/components/primer/alpha/overlay.rb +0 -14
- data/app/components/primer/alpha/segmented_control.css +1 -1
- data/app/components/primer/alpha/segmented_control.css.map +1 -1
- data/app/components/primer/alpha/segmented_control.rb +0 -61
- data/app/components/primer/alpha/tab_container.rb +0 -18
- data/app/components/primer/alpha/tab_nav.css +1 -1
- data/app/components/primer/alpha/tab_nav.css.map +1 -1
- data/app/components/primer/alpha/tab_nav.rb +0 -63
- data/app/components/primer/alpha/tab_panels.rb +0 -16
- data/app/components/primer/alpha/text_field.css +1 -1
- data/app/components/primer/alpha/text_field.css.map +1 -1
- data/app/components/primer/alpha/text_field.rb +0 -68
- data/app/components/primer/alpha/toggle_switch.css +1 -1
- data/app/components/primer/alpha/toggle_switch.css.map +1 -1
- data/app/components/primer/alpha/toggle_switch.rb +0 -18
- data/app/components/primer/alpha/tooltip.rb +1 -69
- data/app/components/primer/alpha/underline_nav.css +1 -1
- data/app/components/primer/alpha/underline_nav.css.map +1 -1
- data/app/components/primer/alpha/underline_nav.rb +0 -61
- data/app/components/primer/alpha/underline_panels.rb +0 -19
- data/app/components/primer/beta/auto_complete/item.rb +0 -8
- data/app/components/primer/beta/auto_complete.rb +0 -56
- data/app/components/primer/beta/avatar.css +1 -1
- data/app/components/primer/beta/avatar.css.map +1 -1
- data/app/components/primer/beta/avatar.rb +0 -18
- data/app/components/primer/beta/avatar_stack.css +1 -1
- data/app/components/primer/beta/avatar_stack.css.map +1 -1
- data/app/components/primer/beta/avatar_stack.rb +0 -21
- data/app/components/primer/beta/base_button.rb +0 -4
- data/app/components/primer/beta/blankslate.css +1 -1
- data/app/components/primer/beta/blankslate.css.map +1 -1
- data/app/components/primer/beta/blankslate.rb +0 -104
- data/app/components/primer/beta/border_box/header.rb +4 -11
- data/app/components/primer/beta/border_box.css +1 -1
- data/app/components/primer/beta/border_box.css.map +1 -1
- data/app/components/primer/beta/border_box.html.erb +2 -2
- data/app/components/primer/beta/border_box.rb +11 -55
- data/app/components/primer/beta/breadcrumbs.rb +0 -7
- data/app/components/primer/beta/button.css +1 -1
- data/app/components/primer/beta/button.css.map +1 -1
- data/app/components/primer/beta/button.pcss +2 -2
- data/app/components/primer/beta/button.rb +0 -42
- data/app/components/primer/beta/button_group.css +1 -1
- data/app/components/primer/beta/button_group.css.map +1 -1
- data/app/components/primer/beta/button_group.rb +0 -16
- data/app/components/primer/beta/clipboard_copy.rb +0 -12
- data/app/components/primer/beta/close_button.rb +0 -3
- data/app/components/primer/beta/counter.rb +0 -8
- data/app/components/primer/beta/details.rb +0 -11
- data/app/components/primer/beta/flash.css +1 -1
- data/app/components/primer/beta/flash.css.map +1 -1
- data/app/components/primer/beta/flash.rb +1 -23
- data/app/components/primer/beta/heading.rb +0 -8
- data/app/components/primer/beta/icon_button.rb +0 -21
- data/app/components/primer/beta/label.css +1 -1
- data/app/components/primer/beta/label.css.map +1 -1
- data/app/components/primer/beta/label.rb +0 -20
- data/app/components/primer/beta/link.rb +0 -22
- data/app/components/primer/beta/markdown.rb +1 -262
- data/app/components/primer/beta/octicon.rb +0 -10
- data/app/components/primer/beta/popover.css +1 -1
- data/app/components/primer/beta/popover.css.map +1 -1
- data/app/components/primer/beta/popover.rb +0 -43
- data/app/components/primer/beta/progress_bar.rb +1 -22
- data/app/components/primer/beta/relative_time.rb +0 -9
- data/app/components/primer/beta/spinner.rb +2 -10
- data/app/components/primer/beta/state.rb +0 -13
- data/app/components/primer/beta/subhead.rb +0 -55
- data/app/components/primer/beta/text.rb +0 -4
- data/app/components/primer/beta/timeline_item.css +1 -1
- data/app/components/primer/beta/timeline_item.css.map +1 -1
- data/app/components/primer/beta/timeline_item.rb +0 -9
- data/app/components/primer/beta/truncate.rb +0 -50
- data/app/components/primer/blankslate_component.rb +0 -76
- data/app/components/primer/box.rb +0 -6
- data/app/components/primer/button_component.rb +0 -49
- data/app/components/primer/conditional_wrapper.rb +2 -17
- data/app/components/primer/icon_button.rb +0 -30
- data/app/components/primer/layout_component.rb +0 -12
- data/app/components/primer/tooltip.rb +0 -27
- data/app/components/primer/truncate.rb +0 -19
- data/lib/primer/accessibility.rb +1 -1
- data/lib/primer/deprecations.yml +3 -3
- data/lib/primer/forms/dsl/input.rb +1 -0
- data/lib/primer/view_components/linters/migrations/truncate_component.rb +45 -0
- data/lib/primer/view_components/linters.rb +1 -0
- data/lib/primer/view_components/version.rb +2 -2
- data/lib/primer/yard.rb +8 -9
- data/static/arguments.json +12 -1
- data/static/info_arch.json +18 -1
- metadata +3 -3
- data/lib/primer/yard/legacy_gatsby_backend.rb +0 -233
@@ -14,56 +14,6 @@ module Primer
|
|
14
14
|
# @param system_arguments [Hash] <%= link_to_system_arguments_docs %>
|
15
15
|
renders_many :items, "TruncateText"
|
16
16
|
|
17
|
-
# @example Default
|
18
|
-
# <%= render(Primer::Beta::Truncate.new) { "branch-name-that-is-really-long" } %>
|
19
|
-
#
|
20
|
-
# @example Multiple items
|
21
|
-
# <%= render(Primer::Beta::Truncate.new) do |component| %>
|
22
|
-
# <% component.with_item do %>really-long-repository-owner-name<% end %>
|
23
|
-
# <% component.with_item(font_weight: :bold) do %>
|
24
|
-
# <%= render(Primer::BaseComponent.new(tag: :span, font_weight: :normal)) { "/" } %> really-long-repository-name
|
25
|
-
# <% end %>
|
26
|
-
# <% end %>
|
27
|
-
#
|
28
|
-
# @example Advanced multiple items
|
29
|
-
# <%= render(Primer::Beta::Truncate.new(tag: :ol)) do |component| %>
|
30
|
-
# <% component.with_item(tag: :li) do %>primer<% end %>
|
31
|
-
# <% component.with_item(tag: :li, priority: true) do %>/ css<% end %>
|
32
|
-
# <% component.with_item(tag: :li) do %>/ Issues<% end %>
|
33
|
-
# <% component.with_item(tag: :li) do %>/ #123 —<% end %>
|
34
|
-
# <% component.with_item(tag: :li, priority: true) do %>
|
35
|
-
# Visual bug on primer.style found in lists
|
36
|
-
# <% end %>
|
37
|
-
# <% end %>
|
38
|
-
#
|
39
|
-
# @example Expand on hover or focus
|
40
|
-
# <%= render(Primer::Beta::Truncate.new) do |component| %>
|
41
|
-
# <% component.with_item(tag: :a, href: "#", expandable: true) do %>really-long-repository-owner-name<% end %>
|
42
|
-
# <% component.with_item(tag: :a, href: "#", expandable: true) do %>really-long-repository-owner-name<% end %>
|
43
|
-
# <% component.with_item(tag: :a, href: "#", expandable: true) do %>really-long-repository-owner-name<% end %>
|
44
|
-
# <% component.with_item(tag: :a, href: "#", expandable: true) do %>really-long-repository-owner-name<% end %>
|
45
|
-
# <% end %>
|
46
|
-
#
|
47
|
-
# @example Max widths
|
48
|
-
# <%= render(Primer::Beta::Truncate.new) do |component| %>
|
49
|
-
# <% component.with_item(max_width: 300, expandable: true) do %>branch-name-that-is-really-long-branch-name-that-is-really-long-branch-name-that-is-really-long<% end %>
|
50
|
-
# <% component.with_item(max_width: 200, expandable: true) do %>branch-name-that-is-really-long-branch-name-that-is-really-long-branch-name-that-is-really-long<% end %>
|
51
|
-
# <% component.with_item(max_width: 100, expandable: true) do %>branch-name-that-is-really-long-branch-name-that-is-really-long-branch-name-that-is-really-long<% end %>
|
52
|
-
# <% end %>
|
53
|
-
#
|
54
|
-
# @example Max widths on new lines
|
55
|
-
# <%= render(Primer::Beta::Truncate.new) do |component| %>
|
56
|
-
# <% component.with_item(max_width: 300, expandable: true) do %>branch-name-that-is-really-long-branch-name-that-is-really-long-branch-name-that-is-really-long<% end %>
|
57
|
-
# <% end %>
|
58
|
-
# <br/>
|
59
|
-
# <%= render(Primer::Beta::Truncate.new) do |component| %>
|
60
|
-
# <% component.with_item(max_width: 200, expandable: true) do %>branch-name-that-is-really-long-branch-name-that-is-really-long-branch-name-that-is-really-long<% end %>
|
61
|
-
# <% end %>
|
62
|
-
# <br/>
|
63
|
-
# <%= render(Primer::Beta::Truncate.new) do |component| %>
|
64
|
-
# <% component.with_item(max_width: 100, expandable: true) do %>branch-name-that-is-really-long-branch-name-that-is-really-long-branch-name-that-is-really-long<% end %>
|
65
|
-
# <% end %>
|
66
|
-
#
|
67
17
|
# @param system_arguments [Hash] <%= link_to_system_arguments_docs %>
|
68
18
|
def initialize(**system_arguments)
|
69
19
|
@system_arguments = system_arguments
|
@@ -16,82 +16,6 @@ module Primer
|
|
16
16
|
Primer::Beta::Spinner.new(**system_arguments)
|
17
17
|
}
|
18
18
|
|
19
|
-
#
|
20
|
-
# @example Basic
|
21
|
-
# <%= render Primer::BlankslateComponent.new(
|
22
|
-
# title: "Title",
|
23
|
-
# description: "Description",
|
24
|
-
# ) %>
|
25
|
-
#
|
26
|
-
# @example Icon
|
27
|
-
# @description
|
28
|
-
# Add an `icon` to give additional context. Refer to the [Octicons](https://primer.style/octicons/) documentation to choose an icon.
|
29
|
-
# @code
|
30
|
-
# <%= render Primer::BlankslateComponent.new(
|
31
|
-
# icon: :globe,
|
32
|
-
# title: "Title",
|
33
|
-
# description: "Description",
|
34
|
-
# ) %>
|
35
|
-
#
|
36
|
-
# @example Loading
|
37
|
-
# @description
|
38
|
-
# Add a [SpinnerComponent](https://primer.style/view-components/components/spinner) to the blankslate in place of an icon.
|
39
|
-
# @code
|
40
|
-
# <%= render Primer::BlankslateComponent.new(
|
41
|
-
# title: "Title",
|
42
|
-
# description: "Description",
|
43
|
-
# ) do |component| %>
|
44
|
-
# <% component.with_spinner(size: :large) %>
|
45
|
-
# <% end %>
|
46
|
-
#
|
47
|
-
# @example Custom content
|
48
|
-
# @description
|
49
|
-
# Pass custom content as a block in place of `description`.
|
50
|
-
# @code
|
51
|
-
# <%= render Primer::BlankslateComponent.new(
|
52
|
-
# title: "Title",
|
53
|
-
# ) do %>
|
54
|
-
# <em>Your custom content here</em>
|
55
|
-
# <% end %>
|
56
|
-
#
|
57
|
-
# @example Action button
|
58
|
-
# @description
|
59
|
-
# Provide a button to guide users to take action from the blankslate. The button appears below the description and custom content.
|
60
|
-
# @code
|
61
|
-
# <%= render Primer::BlankslateComponent.new(
|
62
|
-
# icon: :book,
|
63
|
-
# title: "Welcome to the mona wiki!",
|
64
|
-
# description: "Wikis provide a place in your repository to lay out the roadmap of your project, show the current status, and document software better, together.",
|
65
|
-
#
|
66
|
-
# button_text: "Create the first page",
|
67
|
-
# button_url: "https://github.com/monalisa/mona/wiki/_new",
|
68
|
-
# ) %>
|
69
|
-
#
|
70
|
-
# @example Link
|
71
|
-
# @description
|
72
|
-
# Add an additional link to help users learn more about a feature. The link will be shown at the very bottom:
|
73
|
-
# @code
|
74
|
-
# <%= render Primer::BlankslateComponent.new(
|
75
|
-
# icon: :book,
|
76
|
-
# title: "Welcome to the mona wiki!",
|
77
|
-
# description: "Wikis provide a place in your repository to lay out the roadmap of your project, show the current status, and document software better, together.",
|
78
|
-
# link_text: "Learn more about wikis",
|
79
|
-
# link_url: "https://docs.github.com/en/github/building-a-strong-community/about-wikis",
|
80
|
-
# ) %>
|
81
|
-
#
|
82
|
-
# @example Variations
|
83
|
-
# @description
|
84
|
-
# There are a few variations of how the Blankslate appears: `narrow` adds a maximum width, `large` increases the font size, and `spacious` adds extra padding.
|
85
|
-
# @code
|
86
|
-
# <%= render Primer::BlankslateComponent.new(
|
87
|
-
# icon: :book,
|
88
|
-
# title: "Welcome to the mona wiki!",
|
89
|
-
# description: "Wikis provide a place in your repository to lay out the roadmap of your project, show the current status, and document software better, together.",
|
90
|
-
# narrow: true,
|
91
|
-
# large: true,
|
92
|
-
# spacious: true,
|
93
|
-
# ) %>
|
94
|
-
#
|
95
19
|
# @param title [String] Text that appears in a larger bold font.
|
96
20
|
# @param title_tag [Symbol] HTML tag to use for title.
|
97
21
|
# @param icon [Symbol] Octicon icon to use at top of component.
|
@@ -5,12 +5,6 @@ module Primer
|
|
5
5
|
class Box < Primer::Component
|
6
6
|
status :stable
|
7
7
|
|
8
|
-
# @example Default
|
9
|
-
# <%= render(Primer::Box.new) { "Your content here" } %>
|
10
|
-
#
|
11
|
-
# @example Color and padding
|
12
|
-
# <%= render(Primer::Box.new(bg: :subtle, p: 3)) { "Hello world" } %>
|
13
|
-
#
|
14
8
|
# @param system_arguments [Hash] <%= link_to_system_arguments_docs %>
|
15
9
|
def initialize(**system_arguments)
|
16
10
|
@system_arguments = deny_tag_argument(**system_arguments)
|
@@ -71,55 +71,6 @@ module Primer
|
|
71
71
|
Primer::Alpha::Tooltip.new(**system_arguments)
|
72
72
|
}
|
73
73
|
|
74
|
-
# @example Schemes
|
75
|
-
# <%= render(Primer::ButtonComponent.new) { "Default" } %>
|
76
|
-
# <%= render(Primer::ButtonComponent.new(scheme: :primary)) { "Primary" } %>
|
77
|
-
# <%= render(Primer::ButtonComponent.new(scheme: :danger)) { "Danger" } %>
|
78
|
-
# <%= render(Primer::ButtonComponent.new(scheme: :outline)) { "Outline" } %>
|
79
|
-
# <%= render(Primer::ButtonComponent.new(scheme: :invisible)) { "Invisible" } %>
|
80
|
-
# <%= render(Primer::ButtonComponent.new(scheme: :link)) { "Link" } %>
|
81
|
-
#
|
82
|
-
# @example Sizes
|
83
|
-
# <%= render(Primer::ButtonComponent.new(size: :small)) { "Small" } %>
|
84
|
-
# <%= render(Primer::ButtonComponent.new(size: :medium)) { "Medium" } %>
|
85
|
-
#
|
86
|
-
# @example Block
|
87
|
-
# <%= render(Primer::ButtonComponent.new(block: :true)) { "Block" } %>
|
88
|
-
# <%= render(Primer::ButtonComponent.new(block: :true, scheme: :primary)) { "Primary block" } %>
|
89
|
-
#
|
90
|
-
# @example With leading visual
|
91
|
-
# <%= render(Primer::ButtonComponent.new) do |component| %>
|
92
|
-
# <% component.with_leading_visual_icon(icon: :star) %>
|
93
|
-
# Button
|
94
|
-
# <% end %>
|
95
|
-
#
|
96
|
-
# @example With trailing visual
|
97
|
-
# <%= render(Primer::ButtonComponent.new) do |component| %>
|
98
|
-
# <% component.with_trailing_visual_counter(count: 15) %>
|
99
|
-
# Button
|
100
|
-
# <% end %>
|
101
|
-
#
|
102
|
-
# @example With leading and trailing visuals
|
103
|
-
# <%= render(Primer::ButtonComponent.new) do |component| %>
|
104
|
-
# <% component.with_leading_visual_icon(icon: :star) %>
|
105
|
-
# <% component.with_trailing_visual_counter(count: 15) %>
|
106
|
-
# Button
|
107
|
-
# <% end %>
|
108
|
-
#
|
109
|
-
# @example With dropdown caret
|
110
|
-
# <%= render(Primer::ButtonComponent.new(dropdown: true)) do %>
|
111
|
-
# Button
|
112
|
-
# <% end %>
|
113
|
-
#
|
114
|
-
# @example With tooltip
|
115
|
-
# @description
|
116
|
-
# Use tooltips sparingly and as a last resort. Consult the <%= link_to_component(Primer::Alpha::Tooltip) %> documentation for more information.
|
117
|
-
# @code
|
118
|
-
# <%= render(Primer::ButtonComponent.new(id: "button-with-tooltip")) do |component| %>
|
119
|
-
# <% component.with_tooltip(text: "Tooltip text") %>
|
120
|
-
# Button
|
121
|
-
# <% end %>
|
122
|
-
#
|
123
74
|
# @param scheme [Symbol] <%= one_of(Primer::ButtonComponent::SCHEME_OPTIONS) %>
|
124
75
|
# @param variant [Symbol] DEPRECATED. <%= one_of(Primer::ButtonComponent::SIZE_OPTIONS) %>
|
125
76
|
# @param size [Symbol] <%= one_of(Primer::ButtonComponent::SIZE_OPTIONS) %>
|
@@ -4,24 +4,9 @@ module Primer
|
|
4
4
|
# Conditionally renders a `Primer::BaseComponent` around the given content. If the given condition
|
5
5
|
# is true, a `Primer::BaseComponent` will render around the content. If the condition is false, only
|
6
6
|
# the content is rendered.
|
7
|
-
#
|
8
|
-
# @example True conditional
|
9
|
-
# <%# condition is true, so content will be wrapped in a <span> tag
|
10
|
-
# <%= render Primer::ConditionalWrapper.new(condition: true, tag: :span, class: "foobar")) do %>
|
11
|
-
# <%# also rendered %>
|
12
|
-
# <p class="bazboo">Some text</p>
|
13
|
-
# <% end %>
|
14
|
-
#
|
15
|
-
# @example False conditional
|
16
|
-
# <%# condition is false so no <span> tag will render around the content (i.e. the <p> tag)
|
17
|
-
# <%= render(Primer::ConditionalWrapper.new(condition: false, tag: :span, class: "foobar")) do %>
|
18
|
-
# <%# this content will be rendered %>
|
19
|
-
# <p class="bazboo">Some text</p>
|
20
|
-
# <% end %>
|
21
|
-
#
|
22
|
-
# @param condition [Boolean] Whether or not to wrap the content in a `Primer::BaseComponent`.
|
23
|
-
# @param base_component_arguments [Hash] The arguments to pass to `Primer::BaseComponent`.
|
24
7
|
class ConditionalWrapper < Primer::Component
|
8
|
+
# @param condition [Boolean] Whether or not to wrap the content in a `Primer::BaseComponent`.
|
9
|
+
# @param base_component_arguments [Hash] The arguments to pass to `Primer::BaseComponent`.
|
25
10
|
def initialize(condition:, **base_component_arguments)
|
26
11
|
@condition = condition
|
27
12
|
@base_component_arguments = base_component_arguments
|
@@ -21,36 +21,6 @@ module Primer
|
|
21
21
|
}.freeze
|
22
22
|
SCHEME_OPTIONS = SCHEME_MAPPINGS.keys
|
23
23
|
|
24
|
-
# @example Default
|
25
|
-
#
|
26
|
-
# <%= render(Primer::IconButton.new(icon: :search, "aria-label": "Search", id: "search-button")) %>
|
27
|
-
#
|
28
|
-
# @example Schemes
|
29
|
-
#
|
30
|
-
# <%= render(Primer::IconButton.new(icon: :search, "aria-label": "Search")) %>
|
31
|
-
# <%= render(Primer::IconButton.new(icon: :trash, "aria-label": "Delete", scheme: :danger)) %>
|
32
|
-
#
|
33
|
-
# @example In a BorderBox
|
34
|
-
#
|
35
|
-
# <%= render(Primer::Beta::BorderBox.new) do |component| %>
|
36
|
-
# <% component.with_body do %>
|
37
|
-
# <%= render(Primer::Beta::Text.new(pr: 2)) { "Body" } %>
|
38
|
-
# <%= render(Primer::IconButton.new(icon: :pencil, box: true, "aria-label": "Edit")) %>
|
39
|
-
# <% end %>
|
40
|
-
# <% end %>
|
41
|
-
#
|
42
|
-
# @example With an `aria-description`
|
43
|
-
# @description
|
44
|
-
# If you need to have a longer description for the icon button, use both the `aria-label` and `aria-description`
|
45
|
-
# attributes. A label should be short and concise, while the description can be longer as it is intended to provide
|
46
|
-
# more context and information. See the accessibility section for more information.
|
47
|
-
# @code
|
48
|
-
# <%= render(Primer::IconButton.new(icon: :bold, "aria-label": "Bold", "aria-description": "Add bold text, Cmd+b")) %>
|
49
|
-
#
|
50
|
-
# @example Custom tooltip direction
|
51
|
-
#
|
52
|
-
# <%= render(Primer::IconButton.new(icon: :search, "aria-label": "Search", tooltip_direction: :e)) %>
|
53
|
-
#
|
54
24
|
# @param scheme [Symbol] <%= one_of(Primer::IconButton::SCHEME_OPTIONS) %>
|
55
25
|
# @param icon [String] Name of <%= link_to_octicons %> to use.
|
56
26
|
# @param tag [Symbol] <%= one_of(Primer::Beta::BaseButton::TAG_OPTIONS) %>
|
@@ -38,18 +38,6 @@ module Primer
|
|
38
38
|
DEFAULT_SIDEBAR_COL = 3
|
39
39
|
ALLOWED_SIDEBAR_COLS = (1..(MAX_COL - 1)).to_a.freeze
|
40
40
|
|
41
|
-
# @example Default
|
42
|
-
# <%= render(Primer::LayoutComponent.new) do |component| %>
|
43
|
-
# <% component.with_sidebar { "Sidebar" } %>
|
44
|
-
# <% component.with_main { "Main" } %>
|
45
|
-
# <% end %>
|
46
|
-
#
|
47
|
-
# @example Left sidebar
|
48
|
-
# <%= render(Primer::LayoutComponent.new(side: :left)) do |component| %>
|
49
|
-
# <% component.with_sidebar { "Sidebar" } %>
|
50
|
-
# <% component.with_main { "Main" } %>
|
51
|
-
# <% end %>
|
52
|
-
#
|
53
41
|
# @param responsive [Boolean] Whether to collapse layout to a single column at smaller widths.
|
54
42
|
# @param side [Symbol] Which side to display the sidebar on. <%= one_of(Primer::LayoutComponent::ALLOWED_SIDES) %>
|
55
43
|
# @param sidebar_col [Integer] Sidebar column width.
|
@@ -28,33 +28,6 @@ module Primer
|
|
28
28
|
se
|
29
29
|
]
|
30
30
|
|
31
|
-
# @example Default
|
32
|
-
# <div class="pt-5">
|
33
|
-
# <%= render(Primer::Tooltip.new(label: "Even bolder")) { "Default Bold Text" } %>
|
34
|
-
# </div>
|
35
|
-
#
|
36
|
-
# @example Wrapping another component
|
37
|
-
# <div class="pt-5">
|
38
|
-
# <%= render(Primer::Tooltip.new(label: "Even bolder")) do %>
|
39
|
-
# <%= render(Primer::ButtonComponent.new) { "Bold Button" } %>
|
40
|
-
# <% end %>
|
41
|
-
# </div>
|
42
|
-
#
|
43
|
-
# @example With a direction
|
44
|
-
# <div class="pt-5">
|
45
|
-
# <%= render(Primer::Tooltip.new(label: "Even bolder", direction: :s)) { "Bold Text With a Direction" } %>
|
46
|
-
# </div>
|
47
|
-
#
|
48
|
-
# @example With an alignment
|
49
|
-
# <div class="pt-5">
|
50
|
-
# <%= render(Primer::Tooltip.new(label: "Even bolder", direction: :s, alignment: :right_1)) { "Bold Text With an Alignment" } %>
|
51
|
-
# </div>
|
52
|
-
#
|
53
|
-
# @example Without a delay
|
54
|
-
# <div class="pt-5">
|
55
|
-
# <%= render(Primer::Tooltip.new(label: "Even bolder", direction: :s, no_delay: true)) { "Bold Text without a delay" } %>
|
56
|
-
# </div>
|
57
|
-
#
|
58
31
|
# @param label [String] the text to appear in the tooltip
|
59
32
|
# @param direction [String] Direction of the tooltip. <%= one_of(Primer::Tooltip::DIRECTION_OPTIONS) %>
|
60
33
|
# @param align [String] Align tooltips to the left or right of an element, combined with a `direction` to specify north or south. <%= one_of(Primer::Tooltip::ALIGN_MAPPING.keys) %>
|
@@ -8,25 +8,6 @@ module Primer
|
|
8
8
|
DEFAULT_TAG = :div
|
9
9
|
TAG_OPTIONS = [DEFAULT_TAG, :span, :p, :strong].freeze
|
10
10
|
|
11
|
-
# @example Default
|
12
|
-
# <div class="col-2">
|
13
|
-
# <%= render(Primer::Truncate.new(tag: :p)) { "branch-name-that-is-really-long" } %>
|
14
|
-
# </div>
|
15
|
-
#
|
16
|
-
# @example Inline
|
17
|
-
# <%= render(Primer::Truncate.new(tag: :span, inline: true)) { "branch-name-that-is-really-long" } %>
|
18
|
-
#
|
19
|
-
# @example Expandable
|
20
|
-
# <%= render(Primer::Truncate.new(tag: :span, inline: true, expandable: true)) { "branch-name-that-is-really-long" } %>
|
21
|
-
#
|
22
|
-
# @example Custom size
|
23
|
-
# <%= render(Primer::Truncate.new(tag: :span, inline: true, expandable: true, max_width: 100)) { "branch-name-that-is-really-long" } %>
|
24
|
-
#
|
25
|
-
# @example With HTML content
|
26
|
-
# <%= render(Primer::Truncate.new(tag: :span, inline: true, expandable: true, max_width: 100)) do %>
|
27
|
-
# <span>branch-name-that-is-really-long</span>
|
28
|
-
# <% end %>
|
29
|
-
#
|
30
11
|
# @param tag [Symbol] <%= one_of(Primer::Truncate::TAG_OPTIONS) %>
|
31
12
|
# @param inline [Boolean] Whether the element is inline (or inline-block).
|
32
13
|
# @param expandable [Boolean] Whether the entire string should be revealed on hover. Can only be used in conjunction with `inline`.
|
data/lib/primer/accessibility.rb
CHANGED
@@ -39,7 +39,7 @@ module Primer
|
|
39
39
|
|
40
40
|
class << self
|
41
41
|
def ignore_preview?(preview_class)
|
42
|
-
|
42
|
+
IGNORED_PREVIEWS.include?(preview_class)
|
43
43
|
end
|
44
44
|
|
45
45
|
def axe_rules_to_skip(component: nil, scenario_name: nil, flatten: false)
|
data/lib/primer/deprecations.yml
CHANGED
@@ -20,7 +20,7 @@ deprecations:
|
|
20
20
|
- component: "Primer::ButtonComponent"
|
21
21
|
autocorrect: false
|
22
22
|
replacement: "Primer::Beta::Button"
|
23
|
-
guide: "https://primer.style/
|
23
|
+
guide: "https://primer.style/design/guides/development/rails/migration-guides/primer-button-component"
|
24
24
|
|
25
25
|
- component: "Primer::IconButton"
|
26
26
|
autocorrect: true
|
@@ -29,7 +29,7 @@ deprecations:
|
|
29
29
|
- component: "Primer::LayoutComponent"
|
30
30
|
autocorrect: false
|
31
31
|
replacement: "Primer::Alpha::Layout"
|
32
|
-
guide: "https://primer.style/
|
32
|
+
guide: "https://primer.style/design/guides/development/rails/migration-guides/primer-layout-component"
|
33
33
|
|
34
34
|
- component: "Primer::Navigation::TabComponent"
|
35
35
|
autocorrect: true
|
@@ -42,4 +42,4 @@ deprecations:
|
|
42
42
|
- component: "Primer::Truncate"
|
43
43
|
autocorrect: false
|
44
44
|
replacement: "Primer::Beta::Truncate"
|
45
|
-
guide: "https://primer.style/
|
45
|
+
guide: "https://primer.style/design/guides/development/rails/migration-guides/primer-truncate"
|
@@ -115,6 +115,7 @@ module Primer
|
|
115
115
|
end
|
116
116
|
|
117
117
|
add_input_aria(:required, true) if required?
|
118
|
+
add_input_aria(:invalid, true) if invalid?
|
118
119
|
add_input_aria(:describedby, ids.values) if ids.any?
|
119
120
|
|
120
121
|
# avoid browser-native validation, which doesn't match Primer's style
|
@@ -0,0 +1,45 @@
|
|
1
|
+
# frozen_string_literal: true
|
2
|
+
|
3
|
+
module RuboCop
|
4
|
+
module Cop
|
5
|
+
module Migrations
|
6
|
+
# Lint & autocorrect Truncate components
|
7
|
+
class TruncateComponent < RuboCop::Cop::Cop
|
8
|
+
INVALID_MESSAGE = <<~STR
|
9
|
+
`Primer::Truncate` is deprecated. Please use `Primer::Beta::Truncate` instead!
|
10
|
+
STR
|
11
|
+
|
12
|
+
def_node_matcher :truncate_component, <<~PATTERN
|
13
|
+
(send (const (const nil? :Primer) :Truncate) :new ...)
|
14
|
+
PATTERN
|
15
|
+
|
16
|
+
def_node_matcher :hash_with_inline_value?, <<~PATTERN
|
17
|
+
(hash ... (pair (sym :inline) (...)) ... )
|
18
|
+
PATTERN
|
19
|
+
|
20
|
+
def_node_matcher :truncate_with_tag?, <<~PATTERN
|
21
|
+
(hash ... (pair (sym :tag) (...)) ... )
|
22
|
+
PATTERN
|
23
|
+
|
24
|
+
def on_send(node)
|
25
|
+
return unless truncate_component(node)
|
26
|
+
|
27
|
+
add_offense(node, message: INVALID_MESSAGE)
|
28
|
+
end
|
29
|
+
|
30
|
+
def autocorrect(node)
|
31
|
+
return if hash_with_inline_value?(node.arguments.first)
|
32
|
+
|
33
|
+
lambda do |corrector|
|
34
|
+
if node.arguments.first.nil? == false
|
35
|
+
corrector.replace(node.children.first, "Primer::Beta::Truncate")
|
36
|
+
corrector.insert_after(node.arguments.first, ", tag: :div") unless truncate_with_tag?(node.arguments.first)
|
37
|
+
else
|
38
|
+
corrector.replace(node.loc.expression, "Primer::Beta::Truncate.new(tag: :div)")
|
39
|
+
end
|
40
|
+
end
|
41
|
+
end
|
42
|
+
end
|
43
|
+
end
|
44
|
+
end
|
45
|
+
end
|
data/lib/primer/yard.rb
CHANGED
@@ -5,15 +5,14 @@ require "yard"
|
|
5
5
|
module Primer
|
6
6
|
# :nodoc:
|
7
7
|
module Yard
|
8
|
-
autoload :Backend,
|
9
|
-
autoload :ComponentManifest,
|
10
|
-
autoload :ComponentRef,
|
11
|
-
autoload :DocsHelper,
|
12
|
-
autoload :InfoArchDocsHelper,
|
13
|
-
autoload :
|
14
|
-
autoload :
|
15
|
-
autoload :
|
16
|
-
autoload :RendersOneHandler, "primer/yard/renders_one_handler"
|
8
|
+
autoload :Backend, "primer/yard/backend"
|
9
|
+
autoload :ComponentManifest, "primer/yard/component_manifest"
|
10
|
+
autoload :ComponentRef, "primer/yard/component_ref"
|
11
|
+
autoload :DocsHelper, "primer/yard/docs_helper"
|
12
|
+
autoload :InfoArchDocsHelper, "primer/yard/info_arch_docs_helper"
|
13
|
+
autoload :Registry, "primer/yard/registry"
|
14
|
+
autoload :RendersManyHandler, "primer/yard/renders_many_handler"
|
15
|
+
autoload :RendersOneHandler, "primer/yard/renders_one_handler"
|
17
16
|
|
18
17
|
::YARD::Tags::Library.define_tag("Snapshot preview", :snapshot)
|
19
18
|
end
|
data/static/arguments.json
CHANGED
@@ -4248,7 +4248,18 @@
|
|
4248
4248
|
"source": "https://github.com/primer/view_components/tree/main/app/components/primer/conditional_wrapper.rb",
|
4249
4249
|
"lookbook": "https://primer.style/view-components/lookbook/inspect/primer/conditional_wrapper/default/",
|
4250
4250
|
"parameters": [
|
4251
|
-
|
4251
|
+
{
|
4252
|
+
"name": "condition",
|
4253
|
+
"type": "Boolean",
|
4254
|
+
"default": "N/A",
|
4255
|
+
"description": "Whether or not to wrap the content in a `Primer::BaseComponent`."
|
4256
|
+
},
|
4257
|
+
{
|
4258
|
+
"name": "base_component_arguments",
|
4259
|
+
"type": "Hash",
|
4260
|
+
"default": "N/A",
|
4261
|
+
"description": "The arguments to pass to `Primer::BaseComponent`."
|
4262
|
+
}
|
4252
4263
|
]
|
4253
4264
|
},
|
4254
4265
|
{
|
data/static/info_arch.json
CHANGED
@@ -10271,7 +10271,13 @@
|
|
10271
10271
|
}
|
10272
10272
|
],
|
10273
10273
|
"methods": [
|
10274
|
+
{
|
10275
|
+
"name": "id",
|
10276
|
+
"description": "Returns the value of attribute id.",
|
10277
|
+
"parameters": [
|
10274
10278
|
|
10279
|
+
]
|
10280
|
+
}
|
10275
10281
|
],
|
10276
10282
|
"previews": [
|
10277
10283
|
|
@@ -14016,7 +14022,18 @@
|
|
14016
14022
|
"source": "https://github.com/primer/view_components/tree/main/app/components/primer/conditional_wrapper.rb",
|
14017
14023
|
"lookbook": "https://primer.style/view-components/lookbook/inspect/primer/conditional_wrapper/default/",
|
14018
14024
|
"parameters": [
|
14019
|
-
|
14025
|
+
{
|
14026
|
+
"name": "condition",
|
14027
|
+
"type": "Boolean",
|
14028
|
+
"default": "N/A",
|
14029
|
+
"description": "Whether or not to wrap the content in a `Primer::BaseComponent`."
|
14030
|
+
},
|
14031
|
+
{
|
14032
|
+
"name": "base_component_arguments",
|
14033
|
+
"type": "Hash",
|
14034
|
+
"default": "N/A",
|
14035
|
+
"description": "The arguments to pass to `Primer::BaseComponent`."
|
14036
|
+
}
|
14020
14037
|
],
|
14021
14038
|
"slots": [
|
14022
14039
|
|
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.
|
4
|
+
version: 0.7.0
|
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: 2023-08-
|
12
|
+
date: 2023-08-16 00:00:00.000000000 Z
|
13
13
|
dependencies:
|
14
14
|
- !ruby/object:Gem::Dependency
|
15
15
|
name: actionview
|
@@ -935,6 +935,7 @@ files:
|
|
935
935
|
- lib/primer/view_components/linters/helpers/rule_helpers.rb
|
936
936
|
- lib/primer/view_components/linters/label_component_migration_counter.rb
|
937
937
|
- lib/primer/view_components/linters/migrate_deprecated_flash_arguments.rb
|
938
|
+
- lib/primer/view_components/linters/migrations/truncate_component.rb
|
938
939
|
- lib/primer/view_components/linters/severity_schema.rb
|
939
940
|
- lib/primer/view_components/linters/subhead_component_migration_counter.rb
|
940
941
|
- lib/primer/view_components/linters/super_in_component_templates.rb
|
@@ -949,7 +950,6 @@ files:
|
|
949
950
|
- lib/primer/yard/component_ref.rb
|
950
951
|
- lib/primer/yard/docs_helper.rb
|
951
952
|
- lib/primer/yard/info_arch_docs_helper.rb
|
952
|
-
- lib/primer/yard/legacy_gatsby_backend.rb
|
953
953
|
- lib/primer/yard/lookbook_docs_helper.rb
|
954
954
|
- lib/primer/yard/lookbook_pages_backend.rb
|
955
955
|
- lib/primer/yard/registry.rb
|