defmodule LiveAntd.Components.Checkbox do
  @moduledoc """
  Checkbox Component.

  ## API

    * [ ] `autoFocus`: If get focus when component mounted
    * [x] `checked`: Specifies whether the checkbox is selected
    * [ ] `defaultChecked`: Specifies the initial state: whether or not the checkbox is selected
    * [x] `disabled`: If disable checkbox
    * [ ] `indeterminate`: The indeterminate checked state of checkbox
    * [ ] `onChange`: The callback function that is triggered when the state changes

  ## Example

    <Checkbox checked={{ @checked }} />

  """

  use Surface.Component

  prop(click, :event)

  # prop(defaultValue, :string)
  prop(checked, :boolean)
  # prop(options)
  prop(disabled, :boolean)
  # prop(value, :string)

  slot(default)

  def render(assigns) do
    ~H"""
      <label class="ant-checkbox-wrapper">
        <span
          class={{
            "ant-checkbox",
            "ant-checkbox-disabled": @disabled,
            "ant-checkbox-checked": @checked
          }}
        >
          <input
            disabled={{ @disabled }}
            type="checkbox"
            class="ant-checkbox-input"
            :on-click={{ @click }}
          >
          <span class="ant-checkbox-inner"></span>
        </span>
        <span><slot>Checkbox</slot></span>
      </label>
    """
  end
end