diff --git a/components/dash-html-components/scripts/data/attributes.json b/components/dash-html-components/scripts/data/attributes.json index dfd9201323..4d6183d5ff 100644 --- a/components/dash-html-components/scripts/data/attributes.json +++ b/components/dash-html-components/scripts/data/attributes.json @@ -1,5 +1,14 @@ { "attributes": { + "autoFocus": { + "elements": [ + "button", + "input", + "select", + "textarea" + ], + "description": "The element should be automatically focused after the page loaded." + }, "accept": { "elements": [ "form", @@ -736,18 +745,21 @@ } }, "elements": { - "form": [ - "accept", - "acceptCharset", - "action", - "autoComplete", - "encType", - "method", + "button": [ + "autoFocus", + "disabled", + "form", + "formAction", + "formEncType", + "formMethod", + "formNoValidate", + "formTarget", "name", - "noValidate", - "target" + "type", + "value" ], "input": [ + "autoFocus", "accept", "alt", "autoComplete", @@ -780,6 +792,43 @@ "value", "width" ], + "select": [ + "autoFocus", + "autoComplete", + "disabled", + "form", + "multiple", + "name", + "required", + "size" + ], + "textarea": [ + "autoFocus", + "autoComplete", + "cols", + "disabled", + "form", + "inputMode", + "maxLength", + "minLength", + "name", + "placeholder", + "readOnly", + "required", + "rows", + "wrap" + ], + "form": [ + "accept", + "acceptCharset", + "action", + "autoComplete", + "encType", + "method", + "name", + "noValidate", + "target" + ], "Globalattribute": [ "accessKey", "className", @@ -836,30 +885,6 @@ "src", "type" ], - "select": [ - "autoComplete", - "disabled", - "form", - "multiple", - "name", - "required", - "size" - ], - "textarea": [ - "autoComplete", - "cols", - "disabled", - "form", - "inputMode", - "maxLength", - "minLength", - "name", - "placeholder", - "readOnly", - "required", - "rows", - "wrap" - ], "audio": [ "autoPlay", "controls", @@ -942,18 +967,6 @@ "src", "srcLang" ], - "button": [ - "disabled", - "form", - "formAction", - "formEncType", - "formMethod", - "formNoValidate", - "formTarget", - "name", - "type", - "value" - ], "fieldset": [ "disabled", "form", @@ -1067,4 +1080,4 @@ "value" ] } -} \ No newline at end of file +} diff --git a/components/dash-html-components/scripts/extract-attributes.js b/components/dash-html-components/scripts/extract-attributes.js index 37490cc77f..dcd5153629 100644 --- a/components/dash-html-components/scripts/extract-attributes.js +++ b/components/dash-html-components/scripts/extract-attributes.js @@ -31,6 +31,19 @@ const supportedAttributes = ['accept', 'accessKey', 'action', 'allow', 'srcDoc', 'srcLang', 'srcSet', 'start', 'step', 'style', 'summary', 'tabIndex', 'target', 'title', 'type', 'useMap', 'value', 'width', 'wmode', 'wrap']; + +const hardcodedAttributes = { + autoFocus: { + elements: [ + "button", + "input", + "select", + "textarea" + ], + description: "The element should be automatically focused after the page loaded." + } +} + // Create a map of HTML attribute to React prop // e.g. {"datetime": "dateTime"} const attributeMap = supportedAttributes.reduce((map, reactAttribute) => { @@ -58,7 +71,7 @@ function extractAttributes($) { if($table.length !== 1) { throw new Error('page structure changed at ' + htmlURL); } - const attributes = {}; + const attributes = hardcodedAttributes; $table.find('tbody tr').each((i, row) => { const $children = cheerio(row).find('td');