@vaadin/crud 22.0.0-beta1 → 22.0.1

package/README.md

@@ -1,56 +1,56 @@
-# <vaadin-crud>
+# @vaadin/crud
 
-[Live Demo ↗](https://vaadin.com/components/vaadin-crud/html-examples)
-|
-[API documentation ↗](https://vaadin.com/components/vaadin-crud/html-api)
+A web component for displaying, editing, creating, and deleting items from a dataset.
 
-[<vaadin-crud>](https://vaadin.com/components/vaadin-crud) is a Web Component for
-[CRUD](https://en.wikipedia.org/wiki/Create,_read,_update_and_delete) operations.
-It is part of the [Vaadin components](https://vaadin.com/components).
+> ℹ️  A commercial Vaadin [subscription](https://vaadin.com/pricing) is required to use CRUD in your project.
+
+[Documentation + Live Demo ↗](https://vaadin.com/docs/latest/ds/components/crud)
 
 [![npm version](https://badgen.net/npm/v/@vaadin/crud)](https://www.npmjs.com/package/@vaadin/crud)
-[![Published on Vaadin Directory](https://img.shields.io/badge/Vaadin%20Directory-published-00b4f0.svg)](https://vaadin.com/directory/component/vaadinvaadin-crud)
 [![Discord](https://img.shields.io/discord/732335336448852018?label=discord)](https://discord.gg/PHmkCKC)
 
 ```html
 <vaadin-crud items='[{"name": "Juan", "surname": "Garcia"}]'></vaadin-crud>
 ```
 
-[<img src="https://raw.githubusercontent.com/vaadin/vaadin-crud/master/screenshot.gif" width="700" alt="Screenshot of vaadin-crud">](https://vaadin.com/components/vaadin-crud)
+[<img src="https://raw.githubusercontent.com/vaadin/web-components/master/packages/crud/screenshot.gif" width="702" alt="Screenshot of vaadin-crud">](https://vaadin.com/docs/latest/ds/components/crud)
 
 ## Installation
 
-Install `vaadin-crud`:
+Install the component:
 
 ```sh
-npm i @vaadin/crud --save
+npm i @vaadin/crud
 ```
 
-Once installed, import it in your application:
+Once installed, import the component in your application:
 
 ```js
-import '@vaadin/crud/vaadin-crud.js';
+import '@vaadin/crud';
 ```
 
-## Getting started
-
-Vaadin components use the Lumo theme by default.
-
-To use the Material theme, import the correspondent file from the `theme/material` folder.
+## Themes
 
-## Entry points
+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/crud/vaadin-crud.js) of the package uses the Lumo theme.
 
-- The component with the Lumo theme:
+To use the Material theme, import the component from the `theme/material` folder:
 
-  `theme/lumo/vaadin-crud.js`
+```js
+import '@vaadin/crud/theme/material/vaadin-crud.js';
+```
 
-- The component with the Material theme:
+You can also import the Lumo version of the component explicitly:
 
-  `theme/material/vaadin-crud.js`
+```js
+import '@vaadin/crud/theme/lumo/vaadin-crud.js';
+```
 
-- Alias for `theme/lumo/vaadin-crud.js`:
+Finally, you can import the un-themed component from the `src` folder to get a minimal starting point:
 
-  `vaadin-crud.js`
+```js
+import '@vaadin/crud/src/vaadin-crud.js';
+```
 
 ## Contributing
 
@@ -60,4 +60,5 @@ Read the [contributing guide](https://vaadin.com/docs/latest/guide/contributing/
 
 Commercial Vaadin Developer License 4.0 (CVDLv4). For license terms, see LICENSE.
 
-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 crud and to opt-out, see https://github.com/vaadin/vaadin-usage-statistics.

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@vaadin/crud",
-  "version": "22.0.0-beta1",
+  "version": "22.0.1",
   "publishConfig": {
     "access": "public"
   },
@@ -32,25 +32,26 @@
     "polymer"
   ],
   "dependencies": {
+    "@open-wc/dedupe-mixin": "^1.3.0",
     "@polymer/iron-media-query": "^3.0.0",
     "@polymer/polymer": "^3.0.0",
-    "@vaadin/button": "22.0.0-beta1",
-    "@vaadin/component-base": "22.0.0-beta1",
-    "@vaadin/confirm-dialog": "22.0.0-beta1",
-    "@vaadin/dialog": "22.0.0-beta1",
-    "@vaadin/form-layout": "22.0.0-beta1",
-    "@vaadin/grid": "22.0.0-beta1",
-    "@vaadin/text-field": "22.0.0-beta1",
+    "@vaadin/button": "^22.0.1",
+    "@vaadin/component-base": "^22.0.1",
+    "@vaadin/confirm-dialog": "^22.0.1",
+    "@vaadin/dialog": "^22.0.1",
+    "@vaadin/form-layout": "^22.0.1",
+    "@vaadin/grid": "^22.0.1",
+    "@vaadin/text-field": "^22.0.1",
     "@vaadin/vaadin-license-checker": "^2.1.0",
-    "@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/vaadin-lumo-styles": "^22.0.1",
+    "@vaadin/vaadin-material-styles": "^22.0.1",
+    "@vaadin/vaadin-themable-mixin": "^22.0.1"
   },
   "devDependencies": {
     "@esm-bundle/chai": "^4.3.4",
-    "@vaadin/polymer-legacy-adapter": "22.0.0-beta1",
-    "@vaadin/testing-helpers": "^0.3.0",
+    "@vaadin/polymer-legacy-adapter": "^22.0.1",
+    "@vaadin/testing-helpers": "^0.3.2",
     "sinon": "^9.2.1"
   },
-  "gitHead": "4cf8a9d0504994200c610e44b3676114fef49c1e"
+  "gitHead": "2b0a2bff0369d6020f7cc33ad35506aa2d1f6f68"
 }

package/src/vaadin-crud-edit-column.js

@@ -3,8 +3,8 @@
  * Copyright (c) 2017 - 2021 Vaadin Ltd.
  * This program is available under Commercial Vaadin Developer License 4.0, available at https://vaadin.com/license/cvdl-4.0.
  */
-import { GridColumn } from '@vaadin/grid/src/vaadin-grid-column.js';
 import './vaadin-crud-edit.js';
+import { GridColumn } from '@vaadin/grid/src/vaadin-grid-column.js';
 
 /**
  * `<vaadin-crud-edit-column>` is a helper element for the `<vaadin-grid>`

package/src/vaadin-crud-edit.js

@@ -3,7 +3,7 @@
  * Copyright (c) 2017 - 2021 Vaadin Ltd.
  * This program is available under Commercial Vaadin Developer License 4.0, available at https://vaadin.com/license/cvdl-4.0.
  */
-import { PolymerElement, html } from '@polymer/polymer/polymer-element.js';
+import { html, PolymerElement } from '@polymer/polymer/polymer-element.js';
 import { ThemableMixin } from '@vaadin/vaadin-themable-mixin/vaadin-themable-mixin.js';
 
 /**

package/src/vaadin-crud-form.d.ts

@@ -14,13 +14,6 @@ declare class CrudForm<Item> extends IncludedMixin(FormLayout) {
    * The item being edited.
    */
   item: Item | null | undefined;
-
-  /**
-   * Auto-generate form fields based on the JSON structure of the object provided.
-   *
-   * If not called, the method will be executed the first time an item is assigned.
-   */
-  _configure(object: Item): void;
 }
 
 declare global {

package/src/vaadin-crud-form.js

@@ -3,8 +3,8 @@
  * Copyright (c) 2017 - 2021 Vaadin Ltd.
  * This program is available under Commercial Vaadin Developer License 4.0, available at https://vaadin.com/license/cvdl-4.0.
  */
-import { FormLayout } from '@vaadin/form-layout/src/vaadin-form-layout.js';
 import '@vaadin/text-field/src/vaadin-text-field.js';
+import { FormLayout } from '@vaadin/form-layout/src/vaadin-form-layout.js';
 import { IncludedMixin } from './vaadin-crud-include-mixin.js';
 
 /**

package/src/vaadin-crud-grid.js

@@ -3,13 +3,13 @@
  * Copyright (c) 2017 - 2021 Vaadin Ltd.
  * This program is available under Commercial Vaadin Developer License 4.0, available at https://vaadin.com/license/cvdl-4.0.
  */
-import { Grid } from '@vaadin/grid/src/vaadin-grid.js';
 import '@vaadin/grid/src/vaadin-grid-column.js';
 import '@vaadin/grid/src/vaadin-grid-column-group.js';
 import '@vaadin/grid/src/vaadin-grid-sorter.js';
 import '@vaadin/grid/src/vaadin-grid-filter.js';
-import { IncludedMixin } from './vaadin-crud-include-mixin.js';
 import './vaadin-crud-edit-column.js';
+import { Grid } from '@vaadin/grid/src/vaadin-grid.js';
+import { IncludedMixin } from './vaadin-crud-include-mixin.js';
 
 /**
  * An element used internally by `<vaadin-crud>`. Not intended to be used separately.

package/src/vaadin-crud-include-mixin.d.ts

@@ -3,14 +3,11 @@
  * Copyright (c) 2021 Vaadin Ltd.
  * This program is available under Apache License Version 2.0, available at https://vaadin.com/license/
  */
+import { Constructor } from '@open-wc/dedupe-mixin';
 
-declare function IncludedMixin<T extends new (...args: any[]) => {}>(base: T): T & IncludedMixinConstructor;
+export declare function IncludedMixin<T extends Constructor<HTMLElement>>(base: T): T & Constructor<IncludedMixinClass>;
 
-interface IncludedMixinConstructor {
-  new (...args: any[]): IncludedMixin;
-}
-
-interface IncludedMixin {
+export declare class IncludedMixinClass {
   /**
    * A list of item fields that should not be mapped to form fields.
    *
@@ -27,5 +24,3 @@ interface IncludedMixin {
    */
   include: string | string[] | undefined;
 }
-
-export { IncludedMixin, IncludedMixinConstructor };

package/src/vaadin-crud.d.ts

@@ -4,8 +4,8 @@
  * This program is available under Apache License Version 2.0, available at https://vaadin.com/license/
  */
 import { ElementMixin } from '@vaadin/component-base/src/element-mixin.js';
-import { ThemableMixin } from '@vaadin/vaadin-themable-mixin/vaadin-themable-mixin.js';
 import { GridFilterDefinition, GridSorterDefinition } from '@vaadin/grid/src/vaadin-grid.js';
+import { ThemableMixin } from '@vaadin/vaadin-themable-mixin/vaadin-themable-mixin.js';
 
 export type CrudDataProviderCallback<T> = (items: Array<T>, size?: number) => void;
 

package/src/vaadin-crud.js

@@ -3,12 +3,7 @@
  * Copyright (c) 2017 - 2021 Vaadin Ltd.
  * This program is available under Commercial Vaadin Developer License 4.0, available at https://vaadin.com/license/cvdl-4.0.
  */
-import { PolymerElement, html } from '@polymer/polymer/polymer-element.js';
-import { FlattenedNodesObserver } from '@polymer/polymer/lib/utils/flattened-nodes-observer.js';
-import { afterNextRender } from '@polymer/polymer/lib/utils/render-status.js';
 import '@polymer/iron-media-query/iron-media-query.js';
-import { ElementMixin } from '@vaadin/component-base/src/element-mixin.js';
-import { ThemableMixin } from '@vaadin/vaadin-themable-mixin/vaadin-themable-mixin.js';
 import '@vaadin/button/src/vaadin-button.js';
 import '@vaadin/dialog/src/vaadin-dialog.js';
 import '@vaadin/confirm-dialog/src/vaadin-confirm-dialog.js';
@@ -16,6 +11,11 @@ import '@vaadin/vaadin-license-checker/vaadin-license-checker.js';
 import './vaadin-dialog-layout.js';
 import './vaadin-crud-grid.js';
 import './vaadin-crud-form.js';
+import { FlattenedNodesObserver } from '@polymer/polymer/lib/utils/flattened-nodes-observer.js';
+import { afterNextRender } from '@polymer/polymer/lib/utils/render-status.js';
+import { html, PolymerElement } from '@polymer/polymer/polymer-element.js';
+import { ElementMixin } from '@vaadin/component-base/src/element-mixin.js';
+import { ThemableMixin } from '@vaadin/vaadin-themable-mixin/vaadin-themable-mixin.js';
 
 const HOST_PROPS = {
   save: [{ attr: 'disabled', prop: '__isDirty', parseProp: '__isSaveBtnDisabled' }, { prop: 'i18n.saveItem' }],

package/src/vaadin-dialog-layout.js

@@ -3,10 +3,10 @@
  * Copyright (c) 2017 - 2021 Vaadin Ltd.
  * This program is available under Commercial Vaadin Developer License 4.0, available at https://vaadin.com/license/cvdl-4.0.
  */
-import { PolymerElement, html } from '@polymer/polymer/polymer-element.js';
+import '@vaadin/dialog/src/vaadin-dialog.js';
+import { html, PolymerElement } from '@polymer/polymer/polymer-element.js';
 import { ElementMixin } from '@vaadin/component-base/src/element-mixin.js';
 import { ThemableMixin } from '@vaadin/vaadin-themable-mixin/vaadin-themable-mixin.js';
-import '@vaadin/dialog/src/vaadin-dialog.js';
 
 /**
  * An element used internally by `<vaadin-crud>`. Not intended to be used separately.

package/theme/lumo/vaadin-crud-styles.js

@@ -1,9 +1,9 @@
-import { registerStyles, css } from '@vaadin/vaadin-themable-mixin/register-styles.js';
 import '@vaadin/vaadin-lumo-styles/typography.js';
 import '@vaadin/vaadin-lumo-styles/color.js';
 import '@vaadin/vaadin-lumo-styles/font-icons.js';
 import '@vaadin/vaadin-lumo-styles/style.js';
 import '../vaadin-dialog-layout-overlay-styles.js';
+import { css, registerStyles } from '@vaadin/vaadin-themable-mixin/vaadin-themable-mixin.js';
 
 registerStyles(
   'vaadin-crud-edit',

package/theme/material/vaadin-crud-styles.js

@@ -1,7 +1,7 @@
-import { registerStyles, css } from '@vaadin/vaadin-themable-mixin/register-styles.js';
 import '@vaadin/vaadin-material-styles/typography.js';
 import '@vaadin/vaadin-material-styles/color.js';
 import '../vaadin-dialog-layout-overlay-styles.js';
+import { css, registerStyles } from '@vaadin/vaadin-themable-mixin/vaadin-themable-mixin.js';
 
 registerStyles(
   'vaadin-crud-edit',

package/theme/vaadin-dialog-layout-overlay-styles.js

@@ -1,4 +1,4 @@
-import { registerStyles, css } from '@vaadin/vaadin-themable-mixin/register-styles.js';
+import { css, registerStyles } from '@vaadin/vaadin-themable-mixin/vaadin-themable-mixin.js';
 
 /*
   DISCLAIMER: These are the styles of an internal implementation of a web