@startinblox/core 0.19.17 → 0.19.19

package/dist/index.js

@@ -12857,17 +12857,22 @@ const SorterMixin = {
   },
   sortValuesByKey(key, asc) {
     return function(a, b) {
-      if (!a[key])
+      if (!a.hasOwnProperty(key))
         return 1;
-      if (!b[key])
+      if (!b.hasOwnProperty(key))
         return -1;
-      const varA = typeof a[key] === "string" ? a[key].toUpperCase() : a[key];
-      const varB = typeof b[key] === "string" ? b[key].toUpperCase() : b[key];
+      const varA = a[key];
+      const varB = b[key];
       let comparison = 0;
-      if (varA > varB)
-        comparison = asc ? 1 : -1;
-      else if (varA < varB)
-        comparison = asc ? -1 : 1;
+      if (typeof varA === "string" && typeof varB === "string") {
+        comparison = varA.localeCompare(varB, void 0, { sensitivity: "base" });
+        comparison = asc ? comparison : -comparison;
+      } else {
+        if (varA > varB)
+          comparison = asc ? 1 : -1;
+        else if (varA < varB)
+          comparison = asc ? -1 : 1;
+      }
       return comparison;
     };
   },
@@ -50934,9 +50939,69 @@ const RichtextMixin = {
     }
     const ops = deltaMd.toDelta(this.value);
     this.quill.setContents(ops);
+    if (this.isRequired()) {
+      this.createHiddenRequiredInput();
+      this.quill.on("text-change", this.onTextChange.bind(this));
+    }
     const nextProcessor = listCallbacks.shift();
     if (nextProcessor)
       nextProcessor(value, listCallbacks);
+  },
+  isRequired() {
+    return Array.from(this.element.attributes).some((attr) => attr.name === "required");
+  },
+  createHiddenRequiredInput() {
+    const attributeName = this.getAttributeValue("name");
+    this.hiddenInput = document.querySelector(`input[name="${attributeName + "-hidden"}"]`);
+    if (!this.hiddenInput) {
+      this.hiddenInput = this.createHiddenInput(attributeName + "-hidden");
+      this.element.appendChild(this.hiddenInput);
+      this.addInvalidEventListener();
+    }
+    this.hiddenInput.value = this.quill.getText();
+  },
+  createHiddenInput(attributeName) {
+    const input = document.createElement("input");
+    input.name = attributeName;
+    input.setAttribute("required", "true");
+    input.style.opacity = "0";
+    input.style.position = "absolute";
+    input.style.pointerEvents = "none";
+    return input;
+  },
+  getAttributeValue(attributeName) {
+    const attribute2 = Array.from(this.element.attributes).find((attr) => attr.name === attributeName);
+    return attribute2 ? attribute2.value : "";
+  },
+  displayCustomErrorMessage(message) {
+    const richtext = this.element.querySelector("[data-richtext]");
+    if (richtext) {
+      let errorMessageElement = richtext.querySelector(".required-error-message");
+      if (!errorMessageElement) {
+        errorMessageElement = document.createElement("div");
+        errorMessageElement.className = "required-error-message";
+      }
+      richtext.appendChild(errorMessageElement);
+      errorMessageElement.textContent = message;
+      richtext.classList.add("error-border-richtext");
+    }
+  },
+  addInvalidEventListener() {
+    this.hiddenInput.addEventListener("invalid", (e) => {
+      e.preventDefault();
+      this.displayCustomErrorMessage("Please fill out this field.");
+    });
+  },
+  onTextChange() {
+    this.hiddenInput.value = this.quill.getText();
+    this.removeErrorMessageAndStyling();
+  },
+  removeErrorMessageAndStyling() {
+    const richtext = this.element.querySelector("[data-richtext]");
+    let errorMessageElement = richtext.querySelector(".required-error-message");
+    if (errorMessageElement)
+      errorMessageElement.remove();
+    richtext.classList.remove("error-border-richtext");
   }
 };
 const callbackDirectory = {

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@startinblox/core",
-  "version": "0.19.17",
+  "version": "0.19.19",
   "description": "This is a series of web component respecting both the web components standards and the Linked Data Platform convention.",
   "main": "./dist/index.js",
   "module": "./dist/index.js",