ViewComponent

= render Pajamas::AlertComponent.new(title: "Almost done!")

= render Pajamas::AlertComponent.new(title: "All done!",
  variant: :success,
  dismissible: :false,
  show_icon: false)

= render Pajamas::BannerComponent.new(button_text: 'Learn more', button_link: example_path,
  svg_path: 'illustrations/example.svg') do |c|
  - c.with_title { 'Hello world!' }
  %p Content of your banner goes here...

= render Pajamas::BannerComponent.new do |c|
  - c.with_illustration do
    = custom_icon('my_inline_svg')
  - c.with_title do
    Hello world!
  - 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|정적 애플리케이션 보안 테스트 (SAST) 활성화')
  - c.with_help_text do
    = s_('ProjectsNew|알려진 보안 취약점에 대해 소스 코드를 분석합니다.')
    = link_to _('자세히 알아보기.'), 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) do
  이 블록을 활용하여 풍부한 도움말 텍스트를 렌더링합니다. 일반 텍스트 도움말 텍스트를 렌더링하려면 `help` 매개변수를 선호하세요.

= render ::Layouts::PageHeadingComponent.new(_('Page title')) do |c|
  - c.with_actions do
    = buttons

= render ::Layouts::CrudComponent.new(_('CRUD title'), icon: 'ICONNAME', count: COUNT) do |c|
  - c.with_description do
    = description
  - c.with_actions do
    = buttons
  - c.with_form do
    = add item form
  - c.with_body do
    = body
  - c.with_pagination do
    = pagination component
  - c.with_footer do
    = optional footer

= 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

= render ::Layouts::SettingsBlock.new(_('Settings block heading')) do |c|
  - c.with_description do
    = description
  - c.with_body do
    = body

= render ::Layouts::SettingsSection.new(_('설정 섹션 제목')) do |c|
  - c.with_description do
    = description
  - c.with_body do
    = body