jedison 1.1.0 → 1.3.0

package/dist/esm/jedison.js

@@ -1817,6 +1817,12 @@ class Instance extends EventEmitter {
       value: this.getValue(),
       settings: this.jedison.options.settings
     };
+    if (typeof this.value === "string") {
+      templateData.length = this.value.length;
+      if (typeof this.schema.maxLength === "number") {
+        templateData.remaining = this.schema.maxLength - this.value.length;
+      }
+    }
     if (template == null ? void 0 : template.includes("{{ functions.")) {
       templateData.functions = this.resolveTemplateFunctions(
         this.jedison.options.functions
@@ -3225,6 +3231,17 @@ class EditorStringTextarea extends EditorString {
       titleHidden: getSchemaXOption(this.instance.schema, "titleHidden"),
       info: this.getInfo()
     });
+    const useConstraintAttributes = getSchemaXOption(this.instance.schema, "useConstraintAttributes") ?? this.instance.jedison.options.useConstraintAttributes;
+    if (useConstraintAttributes === true) {
+      const schemaMinLength = getSchemaMinLength(this.instance.schema);
+      const schemaMaxLength = getSchemaMaxLength(this.instance.schema);
+      if (isSet(schemaMinLength)) {
+        this.control.input.setAttribute("minlength", schemaMinLength);
+      }
+      if (isSet(schemaMaxLength)) {
+        this.control.input.setAttribute("maxlength", schemaMaxLength);
+      }
+    }
   }
   adaptForTable() {
     this.theme.adaptForTableTextareaControl(this.control);
@@ -3236,7 +3253,7 @@ class EditorStringTextarea extends EditorString {
     });
   }
   refreshUI() {
-    this.refreshDisabledState();
+    super.refreshUI();
     this.control.input.value = this.instance.getValue();
   }
 }
@@ -3350,6 +3367,21 @@ class EditorStringInput extends EditorString {
     if (optionFormat === "color" && this.instance.value.length === 0) {
       this.instance.setValue("#000000", false, "user");
     }
+    const useConstraintAttributes = getSchemaXOption(this.instance.schema, "useConstraintAttributes") ?? this.instance.jedison.options.useConstraintAttributes;
+    if (useConstraintAttributes === true) {
+      const schemaMinLength = getSchemaMinLength(this.instance.schema);
+      const schemaMaxLength = getSchemaMaxLength(this.instance.schema);
+      const schemaPattern = getSchemaPattern(this.instance.schema);
+      if (isSet(schemaMinLength)) {
+        this.control.input.setAttribute("minlength", schemaMinLength);
+      }
+      if (isSet(schemaMaxLength)) {
+        this.control.input.setAttribute("maxlength", schemaMaxLength);
+      }
+      if (isSet(schemaPattern)) {
+        this.control.input.setAttribute("pattern", schemaPattern);
+      }
+    }
   }
   adaptForTable() {
     this.theme.adaptForTableInputControl(this.control);
@@ -4023,13 +4055,18 @@ class EditorArrayTable extends EditorArray {
     this.control.childrenSlot.innerHTML = "";
     const table = this.theme.getTable();
     this.control.childrenSlot.appendChild(table.container);
+    const arrayDelete = getSchemaXOption(this.instance.schema, "arrayDelete") ?? this.instance.jedison.options.arrayDelete;
+    const arrayMove = getSchemaXOption(this.instance.schema, "arrayMove") ?? this.instance.jedison.options.arrayMove;
+    const arrayButtonsPosition = getSchemaXOption(this.instance.schema, "arrayButtonsPosition") ?? this.instance.jedison.options.arrayButtonsPosition;
     const th = this.theme.getTableHeader();
     const { label } = this.theme.getFakeLabel({
       content: "Controls",
       visuallyHidden: true
     });
     th.appendChild(label);
-    table.thead.appendChild(th);
+    if (arrayButtonsPosition === "left") {
+      table.thead.appendChild(th);
+    }
     if (this.instance.children.length) {
       const schemaItems = getSchemaItems(this.instance.schema);
       const thTitle = this.theme.getTableHeader();
@@ -4050,11 +4087,12 @@ class EditorArrayTable extends EditorArray {
       }
       table.thead.appendChild(thTitle);
     }
-    const arrayDelete = getSchemaXOption(this.instance.schema, "arrayDelete") ?? this.instance.jedison.options.arrayDelete;
-    const arrayMove = getSchemaXOption(this.instance.schema, "arrayMove") ?? this.instance.jedison.options.arrayMove;
+    if (arrayButtonsPosition === "right") {
+      table.thead.appendChild(th);
+    }
     this.instance.children.forEach((child, index2) => {
       const tbodyRow = document.createElement("tr");
-      const buttonsTd = this.theme.getTableDefinition();
+      const buttonsTd = this.theme.getTableDefinition({ isButtonColumn: true });
       const { deleteBtn, moveUpBtn, moveDownBtn, dragBtn, btnGroup } = this.getButtons(index2);
       if (this.isSortable()) {
         btnGroup.appendChild(dragBtn);
@@ -4067,11 +4105,16 @@ class EditorArrayTable extends EditorArray {
         btnGroup.appendChild(moveDownBtn);
       }
       buttonsTd.appendChild(btnGroup);
-      tbodyRow.appendChild(buttonsTd);
+      if (arrayButtonsPosition === "left") {
+        tbodyRow.appendChild(buttonsTd);
+      }
       const td = this.theme.getTableDefinition();
       child.ui.adaptForTable(child, td);
       td.appendChild(child.ui.control.container);
       tbodyRow.appendChild(td);
+      if (arrayButtonsPosition === "right") {
+        tbodyRow.appendChild(buttonsTd);
+      }
       table.tbody.appendChild(tbodyRow);
     });
     this.refreshSortable(table.tbody);
@@ -4135,13 +4178,18 @@ class EditorArrayTableObject extends EditorArray {
     this.control.childrenSlot.innerHTML = "";
     const table = this.theme.getTable();
     this.control.childrenSlot.appendChild(table.container);
+    const arrayDelete = getSchemaXOption(this.instance.schema, "arrayDelete") ?? this.instance.jedison.options.arrayDelete;
+    const arrayMove = getSchemaXOption(this.instance.schema, "arrayMove") ?? this.instance.jedison.options.arrayMove;
+    const arrayButtonsPosition = getSchemaXOption(this.instance.schema, "arrayButtonsPosition") ?? this.instance.jedison.options.arrayButtonsPosition;
     const th = this.theme.getTableHeader();
     const { label } = this.theme.getFakeLabel({
       content: "Controls",
       visuallyHidden: true
     });
     th.appendChild(label);
-    table.thead.appendChild(th);
+    if (arrayButtonsPosition === "left") {
+      table.thead.appendChild(th);
+    }
     if (this.instance.getValue().length === 0) {
       table.table.removeChild(table.thead);
     }
@@ -4169,11 +4217,12 @@ class EditorArrayTableObject extends EditorArray {
       }
       table.thead.appendChild(th2);
     });
-    const arrayDelete = getSchemaXOption(this.instance.schema, "arrayDelete") ?? this.instance.jedison.options.arrayDelete;
-    const arrayMove = getSchemaXOption(this.instance.schema, "arrayMove") ?? this.instance.jedison.options.arrayMove;
+    if (arrayButtonsPosition === "right") {
+      table.thead.appendChild(th);
+    }
     this.instance.children.forEach((child, index2) => {
       const tbodyRow = document.createElement("tr");
-      const buttonsTd = this.theme.getTableDefinition();
+      const buttonsTd = this.theme.getTableDefinition({ isButtonColumn: true });
       const { deleteBtn, moveUpBtn, moveDownBtn, dragBtn, btnGroup } = this.getButtons(index2);
       if (this.isSortable()) {
         btnGroup.appendChild(dragBtn);
@@ -4186,7 +4235,9 @@ class EditorArrayTableObject extends EditorArray {
         btnGroup.appendChild(moveDownBtn);
       }
       buttonsTd.appendChild(btnGroup);
-      tbodyRow.appendChild(buttonsTd);
+      if (arrayButtonsPosition === "left") {
+        tbodyRow.appendChild(buttonsTd);
+      }
       if (child.children.length) {
         child.children.forEach((grandchild) => {
           const td = this.theme.getTableDefinition();
@@ -4200,6 +4251,9 @@ class EditorArrayTableObject extends EditorArray {
         td.appendChild(child.ui.control.container);
         tbodyRow.appendChild(td);
       }
+      if (arrayButtonsPosition === "right") {
+        tbodyRow.appendChild(buttonsTd);
+      }
       table.tbody.appendChild(tbodyRow);
     });
     this.refreshSortable(table.tbody);
@@ -4910,8 +4964,11 @@ class EditorNumberRange extends EditorNumber {
       titleHidden: getSchemaXOption(this.instance.schema, "titleHidden"),
       info: this.getInfo()
     });
-    this.control.input.setAttribute("min", optionMin);
-    this.control.input.setAttribute("max", optionMax);
+    const useConstraintAttributes = getSchemaXOption(this.instance.schema, "useConstraintAttributes") ?? this.instance.jedison.options.useConstraintAttributes;
+    if (useConstraintAttributes === true) {
+      this.control.input.setAttribute("min", optionMin);
+      this.control.input.setAttribute("max", optionMax);
+    }
     this.control.input.setAttribute("step", optionStep);
     const inputAttributes = getSchemaXOption(this.instance.schema, "inputAttributes");
     if (inputAttributes && typeof inputAttributes === "object") {
@@ -5376,6 +5433,7 @@ class Jedison extends EventEmitter {
       arrayDelete: true,
       arrayMove: true,
       arrayAdd: true,
+      arrayButtonsPosition: "left",
       startCollapsed: false,
       deactivateNonRequired: false,
       schema: {},
@@ -7454,8 +7512,11 @@ class Theme {
   /**
    * Returns a <td> element
    */
-  getTableDefinition() {
+  getTableDefinition(config = {}) {
     const td = document.createElement("td");
+    if (config.isButtonColumn) {
+      td.style.width = "1%";
+    }
     td.style.whiteSpace = "nowrap";
     return td;
   }
@@ -7594,6 +7655,7 @@ class ThemeBootstrap3 extends Theme {
   getBtnGroup() {
     const html = super.getBtnGroup();
     html.classList.add("btn-group");
+    html.style.display = "inline-flex";
     return html;
   }
   getButton(config) {