primer_view_components 0.0.11 → 0.0.16
Sign up to get free protection for your applications and to get access to all the features.
- checksums.yaml +4 -4
- data/CHANGELOG.md +39 -1
- data/README.md +3 -1
- data/app/components/primer/avatar_component.rb +11 -11
- data/app/components/primer/base_component.rb +101 -9
- data/app/components/primer/blankslate_component.html.erb +5 -5
- data/app/components/primer/blankslate_component.rb +31 -6
- data/app/components/primer/border_box_component.html.erb +5 -5
- data/app/components/primer/border_box_component.rb +34 -34
- data/app/components/primer/box_component.rb +5 -5
- data/app/components/primer/breadcrumb_component.html.erb +2 -2
- data/app/components/primer/breadcrumb_component.rb +12 -12
- data/app/components/primer/button_component.rb +9 -9
- data/app/components/primer/counter_component.rb +16 -15
- data/app/components/primer/details_component.html.erb +1 -1
- data/app/components/primer/details_component.rb +15 -15
- data/app/components/primer/dropdown_menu_component.html.erb +1 -1
- data/app/components/primer/dropdown_menu_component.rb +6 -6
- data/app/components/primer/flash_component.html.erb +2 -2
- data/app/components/primer/flash_component.rb +13 -13
- data/app/components/primer/flex_component.rb +5 -5
- data/app/components/primer/flex_item_component.rb +5 -5
- data/app/components/primer/heading_component.rb +4 -4
- data/app/components/primer/label_component.rb +22 -16
- data/app/components/primer/layout_component.html.erb +1 -1
- data/app/components/primer/layout_component.rb +6 -6
- data/app/components/primer/link_component.rb +8 -8
- data/app/components/primer/octicon_component.rb +10 -10
- data/app/components/primer/popover_component.html.erb +1 -1
- data/app/components/primer/popover_component.rb +26 -26
- data/app/components/primer/progress_bar_component.html.erb +2 -2
- data/app/components/primer/progress_bar_component.rb +14 -14
- data/app/components/primer/spinner_component.html.erb +1 -1
- data/app/components/primer/spinner_component.rb +12 -11
- data/app/components/primer/state_component.rb +8 -8
- data/app/components/primer/subhead_component.html.erb +4 -4
- data/app/components/primer/subhead_component.rb +26 -26
- data/app/components/primer/text_component.rb +5 -5
- data/app/components/primer/timeline_item_component.html.erb +4 -4
- data/app/components/primer/timeline_item_component.rb +28 -28
- data/app/components/primer/underline_nav_component.html.erb +1 -1
- data/app/components/primer/underline_nav_component.rb +5 -5
- data/lib/primer/classify.rb +7 -6
- data/lib/primer/view_components/version.rb +1 -1
- metadata +6 -6
@@ -1,16 +1,16 @@
|
|
1
|
-
<%= render Primer::BaseComponent.new(**
|
1
|
+
<%= render Primer::BaseComponent.new(**system_arguments) do %>
|
2
2
|
<% if avatar %>
|
3
|
-
<%= render Primer::AvatarComponent.new(alt: avatar.alt, src: avatar.src, size: avatar.size, square: avatar.square, **avatar.
|
3
|
+
<%= render Primer::AvatarComponent.new(alt: avatar.alt, src: avatar.src, size: avatar.size, square: avatar.square, **avatar.system_arguments) %>
|
4
4
|
<% end %>
|
5
5
|
|
6
6
|
<% if badge %>
|
7
|
-
<%= render Primer::BaseComponent.new(**badge.
|
7
|
+
<%= render Primer::BaseComponent.new(**badge.system_arguments) do %>
|
8
8
|
<%= octicon badge.icon %>
|
9
9
|
<% end %>
|
10
10
|
<% end %>
|
11
11
|
|
12
12
|
<% if body %>
|
13
|
-
<%= render Primer::BaseComponent.new(**body.
|
13
|
+
<%= render Primer::BaseComponent.new(**body.system_arguments) do %>
|
14
14
|
<%= body.content %>
|
15
15
|
<% end %>
|
16
16
|
<% end %>
|
@@ -9,7 +9,7 @@ module Primer
|
|
9
9
|
with_slot :badge, class_name: "Badge"
|
10
10
|
with_slot :body, class_name: "Body"
|
11
11
|
|
12
|
-
attr_reader :
|
12
|
+
attr_reader :system_arguments
|
13
13
|
|
14
14
|
# @example 75|Default
|
15
15
|
# <div style="padding-left: 60px">
|
@@ -21,14 +21,14 @@ module Primer
|
|
21
21
|
# </div>
|
22
22
|
#
|
23
23
|
# @param condensed [Boolean] Reduce the vertical padding and remove the background from the badge item. Most commonly used in commits.
|
24
|
-
# @param
|
25
|
-
def initialize(condensed: false, **
|
26
|
-
@
|
27
|
-
@
|
28
|
-
@
|
24
|
+
# @param system_arguments [Hash] <%= link_to_system_arguments_docs %>
|
25
|
+
def initialize(condensed: false, **system_arguments)
|
26
|
+
@system_arguments = system_arguments
|
27
|
+
@system_arguments[:tag] = :div
|
28
|
+
@system_arguments[:classes] = class_names(
|
29
29
|
"TimelineItem",
|
30
30
|
condensed ? "TimelineItem--condensed" : "",
|
31
|
-
|
31
|
+
system_arguments[:classes]
|
32
32
|
)
|
33
33
|
end
|
34
34
|
|
@@ -37,55 +37,55 @@ module Primer
|
|
37
37
|
end
|
38
38
|
|
39
39
|
class Avatar < Primer::Slot
|
40
|
-
attr_reader :
|
40
|
+
attr_reader :system_arguments, :alt, :src, :size, :square
|
41
41
|
|
42
42
|
# @param alt [String] Alt text for avatar image.
|
43
43
|
# @param src [String] Src attribute for avatar image.
|
44
44
|
# @param size [Integer] Image size.
|
45
45
|
# @param square [Boolean] Whether to round the edges of the image.
|
46
|
-
# @param
|
47
|
-
def initialize(alt: nil, src: nil, size: 40, square: true, **
|
46
|
+
# @param system_arguments [Hash] <%= link_to_system_arguments_docs %>
|
47
|
+
def initialize(alt: nil, src: nil, size: 40, square: true, **system_arguments)
|
48
48
|
@alt = alt
|
49
49
|
@src = src
|
50
50
|
@size = size
|
51
51
|
@square = square
|
52
52
|
|
53
|
-
@
|
54
|
-
@
|
55
|
-
@
|
53
|
+
@system_arguments = system_arguments
|
54
|
+
@system_arguments[:tag] = :div
|
55
|
+
@system_arguments[:classes] = class_names(
|
56
56
|
"TimelineItem-avatar",
|
57
|
-
|
57
|
+
system_arguments[:classes]
|
58
58
|
)
|
59
59
|
end
|
60
60
|
end
|
61
61
|
|
62
62
|
class Badge < Primer::Slot
|
63
|
-
attr_reader :
|
63
|
+
attr_reader :system_arguments, :icon
|
64
64
|
|
65
65
|
# @param icon [String] Name of [Octicon](https://primer.style/octicons/) to use.
|
66
|
-
# @param
|
67
|
-
def initialize(icon: nil, **
|
66
|
+
# @param system_arguments [Hash] <%= link_to_system_arguments_docs %>
|
67
|
+
def initialize(icon: nil, **system_arguments)
|
68
68
|
@icon = icon
|
69
69
|
|
70
|
-
@
|
71
|
-
@
|
72
|
-
@
|
70
|
+
@system_arguments = system_arguments
|
71
|
+
@system_arguments[:tag] = :div
|
72
|
+
@system_arguments[:classes] = class_names(
|
73
73
|
"TimelineItem-badge",
|
74
|
-
|
74
|
+
system_arguments[:classes]
|
75
75
|
)
|
76
76
|
end
|
77
77
|
end
|
78
78
|
|
79
79
|
class Body < Primer::Slot
|
80
|
-
attr_reader :
|
80
|
+
attr_reader :system_arguments
|
81
81
|
|
82
|
-
# @param
|
83
|
-
def initialize(**
|
84
|
-
@
|
85
|
-
@
|
86
|
-
@
|
82
|
+
# @param system_arguments [Hash] <%= link_to_system_arguments_docs %>
|
83
|
+
def initialize(**system_arguments)
|
84
|
+
@system_arguments = system_arguments
|
85
|
+
@system_arguments[:tag] = :div
|
86
|
+
@system_arguments[:classes] = class_names(
|
87
87
|
"TimelineItem-body",
|
88
|
-
|
88
|
+
system_arguments[:classes]
|
89
89
|
)
|
90
90
|
end
|
91
91
|
end
|
@@ -7,13 +7,13 @@ module Primer
|
|
7
7
|
|
8
8
|
with_content_areas :body, :actions
|
9
9
|
|
10
|
-
def initialize(align: ALIGN_DEFAULT, **
|
10
|
+
def initialize(align: ALIGN_DEFAULT, **system_arguments)
|
11
11
|
@align = fetch_or_fallback(ALIGN_OPTIONS, align, ALIGN_DEFAULT)
|
12
12
|
|
13
|
-
@
|
14
|
-
@
|
15
|
-
@
|
16
|
-
@
|
13
|
+
@system_arguments = system_arguments
|
14
|
+
@system_arguments[:tag] = :nav
|
15
|
+
@system_arguments[:classes] = class_names(
|
16
|
+
@system_arguments[:classes],
|
17
17
|
"UnderlineNav",
|
18
18
|
"UnderlineNav--right" => @align == :right
|
19
19
|
)
|
data/lib/primer/classify.rb
CHANGED
@@ -9,7 +9,7 @@ module Primer
|
|
9
9
|
ALIGN_ITEMS_KEY = :align_items
|
10
10
|
DISPLAY_KEY = :display
|
11
11
|
RESPONSIVE_KEYS = ([DISPLAY_KEY, DIRECTION_KEY, JUSTIFY_CONTENT_KEY, ALIGN_ITEMS_KEY, :col, :float] + SPACING_KEYS).freeze
|
12
|
-
BREAKPOINTS = ["", "-sm", "-md", "-lg"]
|
12
|
+
BREAKPOINTS = ["", "-sm", "-md", "-lg", "-xl"]
|
13
13
|
|
14
14
|
# Keys where we can simply translate { key: value } into ".key-value"
|
15
15
|
CONCAT_KEYS = SPACING_KEYS + [:hide, :position, :v, :float, :col, :text, :box_shadow].freeze
|
@@ -29,7 +29,7 @@ module Primer
|
|
29
29
|
WIDTH_KEY = :width
|
30
30
|
HEIGHT_KEY = :height
|
31
31
|
BOX_SHADOW_KEY = :box_shadow
|
32
|
-
|
32
|
+
VISIBILITY_KEY = :visibility
|
33
33
|
|
34
34
|
BOOLEAN_MAPPINGS = {
|
35
35
|
underline: {
|
@@ -102,7 +102,8 @@ module Primer
|
|
102
102
|
ALIGN_SELF_KEY,
|
103
103
|
WIDTH_KEY,
|
104
104
|
HEIGHT_KEY,
|
105
|
-
BOX_SHADOW_KEY
|
105
|
+
BOX_SHADOW_KEY,
|
106
|
+
VISIBILITY_KEY
|
106
107
|
]
|
107
108
|
).freeze
|
108
109
|
|
@@ -131,9 +132,7 @@ module Primer
|
|
131
132
|
|
132
133
|
if invalid_class_names.any?
|
133
134
|
raise ArgumentError.new(
|
134
|
-
"Primer CSS class #{'name'.pluralize(invalid_class_names.length)}
|
135
|
-
#{invalid_class_names.to_sentence} #{'is'.pluralize(invalid_class_names.length)} \
|
136
|
-
not allowed, use style arguments instead (https://github.com/primer/view_components#built-in-styling-arguments). This warning will not be raised in production.",
|
135
|
+
"Use System Arguments (https://primer.style/view-components/system-arguments) instead of Primer CSS class #{'name'.pluralize(invalid_class_names.length)} #{invalid_class_names.to_sentence}. This warning will not be raised in production.",
|
137
136
|
)
|
138
137
|
end
|
139
138
|
end
|
@@ -233,6 +232,8 @@ module Primer
|
|
233
232
|
else
|
234
233
|
memo[:classes] << "box-shadow-#{dasherized_val}"
|
235
234
|
end
|
235
|
+
elsif key == VISIBILITY_KEY
|
236
|
+
memo[:classes] << "v-#{dasherized_val}"
|
236
237
|
else
|
237
238
|
memo[:classes] << "#{key.to_s.dasherize}#{breakpoint}-#{dasherized_val}"
|
238
239
|
end
|
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.16
|
5
5
|
platform: ruby
|
6
6
|
authors:
|
7
7
|
- GitHub Open Source
|
8
|
-
autorequire:
|
8
|
+
autorequire:
|
9
9
|
bindir: bin
|
10
10
|
cert_chain: []
|
11
|
-
date: 2020-
|
11
|
+
date: 2020-11-25 00:00:00.000000000 Z
|
12
12
|
dependencies:
|
13
13
|
- !ruby/object:Gem::Dependency
|
14
14
|
name: rails
|
@@ -182,7 +182,7 @@ dependencies:
|
|
182
182
|
- - "~>"
|
183
183
|
- !ruby/object:Gem::Version
|
184
184
|
version: 0.9.25
|
185
|
-
description:
|
185
|
+
description:
|
186
186
|
email:
|
187
187
|
- opensource+primer_view_components@github.com
|
188
188
|
executables: []
|
@@ -245,7 +245,7 @@ licenses:
|
|
245
245
|
- MIT
|
246
246
|
metadata:
|
247
247
|
allowed_push_host: https://rubygems.org
|
248
|
-
post_install_message:
|
248
|
+
post_install_message:
|
249
249
|
rdoc_options: []
|
250
250
|
require_paths:
|
251
251
|
- lib
|
@@ -261,7 +261,7 @@ required_rubygems_version: !ruby/object:Gem::Requirement
|
|
261
261
|
version: '0'
|
262
262
|
requirements: []
|
263
263
|
rubygems_version: 3.1.2
|
264
|
-
signing_key:
|
264
|
+
signing_key:
|
265
265
|
specification_version: 4
|
266
266
|
summary: ViewComponents for the Primer Design System
|
267
267
|
test_files: []
|