https://github.com/chrisburnell/url-input

A Web Component to add a protocol to URL inputs.
https://github.com/chrisburnell/url-input

custom-element custom-elements customelement customelements javascript web-component web-components webcomponent webcomponents

Last synced: 1 day ago
JSON representation

A Web Component to add a protocol to URL inputs.

• Host: GitHub
• URL: https://github.com/chrisburnell/url-input
• Owner: chrisburnell
• License: mit
• Created: 2024-08-10T14:43:49.000Z (about 2 months ago)
• Default Branch: main
• Last Pushed: 2024-08-10T18:02:21.000Z (about 2 months ago)
• Last Synced: 2024-09-21T02:02:03.788Z (6 days ago)
• Topics: custom-element, custom-elements, customelement, customelements, javascript, web-component, web-components, webcomponent, webcomponents
• Language: JavaScript
• Homepage: https://chrisburnell.com/url-input/
• Size: 7.81 KB
• Stars: 0
• Watchers: 1
• Forks: 0
• Open Issues: 0
• Metadata Files:
  • Readme: README.md
  • Funding: .github/FUNDING.yml
  • License: LICENSE

Awesome Lists containing this project

README

        
# ``

A Web Component to add a protocol to URL inputs.

**[Demo](https://chrisburnell.github.io/url-input/demo.html)** | **[Further reading](https://chrisburnell.com/url-input/)**

## Usage

### General usage example

```html

```

## Installation

You have a few options (choose one of these):

1. Install via [npm](https://www.npmjs.com/package/@chrisburnell/url-input): `npm install @chrisburnell/url-input`

1. [Download the source manually from GitHub](https://github.com/chrisburnell/url-input/releases) into your project.

1. Skip this step and use the script directly via a 3rd party CDN (not recommended for production use)

## Usage

Make sure you include the `` in your project (choose one of these):

```html

<!-- Host yourself -->

<script type="module" src="url-input.js">

```

```html

```

```html

```

## Credit

With thanks to the following people:

- [David Darnes](https://darn.es) for creating this [Web Component repo template](https://github.com/daviddarnes/component-template)

- [Aaron Parecki](https://aaronparecki.com) for creating [the `addDefaultScheme` function](https://aaronparecki.com/2019/05/13/2/https) that this Web Component uses