From 2d181003830956f5e690cce74be50bb4d96048f8 Mon Sep 17 00:00:00 2001 From: GitLab Bot Date: Mon, 6 Jun 2022 18:09:02 +0000 Subject: Add latest changes from gitlab-org/gitlab@master --- app/components/pajamas/banner_component.html.haml | 23 +++++++++ app/components/pajamas/banner_component.rb | 61 +++++++++++++++++++++++ 2 files changed, 84 insertions(+) create mode 100644 app/components/pajamas/banner_component.html.haml create mode 100644 app/components/pajamas/banner_component.rb (limited to 'app/components') 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 -- cgit v1.2.3