primer_view_components 0.1.8 → 0.2.0

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 (209) hide show
  1. checksums.yaml +4 -4
  2. data/CHANGELOG.md +79 -0
  3. data/README.md +1 -1
  4. data/app/assets/javascripts/primer_view_components.js +1 -1
  5. data/app/assets/javascripts/primer_view_components.js.map +1 -1
  6. data/app/assets/styles/primer_view_components.css +1 -3
  7. data/app/assets/styles/primer_view_components.css.map +1 -1
  8. data/app/components/primer/alpha/action_list/item.rb +3 -5
  9. data/app/components/primer/alpha/action_list.css +1 -1
  10. data/app/components/primer/alpha/action_list.css.json +16 -16
  11. data/app/components/primer/alpha/action_list.css.map +1 -1
  12. data/app/components/primer/alpha/action_list.pcss +145 -145
  13. data/app/components/primer/alpha/action_list.rb +30 -15
  14. data/app/components/primer/alpha/action_menu/action_menu_element.d.ts +2 -1
  15. data/app/components/primer/alpha/action_menu/action_menu_element.js +44 -34
  16. data/app/components/primer/alpha/action_menu/action_menu_element.ts +32 -30
  17. data/app/components/primer/alpha/action_menu/list.rb +6 -1
  18. data/app/components/primer/alpha/action_menu.rb +1 -1
  19. data/app/components/primer/alpha/auto_complete.css +1 -1
  20. data/app/components/primer/alpha/auto_complete.css.map +1 -1
  21. data/app/components/primer/alpha/auto_complete.pcss +3 -3
  22. data/app/components/primer/alpha/banner.css +1 -1
  23. data/app/components/primer/alpha/banner.css.map +1 -1
  24. data/app/components/primer/alpha/banner.pcss +11 -11
  25. data/app/components/primer/alpha/button_marketing.css.map +1 -1
  26. data/app/components/primer/alpha/button_marketing.pcss +5 -12
  27. data/app/components/primer/alpha/button_marketing.rb +3 -0
  28. data/app/components/primer/alpha/dialog.css +1 -1
  29. data/app/components/primer/alpha/dialog.css.map +1 -1
  30. data/app/components/primer/alpha/dialog.pcss +36 -36
  31. data/app/components/primer/alpha/dropdown.css +1 -1
  32. data/app/components/primer/alpha/dropdown.css.map +1 -1
  33. data/app/components/primer/alpha/dropdown.pcss +12 -12
  34. data/app/components/primer/alpha/form_control.html.erb +1 -1
  35. data/app/components/primer/alpha/hellip_button.rb +3 -1
  36. data/app/components/primer/alpha/layout.css +1 -1
  37. data/app/components/primer/alpha/layout.css.map +1 -1
  38. data/app/components/primer/alpha/layout.pcss +4 -4
  39. data/app/components/primer/alpha/menu.css +1 -1
  40. data/app/components/primer/alpha/menu.css.map +1 -1
  41. data/app/components/primer/alpha/menu.pcss +21 -21
  42. data/app/components/primer/alpha/modal_dialog.js +17 -4
  43. data/app/components/primer/alpha/modal_dialog.ts +17 -4
  44. data/app/components/primer/alpha/nav_list/item.rb +2 -0
  45. data/app/components/primer/alpha/nav_list.js +6 -0
  46. data/app/components/primer/alpha/nav_list.rb +55 -36
  47. data/app/components/primer/alpha/nav_list.ts +8 -0
  48. data/app/components/primer/alpha/octicon_symbols.html.erb +1 -1
  49. data/app/components/primer/alpha/overlay/header.html.erb +5 -3
  50. data/app/components/primer/alpha/overlay/header.rb +4 -1
  51. data/app/components/primer/alpha/overlay.css +1 -1
  52. data/app/components/primer/alpha/overlay.css.json +1 -2
  53. data/app/components/primer/alpha/overlay.css.map +1 -1
  54. data/app/components/primer/alpha/overlay.pcss +14 -4
  55. data/app/components/primer/alpha/overlay.rb +1 -0
  56. data/app/components/primer/alpha/segmented_control.css +1 -1
  57. data/app/components/primer/alpha/segmented_control.css.map +1 -1
  58. data/app/components/primer/alpha/segmented_control.pcss +24 -33
  59. data/app/components/primer/alpha/tab_nav.css +1 -1
  60. data/app/components/primer/alpha/tab_nav.css.map +1 -1
  61. data/app/components/primer/alpha/tab_nav.pcss +12 -12
  62. data/app/components/primer/alpha/text_field.css +1 -3
  63. data/app/components/primer/alpha/text_field.css.json +1 -0
  64. data/app/components/primer/alpha/text_field.css.map +1 -1
  65. data/app/components/primer/alpha/text_field.pcss +87 -83
  66. data/app/components/primer/alpha/toggle_switch.css +1 -1
  67. data/app/components/primer/alpha/toggle_switch.css.json +11 -11
  68. data/app/components/primer/alpha/toggle_switch.css.map +1 -1
  69. data/app/components/primer/alpha/toggle_switch.d.ts +1 -1
  70. data/app/components/primer/alpha/toggle_switch.html.erb +2 -2
  71. data/app/components/primer/alpha/toggle_switch.js +44 -42
  72. data/app/components/primer/alpha/toggle_switch.pcss +16 -16
  73. data/app/components/primer/alpha/toggle_switch.rb +7 -0
  74. data/app/components/primer/alpha/toggle_switch.ts +50 -41
  75. data/app/components/primer/alpha/underline_nav.css +1 -1
  76. data/app/components/primer/alpha/underline_nav.css.map +1 -1
  77. data/app/components/primer/alpha/underline_nav.pcss +11 -11
  78. data/app/components/primer/beta/auto_complete.rb +1 -1
  79. data/app/components/primer/beta/avatar.css +1 -1
  80. data/app/components/primer/beta/avatar.css.map +1 -1
  81. data/app/components/primer/beta/avatar.pcss +18 -18
  82. data/app/components/primer/beta/avatar_stack.css +1 -1
  83. data/app/components/primer/beta/avatar_stack.css.map +1 -1
  84. data/app/components/primer/beta/avatar_stack.pcss +5 -5
  85. data/app/components/primer/beta/base_button.rb +11 -0
  86. data/app/components/primer/beta/blankslate.css +1 -1
  87. data/app/components/primer/beta/blankslate.css.map +1 -1
  88. data/app/components/primer/beta/blankslate.pcss +16 -16
  89. data/app/components/primer/beta/border_box.css +1 -1
  90. data/app/components/primer/beta/border_box.css.json +1 -1
  91. data/app/components/primer/beta/border_box.css.map +1 -1
  92. data/app/components/primer/beta/border_box.pcss +40 -42
  93. data/app/components/primer/beta/button.css +1 -1
  94. data/app/components/primer/beta/button.css.json +4 -0
  95. data/app/components/primer/beta/button.css.map +1 -1
  96. data/app/components/primer/beta/button.pcss +39 -24
  97. data/app/components/primer/beta/button.rb +3 -0
  98. data/app/components/primer/beta/button_group.css +1 -0
  99. data/app/components/primer/beta/button_group.css.json +14 -0
  100. data/app/components/primer/beta/button_group.css.map +1 -0
  101. data/app/components/primer/beta/button_group.pcss +27 -0
  102. data/app/components/primer/beta/button_group.rb +19 -19
  103. data/app/components/primer/beta/close_button.rb +3 -1
  104. data/app/components/primer/beta/counter.css +1 -1
  105. data/app/components/primer/beta/counter.css.map +1 -1
  106. data/app/components/primer/beta/counter.pcss +5 -5
  107. data/app/components/primer/beta/details.html.erb +6 -2
  108. data/app/components/primer/beta/details.rb +18 -10
  109. data/app/components/primer/beta/flash.css +1 -1
  110. data/app/components/primer/beta/flash.css.map +1 -1
  111. data/app/components/primer/beta/flash.pcss +12 -12
  112. data/app/components/primer/beta/icon_button.rb +7 -3
  113. data/app/components/primer/beta/label.css +1 -1
  114. data/app/components/primer/beta/label.css.map +1 -1
  115. data/app/components/primer/beta/label.pcss +3 -3
  116. data/app/components/primer/beta/popover.css +1 -1
  117. data/app/components/primer/beta/popover.css.map +1 -1
  118. data/app/components/primer/beta/popover.pcss +4 -4
  119. data/app/components/primer/beta/state.css +1 -1
  120. data/app/components/primer/beta/state.css.map +1 -1
  121. data/app/components/primer/beta/state.pcss +7 -7
  122. data/app/components/primer/beta/subhead.css +1 -1
  123. data/app/components/primer/beta/subhead.css.map +1 -1
  124. data/app/components/primer/beta/subhead.pcss +9 -9
  125. data/app/components/primer/beta/timeline_item.css +1 -1
  126. data/app/components/primer/beta/timeline_item.css.map +1 -1
  127. data/app/components/primer/beta/timeline_item.pcss +18 -18
  128. data/app/components/primer/beta/truncate.css +1 -1
  129. data/app/components/primer/beta/truncate.css.map +1 -1
  130. data/app/components/primer/beta/truncate.pcss +1 -1
  131. data/app/components/primer/focus_group.js +8 -13
  132. data/app/components/primer/focus_group.ts +8 -12
  133. data/app/components/primer/primer.d.ts +1 -0
  134. data/app/components/primer/primer.js +1 -0
  135. data/app/components/primer/primer.pcss +1 -0
  136. data/app/components/primer/primer.ts +1 -0
  137. data/lib/postcss_mixins/activeIndicatorLine.pcss +4 -4
  138. data/lib/primer/accessibility.rb +74 -0
  139. data/lib/primer/forms/dsl/input.rb +4 -8
  140. data/lib/primer/forms/dsl/text_field_input.rb +0 -4
  141. data/lib/primer/forms/dsl/toggle_switch_input.rb +4 -0
  142. data/lib/primer/forms/form_control.html.erb +3 -5
  143. data/lib/primer/forms/primer_base_component_wrapper.html.erb +3 -0
  144. data/lib/primer/forms/primer_base_component_wrapper.rb +24 -0
  145. data/lib/primer/forms/toggle_switch.html.erb +3 -3
  146. data/lib/primer/forms/toggle_switch.rb +6 -2
  147. data/lib/primer/forms/toggle_switch_input.js +7 -2
  148. data/lib/primer/forms/toggle_switch_input.ts +9 -2
  149. data/lib/primer/static/generate_info_arch.rb +3 -0
  150. data/lib/primer/static/generate_previews.rb +15 -8
  151. data/lib/primer/view_components/linters/deprecated_components_counter.rb +37 -13
  152. data/lib/primer/view_components/version.rb +2 -2
  153. data/lib/primer/yard/component_manifest.rb +1 -1
  154. data/lib/primer/yard/lookbook_pages_backend.rb +8 -2
  155. data/lib/primer/yard/registry.rb +4 -0
  156. data/previews/pages/forms/03_caption_templates.md.erb +1 -1
  157. data/previews/pages/forms/04_after_content.md.erb +1 -1
  158. data/previews/pages/forms/06_miscellaneous_inputs.md.erb +1 -1
  159. data/previews/pages/forms/07_toggle_switch_forms.md.erb +1 -1
  160. data/previews/primer/alpha/action_menu_preview/two_menus.html.erb +13 -0
  161. data/previews/primer/alpha/action_menu_preview/with_actions.html.erb +21 -0
  162. data/previews/primer/alpha/action_menu_preview.rb +5 -13
  163. data/previews/primer/alpha/button_marketing_preview.rb +3 -2
  164. data/previews/primer/alpha/dialog_preview.rb +4 -3
  165. data/previews/primer/alpha/hellip_button_preview.rb +3 -2
  166. data/previews/primer/alpha/nav_list_preview.rb +1 -1
  167. data/previews/primer/alpha/overlay_preview/middle_of_page_with_relative_container.html.erb +19 -0
  168. data/previews/primer/alpha/overlay_preview.rb +31 -0
  169. data/previews/primer/beta/base_button_preview.rb +9 -2
  170. data/previews/primer/beta/button_group_preview/action_menus.html.erb +8 -0
  171. data/previews/primer/beta/button_group_preview.rb +49 -11
  172. data/previews/primer/beta/button_preview/trailing_counter.html.erb +1 -1
  173. data/previews/primer/beta/button_preview.rb +5 -2
  174. data/previews/primer/beta/close_button_preview.rb +3 -2
  175. data/previews/primer/beta/details_preview.rb +11 -8
  176. data/previews/primer/forms_preview.rb +44 -0
  177. data/static/arguments.json +11 -5
  178. data/static/classes.json +378 -372
  179. data/static/constants.json +0 -1
  180. data/static/info_arch.json +5457 -1364
  181. data/static/previews.json +5197 -1428
  182. metadata +40 -36
  183. data/lib/tasks/docs.rake +0 -185
  184. data/lib/tasks/helpers/ast_processor.rb +0 -44
  185. data/lib/tasks/helpers/ast_traverser.rb +0 -77
  186. data/lib/tasks/primer_view_components.rake +0 -47
  187. data/lib/tasks/static.rake +0 -29
  188. data/lib/tasks/test.rake +0 -83
  189. data/lib/tasks/utilities.rake +0 -109
  190. data/previews/primer/forms/forms_preview.rb +0 -48
  191. /data/previews/primer/{forms/forms_preview → forms_preview}/after_content_form.html.erb +0 -0
  192. /data/previews/primer/{forms/forms_preview → forms_preview}/array_check_box_group_form.html.erb +0 -0
  193. /data/previews/primer/{forms/forms_preview → forms_preview}/caption_template_form.html.erb +0 -0
  194. /data/previews/primer/{forms/forms_preview → forms_preview}/check_box_group_form.html.erb +0 -0
  195. /data/previews/primer/{forms/forms_preview → forms_preview}/check_box_with_nested_form.html.erb +0 -0
  196. /data/previews/primer/{forms/forms_preview → forms_preview}/composed_form.html.erb +0 -0
  197. /data/previews/primer/{forms/forms_preview → forms_preview}/example_toggle_switch_form.html.erb +0 -0
  198. /data/previews/primer/{forms/forms_preview → forms_preview}/horizontal_form.html.erb +0 -0
  199. /data/previews/primer/{forms/forms_preview → forms_preview}/immediate_validation_form.html.erb +0 -0
  200. /data/previews/primer/{forms/forms_preview → forms_preview}/invalid_form.html.erb +0 -0
  201. /data/previews/primer/{forms/forms_preview → forms_preview}/multi_input_form.html.erb +0 -0
  202. /data/previews/primer/{forms/forms_preview → forms_preview}/multi_text_field_form.html.erb +0 -0
  203. /data/previews/primer/{forms/forms_preview → forms_preview}/name_with_question_mark_form.html.erb +0 -0
  204. /data/previews/primer/{forms/forms_preview → forms_preview}/radio_button_group_form.html.erb +0 -0
  205. /data/previews/primer/{forms/forms_preview → forms_preview}/radio_button_with_nested_form.html.erb +0 -0
  206. /data/previews/primer/{forms/forms_preview → forms_preview}/select_form.html.erb +0 -0
  207. /data/previews/primer/{forms/forms_preview → forms_preview}/single_text_field_form.html.erb +0 -0
  208. /data/previews/primer/{forms/forms_preview → forms_preview}/submit_button_form.html.erb +0 -0
  209. /data/previews/primer/{forms/forms_preview → forms_preview}/text_field_and_checkbox_form.html.erb +0 -0
@@ -269,15 +269,18 @@ module Primer
269
269
  # @label Trailing Counter
270
270
  # @param block toggle
271
271
  # @param align_content select [center, start]
272
+ # @param scheme select [default, primary, danger, invisible]
272
273
  def trailing_counter(
273
274
  block: false,
274
275
  id: "button-preview",
275
- align_content: :center
276
+ align_content: :center,
277
+ scheme: :primary
276
278
  )
277
279
  render_with_template(locals: {
278
280
  block: block,
279
281
  id: id,
280
- align_content: align_content
282
+ align_content: align_content,
283
+ scheme: scheme
281
284
  })
282
285
  end
283
286
 
@@ -7,8 +7,9 @@ module Primer
7
7
  # @label Playground
8
8
  #
9
9
  # @param type [Symbol] select [button, submit]
10
- def playground(type: :button)
11
- render(Primer::Beta::CloseButton.new(type: type))
10
+ # @param disabled toggle
11
+ def playground(type: :button, disabled: false)
12
+ render(Primer::Beta::CloseButton.new(type: type, disabled: disabled))
12
13
  end
13
14
 
14
15
  # @label Default options
@@ -8,8 +8,9 @@ module Primer
8
8
  #
9
9
  # @param overlay [Symbol] select [none, default, dark]
10
10
  # @param reset [Boolean] toggle
11
- def playground(reset: false, overlay: :default)
12
- render Primer::Beta::Details.new(reset: reset, overlay: overlay) do |component|
11
+ # @param disabled [Boolean] toggle
12
+ def playground(reset: false, overlay: :default, disabled: false)
13
+ render Primer::Beta::Details.new(reset: reset, overlay: overlay, disabled: disabled) do |component|
13
14
  component.with_summary do
14
15
  "Summary"
15
16
  end
@@ -23,8 +24,9 @@ module Primer
23
24
  #
24
25
  # @param overlay [Symbol] select [none, default, dark]
25
26
  # @param reset [Boolean] toggle
26
- def default(reset: false, overlay: :default)
27
- render Primer::Beta::Details.new(reset: reset, overlay: overlay) do |component|
27
+ # @param disabled [Boolean] toggle
28
+ def default(reset: false, overlay: :default, disabled: false)
29
+ render Primer::Beta::Details.new(reset: reset, overlay: overlay, disabled: disabled) do |component|
28
30
  component.with_summary do
29
31
  "Summary"
30
32
  end
@@ -38,8 +40,9 @@ module Primer
38
40
  #
39
41
  # @param overlay [Symbol] select [none, default, dark]
40
42
  # @param reset [Boolean] toggle
41
- def custom_button(reset: false, overlay: :default)
42
- render Primer::Beta::Details.new(reset: reset, overlay: overlay) do |component|
43
+ # @param disabled [Boolean] toggle
44
+ def custom_button(reset: false, overlay: :default, disabled: false)
45
+ render Primer::Beta::Details.new(reset: reset, overlay: overlay, disabled: disabled) do |component|
43
46
  component.with_summary(size: :small, scheme: :primary) { "Click me" }
44
47
  component.with_body { "Body" }
45
48
  end
@@ -49,8 +52,8 @@ module Primer
49
52
  #
50
53
  # @param overlay [Symbol] select [none, default, dark]
51
54
  # @param reset [Boolean] toggle
52
- def without_button(reset: false, overlay: :default)
53
- render Primer::Beta::Details.new(reset: reset, overlay: overlay) do |component|
55
+ def without_button(reset: false, overlay: :default, disabled: false)
56
+ render Primer::Beta::Details.new(reset: reset, overlay: overlay, disabled: disabled) do |component|
54
57
  component.with_summary(button: false) { "Click me" }
55
58
  component.with_body { "Body" }
56
59
  end
@@ -0,0 +1,44 @@
1
+ # frozen_string_literal: true
2
+
3
+ module Primer
4
+ # :nodoc:
5
+ class FormsPreview < ViewComponent::Preview
6
+ def single_text_field_form; end
7
+
8
+ def multi_text_field_form; end
9
+
10
+ def text_field_and_checkbox_form; end
11
+
12
+ def horizontal_form; end
13
+
14
+ def composed_form; end
15
+
16
+ def submit_button_form; end
17
+
18
+ def radio_button_group_form; end
19
+
20
+ def check_box_group_form; end
21
+
22
+ def array_check_box_group_form; end
23
+
24
+ def select_form; end
25
+
26
+ def radio_button_with_nested_form; end
27
+
28
+ def check_box_with_nested_form; end
29
+
30
+ def caption_template_form; end
31
+
32
+ def after_content_form; end
33
+
34
+ def invalid_form; end
35
+
36
+ def multi_input_form; end
37
+
38
+ def name_with_question_mark_form; end
39
+
40
+ def immediate_validation_form; end
41
+
42
+ def example_toggle_switch_form; end
43
+ end
44
+ end
@@ -1692,7 +1692,13 @@
1692
1692
  "name": "subtitle",
1693
1693
  "type": "String",
1694
1694
  "default": "`nil`",
1695
- "description": "Provides dditional context for the Overlay, also setting the `aria-describedby` attribute."
1695
+ "description": "Provides additional context for the Overlay, also setting the `aria-describedby` attribute."
1696
+ },
1697
+ {
1698
+ "name": "overlay_id",
1699
+ "type": "String",
1700
+ "default": "`nil`",
1701
+ "description": "Provides the id of the overlay element so the close button can close it"
1696
1702
  },
1697
1703
  {
1698
1704
  "name": "size",
@@ -3147,16 +3153,16 @@
3147
3153
  "lookbook": "https://primer.style/view-components/lookbook/inspect/primer/beta/button_group/default/",
3148
3154
  "parameters": [
3149
3155
  {
3150
- "name": "variant",
3156
+ "name": "scheme",
3151
3157
  "type": "Symbol",
3152
- "default": "`nil`",
3153
- "description": "DEPRECATED. One of `:medium` or `:small`."
3158
+ "default": "`:default`",
3159
+ "description": "DEPRECATED. One of `:danger`, `:default`, `:invisible`, `:link`, `:primary`, or `:secondary`."
3154
3160
  },
3155
3161
  {
3156
3162
  "name": "size",
3157
3163
  "type": "Symbol",
3158
3164
  "default": "`:medium`",
3159
- "description": "One of `:medium` or `:small`."
3165
+ "description": "One of `:large`, `:medium`, or `:small`."
3160
3166
  },
3161
3167
  {
3162
3168
  "name": "system_arguments",