{"id":15048332,"url":"https://github.com/github/restricted-input","last_synced_at":"2025-10-04T10:30:41.981Z","repository":{"id":65974894,"uuid":"101898496","full_name":"github/restricted-input","owner":"github","description":"Restrict \u003cinput\u003es to certain valid characters (e.g. formatting phone or card numbers)","archived":true,"fork":true,"pushed_at":"2017-09-07T10:34:46.000Z","size":154,"stargazers_count":8,"open_issues_count":0,"forks_count":10,"subscribers_count":2,"default_branch":"master","last_synced_at":"2024-09-30T00:41:02.991Z","etag":null,"topics":[],"latest_commit_sha":null,"homepage":null,"language":"JavaScript","has_issues":false,"has_wiki":null,"has_pages":null,"mirror_url":null,"source_name":"braintree/restricted-input","license":"mit","status":null,"scm":"git","pull_requests_enabled":true,"icon_url":"https://github.com/github.png","metadata":{"files":{"readme":"README.md","changelog":"CHANGELOG.md","contributing":null,"funding":null,"license":"LICENSE","code_of_conduct":null,"threat_model":null,"audit":null,"citation":null,"codeowners":null,"security":null,"support":null}},"created_at":"2017-08-30T15:30:16.000Z","updated_at":"2024-07-31T03:19:40.000Z","dependencies_parsed_at":"2023-02-19T18:01:04.147Z","dependency_job_id":null,"html_url":"https://github.com/github/restricted-input","commit_stats":null,"previous_names":[],"tags_count":18,"template":false,"template_full_name":null,"repository_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/github%2Frestricted-input","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/github%2Frestricted-input/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/github%2Frestricted-input/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/github%2Frestricted-input/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/github","download_url":"https://codeload.github.com/github/restricted-input/tar.gz/refs/heads/master","host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":235238014,"owners_count":18958033,"icon_url":"https://github.com/github.png","version":null,"created_at":"2022-05-30T11:31:42.601Z","updated_at":"2022-07-04T15:15:14.044Z","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":[],"created_at":"2024-09-24T21:10:58.088Z","updated_at":"2025-10-04T10:30:41.571Z","avatar_url":"https://github.com/github.png","language":"JavaScript","funding_links":[],"categories":[],"sub_categories":[],"readme":"Restricted Input\n================\n\nAllow restricted character sets in `input` elements.\n\n## Demo\n\nTry the latest version of Restricted Input [here](https://braintree.github.io/restricted-input/).\n\n## Features\n\n- Disallow arbitrary chars based on patterns\n- Maintains caret position\n- Format/Update on paste\n- Works in IE9+\n\n## Development\n\n**Install dependencies**\n\n```bash\n$ npm i\n```\n\n**Watch files and run server**\n\n```bash\n$ npm run development\n```\n\nThis will start a server on port `3099` which can be overridden with the `PORT` env var.\n\n**Run tests**\n\nThere are unit tests:\n\n```bash\n$ npm t\n```\n\n## Usage\n\n```javascript\nimport RestrictedInput from 'restricted-input';\n\nconst formattedCreditCardInput = new RestrictedInput({\n  element: document.querySelector('#credit-card'),\n  pattern: '{{9999}} {{9999}} {{9999}} {{9999}}'\n});\n```\n\n## Patterns\n\nPatterns are a mixture of [`Placeholder`](#placeholder)s and [`PermaChar`](#permachar)s.\n\n### Placeholder\n\nA `Placeholder` is the part of the pattern that accepts user input based on some restrictions. A placeholder is defined in the pattern using two open curly brackets, the placeholder, followed by two closing curly brackets e.g. `{{Abc123}}`.\n\nThe patterns a `Placeholder` can be are:\n - a single alpha character that matches the alpha regex `/[A-Za-z]/`. e.g. `{{C}}` will match one alpha character.\n - a single digit that matches the digit regex `/[0-9]/`. e.g. `{{3}}` will match one digit.\n - a `*` character that matches `/./`. e.g. `{{*}}` will match the next character.\n\n### PermaChar\n\nA `PermaChar` is the part of the pattern that is automatically inserted. `PermaChar`s are defined in the pattern as any characters other than `Placeholder`s.\n\n### Example patterns\n\nSome example patterns with behavior are listed:\n - `12{{3}}`\n   - Inserts `12`.\n   - Waits for a single digit from the user.\n - `{{A}}BC`\n   - Waits for a single alpha from the user.\n   - Inserts `BC`.\n - `${{*2L}}E`\n   - Inserts `$`.\n   - Waits for any single character input from the user.\n   - Waits for a single digit from the user.\n   - Waits for a single alpha from the user.\n   - Inserts `E`.\n\n## API\n\n### options\n\n| Key | Type | Description |\n| --- | ---- | ----------- |\n| element | `HTMLInputElement` or `HTMLTextAreaElement` | A valid reference to an `input` or `textarea` DOM node |\n| pattern | `String` | Pattern describing the allowed character set you wish for entry into corresponding field. See [Patterns](#Patterns).|\n\n## Browser Support\n\n**Desktop**\n\n- Chrome (latest)\n- Firefox (17+)\n- Safari (8+)\n- IE11 (desktop/metro)\n- IE10 (desktop/metro)\n- IE9\n\n## Browsers Where Formatting is Turned Off Automatically\n\nOld versions of Samsung Android browsers are incompatible with formatting. These will not attempt to intercept the values and format the input.\n\n## TODO\n\n- [ ] Improve jsdoc\n- [ ] Add example guides/pages\n","project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fgithub%2Frestricted-input","html_url":"https://awesome.ecosyste.ms/projects/github.com%2Fgithub%2Frestricted-input","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fgithub%2Frestricted-input/lists"}