Contact us Create app

Directory

← Back

text-input

Polymer-based web component for D2L text inputs

Author

Rating

Links

Popularity

<100

[ This description is mirrored from README.md at github.com/BrightspaceUI/text-input on 2019-05-10 ]

d2l-text-input

Published on webcomponents.org Bower version Build status

Polymer-based web component for D2L text inputs.

screenshot of text input component

For further information on this and other Brightspace UI components, see the docs at ui.developers.brightspace.com.

Installation

d2l-text-input can be installed from Bower:

bower install d2l-text-input

Usage

Include the webcomponents.js "lite" polyfill (for browsers who don't natively support web components), then import the component as needed:

<head>
  <script src="../webcomponentsjs/webcomponents-lite.js"></script>
  <link rel="import" href="../d2l-text-input/d2l-text-input.html">
</head>

Then use the <d2l-text-input> custom element in your application.

<d2l-text-input name="myInput" value="input value"></d2l-text-input>

Many of the same attributes from native <input type="text"> are available:

<d2l-text-input disabled></d2l-text-input>

Developing, Testing and Contributing

After cloning the repo, run npm install to install dependencies.

If you don't have it already, install the Polymer CLI globally:

npm install -g polymer-cli

To start a local web server that hosts the demo page and tests:

polymer serve

To lint (eslint and Polymer lint):

npm run test:lint

To run unit tests locally using Polymer test:

npm run test:polymer:local

To lint AND run local unit tests:

npm test

Compatibility

(Loading compatibility data...)

Last updated: 2017-10-18

Was this helpful? Need more help?
Leave a comment or a question below. You can also join the chat on Discord or ask questions on StackOverflow.

Version

Dependencies

  • d2l-colors#^3.1.2
  • d2l-polymer-behaviors#>=1.4.0 <2.0
  • d2l-typography#^6.1.2
  • polymer#1 - 2
Released
2018-08-30
Maturity
IMPORTED
License
Apache License 2.0

Compatibility

Framework
Polymer 2.0+
Browser
Browser Independent

text-input - Vaadin Add-on Directory

Polymer-based web component for D2L text inputs text-input - Vaadin Add-on Directory
**[ This description is mirrored from README.md at [github.com/BrightspaceUI/text-input](https://github.com//BrightspaceUI/text-input/blob/v0.6.0/README.md) on 2019-05-10 ]** # d2l-text-input [![Published on webcomponents.org](https://img.shields.io/badge/webcomponents.org-published-blue.svg)](https://www.webcomponents.org/element/BrightspaceUI/text-input) [![Bower version][bower-image]][bower-url] [![Build status][ci-image]][ci-url] [Polymer](https://www.polymer-project.org)-based web component for D2L text inputs. ![screenshot of text input component](/text-input.gif?raw=true) For further information on this and other Brightspace UI components, see the docs at [ui.developers.brightspace.com](http://ui.developers.brightspace.com/). ## Installation `d2l-text-input` can be installed from [Bower][bower-url]: ```shell bower install d2l-text-input ``` ## Usage Include the [webcomponents.js](http://webcomponents.org/polyfills/) "lite" polyfill (for browsers who don't natively support web components), then import the component as needed: ```html ``` Then use the `` custom element in your application. ```html ``` Many of the same attributes from native [`` are available](https://developer.mozilla.org/en/docs/Web/HTML/Element/input): ```html ``` ## Developing, Testing and Contributing After cloning the repo, run `npm install` to install dependencies. If you don't have it already, install the [Polymer CLI](https://www.polymer-project.org/2.0/docs/tools/polymer-cli) globally: ```shell npm install -g polymer-cli ``` To start a [local web server](https://www.polymer-project.org/2.0/docs/tools/polymer-cli-commands#serve) that hosts the demo page and tests: ```shell polymer serve ``` To lint ([eslint](http://eslint.org/) and [Polymer lint](https://www.polymer-project.org/2.0/docs/tools/polymer-cli-commands#lint)): ```shell npm run test:lint ``` To run unit tests locally using [Polymer test](https://www.polymer-project.org/2.0/docs/tools/polymer-cli-commands#tests): ```shell npm run test:polymer:local ``` To lint AND run local unit tests: ```shell npm test ``` [bower-url]: http://bower.io/search/?q=d2l-text-input [bower-image]: https://badge.fury.io/bo/d2l-text-input.svg [ci-url]: https://travis-ci.org/BrightspaceUI/text-input [ci-image]: https://travis-ci.org/BrightspaceUI/text-input.svg?branch=master
Documentation
View on GitHub
Online Demo
GitHub Homepage
Issue tracker

text-input version 0.0.1
### Dependencies * d2l-colors#^2.4 || ^3.1.0 * d2l-typography#^5.4.0 || ^6.0.0 * polymer#Polymer/polymer#1.9 - 2

text-input version 0.0.2
### Dependencies * d2l-colors#^2.4 || ^3.1.0 * d2l-typography#^5.4.0 || ^6.0.0 * polymer#Polymer/polymer#1.9 - 2

text-input version 0.0.3
### Dependencies * d2l-colors#^2.4 || ^3.1.0 * d2l-typography#^5.4.0 || ^6.0.0 * polymer#Polymer/polymer#1.9 - 2

text-input version 0.1.0
### Dependencies * d2l-colors#^2.4 || ^3.1.0 * d2l-typography#^5.4.0 || ^6.0.0 * polymer#Polymer/polymer#1.9 - 2

text-input version 0.2.0
### Dependencies * d2l-colors#^3.1.2 * d2l-polymer-behaviors#^1.3.0 * d2l-typography#^6.1.2 * polymer#1 - 2

text-input version 0.3.0
### Dependencies * d2l-colors#^3.1.2 * d2l-polymer-behaviors#>=1.4.0 <2.0 * d2l-typography#^6.1.2 * polymer#1 - 2

text-input version 0.4.0
### Dependencies * d2l-colors#^3.1.2 * d2l-polymer-behaviors#>=1.4.0 <2.0 * d2l-typography#^6.1.2 * polymer#1 - 2

text-input version 0.5.0
### Dependencies * d2l-colors#^3.1.2 * d2l-polymer-behaviors#>=1.4.0 <2.0 * d2l-typography#^6.1.2 * polymer#1 - 2

text-input version 0.6.0
### Dependencies * d2l-colors#^3.1.2 * d2l-polymer-behaviors#>=1.4.0 <2.0 * d2l-typography#^6.1.2 * polymer#1 - 2

Online