@vaadin/time-picker
Advanced tools
Comparing version 22.0.0-beta1 to 22.0.0-beta2
{ | ||
"name": "@vaadin/time-picker", | ||
"version": "22.0.0-beta1", | ||
"version": "22.0.0-beta2", | ||
"publishConfig": { | ||
@@ -36,9 +36,9 @@ "access": "public" | ||
"@polymer/polymer": "^3.0.0", | ||
"@vaadin/combo-box": "22.0.0-beta1", | ||
"@vaadin/component-base": "22.0.0-beta1", | ||
"@vaadin/field-base": "22.0.0-beta1", | ||
"@vaadin/input-container": "22.0.0-beta1", | ||
"@vaadin/vaadin-lumo-styles": "22.0.0-beta1", | ||
"@vaadin/vaadin-material-styles": "22.0.0-beta1", | ||
"@vaadin/vaadin-themable-mixin": "22.0.0-beta1" | ||
"@vaadin/combo-box": "22.0.0-beta2", | ||
"@vaadin/component-base": "22.0.0-beta2", | ||
"@vaadin/field-base": "22.0.0-beta2", | ||
"@vaadin/input-container": "22.0.0-beta2", | ||
"@vaadin/vaadin-lumo-styles": "22.0.0-beta2", | ||
"@vaadin/vaadin-material-styles": "22.0.0-beta2", | ||
"@vaadin/vaadin-themable-mixin": "22.0.0-beta2" | ||
}, | ||
@@ -50,3 +50,3 @@ "devDependencies": { | ||
}, | ||
"gitHead": "4cf8a9d0504994200c610e44b3676114fef49c1e" | ||
"gitHead": "f13833683e6667f6ca6678452db14aa6b7eac4a4" | ||
} |
@@ -1,11 +0,8 @@ | ||
# <vaadin-time-picker> | ||
# @vaadin/time-picker | ||
[<vaadin-time-picker>](https://vaadin.com/components/vaadin-time-picker) is a [Web Component](http://webcomponents.org) providing a time-selection field, part of the [Vaadin components](https://vaadin.com/components). | ||
A web component that allows to enter a time, either by typing, or by selecting from a set of pre-defined options. | ||
[Live Demo ↗](https://vaadin.com/components/vaadin-time-picker/html-examples) | ||
| | ||
[API documentation ↗](https://vaadin.com/components/vaadin-time-picker/html-api) | ||
[Documentation + Live Demo ↗](https://vaadin.com/docs/latest/ds/components/time-picker) | ||
[![npm version](https://badgen.net/npm/v/@vaadin/time-picker)](https://www.npmjs.com/package/@vaadin/time-picker) | ||
[![Published on Vaadin Directory](https://img.shields.io/badge/Vaadin%20Directory-published-00b4f0.svg)](https://vaadin.com/directory/component/vaadinvaadin-time-picker) | ||
[![Discord](https://img.shields.io/discord/732335336448852018?label=discord)](https://discord.gg/PHmkCKC) | ||
@@ -17,38 +14,41 @@ | ||
[<img src="https://raw.githubusercontent.com/vaadin/vaadin-time-picker/master/screenshot.gif" alt="Screenshot of vaadin-time-picker">](https://vaadin.com/components/vaadin-time-picker) | ||
[<img src="https://raw.githubusercontent.com/vaadin/web-components/master/packages/time-picker/screenshot.png" width="215" alt="Screenshot of vaadin-time-picker">](https://vaadin.com/docs/latest/ds/components/time-picker) | ||
## Installation | ||
Install `vaadin-time-picker`: | ||
Install the component: | ||
```sh | ||
npm i @vaadin/time-picker --save | ||
npm i @vaadin/time-picker | ||
``` | ||
Once installed, import it in your application: | ||
Once installed, import the component in your application: | ||
```js | ||
import '@vaadin/time-picker/vaadin-time-picker.js'; | ||
import '@vaadin/time-picker'; | ||
``` | ||
## Getting Started | ||
## Themes | ||
Vaadin components use the Lumo theme by default. | ||
Vaadin components come with two built-in [themes](https://vaadin.com/docs/latest/ds/customization/using-themes), Lumo and Material. | ||
The [main entrypoint](https://github.com/vaadin/web-components/blob/master/packages/time-picker/vaadin-time-picker.js) of the package uses the Lumo theme. | ||
To use the Material theme, import the correspondent file from the `theme/material` folder. | ||
To use the Material theme, import the component from the `theme/material` folder: | ||
## Entry points | ||
```js | ||
import '@vaadin/time-picker/theme/material/vaadin-time-picker.js'; | ||
``` | ||
- The component with the Lumo theme: | ||
You can also import the Lumo version of the component explicitly: | ||
`theme/lumo/vaadin-time-picker.js` | ||
```js | ||
import '@vaadin/time-picker/theme/lumo/vaadin-time-picker.js'; | ||
``` | ||
- The component with the Material theme: | ||
Finally, you can import the un-themed component from the `src` folder to get a minimal starting point: | ||
`theme/material/vaadin-time-picker.js` | ||
```js | ||
import '@vaadin/time-picker/src/vaadin-time-picker.js'; | ||
``` | ||
- Alias for `theme/lumo/vaadin-time-picker.js`: | ||
`vaadin-time-picker.js` | ||
## Contributing | ||
@@ -62,2 +62,3 @@ | ||
Vaadin collects development time usage statistics to improve this product. For details and to opt-out, see https://github.com/vaadin/vaadin-usage-statistics. | ||
Vaadin collects usage statistics at development time to improve this product. | ||
For details and to opt-out, see https://github.com/vaadin/vaadin-usage-statistics. |
@@ -6,6 +6,6 @@ /** | ||
*/ | ||
import { PolymerElement, html } from '@polymer/polymer/polymer-element.js'; | ||
import './vaadin-time-picker-dropdown.js'; | ||
import { html, PolymerElement } from '@polymer/polymer/polymer-element.js'; | ||
import { ComboBoxMixin } from '@vaadin/combo-box/src/vaadin-combo-box-mixin.js'; | ||
import { ThemableMixin } from '@vaadin/vaadin-themable-mixin/vaadin-themable-mixin.js'; | ||
import './vaadin-time-picker-dropdown.js'; | ||
@@ -12,0 +12,0 @@ /** |
@@ -6,7 +6,7 @@ /** | ||
*/ | ||
import { html } from '@polymer/polymer/lib/utils/html-tag.js'; | ||
import { ComboBoxDropdown } from '@vaadin/combo-box/src/vaadin-combo-box-dropdown.js'; | ||
import './vaadin-time-picker-item.js'; | ||
import './vaadin-time-picker-overlay.js'; | ||
import './vaadin-time-picker-scroller.js'; | ||
import { html } from '@polymer/polymer/lib/utils/html-tag.js'; | ||
import { ComboBoxDropdown } from '@vaadin/combo-box/src/vaadin-combo-box-dropdown.js'; | ||
@@ -13,0 +13,0 @@ /** |
@@ -7,3 +7,3 @@ /** | ||
import { ComboBoxOverlay } from '@vaadin/combo-box/src/vaadin-combo-box-overlay.js'; | ||
import { registerStyles, css } from '@vaadin/vaadin-themable-mixin/register-styles.js'; | ||
import { css, registerStyles } from '@vaadin/vaadin-themable-mixin/vaadin-themable-mixin.js'; | ||
@@ -10,0 +10,0 @@ registerStyles( |
@@ -6,13 +6,12 @@ /** | ||
*/ | ||
import { PolymerElement, html } from '@polymer/polymer/polymer-element.js'; | ||
import '@vaadin/input-container/src/vaadin-input-container.js'; | ||
import './vaadin-time-picker-combo-box.js'; | ||
import { html, PolymerElement } from '@polymer/polymer/polymer-element.js'; | ||
import { ElementMixin } from '@vaadin/component-base/src/element-mixin.js'; | ||
import { AriaLabelController } from '@vaadin/field-base/src/aria-label-controller.js'; | ||
import { InputControlMixin } from '@vaadin/field-base/src/input-control-mixin.js'; | ||
import { InputController } from '@vaadin/field-base/src/input-controller.js'; | ||
import { InputControlMixin } from '@vaadin/field-base/src/input-control-mixin.js'; | ||
import { PatternMixin } from '@vaadin/field-base/src/pattern-mixin.js'; | ||
import { inputFieldShared } from '@vaadin/field-base/src/styles/input-field-shared-styles.js'; | ||
import { ThemableMixin } from '@vaadin/vaadin-themable-mixin/vaadin-themable-mixin.js'; | ||
import { registerStyles } from '@vaadin/vaadin-themable-mixin/register-styles.js'; | ||
import '@vaadin/input-container/src/vaadin-input-container.js'; | ||
import './vaadin-time-picker-combo-box.js'; | ||
import { registerStyles, ThemableMixin } from '@vaadin/vaadin-themable-mixin/vaadin-themable-mixin.js'; | ||
@@ -19,0 +18,0 @@ registerStyles('vaadin-time-picker', inputFieldShared, { moduleId: 'vaadin-time-picker-styles' }); |
@@ -6,5 +6,5 @@ /** | ||
*/ | ||
import { registerStyles, css } from '@vaadin/vaadin-themable-mixin/register-styles.js'; | ||
import '@vaadin/vaadin-lumo-styles/font-icons.js'; | ||
import { inputFieldShared } from '@vaadin/vaadin-lumo-styles/mixins/input-field-shared.js'; | ||
import { css, registerStyles } from '@vaadin/vaadin-themable-mixin/vaadin-themable-mixin.js'; | ||
@@ -11,0 +11,0 @@ const timePicker = css` |
@@ -6,5 +6,5 @@ /** | ||
*/ | ||
import { registerStyles, css } from '@vaadin/vaadin-themable-mixin/register-styles.js'; | ||
import '@vaadin/vaadin-material-styles/font-icons.js'; | ||
import { inputFieldShared } from '@vaadin/vaadin-material-styles/mixins/input-field-shared.js'; | ||
import { css, registerStyles } from '@vaadin/vaadin-themable-mixin/vaadin-themable-mixin.js'; | ||
@@ -11,0 +11,0 @@ const timePicker = css` |
63
50544
1046
+ Added@open-wc/dedupe-mixin@1.4.0(transitive)
+ Added@vaadin/combo-box@22.0.0-beta2(transitive)
+ Added@vaadin/component-base@22.0.0-beta2(transitive)
+ Added@vaadin/field-base@22.0.0-beta2(transitive)
+ Added@vaadin/icon@22.0.0-beta2(transitive)
+ Added@vaadin/input-container@22.0.0-beta2(transitive)
+ Added@vaadin/item@22.0.0-beta2(transitive)
+ Added@vaadin/vaadin-lumo-styles@22.0.0-beta2(transitive)
+ Added@vaadin/vaadin-material-styles@22.0.0-beta2(transitive)
+ Added@vaadin/vaadin-overlay@22.0.0-beta2(transitive)
+ Added@vaadin/vaadin-themable-mixin@22.0.0-beta2(transitive)
- Removed@vaadin/combo-box@22.0.0-beta1(transitive)
- Removed@vaadin/component-base@22.0.0-beta1(transitive)
- Removed@vaadin/field-base@22.0.0-beta1(transitive)
- Removed@vaadin/icon@22.0.0-beta1(transitive)
- Removed@vaadin/input-container@22.0.0-beta1(transitive)
- Removed@vaadin/item@22.0.0-beta1(transitive)
- Removed@vaadin/vaadin-lumo-styles@22.0.0-beta1(transitive)
- Removed@vaadin/vaadin-material-styles@22.0.0-beta1(transitive)
- Removed@vaadin/vaadin-overlay@22.0.0-beta1(transitive)
- Removed@vaadin/vaadin-themable-mixin@22.0.0-beta1(transitive)