primer_view_components 0.1.0 → 0.1.1

data/previews/primer/alpha/overlay_preview.rb

@@ -20,7 +20,8 @@ module Primer
       # @param header_size [Symbol] select [medium, large]
       # @param button_text [String] text
       # @param body_text [String] text
-      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: "")
+      # @param icon [Symbol] octicon
+      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)
         render(Primer::Alpha::Overlay.new(
                  title: title,
                  subtitle: subtitle,
@@ -34,7 +35,11 @@ module Primer
                  visually_hide_title: visually_hide_title,
                )) do |d|
           d.with_header(title: title, size: header_size)
-          d.with_show_button { button_text }
+          if icon.present? and icon != :none
+            d.with_show_button(icon: icon, "aria-label": icon.to_s)
+          else
+            d.with_show_button { button_text }
+          end
           d.with_body { body_text }
         end
       end

data/previews/primer/alpha/tab_nav_preview/with_extra.html.erb

@@ -0,0 +1,8 @@
+<%= render(Primer::Alpha::TabNav.new(label: "With icons and counters")) do |component| %>
+  <% component.with_tab(selected: true, href: "#") { "Tab 1" } %>
+  <% component.with_tab(href: "#") { "Tab 2" } %>
+  <% component.with_tab(href: "#") { "Tab 3" } %>
+  <% component.with_extra(align: align) do %>
+    <%= render(Primer::Beta::Button.new) { "Extra Button" } %>
+  <% end %>
+<% end %>

data/previews/primer/alpha/tab_nav_preview.rb

@@ -50,6 +50,11 @@ module Primer
           end
         end
       end
+
+      # @param align [Symbol] select [left, right]
+      def with_extra(align: :right)
+        render_with_template(locals: { align: align })
+      end
     end
   end
 end

data/previews/primer/alpha/tab_panels_preview/with_extra.html.erb

@@ -0,0 +1,17 @@
+<%= render(Primer::Alpha::TabPanels.new(label: "label")) do |component| %>
+  <% component.with_tab(selected: true, id: "tab-1") do |tab| %>
+    <% tab.with_panel { "Panel 1" } %>
+    <% tab.with_text { "Tab 1" } %>
+  <% end %>
+  <% component.with_tab(id: "tab-2") do |tab| %>
+    <% tab.with_panel { "Panel 2" } %>
+    <% tab.with_text { "Tab 2" } %>
+  <% end %>
+  <% component.with_tab(id: "tab-3") do |tab| %>
+    <% tab.with_panel { "Panel 3" } %>
+    <% tab.with_text { "Tab 3" } %>
+  <% end %>
+  <% component.with_extra(align: align) do %>
+    <%= render(Primer::Beta::Button.new) { "Extra Button" } %>
+  <% end %>
+<% end %>

data/previews/primer/alpha/tab_panels_preview.rb

@@ -33,6 +33,11 @@ module Primer
           end
         end
       end
+
+      # @param align [Symbol] select [left, right]
+      def with_extra(align: :right)
+        render_with_template(locals: { align: align })
+      end
     end
   end
 end

data/static/arguments.json

@@ -1445,7 +1445,7 @@
   },
   {
     "component": "Navigation::Tab",
-    "status": "alpha",
+    "status": "deprecated",
     "source": "https://github.com/primer/view_components/tree/main/app/components/primer/navigation/tab_component.rb",
     "lookbook": "https://primer.style/view-components/lookbook/inspect/primer/navigation/tab/default/",
     "parameters": [
@@ -1493,6 +1493,56 @@
       }
     ]
   },
+  {
+    "component": "Navigation::Tab",
+    "status": "alpha",
+    "source": "https://github.com/primer/view_components/tree/main/app/components/primer/alpha/navigation/tab.rb",
+    "lookbook": "https://primer.style/view-components/lookbook/inspect/primer/alpha/navigation/tab/default/",
+    "parameters": [
+      {
+        "name": "list",
+        "type": "Boolean",
+        "default": "`false`",
+        "description": "Whether the Tab is an item in a `<ul>` list."
+      },
+      {
+        "name": "selected",
+        "type": "Boolean",
+        "default": "`false`",
+        "description": "Whether the Tab is selected or not."
+      },
+      {
+        "name": "with_panel",
+        "type": "Boolean",
+        "default": "`false`",
+        "description": "Whether the Tab has an associated panel."
+      },
+      {
+        "name": "panel_id",
+        "type": "String",
+        "default": "`\"\"`",
+        "description": "Only applies if `with_panel` is `true`. Unique id of panel."
+      },
+      {
+        "name": "icon_classes",
+        "type": "Boolean",
+        "default": "`\"\"`",
+        "description": "Classes that must always be applied to icons."
+      },
+      {
+        "name": "wrapper_arguments",
+        "type": "Hash",
+        "default": "`{}`",
+        "description": "[System arguments](/system-arguments) to be used in the `<li>` wrapper when the tab is an item in a list."
+      },
+      {
+        "name": "system_arguments",
+        "type": "Hash",
+        "default": "N/A",
+        "description": "[System arguments](/system-arguments)"
+      }
+    ]
+  },
   {
     "component": "Octicon",
     "status": "beta",
@@ -2196,10 +2246,10 @@
     ]
   },
   {
-    "component": "NavList::Section",
+    "component": "NavList::Group",
     "status": "alpha",
-    "source": "https://github.com/primer/view_components/tree/main/app/components/primer/alpha/nav_list/section.rb",
-    "lookbook": "https://primer.style/view-components/lookbook/inspect/primer/alpha/nav_list/section/default/",
+    "source": "https://github.com/primer/view_components/tree/main/app/components/primer/alpha/nav_list/group.rb",
+    "lookbook": "https://primer.style/view-components/lookbook/inspect/primer/alpha/nav_list/group/default/",
     "parameters": [
       {
         "name": "selected_item_id",
@@ -2291,6 +2341,12 @@
         "default": "N/A",
         "description": "Sub list title."
       },
+      {
+        "name": "heading_level",
+        "type": "Integer",
+        "default": "`3`",
+        "description": "Heading level. Level 2 results in an `<h2>` tag, level 3 an `<h3>` tag, etc."
+      },
       {
         "name": "subtitle",
         "type": "String",
@@ -2305,8 +2361,8 @@
       },
       {
         "name": "tag",
-        "type": "Symbol",
-        "default": "`:h3`",
+        "type": "Integer",
+        "default": "N/A",
         "description": "Semantic tag for the heading."
       },
       {
@@ -2374,7 +2430,7 @@
       {
         "name": "role",
         "type": "String",
-        "default": "`:listitem`",
+        "default": "`nil`",
         "description": "ARIA role describing the function of the item."
       },
       {

data/static/audited_at.json

@@ -28,8 +28,9 @@
   "Primer::Alpha::Menu": "",
   "Primer::Alpha::MultiInput": "",
   "Primer::Alpha::NavList": "",
+  "Primer::Alpha::NavList::Group": "",
   "Primer::Alpha::NavList::Item": "",
-  "Primer::Alpha::NavList::Section": "",
+  "Primer::Alpha::Navigation::Tab": "",
   "Primer::Alpha::OcticonSymbols": "",
   "Primer::Alpha::Overlay": "",
   "Primer::Alpha::Overlay::Body": "",

data/static/constants.json

@@ -27,6 +27,16 @@
   },
   "Primer::Alpha::ActionList::Heading": {
     "DEFAULT_SCHEME": "subtle",
+    "HEADING_LEVELS": [
+      1,
+      2,
+      3,
+      4,
+      5,
+      6
+    ],
+    "HEADING_MAX": 6,
+    "HEADING_MIN": 1,
     "SCHEME_MAPPINGS": {
       "subtle": null,
       "filled": "ActionList-sectionDivider--filled"
@@ -326,12 +336,19 @@
   "Primer::Alpha::MultiInput": {
   },
   "Primer::Alpha::NavList": {
-    "Item": "Primer::Alpha::NavList::Item",
-    "Section": "Primer::Alpha::NavList::Section"
+    "Group": "Primer::Alpha::NavList::Group",
+    "Item": "Primer::Alpha::NavList::Item"
+  },
+  "Primer::Alpha::NavList::Group": {
   },
   "Primer::Alpha::NavList::Item": {
   },
-  "Primer::Alpha::NavList::Section": {
+  "Primer::Alpha::Navigation::Tab": {
+    "ARIA_CURRENT_OPTIONS_FOR_ANCHOR": [
+      true,
+      "page"
+    ],
+    "DEFAULT_ARIA_CURRENT_FOR_ANCHOR": "page"
   },
   "Primer::Alpha::OcticonSymbols": {
   },
@@ -1189,11 +1206,6 @@
     "MAX_COL": 12
   },
   "Primer::Navigation::TabComponent": {
-    "ARIA_CURRENT_OPTIONS_FOR_ANCHOR": [
-      true,
-      "page"
-    ],
-    "DEFAULT_ARIA_CURRENT_FOR_ANCHOR": "page"
   },
   "Primer::Tooltip": {
     "ALIGN_DEFAULT": "default",

data/static/previews.json

@@ -1557,6 +1557,11 @@
         "inspect_path": "/lookbook/inspect/primer/alpha/tab_nav/with_icons_and_counters",
         "preview_path": "/lookbook/preview/primer/alpha/tab_nav/with_icons_and_counters",
         "name": "with_icons_and_counters"
+      },
+      {
+        "inspect_path": "/lookbook/inspect/primer/alpha/tab_nav/with_extra",
+        "preview_path": "/lookbook/preview/primer/alpha/tab_nav/with_extra",
+        "name": "with_extra"
       }
     ]
   },
@@ -1573,6 +1578,11 @@
         "inspect_path": "/lookbook/inspect/primer/alpha/tab_panels/default",
         "preview_path": "/lookbook/preview/primer/alpha/tab_panels/default",
         "name": "default"
+      },
+      {
+        "inspect_path": "/lookbook/inspect/primer/alpha/tab_panels/with_extra",
+        "preview_path": "/lookbook/preview/primer/alpha/tab_panels/with_extra",
+        "name": "with_extra"
       }
     ]
   },

data/static/statuses.json

@@ -28,8 +28,9 @@
   "Primer::Alpha::Menu": "alpha",
   "Primer::Alpha::MultiInput": "alpha",
   "Primer::Alpha::NavList": "alpha",
+  "Primer::Alpha::NavList::Group": "alpha",
   "Primer::Alpha::NavList::Item": "alpha",
-  "Primer::Alpha::NavList::Section": "alpha",
+  "Primer::Alpha::Navigation::Tab": "alpha",
   "Primer::Alpha::OcticonSymbols": "alpha",
   "Primer::Alpha::Overlay": "alpha",
   "Primer::Alpha::Overlay::Body": "alpha",
@@ -92,7 +93,7 @@
   "Primer::Content": "stable",
   "Primer::IconButton": "deprecated",
   "Primer::LayoutComponent": "alpha",
-  "Primer::Navigation::TabComponent": "alpha",
+  "Primer::Navigation::TabComponent": "deprecated",
   "Primer::Tooltip": "deprecated",
   "Primer::Truncate": "beta"
 }

metadata

@@ -1,14 +1,14 @@
 --- !ruby/object:Gem::Specification
 name: primer_view_components
 version: !ruby/object:Gem::Version
-  version: 0.1.0
+  version: 0.1.1
 platform: ruby
 authors:
 - GitHub Open Source
 autorequire: 
 bindir: bin
 cert_chain: []
-date: 2023-02-28 00:00:00.000000000 Z
+date: 2023-03-07 00:00:00.000000000 Z
 dependencies:
 - !ruby/object:Gem::Dependency
   name: actionview
@@ -481,10 +481,11 @@ files:
 - app/components/primer/alpha/nav_list.js
 - app/components/primer/alpha/nav_list.rb
 - app/components/primer/alpha/nav_list.ts
+- app/components/primer/alpha/nav_list/group.rb
 - app/components/primer/alpha/nav_list/item.html.erb
 - app/components/primer/alpha/nav_list/item.rb
-- app/components/primer/alpha/nav_list/section.html.erb
-- app/components/primer/alpha/nav_list/section.rb
+- app/components/primer/alpha/navigation/tab.html.erb
+- app/components/primer/alpha/navigation/tab.rb
 - app/components/primer/alpha/octicon_symbols.html.erb
 - app/components/primer/alpha/octicon_symbols.rb
 - app/components/primer/alpha/overlay.css
@@ -694,7 +695,6 @@ files:
 - app/components/primer/icon_button.rb
 - app/components/primer/layout_component.html.erb
 - app/components/primer/layout_component.rb
-- app/components/primer/navigation/tab_component.html.erb
 - app/components/primer/navigation/tab_component.rb
 - app/components/primer/primer.d.ts
 - app/components/primer/primer.js
@@ -921,7 +921,6 @@ files:
 - previews/pages/forms/08_validations.md.erb
 - previews/pages/forms/09_compound_forms.md.erb
 - previews/primer/alpha/action_list_preview.rb
-- previews/primer/alpha/action_list_preview/heading.html.erb
 - previews/primer/alpha/auto_complete_preview.rb
 - previews/primer/alpha/banner_preview.rb
 - previews/primer/alpha/banner_preview/with_action_button.html.erb
@@ -950,6 +949,7 @@ files:
 - previews/primer/alpha/multi_input_preview.rb
 - previews/primer/alpha/multi_input_preview/playground.html.erb
 - previews/primer/alpha/nav_list_preview.rb
+- previews/primer/alpha/nav_list_preview/trailing_action.html.erb
 - previews/primer/alpha/overlay_preview.rb
 - previews/primer/alpha/overlay_preview/middle_of_page.html.erb
 - previews/primer/alpha/radio_button_group_preview.rb
@@ -959,7 +959,9 @@ files:
 - previews/primer/alpha/segmented_control_preview/with_subhead_actions.html.erb
 - previews/primer/alpha/select_preview.rb
 - previews/primer/alpha/tab_nav_preview.rb
+- previews/primer/alpha/tab_nav_preview/with_extra.html.erb
 - previews/primer/alpha/tab_panels_preview.rb
+- previews/primer/alpha/tab_panels_preview/with_extra.html.erb
 - previews/primer/alpha/text_area_preview.rb
 - previews/primer/alpha/text_field_preview.rb
 - previews/primer/alpha/toggle_switch_preview.rb

data/app/components/primer/alpha/nav_list/section.html.erb

@@ -1,3 +0,0 @@
-<nav-list>
-  <%= render_parent %>
-</nav-list>

data/previews/primer/alpha/action_list_preview/heading.html.erb

@@ -1,4 +0,0 @@
-<%# this <ul> is necessary here to make axe happy %>
-<ul>
-  <%= render(Primer::Alpha::ActionList::Heading.new(scheme: scheme, list_id: list_id, title: title, subtitle: subtitle)) %>
-</ul>