govuk-frontend/dist/govuk/components/select/macro-options.json

GOV.UK Frontend contains the code you need to start building a user interface for government platforms and services.

[
    {
        "name": "id",
        "type": "string",
        "required": false,
        "description": "ID for the select box. Defaults to the value of `name`."
    },
    {
        "name": "name",
        "type": "string",
        "required": true,
        "description": "Name property for the select."
    },
    {
        "name": "items",
        "type": "array",
        "required": true,
        "description": "The items within the select component.",
        "params": [
            {
                "name": "value",
                "type": "string",
                "required": false,
                "description": "Value for the option. If this is omitted, the value is taken from the text content of the option element."
            },
            {
                "name": "text",
                "type": "string",
                "required": true,
                "description": "Text for the option item."
            },
            {
                "name": "selected",
                "type": "boolean",
                "required": false,
                "description": "Whether the option should be selected when the page loads. Takes precedence over the top-level `value` option."
            },
            {
                "name": "disabled",
                "type": "boolean",
                "required": false,
                "description": "Sets the option item as disabled."
            },
            {
                "name": "attributes",
                "type": "object",
                "required": false,
                "description": "HTML attributes (for example data attributes) to add to the option."
            }
        ]
    },
    {
        "name": "value",
        "type": "string",
        "required": false,
        "description": "Value for the option which should be selected. Use this as an alternative to setting the `selected` option on each individual item."
    },
    {
        "name": "disabled",
        "type": "boolean",
        "required": false,
        "description": "If `true`, select box will be disabled. Use the `disabled` option on each individual item to only disable certain options."
    },
    {
        "name": "describedBy",
        "type": "string",
        "required": false,
        "description": "One or more element IDs to add to the `aria-describedby` attribute, used to provide additional descriptive information for screenreader users."
    },
    {
        "name": "label",
        "type": "object",
        "required": true,
        "description": "The label used by the select component.",
        "isComponent": true
    },
    {
        "name": "hint",
        "type": "object",
        "required": false,
        "description": "Can be used to add a hint to the select component.",
        "isComponent": true
    },
    {
        "name": "errorMessage",
        "type": "object",
        "required": false,
        "description": "Can be used to add an error message to the select component. The error message component will not display if you use a falsy value for `errorMessage`, for example `false` or `null`.",
        "isComponent": true
    },
    {
        "name": "formGroup",
        "type": "object",
        "required": false,
        "description": "Additional options for the form group containing the select component.",
        "params": [
            {
                "name": "classes",
                "type": "string",
                "required": false,
                "description": "Classes to add to the form group (for example to show error state for the whole group)."
            },
            {
                "name": "attributes",
                "type": "object",
                "required": false,
                "description": "HTML attributes (for example data attributes) to add to the form group."
            },
            {
                "name": "beforeInput",
                "type": "object",
                "required": false,
                "description": "Content to add before the select used by the select component.",
                "params": [
                    {
                        "name": "text",
                        "type": "string",
                        "required": true,
                        "description": "Text to add before the select. If `html` is provided, the `text` option will be ignored."
                    },
                    {
                        "name": "html",
                        "type": "string",
                        "required": true,
                        "description": "HTML to add before the select. If `html` is provided, the `text` option will be ignored."
                    }
                ]
            },
            {
                "name": "afterInput",
                "type": "object",
                "required": false,
                "description": "Content to add after the select used by the select component.",
                "params": [
                    {
                        "name": "text",
                        "type": "string",
                        "required": true,
                        "description": "Text to add after the select. If `html` is provided, the `text` option will be ignored."
                    },
                    {
                        "name": "html",
                        "type": "string",
                        "required": true,
                        "description": "HTML to add after the select. If `html` is provided, the `text` option will be ignored."
                    }
                ]
            }
        ]
    },
    {
        "name": "classes",
        "type": "string",
        "required": false,
        "description": "Classes to add to the select."
    },
    {
        "name": "attributes",
        "type": "object",
        "required": false,
        "description": "HTML attributes (for example data attributes) to add to the select."
    }
]