vaadin-text-field

Live Demo →
API Documentation →

Changes Since v2.3.0-alpha2:

• bbf303c Use focusout instead of blur for cached change event dispatching (#286)

• 74607f2 Revert "Align text field to baseline". This reverts commit 538aadd11a9b323c8329a1f836948174b942c09e.

Live Demo →
API Documentation →

Changes Since v2.3.0-alpha1:

• 39e84f5 Animationend update height (#278)

  • Add test for checking height on content updates and toggling visibility

  • Update height on appear animationend

  • Update test by decreasing cycles number and increasing the interval

  • Update tests for appear and updating height, align with form-layout

• 2165296 Update tests, add _valueClearing flag and dispatch change on clear button click (#280)

Live Demo →
API Documentation →

Changes Since v2.1.4:

• 157aaf9 Add clear button (#277)

  • Add tests for clear button

  • Add clear button and its functionality

  • Add styling for clear button

  • Add clear button demos

  • Update visual tests and screenshots

  • Switch from mousedown to click event, get rid of redundant slot attr, remove text-area and password-field demos

  • Manually setting hidden attr depending on state - workaround for ie11 and edge

Live Demo →
API Documentation →

Changes Since v2.1.3:

• 1e4425c Fix demos: check if custom element already defined (#276)

• 9153ada Don't throw an error when focusing a newly created text-field

• 77d20f6 Dispatch iron-resize event on text-area height change

Live Demo →
API Documentation →

Changes Since v2.1.2:

• 538aadd Align text field to baseline

• 6540fff Reorganise demos

• 211fef4 Update text-field styles to use required field mixin

Live Demo →
API Documentation →

Changes Since v2.1.1:

• 5011b4b Added visual tests for Material theme. (#251)

• b6f78f8 Remove will-change property to prevent grid scroll issue (#253)

• ed19a79 Revert using headless Firefox, only use headless Chrome for now

• 401340d Add Sauce Labs mention

• 1164629 Update .gitignore

• 22cf0d2 Use files property of package.json instead of .npmignore [skip ci]

Live Demo →
API Documentation →

Changes Since v2.0.2:

• 514f0f1 Update vaadin-element-mixin to 2.0.0

• 71f8970 Restore working gemini config for visual tests

• 254ece8 Run tests in headless Chrome and Firefox, use sudo: false in travis

• 910b18c Remove analysis.json [skip ci]

• 2e4f983 Exclude visual tests for PR builds in travis [skip ci]

• 2cac0d7 Remove Polymer mention [skip ci]

• b92f289 Use @vaadin/vaadin-component-dev-dependencies

• 6598e80 2.1.0-beta2

• 4bcd19c Update bower main to inclue MD for modulizer conversion

• 0a8c184 2.1.0-beta1

• a8c4ea8 Update vaadin dependencies

• 7d220cc Update visual tests to cover readonly text-field and text-area

• 9e0d797 Fix textarea styles in readonly mode

• 339c882 Update some Vaadin dependencies to latest versions

• 5aee66d Use stable polymer-modulizer (#242)

  • Use stable polymer-modulizer

• c13dbf6 Update SauceLabs platforms: align with skeleton

• 5ba3d84 Add contributing guideline link: align with skeleton [skip ci]

• 7278e1f Update entry points in README [skip ci]

• c7eda2e Update README.md to contain information about Material theme

• eff94c9 2.1.0-alpha3

• 71b55ec Fix Bower semver ranges (#238)

• 8496264 Fixed end of line problem with gulp-html-extract plugin on Windows.

• 2ebeae2 Align with skeleton: Run visual tests against Chrome and Firefox only (#236)

  • Align with skeleton: Run visual tests against Chrome and Firefox only

  • Update chrome version and screenshots

• 09c5f86 Align with skeleton: Remove Polymer 2 mention

• 9a00729 2.1.0-alpha2

• 1de0ddc Do not depend on p3-preview

• 1540179 update screenshots

• f217e2b Add test coverage threshold

• 801bdae 2.1.0-alpha1

• 25f5b5f Import styles file instead of element in text-area

• 88ba3af Remove unneded hash in version

• e24d8fc Move src import from styled file to element one

• 1ff1ab2 Depend on stable version of material styles

• 8d1966a Adding theme/material

• c5bb4da Bump analysis.json

• c339c33 Add documentation for suffix and prefix

• caa279f fix linter

• cb494dd Enable visual tests

• bf05365 Avoid polymer-cli linter breaking when empty style blocks.

  Isue reported at https://github.com/Polymer/tools/issues/408

• db79ab2 Fix lint error introduced in 1d0aea29 to fix CI build

• d848b67 Remove Bower badge [skip ci]

• bca48f6 Update polymer-cli to latest, disable lint because of regression

• 0fca2f4 Update modulizer: depend on stable Polymer and webcomponentsjs

• ee0a7cb Update main level elements (#222)

• 0b7f452 Add Directory badges [skip ci]

• 1b7b9b2 2.0.1-pre.2

• bcd5ea2 Add installation instructions [skip ci]

• df2cec9 Update to use latest modulizer and webcomponents polyfill

• 52e7008 Rollback polymer-cli to stable to fix lint warning

• 1fda6af Run P3 tests in all browsers. Bump node to 8.11

• 72bb347 2.0.1-pre.1

• be01d31 Add directory description to npmignore

• c51e71b Run P3 tests in Firefox and Edge

• 471cc78 Add missing JSDoc annotation

• 291f978 Use bare module specifiers in the P3 conversion

• faa9184 Fix build

• ae1a27e Alin with skeleton: update travis config and browsers

• 753b21c 2.0.0-pre.1

• b4a615c P3 preview dev (#211)

Live Demo →
API Documentation →

Changes Since v2.0.1:

• f8d72bb Fix textarea styles in readonly mode (#240)

Live Demo →
API Documentation →

Changes Since 2.1.0-alpha2:

• 4bcd19c Update bower main to inclue MD for modulizer conversion
• a8c4ea8 Update vaadin dependencies
• 7d220cc Update visual tests to cover readonly text-field and text-area
• 9e0d797 Fix textarea styles in readonly mode
• 339c882 Update some Vaadin dependencies to latest versions
• 5aee66d Use stable polymer-modulizer (#242) - * Use stable polymer-modulizer
• 71b55ec Fix Bower semver ranges (#238)
• 8496264 Fixed end of line problem with gulp-html-extract plugin on Windows.

Live Demo →
API Documentation →

Changes Since 2.1.0-alpha1:

• 1de0ddc Do not depend on p3-preview
• 1540179 update screenshots
• 647b485 Merge branch 'master' into p3-preview

Changes Since 2.0.1:

• 25f5b5f Import styles file instead of element in text-area
• 88ba3af Remove unneded hash in version
• e24d8fc Move src import from styled file to element one
• 1ff1ab2 Depend on stable version of material styles
• 8d1966a Adding theme/material
• c5bb4da Bump analysis.json
• c339c33 Add documentation for suffix and prefix
• caa279f fix linter
• cb494dd Enable visual tests
• bf05365 Avoid polymer-cli linter breaking when empty style blocks. - Isue reported at https://github.com/Polymer/tools/issues/408
• db79ab2 Fix lint error introduced in 1d0aea29 to fix CI build
• d848b67 Remove Bower badge [skip ci]
• ee0a7cb Update main level elements (#222)
• 0b7f452 Add Directory badges [skip ci]

Live Demo →
API Documentation →

⚠️ Breaking Changes Since v1.x:

• The element uses Lumo theme by default. The previous default theme has been dropped. You can import the unstyled version from the src/vaadin-text-field.html

New Features Since v1.x:

• Added has-label state attribute for styling. The attribute is set on the host element, when it's label property is not undefined, null or empty string.
• Added autocapitalize attribute allowing to disable or configure browser-specific behavior

Changes Since v2.0.0-beta4:

• 851a159 Adding description file for Vaadin Directory

Live Demo →
API Documentation →

Changes Since v2.0.0:

• 987dab2 Make sure input change gets called on blur

Live Demo →
API Documentation →

Changes Since v2.0.0-beta3:

• 555685f Align with skeleton: use stable Chrome in travis

• 5190e16 Fix reveal-button scrolling behavior for iOS

• 04aa623 Update gitter link in readme

Live Demo →
API Documentation →

Fixes

• Added the workaround to fix the IE11 bug with dispatching input event on placeholder attribute change, as well as on focus / blur when the placeholder attribute is present
• Fixed the label styles to prevent cropping some letters

Changes Since v2.0.0-beta2:

• 4c05e1c Update theme: use padding for label to prevent cropping letters
• 059c568 Workaround IE11 placeholder issues
• bf6fac3 Align with skeleton: refer to Vaadin components instead of elements
• 33ca31a Align with skeleton: update stylelint and gulp-stylelint
• 533b9c1 Enable tests for Safari 9

Live Demo →
API Documentation →

Changes Since v2.0.0-beta1:

• d80870a Don’t use global spacing properties for internal spacing
  • Use font relative spacing instead.
  • Use padding for host white space, so that it works the same as when vaadin-text-field is nested inside combo box, date picker and dropdown menu.
  • Fix Vaadin icon size when slotted inside vaadin-text-field (force box-sizing: border-box).
• 9cb09f2 Remove useless closing tag from demos
• eda46dd Wrap style tag with custom-style element

Live Demo →
API Documentation →

⚠️ Breaking Changes Since v1.x:

• The element uses Lumo theme by default. The previous default theme has been dropped. You can import the unstyled version from the src/vaadin-text-field.html

New Features Since v1.x:

• Added has-label state attribute for styling. The attribute is set on the host element, when it's label property is not undefined, null or empty string.
• Added autocapitalize attribute allowing to disable or configure browser-specific behavior

Changes Since v2.0.0-alpha10:

• d4d678a Align with skeleton: use node 8.9 in CI, bump polymer-cli to 1.6.0
• 500d74b Update eslint and stylelint to check ./src and ./theme
• 848d5cf Fix prefix and suffix icon color for polyfilled browsers
• 660cfa1 Minor Lumo update [skip ci]

Live Demo →
API Documentation →

Changes Since v2.0.0-alpha9:

• b8b89c9 Chore: fix whitespace, bump analysis.json

• 44404ef Report 'none' as value for no capitalization

• 62713e0 Add Chrome to autocapitalize supporting browsers

• 8c15b9c Add autocapitalize attribute

Live Demo →
API Documentation →

Changes Since v2.0.0-alpha8:

• ddfa599 Bump analysis.json

• 6505dd0 Dispatch change event on native input change

• 1a44fa1 Reindent lines

• 99ff3ac De-emphasize read-only field text

• 134e07d Remove unnecessary password field style override

  The default width is set using --vaadin-text-field-default-width
  property, and doesn’t need to take prefix and suffix elements into
  account.

• d831195 Fix icons used in visual tests

• d1c198f Align with skeleton: update eslint-plugin-html and gulp-stylelint

• f1f88e5 Redesigned readonly styles

  Make the readonly field visually more distinct from a normal and a
  disabled field.

  Hide the placeholder from readonly fields (previously it was hidden for
  disabled fields).

• 1d0aea2 Fix prefix/suffix alignment for vaadin-text-area

• f893eb3 Depend on latest Lumo styles changes

  Custom property rename: --lumo-icon-size → --lumo-icon-size-m

  Icon rename: magnifier → search

Live Demo →
API Documentation →

New Features

• Added has-label state attribute for styling. The attribute is set on the host element, when it's label property is not undefined, null or empty string.

Changes Since v2.0.0-alpha7:

• 5ab5d78 Fix password-field demo annotation
• 494cfbc Add has-label attribute for styling
• 169a80c Sync with skeleton: Switch back to using function closures