@vaadin/crud 24.4.0-dev.b3e1d14600 → 24.4.0-rc2

package/README.md

@@ -7,7 +7,6 @@ A web component for displaying, editing, creating, and deleting items from a dat
 [Documentation + Live Demo ↗](https://vaadin.com/docs/latest/components/crud)
 
 [![npm version](https://badgen.net/npm/v/@vaadin/crud)](https://www.npmjs.com/package/@vaadin/crud)
-[![Discord](https://img.shields.io/discord/732335336448852018?label=discord)](https://discord.gg/PHmkCKC)
 
 ```html
 <vaadin-crud items='[{"name": "Juan", "surname": "Garcia"}]'></vaadin-crud>

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@vaadin/crud",
-  "version": "24.4.0-dev.b3e1d14600",
+  "version": "24.4.0-rc2",
   "publishConfig": {
     "access": "public"
   },
@@ -37,18 +37,18 @@
   "dependencies": {
     "@open-wc/dedupe-mixin": "^1.3.0",
     "@polymer/polymer": "^3.0.0",
-    "@vaadin/a11y-base": "24.4.0-dev.b3e1d14600",
-    "@vaadin/button": "24.4.0-dev.b3e1d14600",
-    "@vaadin/component-base": "24.4.0-dev.b3e1d14600",
-    "@vaadin/confirm-dialog": "24.4.0-dev.b3e1d14600",
-    "@vaadin/dialog": "24.4.0-dev.b3e1d14600",
-    "@vaadin/form-layout": "24.4.0-dev.b3e1d14600",
-    "@vaadin/grid": "24.4.0-dev.b3e1d14600",
-    "@vaadin/overlay": "24.4.0-dev.b3e1d14600",
-    "@vaadin/text-field": "24.4.0-dev.b3e1d14600",
-    "@vaadin/vaadin-lumo-styles": "24.4.0-dev.b3e1d14600",
-    "@vaadin/vaadin-material-styles": "24.4.0-dev.b3e1d14600",
-    "@vaadin/vaadin-themable-mixin": "24.4.0-dev.b3e1d14600"
+    "@vaadin/a11y-base": "24.4.0-rc2",
+    "@vaadin/button": "24.4.0-rc2",
+    "@vaadin/component-base": "24.4.0-rc2",
+    "@vaadin/confirm-dialog": "24.4.0-rc2",
+    "@vaadin/dialog": "24.4.0-rc2",
+    "@vaadin/form-layout": "24.4.0-rc2",
+    "@vaadin/grid": "24.4.0-rc2",
+    "@vaadin/overlay": "24.4.0-rc2",
+    "@vaadin/text-field": "24.4.0-rc2",
+    "@vaadin/vaadin-lumo-styles": "24.4.0-rc2",
+    "@vaadin/vaadin-material-styles": "24.4.0-rc2",
+    "@vaadin/vaadin-themable-mixin": "24.4.0-rc2"
   },
   "devDependencies": {
     "@esm-bundle/chai": "^4.3.4",
@@ -60,5 +60,5 @@
     "web-types.json",
     "web-types.lit.json"
   ],
-  "gitHead": "502d4f5b03f770a83d270d98078cde230254dd0e"
+  "gitHead": "ea3d99e8cf67a337e959d5cab849f80464c7c7e5"
 }

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

@@ -1,6 +1,6 @@
 /**
  * @license
- * Copyright (c) 2000 - 2023 Vaadin Ltd.
+ * Copyright (c) 2000 - 2024 Vaadin Ltd.
  *
  * This program is available under Vaadin Commercial License and Service Terms.
  *

package/src/vaadin-crud-controllers.js

@@ -1,6 +1,6 @@
 /**
  * @license
- * Copyright (c) 2000 - 2023 Vaadin Ltd.
+ * Copyright (c) 2000 - 2024 Vaadin Ltd.
  *
  * This program is available under Vaadin Commercial License and Service Terms.
  *
@@ -15,8 +15,8 @@ import { SlotController } from '@vaadin/component-base/src/slot-controller.js';
  * @protected
  */
 export class ButtonSlotController extends SlotController {
-  constructor(host, type, theme) {
-    super(host, `${type}-button`, 'vaadin-button');
+  constructor(host, type, theme, noDefaultNode) {
+    super(host, `${type}-button`, noDefaultNode ? null : 'vaadin-button');
 
     this.type = type;
     this.theme = theme;
@@ -31,12 +31,18 @@ export class ButtonSlotController extends SlotController {
    * @override
    */
   initNode(node) {
+    // Prevent errors when the `noDefaultNode` flag is set
+    if (!node) {
+      return;
+    }
+
     // Needed by Flow counterpart to apply i18n to custom button
     if (node._isDefault) {
       this.defaultNode = node;
     }
 
-    if (node === this.defaultNode) {
+    // Respect default theme attribute set by the Flow counterpart
+    if (node === this.defaultNode && !node.hasAttribute('theme')) {
       node.setAttribute('theme', this.theme);
     }
 

package/src/vaadin-crud-dialog.js

@@ -1,6 +1,6 @@
 /**
  * @license
- * Copyright (c) 2000 - 2023 Vaadin Ltd.
+ * Copyright (c) 2000 - 2024 Vaadin Ltd.
  *
  * This program is available under Vaadin Commercial License and Service Terms.
  *
@@ -145,6 +145,7 @@ class CrudDialog extends DialogBaseMixin(OverlayClassMixin(ThemePropertyMixin(Po
         with-backdrop="[[!modeless]]"
         resizable$="[[resizable]]"
         fullscreen$="[[fullscreen]]"
+        role="dialog"
         focus-trap
       ></vaadin-crud-dialog-overlay>
     `;

package/src/vaadin-crud-edit-column.d.ts

@@ -1,6 +1,6 @@
 /**
  * @license
- * Copyright (c) 2000 - 2023 Vaadin Ltd.
+ * Copyright (c) 2000 - 2024 Vaadin Ltd.
  *
  * This program is available under Vaadin Commercial License and Service Terms.
  *

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

@@ -1,6 +1,6 @@
 /**
  * @license
- * Copyright (c) 2000 - 2023 Vaadin Ltd.
+ * Copyright (c) 2000 - 2024 Vaadin Ltd.
  *
  * This program is available under Vaadin Commercial License and Service Terms.
  *

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

@@ -1,6 +1,6 @@
 /**
  * @license
- * Copyright (c) 2000 - 2023 Vaadin Ltd.
+ * Copyright (c) 2000 - 2024 Vaadin Ltd.
  *
  * This program is available under Vaadin Commercial License and Service Terms.
  *

package/src/vaadin-crud-edit.js

@@ -1,6 +1,6 @@
 /**
  * @license
- * Copyright (c) 2000 - 2023 Vaadin Ltd.
+ * Copyright (c) 2000 - 2024 Vaadin Ltd.
  *
  * This program is available under Vaadin Commercial License and Service Terms.
  *

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

@@ -1,6 +1,6 @@
 /**
  * @license
- * Copyright (c) 2000 - 2023 Vaadin Ltd.
+ * Copyright (c) 2000 - 2024 Vaadin Ltd.
  *
  * This program is available under Vaadin Commercial License and Service Terms.
  *

package/src/vaadin-crud-form.js

@@ -1,6 +1,6 @@
 /**
  * @license
- * Copyright (c) 2000 - 2023 Vaadin Ltd.
+ * Copyright (c) 2000 - 2024 Vaadin Ltd.
  *
  * This program is available under Vaadin Commercial License and Service Terms.
  *

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

@@ -1,6 +1,6 @@
 /**
  * @license
- * Copyright (c) 2000 - 2023 Vaadin Ltd.
+ * Copyright (c) 2000 - 2024 Vaadin Ltd.
  *
  * This program is available under Vaadin Commercial License and Service Terms.
  *

package/src/vaadin-crud-grid.js

@@ -1,6 +1,6 @@
 /**
  * @license
- * Copyright (c) 2000 - 2023 Vaadin Ltd.
+ * Copyright (c) 2000 - 2024 Vaadin Ltd.
  *
  * This program is available under Vaadin Commercial License and Service Terms.
  *

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

@@ -1,6 +1,6 @@
 /**
  * @license
- * Copyright (c) 2000 - 2023 Vaadin Ltd.
+ * Copyright (c) 2000 - 2024 Vaadin Ltd.
  *
  * This program is available under Vaadin Commercial License and Service Terms.
  *

package/src/vaadin-crud-helpers.js

@@ -1,6 +1,6 @@
 /**
  * @license
- * Copyright (c) 2000 - 2023 Vaadin Ltd.
+ * Copyright (c) 2000 - 2024 Vaadin Ltd.
  *
  * This program is available under Vaadin Commercial License and Service Terms.
  *

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

@@ -1,6 +1,6 @@
 /**
  * @license
- * Copyright (c) 2000 - 2023 Vaadin Ltd.
+ * Copyright (c) 2000 - 2024 Vaadin Ltd.
  *
  * This program is available under Vaadin Commercial License and Service Terms.
  *

package/src/vaadin-crud-include-mixin.js

@@ -1,6 +1,6 @@
 /**
  * @license
- * Copyright (c) 2000 - 2023 Vaadin Ltd.
+ * Copyright (c) 2000 - 2024 Vaadin Ltd.
  *
  * This program is available under Vaadin Commercial License and Service Terms.
  *

package/src/vaadin-crud.d.ts

@@ -1,6 +1,6 @@
 /**
  * @license
- * Copyright (c) 2000 - 2023 Vaadin Ltd.
+ * Copyright (c) 2000 - 2024 Vaadin Ltd.
  *
  * This program is available under Vaadin Commercial License and Service Terms.
  *

package/src/vaadin-crud.js

@@ -1,6 +1,6 @@
 /**
  * @license
- * Copyright (c) 2000 - 2023 Vaadin Ltd.
+ * Copyright (c) 2000 - 2024 Vaadin Ltd.
  *
  * This program is available under Vaadin Commercial License and Service Terms.
  *
@@ -512,6 +512,9 @@ class Crud extends ControllerMixin(ElementMixin(ThemableMixin(PolymerElement)))
       /**
        * Number of items in the data set which is reported by the grid.
        * Typically it reflects the number of filtered items displayed in the grid.
+       *
+       * Note: As with `<vaadin-grid>`, this property updates automatically only
+       * if `items` is used for data.
        */
       size: {
         type: Number,
@@ -660,11 +663,6 @@ class Crud extends ControllerMixin(ElementMixin(ThemableMixin(PolymerElement)))
     this.__onGridSizeChanged = this.__onGridSizeChanged.bind(this);
     this.__onGridActiveItemChanged = this.__onGridActiveItemChanged.bind(this);
 
-    this._newButtonController = new ButtonSlotController(this, 'new', 'primary');
-    this._saveButtonController = new ButtonSlotController(this, 'save', 'primary');
-    this._cancelButtonController = new ButtonSlotController(this, 'cancel', 'tertiary');
-    this._deleteButtonController = new ButtonSlotController(this, 'delete', 'tertiary error');
-
     this.__focusRestorationController = new FocusRestorationController();
   }
 
@@ -704,6 +702,12 @@ class Crud extends ControllerMixin(ElementMixin(ThemableMixin(PolymerElement)))
 
     this.addController(new FormSlotController(this));
 
+    // Init controllers in `ready()` (not constructor) so that Flow can set `_noDefaultButtons`
+    this._newButtonController = new ButtonSlotController(this, 'new', 'primary', this._noDefaultButtons);
+    this._saveButtonController = new ButtonSlotController(this, 'save', 'primary', this._noDefaultButtons);
+    this._cancelButtonController = new ButtonSlotController(this, 'cancel', 'tertiary', this._noDefaultButtons);
+    this._deleteButtonController = new ButtonSlotController(this, 'delete', 'tertiary error', this._noDefaultButtons);
+
     this.addController(this._newButtonController);
 
     // NOTE: order in which buttons are added should match the order of slots in template

package/theme/lumo/vaadin-crud-styles.d.ts

@@ -0,0 +1,4 @@
+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';

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

@@ -108,6 +108,7 @@ registerStyles(
         inset: 0;
         content: '';
         box-shadow: inset 0 0 0 var(--_focus-ring-width) var(--_focus-ring-color);
+        pointer-events: none;
       }
 
       :host(:not([editor-position=''])) [part='editor']:not([hidden]) {

package/theme/lumo/vaadin-crud.d.ts

@@ -0,0 +1,8 @@
+import '@vaadin/button/theme/lumo/vaadin-button.js';
+import '@vaadin/confirm-dialog/theme/lumo/vaadin-confirm-dialog.js';
+import '@vaadin/form-layout/theme/lumo/vaadin-form-layout.js';
+import '@vaadin/grid/theme/lumo/vaadin-grid.js';
+import '@vaadin/grid/theme/lumo/vaadin-grid-sorter.js';
+import '@vaadin/text-field/theme/lumo/vaadin-text-field.js';
+import './vaadin-crud-styles.js';
+import '../../src/vaadin-crud.js';

package/theme/material/vaadin-crud-styles.d.ts

@@ -0,0 +1,2 @@
+import '@vaadin/vaadin-material-styles/typography.js';
+import '@vaadin/vaadin-material-styles/color.js';

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

@@ -83,6 +83,7 @@ registerStyles(
         inset: 0;
         content: '';
         box-shadow: inset 0 0 0 2px var(--material-primary-color);
+        pointer-events: none;
       }
 
       [part='toolbar'] {

package/theme/material/vaadin-crud.d.ts

@@ -0,0 +1,8 @@
+import '@vaadin/button/theme/material/vaadin-button.js';
+import '@vaadin/confirm-dialog/theme/material/vaadin-confirm-dialog.js';
+import '@vaadin/form-layout/theme/material/vaadin-form-layout.js';
+import '@vaadin/grid/theme/material/vaadin-grid.js';
+import '@vaadin/grid/theme/material/vaadin-grid-sorter.js';
+import '@vaadin/text-field/theme/material/vaadin-text-field.js';
+import './vaadin-crud-styles.js';
+import '../../src/vaadin-crud.js';