mirror of
https://github.com/chrisburnell/url-input.git
synced 2026-01-08 18:33:22 +00:00
A Web Component to add a protocol to URL inputs.
https://chrisburnell.com/url-input/
custom-element
customelement
custom-elements
customelements
javascript
npm
web-component
webcomponent
web-components
webcomponents
| .github | ||
| .editorconfig | ||
| .npmignore | ||
| .prettierignore | ||
| .prettierrc | ||
| demo.html | ||
| LICENSE | ||
| package-lock.json | ||
| package.json | ||
| README.md | ||
| url-input.js | ||
| url-input.test.js | ||
<url-input>
A Web Component to add a protocol to URL inputs.
Examples
General usage example
<script type="module" src="url-input.js"></script>
<url-input><input type="url"></url-input>
Installation
You have a few options (choose one of these):
- Install via npm:
npm install @chrisburnell/url-input - Download the source manually from GitHub into your project.
- Skip this step and use the script directly via a 3rd party CDN (not recommended for production use)
Usage
Make sure you include the <script> in your project (choose one of these):
<!-- Host yourself -->
<script type="module" src="url-input.js"></script>
<!-- 3rd party CDN, not recommended for production use -->
<script
type="module"
src="https://www.unpkg.com/@chrisburnell/url-input/url-input.js"
></script>
<!-- 3rd party CDN, not recommended for production use -->
<script
type="module"
src="https://esm.sh/@chrisburnell/url-input"
></script>
Credit
With thanks to the following people:
- David Darnes for creating this Web Component repo template
- Aaron Parecki for creating the
addDefaultSchemefunction that this Web Component uses