{"id":41237891,"url":"https://github.com/pioupia/auto-input-a2f","last_synced_at":"2026-01-23T01:10:48.075Z","repository":{"id":48067358,"uuid":"394208413","full_name":"pioupia/auto-input-a2f","owner":"pioupia","description":"Allows you to automatically change input once it is filled in. Then validate the form when all inputs are filled in correctly.","archived":false,"fork":false,"pushed_at":"2024-08-05T12:26:23.000Z","size":120,"stargazers_count":0,"open_issues_count":0,"forks_count":0,"subscribers_count":1,"default_branch":"main","last_synced_at":"2025-10-06T11:25:49.918Z","etag":null,"topics":["a2f","autoinput","javascript","javascript-library"],"latest_commit_sha":null,"homepage":"https://pioupia.github.io/auto-input-a2f/","language":"JavaScript","has_issues":true,"has_wiki":null,"has_pages":null,"mirror_url":null,"source_name":null,"license":"mit","status":null,"scm":"git","pull_requests_enabled":true,"icon_url":"https://github.com/pioupia.png","metadata":{"files":{"readme":"README.md","changelog":null,"contributing":null,"funding":null,"license":"LICENSE","code_of_conduct":null,"threat_model":null,"audit":null,"citation":null,"codeowners":null,"security":null,"support":null,"governance":null,"roadmap":null,"authors":null,"dei":null,"publiccode":null,"codemeta":null}},"created_at":"2021-08-09T08:18:52.000Z","updated_at":"2024-08-05T12:26:26.000Z","dependencies_parsed_at":"2024-08-05T14:08:16.922Z","dependency_job_id":null,"html_url":"https://github.com/pioupia/auto-input-a2f","commit_stats":{"total_commits":26,"total_committers":2,"mean_commits":13.0,"dds":0.2692307692307693,"last_synced_commit":"153dd667459508f31de430b08392f7d48480ffd7"},"previous_names":[],"tags_count":0,"template":false,"template_full_name":null,"purl":"pkg:github/pioupia/auto-input-a2f","repository_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/pioupia%2Fauto-input-a2f","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/pioupia%2Fauto-input-a2f/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/pioupia%2Fauto-input-a2f/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/pioupia%2Fauto-input-a2f/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/pioupia","download_url":"https://codeload.github.com/pioupia/auto-input-a2f/tar.gz/refs/heads/main","sbom_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/pioupia%2Fauto-input-a2f/sbom","scorecard":{"id":734902,"data":{"date":"2025-08-11","repo":{"name":"github.com/pioupia/auto-input-a2f","commit":"9f5ed87035e753c77d702e6c092fff8d6a78ce90"},"scorecard":{"version":"v5.2.1-40-gf6ed084d","commit":"f6ed084d17c9236477efd66e5b258b9d4cc7b389"},"score":3,"checks":[{"name":"Maintained","score":0,"reason":"0 commit(s) and 0 issue activity found in the last 90 days -- score normalized to 0","details":null,"documentation":{"short":"Determines if the project is \"actively maintained\".","url":"https://github.com/ossf/scorecard/blob/f6ed084d17c9236477efd66e5b258b9d4cc7b389/docs/checks.md#maintained"}},{"name":"Packaging","score":-1,"reason":"packaging workflow not detected","details":["Warn: no GitHub/GitLab publishing workflow detected."],"documentation":{"short":"Determines if the project is published as a package that others can easily download, install, easily update, and uninstall.","url":"https://github.com/ossf/scorecard/blob/f6ed084d17c9236477efd66e5b258b9d4cc7b389/docs/checks.md#packaging"}},{"name":"Binary-Artifacts","score":10,"reason":"no binaries found in the repo","details":null,"documentation":{"short":"Determines if the project has generated executable (binary) artifacts in the source repository.","url":"https://github.com/ossf/scorecard/blob/f6ed084d17c9236477efd66e5b258b9d4cc7b389/docs/checks.md#binary-artifacts"}},{"name":"Pinned-Dependencies","score":-1,"reason":"no dependencies found","details":null,"documentation":{"short":"Determines if the project has declared and pinned the dependencies of its build process.","url":"https://github.com/ossf/scorecard/blob/f6ed084d17c9236477efd66e5b258b9d4cc7b389/docs/checks.md#pinned-dependencies"}},{"name":"Dangerous-Workflow","score":-1,"reason":"no workflows found","details":null,"documentation":{"short":"Determines if the project's GitHub Action workflows avoid dangerous patterns.","url":"https://github.com/ossf/scorecard/blob/f6ed084d17c9236477efd66e5b258b9d4cc7b389/docs/checks.md#dangerous-workflow"}},{"name":"Code-Review","score":0,"reason":"Found 0/13 approved changesets -- score normalized to 0","details":null,"documentation":{"short":"Determines if the project requires human code review before pull requests (aka merge requests) are merged.","url":"https://github.com/ossf/scorecard/blob/f6ed084d17c9236477efd66e5b258b9d4cc7b389/docs/checks.md#code-review"}},{"name":"Token-Permissions","score":-1,"reason":"No tokens found","details":null,"documentation":{"short":"Determines if the project's workflows follow the principle of least privilege.","url":"https://github.com/ossf/scorecard/blob/f6ed084d17c9236477efd66e5b258b9d4cc7b389/docs/checks.md#token-permissions"}},{"name":"CII-Best-Practices","score":0,"reason":"no effort to earn an OpenSSF best practices badge detected","details":null,"documentation":{"short":"Determines if the project has an OpenSSF (formerly CII) Best Practices Badge.","url":"https://github.com/ossf/scorecard/blob/f6ed084d17c9236477efd66e5b258b9d4cc7b389/docs/checks.md#cii-best-practices"}},{"name":"Security-Policy","score":0,"reason":"security policy file not detected","details":["Warn: no security policy file detected","Warn: no security file to analyze","Warn: no security file to analyze","Warn: no security file to analyze"],"documentation":{"short":"Determines if the project has published a security policy.","url":"https://github.com/ossf/scorecard/blob/f6ed084d17c9236477efd66e5b258b9d4cc7b389/docs/checks.md#security-policy"}},{"name":"Vulnerabilities","score":10,"reason":"0 existing vulnerabilities detected","details":null,"documentation":{"short":"Determines if the project has open, known unfixed vulnerabilities.","url":"https://github.com/ossf/scorecard/blob/f6ed084d17c9236477efd66e5b258b9d4cc7b389/docs/checks.md#vulnerabilities"}},{"name":"Fuzzing","score":0,"reason":"project is not fuzzed","details":["Warn: no fuzzer integrations found"],"documentation":{"short":"Determines if the project uses fuzzing.","url":"https://github.com/ossf/scorecard/blob/f6ed084d17c9236477efd66e5b258b9d4cc7b389/docs/checks.md#fuzzing"}},{"name":"License","score":10,"reason":"license file detected","details":["Info: project has a license file: LICENSE:0","Info: FSF or OSI recognized license: MIT License: LICENSE:0"],"documentation":{"short":"Determines if the project has defined a license.","url":"https://github.com/ossf/scorecard/blob/f6ed084d17c9236477efd66e5b258b9d4cc7b389/docs/checks.md#license"}},{"name":"Branch-Protection","score":0,"reason":"branch protection not enabled on development/release branches","details":["Warn: branch protection not enabled for branch 'main'"],"documentation":{"short":"Determines if the default and release branches are protected with GitHub's branch protection settings.","url":"https://github.com/ossf/scorecard/blob/f6ed084d17c9236477efd66e5b258b9d4cc7b389/docs/checks.md#branch-protection"}},{"name":"Signed-Releases","score":-1,"reason":"no releases found","details":null,"documentation":{"short":"Determines if the project cryptographically signs release artifacts.","url":"https://github.com/ossf/scorecard/blob/f6ed084d17c9236477efd66e5b258b9d4cc7b389/docs/checks.md#signed-releases"}},{"name":"SAST","score":0,"reason":"SAST tool is not run on all commits -- score normalized to 0","details":["Warn: 0 commits out of 29 are checked with a SAST tool"],"documentation":{"short":"Determines if the project uses static code analysis.","url":"https://github.com/ossf/scorecard/blob/f6ed084d17c9236477efd66e5b258b9d4cc7b389/docs/checks.md#sast"}}]},"last_synced_at":"2025-08-22T15:29:17.690Z","repository_id":48067358,"created_at":"2025-08-22T15:29:17.690Z","updated_at":"2025-08-22T15:29:17.690Z"},"host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":286080680,"owners_count":28676702,"icon_url":"https://github.com/github.png","version":null,"created_at":"2022-05-30T11:31:42.601Z","updated_at":"2026-01-23T01:00:35.747Z","status":"ssl_error","status_checked_at":"2026-01-23T01:00:19.529Z","response_time":144,"last_error":"SSL_read: unexpected eof while reading","robots_txt_status":"success","robots_txt_updated_at":"2025-07-24T06:49:26.215Z","robots_txt_url":"https://github.com/robots.txt","online":false,"can_crawl_api":true,"host_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub","repositories_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories","repository_names_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repository_names","owners_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners"}},"keywords":["a2f","autoinput","javascript","javascript-library"],"created_at":"2026-01-23T01:10:47.407Z","updated_at":"2026-01-23T01:10:48.070Z","avatar_url":"https://github.com/pioupia.png","language":"JavaScript","funding_links":[],"categories":[],"sub_categories":[],"readme":"[![](https://img.shields.io/npm/v/auto-input-a2f)](https://www.npmjs.com/package/auto-input-a2f)\n[![](https://img.shields.io/npm/dm/auto-input-a2f)](https://www.npmjs.com/package/auto-input-a2f)\n\n# Auto Input for 2FA fields\nAllows you to automatically change input once it is filled in. Then validate the form when all inputs are filled in correctly.\n\n\u003cp align=\"center\"\u003e\n    \u003ca href=\"https://github.com/pioupia/auto-input-a2f\"\u003e\n        \u003cimg src=\"https://raw.githubusercontent.com/pioupia/auto-input-a2f/main/assets/autoinputa2f.gif\" height=\"140\"\u003e\n    \u003c/a\u003e\n\u003c/p\u003e\n\n## Table of content:\n- [Installation](#installation)\n    - [npm](#npm)\n    - [sources](#from-sources)\n- [Usage](#usage)\n    - [import](#import)\n    - [Init the class](#initiate-the-class)\n    - [Methods](#methods)\n- [Example](#example)\n    - [Automatic fields creation](#automatic-fields-creation)\n    - [Improved customization](#manual-fields-creation)\n\n\n## Installation\n\n### npm:\nWith npm:\n```sh\nnpm i auto-input-a2f\n```\n\nWith pnpm:\n```sh\nnpm i auto-input-a2f\n```\n\nWith yarn:\n```sh\nyarn add auto-input-a2f\n```\n\nIf you are using a web server such as [`expressjs`](http://expressjs.com/), you need to set the file as static files to serve them. For example, for `expressjs` you'll need:\n```js\napp.use(express.static('/node_modules/auto-input-a2f/dist/'));\n```\n\nIn your html file :\n```html\n\u003cscript src=\"/autoinput.min.js\" integrity=\"sha384-p91U1bCVTJMP+YhKZTn2fYvOScTU3xokkfMUfc7A7XY5gndM1h2+8qbdtXICnS/b\" crossorigin=\"anonymous\"\u003e\u003c/script\u003e\n```\nFor all other files, you can [get the shashum below](#minified-javascript)\n\n### From sources:\n\n#### Minified JavaScript:\n```html\n\u003cscript src=\"https://pioupia.github.io/auto-input-a2f/autoinput.min.js\" integrity=\"sha384-p91U1bCVTJMP+YhKZTn2fYvOScTU3xokkfMUfc7A7XY5gndM1h2+8qbdtXICnS/b\" crossorigin=\"anonymous\"\u003e\u003c/script\u003e\n```\n\n#### Unminified JavaScript:\n```html\n\u003cscript src=\"https://pioupia.github.io/auto-input-a2f/autoinput.js\" integrity=\"sha384-fD5DnbGvuM3Yat97IQjMLbrbs0KGFPOAH9FMqB5ygLH6SALJvfT4s/UnDw/svN76\" crossorigin=\"anonymous\"\u003e\u003c/script\u003e\n```\n\n\n## Usage\n\n### Import\nFor `module` type, you'll need to import correctly the `AutoInput` class:\n```js\nimport AutoInput from \"./autoinput.esm.js\";\n```\n\n### Initiate the class:\nFirst of all, you need to instantiate the `AutoInput` class:\n\n```js\nconst autoinput = new AutoInput(options);\n```\n\nThe class could take some `options` as an `object`. All options are optional.\n\nname | type | default value | description\n---- | ---- | ------------- | -----------\n`autoEnd` | `boolean` | `true` | Fired an event when the text is completed.\n`selectAuto` | `boolean` | `true` | Will automatically focus the first input field (just after initializing fields).\n`canPast` | `boolean` | `true` | Enable / disable pasting in fields.\n`createAuto` | `boolean` | `false` | Will automatically create input field for you.\n`buttonCallback` | `boolean` | `false` | Add the `onClick` listener on the `validate` button. If the user click on that one, this will trigger automatically the [`callback` function](#onvalidate).\n`beforeFire` | `number` | `400` | Will waits `beforeFire` milliseconds before firing the automatic event.\n`onCreate` | `Function` | `null` | The callback when creates the input fields. This allows you to add some property on the `HTMLElement` or change it completly.\n`parent` | `HTMLElement` | `#a2fParent` or `[data-parent-a2f]` | The parent element into which the input fields will be injected.\n`validate` | `HTMLElement` | `[data-button-validate]` | The submit button to validate the 2fa code.\n\nIf you don't want the `createAuto` option, you can create input yourself. But keep in mind that they need to have the `data-a2f` attributes.\n\n#### `autoEnd`:\nThis option will fired the `callback` function, and click on the `validate` button when the 2FA code is completely filled.\n\nThe [`callback` function](#onvalidate) can be registered by calling the public `onValidate` method.\n\n#### `createAuto`:\nThis option will automatically create the input fields for you. The elements will be `appendChild` to the `parent` HTMLElement. During the creation of the input fields, if the `onCreate` callback is defined, it'll be fired for each input field.\n\nThe number of created field is 6.\n\n#### `buttonCallback`:\nIf enabled, when the `autoEnd` option is enabled, it will emit the `onClick` event on the `validate` HTMLButton.\n\n#### `beforeFire`:\nThe time in miliseconds waited by the class before calling the [`callback` function](#onvalidate), and fired the `onClick` event.\n\n#### `onCreate`:\nThis function will be called when the input fields are created. The function will take the create `HTMLElement` as argument, and should also returned an `HTMLElement` which will be added to the DOM. If nothing is returned from the function, the element will not be added.\nThis can be usefull if you want to add custom classes or attributes to the input fields. Or if you want to change the type of the input fields, by adding a more complex structure to it.\n\nHowever, you can also completely remove the field if you do not want it.\n\n### Methods:\n#### `onValidate`:\nThis method will register the `callback` function. The `callback` function will be called when the 2FA code is completely filled with the [`autoEnd` option](#autoend) enabled, or if the user click on the `validate` button and the [`buttonCallback` option](#buttoncallback) is enabled.\n\nCallback function prototype:\n```ts\nfunction onValidate(code: string): void;\n```\n\n#### `getCode`:\nThis function allows you to get the 2FA code. It will return a `string` with the 2FA code.\n\nIf all fields are not complete, the function will still return a string with the fields filled in.\n\nFor example, if your field 0, 1, 3 and 5 are field with:\n`5 2 . 4 . 1`, the function will return `5241`.\n\nFunction prototype:\n```ts\nfunction getCode(): string;\n```\n\n#### `removeEntries`:\nAllows you to clear each input fields values. Just a simple for reset.\n\nFunction prototype:\n```ts\nfunction removeEntries(): void;\n```\n\n#### `stopAutoEnd`:\nThis function will disable the `autoEnd` option. This can be usefull if you want to disable the automatic validation when the 2FA code is completely filled.\n\nFunction prototype:\n```ts\nfunction stopAutoEnd(): void;\n```\n\n#### `startAutoEnd`:\nThis function will enable the `autoEnd` option. This can be usefull if you want to enable the automatic validation when the 2FA code is completely filled and you got an error for example.\n\nFunction prototype:\n```ts\nfunction startAutoEnd(): void;\n```\n\n#### `toggleAutoEnd`:\nThis function will toggle the `autoEnd` option.\n\nFunction prototype:\n```ts\nfunction toggleAutoEnd(): void;\n```\n\n\n## Example:\n### Automatic fields creation\nFor example, you want to create automatically 6 input fields, and validate the form when all fields are filled in correctly after 800 miliseconds.\n\nBecause we have the `buttonCallback` enabled, if the user click on the validation button, the `onValidate` function will be automatically called.\n\nBut we can have a problem if the user is going to click on the `validate` button before the 800 miliseconds. To avoid this, we can disable the `buttonCallback` option by calling the `stopAutoEnd` method during the server verification.\n\u003e ⚠️ This will not disabled the `onValidate` function call when the user click on it.\n\nFor each created input fields, we want to add some classes to it. We can do this by using the `onCreate` callback.\n\nIf the input field is a `SPAN`, we don't want a `span` element (the dash `-` between the input fields) to be added to the DOM. So we can return `null` in this case.\n\nOtherwise, we'll add some classes to our element. But if the inserted element is the fourth one, we'll add a margin to the left. Then, we'll return the element.\n\n\n```js\nconst input = new AutoInput({\n\tcreateAuto: true,\n\tparent: document.getElementById(\"2fa_container\"),\n\tvalidate: document.getElementById(\"validate_2fa_code\"),\n\tbuttonCallback: true,\n\tbeforeFire: 800,\n\tonCreate: (element, i) =\u003e {\n\t\tif (element.tagName === \"SPAN\")\n\t\t\treturn (null);\n\t\telement.classList.add(\"form-control\");\n\t\telement.classList.add(\"otp_input\");\n\t\telement.classList.add(i === 3 ? \"ms-3\" : \"ms-1\");\n\t\telement.classList.add(\"me-1\");\n\t\telement.classList.add(\"text-center\");\n\n\t\treturn (element);\n\t}\n});\n\nfunction onValidate(code) {\n\t// do something with the code...\n\tinput.stopAutoEnd();\n\n\tfetch(\"/api/code\", {\n\t\tmethod: \"POST\",\n\t\tbody: JSON.stringify({ code }),\n\t\theaders: {\n\t\t\t\"Content-Type\": \"application/json\"\n\t\t}\n\t}).then(res =\u003e {\n\t\tif (res.ok) {\n\t\t\t// do something...\n\t\t} else {\n\t\t\t// do something...\n\n\t\t\t// enable the autoEnd\n\t\t\tinput.startAutoEnd();\n\n\t\t\t// clear the input fields\n\t\t\tinput.removeEntries();\n\t\t}\n\t});\n}\n\ninput.onValidate(onValidate);\n```\n\n### Manual fields creation\n\nFor example, you want a static complex structure, or have a different of input fields, that'll not be generated by JavaScript or by the script because it's too complex.\nYou can create your complex structure. Just think of the only thing needed by `auto-input-a2f` is that your `input` field exists and has at least a `data-a2f` attribute.\n```html\n\u003cdiv id=\"2fa_container\"\u003e\n\t\u003cdiv\u003e\n\t\t\u003cinput type=\"text\" data-a2f\u003e\n\t\u003c/div\u003e\n\t\u003cdiv\u003e\n\t\t\u003cinput type=\"text\" data-a2f\u003e\n\t\u003c/div\u003e\n\t\u003cdiv\u003e\n\t\t\u003cinput type=\"text\" data-a2f\u003e\n\t\u003c/div\u003e\n\t\u003cdiv\u003e\n\t\t\u003cinput type=\"text\" data-a2f\u003e\n\t\u003c/div\u003e\n\t\u003cbutton id=\"validate_2fa_code\"\u003eValdidate\u003c/button\u003e\n\u003c/div\u003e\n```\n\nSame thing than for the previous example:\n```js\nconst input = new AutoInput({\n\tparent: document.getElementById(\"2fa_container\"),\n\tvalidate: document.getElementById(\"validate_2fa_code\"),\n\tbuttonCallback: true,\n\tbeforeFire: 800\n});\n\nfunction onValidate(code) {\n\t// do something with the code...\n\tinput.stopAutoEnd();\n\n\tfetch(\"/api/code\", {\n\t\tmethod: \"POST\",\n\t\tbody: JSON.stringify({ code }),\n\t\theaders: {\n\t\t\t\"Content-Type\": \"application/json\"\n\t\t}\n\t}).then(res =\u003e {\n\t\tif (res.ok) {\n\t\t\t// do something...\n\t\t} else {\n\t\t\t// do something...\n\n\t\t\t// enable the autoEnd\n\t\t\tinput.startAutoEnd();\n\n\t\t\t// clear the input fields\n\t\t\tinput.removeEntries();\n\t\t}\n\t});\n}\n\ninput.onValidate(onValidate);\n```\n\nAnd you'll have the same behavior. Just, the only difference is that you'll only have 4 fields.","project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fpioupia%2Fauto-input-a2f","html_url":"https://awesome.ecosyste.ms/projects/github.com%2Fpioupia%2Fauto-input-a2f","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fpioupia%2Fauto-input-a2f/lists"}