@dile/crud 0.0.30 → 0.0.32

package/components/insert/src/DileCrudInsert.js

@@ -29,7 +29,6 @@ export class DileCrudInsert extends DileI18nMixin(LitElement) {
     constructor() {
         super();
         this.responseAdapter = new ResponseApiAdapter();
-        this.actionLabel = 'Insert';
         this.formIdentifier = 'insertform';
     }
 
@@ -47,7 +46,7 @@ export class DileCrudInsert extends DileI18nMixin(LitElement) {
             <dile-ajax-form
                 operation="insert"
                 endpoint="${this.endpoint}"
-                actionLabel="${this.actionLabel}"
+                actionLabel="${this.actionLabelComputed(this.actionLabel, this.translations)}"
                 @save-success="${this.doSuccessSave}"
                 ?buttonSmall="${this.buttonSmall}"
                 .responseAdapter="${this.responseAdapter}"
@@ -77,4 +76,8 @@ export class DileCrudInsert extends DileI18nMixin(LitElement) {
     clearFeedback() {
         this.formElement.clearFeedback();
     }
+
+    actionLabelComputed(label, translations) {
+        return label ? label : translations?.insert_label ? translations.insert_label : 'Insert';
+    }
 }

package/components/item-delete/src/DileCrudItemDelete.js

@@ -1,8 +1,10 @@
 import { LitElement, html, css } from 'lit';
 import '@dile/ui/components/confirm/confirm';
 import { ResponseApiAdapter } from '../../../lib/ResponseApiAdapter.js';
+import { DileI18nMixin } from '../../../lib/DileI18nMixin.js';
+import '../../ajax/ajax.js';
 
-export class DileCrudItemDelete extends LitElement {
+export class DileCrudItemDelete extends DileI18nMixin(LitElement) {
   static styles = [
     css`
       :host {
@@ -40,9 +42,6 @@ export class DileCrudItemDelete extends LitElement {
   constructor() {
     super();
     this.responseAdapter = new ResponseApiAdapter();
-    this.confirmMessage = 'Are you sure you want to delete this item?';
-    this.cancelLabel = 'Cancel';
-    this.acceptLabel = 'Delete'
   }
 
   firstUpdated() {
@@ -60,19 +59,23 @@ export class DileCrudItemDelete extends LitElement {
           @ajax-error="${this.doErrorDelete}"
       ></dile-ajax>
       <dile-confirm 
-          cancelLabel="${this.cancelLabel}"
-          acceptLabel="${this.acceptLabel}"
+          cancelLabel="${this.cancelLabelComputed(this.cancelLabel, this.translations)}"
+          acceptLabel="${this.acceptLabelComputed(this.acceptLabel, this.translations)}"
           id="elconfirm"
           @dile-confirm-accepted=${this.deleteAccepted}
       >
-          <p>${this.confirmMessage}</p>
+          <p>${this.confirmMessageComputed(this.confirmMessage, this.translations)}</p>
       </dile-confirm>
   `;
   }
 
   delete(itemId) {
-    this.relatedId = itemId;
-    this.elconfirm.open();
+    if(itemId != "" && itemId != undefined) {
+      this.relatedId = itemId;
+      this.elconfirm.open();
+    } else {
+      throw new Error('Please provide the element id to delete');
+    }
   }
 
   deleteAccepted() {
@@ -103,4 +106,16 @@ export class DileCrudItemDelete extends LitElement {
     }  
     return msg;
   }
+
+  cancelLabelComputed(label, translations) {
+    return label ? label : translations?.cancel_label ? translations.cancel_label : 'Cancel';
+  }
+
+  acceptLabelComputed(label, translations) {
+    return label ? label : translations?.delete_label ? translations.delete_label : 'Delete';
+  }
+
+  confirmMessageComputed(message, translations) {
+    return message ? message : translations?.delete_confirm_message ? translations.delete_confirm_message : 'Are you sure?';
+  }
 }

package/components/update/src/DileCrudUpdate.js

@@ -29,7 +29,6 @@ export class DileCrudUpdate extends DileI18nMixin(LitElement) {
     constructor() {
         super();
         this.responseAdapter = new ResponseApiAdapter();
-        this.actionLabel = 'Update';
         this.loadOnInit = false;
         this.formIdentifier = 'updateform';
     }
@@ -48,7 +47,7 @@ export class DileCrudUpdate extends DileI18nMixin(LitElement) {
                 id="elform"
                 operation="update"
                 endpoint="${this.endpoint}"
-                actionLabel="${this.actionLabel}"
+                actionLabel="${this.actionLabelComputed(this.actionLabel, this.translations)}"
                 @save-success="${this.doSuccessSave}"
                 ?buttonSmall="${this.buttonSmall}"
                 relatedId="${this.relatedId}"
@@ -80,4 +79,8 @@ export class DileCrudUpdate extends DileI18nMixin(LitElement) {
     clearFeedback() {
         this.formElement.clearFeedback();
     }
+
+    actionLabelComputed(label, translations) {
+        return label ? label : translations?.update_label ? translations.update_label : 'Update';
+    }
 }

package/lib/i18n/en.js

@@ -11,4 +11,9 @@ export const translations = {
   ajax_form_not_supported: "Operation not supported in dile-ajax-form use 'insert' or 'update'",
   success_operation: (operation) => operation == 'insert' ? 'The new item has been created' : 'Item updated successfully',
   error_operation: (operation) => `${operation == 'insert' ? 'Insertion' : 'Update'} error`,
+  insert_label: "Insert",
+  update_label: "Update",
+  delete_label: "Delete",
+  cancel_label: "Cancel",
+  delete_confirm_message: "Are you sure you want to delete this item?",
 };

package/lib/i18n/es.js

@@ -11,4 +11,9 @@ export const translations = {
   ajax_form_not_supported: "Operación no soportada por dile-ajax-form. Elige entre 'insert' o 'update'",
   success_operation: (operation) => `${operation == 'insert' ? 'Inserción' : 'Actualización'} completada con éxito`,
   error_operation: (operation) => `Se ha producido un error en la ${operation == 'insert' ? 'inserción' : 'actualización'}`,
+  insert_label: "Insertar",
+  update_label: "Actualizar",
+  delete_label: "Borrar",
+  cancel_label: "Cancelar",
+  delete_confirm_message: "¿Estás seguro que quieres borrar este ítem?",
 };

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@dile/crud",
-  "version": "0.0.30",
+  "version": "0.0.32",
   "description": "Components to create a generic crud system based on Web Components and Lit",
   "main": "index.js",
   "scripts": {
@@ -31,5 +31,5 @@
   "publishConfig": {
     "access": "public"
   },
-  "gitHead": "96692014323213826518042dd3b3a4e135f030cd"
+  "gitHead": "817f5102c42848615896580e968fc42d8ee21d66"
 }