primer_view_components 0.0.44 → 0.0.48

Sign up to get free protection for your applications and to get access to all the features.
Files changed (57) hide show
  1. checksums.yaml +4 -4
  2. data/CHANGELOG.md +187 -0
  3. data/app/components/primer/avatar_stack_component.rb +9 -3
  4. data/app/components/primer/base_component.rb +52 -23
  5. data/app/components/primer/beta/auto_complete.rb +159 -0
  6. data/app/components/primer/beta/auto_complete/auto_complete.d.ts +1 -0
  7. data/app/components/primer/{auto_complete → beta/auto_complete}/auto_complete.html.erb +0 -0
  8. data/app/components/primer/beta/auto_complete/auto_complete.js +1 -0
  9. data/app/components/primer/{auto_complete → beta/auto_complete}/auto_complete.ts +0 -0
  10. data/app/components/primer/beta/auto_complete/item.rb +44 -0
  11. data/app/components/primer/beta/avatar.rb +77 -0
  12. data/app/components/primer/border_box_component.rb +3 -0
  13. data/app/components/primer/clipboard_copy.rb +25 -7
  14. data/app/components/primer/component.rb +9 -1
  15. data/app/components/primer/details_component.rb +12 -8
  16. data/app/components/primer/image_crop.rb +1 -1
  17. data/app/components/primer/markdown.rb +9 -9
  18. data/app/components/primer/menu_component.rb +7 -3
  19. data/app/components/primer/navigation/tab_component.rb +19 -5
  20. data/app/components/primer/popover_component.rb +6 -3
  21. data/app/components/primer/primer.d.ts +1 -1
  22. data/app/components/primer/primer.js +1 -1
  23. data/app/components/primer/primer.ts +1 -1
  24. data/app/components/primer/tab_nav_component.rb +8 -6
  25. data/app/components/primer/timeline_item_component.rb +2 -2
  26. data/app/components/primer/tooltip.rb +1 -1
  27. data/app/components/primer/truncate.rb +5 -0
  28. data/app/components/primer/underline_nav_component.rb +12 -6
  29. data/{app/lib → lib}/primer/classify.rb +16 -33
  30. data/{app/lib → lib}/primer/classify/cache.rb +6 -40
  31. data/{app/lib → lib}/primer/classify/flex.rb +0 -0
  32. data/{app/lib → lib}/primer/classify/functional_background_colors.rb +2 -0
  33. data/{app/lib → lib}/primer/classify/functional_border_colors.rb +2 -0
  34. data/{app/lib → lib}/primer/classify/functional_colors.rb +0 -0
  35. data/{app/lib → lib}/primer/classify/functional_text_colors.rb +2 -0
  36. data/{app/lib → lib}/primer/classify/grid.rb +0 -0
  37. data/lib/primer/classify/utilities.rb +148 -0
  38. data/lib/primer/classify/utilities.yml +1271 -0
  39. data/lib/primer/view_components.rb +1 -0
  40. data/lib/primer/view_components/linters/argument_mappers/system_arguments.rb +5 -4
  41. data/lib/primer/view_components/linters/button_component_migration_counter.rb +9 -5
  42. data/lib/primer/view_components/linters/helpers.rb +132 -17
  43. data/lib/primer/view_components/statuses.rb +14 -0
  44. data/lib/primer/view_components/version.rb +1 -1
  45. data/lib/rubocop/config/default.yml +12 -0
  46. data/lib/rubocop/cop/primer.rb +4 -0
  47. data/lib/rubocop/cop/primer/no_tag_memoize.rb +42 -0
  48. data/lib/rubocop/cop/primer/system_argument_instead_of_class.rb +75 -0
  49. data/lib/tasks/docs.rake +72 -18
  50. data/lib/tasks/utilities.rake +105 -0
  51. data/lib/yard/docs_helper.rb +1 -1
  52. data/static/statuses.json +4 -4
  53. metadata +30 -21
  54. data/app/components/primer/auto_complete.rb +0 -156
  55. data/app/components/primer/auto_complete/item.rb +0 -42
  56. data/app/components/primer/avatar_component.rb +0 -75
  57. data/app/lib/primer/classify/spacing.rb +0 -63
@@ -1,75 +0,0 @@
1
- # frozen_string_literal: true
2
-
3
- module Primer
4
- # `Avatar` can be used to represent users and organizations on GitHub.
5
- #
6
- # - Use the default round avatar for users, and the `square` argument
7
- # for organizations or any other non-human avatars.
8
- # - By default, `Avatar` will render a static `<img>`. To have `Avatar` function as a link, set the `href` which will wrap the `<img>` in a `<a>`.
9
- # - Set `size` to update the height and width of the `Avatar` in pixels.
10
- # - To stack multiple avatars together, use <%= link_to_component(Primer::AvatarStackComponent) %>.
11
- #
12
- # @accessibility
13
- # Images should have text alternatives that describe the information or function represented.
14
- # If the avatar functions as a link, provide alt text that helps convey the function. For instance,
15
- # if `Avatar` is a link to a user profile, the alt attribute should be `@kittenuser profile`
16
- # rather than `@kittenuser`.
17
- # [Learn more about best image practices (WAI Images)](https://www.w3.org/WAI/tutorials/images/)
18
- class AvatarComponent < Primer::Component
19
- status :beta
20
-
21
- SMALL_THRESHOLD = 24
22
-
23
- # @example Default
24
- # <%= render(Primer::AvatarComponent.new(src: "http://placekitten.com/200/200", alt: "@kittenuser")) %>
25
- #
26
- # @example Square
27
- # <%= render(Primer::AvatarComponent.new(src: "http://placekitten.com/200/200", alt: "@kittenuser", square: true)) %>
28
- #
29
- # @example Link
30
- # <%= render(Primer::AvatarComponent.new(href: "#", src: "http://placekitten.com/200/200", alt: "@kittenuser profile")) %>
31
- #
32
- # @example With size
33
- # <%= render(Primer::AvatarComponent.new(src: "http://placekitten.com/200/200", alt: "@kittenuser", size: 16)) %>
34
- # <%= render(Primer::AvatarComponent.new(src: "http://placekitten.com/200/200", alt: "@kittenuser", size: 20)) %>
35
- # <%= render(Primer::AvatarComponent.new(src: "http://placekitten.com/200/200", alt: "@kittenuser", size: 24)) %>
36
- # <%= render(Primer::AvatarComponent.new(src: "http://placekitten.com/200/200", alt: "@kittenuser", size: 28)) %>
37
- # <%= render(Primer::AvatarComponent.new(src: "http://placekitten.com/200/200", alt: "@kittenuser", size: 32)) %>
38
- # <%= render(Primer::AvatarComponent.new(src: "http://placekitten.com/200/200", alt: "@kittenuser", size: 36)) %>
39
- #
40
- # @param src [String] The source url of the avatar image.
41
- # @param alt [String] Passed through to alt on img tag.
42
- # @param size [Integer] Adds the avatar-small class if less than 24.
43
- # @param square [Boolean] Used to create a square avatar.
44
- # @param href [String] The URL to link to. If used, component will be wrapped by an `<a>` tag.
45
- # @param system_arguments [Hash] <%= link_to_system_arguments_docs %>
46
- def initialize(src:, alt:, size: 20, square: false, href: nil, **system_arguments)
47
- @href = href
48
- @system_arguments = system_arguments
49
- @system_arguments[:tag] = :img
50
- @system_arguments[:src] = src
51
- @system_arguments[:alt] = alt
52
- @system_arguments[:size] = size
53
- @system_arguments[:height] = size
54
- @system_arguments[:width] = size
55
-
56
- @system_arguments[:classes] = class_names(
57
- system_arguments[:classes],
58
- "avatar",
59
- "avatar-small" => size < SMALL_THRESHOLD,
60
- "circle" => !square,
61
- "lh-0" => href # Addresses an overflow issue with linked avatars
62
- )
63
- end
64
-
65
- def call
66
- if @href
67
- render(Primer::LinkComponent.new(href: @href, classes: @system_arguments[:classes])) do
68
- render(Primer::BaseComponent.new(**@system_arguments.except(:classes))) { content }
69
- end
70
- else
71
- render(Primer::BaseComponent.new(**@system_arguments)) { content }
72
- end
73
- end
74
- end
75
- end
@@ -1,63 +0,0 @@
1
- # frozen_string_literal: true
2
-
3
- module Primer
4
- class Classify
5
- # Handler for PrimerCSS spacing classes.
6
- class Spacing
7
- BASE_OPTIONS = (0..6).to_a.freeze
8
- BASE_MAPPINGS = {
9
- my: BASE_OPTIONS,
10
- pb: BASE_OPTIONS,
11
- pl: BASE_OPTIONS,
12
- pr: BASE_OPTIONS,
13
- pt: BASE_OPTIONS,
14
- px: BASE_OPTIONS,
15
- py: BASE_OPTIONS
16
- }.freeze
17
-
18
- MARGIN_DIRECTION_OPTIONS = [*(-6..-1), *BASE_OPTIONS].freeze
19
- MARGIN_DIRECTION_MAPPINGS = {
20
- mb: MARGIN_DIRECTION_OPTIONS,
21
- ml: MARGIN_DIRECTION_OPTIONS,
22
- mr: MARGIN_DIRECTION_OPTIONS,
23
- mt: MARGIN_DIRECTION_OPTIONS
24
- }.freeze
25
-
26
- AUTO_OPTIONS = [*BASE_OPTIONS, :auto].freeze
27
- AUTO_MAPPINGS = {
28
- m: AUTO_OPTIONS,
29
- mx: AUTO_OPTIONS
30
- }.freeze
31
-
32
- RESPONSIVE_OPTIONS = [*BASE_OPTIONS, :responsive].freeze
33
- RESPONSIVE_MAPPINGS = {
34
- p: RESPONSIVE_OPTIONS
35
- }.freeze
36
-
37
- MAPPINGS = {
38
- **BASE_MAPPINGS,
39
- **MARGIN_DIRECTION_MAPPINGS,
40
- **AUTO_MAPPINGS,
41
- **RESPONSIVE_MAPPINGS
42
- }.freeze
43
- KEYS = MAPPINGS.keys.freeze
44
-
45
- class << self
46
- def spacing(key, val, breakpoint)
47
- validate(key, val) unless Rails.env.production?
48
-
49
- return "#{key.to_s.dasherize}#{breakpoint}-n#{val.abs}" if val.is_a?(Numeric) && val.negative?
50
-
51
- "#{key.to_s.dasherize}#{breakpoint}-#{val.to_s.dasherize}"
52
- end
53
-
54
- private
55
-
56
- def validate(key, val)
57
- raise ArgumentError, "#{key} is not a spacing key" unless KEYS.include?(key)
58
- raise ArgumentError, "#{val} is not a valid value for :#{key}. Use one of #{MAPPINGS[key]}" unless MAPPINGS[key].include?(val)
59
- end
60
- end
61
- end
62
- end
63
- end