summaryrefslogtreecommitdiff
path: root/spec/components/previews/pajamas/button_component_preview.rb
blob: 13a04dc0d638dd7e3c4368fe3dbba9202fcd6f08 (plain)
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
# frozen_string_literal: true
module Pajamas
  class ButtonComponentPreview < ViewComponent::Preview
    # Button
    # ----
    # See its design reference [here](https://design.gitlab.com/components/button).
    #
    # @param category select {{ Pajamas::ButtonComponent::CATEGORY_OPTIONS }}
    # @param variant select {{ Pajamas::ButtonComponent::VARIANT_OPTIONS }}
    # @param size select {{ Pajamas::ButtonComponent::SIZE_OPTIONS }}
    # @param type select {{ Pajamas::ButtonComponent::TYPE_OPTIONS }}
    # @param disabled toggle
    # @param loading toggle
    # @param block toggle
    # @param selected toggle
    # @param icon select [~, star-o, issue-closed, tanuki]
    # @param text text
    def default( # rubocop:disable Metrics/ParameterLists
      category: :primary,
      variant: :default,
      size: :medium,
      type: :button,
      disabled: false,
      loading: false,
      block: false,
      selected: false,
      icon: nil,
      text: "Edit"
    )
      render(Pajamas::ButtonComponent.new(
               category: category,
               variant: variant,
               size: size,
               type: type,
               disabled: disabled,
               loading: loading,
               block: block,
               selected: selected,
               icon: icon
             )) do
        text.presence
      end
    end

    # The component can also be used to create links that look and feel like buttons.
    # Just provide a `href` and optionally a `target` to create an `<a>` tag.
    def link
      render(Pajamas::ButtonComponent.new(
               href: "https://gitlab.com",
               target: "_blank"
             )) do
        "This is a link"
      end
    end
  end
end