vaadin-text-field

Live Demo →
API Documentation →

Fixes

• f866acc Fix clear button related bug (#366)

  Programmatically setting the value after clicking the clear button didn't work properly making the input look like empty but displaying the clear button and the component still had a value. This caused more easily noticeable issues with other components that internally use vaadin-text-field (when using the clear button). This was a regression introduced in v2.4.0.

  Fixes #365

Changes Since v2.4.1:

• 6c4e6b2 chore(test): fix typos [skip ci]

• 9ef27ec chore: update installation docs, add number-field [skip ci]

Live Demo →
API Documentation →

Fixes

• Fixed the issue making it impossible to extend the vaadin-number-field (#360)

Changes Since v2.3.6:

• e44c57c fix: always return memoizedTemplate in number-field

Live Demo →
API Documentation →

Fixes

• Fixed the issue making it impossible to extend the vaadin-number-field (#360)

Changes Since v2.4.0:

• 94142f6 fix: always return memoizedTemplate in number-field

Live Demo →
API Documentation →

Fixes

• Various number-field fixes to align with native input number

Changes Since v2.3.5:

• 7609100 Refactor and fix step calculation (#343)

• 79d87d7 Fix number-field value and step issues (#333)

Live Demo →
API Documentation →

New Features

• Added i18n API for clear button accessible label (#354)

Changes Since v2.3.5:

• e695d79 feat: prevent default on clear button click (#355)

• 9026830 feat: add i18n API for clear button accessible label (#354)

• c550414 feat: add input event support (test, doc, dispatch on clear) (#353)

• 7609100 Refactor and fix step calculation (#343)

• 79d87d7 Fix number-field value and step issues (#333)

Live Demo →
API Documentation →

Changes Since v2.3.4:

• dc44533 Fix host attribute propagation (#338)

  • Update tests to check if prop can be set multiple times

  • Improve check for host attribute change

  • Add test explanation [skip ci]

  • Simplify attribute value checking logic

• a738dbe Improve selector for ff47 (#337)

• 6244663 Update visual tests due to recent style changes (#336)

Live Demo →
API Documentation →

Changes Since v2.3.3:

• 28c2fff Remove preventInput flag on requestAnimationFrame (#329)

  • Remove preventInput flag on requestAnimationFrame

  • Test the case with invalid input prevention

  • Replace timeout with raf in the test

  • Remove flag in onInput listener as well

• e8ea5d8 fix: align text-field properly in material theme (#330)

• 7b6fe6e fix: replace lumo leftovers in number-field material (#327)

Live Demo →
API Documentation →

Changes Since v2.3.2:

• c06fc68 Simplify input event prevention (#326)

• 647678d refactor: do not bind validate method as blur listener (#322)

Live Demo →
API Documentation →

Changes Since v2.3.1:

• 00ad254 Introduce inputElement getter (#317)

• 7ee4ae5 fix: workaround slotted password field -ms-reveal [skip ci] (#316)

Live Demo →
API Documentation →

Changes Since v2.3.0:

• 2789a8d Update element version numbers (#314)

• 8a5f0ac Clear the native input value when setting to undefined (#313)

Live Demo →
API Documentation →

New Components

• <vaadin-number-field> is a web component for numeric input with controls:

<vaadin-number-field
  min="0"
  max="100"
  step="5"
  has-controls
></vaadin-number-field>

• <vaadin-email-field> is a web component providing email field with pattern

New Features

• autoselect property allowing to select the text-field content on focus

• clear-button-visible attribute allowing to show clear button icon

• input-prevented attribute allowing to visualise the invalid input prevention

Changes Since v2.3.0-beta1:

• 8ac18e3 Fix number field controls behaviour when value is out of range (#307)

• 7079f8d Update reference screenshots (#309)

Live Demo →
API Documentation →

Changes Since v2.3.0-alpha8:

• 12d28b8 Fix typo in reflectToAttribute for hasControls (#308)

Live Demo →
API Documentation →

Changes Since v2.1.7:

• 78beed2 Fix setting min/max value with controls (#303)

• a6d0e1a Add type to step property

• 68b39bc Align stepper buttons to middle (#305)

• 471a367 Copy textarea style overrides from Lumo to Material (#302)

Live Demo →
API Documentation →

Changes Since v2.1.6:

• ddb2d86 Copy textarea style overrides from Lumo to Material (#302)

Live Demo →
API Documentation →

Features

• Added <vaadin-number-field> element

Changes Since v2.3.0-alpha6:

• 555edd8 fix: ensure slotchange input listeners removal does not throw (#300)

• 9bed48b feat: add vaadin-number-field element (#110)

Live Demo →
API Documentation →

Changes Since v2.1.5:

• b64e791 Don't flex-grow the input-field part of a text-field (#299)

Live Demo →
API Documentation →

Features

• Added <vaadin-email-field> element

• Added input-prevented attribute to visualise the case when invalid input is prevented

Changes Since v2.3.0-alpha4:

• 514940e fix(bower): update main field for modulizer [skip ci]

• b7bb4a3 feat: add component (#290)

• d2b02de Don't flex-grow the input-field part of a text-field (#299)

• f6f9c96 feat: add visualisation when invalid input is prevented (#291)

• 090aa2f chore(demo): add when-defined for demo snippets

• 059b0d2 chore(bower): update vaadin-demo-helpers, remove iron-demo-helpers

• cc482d5 docs(autoselect): add demo for autoselect property

• 72a91e1 fix(autoselect): add workaround for selecting text in IOS 9

• 6c0b680 Explicitly specify port in 'npm start' script

Live Demo →
API Documentation →

Changes Since v2.3.0-alpha3:

• 012c2c8 feat(API): add autoselect, automatically select content when focused (#294)

  • Implement #288 autoselect; automatically select content when focused.

  • Make focus() work on headless for tests.

  • Rename autoselect methods, add/remove along w/ other listeners, reformat.

• 8e9010a Add 'npm start' script

Live Demo →
API Documentation →

Live Demo →
API Documentation →

Changes Since v2.0.2:

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