primer_view_components 0.0.14 → 0.0.15
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 +10 -0
- data/app/components/primer/base_component.rb +57 -13
- data/app/components/primer/counter_component.rb +7 -6
- data/lib/primer/classify.rb +5 -2
- data/lib/primer/view_components/version.rb +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: c2957082e3fcbcfe88a4bed4f13c1dd8e46971a4792f4e4539cf396293d2b753
|
|
4
|
+
data.tar.gz: 0cfc136341d4b04c8602851085131fb35eea924439c8b577081993e2540e4992
|
|
5
5
|
SHA512:
|
|
6
|
-
metadata.gz:
|
|
7
|
-
data.tar.gz:
|
|
6
|
+
metadata.gz: ba13e8bb5fab035a22483269d350ede659f95a36feaf07031c88076750c2ec9775bf3f8a34e65807dfdf5b874a3ba9efb0cdfdfafefcbaa22bef0f55b98e86ee
|
|
7
|
+
data.tar.gz: d9c0d1615202ddc1f0a193a8555812cb97ad1f371df7e8ed2ce66ee2899f41a266af10d3e9eda205d187fb0e20f154a82034bda8e5f732c48ec17ab0cee9c9ac
|
data/CHANGELOG.md
CHANGED
|
@@ -1,9 +1,9 @@
|
|
|
1
1
|
# frozen_string_literal: true
|
|
2
2
|
|
|
3
3
|
module Primer
|
|
4
|
-
# All Primer ViewComponents accept a standard set of options called
|
|
4
|
+
# All Primer ViewComponents accept a standard set of options called system arguments, mimicking the [styled-system API](https://styled-system.com/table) used by [Primer React](https://primer.style/components/system-props).
|
|
5
5
|
#
|
|
6
|
-
# Under the hood,
|
|
6
|
+
# Under the hood, system arguments are [mapped](https://github.com/primer/view_components/blob/main/lib/primer/classify.rb) to Primer CSS classes, with any remaining options passed to Rails' [`content_tag`](https://api.rubyonrails.org/classes/ActionView/Helpers/TagHelper.html#method-i-content_tag).
|
|
7
7
|
#
|
|
8
8
|
# ## Responsive values
|
|
9
9
|
#
|
|
@@ -23,9 +23,22 @@ module Primer
|
|
|
23
23
|
# <h1 class="mt-0 mt-lg-4 mt-xl-2">Hello world</h1>
|
|
24
24
|
# ```
|
|
25
25
|
#
|
|
26
|
+
# ## HTML attributes
|
|
27
|
+
#
|
|
28
|
+
# System arguments include most HTML attributes. For example:
|
|
29
|
+
#
|
|
30
|
+
# | Name | Type | Description |
|
|
31
|
+
# | :- | :- | :- |
|
|
32
|
+
# | `width` | `Integer` | Width. |
|
|
33
|
+
# | `height` | `Integer` | Height. |
|
|
34
|
+
# | `data` | `Hash` | Data attributes: `data: { foo: :bar }` renders `data-foo='bar'`. |
|
|
35
|
+
# | `aria` | `Hash` | Aria attributes: `aria: { label: "foo" }` renders `aria-label='foo'`. |
|
|
36
|
+
# | `title` | `String` | The `title` attribute. |
|
|
37
|
+
# | `hidden` | `Boolean` | Whether to assign the `hidden` attribute. |
|
|
26
38
|
class BaseComponent < Primer::Component
|
|
27
39
|
TEST_SELECTOR_TAG = :test_selector
|
|
28
|
-
|
|
40
|
+
# @param test_selector [String] Adds `data-test-selector='given value'` in non-Production environments for testing purposes.
|
|
41
|
+
#
|
|
29
42
|
# @param m [Integer] Margin. <%= one_of((-6..6).to_a) %>
|
|
30
43
|
# @param mt [Integer] Margin left. <%= one_of((-6..6).to_a) %>
|
|
31
44
|
# @param mr [Integer] Margin right. <%= one_of((-6..6).to_a) %>
|
|
@@ -33,13 +46,13 @@ module Primer
|
|
|
33
46
|
# @param ml [Integer] Margin left. <%= one_of((-6..6).to_a) %>
|
|
34
47
|
# @param mx [Integer] Horizontal margins. <%= one_of((-6..6).to_a + [:auto]) %>
|
|
35
48
|
# @param my [Integer] Vertical margins. <%= one_of((-6..6).to_a) %>
|
|
36
|
-
# @param
|
|
37
|
-
# @param
|
|
38
|
-
# @param
|
|
39
|
-
# @param
|
|
40
|
-
# @param
|
|
41
|
-
# @param
|
|
42
|
-
# @param
|
|
49
|
+
# @param p [Integer] Padding. <%= one_of((0..6).to_a) %>
|
|
50
|
+
# @param pt [Integer] Padding left. <%= one_of((0..6).to_a) %>
|
|
51
|
+
# @param pr [Integer] Padding right. <%= one_of((0..6).to_a) %>
|
|
52
|
+
# @param pb [Integer] Padding bottom. <%= one_of((0..6).to_a) %>
|
|
53
|
+
# @param pl [Integer] Padding left. <%= one_of((0..6).to_a) %>
|
|
54
|
+
# @param px [Integer] Horizontal padding. <%= one_of((0..6).to_a) %>
|
|
55
|
+
# @param py [Integer] Vertical padding. <%= one_of((0..6).to_a) %>
|
|
43
56
|
#
|
|
44
57
|
# @param position [Symbol] <%= one_of([:relative, :absolute, :fixed]) %>
|
|
45
58
|
#
|
|
@@ -50,15 +63,46 @@ module Primer
|
|
|
50
63
|
#
|
|
51
64
|
# @param display [Symbol] <%= one_of([:block, :none, :inline, :inline_block, :table, :table_cell]) %>
|
|
52
65
|
#
|
|
66
|
+
# @param v [Symbol] Visibility. <%= one_of([:hidden, :visible]) %>
|
|
67
|
+
#
|
|
53
68
|
# @param hide [Symbol] Hide the element at a specific breakpoint. <%= one_of([:sm, :md, :lg, :xl]) %>
|
|
54
69
|
#
|
|
55
70
|
# @param vertical_align [Symbol] <%= one_of([:baseline, :top, :middle, :bottom, :text_top, :text_bottom]) %>
|
|
56
71
|
#
|
|
57
72
|
# @param float [Symbol] <%= one_of([:left, :right]) %>
|
|
58
73
|
#
|
|
59
|
-
# @param
|
|
60
|
-
#
|
|
61
|
-
# @param
|
|
74
|
+
# @param col [Integer] Number of columns.
|
|
75
|
+
#
|
|
76
|
+
# @param underline [Boolean] Whether text should be underlined.
|
|
77
|
+
#
|
|
78
|
+
# @param color [Symbol] Text color. <%= one_of([:blue, :red, :gray_light, :gray, :gray_dark, :green, :orange, :orange_light, :purple, :pink, :white, :inherit]) %> Note: this API is subject to change as we move to functional colors.
|
|
79
|
+
# @param bg [String, Symbol] Background color. Accepts either a hex value as a String or a color name as a Symbol.
|
|
80
|
+
#
|
|
81
|
+
# @param box_shadow [Boolean, Symbol] Box shadow. <%= one_of([true, :medium, :large, :extra_large, :none]) %>
|
|
82
|
+
# @param border [Symbol] <%= one_of([:left, :top, :bottom, :right, :y, :x]) %>
|
|
83
|
+
# @param border_color [Symbol] <%= one_of([:blue, :blue_light, :gray, :gray_dark, :green, :purple, :red, :red_light, :white, :yellow, :black_fade]) %> Note: this API is subject to change as we move to functional colors.
|
|
84
|
+
# @param border_top [Integer] Set to `0` to remove the top border.
|
|
85
|
+
# @param border_bottom [Integer] Set to `0` to remove the bottom border.
|
|
86
|
+
# @param border_left [Integer] Set to `0` to remove the left border.
|
|
87
|
+
# @param border_right [Integer] Set to `0` to remove the right border.
|
|
88
|
+
#
|
|
89
|
+
# @param font_size [String, Integer] <%= one_of(["00", 0, 1, 2, 3, 4, 5, 6]) %>
|
|
90
|
+
# @param text_align [Symbol] Text alignment. <%= one_of([:left, :right, :center]) %>
|
|
91
|
+
# @param font_weight [Symbol] Font weight. <%= one_of([:light, :normal, :bold]) %>
|
|
92
|
+
#
|
|
93
|
+
# @param flex [Integer, Symbol] <%= one_of([1, :auto]) %>
|
|
94
|
+
# @param flex_grow [Integer] To enable, set to `0`.
|
|
95
|
+
# @param flex_shrink [Integer] To enable, set to `0`.
|
|
96
|
+
# @param align_self [Symbol] <%= one_of([:auto, :start, :end, :center, :baseline, :stretch]) %>
|
|
97
|
+
# @param justify_content [Symbol] <%= one_of([:flex_start, :flex_end, :center, :space_between, :space_around]) %>
|
|
98
|
+
# @param align_items [Symbol] <%= one_of([:flex_start, :flex_end, :center, :baseline, :stretch]) %>
|
|
99
|
+
# @param width [Symbol] <%= one_of([:fit, :fill]) %>
|
|
100
|
+
# @param height [Symbol] <%= one_of([:fit, :fill]) %>
|
|
101
|
+
#
|
|
102
|
+
# @param word_break [Symbol] Whether to break words on line breaks. Can only be `:break_all`.
|
|
103
|
+
#
|
|
104
|
+
# @param tag [Symbol] HTML tag name to be passed to `tag.send`.
|
|
105
|
+
# @param classes [String] CSS class name value to be concatenated with generated Primer CSS classes.
|
|
62
106
|
def initialize(tag:, classes: nil, **system_arguments)
|
|
63
107
|
@tag = tag
|
|
64
108
|
@result = Primer::Classify.call(**system_arguments.merge(classes: classes))
|
|
@@ -16,7 +16,7 @@ module Primer
|
|
|
16
16
|
#
|
|
17
17
|
# @param count [Integer, Float::INFINITY, nil] The number to be displayed (e.x. # of issues, pull requests)
|
|
18
18
|
# @param scheme [Symbol] Color scheme. One of `SCHEME_MAPPINGS.keys`.
|
|
19
|
-
# @param limit [Integer] Maximum value to display. (e.x. if count == 6,000 and limit == 5000, counter will display "5,000+")
|
|
19
|
+
# @param limit [Integer, nil] Maximum value to display. Pass `nil` for no limit. (e.x. if `count` == 6,000 and `limit` == 5000, counter will display "5,000+")
|
|
20
20
|
# @param hide_if_zero [Boolean] If true, a `hidden` attribute is added to the counter if `count` is zero.
|
|
21
21
|
# @param text [String] Text to display instead of count.
|
|
22
22
|
# @param round [Boolean] Whether to apply our standard rounding logic to value.
|
|
@@ -32,6 +32,7 @@ module Primer
|
|
|
32
32
|
)
|
|
33
33
|
@count, @limit, @hide_if_zero, @text, @round, @system_arguments = count, limit, hide_if_zero, text, round, system_arguments
|
|
34
34
|
|
|
35
|
+
@has_limit = !@limit.nil?
|
|
35
36
|
@system_arguments[:title] = title
|
|
36
37
|
@system_arguments[:tag] = :span
|
|
37
38
|
@system_arguments[:classes] = class_names(
|
|
@@ -58,8 +59,8 @@ module Primer
|
|
|
58
59
|
"Infinity"
|
|
59
60
|
else
|
|
60
61
|
count = @count.to_i
|
|
61
|
-
str = number_with_delimiter([count, @limit].min)
|
|
62
|
-
str += "+" if count > @limit
|
|
62
|
+
str = number_with_delimiter(@has_limit ? [count, @limit].min : count)
|
|
63
|
+
str += "+" if (@has_limit && count > @limit)
|
|
63
64
|
str
|
|
64
65
|
end
|
|
65
66
|
end
|
|
@@ -73,16 +74,16 @@ module Primer
|
|
|
73
74
|
"∞"
|
|
74
75
|
else
|
|
75
76
|
if @round
|
|
76
|
-
count = [@count.to_i, @limit].min
|
|
77
|
+
count = @has_limit ? [@count.to_i, @limit].min : @count.to_i
|
|
77
78
|
precision = count.between?(100_000, 999_999) ? 0 : 1
|
|
78
79
|
units = {thousand: "k", million: "m", billion: "b"}
|
|
79
80
|
str = number_to_human(count, precision: precision, significant: false, units: units, format: "%n%u")
|
|
80
81
|
else
|
|
81
82
|
@count = @count.to_i
|
|
82
|
-
str = number_with_delimiter([@count, @limit].min)
|
|
83
|
+
str = number_with_delimiter(@has_limit ? [@count, @limit].min : @count)
|
|
83
84
|
end
|
|
84
85
|
|
|
85
|
-
str += "+" if @count.to_i > @limit
|
|
86
|
+
str += "+" if (@has_limit && @count.to_i > @limit)
|
|
86
87
|
str
|
|
87
88
|
end
|
|
88
89
|
end
|
data/lib/primer/classify.rb
CHANGED
|
@@ -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
|
|
|
@@ -231,6 +232,8 @@ module Primer
|
|
|
231
232
|
else
|
|
232
233
|
memo[:classes] << "box-shadow-#{dasherized_val}"
|
|
233
234
|
end
|
|
235
|
+
elsif key == VISIBILITY_KEY
|
|
236
|
+
memo[:classes] << "v-#{dasherized_val}"
|
|
234
237
|
else
|
|
235
238
|
memo[:classes] << "#{key.to_s.dasherize}#{breakpoint}-#{dasherized_val}"
|
|
236
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.15
|
|
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: 2020-11-
|
|
11
|
+
date: 2020-11-20 00:00:00.000000000 Z
|
|
12
12
|
dependencies:
|
|
13
13
|
- !ruby/object:Gem::Dependency
|
|
14
14
|
name: rails
|