{% import '_includes/forms' as forms %}
{% import 'verbb-base/_macros' as macros %}

{% set displayName = integration.displayName() %}

{{ macros.proxyField(fieldVariables, 'autosuggestField', {
    label: 'Site Key' | t('formie'),
    name: 'siteKey',
    required: true,
    suggestEnvVars: true,
    value: integration.settings.siteKey ?? '',
    warning: macros.configWarning('siteKey', 'formie'),
}) }}

{{ macros.proxyField(fieldVariables, 'autosuggestField', {
    label: 'Secret Key' | t('formie'),
    name: 'secretKey',
    required: true,
    suggestEnvVars: true,
    value: integration.settings.secretKey ?? '',
    warning: macros.configWarning('secretKey', 'formie'),
}) }}

{{ macros.proxyField(fieldVariables, 'selectField', {
    label: 'Script Loading Method' | t('formie'),
    instructions: 'Select the `defer` and `async` attributes to use in the script tag when rendering.' | t('formie'),
    name: 'scriptLoadingMethod',
    value: integration.settings.scriptLoadingMethod ?? 'asyncDefer',
    options: [
        {
            value: 'none',
            label: 'None' | t('formie'),
        },
        {
            value: 'asyncDefer',
            label: 'Async & Defer' | t('formie'),
        },
        {
            value: 'async',
            label: 'Async' | t('formie'),
        },
        {
            value: 'defer',
            label: 'Defer' | t('formie'),
        },
    ],
    warning: macros.configWarning('scriptLoadingMethod', 'formie'),
}) }}

{{ macros.proxyField(fieldVariables, 'selectField', {
    label: 'Theme' | t('formie'),
    instructions: 'Select the theme for Turnstile to use.' | t('formie'),
    name: 'theme',
    value: integration.settings.theme ?? 'auto',
    options: [{
        value: 'auto',
        label: 'Auto' | t('formie'),
    }, {
        value: 'light',
        label: 'Light' | t('formie'),
    }, {
        value: 'dark',
        label: 'Dark' | t('formie'),
    }],
    warning: macros.configWarning('theme', 'formie'),
}) }}

{{ macros.proxyField(fieldVariables, 'selectField', {
    label: 'Size' | t('formie'),
    instructions: 'Select the size for Turnstile to use.' | t('formie'),
    name: 'size',
    value: integration.settings.size ?? 'normal',
    options: [{
        value: 'normal',
        label: 'Normal' | t('formie'),
    }, {
        value: 'compact',
        label: 'Compact' | t('formie'),
    }],
    warning: macros.configWarning('size', 'formie'),
}) }}

{{ macros.proxyField(fieldVariables, 'selectField', {
    label: 'Appearance' | t('formie'),
    instructions: 'Select the appearance for Turnstile to use.' | t('formie'),
    name: 'appearance',
    value: integration.settings.appearance ?? 'always',
    options: [{
        value: 'always',
        label: 'Always' | t('formie'),
    }, {
        value: 'execute',
        label: 'Execute' | t('formie'),
    }, {
        value: 'interaction-only',
        label: 'Interaction Only' | t('formie'),
    }],
    warning: macros.configWarning('appearance', 'formie'),
}) }}