Add latest changes from gitlab-org/gitlab@master

2 files changed, 84 insertions, 0 deletions

diff --git a/app/components/pajamas/banner_component.html.haml b/app/components/pajamas/banner_component.html.haml
new file mode 100644
index 00000000000..4fa2ed09cd3
--- /dev/null
+++ b/app/components/pajamas/banner_component.html.haml
@@ -0,0 +1,23 @@
+%section.gl-banner{ @banner_options, class: banner_class }
+  - if illustration?
+    .gl-banner-illustration
+      = illustration
+  - elsif @svg_path.present?
+    .gl-banner-illustration
+      = image_tag @svg_path, alt: ""
+
+  .gl-banner-content
+    %h1.gl-banner-title= title
+
+    = content
+
+    - if primary_action?
+      = primary_action
+    - else
+      = link_to @button_text, @button_link, { **@button_options, class: 'btn btn-md btn-confirm gl-button js-close-callout' }
+
+    - actions.each do |action|
+      = action
+
+  %button.gl-button.gl-banner-close.btn-sm.btn-icon.js-close{ @close_options, class: close_class, type: 'button' }
+    = sprite_icon('close', size: 16, css_class: 'dismiss-icon')
diff --git a/app/components/pajamas/banner_component.rb b/app/components/pajamas/banner_component.rb
new file mode 100644
index 00000000000..9b6343b47c9
--- /dev/null
+++ b/app/components/pajamas/banner_component.rb
@@ -0,0 +1,61 @@
+# frozen_string_literal: true
+
+module Pajamas
+  class BannerComponent < Pajamas::Component
+    # @param [String] button_text
+    # @param [String] button_link
+    # @param [Boolean] embedded
+    # @param [Symbol] variant
+    # @param [String] svg_path
+    # @param [Hash] banner_options
+    # @param [Hash] button_options
+    # @param [Hash] close_options
+    def initialize(
+      button_text: 'OK',
+      button_link: '#',
+      embedded: false,
+      variant: :promotion,
+      svg_path: nil,
+      banner_options: {},
+      button_options: {},
+      close_options: {}
+    )
+      @button_text = button_text
+      @button_link = button_link
+      @embedded = embedded
+      @variant = variant.to_sym
+      @svg_path = svg_path.to_s
+      @banner_options = banner_options
+      @button_options = button_options
+      @close_options = close_options
+    end
+
+    private
+
+    def banner_class
+      classes = []
+      classes.push('gl-border-none') if @embedded
+      classes.push('gl-banner-introduction') if introduction?
+      classes.join(' ')
+    end
+
+    def close_class
+      if introduction?
+        'btn-confirm btn-confirm-tertiary'
+      else
+        'btn-default btn-default-tertiary'
+      end
+    end
+
+    delegate :sprite_icon, to: :helpers
+
+    renders_one :title
+    renders_one :illustration
+    renders_one :primary_action
+    renders_many :actions
+
+    def introduction?
+      @variant == :introduction
+    end
+  end
+end