primer_view_components 0.1.0 → 0.1.1
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 +20 -0
- data/app/assets/javascripts/primer_view_components.js +1 -1
- data/app/assets/javascripts/primer_view_components.js.map +1 -1
- data/app/assets/styles/primer_view_components.css +1 -1
- data/app/assets/styles/primer_view_components.css.map +1 -1
- data/app/components/primer/alpha/action_list/divider.rb +2 -2
- data/app/components/primer/alpha/action_list/heading.html.erb +1 -1
- data/app/components/primer/alpha/action_list/heading.rb +10 -4
- data/app/components/primer/alpha/action_list/item.rb +3 -3
- data/app/components/primer/alpha/action_list.html.erb +6 -8
- data/app/components/primer/alpha/action_list.rb +5 -10
- data/app/components/primer/alpha/nav_list/{section.rb → group.rb} +5 -5
- data/app/components/primer/alpha/nav_list/item.html.erb +1 -1
- data/app/components/primer/alpha/nav_list/item.rb +15 -1
- data/app/components/primer/alpha/nav_list.d.ts +1 -0
- data/app/components/primer/alpha/nav_list.html.erb +8 -8
- data/app/components/primer/alpha/nav_list.js +21 -0
- data/app/components/primer/alpha/nav_list.rb +28 -32
- data/app/components/primer/alpha/nav_list.ts +23 -0
- data/app/components/primer/alpha/navigation/tab.rb +168 -0
- data/app/components/primer/alpha/overlay.rb +19 -6
- data/app/components/primer/alpha/tab_nav.rb +10 -3
- data/app/components/primer/alpha/tab_panels.rb +2 -2
- data/app/components/primer/alpha/underline_nav.css +1 -1
- data/app/components/primer/alpha/underline_nav.css.map +1 -1
- data/app/components/primer/alpha/underline_nav.pcss +1 -0
- data/app/components/primer/alpha/underline_nav.rb +2 -2
- data/app/components/primer/alpha/underline_panels.rb +2 -2
- data/app/components/primer/beta/button.html.erb +1 -1
- data/app/components/primer/beta/button.rb +2 -1
- data/app/components/primer/component.rb +34 -0
- data/app/components/primer/navigation/tab_component.rb +3 -157
- data/lib/primer/deprecations.yml +4 -0
- data/lib/primer/view_components/version.rb +1 -1
- data/lib/primer/yard/component_manifest.rb +2 -1
- data/lib/tasks/docs.rake +1 -1
- data/previews/primer/alpha/action_list_preview.rb +6 -14
- data/previews/primer/alpha/nav_list_preview/trailing_action.html.erb +19 -0
- data/previews/primer/alpha/nav_list_preview.rb +19 -30
- data/previews/primer/alpha/overlay_preview.rb +7 -2
- data/previews/primer/alpha/tab_nav_preview/with_extra.html.erb +8 -0
- data/previews/primer/alpha/tab_nav_preview.rb +5 -0
- data/previews/primer/alpha/tab_panels_preview/with_extra.html.erb +17 -0
- data/previews/primer/alpha/tab_panels_preview.rb +5 -0
- data/static/arguments.json +63 -7
- data/static/audited_at.json +2 -1
- data/static/constants.json +20 -8
- data/static/previews.json +10 -0
- data/static/statuses.json +3 -2
- metadata +8 -6
- data/app/components/primer/alpha/nav_list/section.html.erb +0 -3
- data/previews/primer/alpha/action_list_preview/heading.html.erb +0 -4
- /data/app/components/primer/{navigation/tab_component.html.erb → alpha/navigation/tab.html.erb} +0 -0
@@ -20,7 +20,8 @@ module Primer
|
|
20
20
|
# @param header_size [Symbol] select [medium, large]
|
21
21
|
# @param button_text [String] text
|
22
22
|
# @param body_text [String] text
|
23
|
-
|
23
|
+
# @param icon [Symbol] octicon
|
24
|
+
def playground(title: "Test Overlay", subtitle: nil, role: :dialog, size: :auto, padding: :normal, anchor_align: :center, anchor_offset: :normal, anchor_side: :outside_bottom, allow_out_of_bounds: false, visually_hide_title: false, header_size: :medium, button_text: "Show Overlay", body_text: "", icon: :none)
|
24
25
|
render(Primer::Alpha::Overlay.new(
|
25
26
|
title: title,
|
26
27
|
subtitle: subtitle,
|
@@ -34,7 +35,11 @@ module Primer
|
|
34
35
|
visually_hide_title: visually_hide_title,
|
35
36
|
)) do |d|
|
36
37
|
d.with_header(title: title, size: header_size)
|
37
|
-
|
38
|
+
if icon.present? and icon != :none
|
39
|
+
d.with_show_button(icon: icon, "aria-label": icon.to_s)
|
40
|
+
else
|
41
|
+
d.with_show_button { button_text }
|
42
|
+
end
|
38
43
|
d.with_body { body_text }
|
39
44
|
end
|
40
45
|
end
|
@@ -0,0 +1,8 @@
|
|
1
|
+
<%= render(Primer::Alpha::TabNav.new(label: "With icons and counters")) do |component| %>
|
2
|
+
<% component.with_tab(selected: true, href: "#") { "Tab 1" } %>
|
3
|
+
<% component.with_tab(href: "#") { "Tab 2" } %>
|
4
|
+
<% component.with_tab(href: "#") { "Tab 3" } %>
|
5
|
+
<% component.with_extra(align: align) do %>
|
6
|
+
<%= render(Primer::Beta::Button.new) { "Extra Button" } %>
|
7
|
+
<% end %>
|
8
|
+
<% end %>
|
@@ -0,0 +1,17 @@
|
|
1
|
+
<%= render(Primer::Alpha::TabPanels.new(label: "label")) do |component| %>
|
2
|
+
<% component.with_tab(selected: true, id: "tab-1") do |tab| %>
|
3
|
+
<% tab.with_panel { "Panel 1" } %>
|
4
|
+
<% tab.with_text { "Tab 1" } %>
|
5
|
+
<% end %>
|
6
|
+
<% component.with_tab(id: "tab-2") do |tab| %>
|
7
|
+
<% tab.with_panel { "Panel 2" } %>
|
8
|
+
<% tab.with_text { "Tab 2" } %>
|
9
|
+
<% end %>
|
10
|
+
<% component.with_tab(id: "tab-3") do |tab| %>
|
11
|
+
<% tab.with_panel { "Panel 3" } %>
|
12
|
+
<% tab.with_text { "Tab 3" } %>
|
13
|
+
<% end %>
|
14
|
+
<% component.with_extra(align: align) do %>
|
15
|
+
<%= render(Primer::Beta::Button.new) { "Extra Button" } %>
|
16
|
+
<% end %>
|
17
|
+
<% end %>
|
data/static/arguments.json
CHANGED
@@ -1445,7 +1445,7 @@
|
|
1445
1445
|
},
|
1446
1446
|
{
|
1447
1447
|
"component": "Navigation::Tab",
|
1448
|
-
"status": "
|
1448
|
+
"status": "deprecated",
|
1449
1449
|
"source": "https://github.com/primer/view_components/tree/main/app/components/primer/navigation/tab_component.rb",
|
1450
1450
|
"lookbook": "https://primer.style/view-components/lookbook/inspect/primer/navigation/tab/default/",
|
1451
1451
|
"parameters": [
|
@@ -1493,6 +1493,56 @@
|
|
1493
1493
|
}
|
1494
1494
|
]
|
1495
1495
|
},
|
1496
|
+
{
|
1497
|
+
"component": "Navigation::Tab",
|
1498
|
+
"status": "alpha",
|
1499
|
+
"source": "https://github.com/primer/view_components/tree/main/app/components/primer/alpha/navigation/tab.rb",
|
1500
|
+
"lookbook": "https://primer.style/view-components/lookbook/inspect/primer/alpha/navigation/tab/default/",
|
1501
|
+
"parameters": [
|
1502
|
+
{
|
1503
|
+
"name": "list",
|
1504
|
+
"type": "Boolean",
|
1505
|
+
"default": "`false`",
|
1506
|
+
"description": "Whether the Tab is an item in a `<ul>` list."
|
1507
|
+
},
|
1508
|
+
{
|
1509
|
+
"name": "selected",
|
1510
|
+
"type": "Boolean",
|
1511
|
+
"default": "`false`",
|
1512
|
+
"description": "Whether the Tab is selected or not."
|
1513
|
+
},
|
1514
|
+
{
|
1515
|
+
"name": "with_panel",
|
1516
|
+
"type": "Boolean",
|
1517
|
+
"default": "`false`",
|
1518
|
+
"description": "Whether the Tab has an associated panel."
|
1519
|
+
},
|
1520
|
+
{
|
1521
|
+
"name": "panel_id",
|
1522
|
+
"type": "String",
|
1523
|
+
"default": "`\"\"`",
|
1524
|
+
"description": "Only applies if `with_panel` is `true`. Unique id of panel."
|
1525
|
+
},
|
1526
|
+
{
|
1527
|
+
"name": "icon_classes",
|
1528
|
+
"type": "Boolean",
|
1529
|
+
"default": "`\"\"`",
|
1530
|
+
"description": "Classes that must always be applied to icons."
|
1531
|
+
},
|
1532
|
+
{
|
1533
|
+
"name": "wrapper_arguments",
|
1534
|
+
"type": "Hash",
|
1535
|
+
"default": "`{}`",
|
1536
|
+
"description": "[System arguments](/system-arguments) to be used in the `<li>` wrapper when the tab is an item in a list."
|
1537
|
+
},
|
1538
|
+
{
|
1539
|
+
"name": "system_arguments",
|
1540
|
+
"type": "Hash",
|
1541
|
+
"default": "N/A",
|
1542
|
+
"description": "[System arguments](/system-arguments)"
|
1543
|
+
}
|
1544
|
+
]
|
1545
|
+
},
|
1496
1546
|
{
|
1497
1547
|
"component": "Octicon",
|
1498
1548
|
"status": "beta",
|
@@ -2196,10 +2246,10 @@
|
|
2196
2246
|
]
|
2197
2247
|
},
|
2198
2248
|
{
|
2199
|
-
"component": "NavList::
|
2249
|
+
"component": "NavList::Group",
|
2200
2250
|
"status": "alpha",
|
2201
|
-
"source": "https://github.com/primer/view_components/tree/main/app/components/primer/alpha/nav_list/
|
2202
|
-
"lookbook": "https://primer.style/view-components/lookbook/inspect/primer/alpha/nav_list/
|
2251
|
+
"source": "https://github.com/primer/view_components/tree/main/app/components/primer/alpha/nav_list/group.rb",
|
2252
|
+
"lookbook": "https://primer.style/view-components/lookbook/inspect/primer/alpha/nav_list/group/default/",
|
2203
2253
|
"parameters": [
|
2204
2254
|
{
|
2205
2255
|
"name": "selected_item_id",
|
@@ -2291,6 +2341,12 @@
|
|
2291
2341
|
"default": "N/A",
|
2292
2342
|
"description": "Sub list title."
|
2293
2343
|
},
|
2344
|
+
{
|
2345
|
+
"name": "heading_level",
|
2346
|
+
"type": "Integer",
|
2347
|
+
"default": "`3`",
|
2348
|
+
"description": "Heading level. Level 2 results in an `<h2>` tag, level 3 an `<h3>` tag, etc."
|
2349
|
+
},
|
2294
2350
|
{
|
2295
2351
|
"name": "subtitle",
|
2296
2352
|
"type": "String",
|
@@ -2305,8 +2361,8 @@
|
|
2305
2361
|
},
|
2306
2362
|
{
|
2307
2363
|
"name": "tag",
|
2308
|
-
"type": "
|
2309
|
-
"default": "
|
2364
|
+
"type": "Integer",
|
2365
|
+
"default": "N/A",
|
2310
2366
|
"description": "Semantic tag for the heading."
|
2311
2367
|
},
|
2312
2368
|
{
|
@@ -2374,7 +2430,7 @@
|
|
2374
2430
|
{
|
2375
2431
|
"name": "role",
|
2376
2432
|
"type": "String",
|
2377
|
-
"default": "
|
2433
|
+
"default": "`nil`",
|
2378
2434
|
"description": "ARIA role describing the function of the item."
|
2379
2435
|
},
|
2380
2436
|
{
|
data/static/audited_at.json
CHANGED
@@ -28,8 +28,9 @@
|
|
28
28
|
"Primer::Alpha::Menu": "",
|
29
29
|
"Primer::Alpha::MultiInput": "",
|
30
30
|
"Primer::Alpha::NavList": "",
|
31
|
+
"Primer::Alpha::NavList::Group": "",
|
31
32
|
"Primer::Alpha::NavList::Item": "",
|
32
|
-
"Primer::Alpha::
|
33
|
+
"Primer::Alpha::Navigation::Tab": "",
|
33
34
|
"Primer::Alpha::OcticonSymbols": "",
|
34
35
|
"Primer::Alpha::Overlay": "",
|
35
36
|
"Primer::Alpha::Overlay::Body": "",
|
data/static/constants.json
CHANGED
@@ -27,6 +27,16 @@
|
|
27
27
|
},
|
28
28
|
"Primer::Alpha::ActionList::Heading": {
|
29
29
|
"DEFAULT_SCHEME": "subtle",
|
30
|
+
"HEADING_LEVELS": [
|
31
|
+
1,
|
32
|
+
2,
|
33
|
+
3,
|
34
|
+
4,
|
35
|
+
5,
|
36
|
+
6
|
37
|
+
],
|
38
|
+
"HEADING_MAX": 6,
|
39
|
+
"HEADING_MIN": 1,
|
30
40
|
"SCHEME_MAPPINGS": {
|
31
41
|
"subtle": null,
|
32
42
|
"filled": "ActionList-sectionDivider--filled"
|
@@ -326,12 +336,19 @@
|
|
326
336
|
"Primer::Alpha::MultiInput": {
|
327
337
|
},
|
328
338
|
"Primer::Alpha::NavList": {
|
329
|
-
"
|
330
|
-
"
|
339
|
+
"Group": "Primer::Alpha::NavList::Group",
|
340
|
+
"Item": "Primer::Alpha::NavList::Item"
|
341
|
+
},
|
342
|
+
"Primer::Alpha::NavList::Group": {
|
331
343
|
},
|
332
344
|
"Primer::Alpha::NavList::Item": {
|
333
345
|
},
|
334
|
-
"Primer::Alpha::
|
346
|
+
"Primer::Alpha::Navigation::Tab": {
|
347
|
+
"ARIA_CURRENT_OPTIONS_FOR_ANCHOR": [
|
348
|
+
true,
|
349
|
+
"page"
|
350
|
+
],
|
351
|
+
"DEFAULT_ARIA_CURRENT_FOR_ANCHOR": "page"
|
335
352
|
},
|
336
353
|
"Primer::Alpha::OcticonSymbols": {
|
337
354
|
},
|
@@ -1189,11 +1206,6 @@
|
|
1189
1206
|
"MAX_COL": 12
|
1190
1207
|
},
|
1191
1208
|
"Primer::Navigation::TabComponent": {
|
1192
|
-
"ARIA_CURRENT_OPTIONS_FOR_ANCHOR": [
|
1193
|
-
true,
|
1194
|
-
"page"
|
1195
|
-
],
|
1196
|
-
"DEFAULT_ARIA_CURRENT_FOR_ANCHOR": "page"
|
1197
1209
|
},
|
1198
1210
|
"Primer::Tooltip": {
|
1199
1211
|
"ALIGN_DEFAULT": "default",
|
data/static/previews.json
CHANGED
@@ -1557,6 +1557,11 @@
|
|
1557
1557
|
"inspect_path": "/lookbook/inspect/primer/alpha/tab_nav/with_icons_and_counters",
|
1558
1558
|
"preview_path": "/lookbook/preview/primer/alpha/tab_nav/with_icons_and_counters",
|
1559
1559
|
"name": "with_icons_and_counters"
|
1560
|
+
},
|
1561
|
+
{
|
1562
|
+
"inspect_path": "/lookbook/inspect/primer/alpha/tab_nav/with_extra",
|
1563
|
+
"preview_path": "/lookbook/preview/primer/alpha/tab_nav/with_extra",
|
1564
|
+
"name": "with_extra"
|
1560
1565
|
}
|
1561
1566
|
]
|
1562
1567
|
},
|
@@ -1573,6 +1578,11 @@
|
|
1573
1578
|
"inspect_path": "/lookbook/inspect/primer/alpha/tab_panels/default",
|
1574
1579
|
"preview_path": "/lookbook/preview/primer/alpha/tab_panels/default",
|
1575
1580
|
"name": "default"
|
1581
|
+
},
|
1582
|
+
{
|
1583
|
+
"inspect_path": "/lookbook/inspect/primer/alpha/tab_panels/with_extra",
|
1584
|
+
"preview_path": "/lookbook/preview/primer/alpha/tab_panels/with_extra",
|
1585
|
+
"name": "with_extra"
|
1576
1586
|
}
|
1577
1587
|
]
|
1578
1588
|
},
|
data/static/statuses.json
CHANGED
@@ -28,8 +28,9 @@
|
|
28
28
|
"Primer::Alpha::Menu": "alpha",
|
29
29
|
"Primer::Alpha::MultiInput": "alpha",
|
30
30
|
"Primer::Alpha::NavList": "alpha",
|
31
|
+
"Primer::Alpha::NavList::Group": "alpha",
|
31
32
|
"Primer::Alpha::NavList::Item": "alpha",
|
32
|
-
"Primer::Alpha::
|
33
|
+
"Primer::Alpha::Navigation::Tab": "alpha",
|
33
34
|
"Primer::Alpha::OcticonSymbols": "alpha",
|
34
35
|
"Primer::Alpha::Overlay": "alpha",
|
35
36
|
"Primer::Alpha::Overlay::Body": "alpha",
|
@@ -92,7 +93,7 @@
|
|
92
93
|
"Primer::Content": "stable",
|
93
94
|
"Primer::IconButton": "deprecated",
|
94
95
|
"Primer::LayoutComponent": "alpha",
|
95
|
-
"Primer::Navigation::TabComponent": "
|
96
|
+
"Primer::Navigation::TabComponent": "deprecated",
|
96
97
|
"Primer::Tooltip": "deprecated",
|
97
98
|
"Primer::Truncate": "beta"
|
98
99
|
}
|
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.1.
|
4
|
+
version: 0.1.1
|
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: 2023-
|
11
|
+
date: 2023-03-07 00:00:00.000000000 Z
|
12
12
|
dependencies:
|
13
13
|
- !ruby/object:Gem::Dependency
|
14
14
|
name: actionview
|
@@ -481,10 +481,11 @@ files:
|
|
481
481
|
- app/components/primer/alpha/nav_list.js
|
482
482
|
- app/components/primer/alpha/nav_list.rb
|
483
483
|
- app/components/primer/alpha/nav_list.ts
|
484
|
+
- app/components/primer/alpha/nav_list/group.rb
|
484
485
|
- app/components/primer/alpha/nav_list/item.html.erb
|
485
486
|
- app/components/primer/alpha/nav_list/item.rb
|
486
|
-
- app/components/primer/alpha/
|
487
|
-
- app/components/primer/alpha/
|
487
|
+
- app/components/primer/alpha/navigation/tab.html.erb
|
488
|
+
- app/components/primer/alpha/navigation/tab.rb
|
488
489
|
- app/components/primer/alpha/octicon_symbols.html.erb
|
489
490
|
- app/components/primer/alpha/octicon_symbols.rb
|
490
491
|
- app/components/primer/alpha/overlay.css
|
@@ -694,7 +695,6 @@ files:
|
|
694
695
|
- app/components/primer/icon_button.rb
|
695
696
|
- app/components/primer/layout_component.html.erb
|
696
697
|
- app/components/primer/layout_component.rb
|
697
|
-
- app/components/primer/navigation/tab_component.html.erb
|
698
698
|
- app/components/primer/navigation/tab_component.rb
|
699
699
|
- app/components/primer/primer.d.ts
|
700
700
|
- app/components/primer/primer.js
|
@@ -921,7 +921,6 @@ files:
|
|
921
921
|
- previews/pages/forms/08_validations.md.erb
|
922
922
|
- previews/pages/forms/09_compound_forms.md.erb
|
923
923
|
- previews/primer/alpha/action_list_preview.rb
|
924
|
-
- previews/primer/alpha/action_list_preview/heading.html.erb
|
925
924
|
- previews/primer/alpha/auto_complete_preview.rb
|
926
925
|
- previews/primer/alpha/banner_preview.rb
|
927
926
|
- previews/primer/alpha/banner_preview/with_action_button.html.erb
|
@@ -950,6 +949,7 @@ files:
|
|
950
949
|
- previews/primer/alpha/multi_input_preview.rb
|
951
950
|
- previews/primer/alpha/multi_input_preview/playground.html.erb
|
952
951
|
- previews/primer/alpha/nav_list_preview.rb
|
952
|
+
- previews/primer/alpha/nav_list_preview/trailing_action.html.erb
|
953
953
|
- previews/primer/alpha/overlay_preview.rb
|
954
954
|
- previews/primer/alpha/overlay_preview/middle_of_page.html.erb
|
955
955
|
- previews/primer/alpha/radio_button_group_preview.rb
|
@@ -959,7 +959,9 @@ files:
|
|
959
959
|
- previews/primer/alpha/segmented_control_preview/with_subhead_actions.html.erb
|
960
960
|
- previews/primer/alpha/select_preview.rb
|
961
961
|
- previews/primer/alpha/tab_nav_preview.rb
|
962
|
+
- previews/primer/alpha/tab_nav_preview/with_extra.html.erb
|
962
963
|
- previews/primer/alpha/tab_panels_preview.rb
|
964
|
+
- previews/primer/alpha/tab_panels_preview/with_extra.html.erb
|
963
965
|
- previews/primer/alpha/text_area_preview.rb
|
964
966
|
- previews/primer/alpha/text_field_preview.rb
|
965
967
|
- previews/primer/alpha/toggle_switch_preview.rb
|
/data/app/components/primer/{navigation/tab_component.html.erb → alpha/navigation/tab.html.erb}
RENAMED
File without changes
|