> ## Documentation Index
> Fetch the complete documentation index at: https://help.dingtalk.io/llms.txt
> Use this file to discover all available pages before exploring further.

# Attribute Types and Setters

> Component attribute types and setters offer preset configuration options for a range of use cases. Each attribute type maps to a specific setter, including Text, boolean, Number, and object types with their corresponding setters such as TextSetter, BoolSetter, and NumberSetter.

<Note>
  This document is currently visible only to Knowledge Group members. Do not modify it — it will be published after review.
</Note>

Component attribute types and setters offer preset configuration options for a range of use cases. Each attribute type maps to a specific setter. See the table below for details.

<table>
  <tr>
    <td>**Attribute type**</td>
    <td>**Setter name**</td>
    <td>**Description**</td>
    <td>**Illustration**</td>
  </tr>

  <tr>
    <td rowSpan={5}>**Text**</td>
    <td>TextSetter</td>
    <td>Text setter: the standard style for Text-type components. Supports regular text input.</td>

    <td />
  </tr>

  <tr>
    <td>I18nSetter</td>
    <td>Internationalization is disabled by default for newly added components. To enable it, click the internationalization Button above the attribute Settings panel. This opens the editor, where you can Create a new i18n entry or Search existing entries to bind.<br />For entries that are already bound, click the internationalization Button to Edit the translated text in each Language directly.</td>

    <td />
  </tr>

  <tr>
    <td>DateSetter</td>
    <td>Provides a Date picker and displays the selected time on the Page as a timestamp.</td>

    <td />
  </tr>

  <tr>
    <td>ChoiceSetter</td>
    <td>Custom Component attributes appear as options in the attribute panel. Selecting a different option updates the Component Content on the Page to the corresponding preset value.</td>

    <td />
  </tr>

  <tr>
    <td>ImageSetter</td>

    <td />

    <td />
  </tr>

  <tr>
    <td>**boolean**</td>
    <td>BoolSetter</td>
    <td>Custom Component attributes appear as a toggle in the attribute panel of the Form design Page. When set to On, the Component Content displays `true`; when set to Close, it displays `false`.</td>

    <td />
  </tr>

  <tr>
    <td>**Number**</td>
    <td>NumberSetter</td>
    <td>Turns the Custom Form into a component similar to the YiDA Numerical Component. Only numeric input is allowed, and the value entered in the attribute panel is displayed in the Component Content.</td>

    <td />
  </tr>

  <tr>
    <td>**object**</td>
    <td>JsonSetter</td>
    <td>Allows the Component attribute value to be entered as object-format code. The Component Content is displayed as `[object Object]`.</td>

    <td />
  </tr>

  <tr>
    <td rowSpan={3}>**array**</td>
    <td>OptionsSetter</td>
    <td>Used to produce simple array objects. Typically used for option configuration in dropdown selectors.</td>

    <td />
  </tr>

  <tr>
    <td>ListSetter</td>
    <td>Used to produce complex object components. Configuration is relatively complex.</td>

    <td />
  </tr>

  <tr>
    <td>JsonSetter</td>
    <td>Same as the object setter JsonSetter.</td>
    <td>Behaves the same as the object setter JsonSetter.</td>
  </tr>

  <tr>
    <td rowSpan={2}>**Function**</td>
    <td>ActionSetter</td>
    <td>Used to Configure callback functions. When ActionSetter is selected, the attribute appears as an action setting under **Premium** at runtime.<br />ActionSetter must be bound before use. To bind an event callback by default, use CodeSetter instead.</td>

    <td />
  </tr>

  <tr>
    <td>CodeSetter</td>
    <td>Used to Configure callback functions. Unlike ActionSetter, it generates a code box directly at runtime.</td>

    <td />
  </tr>

  <tr>
    <td>**Element**</td>
    <td>SlotSetter</td>
    <td>Used to build container-type components that accept other components. To use it, first declare an attribute and Select SlotSetter, then drag in the "Slot placeholder" Component and bind it to the declared attribute.</td>

    <td />
  </tr>
</table>