voc-lib-js 1.0.4 → 1.0.5

package/dist/main.global.js

@@ -0,0 +1,202 @@
+"use strict";
+var FormsLib = (() => {
+  var __defProp = Object.defineProperty;
+  var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
+  var __getOwnPropNames = Object.getOwnPropertyNames;
+  var __hasOwnProp = Object.prototype.hasOwnProperty;
+  var __export = (target, all) => {
+    for (var name in all)
+      __defProp(target, name, { get: all[name], enumerable: true });
+  };
+  var __copyProps = (to, from, except, desc) => {
+    if (from && typeof from === "object" || typeof from === "function") {
+      for (let key of __getOwnPropNames(from))
+        if (!__hasOwnProp.call(to, key) && key !== except)
+          __defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });
+    }
+    return to;
+  };
+  var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
+
+  // src/main.ts
+  var main_exports = {};
+  __export(main_exports, {
+    FormsLib: () => FormsLib
+  });
+
+  // src/forms-lib/form-submit.ts
+  function submitForm(form) {
+    console.log("Form submitted:", form);
+  }
+
+  // src/forms-lib/form-render.ts
+  function renderForm(element, data) {
+    let containers = [];
+    if (typeof element === "string") {
+      containers = Array.from(document.querySelectorAll(element));
+    } else {
+      containers = [element];
+    }
+    if (containers.length === 0) return null;
+    function buildForm() {
+      const form = document.createElement("form");
+      form.id = data.id;
+      const title = document.createElement("h2");
+      title.textContent = data.form_name;
+      form.appendChild(title);
+      function applyValidation(el, validation) {
+        if (!validation) return;
+        if (validation.min_length !== void 0) {
+          el.minLength = validation.min_length;
+        }
+        if (validation.max_length !== void 0) {
+          el.maxLength = validation.max_length;
+        }
+        if (validation.regex) {
+          if (el instanceof HTMLInputElement) {
+            el.pattern = validation.regex;
+          } else {
+            el.dataset.pattern = validation.regex;
+          }
+        }
+      }
+      function renderField(field) {
+        if (!field.key && !field.label) return null;
+        const wrapper = document.createElement("div");
+        wrapper.className = "form-group";
+        if (field.label) {
+          const label = document.createElement("label");
+          label.htmlFor = field.key || "";
+          label.textContent = field.label + (field.required ? " *" : "");
+          wrapper.appendChild(label);
+        }
+        let input = null;
+        switch (field.type) {
+          case "textarea": {
+            const textarea = document.createElement("textarea");
+            if (field.key) textarea.name = field.key;
+            if (field.required) textarea.required = true;
+            applyValidation(textarea, field.validation);
+            input = textarea;
+            break;
+          }
+          case "select": {
+            const select = document.createElement("select");
+            if (field.key) select.name = field.key;
+            if (field.required) select.required = true;
+            if (field.options) {
+              field.options.forEach((opt) => {
+                const option = document.createElement("option");
+                option.value = opt.value;
+                option.textContent = opt.label;
+                if (field.default === opt.value) option.selected = true;
+                select.appendChild(option);
+              });
+            }
+            input = select;
+            break;
+          }
+          case "radio": {
+            const radioGroup = document.createElement("div");
+            radioGroup.className = "radio-group " + (field.direction || "vertical");
+            if (field.options) {
+              field.options.forEach((opt) => {
+                const radioWrapper = document.createElement("label");
+                radioWrapper.style.display = field.direction === "horizontal" ? "inline-block" : "block";
+                const radio = document.createElement("input");
+                radio.type = "radio";
+                radio.name = field.key || "";
+                radio.value = opt.value;
+                radioWrapper.appendChild(radio);
+                radioWrapper.appendChild(
+                  document.createTextNode(opt.label)
+                );
+                radioGroup.appendChild(radioWrapper);
+              });
+            }
+            input = radioGroup;
+            break;
+          }
+          default: {
+            const inp = document.createElement("input");
+            inp.type = field.type || "text";
+            if (field.key) inp.name = field.key;
+            if (field.required) inp.required = true;
+            applyValidation(inp, field.validation);
+            input = inp;
+            break;
+          }
+        }
+        if (input) wrapper.appendChild(input);
+        if (field.hint_text) {
+          const hint = document.createElement("small");
+          hint.className = "hint";
+          hint.textContent = field.hint_text;
+          wrapper.appendChild(hint);
+        }
+        return wrapper;
+      }
+      data.fields.forEach((field) => {
+        if (field.type === "row") {
+          const rowWrapper = document.createElement("div");
+          rowWrapper.className = "form-row";
+          if (field.label) {
+            const rowLabel = document.createElement("h3");
+            rowLabel.textContent = field.label;
+            rowWrapper.appendChild(rowLabel);
+          }
+          field.items.forEach((item) => {
+            const rendered = renderField(item);
+            if (rendered) rowWrapper.appendChild(rendered);
+          });
+          form.appendChild(rowWrapper);
+        } else {
+          const rendered = renderField(field);
+          if (rendered) form.appendChild(rendered);
+        }
+      });
+      const submitBtn = document.createElement("button");
+      submitBtn.type = "submit";
+      submitBtn.textContent = "Submit";
+      form.appendChild(submitBtn);
+      return form;
+    }
+    const formElement = buildForm();
+    containers[0].appendChild(formElement);
+    return {
+      element: formElement,
+      // this method validates the form and returns an array of errors
+      validate: () => {
+        const errors = [];
+        const invalidElements = formElement.querySelectorAll(":invalid");
+        invalidElements.forEach((element2) => {
+          const message = element2.validationMessage;
+          errors.push({ element: element2, message });
+        });
+        return errors;
+      },
+      // this method submits the form to the portal vocphone server
+      submitForm: () => {
+        submitForm(formElement);
+      },
+      // This method gets the data from the form.
+      getValues: () => {
+        const formData = new FormData(formElement);
+        const values = {};
+        formData.forEach((value, key) => {
+          values[key] = value;
+        });
+        return values;
+      }
+    };
+  }
+
+  // src/forms-lib/index.ts
+  var forms_lib_default = {
+    renderForm
+  };
+
+  // src/main.ts
+  var FormsLib = forms_lib_default;
+  return __toCommonJS(main_exports);
+})();

package/package.json

@@ -1,13 +1,15 @@
 {
   "name": "voc-lib-js",
-  "version": "1.0.4",
+  "version": "1.0.5",
   "description": "A JavaScript library for VocPhone",
   "main": "./dist/main.cjs",
   "module": "./dist/main.mjs",
+  "unpkg": "./dist/main.iife.js",
+  "jsdelivr": "./dist/main.iife.js",
   "types": "./dist/main.d.ts",
   "scripts": {
-    "build": "tsup src/main.ts --format cjs,esm --dts",
-    "up": "rimraf dist && npm run build && npm publish"
+    "build": "tsup src/main.ts --format cjs,esm,iife --global-name FormsLib --dts",
+    "up": "npm version patch && rimraf dist && npm run build && npm publish"
   },
   "repository": {
     "type": "git",