ViewComponent

= render Pajamas::AlertComponent.new(title: "거의 완료되었습니다!")

= render Pajamas::AlertComponent.new(title: "완료되었습니다!",
  variant: :success,
  dismissible: :false,
  show_icon: false)

= render Pajamas::BannerComponent.new(button_text: '자세히 알아보기', button_link: example_path,
  svg_path: 'illustrations/example.svg') do |c|
  - c.with_title { '안녕, 세계!' }
  %p 여기에 배너 콘텐츠가 들어갑니다...

= render Pajamas::BannerComponent.new do |c|
  - c.with_illustration do
    = custom_icon('my_inline_svg')
  - c.with_title do
    안녕, 세계!
  - c.with_primary_action do
    = render 'my_button_in_a_partial'

= render Pajamas::ButtonComponent.new do |c|
  = _('버튼 텍스트를 입력하세요')

= render Pajamas::ButtonComponent.new(category: :secondary,
  variant: :danger,
  size: :small,
  type: :submit,
  disabled: true,
  loading: false,
  block: true) do |c|
  버튼 텍스트를 입력하세요

= render Pajamas::ButtonComponent.new(href: root_path) do |c|
  집으로 이동

= render Pajamas::CardComponent.new do |c|
  - c.with_header do
    헤더입니다.
  - c.with_body do
    %p 여러 줄
    %p 본문 내용입니다.
  - c.with_footer do
    여기에 푸터가 들어갑니다.

= render Pajamas::CardComponent.new(card_options: {id: "my-id"}, body_options: {data: { count: 1 }})

= render Pajamas::CheckboxTagComponent.new(name: 'project[initialize_with_sast]',
  checkbox_options: { data: { testid: 'initialize-with-sast-checkbox', track_label: track_label, track_action: 'activate_form_input', track_property: 'init_with_sast' } }) do |c|
  - c.with_label do
    = s_('ProjectsNew|Enable Static Application Security Testing (SAST)')
  - c.with_help_text do
    = s_('ProjectsNew|Analyze your source code for known security vulnerabilities.')
    = link_to _('Learn more.'), help_page_path('user/application_security/sast/index'), target: '_blank', rel: 'noopener noreferrer', data: { track_action: 'followed' }

= render Pajamas::ToggleComponent.new(classes: 'js-force-push-toggle',
  label: s_("ProtectedBranch|Toggle allowed to force push"),
  is_checked: protected_branch.allow_force_push,
  label_position: :hidden)
  Leverage this block to render a rich help text. To render a plain text help text, prefer the `help` parameter.

= render ::Layouts::HorizontalSectionComponent.new(options: { class: 'gl-mb-6' }) do |c|
  - c.with_title { _('Naming, visibility') }
  - c.with_description do
    = _('Update your group name, description, avatar, and visibility.')
    = link_to _('Learn more about groups.'), help_page_path('user/group/index')
  - c.with_body do
    .form-group.gl-form-group
      = f.label :name, _('New group name')
      = f.text_field :name