primer_view_components 0.0.20 → 0.0.21
Sign up to get free protection for your applications and to get access to all the features.
- checksums.yaml +4 -4
- data/CHANGELOG.md +15 -1
- data/app/components/primer/avatar_component.rb +4 -4
- data/app/components/primer/blankslate_component.html.erb +1 -1
- data/app/components/primer/blankslate_component.rb +9 -17
- data/app/components/primer/flash_component.html.erb +2 -5
- data/app/components/primer/flash_component.rb +11 -15
- data/app/components/primer/timeline_item_component.html.erb +4 -16
- data/app/components/primer/timeline_item_component.rb +40 -51
- data/lib/primer/view_components/version.rb +1 -1
- data/static/statuses.json +1 -1
- metadata +2 -2
checksums.yaml
CHANGED
@@ -1,7 +1,7 @@
|
|
1
1
|
---
|
2
2
|
SHA256:
|
3
|
-
metadata.gz:
|
4
|
-
data.tar.gz:
|
3
|
+
metadata.gz: 62c2e7e2e043daf8288aa72a91d674af96180cc0430c8d59c5fdbf5764e19b59
|
4
|
+
data.tar.gz: 75b205867ce0f2835ee32d9a859032d02eef6dbb98b8ff5c9d485001893fce5b
|
5
5
|
SHA512:
|
6
|
-
metadata.gz:
|
7
|
-
data.tar.gz:
|
6
|
+
metadata.gz: f6ad3831ccbb77616d668036954108e3642ffe747ee2837714761ebc54ca353b654813cad3396bb31e4a94f03f6e84f5ae52c75cf07387fffd24758d73967b70
|
7
|
+
data.tar.gz: 79d4aca35c8556fcbbcbab8fb6cf5d4e5440f920508af5ed880bb200a03820869a576ebafd3200ff756a3b7a580855c8b1c77ba71a65f085367fc80ac063e49f
|
data/CHANGELOG.md
CHANGED
@@ -2,6 +2,20 @@
|
|
2
2
|
|
3
3
|
## main
|
4
4
|
|
5
|
+
## 0.0.21
|
6
|
+
|
7
|
+
* **Breaking change**: Upgrade `FlashComponent` to use Slots V2.
|
8
|
+
|
9
|
+
*Joel Hawksley, Simon Taranto*
|
10
|
+
|
11
|
+
* **Breaking change**: Upgrade `BlankslateComponent` to use Slots V2.
|
12
|
+
|
13
|
+
*Manuel Puyol*
|
14
|
+
|
15
|
+
* **Breaking change**: Upgrade `TimelineItemComponent` to use Slots V2.
|
16
|
+
|
17
|
+
*Manuel Puyol*
|
18
|
+
|
5
19
|
## 0.0.20
|
6
20
|
|
7
21
|
* Fix bug when empty string was passed to Classify.
|
@@ -12,7 +26,7 @@
|
|
12
26
|
|
13
27
|
* Add support for functional colors to `color` system argument.
|
14
28
|
|
15
|
-
*Jake Shorty
|
29
|
+
*Jake Shorty*
|
16
30
|
|
17
31
|
* Add `AvatarStack`, `Dropdown`, `Markdown` and `Menu` components.
|
18
32
|
|
@@ -16,11 +16,11 @@ module Primer
|
|
16
16
|
# @example auto|Link
|
17
17
|
# <%= render(Primer::AvatarComponent.new(href: "#", src: "http://placekitten.com/200/200", alt: "@kittenuser")) %>
|
18
18
|
#
|
19
|
-
# @param src [String] The source url of the avatar image
|
20
|
-
# @param alt [String] Passed through to alt on img tag
|
21
|
-
# @param size [Integer] Adds the avatar-small class if less than 24
|
19
|
+
# @param src [String] The source url of the avatar image.
|
20
|
+
# @param alt [String] Passed through to alt on img tag.
|
21
|
+
# @param size [Integer] Adds the avatar-small class if less than 24.
|
22
22
|
# @param square [Boolean] Used to create a square avatar.
|
23
|
-
# @param href [String] The URL to link to. If used, component will be wrapped by an `<a>` tag
|
23
|
+
# @param href [String] The URL to link to. If used, component will be wrapped by an `<a>` tag.
|
24
24
|
# @param system_arguments [Hash] <%= link_to_system_arguments_docs %>
|
25
25
|
def initialize(src:, alt:, size: 20, square: false, href: nil, **system_arguments)
|
26
26
|
@href = href
|
@@ -3,9 +3,15 @@
|
|
3
3
|
module Primer
|
4
4
|
# Use Primer::BlankslateComponent when there is a lack of content within a page or section. Use as placeholder to tell users why something isn't there.
|
5
5
|
class BlankslateComponent < Primer::Component
|
6
|
-
include ViewComponent::
|
6
|
+
include ViewComponent::SlotableV2
|
7
7
|
|
8
|
-
|
8
|
+
# Optional Spinner.
|
9
|
+
#
|
10
|
+
# @param kwargs [Hash] The same arguments as <%= link_to_component(Primer::SpinnerComponent) %>.
|
11
|
+
renders_one :spinner, lambda { |**system_arguments|
|
12
|
+
system_arguments[:mb] ||= 3
|
13
|
+
Primer::SpinnerComponent.new(**system_arguments)
|
14
|
+
}
|
9
15
|
|
10
16
|
#
|
11
17
|
# @example auto|Basic
|
@@ -26,7 +32,7 @@ module Primer
|
|
26
32
|
# title: "Title",
|
27
33
|
# description: "Description",
|
28
34
|
# ) do |component| %>
|
29
|
-
# <% component.
|
35
|
+
# <% component.spinner(size: :large) %>
|
30
36
|
# <% end %>
|
31
37
|
#
|
32
38
|
# @example auto|Custom content|Pass custom content as a block in place of `description`.
|
@@ -124,19 +130,5 @@ module Primer
|
|
124
130
|
@link_text = link_text
|
125
131
|
@link_url = link_url
|
126
132
|
end
|
127
|
-
|
128
|
-
# :nodoc:
|
129
|
-
class Spinner < Primer::Slot
|
130
|
-
# @param size [Symbol] <%= one_of(Primer::SpinnerComponent::SIZE_MAPPINGS) %>
|
131
|
-
# @param system_arguments [Hash] <%= link_to_system_arguments_docs %>
|
132
|
-
def initialize(**system_arguments)
|
133
|
-
@system_arguments = system_arguments
|
134
|
-
@system_arguments[:mb] ||= 3
|
135
|
-
end
|
136
|
-
|
137
|
-
def component
|
138
|
-
Primer::SpinnerComponent.new(**@system_arguments)
|
139
|
-
end
|
140
|
-
end
|
141
133
|
end
|
142
134
|
end
|
@@ -6,9 +6,6 @@
|
|
6
6
|
<%= render(Primer::OcticonComponent.new(icon: "x")) %>
|
7
7
|
</button>
|
8
8
|
<% end %>
|
9
|
-
|
10
|
-
|
11
|
-
<%= actions.content %>
|
12
|
-
<% end %>
|
13
|
-
<% end %>
|
9
|
+
|
10
|
+
<%= action %>
|
14
11
|
<% end %>
|
@@ -3,9 +3,17 @@
|
|
3
3
|
module Primer
|
4
4
|
# Use the Flash component to inform users of successful or pending actions.
|
5
5
|
class FlashComponent < Primer::Component
|
6
|
-
include ViewComponent::
|
6
|
+
include ViewComponent::SlotableV2
|
7
7
|
|
8
|
-
|
8
|
+
# Optional action content showed on the right side of the component.
|
9
|
+
#
|
10
|
+
# @param system_arguments [Hash] <%= link_to_system_arguments_docs %>
|
11
|
+
renders_one :action, lambda { |**system_arguments|
|
12
|
+
system_arguments[:tag] = :div
|
13
|
+
system_arguments[:classes] = class_names(system_arguments[:classes], "flash-action")
|
14
|
+
|
15
|
+
Primer::BaseComponent.new(**system_arguments)
|
16
|
+
}
|
9
17
|
|
10
18
|
DEFAULT_VARIANT = :default
|
11
19
|
VARIANT_MAPPINGS = {
|
@@ -32,7 +40,7 @@ module Primer
|
|
32
40
|
# @example auto|With actions
|
33
41
|
# <%= render(Primer::FlashComponent.new) do |component| %>
|
34
42
|
# This is a flash message with actions!
|
35
|
-
# <% component.
|
43
|
+
# <% component.action do %>
|
36
44
|
# <%= render(Primer::ButtonComponent.new(variant: :small)) { "Take action" } %>
|
37
45
|
# <% end %>
|
38
46
|
# <% end %>
|
@@ -60,17 +68,5 @@ module Primer
|
|
60
68
|
def self.status
|
61
69
|
Primer::Component::STATUSES[:beta]
|
62
70
|
end
|
63
|
-
|
64
|
-
# :nodoc:
|
65
|
-
class Actions < Primer::Slot
|
66
|
-
attr_reader :system_arguments
|
67
|
-
|
68
|
-
# @param system_arguments [Hash] <%= link_to_system_arguments_docs %>
|
69
|
-
def initialize(**system_arguments)
|
70
|
-
@system_arguments = system_arguments
|
71
|
-
@system_arguments[:tag] = :div
|
72
|
-
@system_arguments[:classes] = class_names(@system_arguments[:classes], "flash-action")
|
73
|
-
end
|
74
|
-
end
|
75
71
|
end
|
76
72
|
end
|
@@ -1,17 +1,5 @@
|
|
1
|
-
<%= render Primer::BaseComponent.new(
|
2
|
-
|
3
|
-
|
4
|
-
|
5
|
-
|
6
|
-
<% if badge %>
|
7
|
-
<%= render Primer::BaseComponent.new(**badge.system_arguments) do %>
|
8
|
-
<%= octicon badge.icon %>
|
9
|
-
<% end %>
|
10
|
-
<% end %>
|
11
|
-
|
12
|
-
<% if body %>
|
13
|
-
<%= render Primer::BaseComponent.new(**body.system_arguments) do %>
|
14
|
-
<%= body.content %>
|
15
|
-
<% end %>
|
16
|
-
<% end %>
|
1
|
+
<%= render Primer::BaseComponent.new(**@system_arguments) do %>
|
2
|
+
<%= avatar %>
|
3
|
+
<%= badge %>
|
4
|
+
<%= body %>
|
17
5
|
<% end %>
|
@@ -3,20 +3,45 @@
|
|
3
3
|
module Primer
|
4
4
|
# Use `TimelineItem` to display items on a vertical timeline, connected by badge elements.
|
5
5
|
class TimelineItemComponent < Primer::Component
|
6
|
-
include ViewComponent::
|
6
|
+
include ViewComponent::SlotableV2
|
7
7
|
|
8
|
-
|
9
|
-
|
10
|
-
|
8
|
+
# Avatar to be rendered to the left of the Badge.
|
9
|
+
#
|
10
|
+
# @param kwargs [Hash] The same arguments as <%= link_to_component(Primer::AvatarComponent) %>.
|
11
|
+
renders_one :avatar, lambda { |src:, size: 40, square: true, **system_arguments|
|
12
|
+
system_arguments[:classes] = class_names(
|
13
|
+
"TimelineItem-avatar",
|
14
|
+
system_arguments[:classes]
|
15
|
+
)
|
16
|
+
|
17
|
+
Primer::AvatarComponent.new(src: src, size: size, square: square, **system_arguments)
|
18
|
+
}
|
11
19
|
|
12
|
-
|
20
|
+
# Badge that will be connected to other TimelineItems.
|
21
|
+
#
|
22
|
+
# @param icon [String] Name of [Octicon](https://primer.style/octicons/) to use.
|
23
|
+
# @param system_arguments [Hash] <%= link_to_system_arguments_docs %>
|
24
|
+
renders_one :badge, "BadgeComponent"
|
25
|
+
|
26
|
+
# Body to be rendered to the left of the Badge.
|
27
|
+
#
|
28
|
+
# @param system_arguments [Hash] <%= link_to_system_arguments_docs %>
|
29
|
+
renders_one :body, lambda { |**system_arguments|
|
30
|
+
system_arguments[:tag] = :div
|
31
|
+
system_arguments[:classes] = class_names(
|
32
|
+
"TimelineItem-body",
|
33
|
+
system_arguments[:classes]
|
34
|
+
)
|
35
|
+
|
36
|
+
Primer::BaseComponent.new(**system_arguments)
|
37
|
+
}
|
13
38
|
|
14
39
|
# @example auto|Default
|
15
40
|
# <div style="padding-left: 60px">
|
16
41
|
# <%= render(Primer::TimelineItemComponent.new) do |component| %>
|
17
|
-
# <% component.
|
18
|
-
# <% component.
|
19
|
-
# <% component.
|
42
|
+
# <% component.avatar(src: "https://github.com/github.png", alt: "github") %>
|
43
|
+
# <% component.badge(bg: :green, color: :white, icon: :check) %>
|
44
|
+
# <% component.body { "Success!" } %>
|
20
45
|
# <% end %>
|
21
46
|
# </div>
|
22
47
|
#
|
@@ -36,36 +61,9 @@ module Primer
|
|
36
61
|
avatar.present? || badge.present? || body.present?
|
37
62
|
end
|
38
63
|
|
39
|
-
#
|
40
|
-
|
41
|
-
|
42
|
-
|
43
|
-
# @param alt [String] Alt text for avatar image.
|
44
|
-
# @param src [String] Src attribute for avatar image.
|
45
|
-
# @param size [Integer] Image size.
|
46
|
-
# @param square [Boolean] Whether to round the edges of the image.
|
47
|
-
# @param system_arguments [Hash] <%= link_to_system_arguments_docs %>
|
48
|
-
def initialize(alt: nil, src: nil, size: 40, square: true, **system_arguments)
|
49
|
-
@alt = alt
|
50
|
-
@src = src
|
51
|
-
@size = size
|
52
|
-
@square = square
|
53
|
-
|
54
|
-
@system_arguments = system_arguments
|
55
|
-
@system_arguments[:tag] = :div
|
56
|
-
@system_arguments[:classes] = class_names(
|
57
|
-
"TimelineItem-avatar",
|
58
|
-
system_arguments[:classes]
|
59
|
-
)
|
60
|
-
end
|
61
|
-
end
|
62
|
-
|
63
|
-
# :nodoc:
|
64
|
-
class Badge < Primer::Slot
|
65
|
-
attr_reader :system_arguments, :icon
|
66
|
-
|
67
|
-
# @param icon [String] Name of [Octicon](https://primer.style/octicons/) to use.
|
68
|
-
# @param system_arguments [Hash] <%= link_to_system_arguments_docs %>
|
64
|
+
# This component is part of `Primer::TimelineItemComponent` and should not be
|
65
|
+
# used as a standalone component.
|
66
|
+
class BadgeComponent < Primer::Component
|
69
67
|
def initialize(icon: nil, **system_arguments)
|
70
68
|
@icon = icon
|
71
69
|
|
@@ -76,20 +74,11 @@ module Primer
|
|
76
74
|
system_arguments[:classes]
|
77
75
|
)
|
78
76
|
end
|
79
|
-
end
|
80
|
-
|
81
|
-
# :nodoc:
|
82
|
-
class Body < Primer::Slot
|
83
|
-
attr_reader :system_arguments
|
84
77
|
|
85
|
-
|
86
|
-
|
87
|
-
|
88
|
-
|
89
|
-
@system_arguments[:classes] = class_names(
|
90
|
-
"TimelineItem-body",
|
91
|
-
system_arguments[:classes]
|
92
|
-
)
|
78
|
+
def call
|
79
|
+
render(Primer::BaseComponent.new(**@system_arguments)) do
|
80
|
+
render(Primer::OcticonComponent.new(icon: @icon))
|
81
|
+
end
|
93
82
|
end
|
94
83
|
end
|
95
84
|
end
|
data/static/statuses.json
CHANGED
@@ -1 +1 @@
|
|
1
|
-
{"Primer::AvatarComponent":"beta","Primer::AvatarStackComponent":"alpha","Primer::BaseComponent":"alpha","Primer::BlankslateComponent":"alpha","Primer::BorderBoxComponent":"beta","Primer::BoxComponent":"stable","Primer::BreadcrumbComponent":"alpha","Primer::ButtonComponent":"alpha","Primer::ButtonGroupComponent":"alpha","Primer::ButtonMarketingComponent":"alpha","Primer::CounterComponent":"beta","Primer::DetailsComponent":"alpha","Primer::Dropdown::MenuComponent":"alpha","Primer::DropdownComponent":"alpha","Primer::DropdownMenuComponent":"deprecated","Primer::FlashComponent":"beta","Primer::FlexComponent":"alpha","Primer::FlexItemComponent":"alpha","Primer::HeadingComponent":"alpha","Primer::LabelComponent":"alpha","Primer::LayoutComponent":"alpha","Primer::LinkComponent":"beta","Primer::MarkdownComponent":"alpha","Primer::MenuComponent":"alpha","Primer::OcticonComponent":"beta","Primer::PopoverComponent":"alpha","Primer::ProgressBarComponent":"alpha","Primer::SpinnerComponent":"beta","Primer::StateComponent":"alpha","Primer::SubheadComponent":"alpha","Primer::TextComponent":"alpha","Primer::TimelineItemComponent":"alpha","Primer::TooltipComponent":"alpha","Primer::TruncateComponent":"alpha","Primer::UnderlineNavComponent":"alpha"}
|
1
|
+
{"Primer::AvatarComponent":"beta","Primer::AvatarStackComponent":"alpha","Primer::BaseComponent":"alpha","Primer::BlankslateComponent":"alpha","Primer::BorderBoxComponent":"beta","Primer::BoxComponent":"stable","Primer::BreadcrumbComponent":"alpha","Primer::ButtonComponent":"alpha","Primer::ButtonGroupComponent":"alpha","Primer::ButtonMarketingComponent":"alpha","Primer::CounterComponent":"beta","Primer::DetailsComponent":"alpha","Primer::Dropdown::MenuComponent":"alpha","Primer::DropdownComponent":"alpha","Primer::DropdownMenuComponent":"deprecated","Primer::FlashComponent":"beta","Primer::FlexComponent":"alpha","Primer::FlexItemComponent":"alpha","Primer::HeadingComponent":"alpha","Primer::LabelComponent":"alpha","Primer::LayoutComponent":"alpha","Primer::LinkComponent":"beta","Primer::MarkdownComponent":"alpha","Primer::MenuComponent":"alpha","Primer::OcticonComponent":"beta","Primer::PopoverComponent":"alpha","Primer::ProgressBarComponent":"alpha","Primer::SpinnerComponent":"beta","Primer::StateComponent":"alpha","Primer::SubheadComponent":"alpha","Primer::TextComponent":"alpha","Primer::TimelineItemComponent":"alpha","Primer::TimelineItemComponent::BadgeComponent":"alpha","Primer::TooltipComponent":"alpha","Primer::TruncateComponent":"alpha","Primer::UnderlineNavComponent":"alpha"}
|
metadata
CHANGED
@@ -1,14 +1,14 @@
|
|
1
1
|
--- !ruby/object:Gem::Specification
|
2
2
|
name: primer_view_components
|
3
3
|
version: !ruby/object:Gem::Version
|
4
|
-
version: 0.0.
|
4
|
+
version: 0.0.21
|
5
5
|
platform: ruby
|
6
6
|
authors:
|
7
7
|
- GitHub Open Source
|
8
8
|
autorequire:
|
9
9
|
bindir: bin
|
10
10
|
cert_chain: []
|
11
|
-
date: 2021-02-
|
11
|
+
date: 2021-02-23 00:00:00.000000000 Z
|
12
12
|
dependencies:
|
13
13
|
- !ruby/object:Gem::Dependency
|
14
14
|
name: octicons_helper
|