primer_view_components 0.0.29 → 0.0.34

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.
Files changed (48) hide show
  1. checksums.yaml +4 -4
  2. data/CHANGELOG.md +66 -0
  3. data/README.md +2 -2
  4. data/app/components/primer/auto_complete_component.rb +0 -2
  5. data/app/components/primer/auto_complete_item_component.rb +0 -2
  6. data/app/components/primer/avatar_stack_component.rb +0 -2
  7. data/app/components/primer/base_component.rb +115 -83
  8. data/app/components/primer/blankslate_component.html.erb +1 -1
  9. data/app/components/primer/blankslate_component.rb +0 -2
  10. data/app/components/primer/border_box_component.rb +0 -2
  11. data/app/components/primer/breadcrumb_component.rb +0 -1
  12. data/app/components/primer/button_component.rb +11 -11
  13. data/app/components/primer/button_group_component.rb +3 -5
  14. data/app/components/primer/button_marketing_component.rb +12 -12
  15. data/app/components/primer/component.rb +2 -0
  16. data/app/components/primer/details_component.rb +0 -1
  17. data/app/components/primer/dropdown/menu_component.rb +0 -2
  18. data/app/components/primer/dropdown_component.rb +0 -2
  19. data/app/components/primer/flash_component.html.erb +2 -2
  20. data/app/components/primer/flash_component.rb +10 -12
  21. data/app/components/primer/layout_component.rb +0 -2
  22. data/app/components/primer/link_component.rb +9 -9
  23. data/app/components/primer/menu_component.rb +2 -4
  24. data/app/components/primer/navigation/tab_component.html.erb +9 -0
  25. data/app/components/primer/navigation/tab_component.rb +102 -0
  26. data/app/components/primer/octicon_component.rb +5 -4
  27. data/app/components/primer/popover_component.rb +19 -3
  28. data/app/components/primer/progress_bar_component.rb +0 -1
  29. data/app/components/primer/spinner_component.html.erb +1 -3
  30. data/app/components/primer/spinner_component.rb +1 -0
  31. data/app/components/primer/state_component.rb +13 -13
  32. data/app/components/primer/subhead_component.rb +1 -3
  33. data/app/components/primer/tab_nav_component.html.erb +9 -11
  34. data/app/components/primer/tab_nav_component.rb +46 -73
  35. data/app/components/primer/time_ago_component.rb +2 -1
  36. data/app/components/primer/timeline_item_component.rb +1 -2
  37. data/app/components/primer/underline_nav_component.html.erb +19 -7
  38. data/app/components/primer/underline_nav_component.rb +80 -14
  39. data/app/lib/primer/classify.rb +5 -14
  40. data/app/lib/primer/classify/cache.rb +14 -4
  41. data/app/lib/primer/classify/functional_colors.rb +8 -6
  42. data/app/lib/primer/classify/spacing.rb +63 -0
  43. data/app/lib/primer/tabbed_component_helper.rb +35 -0
  44. data/app/lib/primer/view_helper.rb +2 -2
  45. data/lib/primer/view_components/version.rb +1 -1
  46. data/static/statuses.json +1 -1
  47. metadata +6 -3
  48. data/app/components/primer/slot.rb +0 -10
@@ -3,14 +3,14 @@
3
3
  module Primer
4
4
  # Use buttons for actions (e.g. in forms). Use links for destinations, or moving from one page to another.
5
5
  class ButtonMarketingComponent < Primer::Component
6
- DEFAULT_BUTTON_TYPE = :default
7
- BUTTON_TYPE_MAPPINGS = {
8
- DEFAULT_BUTTON_TYPE => "",
6
+ DEFAULT_SCHEME = :default
7
+ SCHEME_MAPPINGS = {
8
+ DEFAULT_SCHEME => "",
9
9
  :primary => "btn-primary-mktg",
10
10
  :outline => "btn-outline-mktg",
11
11
  :transparent => "btn-transparent"
12
12
  }.freeze
13
- BUTTON_TYPE_OPTIONS = BUTTON_TYPE_MAPPINGS.keys
13
+ SCHEME_OPTIONS = SCHEME_MAPPINGS.keys
14
14
 
15
15
  DEFAULT_VARIANT = :default
16
16
  VARIANT_MAPPINGS = {
@@ -25,25 +25,25 @@ module Primer
25
25
  DEFAULT_TYPE = :button
26
26
  TYPE_OPTIONS = [DEFAULT_TYPE, :submit].freeze
27
27
 
28
- # @example Button types
28
+ # @example Schemes
29
29
  # <%= render(Primer::ButtonMarketingComponent.new(mr: 2)) { "Default" } %>
30
- # <%= render(Primer::ButtonMarketingComponent.new(button_type: :primary, mr: 2)) { "Primary" } %>
31
- # <%= render(Primer::ButtonMarketingComponent.new(button_type: :outline)) { "Outline" } %>
32
- # <div class="bg-gray-dark">
33
- # <%= render(Primer::ButtonMarketingComponent.new(button_type: :transparent)) { "Transparent" } %>
30
+ # <%= render(Primer::ButtonMarketingComponent.new(scheme: :primary, mr: 2)) { "Primary" } %>
31
+ # <%= render(Primer::ButtonMarketingComponent.new(scheme: :outline)) { "Outline" } %>
32
+ # <div class="color-bg-canvas-inverse">
33
+ # <%= render(Primer::ButtonMarketingComponent.new(scheme: :transparent)) { "Transparent" } %>
34
34
  # </div>
35
35
  #
36
36
  # @example Sizes
37
37
  # <%= render(Primer::ButtonMarketingComponent.new(mr: 2)) { "Default" } %>
38
38
  # <%= render(Primer::ButtonMarketingComponent.new(variant: :large)) { "Large" } %>
39
39
  #
40
- # @param button_type [Symbol] <%= one_of(Primer::ButtonMarketingComponent::BUTTON_TYPE_OPTIONS) %>
40
+ # @param scheme [Symbol] <%= one_of(Primer::ButtonMarketingComponent::SCHEME_OPTIONS) %>
41
41
  # @param variant [Symbol] <%= one_of(Primer::ButtonMarketingComponent::VARIANT_OPTIONS) %>
42
42
  # @param tag [Symbol] <%= one_of(Primer::ButtonMarketingComponent::TAG_OPTIONS) %>
43
43
  # @param type [Symbol] <%= one_of(Primer::ButtonMarketingComponent::TYPE_OPTIONS) %>
44
44
  # @param system_arguments [Hash] <%= link_to_system_arguments_docs %>
45
45
  def initialize(
46
- button_type: DEFAULT_BUTTON_TYPE,
46
+ scheme: DEFAULT_SCHEME,
47
47
  variant: DEFAULT_VARIANT,
48
48
  tag: DEFAULT_TAG,
49
49
  type: DEFAULT_TYPE,
@@ -60,7 +60,7 @@ module Primer
60
60
 
61
61
  @system_arguments[:classes] = class_names(
62
62
  "btn-mktg",
63
- BUTTON_TYPE_MAPPINGS[fetch_or_fallback(BUTTON_TYPE_OPTIONS, button_type, DEFAULT_BUTTON_TYPE)],
63
+ SCHEME_MAPPINGS[fetch_or_fallback(SCHEME_OPTIONS, scheme, DEFAULT_SCHEME)],
64
64
  VARIANT_MAPPINGS[fetch_or_fallback(VARIANT_OPTIONS, variant, DEFAULT_VARIANT)],
65
65
  system_arguments[:classes]
66
66
  )
@@ -1,10 +1,12 @@
1
1
  # frozen_string_literal: true
2
2
 
3
3
  require "octicons_helper/helper"
4
+ require "view_component/version"
4
5
 
5
6
  module Primer
6
7
  # @private
7
8
  class Component < ViewComponent::Base
9
+ include ViewComponent::SlotableV2 unless ViewComponent::VERSION::STRING.to_f >= 2.28
8
10
  include ClassNameHelper
9
11
  include FetchOrFallbackHelper
10
12
  include OcticonsHelper
@@ -3,7 +3,6 @@
3
3
  module Primer
4
4
  # Use DetailsComponent to reveal content after clicking a button.
5
5
  class DetailsComponent < Primer::Component
6
- include ViewComponent::SlotableV2
7
6
  status :beta
8
7
 
9
8
  NO_OVERLAY = :none
@@ -5,8 +5,6 @@ module Primer
5
5
  # This component is part of `Primer::DropdownComponent` and should not be
6
6
  # used as a standalone component.
7
7
  class MenuComponent < Primer::Component
8
- include ViewComponent::SlotableV2
9
-
10
8
  SCHEME_DEFAULT = :default
11
9
  SCHEME_MAPPINGS = {
12
10
  SCHEME_DEFAULT => "",
@@ -4,8 +4,6 @@ module Primer
4
4
  # Dropdowns are lightweight context menus for housing navigation and actions.
5
5
  # They're great for instances where you don't need the full power (and code) of the select menu.
6
6
  class DropdownComponent < Primer::Component
7
- include ViewComponent::SlotableV2
8
-
9
7
  # Required trigger for the dropdown. Only accepts a content.
10
8
  # Its classes can be customized by the `summary_classes` param in the parent component
11
9
  renders_one :button
@@ -1,9 +1,9 @@
1
1
  <%= render Primer::BaseComponent.new(**@system_arguments) do %>
2
- <%= primer_octicon icon: @icon if @icon %>
2
+ <%= primer_octicon @icon if @icon %>
3
3
  <%= content %>
4
4
  <% if @dismissible %>
5
5
  <button class="flash-close js-flash-close" type="button" aria-label="Close">
6
- <%= primer_octicon icon: "x" %>
6
+ <%= primer_octicon "x" %>
7
7
  </button>
8
8
  <% end %>
9
9
 
@@ -5,8 +5,6 @@ module Primer
5
5
  class FlashComponent < Primer::Component
6
6
  status :beta
7
7
 
8
- include ViewComponent::SlotableV2
9
-
10
8
  # Optional action content showed on the right side of the component.
11
9
  #
12
10
  # @param system_arguments [Hash] <%= link_to_system_arguments_docs %>
@@ -17,18 +15,18 @@ module Primer
17
15
  Primer::BaseComponent.new(**system_arguments)
18
16
  }
19
17
 
20
- DEFAULT_VARIANT = :default
21
- VARIANT_MAPPINGS = {
22
- DEFAULT_VARIANT => "",
18
+ DEFAULT_SCHEME = :default
19
+ SCHEME_MAPPINGS = {
20
+ DEFAULT_SCHEME => "",
23
21
  :warning => "flash-warn",
24
22
  :danger => "flash-error",
25
23
  :success => "flash-success"
26
24
  }.freeze
27
- # @example Variants
25
+ # @example Schemes
28
26
  # <%= render(Primer::FlashComponent.new) { "This is a flash message!" } %>
29
- # <%= render(Primer::FlashComponent.new(variant: :warning)) { "This is a warning flash message!" } %>
30
- # <%= render(Primer::FlashComponent.new(variant: :danger)) { "This is a danger flash message!" } %>
31
- # <%= render(Primer::FlashComponent.new(variant: :success)) { "This is a success flash message!" } %>
27
+ # <%= render(Primer::FlashComponent.new(scheme: :warning)) { "This is a warning flash message!" } %>
28
+ # <%= render(Primer::FlashComponent.new(scheme: :danger)) { "This is a danger flash message!" } %>
29
+ # <%= render(Primer::FlashComponent.new(scheme: :success)) { "This is a success flash message!" } %>
32
30
  #
33
31
  # @example Full width
34
32
  # <%= render(Primer::FlashComponent.new(full: true)) { "This is a full width flash message!" } %>
@@ -51,9 +49,9 @@ module Primer
51
49
  # @param spacious [Boolean] Whether to add margin to the bottom of the component.
52
50
  # @param dismissible [Boolean] Whether the component can be dismissed with an X button.
53
51
  # @param icon [String] Name of Octicon icon to use.
54
- # @param variant [Symbol] <%= one_of(Primer::FlashComponent::VARIANT_MAPPINGS.keys) %>
52
+ # @param scheme [Symbol] <%= one_of(Primer::FlashComponent::SCHEME_MAPPINGS.keys) %>
55
53
  # @param system_arguments [Hash] <%= link_to_system_arguments_docs %>
56
- def initialize(full: false, spacious: false, dismissible: false, icon: nil, variant: DEFAULT_VARIANT, **system_arguments)
54
+ def initialize(full: false, spacious: false, dismissible: false, icon: nil, scheme: DEFAULT_SCHEME, **system_arguments)
57
55
  @icon = icon
58
56
  @dismissible = dismissible
59
57
  @system_arguments = system_arguments
@@ -61,7 +59,7 @@ module Primer
61
59
  @system_arguments[:classes] = class_names(
62
60
  @system_arguments[:classes],
63
61
  "flash",
64
- VARIANT_MAPPINGS[fetch_or_fallback(VARIANT_MAPPINGS.keys, variant, DEFAULT_VARIANT)],
62
+ SCHEME_MAPPINGS[fetch_or_fallback(SCHEME_MAPPINGS.keys, scheme, DEFAULT_SCHEME)],
65
63
  "flash-full": full
66
64
  )
67
65
  @system_arguments[:mb] ||= spacious ? 4 : nil
@@ -3,8 +3,6 @@
3
3
  module Primer
4
4
  # Use Layout to build a main/sidebar layout.
5
5
  class LayoutComponent < Primer::Component
6
- include ViewComponent::SlotableV2
7
-
8
6
  # The main content
9
7
  #
10
8
  # @param system_arguments [Hash] <%= link_to_system_arguments_docs %>
@@ -5,9 +5,9 @@ module Primer
5
5
  class LinkComponent < Primer::Component
6
6
  status :beta
7
7
 
8
- DEFAULT_VARIANT = :default
9
- VARIANT_MAPPINGS = {
10
- DEFAULT_VARIANT => "",
8
+ DEFAULT_SCHEME = :default
9
+ SCHEME_MAPPINGS = {
10
+ DEFAULT_SCHEME => "",
11
11
  :primary => "Link--primary",
12
12
  :secondary => "Link--secondary"
13
13
  }.freeze
@@ -21,9 +21,9 @@ module Primer
21
21
  # @example Muted
22
22
  # <%= render(Primer::LinkComponent.new(href: "#", muted: true)) { "Link" } %>
23
23
  #
24
- # @example Variants
25
- # <%= render(Primer::LinkComponent.new(href: "#", variant: :primary)) { "Primary" } %>
26
- # <%= render(Primer::LinkComponent.new(href: "#", variant: :secondary)) { "Secondary" } %>
24
+ # @example Schemes
25
+ # <%= render(Primer::LinkComponent.new(href: "#", scheme: :primary)) { "Primary" } %>
26
+ # <%= render(Primer::LinkComponent.new(href: "#", scheme: :secondary)) { "Secondary" } %>
27
27
  #
28
28
  # @example Without underline
29
29
  # <%= render(Primer::LinkComponent.new(href: "#", underline: false)) { "Link" } %>
@@ -33,17 +33,17 @@ module Primer
33
33
  #
34
34
  # @param tag [String] <%= one_of(Primer::LinkComponent::TAG_OPTIONS) %>
35
35
  # @param href [String] URL to be used for the Link. Required if tag is `:a`. If the requirements are not met an error will be raised in non production environments. In production, an empty link element will be rendered.
36
- # @param variant [Symbol] <%= one_of(Primer::LinkComponent::VARIANT_MAPPINGS.keys) %>
36
+ # @param scheme [Symbol] <%= one_of(Primer::LinkComponent::SCHEME_MAPPINGS.keys) %>
37
37
  # @param muted [Boolean] Uses light gray for Link color, and blue on hover.
38
38
  # @param underline [Boolean] Whether or not to underline the link.
39
39
  # @param system_arguments [Hash] <%= link_to_system_arguments_docs %>
40
- def initialize(href: nil, tag: DEFAULT_TAG, variant: DEFAULT_VARIANT, muted: false, underline: true, **system_arguments)
40
+ def initialize(href: nil, tag: DEFAULT_TAG, scheme: DEFAULT_SCHEME, muted: false, underline: true, **system_arguments)
41
41
  @system_arguments = system_arguments
42
42
  @system_arguments[:tag] = fetch_or_fallback(TAG_OPTIONS, tag, DEFAULT_TAG)
43
43
  @system_arguments[:href] = href
44
44
  @system_arguments[:classes] = class_names(
45
45
  @system_arguments[:classes],
46
- VARIANT_MAPPINGS[fetch_or_fallback(VARIANT_MAPPINGS.keys, variant, DEFAULT_VARIANT)],
46
+ SCHEME_MAPPINGS[fetch_or_fallback(SCHEME_MAPPINGS.keys, scheme, DEFAULT_SCHEME)],
47
47
  "Link" => tag == :span,
48
48
  "Link--muted" => muted,
49
49
  "no-underline" => !underline
@@ -3,8 +3,6 @@
3
3
  module Primer
4
4
  # Use menus to create vertical lists of navigational links.
5
5
  class MenuComponent < Primer::Component
6
- include ViewComponent::SlotableV2
7
-
8
6
  # Optional menu heading
9
7
  #
10
8
  # @param system_arguments [Hash] <%= link_to_system_arguments_docs %>
@@ -44,11 +42,11 @@ module Primer
44
42
  # Item 1
45
43
  # <% end %>
46
44
  # <% c.item(href: "#url") do %>
47
- # <%= render(Primer::OcticonComponent.new(icon: "check")) %>
45
+ # <%= render(Primer::OcticonComponent.new("check")) %>
48
46
  # With Icon
49
47
  # <% end %>
50
48
  # <% c.item(href: "#url") do %>
51
- # <%= render(Primer::OcticonComponent.new(icon: "check")) %>
49
+ # <%= render(Primer::OcticonComponent.new("check")) %>
52
50
  # With Icon and Counter
53
51
  # <%= render(Primer::CounterComponent.new(count: 25)) %>
54
52
  # <% end %>
@@ -0,0 +1,9 @@
1
+ <%= render Primer::BaseComponent.new(**@system_arguments) do %>
2
+ <%= icon %>
3
+ <% if text.present? %>
4
+ <%= text %>
5
+ <% else %>
6
+ <%= content %>
7
+ <% end %>
8
+ <%= counter %>
9
+ <% end %>
@@ -0,0 +1,102 @@
1
+ # frozen_string_literal: true
2
+
3
+ module Primer
4
+ module Navigation
5
+ # This component is part of navigation components such as `Primer::TabNavComponent`
6
+ # and `Primer::UnderlineNavComponent` and should not be used by itself.
7
+ class TabComponent < Primer::Component
8
+ # Panel controlled by the Tab. This will not render anything in the tab itself.
9
+ # It will provide a accessor for the Tab's parent to call and render the panel
10
+ # content in the appropriate place.
11
+ # Refer to `UnderlineNavComponent` and `TabNavComponent` implementations for examples.
12
+ #
13
+ # @param system_arguments [Hash] <%= link_to_system_arguments_docs %>
14
+ renders_one :panel, lambda { |**system_arguments|
15
+ system_arguments[:tag] ||= :div
16
+ system_arguments[:role] ||= :tabpanel
17
+ system_arguments[:hidden] = true unless @selected
18
+
19
+ Primer::BaseComponent.new(**system_arguments)
20
+ }
21
+
22
+ # Icon to be rendered in the Tab left.
23
+ #
24
+ # @param kwargs [Hash] The same arguments as <%= link_to_component(Primer::OcticonComponent) %>.
25
+ renders_one :icon, lambda { |icon = nil, **system_arguments|
26
+ system_arguments[:classes] = class_names(
27
+ @icon_classes,
28
+ system_arguments[:classes]
29
+ )
30
+ Primer::OcticonComponent.new(icon, **system_arguments)
31
+ }
32
+
33
+ # The Tab's text.
34
+ #
35
+ # @param kwargs [Hash] The same arguments as <%= link_to_component(Primer::TextComponent) %>.
36
+ renders_one :text, Primer::TextComponent
37
+
38
+ # Counter to be rendered in the Tab right.
39
+ #
40
+ # @param kwargs [Hash] The same arguments as <%= link_to_component(Primer::CounterComponent) %>.
41
+ renders_one :counter, Primer::CounterComponent
42
+
43
+ attr_reader :selected
44
+
45
+ # @example Default
46
+ # <%= render(Primer::Navigation::TabComponent.new(selected: true)) do |c| %>
47
+ # <% c.text { "Selected" } %>
48
+ # <% end %>
49
+ # <%= render(Primer::Navigation::TabComponent.new) do |c| %>
50
+ # <% c.text { "Not selected" } %>
51
+ # <% end %>
52
+ #
53
+ # @example With icons and counters
54
+ # <%= render(Primer::Navigation::TabComponent.new) do |c| %>
55
+ # <% c.icon(:star) %>
56
+ # <% c.text { "Tab" } %>
57
+ # <% end %>
58
+ # <%= render(Primer::Navigation::TabComponent.new) do |c| %>
59
+ # <% c.icon(:star) %>
60
+ # <% c.text { "Tab" } %>
61
+ # <% c.counter(count: 10) %>
62
+ # <% end %>
63
+ # <%= render(Primer::Navigation::TabComponent.new) do |c| %>
64
+ # <% c.text { "Tab" } %>
65
+ # <% c.counter(count: 10) %>
66
+ # <% end %>
67
+ #
68
+ # @example With custom HTML
69
+ # <%= render(Primer::Navigation::TabComponent.new) do |c| %>
70
+ # <div>
71
+ # This is my <strong>custom HTML</strong>
72
+ # </div>
73
+ # <% end %>
74
+ #
75
+ # @param selected [Boolean] Whether the Tab is selected or not.
76
+ # @param with_panel [Boolean] Whether the Tab has an associated panel.
77
+ # @param icon_classes [Boolean] Classes that must always be applied to icons.
78
+ # @param system_arguments [Hash] <%= link_to_system_arguments_docs %>
79
+ def initialize(selected: false, with_panel: false, icon_classes: "", **system_arguments)
80
+ @selected = selected
81
+ @icon_classes = icon_classes
82
+ @system_arguments = system_arguments
83
+ @system_arguments[:role] = :tab
84
+
85
+ if with_panel
86
+ @system_arguments[:tag] ||= :button
87
+ @system_arguments[:type] = :button
88
+ else
89
+ @system_arguments[:tag] ||= :a
90
+ end
91
+
92
+ return unless @selected
93
+
94
+ if @system_arguments[:tag] == :a
95
+ @system_arguments[:"aria-current"] = :page
96
+ else
97
+ @system_arguments[:"aria-selected"] = true
98
+ end
99
+ end
100
+ end
101
+ end
102
+ end
@@ -18,19 +18,20 @@ module Primer
18
18
  SIZE_OPTIONS = SIZE_MAPPINGS.keys
19
19
 
20
20
  # @example Default
21
+ # <%= render(Primer::OcticonComponent.new("check")) %>
21
22
  # <%= render(Primer::OcticonComponent.new(icon: "check")) %>
22
23
  #
23
24
  # @example Medium
24
- # <%= render(Primer::OcticonComponent.new(icon: "people", size: :medium)) %>
25
+ # <%= render(Primer::OcticonComponent.new("people", size: :medium)) %>
25
26
  #
26
27
  # @example Large
27
- # <%= render(Primer::OcticonComponent.new(icon: "x", size: :large)) %>
28
+ # <%= render(Primer::OcticonComponent.new("x", size: :large)) %>
28
29
  #
29
30
  # @param icon [String] Name of [Octicon](https://primer.style/octicons/) to use.
30
31
  # @param size [Symbol] <%= one_of(Primer::OcticonComponent::SIZE_MAPPINGS) %>
31
32
  # @param system_arguments [Hash] <%= link_to_system_arguments_docs %>
32
- def initialize(icon:, size: SIZE_DEFAULT, **system_arguments)
33
- @icon = icon
33
+ def initialize(icon_name = nil, icon: nil, size: SIZE_DEFAULT, **system_arguments)
34
+ @icon = icon_name || icon
34
35
  @system_arguments = system_arguments
35
36
 
36
37
  @system_arguments[:class] = Primer::Classify.call(**@system_arguments)[:class]
@@ -5,7 +5,6 @@ module Primer
5
5
  #
6
6
  # By default, the popover renders with absolute positioning, meaning it should usually be wrapped in an element with a relative position in order to be positioned properly. To render the popover with relative positioning, use the relative property.
7
7
  class PopoverComponent < Primer::Component
8
- include ViewComponent::SlotableV2
9
8
  status :beta
10
9
 
11
10
  CARET_DEFAULT = :top
@@ -54,7 +53,7 @@ module Primer
54
53
 
55
54
  # This is a hack to allow the parent to set the slot's content
56
55
  @body_arguments = system_arguments
57
- block&.call
56
+ view_context.capture { block&.call }
58
57
  }
59
58
 
60
59
  # @example Default
@@ -83,7 +82,24 @@ module Primer
83
82
  # Activity feed
84
83
  # <% end %>
85
84
  # <% component.body(caret: :left) do %>
86
- # This is the large Popover body.
85
+ # This is the Popover body.
86
+ # <% end %>
87
+ # <% end %>
88
+ #
89
+ # @example With HTML body
90
+ # <%= render Primer::PopoverComponent.new do |component| %>
91
+ # <% component.heading do %>
92
+ # Activity feed
93
+ # <% end %>
94
+ # <% component.body(caret: :left) do %>
95
+ # <p> This is the Popover body.</p>
96
+ # <div>
97
+ # This is using HTML.
98
+ # <ul>
99
+ # <li>Thing #1</li>
100
+ # <li>Thing #2</li>
101
+ # </ul>
102
+ # </div>
87
103
  # <% end %>
88
104
  # <% end %>
89
105
  #
@@ -3,7 +3,6 @@
3
3
  module Primer
4
4
  # Use ProgressBar to visualize task completion.
5
5
  class ProgressBarComponent < Primer::Component
6
- include ViewComponent::SlotableV2
7
6
  status :beta
8
7
 
9
8
  # Use the Item slot to add an item to the progress bas
@@ -1,6 +1,4 @@
1
1
  <%= render Primer::BaseComponent.new(**@system_arguments) do %>
2
2
  <circle cx="8" cy="8" r="7" stroke="currentColor" stroke-opacity="0.25" stroke-width="2" vector-effect="non-scaling-stroke" />
3
- <path d="M15 8a7.002 7.002 0 00-7-7" stroke="currentColor" stroke-width="2" stroke-linecap="round" vector-effect="non-scaling-stroke">
4
- <animateTransform attributeName="transform" type="rotate" from="0 8 8" to="360 8 8" dur="1s" repeatCount="indefinite" />
5
- </path>
3
+ <path d="M15 8a7.002 7.002 0 00-7-7" stroke="currentColor" stroke-width="2" stroke-linecap="round" vector-effect="non-scaling-stroke" />
6
4
  <% end %>