openproject-primer_view_components 0.29.0 → 0.29.1

data/app/components/primer/open_project/page_header.css

@@ -1 +1 @@
-.PageHeader{border-bottom:var(--borderWidth-thin) solid var(--borderColor-muted);display:flex;flex-flow:column;margin-bottom:var(--stack-gap-normal);padding-bottom:var(--stack-padding-condensed)}.PageHeader-contextBar{margin-bottom:var(--base-size-8)}.PageHeader-contextBar,.PageHeader-titleBar{align-items:center;display:flex;flex-flow:row;justify-content:flex-end}.PageHeader-titleBar{margin-bottom:var(--space-xsmall)}.PageHeader-title{flex:1 1 auto;font-size:var(--text-title-size-medium);font-weight:var(--base-text-weight-normal)}.PageHeader-title--large{font-size:var(--text-title-size-large)}.PageHeader-description{color:var(--fgColor-muted);flex:1 100%;font-size:var(--text-body-size-medium)}.PageHeader-actions{align-items:center;display:flex;justify-content:flex-end}@media (max-width:543.98px){.PageHeader--singleAction .PageHeader-action{display:flex!important;position:absolute;top:10px}}.PageHeader-breadcrumbs{display:block;width:100%}.PageHeader-leadingAction{margin-right:var(--base-size-4);margin-top:2px}.PageHeader-parentLink{flex:1 1 auto}
+.PageHeader{border-bottom:var(--borderWidth-thin) solid var(--borderColor-muted);display:flex;flex-flow:column;margin-bottom:var(--stack-gap-normal);padding-bottom:var(--stack-padding-condensed)}.PageHeader-contextBar{margin-bottom:var(--base-size-8)}.PageHeader-contextBar,.PageHeader-titleBar{align-items:center;display:flex;flex-flow:row;justify-content:flex-end}.PageHeader-titleBar{margin-bottom:var(--space-xsmall)}.PageHeader-title{flex:1 1 auto;font-size:var(--text-title-size-medium);font-weight:var(--base-text-weight-normal)}.PageHeader-title--large{font-size:var(--text-title-size-large)}.PageHeader-description{color:var(--fgColor-muted);flex:1 100%;font-size:var(--text-body-size-medium)}.PageHeader-actions{align-items:center;display:flex;justify-content:flex-end}.PageHeader-breadcrumbs{display:block;width:100%}.PageHeader-leadingAction{margin-right:var(--base-size-4);margin-top:2px}.PageHeader-parentLink{flex:1 1 auto}

data/app/components/primer/open_project/page_header.css.json

@@ -8,7 +8,6 @@
     ".PageHeader-title--large",
     ".PageHeader-description",
     ".PageHeader-actions",
-    ".PageHeader--singleAction .PageHeader-action",
     ".PageHeader-breadcrumbs",
     ".PageHeader-leadingAction",
     ".PageHeader-parentLink"

data/app/components/primer/open_project/page_header.css.map

@@ -1 +1 @@
-{"version":3,"sources":["page_header.pcss"],"names":[],"mappings":"AAEA,YAIE,oEAAqE,CAHrE,YAAa,CAIb,gBAAiB,CAFjB,qCAAsC,CADtC,6CAIF,CAEA,uBAKE,gCACF,CAEA,4CAJE,kBAAmB,CAHnB,YAAa,CACb,aAAc,CACd,wBAWF,CANA,qBAKE,iCACF,CAEA,kBAGE,aAAc,CAFd,uCAAwC,CACxC,0CAEF,CAEA,yBACE,sCACF,CAGA,wBAEE,0BAA2B,CAC3B,WAAY,CAFZ,sCAGF,CAEA,oBAGE,kBAAmB,CADnB,YAAa,CADb,wBAGF,CAGE,4BADF,6CAMI,sBAAwB,CAJxB,iBAAkB,CAClB,QAKJ,CADE,CAGF,wBACE,aAAc,CACd,UACF,CAEA,0BAEE,+BAAgC,CADhC,cAEF,CAEA,uBACE,aACF","file":"page_header.css","sourcesContent":["/* OP PageHeader */\n\n.PageHeader {\n  display: flex;\n  padding-bottom: var(--stack-padding-condensed);\n  margin-bottom: var(--stack-gap-normal);\n  border-bottom: var(--borderWidth-thin) solid var(--borderColor-muted);\n  flex-flow: column;\n}\n\n.PageHeader-contextBar {\n  display: flex;\n  flex-flow: row;\n  justify-content: flex-end;\n  align-items: center;\n  margin-bottom: var(--base-size-8);\n}\n\n.PageHeader-titleBar {\n  display: flex;\n  flex-flow: row;\n  justify-content: flex-end;\n  align-items: center; /* Keep back button vertically aligned. */\n  margin-bottom: var(--space-xsmall);\n}\n\n.PageHeader-title {\n  font-size: var(--text-title-size-medium);\n  font-weight: var(--base-text-weight-normal);\n  flex: 1 1 auto;\n}\n\n.PageHeader-title--large {\n  font-size: var(--text-title-size-large);\n}\n\n/* One-liner of supporting text */\n.PageHeader-description {\n  font-size: var(--text-body-size-medium);\n  color: var(--fgColor-muted);\n  flex: 1 100%;\n}\n\n.PageHeader-actions {\n  justify-content: flex-end;\n  display: flex;\n  align-items: center;\n}\n\n.PageHeader--singleAction .PageHeader-action {\n  @media (max-width: 543.98px) {\n    position: absolute;\n    top: 10px;\n\n    /* Normally, the actions are hidden on mobile, except for this special case of a single action */\n    display: flex !important;\n  }\n}\n\n.PageHeader-breadcrumbs {\n  display: block;\n  width: 100%;\n}\n\n.PageHeader-leadingAction {\n  margin-top: 2px; /* to center align with label */\n  margin-right: var(--base-size-4);\n}\n\n.PageHeader-parentLink {\n  flex: 1 1 auto;\n}\n"]}
+{"version":3,"sources":["page_header.pcss"],"names":[],"mappings":"AAEA,YAIE,oEAAqE,CAHrE,YAAa,CAIb,gBAAiB,CAFjB,qCAAsC,CADtC,6CAIF,CAEA,uBAKE,gCACF,CAEA,4CAJE,kBAAmB,CAHnB,YAAa,CACb,aAAc,CACd,wBAWF,CANA,qBAKE,iCACF,CAEA,kBAGE,aAAc,CAFd,uCAAwC,CACxC,0CAEF,CAEA,yBACE,sCACF,CAGA,wBAEE,0BAA2B,CAC3B,WAAY,CAFZ,sCAGF,CAEA,oBAGE,kBAAmB,CADnB,YAAa,CADb,wBAGF,CAEA,wBACE,aAAc,CACd,UACF,CAEA,0BAEE,+BAAgC,CADhC,cAEF,CAEA,uBACE,aACF","file":"page_header.css","sourcesContent":["/* OP PageHeader */\n\n.PageHeader {\n  display: flex;\n  padding-bottom: var(--stack-padding-condensed);\n  margin-bottom: var(--stack-gap-normal);\n  border-bottom: var(--borderWidth-thin) solid var(--borderColor-muted);\n  flex-flow: column;\n}\n\n.PageHeader-contextBar {\n  display: flex;\n  flex-flow: row;\n  justify-content: flex-end;\n  align-items: center;\n  margin-bottom: var(--base-size-8);\n}\n\n.PageHeader-titleBar {\n  display: flex;\n  flex-flow: row;\n  justify-content: flex-end;\n  align-items: center; /* Keep back button vertically aligned. */\n  margin-bottom: var(--space-xsmall);\n}\n\n.PageHeader-title {\n  font-size: var(--text-title-size-medium);\n  font-weight: var(--base-text-weight-normal);\n  flex: 1 1 auto;\n}\n\n.PageHeader-title--large {\n  font-size: var(--text-title-size-large);\n}\n\n/* One-liner of supporting text */\n.PageHeader-description {\n  font-size: var(--text-body-size-medium);\n  color: var(--fgColor-muted);\n  flex: 1 100%;\n}\n\n.PageHeader-actions {\n  justify-content: flex-end;\n  display: flex;\n  align-items: center;\n}\n\n.PageHeader-breadcrumbs {\n  display: block;\n  width: 100%;\n}\n\n.PageHeader-leadingAction {\n  margin-top: 2px; /* to center align with label */\n  margin-right: var(--base-size-4);\n}\n\n.PageHeader-parentLink {\n  flex: 1 1 auto;\n}\n"]}

data/app/components/primer/open_project/page_header.html.erb

@@ -8,6 +8,8 @@
           <% menu.with_show_button(icon: :"kebab-horizontal", size: :small, "aria-label": @mobile_menu_label) %>
           <% @desktop_menu_block.call(menu) unless @desktop_menu_block.nil? %>
         <% end %>
+      <% elsif actions.length == 1 && @mobile_action.present? %>
+        <%= render(@mobile_action) { |el| @mobile_action_block.call(el) unless @mobile_action_block.nil?} %>
       <% end %>
     </div>
   <% end %>

data/app/components/primer/open_project/page_header.pcss

@@ -47,16 +47,6 @@
   align-items: center;
 }
 
-.PageHeader--singleAction .PageHeader-action {
-  @media (max-width: 543.98px) {
-    position: absolute;
-    top: 10px;
-
-    /* Normally, the actions are hidden on mobile, except for this special case of a single action */
-    display: flex !important;
-  }
-}
-
 .PageHeader-breadcrumbs {
   display: block;
   width: 100%;

data/app/components/primer/open_project/page_header.rb

@@ -21,7 +21,7 @@ module Primer
       ].freeze
 
       DEFAULT_ACTION_SCHEME = :default
-      MORE_MENU_DISPLAY = [:flex, :none].freeze
+      MOBILE_ACTIONS_DISPLAY = [:flex, :none].freeze
 
       DEFAULT_LEADING_ACTION_DISPLAY = [:none, :flex].freeze
       DEFAULT_BREADCRUMBS_DISPLAY = [:none, :flex].freeze
@@ -58,32 +58,37 @@ module Primer
       #
       # @param system_arguments [Hash] <%= link_to_system_arguments_docs %>
       renders_many :actions, types: {
-        icon_button: lambda { |icon:, mobile_icon:, label:, scheme: DEFAULT_ACTION_SCHEME, **system_arguments|
+        icon_button: lambda { |icon:, mobile_icon:, label:, scheme: DEFAULT_ACTION_SCHEME, **system_arguments, &block|
           deny_tag_argument(**system_arguments)
 
-          system_arguments = set_action_arguments(system_arguments, scheme: scheme, button_action: true)
+          system_arguments[:icon] = icon
+          system_arguments[:"aria-label"] ||= label
+          system_arguments = set_action_arguments(system_arguments, scheme: scheme)
 
-          add_option_to_mobile_menu(system_arguments, mobile_icon, label, scheme)
+          component = Primer::Beta::IconButton
+          create_mobile_alternatives(component, mobile_icon, label, scheme, **system_arguments, &block)
 
-          Primer::Beta::IconButton.new(icon: icon, "aria-label": label, **system_arguments)
+          component.new(**system_arguments)
         },
-        button: lambda { |mobile_icon:, mobile_label:, scheme: DEFAULT_ACTION_SCHEME, **system_arguments|
+        button: lambda { |mobile_icon:, mobile_label:, scheme: DEFAULT_ACTION_SCHEME, **system_arguments, &block|
           deny_tag_argument(**system_arguments)
 
-          system_arguments = set_action_arguments(system_arguments, scheme: scheme, button_action: true)
+          system_arguments = set_action_arguments(system_arguments, scheme: scheme)
 
-          add_option_to_mobile_menu(system_arguments, mobile_icon, mobile_label, scheme)
+          component = Primer::Beta::Button
+          create_mobile_alternatives(component, mobile_icon, mobile_label, scheme, **system_arguments, &block)
 
-          Primer::Beta::Button.new(**system_arguments)
+          component.new(**system_arguments)
         },
-        zen_mode_button: lambda { |mobile_icon: Primer::OpenProject::ZenModeButton::ZEN_MODE_BUTTON_ICON, mobile_label: Primer::OpenProject::ZenModeButton::ZEN_MODE_BUTTON_LABEL, **system_arguments|
+        zen_mode_button: lambda { |mobile_icon: Primer::OpenProject::ZenModeButton::ZEN_MODE_BUTTON_ICON, mobile_label: Primer::OpenProject::ZenModeButton::ZEN_MODE_BUTTON_LABEL, **system_arguments, &block|
           deny_tag_argument(**system_arguments)
 
-          system_arguments = set_action_arguments(system_arguments, scheme: DEFAULT_ACTION_SCHEME, button_action: true)
+          system_arguments = set_action_arguments(system_arguments, scheme: DEFAULT_ACTION_SCHEME)
 
-          add_option_to_mobile_menu(system_arguments, mobile_icon, mobile_label, DEFAULT_ACTION_SCHEME)
+          component = Primer::OpenProject::ZenModeButton
+          create_mobile_alternatives(component, mobile_icon, mobile_label, DEFAULT_ACTION_SCHEME, **system_arguments, &block)
 
-          Primer::OpenProject::ZenModeButton.new(**system_arguments)
+          component.new(**system_arguments)
         },
 
         link: lambda { |mobile_icon:, mobile_label:, scheme: DEFAULT_ACTION_SCHEME, **system_arguments|
@@ -109,29 +114,31 @@ module Primer
           renders: lambda { |**system_arguments, &block|
             deny_tag_argument(**system_arguments)
 
-            system_arguments[:menu_arguments] = set_action_arguments(system_arguments[:menu_arguments])
             system_arguments[:button_arguments] ||= {}
-            system_arguments[:button_arguments][:data] ||= {}
-            system_arguments[:button_arguments][:data][:targets] = "page-header.actionItems"
+            system_arguments[:button_arguments] = set_action_arguments(system_arguments[:button_arguments])
 
             # Add the options individually to the mobile menu in the template
             @desktop_menu_block = block
 
-            Primer::OpenProject::PageHeader::Menu.new(**system_arguments)
+            component = Primer::OpenProject::PageHeader::Menu
+            create_mobile_single_action(component, **system_arguments, &block)
+
+            component.new(**system_arguments)
           },
         },
         dialog: {
-          renders: lambda { |mobile_icon:, mobile_label:, **system_arguments|
+          renders: lambda { |mobile_icon:, mobile_label:, **system_arguments, &block|
             deny_tag_argument(**system_arguments)
 
             # The id will be automatically calculated for the trigger button, so we have to behave the same, for the mobile click to work
             system_arguments[:button_arguments] ||= {}
             system_arguments[:button_arguments][:id] = "dialog-show-#{system_arguments[:dialog_arguments][:id]}"
-            system_arguments[:button_arguments] = set_action_arguments(system_arguments[:button_arguments], button_action: true)
+            system_arguments[:button_arguments] = set_action_arguments(system_arguments[:button_arguments])
 
-            add_option_to_mobile_menu(system_arguments[:button_arguments], mobile_icon, mobile_label, :default)
+            component = Primer::OpenProject::PageHeader::Dialog
+            create_mobile_alternatives(component, mobile_icon, mobile_label, :default, **system_arguments, &block)
 
-            Primer::OpenProject::PageHeader::Dialog.new(**system_arguments)
+            component.new(**system_arguments)
           },
         },
       }
@@ -212,7 +219,7 @@ module Primer
           )
 
         @mobile_action_menu = Primer::Alpha::ActionMenu.new(
-          display: MORE_MENU_DISPLAY,
+          display: MOBILE_ACTIONS_DISPLAY,
           anchor_align: :end
         )
       end
@@ -224,15 +231,6 @@ module Primer
         title? && breadcrumbs?
       end
 
-      def before_render
-        @system_arguments[:classes] = class_names(
-          @system_arguments[:classes],
-          "PageHeader--singleAction": !render_mobile_menu?
-        )
-
-        content
-      end
-
       def render_mobile_menu?
         actions.count > 1
       end
@@ -242,26 +240,32 @@ module Primer
       def set_action_arguments(system_arguments, scheme: nil, button_action: false)
         system_arguments[:ml] ||= 2
         system_arguments[:display] = [:none, :flex]
+        system_arguments[:size] = :medium
         system_arguments[:scheme] = scheme unless scheme.nil?
         system_arguments[:classes] = class_names(
           system_arguments[:classes],
           "PageHeader-action",
         )
-        if button_action
-          system_arguments[:data] ||= {}
-          system_arguments[:data][:targets] = "page-header.actionItems"
-        end
 
         system_arguments[:id] ||= self.class.generate_id
         system_arguments
       end
 
+      def create_mobile_alternatives(component, mobile_icon, mobile_label, scheme, **system_arguments, &block)
+        # All actions should collapse into a single actionMenu on mobile
+        add_option_to_mobile_menu(system_arguments, mobile_icon, mobile_label, scheme)
+
+        # Except for single actions, which remain as they are, just smaller.
+        create_mobile_single_action(component, **system_arguments, &block)
+      end
+
       def add_option_to_mobile_menu(system_arguments, mobile_icon, mobile_label, scheme)
         unless mobile_icon.nil? || mobile_label.nil?
           # In action menus, only :default and :danger are allowed
           scheme = DEFAULT_ACTION_SCHEME unless scheme == :danger
 
-          with_menu_item(id: system_arguments[:id], label: mobile_label, scheme: scheme) do |c|
+          id = system_arguments[:button_arguments].present? ? system_arguments[:button_arguments][:id] : system_arguments[:id]
+          with_menu_item(id: id, label: mobile_label, scheme: scheme) do |c|
             c.with_leading_visual_icon(icon: mobile_icon)
           end
         end
@@ -281,6 +285,19 @@ module Primer
         )
       end
 
+      def create_mobile_single_action(component, **system_arguments, &block)
+        # Single actions shall not collapse into an action menu on mobile, but keep their state.
+        # However the position and size will change
+        unless render_mobile_menu?
+          mobile_options = system_arguments[:button_arguments].present? ?
+                             { button_arguments: { display: MOBILE_ACTIONS_DISPLAY, size: :small } } :
+                             { display: MOBILE_ACTIONS_DISPLAY, size: :small }
+
+          @mobile_action = component.new(**system_arguments.deep_merge(mobile_options))
+          @mobile_action_block = block
+        end
+      end
+
       # transform anchor tag strings to {href, text} objects
       # e.g "\u003ca href=\"/admin\"\u003eAdministration\u003c/a\u003e"
       def anchor_string_to_object(html_string)

data/app/components/primer/open_project/page_header_element.d.ts

@@ -1,6 +1,4 @@
 declare class PageHeaderElement extends HTMLElement {
-    actionItems: HTMLElement[];
-    connectedCallback(): void;
     menuItemClick(event: Event): void;
 }
 declare global {

data/app/components/primer/open_project/page_header_element.js

@@ -4,20 +4,8 @@ var __decorate = (this && this.__decorate) || function (decorators, target, key,
     else for (var i = decorators.length - 1; i >= 0; i--) if (d = decorators[i]) r = (c < 3 ? d(r) : c > 3 ? d(target, key, r) : d(target, key)) || r;
     return c > 3 && r && Object.defineProperty(target, key, r), r;
 };
-import { controller, targets } from '@github/catalyst';
+import { controller } from '@github/catalyst';
 let PageHeaderElement = class PageHeaderElement extends HTMLElement {
-    connectedCallback() {
-        for (const item of this.actionItems) {
-            /*
-            If there is only one action to be shown, we show that instead of the mobile action menu. However, the buttons should be the smaller button variant.
-            Unfortunately, the `size` attribute does not support responsive attributes and the .pcss syntax does not support inheritance between classes.
-            So we have to add the class manually here.
-            */
-            if (window.innerWidth <= 544) {
-                item.classList.add('Button--small');
-            }
-        }
-    }
     menuItemClick(event) {
         const currentTarget = event.currentTarget;
         const id = currentTarget?.getAttribute('data-for');
@@ -26,9 +14,6 @@ let PageHeaderElement = class PageHeaderElement extends HTMLElement {
         }
     }
 };
-__decorate([
-    targets
-], PageHeaderElement.prototype, "actionItems", void 0);
 PageHeaderElement = __decorate([
     controller
 ], PageHeaderElement);

data/app/components/primer/open_project/page_header_element.ts

@@ -1,22 +1,7 @@
-import {controller, targets} from '@github/catalyst'
+import {controller} from '@github/catalyst'
 
 @controller
 class PageHeaderElement extends HTMLElement {
-  @targets actionItems: HTMLElement[]
-
-  connectedCallback() {
-    for (const item of this.actionItems) {
-      /*
-      If there is only one action to be shown, we show that instead of the mobile action menu. However, the buttons should be the smaller button variant.
-      Unfortunately, the `size` attribute does not support responsive attributes and the .pcss syntax does not support inheritance between classes.
-      So we have to add the class manually here.
-      */
-      if (window.innerWidth <= 544) {
-        item.classList.add('Button--small')
-      }
-    }
-  }
-
   menuItemClick(event: Event) {
     const currentTarget = event.currentTarget as HTMLButtonElement
 

data/app/components/primer/open_project/zen_mode_button.html.erb

@@ -4,6 +4,7 @@
             scheme: :default,
             id: "zenModeButton",
             icon: ZEN_MODE_BUTTON_ICON,
+            size: @button_size,
             aria: { label: ZEN_MODE_BUTTON_LABEL },
             data: { target: "zen-mode-button.button", action: "click:zen-mode-button#performAction" }
           )

data/app/components/primer/open_project/zen_mode_button.rb

@@ -20,6 +20,8 @@ module Primer
           @system_arguments[:classes],
           "ZenModeButton"
         )
+
+        @button_size = @system_arguments[:size] || Primer::Beta::Button::DEFAULT_SIZE
       end
     end
   end

data/lib/primer/view_components/version.rb

@@ -6,7 +6,7 @@ module Primer
     module VERSION
       MAJOR = 0
       MINOR = 29
-      PATCH = 0
+      PATCH = 1
 
       STRING = [MAJOR, MINOR, PATCH].join(".")
     end

data/previews/primer/open_project/page_header_preview.rb

@@ -120,6 +120,21 @@ module Primer
         end
       end
 
+
+      # @label With a single action
+      # The single action will not be transformed into a menu on mobile, but remains in a smaller variant
+      def single_action
+        render(Primer::OpenProject::PageHeader.new) do |component|
+          component.with_title { "Great news" }
+          component.with_breadcrumbs([{ href: "/foo", text: "Foo" }, { href: "/bar", text: "Bar" }, "Baz"])
+
+          component.with_action_button(mobile_icon: "plus", mobile_label: "Meeting", scheme: :primary) do |button|
+            button.with_leading_visual_icon(icon: "plus")
+            "Meeting"
+          end
+        end
+      end
+
       # @label With leading action (on wide)
       # **Leading action** is only shown on **wide screens** by default.
       # If you want to override that behaviour please use the system_argument: **display**

data/static/classes.json

@@ -429,9 +429,6 @@
   "PageHeader": [
     "Primer::OpenProject::PageHeader"
   ],
-  "PageHeader--singleAction": [
-    "Primer::OpenProject::PageHeader"
-  ],
   "PageHeader-actions": [
     "Primer::OpenProject::PageHeader"
   ],

data/static/constants.json

@@ -1463,7 +1463,7 @@
       "h5",
       "h6"
     ],
-    "MORE_MENU_DISPLAY": [
+    "MOBILE_ACTIONS_DISPLAY": [
       "flex",
       "none"
     ],

data/static/info_arch.json

@@ -16689,6 +16689,19 @@
           ]
         }
       },
+      {
+        "preview_path": "primer/open_project/page_header/single_action",
+        "name": "single_action",
+        "snapshot": "false",
+        "skip_rules": {
+          "wont_fix": [
+            "region"
+          ],
+          "will_fix": [
+            "color-contrast"
+          ]
+        }
+      },
       {
         "preview_path": "primer/open_project/page_header/leading_action",
         "name": "leading_action",

data/static/previews.json

@@ -5274,6 +5274,19 @@
           ]
         }
       },
+      {
+        "preview_path": "primer/open_project/page_header/single_action",
+        "name": "single_action",
+        "snapshot": "false",
+        "skip_rules": {
+          "wont_fix": [
+            "region"
+          ],
+          "will_fix": [
+            "color-contrast"
+          ]
+        }
+      },
       {
         "preview_path": "primer/open_project/page_header/leading_action",
         "name": "leading_action",

metadata

@@ -1,7 +1,7 @@
 --- !ruby/object:Gem::Specification
 name: openproject-primer_view_components
 version: !ruby/object:Gem::Version
-  version: 0.29.0
+  version: 0.29.1
 platform: ruby
 authors:
 - GitHub Open Source
@@ -9,7 +9,7 @@ authors:
 autorequire: 
 bindir: bin
 cert_chain: []
-date: 2024-04-19 00:00:00.000000000 Z
+date: 2024-04-26 00:00:00.000000000 Z
 dependencies:
 - !ruby/object:Gem::Dependency
   name: actionview