govuk-frontend/dist/govuk/components/date-input/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": true,
        "description": "This is used for the main component and to compose the ID attribute for each item."
    },
    {
        "name": "namePrefix",
        "type": "string",
        "required": false,
        "description": "Optional prefix. This is used to prefix each item `name`, separated by `-`."
    },
    {
        "name": "items",
        "type": "array",
        "required": false,
        "description": "The inputs within the date input component.",
        "params": [
            {
                "name": "id",
                "type": "string",
                "required": false,
                "description": "Item-specific ID. If provided, it will be used instead of the generated ID."
            },
            {
                "name": "name",
                "type": "string",
                "required": true,
                "description": "Item-specific name attribute."
            },
            {
                "name": "label",
                "type": "string",
                "required": false,
                "description": "Item-specific label text. If provided, this will be used instead of `name` for item label text."
            },
            {
                "name": "value",
                "type": "string",
                "required": false,
                "description": "If provided, it will be used as the initial value of the input."
            },
            {
                "name": "autocomplete",
                "type": "string",
                "required": false,
                "description": "Attribute to meet [WCAG success criterion 1.3.5: Identify input purpose](https://www.w3.org/WAI/WCAG22/Understanding/identify-input-purpose.html), for instance `\"bday-day\"`. See the [Autofill section in the HTML standard](https://html.spec.whatwg.org/multipage/form-control-infrastructure.html#autofill) section in the HTML standard for full list of attributes that can be used."
            },
            {
                "name": "pattern",
                "type": "string",
                "required": false,
                "description": "Attribute to [provide a regular expression pattern](https://html.spec.whatwg.org/multipage/input.html#the-pattern-attribute), used to match allowed character combinations for the input value."
            },
            {
                "name": "classes",
                "type": "string",
                "required": false,
                "description": "Classes to add to date input item."
            },
            {
                "name": "attributes",
                "type": "object",
                "required": false,
                "description": "HTML attributes (for example data attributes) to add to the date input tag."
            }
        ]
    },
    {
        "name": "hint",
        "type": "object",
        "required": false,
        "description": "Can be used to add a hint to a date input component.",
        "isComponent": true
    },
    {
        "name": "errorMessage",
        "type": "object",
        "required": false,
        "description": "Can be used to add an error message to the date input 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 date input 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": "beforeInputs",
                "type": "object",
                "required": false,
                "description": "Content to add before the inputs used by the date input component.",
                "params": [
                    {
                        "name": "text",
                        "type": "string",
                        "required": true,
                        "description": "Text to add before the inputs. If `html` is provided, the `text` option will be ignored."
                    },
                    {
                        "name": "html",
                        "type": "string",
                        "required": true,
                        "description": "HTML to add before the inputs. If `html` is provided, the `text` option will be ignored."
                    }
                ]
            },
            {
                "name": "afterInputs",
                "type": "object",
                "required": false,
                "description": "Content to add after the inputs used by the date input component.",
                "params": [
                    {
                        "name": "text",
                        "type": "string",
                        "required": true,
                        "description": "Text to add after the inputs. If `html` is provided, the `text` option will be ignored."
                    },
                    {
                        "name": "html",
                        "type": "string",
                        "required": true,
                        "description": "HTML to add after the inputs. If `html` is provided, the `text` option will be ignored."
                    }
                ]
            }
        ]
    },
    {
        "name": "fieldset",
        "type": "object",
        "required": false,
        "description": "Can be used to add a fieldset to the date input component.",
        "isComponent": true
    },
    {
        "name": "classes",
        "type": "string",
        "required": false,
        "description": "Classes to add to the date-input container."
    },
    {
        "name": "attributes",
        "type": "object",
        "required": false,
        "description": "HTML attributes (for example data attributes) to add to the date-input container."
    }
]