# SDK Theme Config Model

This model represents all the required data for displaying data on the SensePass Dashboard backoffice.

{% hint style="info" %}
You must use this structure: 

{% code lineNumbers="true" %}

```json
{
  "creditCard": {
    "animation": "expand" | "one-line" | "none",
    "customText": {
      "direction": "rtl" | "ltr",
      "fields": {
        "cardNumber": {
          "label": "Card Number",
          "placeholder": "Credit Card",
          "hint": "Digits",
          "defaultHint": "Full Card Number",
          "errors": {
            "required": "Card Number is Mandatory",
            "cardTypeLength": {
              "minLengthStart": "Must be Over",
              "minLengthEnd": "Digits",
              "maxLengthStart": "Must be Under",
              "maxLengthEnd": "Digits",
              "lengthsStart": "Must be:",
              "lengthsSplit": "or",
              "lengthsEnd": "Digits"
            }
          }
        },
        "expiration": {
          "label": "Expiration",
          "placeholder": "Month / Year",
          "hint": "MM/YY",
          "errors": {
            "required": "Expiration Date is Mandatory",
            "cardExpiration": {
              "invalidDateFormat": "Date Invalid, Should Be MM/YY",
              "monthRange": "Month Should Be Between 1 - 12",
              "yearExpiration": "The Year You've Set Expired",
              "monthExpiration": "The Month You've Set Expired This Year"
            }
          }
        },
        "securityCode": {
          "label": "CVV",
          "placeholder": "CVV/CVC",
          "hint": {
            "amex": "digits, front of the card",
            "default": "digits, back of the card"
          },
          "defaultHint": "Security Code",
          "errors": {
            "required": "CVC is Mandatory",
            "securityCodeLength": {
              "lengthShouldBe": "must be",
              "digits": "digits"
            }
          }
        },
        "socialID": {
          "label": "Document ID",
          "placeholder": "Document ID",
          "hint": "Document ID",
          "errors": {
            "required": "Document ID is Mandatory",
            "minlength": "5 Digits Minimum",
            "maxlength": "20 Digits Maximum"
          }
        },
        "zipCode": {
          "label": "Zip Code",
          "placeholder": "Zip Code",
          "hint": "address associated to your card",
          "errors": {
            "required": "Zip Code is Mandatory",
            "minlength": "0 Digits Minimum",
            "maxlength": "9 Digits Maximum"
          }
        },
        "email": {
          "label": "Email",
          "placeholder": "John@domain.com",
          "hint": "Email",
          "errors": {
            "required": "Email is Mandatory",
            "minlength": "5 Characters Minimum",
            "maxlength": "50 Characters Maximum"
          }
        },
        "mobilePhone": {
          "label": "Mobile Phone",
          "placeholder": "000-000-0000",
          "hint": "Mobile Phone",
          "errors": {
            "required": "Mobile Phone is Mandatory",
            "minlength": "6 Digits Minimum",
            "maxlength": "15 Digits Maximum"
          }
        },
        "installments": "Installments",
        "fullName": {
          "label": "Full Name",
          "placeholder": "Full Name",
          "hint": "First & Last names",
          "errors": {
            "required": "Full Name is Mandatory",
            "pattern": "Full Name must ONLY be letters",
            "minlength": "4 Characters Minimum",
            "maxlength": "50 Characters Maximum"
          }
        },
        "saveCard": {
          "label": "Save this card"
        }
      }
    }
  }
}
```

{% endcode %}
{% endhint %}

Description of the parameters required for various payment options configurations.

<table><thead><tr><th width="224.9871382636656">field</th><th width="111.16318436735071">type</th><th width="384.2">description</th></tr></thead><tbody><tr><td>creditCard</td><td>object</td><td>credit card ui-data orientation</td></tr><tr><td>creditCard.animation</td><td>enum</td><td>options for animating the selected payment method display:w "expand" / "one-line" / "none"</td></tr><tr><td>creditCard.customText</td><td>object</td><td>credit card's customizable texts</td></tr><tr><td>creditCard.customText.direction</td><td>enum</td><td>options for the text direction: "ltr" | "rtl".<br>(left-to-right / right-to-left)</td></tr><tr><td>creditCard.customText.fields</td><td>object</td><td>credit card fields with options to edit their text.<br>keep in mind to handle various languages.</td></tr><tr><td>creditCard.customText.fields[MODEL_FIELD]</td><td>model</td><td>field model for editting a credit card form field text <a data-mention href="/pages/vInpYjzryd5HLWlxRlNj">/pages/vInpYjzryd5HLWlxRlNj</a>.</td></tr></tbody></table>


---

# Agent Instructions: Querying This Documentation

If you need additional information that is not directly available in this page, you can query the documentation dynamically by asking a question.

Perform an HTTP GET request on the current page URL with the `ask` query parameter:

```
GET https://docs.sensepass.com/sensepay/transaction-api/models/sdk-theme-config-model.md?ask=<question>
```

The question should be specific, self-contained, and written in natural language.
The response will contain a direct answer to the question and relevant excerpts and sources from the documentation.

Use this mechanism when the answer is not explicitly present in the current page, you need clarification or additional context, or you want to retrieve related documentation sections.