diff --git a/.gitignore b/.gitignore index dee80664406..5834437ecd5 100644 --- a/.gitignore +++ b/.gitignore @@ -1,4 +1,4 @@ node_modules coverage -packages/**/analysis.json -packages/**/dist +dist +analysis.json diff --git a/index.html b/index.html new file mode 100644 index 00000000000..1017bc47001 --- /dev/null +++ b/index.html @@ -0,0 +1,34 @@ + + + + Vaadin web components + + + + + + + + + + + diff --git a/package.json b/package.json index 902d11240b5..5a615514abb 100644 --- a/package.json +++ b/package.json @@ -17,13 +17,16 @@ ] }, "scripts": { + "analyze": "polymer analyze packages/**/vaadin-*.js > analysis.json && node scripts/prepareDocs.js", "debug": "web-test-runner --watch", - "dist": "lerna run dist --stream", + "dist": "rimraf dist && yarn analyze && rollup -c rollup.config.js && cp analysis.json dist", + "docs": "yarn analyze && web-dev-server --node-resolve --open", "lint": "npm-run-all --parallel lint:*", "lint:css": "stylelint packages/**/src/*.js packages/**/theme/**/*-styles.js", "lint:js": "eslint *.js scripts packages", "lint:types": "tsc", "preversion": "node scripts/updateVersion.js", + "serve:dist": "web-dev-server --app-index dist/index.html --open", "test": "web-test-runner --coverage", "test:firefox": "web-test-runner --config web-test-runner-firefox.config.js", "test:lumo": "web-test-runner --config web-test-runner-lumo.config.js", @@ -33,7 +36,10 @@ "update:material": "TEST_ENV=update web-test-runner --config web-test-runner-material.config.js" }, "devDependencies": { + "@open-wc/rollup-plugin-html": "^1.2.5", + "@polymer/iron-component-page": "^4.0.0", "@vaadin/testing-helpers": "^0.1.3", + "@web/dev-server": "^0.1.8", "@web/test-runner": "^0.12.17", "@web/test-runner-playwright": "^0.8.4", "@web/test-runner-saucelabs": "^0.5.0", @@ -47,6 +53,9 @@ "npm-run-all": "^4.1.5", "prettier": "^2.2.1", "replace-in-file": "^6.2.0", + "rimraf": "^3.0.2", + "rollup": "^2.34.1", + "rollup-plugin-terser": "^7.0.2", "stylelint": "^13.11.0", "stylelint-config-prettier": "^8.0.2", "stylelint-config-vaadin": "^0.2.10", diff --git a/packages/vaadin-accordion/index.html b/packages/vaadin-accordion/index.html deleted file mode 100644 index 5fd1d6e568c..00000000000 --- a/packages/vaadin-accordion/index.html +++ /dev/null @@ -1,16 +0,0 @@ - - - - - vaadin-accordion - - - - - - - - - diff --git a/packages/vaadin-accordion/package.json b/packages/vaadin-accordion/package.json index b72da31c8ec..589daf73583 100644 --- a/packages/vaadin-accordion/package.json +++ b/packages/vaadin-accordion/package.json @@ -24,9 +24,6 @@ "src", "theme" ], - "scripts": { - "dist": "rimraf dist && polymer analyze vaadin-* > analysis.json && rollup -c rollup.config.js && cp analysis.json dist" - }, "dependencies": { "@polymer/polymer": "^3.0.0", "@vaadin/vaadin-details": "^20.0.0-alpha1", @@ -37,13 +34,8 @@ }, "devDependencies": { "@esm-bundle/chai": "^4.1.5", - "@open-wc/rollup-plugin-html": "^1.2.5", "@open-wc/testing-helpers": "^1.8.12", - "@polymer/iron-component-page": "^4.0.0", "@polymer/iron-test-helpers": "^3.0.0", - "rimraf": "^3.0.2", - "rollup": "^2.34.1", - "rollup-plugin-terser": "^7.0.2", "sinon": "^9.2.1" }, "publishConfig": { diff --git a/packages/vaadin-app-layout/index.html b/packages/vaadin-app-layout/index.html deleted file mode 100644 index 89b60934bd4..00000000000 --- a/packages/vaadin-app-layout/index.html +++ /dev/null @@ -1,16 +0,0 @@ - - - - - vaadin-app-layout - - - - - - - - - diff --git a/packages/vaadin-app-layout/package.json b/packages/vaadin-app-layout/package.json index 891a09cbeed..45b1718ed25 100644 --- a/packages/vaadin-app-layout/package.json +++ b/packages/vaadin-app-layout/package.json @@ -24,9 +24,6 @@ "src", "theme" ], - "scripts": { - "dist": "rimraf dist && polymer analyze vaadin-* > analysis.json && rollup -c rollup.config.js && cp analysis.json dist" - }, "dependencies": { "@polymer/polymer": "^3.0.0", "@vaadin/vaadin-button": "^20.0.0-alpha1", @@ -37,15 +34,10 @@ }, "devDependencies": { "@esm-bundle/chai": "^4.1.5", - "@open-wc/rollup-plugin-html": "^1.2.5", "@open-wc/testing-helpers": "^1.8.12", - "@polymer/iron-component-page": "^4.0.0", "@polymer/iron-test-helpers": "^3.0.1", "@vaadin/vaadin-icons": "^20.0.0-alpha1", "@vaadin/vaadin-tabs": "^20.0.0-alpha1", - "rimraf": "^3.0.2", - "rollup": "^2.34.1", - "rollup-plugin-terser": "^7.0.2", "sinon": "^9.2.1" }, "publishConfig": { diff --git a/packages/vaadin-app-layout/rollup.config.js b/packages/vaadin-app-layout/rollup.config.js deleted file mode 100644 index b4695e8ed09..00000000000 --- a/packages/vaadin-app-layout/rollup.config.js +++ /dev/null @@ -1,12 +0,0 @@ -/* eslint-env node */ -const { nodeResolve } = require('@rollup/plugin-node-resolve'); -const { terser } = require('rollup-plugin-terser'); -const html = require('@open-wc/rollup-plugin-html'); - -module.exports = { - input: './index.html', - output: { - dir: './dist' - }, - plugins: [html(), nodeResolve(), terser()] -}; diff --git a/packages/vaadin-avatar/index.html b/packages/vaadin-avatar/index.html deleted file mode 100644 index 95196b89cfc..00000000000 --- a/packages/vaadin-avatar/index.html +++ /dev/null @@ -1,16 +0,0 @@ - - - - - vaadin-avatar - - - - - - - - - diff --git a/packages/vaadin-avatar/package.json b/packages/vaadin-avatar/package.json index 6c1d6b9cf5c..dbb6cfb9451 100644 --- a/packages/vaadin-avatar/package.json +++ b/packages/vaadin-avatar/package.json @@ -24,9 +24,6 @@ "src", "theme" ], - "scripts": { - "dist": "rimraf dist && polymer analyze vaadin-* > analysis.json && rollup -c rollup.config.js && cp analysis.json dist" - }, "dependencies": { "@polymer/iron-a11y-announcer": "^3.0.0", "@polymer/iron-resizable-behavior": "^3.0.0", @@ -41,13 +38,8 @@ }, "devDependencies": { "@esm-bundle/chai": "^4.1.5", - "@open-wc/rollup-plugin-html": "^1.2.5", "@open-wc/testing-helpers": "^1.8.12", - "@polymer/iron-component-page": "^4.0.0", "@polymer/iron-test-helpers": "^3.0.0", - "rimraf": "^3.0.2", - "rollup": "^2.34.1", - "rollup-plugin-terser": "^7.0.2", "sinon": "^9.2.1" }, "publishConfig": { diff --git a/packages/vaadin-avatar/rollup.config.js b/packages/vaadin-avatar/rollup.config.js deleted file mode 100644 index b4695e8ed09..00000000000 --- a/packages/vaadin-avatar/rollup.config.js +++ /dev/null @@ -1,12 +0,0 @@ -/* eslint-env node */ -const { nodeResolve } = require('@rollup/plugin-node-resolve'); -const { terser } = require('rollup-plugin-terser'); -const html = require('@open-wc/rollup-plugin-html'); - -module.exports = { - input: './index.html', - output: { - dir: './dist' - }, - plugins: [html(), nodeResolve(), terser()] -}; diff --git a/packages/vaadin-avatar/src/vaadin-avatar-group-list-box.js b/packages/vaadin-avatar/src/vaadin-avatar-group-list-box.js index 72c43641461..233ef03b0e1 100644 --- a/packages/vaadin-avatar/src/vaadin-avatar-group-list-box.js +++ b/packages/vaadin-avatar/src/vaadin-avatar-group-list-box.js @@ -6,9 +6,10 @@ import { ListBoxElement } from '@vaadin/vaadin-list-box/src/vaadin-list-box.js'; /** - * The vaadin-avatar-group-list-box element. + * An element used internally by ``. Not intended to be used separately. * - * @extends HTMLElement + * @extends ListBoxElement + * @private */ class AvatarGroupListBoxElement extends ListBoxElement { static get is() { diff --git a/packages/vaadin-avatar/src/vaadin-avatar-group-overlay.js b/packages/vaadin-avatar/src/vaadin-avatar-group-overlay.js index 7075508c0d3..36887cbbb45 100644 --- a/packages/vaadin-avatar/src/vaadin-avatar-group-overlay.js +++ b/packages/vaadin-avatar/src/vaadin-avatar-group-overlay.js @@ -22,16 +22,10 @@ registerStyles( ); /** - * The overlay element. + * An element used internally by ``. Not intended to be used separately. * - * ### Styling - * - * See [`` documentation](https://github.com/vaadin/vaadin-overlay/blob/master/src/vaadin-overlay.html) - * for `` parts. - * - * See [ThemableMixin – how to apply styles for shadow parts](https://github.com/vaadin/vaadin-themable-mixin/wiki) - * - * @extends HTMLElement + * @extends OverlayElement + * @private */ class AvatarGroupOverlayElement extends OverlayElement { static get is() { diff --git a/packages/vaadin-avatar/src/vaadin-avatar-group.d.ts b/packages/vaadin-avatar/src/vaadin-avatar-group.d.ts index a9e470f1a0a..fea51a59e35 100644 --- a/packages/vaadin-avatar/src/vaadin-avatar-group.d.ts +++ b/packages/vaadin-avatar/src/vaadin-avatar-group.d.ts @@ -32,6 +32,14 @@ import { AvatarGroupItem, AvatarGroupI18n } from './interfaces'; * `avatar` | Individual avatars * * See [Styling Components](https://vaadin.com/docs/v14/themes/styling-components.html) documentation. + * + * ### Internal components + * + * In addition to `` itself, the following internal + * components are themable: + * + * - `` - has the same API as [``](#/elements/vaadin-list-box). + * - `` - has the same API as [``](#/elements/vaadin-overlay). */ declare class AvatarGroupElement extends ElementMixin(ThemableMixin(HTMLElement)) { readonly _avatars: HTMLElement[]; diff --git a/packages/vaadin-avatar/src/vaadin-avatar-group.js b/packages/vaadin-avatar/src/vaadin-avatar-group.js index 0f8ccc00f63..641dbb8cf1f 100644 --- a/packages/vaadin-avatar/src/vaadin-avatar-group.js +++ b/packages/vaadin-avatar/src/vaadin-avatar-group.js @@ -49,6 +49,14 @@ const MINIMUM_DISPLAYED_AVATARS = 2; * * See [Styling Components](https://vaadin.com/docs/v14/themes/styling-components.html) documentation. * + * ### Internal components + * + * In addition to `` itself, the following internal + * components are themable: + * + * - `` - has the same API as [``](#/elements/vaadin-list-box). + * - `` - has the same API as [``](#/elements/vaadin-overlay). + * * @extends HTMLElement * @mixes ElementMixin * @mixes ThemableMixin diff --git a/packages/vaadin-board/index.html b/packages/vaadin-board/index.html deleted file mode 100644 index 147590bd8e0..00000000000 --- a/packages/vaadin-board/index.html +++ /dev/null @@ -1,15 +0,0 @@ - - - - - - vaadin-board - - - - - - - diff --git a/packages/vaadin-board/package.json b/packages/vaadin-board/package.json index 3e014ad2250..2056e7a4688 100644 --- a/packages/vaadin-board/package.json +++ b/packages/vaadin-board/package.json @@ -27,9 +27,6 @@ "src", "theme" ], - "scripts": { - "dist": "rimraf dist && polymer analyze vaadin-* > analysis.json && rollup -c rollup.config.js && cp analysis.json dist" - }, "dependencies": { "@polymer/iron-resizable-behavior": "^3.0.0", "@polymer/polymer": "^3.0.0", @@ -38,12 +35,7 @@ }, "devDependencies": { "@esm-bundle/chai": "^4.1.5", - "@open-wc/rollup-plugin-html": "^1.2.5", "@open-wc/testing-helpers": "^1.8.12", - "@polymer/iron-component-page": "^4.0.0", - "rimraf": "^3.0.2", - "rollup": "^2.34.1", - "rollup-plugin-terser": "^7.0.2", "sinon": "^9.2.1" }, "publishConfig": { diff --git a/packages/vaadin-board/rollup.config.js b/packages/vaadin-board/rollup.config.js deleted file mode 100644 index b4695e8ed09..00000000000 --- a/packages/vaadin-board/rollup.config.js +++ /dev/null @@ -1,12 +0,0 @@ -/* eslint-env node */ -const { nodeResolve } = require('@rollup/plugin-node-resolve'); -const { terser } = require('rollup-plugin-terser'); -const html = require('@open-wc/rollup-plugin-html'); - -module.exports = { - input: './index.html', - output: { - dir: './dist' - }, - plugins: [html(), nodeResolve(), terser()] -}; diff --git a/packages/vaadin-button/index.html b/packages/vaadin-button/index.html deleted file mode 100644 index e9d7535b6ca..00000000000 --- a/packages/vaadin-button/index.html +++ /dev/null @@ -1,16 +0,0 @@ - - - - - vaadin-button - - - - - - - - - diff --git a/packages/vaadin-button/package.json b/packages/vaadin-button/package.json index 06a8905251d..66e7c5da9a2 100644 --- a/packages/vaadin-button/package.json +++ b/packages/vaadin-button/package.json @@ -24,9 +24,6 @@ "src", "theme" ], - "scripts": { - "dist": "rimraf dist && polymer analyze vaadin-* > analysis.json && rollup -c rollup.config.js && cp analysis.json dist" - }, "dependencies": { "@polymer/polymer": "^3.0.0", "@vaadin/vaadin-control-state-mixin": "^20.0.0-alpha1", @@ -37,13 +34,8 @@ }, "devDependencies": { "@esm-bundle/chai": "^4.1.5", - "@open-wc/rollup-plugin-html": "^1.2.5", - "@polymer/iron-component-page": "^4.0.0", "@polymer/iron-icon": "^3.0.0", "@vaadin/testing-helpers": "^0.1.3", - "rimraf": "^3.0.2", - "rollup": "^2.34.1", - "rollup-plugin-terser": "^7.0.2", "sinon": "^9.2.4" }, "publishConfig": { diff --git a/packages/vaadin-button/rollup.config.js b/packages/vaadin-button/rollup.config.js deleted file mode 100644 index b4695e8ed09..00000000000 --- a/packages/vaadin-button/rollup.config.js +++ /dev/null @@ -1,12 +0,0 @@ -/* eslint-env node */ -const { nodeResolve } = require('@rollup/plugin-node-resolve'); -const { terser } = require('rollup-plugin-terser'); -const html = require('@open-wc/rollup-plugin-html'); - -module.exports = { - input: './index.html', - output: { - dir: './dist' - }, - plugins: [html(), nodeResolve(), terser()] -}; diff --git a/packages/vaadin-charts/index.html b/packages/vaadin-charts/index.html deleted file mode 100644 index facd2f73061..00000000000 --- a/packages/vaadin-charts/index.html +++ /dev/null @@ -1,16 +0,0 @@ - - - - - vaadin-charts - - - - - - - - - diff --git a/packages/vaadin-charts/package.json b/packages/vaadin-charts/package.json index d3690e2c93c..588656ba9a6 100644 --- a/packages/vaadin-charts/package.json +++ b/packages/vaadin-charts/package.json @@ -24,9 +24,6 @@ "src", "theme" ], - "scripts": { - "dist": "rimraf dist && polymer analyze vaadin-* > analysis.json && rollup -c rollup.config.js && cp analysis.json dist" - }, "dependencies": { "@polymer/polymer": "^3.0.0", "@vaadin/vaadin-element-mixin": "^20.0.0-alpha1", @@ -36,12 +33,7 @@ }, "devDependencies": { "@esm-bundle/chai": "^4.1.5", - "@open-wc/rollup-plugin-html": "^1.2.5", "@open-wc/testing-helpers": "^1.8.12", - "@polymer/iron-component-page": "^4.0.0", - "rimraf": "^3.0.2", - "rollup": "^2.34.1", - "rollup-plugin-terser": "^7.0.2", "sinon": "^9.2.4" }, "publishConfig": { diff --git a/packages/vaadin-charts/rollup.config.js b/packages/vaadin-charts/rollup.config.js deleted file mode 100644 index b4695e8ed09..00000000000 --- a/packages/vaadin-charts/rollup.config.js +++ /dev/null @@ -1,12 +0,0 @@ -/* eslint-env node */ -const { nodeResolve } = require('@rollup/plugin-node-resolve'); -const { terser } = require('rollup-plugin-terser'); -const html = require('@open-wc/rollup-plugin-html'); - -module.exports = { - input: './index.html', - output: { - dir: './dist' - }, - plugins: [html(), nodeResolve(), terser()] -}; diff --git a/packages/vaadin-checkbox/index.html b/packages/vaadin-checkbox/index.html deleted file mode 100644 index c72b121b963..00000000000 --- a/packages/vaadin-checkbox/index.html +++ /dev/null @@ -1,16 +0,0 @@ - - - - - vaadin-checkbox - - - - - - - - - diff --git a/packages/vaadin-checkbox/package.json b/packages/vaadin-checkbox/package.json index f3346f08824..a14e2b3ed5c 100644 --- a/packages/vaadin-checkbox/package.json +++ b/packages/vaadin-checkbox/package.json @@ -24,9 +24,6 @@ "src", "theme" ], - "scripts": { - "dist": "rimraf dist && polymer analyze vaadin-* > analysis.json && rollup -c rollup.config.js && cp analysis.json dist" - }, "dependencies": { "@polymer/polymer": "^3.0.0", "@vaadin/vaadin-control-state-mixin": "^20.0.0-alpha1", @@ -37,13 +34,8 @@ }, "devDependencies": { "@esm-bundle/chai": "^4.1.5", - "@open-wc/rollup-plugin-html": "^1.2.5", "@open-wc/testing-helpers": "^1.8.0", - "@polymer/iron-component-page": "^4.0.0", "@polymer/iron-test-helpers": "^3.0.0", - "rimraf": "^3.0.2", - "rollup": "^2.34.1", - "rollup-plugin-terser": "^7.0.2", "sinon": "^9.2.0" }, "publishConfig": { diff --git a/packages/vaadin-checkbox/rollup.config.js b/packages/vaadin-checkbox/rollup.config.js deleted file mode 100644 index b4695e8ed09..00000000000 --- a/packages/vaadin-checkbox/rollup.config.js +++ /dev/null @@ -1,12 +0,0 @@ -/* eslint-env node */ -const { nodeResolve } = require('@rollup/plugin-node-resolve'); -const { terser } = require('rollup-plugin-terser'); -const html = require('@open-wc/rollup-plugin-html'); - -module.exports = { - input: './index.html', - output: { - dir: './dist' - }, - plugins: [html(), nodeResolve(), terser()] -}; diff --git a/packages/vaadin-combo-box/index.html b/packages/vaadin-combo-box/index.html deleted file mode 100644 index 7a44f852c2c..00000000000 --- a/packages/vaadin-combo-box/index.html +++ /dev/null @@ -1,16 +0,0 @@ - - - - - vaadin-combo-box - - - - - - - - - diff --git a/packages/vaadin-combo-box/package.json b/packages/vaadin-combo-box/package.json index c5f71049165..5d9bb1d27ab 100644 --- a/packages/vaadin-combo-box/package.json +++ b/packages/vaadin-combo-box/package.json @@ -23,9 +23,6 @@ "src", "theme" ], - "scripts": { - "dist": "rimraf dist && polymer analyze vaadin-* > analysis.json && rollup -c rollup.config.js && cp analysis.json dist" - }, "dependencies": { "@polymer/iron-a11y-announcer": "^3.0.0", "@polymer/iron-list": "^3.0.0", @@ -42,16 +39,11 @@ }, "devDependencies": { "@esm-bundle/chai": "4.3.0", - "@open-wc/rollup-plugin-html": "^1.2.5", "@open-wc/testing-helpers": "^1.8.0", - "@polymer/iron-component-page": "^4.0.0", "@polymer/iron-input": "^3.0.1", "@polymer/iron-test-helpers": "^3.0.0", "@polymer/paper-input": "^3.0.0", "@vaadin/vaadin-dialog": "^20.0.0-alpha1", - "rimraf": "^3.0.2", - "rollup": "^2.34.1", - "rollup-plugin-terser": "^7.0.2", "sinon": "^9.2.0" }, "publishConfig": { diff --git a/packages/vaadin-combo-box/rollup.config.js b/packages/vaadin-combo-box/rollup.config.js deleted file mode 100644 index b4695e8ed09..00000000000 --- a/packages/vaadin-combo-box/rollup.config.js +++ /dev/null @@ -1,12 +0,0 @@ -/* eslint-env node */ -const { nodeResolve } = require('@rollup/plugin-node-resolve'); -const { terser } = require('rollup-plugin-terser'); -const html = require('@open-wc/rollup-plugin-html'); - -module.exports = { - input: './index.html', - output: { - dir: './dist' - }, - plugins: [html(), nodeResolve(), terser()] -}; diff --git a/packages/vaadin-combo-box/src/vaadin-combo-box-dropdown.js b/packages/vaadin-combo-box/src/vaadin-combo-box-dropdown.js index 04cc0b9b368..37c65257312 100644 --- a/packages/vaadin-combo-box/src/vaadin-combo-box-dropdown.js +++ b/packages/vaadin-combo-box/src/vaadin-combo-box-dropdown.js @@ -21,15 +21,9 @@ registerStyles( ); /** - * The overlay element. - * - * ### Styling - * - * See [`` documentation](https://github.com/vaadin/vaadin-overlay/blob/master/src/vaadin-overlay.html) - * for `` parts. - * - * See [ThemableMixin – how to apply styles for shadow parts](https://github.com/vaadin/vaadin-themable-mixin/wiki) + * An element used internally by ``. Not intended to be used separately. * + * @extends OverlayElement * @private */ class ComboBoxOverlayElement extends OverlayElement { diff --git a/packages/vaadin-combo-box/src/vaadin-combo-box.d.ts b/packages/vaadin-combo-box/src/vaadin-combo-box.d.ts index f207b2341d6..2088de02c66 100644 --- a/packages/vaadin-combo-box/src/vaadin-combo-box.d.ts +++ b/packages/vaadin-combo-box/src/vaadin-combo-box.d.ts @@ -134,12 +134,6 @@ import { ComboBoxEventMap } from './interfaces'; * `text-field` | The text field * `toggle-button` | The toggle button * - * See [`` documentation](https://github.com/vaadin/vaadin-overlay/blob/master/src/vaadin-overlay.html) - * for `` parts. - * - * See [`` documentation](https://vaadin.com/components/vaadin-text-field/html-api/elements/Vaadin.TextFieldElement) - * for the text field parts. - * * The following state attributes are available for styling: * * Attribute | Description | Part name @@ -153,15 +147,17 @@ import { ComboBoxEventMap } from './interfaces'; * `focus-ring` | Set when the element is keyboard focused | :host * `loading` | Set when new items are expected | :host * + * ### Internal components + * * In addition to `` itself, the following internal * components are themable: * - * - `` - * - `` + * - `` - has the same API as [``](#/elements/vaadin-overlay). + * - [``](#/elements/vaadin-text-field) * - `` * * Note: the `theme` attribute value set on `` is - * propagated to the internal themable components listed above. + * propagated to the internal components listed above. * * See [ThemableMixin – how to apply styles for shadow parts](https://github.com/vaadin/vaadin-themable-mixin/wiki) * diff --git a/packages/vaadin-combo-box/src/vaadin-combo-box.js b/packages/vaadin-combo-box/src/vaadin-combo-box.js index 4fcf27a324d..91694f0ef55 100644 --- a/packages/vaadin-combo-box/src/vaadin-combo-box.js +++ b/packages/vaadin-combo-box/src/vaadin-combo-box.js @@ -134,12 +134,6 @@ import { ComboBoxDataProviderMixin } from './vaadin-combo-box-data-provider-mixi * `text-field` | The text field * `toggle-button` | The toggle button * - * See [`` documentation](https://github.com/vaadin/vaadin-overlay/blob/master/src/vaadin-overlay.html) - * for `` parts. - * - * See [`` documentation](https://vaadin.com/components/vaadin-text-field/html-api/elements/Vaadin.TextFieldElement) - * for the text field parts. - * * The following state attributes are available for styling: * * Attribute | Description | Part name @@ -153,15 +147,17 @@ import { ComboBoxDataProviderMixin } from './vaadin-combo-box-data-provider-mixi * `focus-ring` | Set when the element is keyboard focused | :host * `loading` | Set when new items are expected | :host * + * ### Internal components + * * In addition to `` itself, the following internal * components are themable: * - * - `` - * - `` + * - `` - has the same API as [``](#/elements/vaadin-overlay). + * - [``](#/elements/vaadin-text-field) * - `` * * Note: the `theme` attribute value set on `` is - * propagated to the internal themable components listed above. + * propagated to the internal components listed above. * * See [ThemableMixin – how to apply styles for shadow parts](https://github.com/vaadin/vaadin-themable-mixin/wiki) * diff --git a/packages/vaadin-confirm-dialog/index.html b/packages/vaadin-confirm-dialog/index.html deleted file mode 100644 index 91dafcfc38f..00000000000 --- a/packages/vaadin-confirm-dialog/index.html +++ /dev/null @@ -1,16 +0,0 @@ - - - - - vaadin-confirm-dialog - - - - - - - - diff --git a/packages/vaadin-confirm-dialog/package.json b/packages/vaadin-confirm-dialog/package.json index 6971b6bb4c6..8b4884c1549 100644 --- a/packages/vaadin-confirm-dialog/package.json +++ b/packages/vaadin-confirm-dialog/package.json @@ -24,9 +24,6 @@ "src", "theme" ], - "scripts": { - "dist": "rimraf dist && polymer analyze vaadin-* > analysis.json && rollup -c rollup.config.js && cp analysis.json dist" - }, "dependencies": { "@polymer/polymer": "^3.0.0", "@vaadin/vaadin-button": "^20.0.0-alpha1", @@ -40,14 +37,9 @@ }, "devDependencies": { "@esm-bundle/chai": "^4.1.5", - "@open-wc/rollup-plugin-html": "^1.2.5", "@open-wc/testing-helpers": "^1.8.12", - "@polymer/iron-component-page": "^4.0.0", "@polymer/iron-test-helpers": "^3.0.0", "@vaadin/vaadin-icons": "^20.0.0-alpha1", - "rimraf": "^3.0.2", - "rollup": "^2.34.1", - "rollup-plugin-terser": "^7.0.2", "sinon": "^9.2.1" }, "publishConfig": { diff --git a/packages/vaadin-confirm-dialog/rollup.config.js b/packages/vaadin-confirm-dialog/rollup.config.js deleted file mode 100644 index b4695e8ed09..00000000000 --- a/packages/vaadin-confirm-dialog/rollup.config.js +++ /dev/null @@ -1,12 +0,0 @@ -/* eslint-env node */ -const { nodeResolve } = require('@rollup/plugin-node-resolve'); -const { terser } = require('rollup-plugin-terser'); -const html = require('@open-wc/rollup-plugin-html'); - -module.exports = { - input: './index.html', - output: { - dir: './dist' - }, - plugins: [html(), nodeResolve(), terser()] -}; diff --git a/packages/vaadin-context-menu/index.html b/packages/vaadin-context-menu/index.html deleted file mode 100644 index 92f457b5f51..00000000000 --- a/packages/vaadin-context-menu/index.html +++ /dev/null @@ -1,16 +0,0 @@ - - - - - vaadin-context-menu - - - - - - - - - diff --git a/packages/vaadin-context-menu/package.json b/packages/vaadin-context-menu/package.json index b534c4ac83b..3a7e1739cf5 100644 --- a/packages/vaadin-context-menu/package.json +++ b/packages/vaadin-context-menu/package.json @@ -24,9 +24,6 @@ "src", "theme" ], - "scripts": { - "dist": "rimraf dist && polymer analyze vaadin-* > analysis.json && rollup -c rollup.config.js && cp analysis.json dist" - }, "dependencies": { "@polymer/iron-media-query": "^3.0.0", "@polymer/polymer": "^3.0.0", @@ -40,12 +37,7 @@ }, "devDependencies": { "@esm-bundle/chai": "^4.1.5", - "@open-wc/rollup-plugin-html": "^1.2.5", - "@polymer/iron-component-page": "^4.0.0", "@vaadin/testing-helpers": "^0.1.3", - "rimraf": "^3.0.2", - "rollup": "^2.34.1", - "rollup-plugin-terser": "^7.0.2", "sinon": "^9.2.1" }, "publishConfig": { diff --git a/packages/vaadin-context-menu/rollup.config.js b/packages/vaadin-context-menu/rollup.config.js deleted file mode 100644 index b4695e8ed09..00000000000 --- a/packages/vaadin-context-menu/rollup.config.js +++ /dev/null @@ -1,12 +0,0 @@ -/* eslint-env node */ -const { nodeResolve } = require('@rollup/plugin-node-resolve'); -const { terser } = require('rollup-plugin-terser'); -const html = require('@open-wc/rollup-plugin-html'); - -module.exports = { - input: './index.html', - output: { - dir: './dist' - }, - plugins: [html(), nodeResolve(), terser()] -}; diff --git a/packages/vaadin-context-menu/src/vaadin-context-menu-overlay.js b/packages/vaadin-context-menu/src/vaadin-context-menu-overlay.js index a4d53548dc2..5d22ab64445 100644 --- a/packages/vaadin-context-menu/src/vaadin-context-menu-overlay.js +++ b/packages/vaadin-context-menu/src/vaadin-context-menu-overlay.js @@ -31,20 +31,10 @@ registerStyles( ); /** - * The overlay element. + * An element used internally by ``. Not intended to be used separately. * - * ### Styling - * - * See [`` documentation](https://github.com/vaadin/vaadin-overlay/blob/master/src/vaadin-overlay.html) - * for `` parts. - * - * #### Deprecated - * `right-aligned` is deprecated in favor of `end-aligned` - * - * See [ThemableMixin – how to apply styles for shadow parts](https://github.com/vaadin/vaadin-themable-mixin/wiki) - * - * @extends PolymerElement - * @private + * @extends OverlayElement + * @protected */ class ContextMenuOverlayElement extends OverlayElement { static get is() { diff --git a/packages/vaadin-context-menu/src/vaadin-context-menu.d.ts b/packages/vaadin-context-menu/src/vaadin-context-menu.d.ts index 2a59ddaf48d..25a26db25ce 100644 --- a/packages/vaadin-context-menu/src/vaadin-context-menu.d.ts +++ b/packages/vaadin-context-menu/src/vaadin-context-menu.d.ts @@ -206,16 +206,23 @@ import { ContextMenuEventMap, ContextMenuRenderer } from './interfaces'; * ### Styling * * `` uses `` internal - * themable component as the actual visible context menu overlay. See - * See [`` documentation](https://github.com/vaadin/vaadin-overlay/blob/master/src/vaadin-overlay.html) - * for `` parts. + * themable component as the actual visible context menu overlay. + * + * See [``](#/elements/vaadin-overlay) + * documentation for `` stylable parts. * * See [ThemableMixin – how to apply styles for shadow parts](https://github.com/vaadin/vaadin-themable-mixin/wiki) * + * ### Internal components + * + * When using `items` API, in addition ``, the following + * internal components are themable: + * + * - `` - has the same API as [``](#/elements/vaadin-item). + * - `` - has the same API as [``](#/elements/vaadin-list-box). + * * Note: the `theme` attribute value set on `` is - * propagated to the internal `` component. - * In case of using nested menu items, the `theme` attribute is also propagated - * to internal `vaadin-context-menu-list-box` and `vaadin-context-menu-item`'s. + * propagated to the internal components listed above. * * @fires {CustomEvent} opened-changed - Fired when the `opened` property changes. * @fires {CustomEvent} item-selected - Fired when an item is selected when the context menu is populated using the `items` API. diff --git a/packages/vaadin-context-menu/src/vaadin-context-menu.js b/packages/vaadin-context-menu/src/vaadin-context-menu.js index 50a7babc87f..ca9f4d1dcf3 100644 --- a/packages/vaadin-context-menu/src/vaadin-context-menu.js +++ b/packages/vaadin-context-menu/src/vaadin-context-menu.js @@ -213,16 +213,23 @@ import './vaadin-context-menu-overlay.js'; * ### Styling * * `` uses `` internal - * themable component as the actual visible context menu overlay. See - * See [`` documentation](https://github.com/vaadin/vaadin-overlay/blob/master/src/vaadin-overlay.html) - * for `` parts. + * themable component as the actual visible context menu overlay. + * + * See [``](#/elements/vaadin-overlay) + * documentation for `` stylable parts. * * See [ThemableMixin – how to apply styles for shadow parts](https://github.com/vaadin/vaadin-themable-mixin/wiki) * + * ### Internal components + * + * When using `items` API, in addition ``, the following + * internal components are themable: + * + * - `` - has the same API as [``](#/elements/vaadin-item). + * - `` - has the same API as [``](#/elements/vaadin-list-box). + * * Note: the `theme` attribute value set on `` is - * propagated to the internal `` component. - * In case of using nested menu items, the `theme` attribute is also propagated - * to internal `vaadin-context-menu-list-box` and `vaadin-context-menu-item`'s. + * propagated to the internal components listed above. * * @fires {CustomEvent} opened-changed - Fired when the `opened` property changes. * @fires {CustomEvent} item-selected - Fired when an item is selected when the context menu is populated using the `items` API. diff --git a/packages/vaadin-context-menu/src/vaadin-contextmenu-items-mixin.d.ts b/packages/vaadin-context-menu/src/vaadin-contextmenu-items-mixin.d.ts index b9ae467d0e4..2c16548f5d6 100644 --- a/packages/vaadin-context-menu/src/vaadin-contextmenu-items-mixin.d.ts +++ b/packages/vaadin-context-menu/src/vaadin-contextmenu-items-mixin.d.ts @@ -7,7 +7,9 @@ import { ContextMenuElement } from './vaadin-context-menu.js'; import { ContextMenuItem, ContextMenuRendererContext } from './interfaces'; /** - * The vaadin-context-menu-item element. + * An element used internally by ``. Not intended to be used separately. + * + * @protected */ declare class ContextMenuItemElement extends ItemElement {} @@ -19,7 +21,9 @@ declare global { } /** - * The vaadin-context-menu-list-box element. + * An element used internally by ``. Not intended to be used separately. + * + * @protected */ declare class ContextMenuListBoxElement extends ListBoxElement {} diff --git a/packages/vaadin-context-menu/src/vaadin-contextmenu-items-mixin.js b/packages/vaadin-context-menu/src/vaadin-contextmenu-items-mixin.js index e045079ffb2..9406084d7ee 100644 --- a/packages/vaadin-context-menu/src/vaadin-contextmenu-items-mixin.js +++ b/packages/vaadin-context-menu/src/vaadin-contextmenu-items-mixin.js @@ -8,9 +8,10 @@ import { ItemElement } from '@vaadin/vaadin-item/src/vaadin-item.js'; import { ListBoxElement } from '@vaadin/vaadin-list-box/src/vaadin-list-box.js'; /** - * The vaadin-context-menu-item element. + * An element used internally by ``. Not intended to be used separately. * * @extends ItemElement + * @protected */ class ContextMenuItemElement extends ItemElement { static get is() { @@ -21,9 +22,10 @@ class ContextMenuItemElement extends ItemElement { customElements.define(ContextMenuItemElement.is, ContextMenuItemElement); /** - * The vaadin-context-menu-list-box element. + * An element used internally by ``. Not intended to be used separately. * * @extends ListBoxElement + * @protected */ class ContextMenuListBoxElement extends ListBoxElement { static get is() { diff --git a/packages/vaadin-cookie-consent/index.html b/packages/vaadin-cookie-consent/index.html deleted file mode 100644 index 95cfea9a8c3..00000000000 --- a/packages/vaadin-cookie-consent/index.html +++ /dev/null @@ -1,16 +0,0 @@ - - - - - vaadin-cookie-consent - - - - - - - - - diff --git a/packages/vaadin-cookie-consent/package.json b/packages/vaadin-cookie-consent/package.json index e0e291b8ccc..f5535c96b3a 100644 --- a/packages/vaadin-cookie-consent/package.json +++ b/packages/vaadin-cookie-consent/package.json @@ -24,9 +24,6 @@ "src", "theme" ], - "scripts": { - "dist": "rimraf dist && polymer analyze vaadin-* > analysis.json && rollup -c rollup.config.js && cp analysis.json dist" - }, "dependencies": { "@polymer/polymer": "^3.0.0", "@vaadin/vaadin-element-mixin": "^20.0.0-alpha1", @@ -37,13 +34,8 @@ }, "devDependencies": { "@esm-bundle/chai": "^4.1.5", - "@open-wc/rollup-plugin-html": "^1.2.5", "@open-wc/testing-helpers": "^1.8.12", - "@polymer/iron-component-page": "^4.0.0", - "@polymer/iron-test-helpers": "^3.0.1", - "rimraf": "^3.0.2", - "rollup": "^2.34.1", - "rollup-plugin-terser": "^7.0.2" + "@polymer/iron-test-helpers": "^3.0.1" }, "publishConfig": { "access": "public" diff --git a/packages/vaadin-cookie-consent/rollup.config.js b/packages/vaadin-cookie-consent/rollup.config.js deleted file mode 100644 index b4695e8ed09..00000000000 --- a/packages/vaadin-cookie-consent/rollup.config.js +++ /dev/null @@ -1,12 +0,0 @@ -/* eslint-env node */ -const { nodeResolve } = require('@rollup/plugin-node-resolve'); -const { terser } = require('rollup-plugin-terser'); -const html = require('@open-wc/rollup-plugin-html'); - -module.exports = { - input: './index.html', - output: { - dir: './dist' - }, - plugins: [html(), nodeResolve(), terser()] -}; diff --git a/packages/vaadin-crud/index.html b/packages/vaadin-crud/index.html deleted file mode 100644 index 6fa692498f5..00000000000 --- a/packages/vaadin-crud/index.html +++ /dev/null @@ -1,16 +0,0 @@ - - - - - vaadin-crud - - - - - - - - - diff --git a/packages/vaadin-crud/package.json b/packages/vaadin-crud/package.json index a3e03974f6f..26ba2e35f12 100644 --- a/packages/vaadin-crud/package.json +++ b/packages/vaadin-crud/package.json @@ -24,9 +24,6 @@ "src", "theme" ], - "scripts": { - "dist": "rimraf dist && polymer analyze vaadin-* > analysis.json && rollup -c rollup.config.js && cp analysis.json dist" - }, "dependencies": { "@polymer/iron-media-query": "^3.0.0", "@polymer/polymer": "^3.0.0", @@ -44,12 +41,7 @@ }, "devDependencies": { "@esm-bundle/chai": "^4.1.5", - "@open-wc/rollup-plugin-html": "^1.2.5", "@open-wc/testing-helpers": "^1.8.12", - "@polymer/iron-component-page": "^4.0.0", - "rimraf": "^3.0.2", - "rollup": "^2.34.1", - "rollup-plugin-terser": "^7.0.2", "sinon": "^9.2.1" }, "publishConfig": { diff --git a/packages/vaadin-crud/rollup.config.js b/packages/vaadin-crud/rollup.config.js deleted file mode 100644 index b4695e8ed09..00000000000 --- a/packages/vaadin-crud/rollup.config.js +++ /dev/null @@ -1,12 +0,0 @@ -/* eslint-env node */ -const { nodeResolve } = require('@rollup/plugin-node-resolve'); -const { terser } = require('rollup-plugin-terser'); -const html = require('@open-wc/rollup-plugin-html'); - -module.exports = { - input: './index.html', - output: { - dir: './dist' - }, - plugins: [html(), nodeResolve(), terser()] -}; diff --git a/packages/vaadin-crud/src/vaadin-crud-form.d.ts b/packages/vaadin-crud/src/vaadin-crud-form.d.ts index 392f5b0d0d5..3b02feed47f 100644 --- a/packages/vaadin-crud/src/vaadin-crud-form.d.ts +++ b/packages/vaadin-crud/src/vaadin-crud-form.d.ts @@ -3,11 +3,7 @@ import { FormLayoutElement } from '@vaadin/vaadin-form-layout/src/vaadin-form-la import { IncludedMixin } from './vaadin-crud-include-mixin.js'; /** - * `` is a which automatically can configures all its items based - * on the JSON structure of the first item set. - * - * You cannot manually configure fields but you can still style the layout as it's described in - * `` [Documentation](https://vaadin.com/components/vaadin-form-layout/html-api/elements/Vaadin.FormLayoutElement) + * An element used internally by ``. Not intended to be used separately. */ declare class CrudFormElement extends IncludedMixin(FormLayoutElement) { /** diff --git a/packages/vaadin-crud/src/vaadin-crud-form.js b/packages/vaadin-crud/src/vaadin-crud-form.js index 44e7168b474..18f935b302a 100644 --- a/packages/vaadin-crud/src/vaadin-crud-form.js +++ b/packages/vaadin-crud/src/vaadin-crud-form.js @@ -8,14 +8,11 @@ import '@vaadin/vaadin-text-field/src/vaadin-text-field.js'; import { IncludedMixin } from './vaadin-crud-include-mixin.js'; /** - * `` is a which automatically can configures all its items based - * on the JSON structure of the first item set. - * - * You cannot manually configure fields but you can still style the layout as it's described in - * `` [Documentation](https://vaadin.com/components/vaadin-form-layout/html-api/elements/Vaadin.FormLayoutElement) + * An element used internally by ``. Not intended to be used separately. * * @extends FormLayoutElement * @mixes IncludedMixin + * @private */ class CrudFormElement extends IncludedMixin(FormLayoutElement) { static get is() { diff --git a/packages/vaadin-crud/src/vaadin-crud-grid.d.ts b/packages/vaadin-crud/src/vaadin-crud-grid.d.ts index 6b4dce74579..7bad8d5873d 100644 --- a/packages/vaadin-crud/src/vaadin-crud-grid.d.ts +++ b/packages/vaadin-crud/src/vaadin-crud-grid.d.ts @@ -3,11 +3,7 @@ import { GridElement } from '@vaadin/vaadin-grid/src/vaadin-grid.js'; import { IncludedMixin } from './vaadin-crud-include-mixin.js'; /** - * `` is a `` which automatically configures all its columns based - * on the JSON structure of the first item received. - * - * You cannot manually configure columns but you can still style the grid as it's described in - * `` [Documentation](https://vaadin.com/components/vaadin-grid/html-api/elements/Vaadin.GridElement) + * An element used internally by ``. Not intended to be used separately. */ declare class CrudGridElement extends IncludedMixin(GridElement) { /** diff --git a/packages/vaadin-crud/src/vaadin-crud-grid.js b/packages/vaadin-crud/src/vaadin-crud-grid.js index 448db77023a..8723735f229 100644 --- a/packages/vaadin-crud/src/vaadin-crud-grid.js +++ b/packages/vaadin-crud/src/vaadin-crud-grid.js @@ -12,14 +12,11 @@ import { IncludedMixin } from './vaadin-crud-include-mixin.js'; import './vaadin-crud-edit-column.js'; /** - * `` is a `` which automatically configures all its columns based - * on the JSON structure of the first item received. - * - * You cannot manually configure columns but you can still style the grid as it's described in - * `` [Documentation](https://vaadin.com/components/vaadin-grid/html-api/elements/Vaadin.GridElement) + * An element used internally by ``. Not intended to be used separately. * * @extends GridElement * @mixes IncludedMixin + * @private */ class CrudGridElement extends IncludedMixin(GridElement) { static get is() { diff --git a/packages/vaadin-crud/src/vaadin-crud.d.ts b/packages/vaadin-crud/src/vaadin-crud.d.ts index 0af829130ca..4dda0d89a0e 100644 --- a/packages/vaadin-crud/src/vaadin-crud.d.ts +++ b/packages/vaadin-crud/src/vaadin-crud.d.ts @@ -77,9 +77,9 @@ import { CrudDataProvider, CrudEditorPosition, CrudEventMap, CrudI18n } from './ * ### Helpers * * The following elements are used to auto-configure the grid and the editor - * - [``](#/elements/vaadin-crud-grid) * - [``](#/elements/vaadin-crud-edit-column) - * - [``](#/elements/vaadin-crud-form) + * - `` - can be replaced with custom [``](#/elements/vaadin-grid) + * - `` - can be replaced with custom [``](#/elements/vaadin-form-layout) * * ### Styling * diff --git a/packages/vaadin-crud/src/vaadin-crud.js b/packages/vaadin-crud/src/vaadin-crud.js index ecd9cc55f27..4c9bd7f609f 100644 --- a/packages/vaadin-crud/src/vaadin-crud.js +++ b/packages/vaadin-crud/src/vaadin-crud.js @@ -90,9 +90,9 @@ import './vaadin-crud-form.js'; * ### Helpers * * The following elements are used to auto-configure the grid and the editor - * - [``](#/elements/vaadin-crud-grid) * - [``](#/elements/vaadin-crud-edit-column) - * - [``](#/elements/vaadin-crud-form) + * - `` - can be replaced with custom [``](#/elements/vaadin-grid) + * - `` - can be replaced with custom [``](#/elements/vaadin-form-layout) * * ### Styling * diff --git a/packages/vaadin-crud/src/vaadin-dialog-layout.js b/packages/vaadin-crud/src/vaadin-dialog-layout.js index 9f3ffb84096..19d1dfb6b3b 100644 --- a/packages/vaadin-crud/src/vaadin-dialog-layout.js +++ b/packages/vaadin-crud/src/vaadin-dialog-layout.js @@ -8,235 +8,192 @@ import { ThemableMixin } from '@vaadin/vaadin-themable-mixin/vaadin-themable-mix import { ElementMixin } from '@vaadin/vaadin-element-mixin/vaadin-element-mixin.js'; import '@vaadin/vaadin-dialog/src/vaadin-dialog.js'; -// Although the class is annotated as private, we need to indirect define it -// in order to skip its API in the component page -const DialogLayout = (() => - /** - * DISCLAIMER: This is an internal implementation of a web component, hence its - * API and implementation details might change without any advise for future releases. - * - * `` configures a `vaadin-dialog` with a layout - * containing a scrollable header and body, and a fix positioned footer. - * In desktop the content is shown in a dialog whereas in mobile it is - * displayed in fullscreen. - * - * ``` - * - *
Header
- *
Body
- *
Footer
- * - * ``` - * - * ### Styling - * - * The following Shadow DOM parts are available for styling the dialog parts: - * - * Part name | Description - * -----------|---------------------------------------------------------| - * `scroller` | Scrollable container, includes the header and the body - * `header` | Container for the header content - * `footer` | Container for the footer content - * - * See [ThemableMixin – how to apply styles for shadow parts](https://github.com/vaadin/vaadin-themable-mixin/wiki) - * - * ### Custom content - * - * The following parts are available for providing content. - * - * Slot name | Description - * ------------------|---------------------------------------------------------| - * `header` | The header content - * `(no name)` | The body content - * `footer` | The footer content - * - * - * @private - * @mixes ElementMixin - * @mixes ThemableMixin - */ - class extends ElementMixin(ThemableMixin(PolymerElement)) { - static get is() { - return 'vaadin-dialog-layout'; - } - - static get template() { - return html` - - -
-
- - -
- -
- +/** + * An element used internally by ``. Not intended to be used separately. + * + * @extends HTMLElement + * @mixes ElementMixin + * @mixes ThemableMixin + * @private + */ +class DialogLayout extends ElementMixin(ThemableMixin(PolymerElement)) { + static get is() { + return 'vaadin-dialog-layout'; + } + + static get template() { + return html` + + +
+
+ +
- - - - `; - } - - static get properties() { - return { - /** - * True if the overlay is currently displayed. - */ - opened: { - type: Boolean, - value: false, - notify: true, - reflectToAttribute: true, - observer: '_openedChanged' - }, - - editorPosition: { - type: String, - reflectToAttribute: true - }, - - /** Theme to use */ - theme: String, - - /** Disable closing when user clicks outside */ - noCloseOnOutsideClick: Boolean, - - /** Disable closing when user presses escape */ - noCloseOnEsc: Boolean, - - mobile: { - type: Boolean, - observer: '__mobileChanged', - reflectToAttribute: true - }, - - __ariaLabel: String - }; - } - - ready() { - super.ready(); - this._dialogOpenedChangedListener = this._dialogOpenedChangedListener.bind(this); - this.$.dialog.addEventListener('opened-changed', this._dialogOpenedChangedListener); - } - - _dialogOpenedChangedListener() { - this.opened = this.$.dialog.opened; +
+ +
+
+ + + + + `; + } + + static get properties() { + return { + /** + * True if the overlay is currently displayed. + */ + opened: { + type: Boolean, + value: false, + notify: true, + reflectToAttribute: true, + observer: '_openedChanged' + }, + + editorPosition: { + type: String, + reflectToAttribute: true + }, + + /** Theme to use */ + theme: String, + + /** Disable closing when user clicks outside */ + noCloseOnOutsideClick: Boolean, + + /** Disable closing when user presses escape */ + noCloseOnEsc: Boolean, + + mobile: { + type: Boolean, + observer: '__mobileChanged', + reflectToAttribute: true + }, + + __ariaLabel: String + }; + } + + ready() { + super.ready(); + this._dialogOpenedChangedListener = this._dialogOpenedChangedListener.bind(this); + this.$.dialog.addEventListener('opened-changed', this._dialogOpenedChangedListener); + } + + _dialogOpenedChangedListener() { + this.opened = this.$.dialog.opened; + } + + _openedChanged(opened) { + if (opened) { + this._ensureChildren(); } - _openedChanged(opened) { - if (opened) { - this._ensureChildren(); - } + // Make sure to reset scroll position + this.$.scroller.scrollTop = 0; + } - // Make sure to reset scroll position - this.$.scroller.scrollTop = 0; - } + __mobileChanged() { + this._ensureChildren(); + } - __mobileChanged() { - this._ensureChildren(); + _ensureChildren() { + if (!this.$.dialog.$.overlay.$.content.shadowRoot) { + return; } - _ensureChildren() { - if (!this.$.dialog.$.overlay.$.content.shadowRoot) { - return; - } - - if (this.editorPosition === '' || this.mobile) { - // Move children from editor to dialog - Array.from(this.$.editor.childNodes).forEach((c) => - this.$.dialog.$.overlay.$.content.shadowRoot.appendChild(c) - ); - Array.from(this.childNodes).forEach((c) => this.$.dialog.$.overlay.$.content.appendChild(c)); - - // Wait to set label until slotted element have been moved. - setTimeout(() => { - this.__ariaLabel = Array.from(this.$.dialog.$.overlay.$.content.querySelectorAll('[slot=header]')) - .reduce((prev, ele) => prev + ' ' + ele.textContent, '') - .trim(); - }); - } else { - // Move children from dialog to editor - Array.from(this.$.dialog.$.overlay.$.content.shadowRoot.childNodes).forEach((c) => - this.$.editor.appendChild(c) - ); - Array.from(this.$.dialog.$.overlay.$.content.childNodes).forEach((c) => this.appendChild(c)); - - // Wait to set label until slotted element have been moved. - setTimeout(() => { - this.__ariaLabel = Array.from(this.querySelectorAll('[slot=header]')) - .reduce((prev, ele) => prev + ' ' + ele.textContent, '') - .trim(); - }); - } + if (this.editorPosition === '' || this.mobile) { + // Move children from editor to dialog + Array.from(this.$.editor.childNodes).forEach((c) => this.$.dialog.$.overlay.$.content.shadowRoot.appendChild(c)); + Array.from(this.childNodes).forEach((c) => this.$.dialog.$.overlay.$.content.appendChild(c)); + + // Wait to set label until slotted element have been moved. + setTimeout(() => { + this.__ariaLabel = Array.from(this.$.dialog.$.overlay.$.content.querySelectorAll('[slot=header]')) + .reduce((prev, ele) => prev + ' ' + ele.textContent, '') + .trim(); + }); + } else { + // Move children from dialog to editor + Array.from(this.$.dialog.$.overlay.$.content.shadowRoot.childNodes).forEach((c) => this.$.editor.appendChild(c)); + Array.from(this.$.dialog.$.overlay.$.content.childNodes).forEach((c) => this.appendChild(c)); + + // Wait to set label until slotted element have been moved. + setTimeout(() => { + this.__ariaLabel = Array.from(this.querySelectorAll('[slot=header]')) + .reduce((prev, ele) => prev + ' ' + ele.textContent, '') + .trim(); + }); } + } - _computeEditorOpened(opened, isMobile, ...editorPositions) { - if (isMobile && editorPositions.indexOf('') !== -1) { - return opened; - } - return editorPositions.indexOf(this.editorPosition) !== -1 && opened; + _computeEditorOpened(opened, isMobile, ...editorPositions) { + if (isMobile && editorPositions.indexOf('') !== -1) { + return opened; } - })(); + return editorPositions.indexOf(this.editorPosition) !== -1 && opened; + } +} customElements.define(DialogLayout.is, DialogLayout); diff --git a/packages/vaadin-custom-field/index.html b/packages/vaadin-custom-field/index.html deleted file mode 100644 index 4cc3610a7d9..00000000000 --- a/packages/vaadin-custom-field/index.html +++ /dev/null @@ -1,16 +0,0 @@ - - - - - vaadin-custom-field - - - - - - - - - diff --git a/packages/vaadin-custom-field/package.json b/packages/vaadin-custom-field/package.json index 8c3f00024cc..d6c572e1e66 100644 --- a/packages/vaadin-custom-field/package.json +++ b/packages/vaadin-custom-field/package.json @@ -24,9 +24,6 @@ "src", "theme" ], - "scripts": { - "dist": "rimraf dist && polymer analyze vaadin-* > analysis.json && rollup -c rollup.config.js && cp analysis.json dist" - }, "dependencies": { "@polymer/polymer": "^3.0.0", "@vaadin/vaadin-element-mixin": "^20.0.0-alpha1", @@ -36,9 +33,7 @@ }, "devDependencies": { "@esm-bundle/chai": "^4.1.5", - "@open-wc/rollup-plugin-html": "^1.2.5", "@open-wc/testing-helpers": "^1.8.0", - "@polymer/iron-component-page": "^4.0.0", "@polymer/iron-test-helpers": "^3.0.0", "@vaadin/vaadin-date-picker": "^20.0.0-alpha1", "@vaadin/vaadin-form-layout": "^20.0.0-alpha1", @@ -46,9 +41,6 @@ "@vaadin/vaadin-select": "^20.0.0-alpha1", "@vaadin/vaadin-text-field": "^20.0.0-alpha1", "@vaadin/vaadin-time-picker": "^20.0.0-alpha1", - "rimraf": "^3.0.2", - "rollup": "^2.34.1", - "rollup-plugin-terser": "^7.0.2", "sinon": "^9.2.0" }, "publishConfig": { diff --git a/packages/vaadin-custom-field/rollup.config.js b/packages/vaadin-custom-field/rollup.config.js deleted file mode 100644 index b4695e8ed09..00000000000 --- a/packages/vaadin-custom-field/rollup.config.js +++ /dev/null @@ -1,12 +0,0 @@ -/* eslint-env node */ -const { nodeResolve } = require('@rollup/plugin-node-resolve'); -const { terser } = require('rollup-plugin-terser'); -const html = require('@open-wc/rollup-plugin-html'); - -module.exports = { - input: './index.html', - output: { - dir: './dist' - }, - plugins: [html(), nodeResolve(), terser()] -}; diff --git a/packages/vaadin-date-picker/index.html b/packages/vaadin-date-picker/index.html deleted file mode 100644 index 3d426e3453b..00000000000 --- a/packages/vaadin-date-picker/index.html +++ /dev/null @@ -1,18 +0,0 @@ - - - - - - - vaadin-date-picker - - - - - - - - - diff --git a/packages/vaadin-date-picker/package.json b/packages/vaadin-date-picker/package.json index bbd435f34b5..3af879aec70 100644 --- a/packages/vaadin-date-picker/package.json +++ b/packages/vaadin-date-picker/package.json @@ -23,9 +23,6 @@ "src", "theme" ], - "scripts": { - "dist": "rimraf dist && polymer analyze vaadin-* > analysis.json && rollup -c rollup.config.js && cp analysis.json dist" - }, "dependencies": { "@polymer/iron-a11y-announcer": "^3.0.0", "@polymer/iron-a11y-keys-behavior": "^3.0.0", @@ -43,14 +40,9 @@ }, "devDependencies": { "@esm-bundle/chai": "^4.1.5", - "@open-wc/rollup-plugin-html": "^1.2.5", "@open-wc/testing-helpers": "^1.8.0", - "@polymer/iron-component-page": "^4.0.0", "@polymer/iron-test-helpers": "^3.0.0", "@vaadin/vaadin-dialog": "^20.0.0-alpha1", - "rimraf": "^3.0.2", - "rollup": "^2.34.1", - "rollup-plugin-terser": "^7.0.2", "sinon": "^9.2.0" }, "publishConfig": { diff --git a/packages/vaadin-date-picker/rollup.config.js b/packages/vaadin-date-picker/rollup.config.js deleted file mode 100644 index b4695e8ed09..00000000000 --- a/packages/vaadin-date-picker/rollup.config.js +++ /dev/null @@ -1,12 +0,0 @@ -/* eslint-env node */ -const { nodeResolve } = require('@rollup/plugin-node-resolve'); -const { terser } = require('rollup-plugin-terser'); -const html = require('@open-wc/rollup-plugin-html'); - -module.exports = { - input: './index.html', - output: { - dir: './dist' - }, - plugins: [html(), nodeResolve(), terser()] -}; diff --git a/packages/vaadin-date-picker/src/vaadin-date-picker-overlay.js b/packages/vaadin-date-picker/src/vaadin-date-picker-overlay.js index 5992c2bdb6a..d3c85dc8e4c 100644 --- a/packages/vaadin-date-picker/src/vaadin-date-picker-overlay.js +++ b/packages/vaadin-date-picker/src/vaadin-date-picker-overlay.js @@ -7,15 +7,9 @@ import { OverlayElement } from '@vaadin/vaadin-overlay/src/vaadin-overlay.js'; import { DisableUpgradeMixin } from '@polymer/polymer/lib/mixins/disable-upgrade-mixin.js'; /** - * The overlay element. - * - * ### Styling - * - * See [`` documentation](https://github.com/vaadin/vaadin-overlay/blob/master/src/vaadin-overlay.html) - * for `` parts. - * - * See [ThemableMixin – how to apply styles for shadow parts](https://github.com/vaadin/vaadin-themable-mixin/wiki) + * An element used internally by ``. Not intended to be used separately. * + * @extends OverlayElement * @private */ class DatePickerOverlayElement extends DisableUpgradeMixin(OverlayElement) { diff --git a/packages/vaadin-date-picker/src/vaadin-date-picker-text-field.js b/packages/vaadin-date-picker/src/vaadin-date-picker-text-field.js index 3cf652c924f..0eb380feb74 100644 --- a/packages/vaadin-date-picker/src/vaadin-date-picker-text-field.js +++ b/packages/vaadin-date-picker/src/vaadin-date-picker-text-field.js @@ -27,16 +27,10 @@ registerStyles( ); /** - * The text-field element for date input. + * An element used internally by ``. Not intended to be used separately. * - * ### Styling - * - * See [`` documentation](https://github.com/vaadin/vaadin-text-field/blob/master/src/vaadin-text-field.html) - * for `` parts and available slots (prefix, suffix etc.) - * - * See [ThemableMixin – how to apply styles for shadow parts](https://github.com/vaadin/vaadin-themable-mixin/wiki) - * - * @extends TextFieldElement + * @extends OverlayElement + * @private */ class DatePickerTextFieldElement extends TextFieldElement { static get is() { diff --git a/packages/vaadin-date-picker/src/vaadin-date-picker.d.ts b/packages/vaadin-date-picker/src/vaadin-date-picker.d.ts index db99777c160..a9a86222a9d 100644 --- a/packages/vaadin-date-picker/src/vaadin-date-picker.d.ts +++ b/packages/vaadin-date-picker/src/vaadin-date-picker.d.ts @@ -70,16 +70,18 @@ import { DatePickerEventMap } from './interfaces'; * If you want to replace the default input field with a custom implementation, you should use the * [``](#vaadin-date-picker-light) element. * + * ### Internal components + * * In addition to `` itself, the following internal * components are themable: * - * - `` - * - `` + * - `` - has the same API as [``](#/elements/vaadin-text-field). + * - `` - has the same API as [``](#/elements/vaadin-overlay). * - `` * - `` * * Note: the `theme` attribute value set on `` is - * propagated to the internal themable components listed above. + * propagated to the internal components listed above. * * @fires {Event} change - Fired when the user commits a value change. * @fires {CustomEvent} invalid-changed - Fired when the `invalid` property changes. diff --git a/packages/vaadin-date-picker/src/vaadin-date-picker.js b/packages/vaadin-date-picker/src/vaadin-date-picker.js index c9f7aa75ea9..99076b1f5b0 100644 --- a/packages/vaadin-date-picker/src/vaadin-date-picker.js +++ b/packages/vaadin-date-picker/src/vaadin-date-picker.js @@ -75,16 +75,18 @@ import { afterNextRender } from '@polymer/polymer/lib/utils/render-status.js'; * If you want to replace the default input field with a custom implementation, you should use the * [``](#vaadin-date-picker-light) element. * + * ### Internal components + * * In addition to `` itself, the following internal * components are themable: * - * - `` - * - `` + * - `` - has the same API as [``](#/elements/vaadin-text-field). + * - `` - has the same API as [``](#/elements/vaadin-overlay). * - `` * - `` * * Note: the `theme` attribute value set on `` is - * propagated to the internal themable components listed above. + * propagated to the internal components listed above. * * @fires {Event} change - Fired when the user commits a value change. * @fires {CustomEvent} invalid-changed - Fired when the `invalid` property changes. diff --git a/packages/vaadin-date-time-picker/index.html b/packages/vaadin-date-time-picker/index.html deleted file mode 100644 index d29055f5b97..00000000000 --- a/packages/vaadin-date-time-picker/index.html +++ /dev/null @@ -1,16 +0,0 @@ - - - - - vaadin-date-time-picker - - - - - - - - - diff --git a/packages/vaadin-date-time-picker/package.json b/packages/vaadin-date-time-picker/package.json index 20dafd26b27..10e09d58363 100644 --- a/packages/vaadin-date-time-picker/package.json +++ b/packages/vaadin-date-time-picker/package.json @@ -24,9 +24,6 @@ "src", "theme" ], - "scripts": { - "dist": "rimraf dist && polymer analyze vaadin-* > analysis.json && rollup -c rollup.config.js && cp analysis.json dist" - }, "dependencies": { "@polymer/polymer": "^3.0.0", "@vaadin/vaadin-custom-field": "^20.0.0-alpha1", @@ -39,12 +36,7 @@ }, "devDependencies": { "@esm-bundle/chai": "^4.1.5", - "@open-wc/rollup-plugin-html": "^1.2.5", - "@polymer/iron-component-page": "^4.0.0", "@vaadin/testing-helpers": "^0.1.3", - "rimraf": "^3.0.2", - "rollup": "^2.34.1", - "rollup-plugin-terser": "^7.0.2", "sinon": "^9.2.1" }, "publishConfig": { diff --git a/packages/vaadin-date-time-picker/rollup.config.js b/packages/vaadin-date-time-picker/rollup.config.js deleted file mode 100644 index b4695e8ed09..00000000000 --- a/packages/vaadin-date-time-picker/rollup.config.js +++ /dev/null @@ -1,12 +0,0 @@ -/* eslint-env node */ -const { nodeResolve } = require('@rollup/plugin-node-resolve'); -const { terser } = require('rollup-plugin-terser'); -const html = require('@open-wc/rollup-plugin-html'); - -module.exports = { - input: './index.html', - output: { - dir: './dist' - }, - plugins: [html(), nodeResolve(), terser()] -}; diff --git a/packages/vaadin-date-time-picker/src/vaadin-date-time-picker-custom-field.js b/packages/vaadin-date-time-picker/src/vaadin-date-time-picker-custom-field.js index f9646dd69d9..545fa272524 100644 --- a/packages/vaadin-date-time-picker/src/vaadin-date-time-picker-custom-field.js +++ b/packages/vaadin-date-time-picker/src/vaadin-date-time-picker-custom-field.js @@ -18,16 +18,10 @@ registerStyles( ); /** - * The custom-field element. + * An element used internally by ``. Not intended to be used separately. * - * ### Styling - * - * See [`` documentation](https://github.com/vaadin/vaadin-custom-field/blob/master/src/vaadin-custom-field.html) - * for `` parts and available slots (prefix, suffix etc.) - * - * See [ThemableMixin – how to apply styles for shadow parts](https://github.com/vaadin/vaadin-themable-mixin/wiki) - * - * @extends HTMLElement + * @extends CustomFieldElement + * @private */ class DateTimePickerCustomFieldElement extends CustomFieldElement { static get is() { diff --git a/packages/vaadin-date-time-picker/src/vaadin-date-time-picker-date-picker.js b/packages/vaadin-date-time-picker/src/vaadin-date-time-picker-date-picker.js index d3ba2e6007e..488184021ea 100644 --- a/packages/vaadin-date-time-picker/src/vaadin-date-time-picker-date-picker.js +++ b/packages/vaadin-date-time-picker/src/vaadin-date-time-picker-date-picker.js @@ -9,16 +9,10 @@ import './vaadin-date-time-picker-date-text-field.js'; let memoizedTemplate; /** - * The date-picker element. + * An element used internally by ``. Not intended to be used separately. * - * ### Styling - * - * See [`` documentation](https://github.com/vaadin/vaadin-date-picker/blob/master/src/vaadin-date-picker.html) - * for `` parts and available slots (prefix, suffix etc.) - * - * See [ThemableMixin – how to apply styles for shadow parts](https://github.com/vaadin/vaadin-themable-mixin/wiki) - * - * @extends HTMLElement + * @extends DatePickerElement + * @private */ class DateTimePickerDatePickerElement extends DatePickerElement { static get is() { diff --git a/packages/vaadin-date-time-picker/src/vaadin-date-time-picker-date-text-field.js b/packages/vaadin-date-time-picker/src/vaadin-date-time-picker-date-text-field.js index 2c4641401f2..3ec7eba2705 100644 --- a/packages/vaadin-date-time-picker/src/vaadin-date-time-picker-date-text-field.js +++ b/packages/vaadin-date-time-picker/src/vaadin-date-time-picker-date-text-field.js @@ -6,16 +6,10 @@ import { TextFieldElement } from '@vaadin/vaadin-text-field/src/vaadin-text-field.js'; /** - * The text-field element for date input. + * An element used internally by ``. Not intended to be used separately. * - * ### Styling - * - * See [`` documentation](https://github.com/vaadin/vaadin-text-field/blob/master/src/vaadin-text-field.html) - * for `` parts and available slots (prefix, suffix etc.) - * - * See [ThemableMixin – how to apply styles for shadow parts](https://github.com/vaadin/vaadin-themable-mixin/wiki) - * - * @extends HTMLElement + * @extends TextFieldElement + * @private */ class DateTimePickerDateTextFieldElement extends TextFieldElement { static get is() { diff --git a/packages/vaadin-date-time-picker/src/vaadin-date-time-picker-time-picker.js b/packages/vaadin-date-time-picker/src/vaadin-date-time-picker-time-picker.js index b081add51d8..c98e90d206c 100644 --- a/packages/vaadin-date-time-picker/src/vaadin-date-time-picker-time-picker.js +++ b/packages/vaadin-date-time-picker/src/vaadin-date-time-picker-time-picker.js @@ -9,16 +9,10 @@ import './vaadin-date-time-picker-time-text-field.js'; let memoizedTemplate; /** - * The time-picker element. + * An element used internally by ``. Not intended to be used separately. * - * ### Styling - * - * See [`` documentation](https://github.com/vaadin/vaadin-time-picker/blob/master/src/vaadin-time-picker.html) - * for `` parts and available slots (prefix, suffix etc.) - * - * See [ThemableMixin – how to apply styles for shadow parts](https://github.com/vaadin/vaadin-themable-mixin/wiki) - * - * @extends HTMLElement + * @extends TimePickerElement + * @private */ class DateTimePickerTimePickerElement extends TimePickerElement { static get is() { diff --git a/packages/vaadin-date-time-picker/src/vaadin-date-time-picker-time-text-field.js b/packages/vaadin-date-time-picker/src/vaadin-date-time-picker-time-text-field.js index 620e4a1d601..f8a59c1f6f8 100644 --- a/packages/vaadin-date-time-picker/src/vaadin-date-time-picker-time-text-field.js +++ b/packages/vaadin-date-time-picker/src/vaadin-date-time-picker-time-text-field.js @@ -6,16 +6,10 @@ import { TextFieldElement } from '@vaadin/vaadin-text-field/src/vaadin-text-field.js'; /** - * The text-field element for time input. + * An element used internally by ``. Not intended to be used separately. * - * ### Styling - * - * See [`` documentation](https://github.com/vaadin/vaadin-text-field/blob/master/src/vaadin-text-field.html) - * for `` parts and available slots (prefix, suffix etc.) - * - * See [ThemableMixin – how to apply styles for shadow parts](https://github.com/vaadin/vaadin-themable-mixin/wiki) - * - * @extends HTMLElement + * @extends TextFieldElement + * @private */ class DateTimePickerTimeTextFieldElement extends TextFieldElement { static get is() { diff --git a/packages/vaadin-date-time-picker/src/vaadin-date-time-picker.d.ts b/packages/vaadin-date-time-picker/src/vaadin-date-time-picker.d.ts index e16d9efd300..c60d308a9c1 100644 --- a/packages/vaadin-date-time-picker/src/vaadin-date-time-picker.d.ts +++ b/packages/vaadin-date-time-picker/src/vaadin-date-time-picker.d.ts @@ -35,21 +35,19 @@ import { DateTimePickerEventMap, DateTimePickerI18n } from './interfaces'; * * See [ThemableMixin – Stylable Shadow Parts](https://github.com/vaadin/vaadin-themable-mixin#stylable-shadow-parts) * + * ### Internal components + * * In addition to `` itself, the following internal * components are themable: * - * - ``, see - * [`custom-field` documentation](https://vaadin.com/components/vaadin-custom-field/html-api/elements/Vaadin.CustomFieldElement) - * for the custom field parts. - * - ``, see - * [`date-picker` documentation](https://vaadin.com/components/vaadin-date-picker/html-api/elements/Vaadin.DatePickerElement) - * for the date picker parts. - * - ``, see - * [`time-picker` documentation](https://vaadin.com/components/vaadin-time-picker/html-api/elements/Vaadin.TimePickerElement) - * for the time picker parts. + * - `` - has the same API as [``](#/elements/vaadin-date-picker). + * - `` - has the same API as [``](#/elements/vaadin-time-picker). + * - `` - has the same API as [``](#/elements/vaadin-text-field). + * - `` - has the same API as [``](#/elements/vaadin-text-field). + * - `` - has the same API as [``](#/elements/vaadin-custom-field). * * Note: the `theme` attribute value set on `` is - * propagated to the internal themable components listed above. + * propagated to the internal components listed above. * * @fires {Event} change - Fired when the user commits a value change. * @fires {CustomEvent} invalid-changed - Fired when the `invalid` property changes. @@ -191,9 +189,8 @@ declare class DateTimePickerElement extends ElementMixin(ThemableMixin(HTMLEleme * `i18n` object or just the properties you want to modify. * * The object is a combination of the i18n properties supported by - * `` and ``. See `i18n` property at: - * - [`date-picker` documentation](https://vaadin.com/components/vaadin-date-picker/html-api/elements/Vaadin.DatePickerElement) - * - [`time-picker` documentation](https://vaadin.com/components/vaadin-time-picker/html-api/elements/Vaadin.TimePickerElement) + * [``](#/elements/vaadin-date-picker) and + * [``](#/elements/vaadin-time-picker). */ i18n: DateTimePickerI18n; diff --git a/packages/vaadin-date-time-picker/src/vaadin-date-time-picker.js b/packages/vaadin-date-time-picker/src/vaadin-date-time-picker.js index ed5ed630d3a..63c74538f5f 100644 --- a/packages/vaadin-date-time-picker/src/vaadin-date-time-picker.js +++ b/packages/vaadin-date-time-picker/src/vaadin-date-time-picker.js @@ -67,21 +67,19 @@ const timePickerI18nProps = Object.keys(timePickerI18nDefaults); * * See [ThemableMixin – Stylable Shadow Parts](https://github.com/vaadin/vaadin-themable-mixin#stylable-shadow-parts) * + * ### Internal components + * * In addition to `` itself, the following internal * components are themable: * - * - ``, see - * [`custom-field` documentation](https://vaadin.com/components/vaadin-custom-field/html-api/elements/Vaadin.CustomFieldElement) - * for the custom field parts. - * - ``, see - * [`date-picker` documentation](https://vaadin.com/components/vaadin-date-picker/html-api/elements/Vaadin.DatePickerElement) - * for the date picker parts. - * - ``, see - * [`time-picker` documentation](https://vaadin.com/components/vaadin-time-picker/html-api/elements/Vaadin.TimePickerElement) - * for the time picker parts. + * - `` - has the same API as [``](#/elements/vaadin-date-picker). + * - `` - has the same API as [``](#/elements/vaadin-time-picker). + * - `` - has the same API as [``](#/elements/vaadin-text-field). + * - `` - has the same API as [``](#/elements/vaadin-text-field). + * - `` - has the same API as [``](#/elements/vaadin-custom-field). * * Note: the `theme` attribute value set on `` is - * propagated to the internal themable components listed above. + * propagated to the internal components listed above. * * @fires {Event} change - Fired when the user commits a value change. * @fires {CustomEvent} invalid-changed - Fired when the `invalid` property changes. @@ -383,9 +381,8 @@ class DateTimePickerElement extends ElementMixin(ThemableMixin(PolymerElement)) * `i18n` object or just the properties you want to modify. * * The object is a combination of the i18n properties supported by - * `` and ``. See `i18n` property at: - * - [`date-picker` documentation](https://vaadin.com/components/vaadin-date-picker/html-api/elements/Vaadin.DatePickerElement) - * - [`time-picker` documentation](https://vaadin.com/components/vaadin-time-picker/html-api/elements/Vaadin.TimePickerElement) + * [``](#/elements/vaadin-date-picker) and + * [``](#/elements/vaadin-time-picker). * @type {!DateTimePickerI18n} */ i18n: { diff --git a/packages/vaadin-details/index.html b/packages/vaadin-details/index.html deleted file mode 100644 index fc8c8b66d54..00000000000 --- a/packages/vaadin-details/index.html +++ /dev/null @@ -1,16 +0,0 @@ - - - - - vaadin-details - - - - - - - - - diff --git a/packages/vaadin-details/package.json b/packages/vaadin-details/package.json index 001a18a62ef..8841f82a6e9 100644 --- a/packages/vaadin-details/package.json +++ b/packages/vaadin-details/package.json @@ -24,9 +24,6 @@ "src", "theme" ], - "scripts": { - "dist": "rimraf dist && polymer analyze vaadin-* > analysis.json && rollup -c rollup.config.js && cp analysis.json dist" - }, "dependencies": { "@polymer/polymer": "^3.0.0", "@vaadin/vaadin-control-state-mixin": "^20.0.0-alpha1", @@ -37,13 +34,8 @@ }, "devDependencies": { "@esm-bundle/chai": "^4.1.5", - "@open-wc/rollup-plugin-html": "^1.2.5", "@open-wc/testing-helpers": "^1.8.12", - "@polymer/iron-component-page": "^4.0.0", "@polymer/iron-test-helpers": "^3.0.0", - "rimraf": "^3.0.2", - "rollup": "^2.34.1", - "rollup-plugin-terser": "^7.0.2", "sinon": "^9.2.1" }, "publishConfig": { diff --git a/packages/vaadin-details/rollup.config.js b/packages/vaadin-details/rollup.config.js deleted file mode 100644 index b4695e8ed09..00000000000 --- a/packages/vaadin-details/rollup.config.js +++ /dev/null @@ -1,12 +0,0 @@ -/* eslint-env node */ -const { nodeResolve } = require('@rollup/plugin-node-resolve'); -const { terser } = require('rollup-plugin-terser'); -const html = require('@open-wc/rollup-plugin-html'); - -module.exports = { - input: './index.html', - output: { - dir: './dist' - }, - plugins: [html(), nodeResolve(), terser()] -}; diff --git a/packages/vaadin-dialog/index.html b/packages/vaadin-dialog/index.html deleted file mode 100644 index 59041cee51f..00000000000 --- a/packages/vaadin-dialog/index.html +++ /dev/null @@ -1,16 +0,0 @@ - - - - - vaadin-dialog - - - - - - - - diff --git a/packages/vaadin-dialog/package.json b/packages/vaadin-dialog/package.json index ac7deb08c6b..5d226ac59e6 100644 --- a/packages/vaadin-dialog/package.json +++ b/packages/vaadin-dialog/package.json @@ -24,9 +24,6 @@ "src", "theme" ], - "scripts": { - "dist": "rimraf dist && polymer analyze vaadin-* > analysis.json && rollup -c rollup.config.js && cp analysis.json dist" - }, "dependencies": { "@polymer/iron-resizable-behavior": "^3.0.0", "@polymer/polymer": "^3.0.0", @@ -38,14 +35,9 @@ }, "devDependencies": { "@esm-bundle/chai": "^4.1.5", - "@open-wc/rollup-plugin-html": "^1.2.5", "@open-wc/testing-helpers": "^1.8.12", - "@polymer/iron-component-page": "^4.0.0", "@polymer/iron-test-helpers": "^3.0.0", "@vaadin/vaadin-text-field": "^20.0.0-alpha1", - "rimraf": "^3.0.2", - "rollup": "^2.34.1", - "rollup-plugin-terser": "^7.0.2", "sinon": "^9.2.1" }, "publishConfig": { diff --git a/packages/vaadin-dialog/rollup.config.js b/packages/vaadin-dialog/rollup.config.js deleted file mode 100644 index b4695e8ed09..00000000000 --- a/packages/vaadin-dialog/rollup.config.js +++ /dev/null @@ -1,12 +0,0 @@ -/* eslint-env node */ -const { nodeResolve } = require('@rollup/plugin-node-resolve'); -const { terser } = require('rollup-plugin-terser'); -const html = require('@open-wc/rollup-plugin-html'); - -module.exports = { - input: './index.html', - output: { - dir: './dist' - }, - plugins: [html(), nodeResolve(), terser()] -}; diff --git a/packages/vaadin-dialog/src/vaadin-dialog.d.ts b/packages/vaadin-dialog/src/vaadin-dialog.d.ts index 9c561f16d96..a988e735829 100644 --- a/packages/vaadin-dialog/src/vaadin-dialog.d.ts +++ b/packages/vaadin-dialog/src/vaadin-dialog.d.ts @@ -53,7 +53,10 @@ import { DialogEventMap, DialogRenderer } from './interfaces'; * * ### Styling * - * See [`` documentation](https://github.com/vaadin/vaadin-overlay/blob/master/src/vaadin-overlay.html) + * `` uses `` internal + * themable component as the actual visible overlay. + * + * See [``](#/elements/vaadin-overlay) documentation. * for `` parts. * * Note: the `theme` attribute value set on `` is diff --git a/packages/vaadin-dialog/src/vaadin-dialog.js b/packages/vaadin-dialog/src/vaadin-dialog.js index 4e40dfe1d6f..25c6973a681 100644 --- a/packages/vaadin-dialog/src/vaadin-dialog.js +++ b/packages/vaadin-dialog/src/vaadin-dialog.js @@ -35,13 +35,9 @@ registerStyles( let memoizedTemplate; /** - * The overlay element. - * - * ### Styling - * - * See [`` documentation](https://github.com/vaadin/vaadin-overlay/blob/master/src/vaadin-overlay.html) - * for `` parts. + * An element used internally by ``. Not intended to be used separately. * + * @extends OverlayElement * @private */ class DialogOverlayElement extends mixinBehaviors(IronResizableBehavior, OverlayElement) { @@ -172,7 +168,10 @@ customElements.define(DialogOverlayElement.is, DialogOverlayElement); * * ### Styling * - * See [`` documentation](https://github.com/vaadin/vaadin-overlay/blob/master/src/vaadin-overlay.html) + * `` uses `` internal + * themable component as the actual visible dialog overlay. + * + * See [``](#/elements/vaadin-overlay) documentation. * for `` parts. * * Note: the `theme` attribute value set on `` is diff --git a/packages/vaadin-form-layout/index.html b/packages/vaadin-form-layout/index.html deleted file mode 100644 index e1532337e59..00000000000 --- a/packages/vaadin-form-layout/index.html +++ /dev/null @@ -1,16 +0,0 @@ - - - - - vaadin-form-layout - - - - - - - - - diff --git a/packages/vaadin-form-layout/package.json b/packages/vaadin-form-layout/package.json index f747908dd6b..c7b4d204071 100644 --- a/packages/vaadin-form-layout/package.json +++ b/packages/vaadin-form-layout/package.json @@ -24,9 +24,6 @@ "src", "theme" ], - "scripts": { - "dist": "rimraf dist && polymer analyze vaadin-* > analysis.json && rollup -c rollup.config.js && cp analysis.json dist" - }, "dependencies": { "@polymer/iron-resizable-behavior": "^3.0.0", "@polymer/polymer": "^3.0.0", @@ -37,14 +34,9 @@ }, "devDependencies": { "@esm-bundle/chai": "^4.1.5", - "@open-wc/rollup-plugin-html": "^1.2.5", "@open-wc/testing-helpers": "^1.8.12", - "@polymer/iron-component-page": "^4.0.0", "@vaadin/vaadin-ordered-layout": "^20.0.0-alpha1", "@vaadin/vaadin-text-field": "^20.0.0-alpha1", - "rimraf": "^3.0.2", - "rollup": "^2.34.1", - "rollup-plugin-terser": "^7.0.2", "sinon": "^9.2.1" }, "publishConfig": { diff --git a/packages/vaadin-form-layout/rollup.config.js b/packages/vaadin-form-layout/rollup.config.js deleted file mode 100644 index b4695e8ed09..00000000000 --- a/packages/vaadin-form-layout/rollup.config.js +++ /dev/null @@ -1,12 +0,0 @@ -/* eslint-env node */ -const { nodeResolve } = require('@rollup/plugin-node-resolve'); -const { terser } = require('rollup-plugin-terser'); -const html = require('@open-wc/rollup-plugin-html'); - -module.exports = { - input: './index.html', - output: { - dir: './dist' - }, - plugins: [html(), nodeResolve(), terser()] -}; diff --git a/packages/vaadin-grid-pro/index.html b/packages/vaadin-grid-pro/index.html deleted file mode 100644 index 08483255d71..00000000000 --- a/packages/vaadin-grid-pro/index.html +++ /dev/null @@ -1,16 +0,0 @@ - - - - - vaadin-grid-pro - - - - - - - - - diff --git a/packages/vaadin-grid-pro/package.json b/packages/vaadin-grid-pro/package.json index 0621d6c7be7..576c37cef1d 100644 --- a/packages/vaadin-grid-pro/package.json +++ b/packages/vaadin-grid-pro/package.json @@ -24,9 +24,6 @@ "src", "theme" ], - "scripts": { - "dist": "rimraf dist && polymer analyze vaadin-* > analysis.json && rollup -c rollup.config.js && cp analysis.json dist" - }, "dependencies": { "@polymer/polymer": "^3.0.0", "@vaadin/vaadin-checkbox": "^20.0.0-alpha1", @@ -43,15 +40,10 @@ }, "devDependencies": { "@esm-bundle/chai": "^4.1.5", - "@open-wc/rollup-plugin-html": "^1.2.5", "@open-wc/testing-helpers": "^1.8.12", - "@polymer/iron-component-page": "^4.0.0", "@polymer/iron-test-helpers": "^3.0.0", "@vaadin/vaadin-date-picker": "^20.0.0-alpha1", "@vaadin/vaadin-dialog": "^20.0.0-alpha1", - "rimraf": "^3.0.2", - "rollup": "^2.34.1", - "rollup-plugin-terser": "^7.0.2", "sinon": "^9.2.1" }, "publishConfig": { diff --git a/packages/vaadin-grid-pro/rollup.config.js b/packages/vaadin-grid-pro/rollup.config.js deleted file mode 100644 index b4695e8ed09..00000000000 --- a/packages/vaadin-grid-pro/rollup.config.js +++ /dev/null @@ -1,12 +0,0 @@ -/* eslint-env node */ -const { nodeResolve } = require('@rollup/plugin-node-resolve'); -const { terser } = require('rollup-plugin-terser'); -const html = require('@open-wc/rollup-plugin-html'); - -module.exports = { - input: './index.html', - output: { - dir: './dist' - }, - plugins: [html(), nodeResolve(), terser()] -}; diff --git a/packages/vaadin-grid-pro/src/vaadin-grid-pro-edit-checkbox.js b/packages/vaadin-grid-pro/src/vaadin-grid-pro-edit-checkbox.js index bf97bf80626..5839fc03706 100644 --- a/packages/vaadin-grid-pro/src/vaadin-grid-pro-edit-checkbox.js +++ b/packages/vaadin-grid-pro/src/vaadin-grid-pro-edit-checkbox.js @@ -7,14 +7,10 @@ import { CheckboxElement } from '@vaadin/vaadin-checkbox/src/vaadin-checkbox.js'; /** - * The cell editor checkbox element. + * An element used internally by ``. Not intended to be used separately. * - * ### Styling - * - * See [`` documentation](https://github.com/vaadin/vaadin-checkbox/blob/master/src/vaadin-checkbox.html) - * for `` parts. - * - * See [ThemableMixin – how to apply styles for shadow parts](https://github.com/vaadin/vaadin-themable-mixin/wiki) + * @extends CheckboxElement + * @private */ class GridProEditCheckboxElement extends CheckboxElement { static get is() { diff --git a/packages/vaadin-grid-pro/src/vaadin-grid-pro-edit-select.js b/packages/vaadin-grid-pro/src/vaadin-grid-pro-edit-select.js index cdaba69ef90..fb18a6706ac 100644 --- a/packages/vaadin-grid-pro/src/vaadin-grid-pro-edit-select.js +++ b/packages/vaadin-grid-pro/src/vaadin-grid-pro-edit-select.js @@ -9,14 +9,10 @@ import '@vaadin/vaadin-list-box/src/vaadin-list-box.js'; import '@vaadin/vaadin-item/src/vaadin-item.js'; /** - * The cell editor select element. + * An element used internally by ``. Not intended to be used separately. * - * ### Styling - * - * See [`` documentation](https://github.com/vaadin/vaadin-select/blob/master/src/vaadin-select.html) - * for `` parts. - * - * See [ThemableMixin – how to apply styles for shadow parts](https://github.com/vaadin/vaadin-themable-mixin/wiki) + * @extends SelectElement + * @private */ class GridProEditSelectElement extends SelectElement { static get is() { diff --git a/packages/vaadin-grid-pro/src/vaadin-grid-pro-edit-text-field.js b/packages/vaadin-grid-pro/src/vaadin-grid-pro-edit-text-field.js index e63de2bd3fd..fd7711b1d8d 100644 --- a/packages/vaadin-grid-pro/src/vaadin-grid-pro-edit-text-field.js +++ b/packages/vaadin-grid-pro/src/vaadin-grid-pro-edit-text-field.js @@ -7,14 +7,10 @@ import { TextFieldElement } from '@vaadin/vaadin-text-field/src/vaadin-text-field.js'; /** - * The cell editor text-field element. + * An element used internally by ``. Not intended to be used separately. * - * ### Styling - * - * See [`` documentation](https://github.com/vaadin/vaadin-text-field/blob/master/src/vaadin-text-field.html) - * for `` parts. - * - * See [ThemableMixin – how to apply styles for shadow parts](https://github.com/vaadin/vaadin-themable-mixin/wiki) + * @extends TextFieldElement + * @private */ class GridProEditTextFieldElement extends TextFieldElement { static get is() { diff --git a/packages/vaadin-grid-pro/src/vaadin-grid-pro.d.ts b/packages/vaadin-grid-pro/src/vaadin-grid-pro.d.ts index fd43cb3f479..01a7ad60569 100644 --- a/packages/vaadin-grid-pro/src/vaadin-grid-pro.d.ts +++ b/packages/vaadin-grid-pro/src/vaadin-grid-pro.d.ts @@ -39,13 +39,21 @@ export interface GridProEventMap extends HTMLElementEventMap, GridProElementEven * `` is a high quality data grid / data table Web Component with extended functionality. * It extends `` and adds extra features on top of the basic ones. * - * See [`` documentation](https://github.com/vaadin/vaadin-grid/blob/master/src/vaadin-grid.html) - * for details. + * See [``](#/elements/vaadin-grid) documentation for details. * * ``` * * ``` * + * ### Internal components + * + * In addition to `` itself, the following internal + * components are themable: + * + * - `` - has the same API as [``](#/elements/vaadin-checkbox). + * - `` - has the same API as [``](#/elements/vaadin-text-field). + * - `` - has the same API as [``](#/elements/vaadin-select). + * * @fires {CustomEvent} active-item-changed - Fired when the `activeItem` property changes. * @fires {CustomEvent} cell-activate - Fired when the cell is activated with click or keyboard. * @fires {CustomEvent} cell-edit-started - Fired when the user starts editing a grid cell. diff --git a/packages/vaadin-grid-pro/src/vaadin-grid-pro.js b/packages/vaadin-grid-pro/src/vaadin-grid-pro.js index 81df9cb113b..cb0b3b912b0 100644 --- a/packages/vaadin-grid-pro/src/vaadin-grid-pro.js +++ b/packages/vaadin-grid-pro/src/vaadin-grid-pro.js @@ -13,13 +13,21 @@ import '@vaadin/vaadin-license-checker/vaadin-license-checker.js'; * `` is a high quality data grid / data table Web Component with extended functionality. * It extends `` and adds extra features on top of the basic ones. * - * See [`` documentation](https://github.com/vaadin/vaadin-grid/blob/master/src/vaadin-grid.html) - * for details. + * See [``](#/elements/vaadin-grid) documentation for details. * * ``` * * ``` * + * ### Internal components + * + * In addition to `` itself, the following internal + * components are themable: + * + * - `` - has the same API as [``](#/elements/vaadin-checkbox). + * - `` - has the same API as [``](#/elements/vaadin-text-field). + * - `` - has the same API as [``](#/elements/vaadin-select). + * * @fires {CustomEvent} active-item-changed - Fired when the `activeItem` property changes. * @fires {CustomEvent} cell-activate - Fired when the cell is activated with click or keyboard. * @fires {CustomEvent} cell-edit-started - Fired when the user starts editing a grid cell. diff --git a/packages/vaadin-grid/index.html b/packages/vaadin-grid/index.html deleted file mode 100644 index 7eda5196280..00000000000 --- a/packages/vaadin-grid/index.html +++ /dev/null @@ -1,16 +0,0 @@ - - - - - vaadin-grid - - - - - - - - - diff --git a/packages/vaadin-grid/package.json b/packages/vaadin-grid/package.json index 9ef6649948f..4927873f714 100644 --- a/packages/vaadin-grid/package.json +++ b/packages/vaadin-grid/package.json @@ -30,9 +30,6 @@ "src", "theme" ], - "scripts": { - "dist": "rimraf dist && polymer analyze vaadin-* > analysis.json && rollup -c rollup.config.js && cp analysis.json dist" - }, "dependencies": { "@polymer/iron-resizable-behavior": "^3.0.0", "@polymer/iron-scroll-target-behavior": "^3.0.0", @@ -46,14 +43,9 @@ }, "devDependencies": { "@esm-bundle/chai": "^4.1.5", - "@open-wc/rollup-plugin-html": "^1.2.5", "@open-wc/testing-helpers": "^1.8.0", - "@polymer/iron-component-page": "^4.0.0", "@polymer/iron-list": "^3.1.0", "@polymer/iron-test-helpers": "^3.0.0", - "rimraf": "^3.0.2", - "rollup": "^2.34.1", - "rollup-plugin-terser": "^7.0.2", "sinon": "^9.2.0" }, "publishConfig": { diff --git a/packages/vaadin-grid/rollup.config.js b/packages/vaadin-grid/rollup.config.js deleted file mode 100644 index b4695e8ed09..00000000000 --- a/packages/vaadin-grid/rollup.config.js +++ /dev/null @@ -1,12 +0,0 @@ -/* eslint-env node */ -const { nodeResolve } = require('@rollup/plugin-node-resolve'); -const { terser } = require('rollup-plugin-terser'); -const html = require('@open-wc/rollup-plugin-html'); - -module.exports = { - input: './index.html', - output: { - dir: './dist' - }, - plugins: [html(), nodeResolve(), terser()] -}; diff --git a/packages/vaadin-grid/src/vaadin-grid-column.d.ts b/packages/vaadin-grid/src/vaadin-grid-column.d.ts index eb333cb461a..24adea4dd93 100644 --- a/packages/vaadin-grid/src/vaadin-grid-column.d.ts +++ b/packages/vaadin-grid/src/vaadin-grid-column.d.ts @@ -107,9 +107,8 @@ interface ColumnBaseMixin { * A `` is used to configure how a column in `` * should look like. * - * See `` documentation and demos for instructions and examples on how + * See [``](#/elements/vaadin-grid) documentation for instructions on how * to configure the ``. - * ``` */ declare class GridColumnElement extends ColumnBaseMixin(HTMLElement) { /** diff --git a/packages/vaadin-grid/src/vaadin-grid-column.js b/packages/vaadin-grid/src/vaadin-grid-column.js index ea346a91490..7aba3d9ed8f 100644 --- a/packages/vaadin-grid/src/vaadin-grid-column.js +++ b/packages/vaadin-grid/src/vaadin-grid-column.js @@ -623,9 +623,8 @@ export const ColumnBaseMixin = (superClass) => * A `` is used to configure how a column in `` * should look like. * - * See `` documentation and demos for instructions and examples on how + * See [``](#/elements/vaadin-grid) documentation for instructions on how * to configure the ``. - * ``` * * @extends HTMLElement * @mixes ColumnBaseMixin diff --git a/packages/vaadin-grid/src/vaadin-grid-filter.js b/packages/vaadin-grid/src/vaadin-grid-filter.js index c5045fd82d8..b20bb9528d9 100644 --- a/packages/vaadin-grid/src/vaadin-grid-filter.js +++ b/packages/vaadin-grid/src/vaadin-grid-filter.js @@ -23,8 +23,10 @@ import '@vaadin/vaadin-text-field/src/vaadin-text-field.js'; * ``` * * @fires {CustomEvent} value-changed - Fired when the `value` property changes. + * + * @extends HTMLElement */ -class GridFilterElement extends PolymerElement { +class GridFilterElement extends class extends PolymerElement {} { static get template() { return html`