web-mojo 2.2.46 → 2.2.48

package/dist/chunks/{FormView-CijEouSb.js → FormView-nAFrSOID.js}

@@ -1,4 +1,4 @@
-import { M as Mustache, a as MOJOUtils, V as View } from "./Rest-CtdC4cD9.js";
+import { M as Mustache, a as MOJOUtils, V as View } from "./Rest-Bq0Qmce8.js";
 import { F as FormPlugins } from "./FormPlugins-DY6e88YT.js";
 class FormBuilder {
   constructor(config = {}) {
@@ -54,11 +54,25 @@ class FormBuilder {
             {{label}}{{#required}}<span class="text-danger">*</span>{{/required}}
           </label>
           {{/label}}
+          {{#showCopy}}
+          <div class="input-group">
+            <input type="{{type}}" id="{{fieldId}}" name="{{name}}"
+                   class="{{inputClass}}{{#error}} is-invalid{{/error}}"
+                   value="{{fieldValue}}" {{#placeholder}}placeholder="{{placeholder}}"{{/placeholder}}
+                   {{#required}}required{{/required}} {{#disabled}}disabled{{/disabled}}
+                   {{#readonly}}readonly{{/readonly}} {{{attrs}}}>
+            <button class="btn btn-outline-secondary" type="button" data-action="copy-to-clipboard" data-target="{{fieldId}}" title="Copy to clipboard">
+              <i class="bi bi-clipboard"></i>
+            </button>
+          </div>
+          {{/showCopy}}
+          {{^showCopy}}
           <input type="{{type}}" id="{{fieldId}}" name="{{name}}"
                  class="{{inputClass}}{{#error}} is-invalid{{/error}}"
                  value="{{fieldValue}}" {{#placeholder}}placeholder="{{placeholder}}"{{/placeholder}}
                  {{#required}}required{{/required}} {{#disabled}}disabled{{/disabled}}
                  {{#readonly}}readonly{{/readonly}} {{{attrs}}}>
+          {{/showCopy}}
           {{#help}}<div class="{{helpClass}}">{{help}}</div>{{/help}}
           {{#error}}<div class="{{errorClass}}">{{error}}</div>{{/error}}
         </div>
@@ -112,10 +126,23 @@ class FormBuilder {
             {{label}}{{#required}}<span class="text-danger">*</span>{{/required}}
           </label>
           {{/label}}
+          {{#showCopy}}
+          <div class="position-relative">
+            <textarea id="{{fieldId}}" name="{{name}}" class="{{inputClass}}{{#error}} is-invalid{{/error}}"
+                      rows="{{rows}}" {{#placeholder}}placeholder="{{placeholder}}"{{/placeholder}}
+                      {{#required}}required{{/required}} {{#disabled}}disabled{{/disabled}}
+                      {{#readonly}}readonly{{/readonly}} {{{attrs}}}>{{fieldValue}}</textarea>
+            <button class="btn btn-sm btn-outline-secondary position-absolute top-0 end-0 m-2" type="button" data-action="copy-to-clipboard" data-target="{{fieldId}}" title="Copy to clipboard">
+              <i class="bi bi-clipboard"></i>
+            </button>
+          </div>
+          {{/showCopy}}
+          {{^showCopy}}
           <textarea id="{{fieldId}}" name="{{name}}" class="{{inputClass}}{{#error}} is-invalid{{/error}}"
                     rows="{{rows}}" {{#placeholder}}placeholder="{{placeholder}}"{{/placeholder}}
                     {{#required}}required{{/required}} {{#disabled}}disabled{{/disabled}}
                     {{#readonly}}readonly{{/readonly}} {{{attrs}}}>{{fieldValue}}</textarea>
+          {{/showCopy}}
           {{#help}}<div class="{{helpClass}}">{{help}}</div>{{/help}}
           {{#error}}<div class="{{errorClass}}">{{error}}</div>{{/error}}
         </div>
@@ -133,14 +160,24 @@ class FormBuilder {
                       {{#required}}required{{/required}} {{#disabled}}disabled{{/disabled}}
                       {{#readonly}}readonly{{/readonly}}
                       data-field-type="htmlpreview" {{{attrs}}}>{{fieldValue}}</textarea>
-            <button type="button" class="btn btn-sm btn-outline-secondary position-absolute"
-                    style="top: 8px; right: 8px; z-index: 10;"
-                    data-action="preview-html"
-                    data-target="{{fieldId}}"
-                    title="Preview HTML"
-                    aria-label="Preview HTML">
-              <i class="bi bi-eye"></i> Preview
-            </button>
+            <div class="position-absolute d-flex gap-1" style="top: 8px; right: 8px; z-index: 10;">
+              {{#showCopy}}
+              <button type="button" class="btn btn-sm btn-outline-secondary"
+                      data-action="copy-to-clipboard"
+                      data-target="{{fieldId}}"
+                      title="Copy to clipboard"
+                      aria-label="Copy to clipboard">
+                <i class="bi bi-clipboard"></i>
+              </button>
+              {{/showCopy}}
+              <button type="button" class="btn btn-sm btn-outline-secondary"
+                      data-action="preview-html"
+                      data-target="{{fieldId}}"
+                      title="Preview HTML"
+                      aria-label="Preview HTML">
+                <i class="bi bi-eye"></i>
+              </button>
+            </div>
           </div>
           {{#help}}<div class="{{helpClass}}">{{help}}</div>{{/help}}
           {{#error}}<div class="{{errorClass}}">{{error}}</div>{{/error}}
@@ -898,7 +935,8 @@ class FormBuilder {
       required,
       disabled,
       readonly,
-      attrs
+      attrs,
+      showCopy: !!field.showCopy
     };
     if (type === "password" && (field.showToggle || field.strengthMeter || field.capsLockWarning)) {
       const enhancedContext = {
@@ -962,6 +1000,7 @@ class FormBuilder {
       required,
       disabled,
       readonly,
+      showCopy: !!field.showCopy,
       attrs
     };
     return Mustache.render(this.templates.textarea, context);
@@ -1007,7 +1046,8 @@ class FormBuilder {
       required,
       disabled,
       readonly,
-      attrs
+      attrs,
+      showCopy: !!field.showCopy
     };
     return Mustache.render(this.templates.htmlpreview, context);
   }
@@ -1167,12 +1207,10 @@ class FormBuilder {
     const error = this.errors[name];
     const fieldValue = field.value ?? this.getFieldValue(name) ?? value;
     return `
-      <div class="mojo-form-control">
-        ${label ? `<label class="${this.options.labelClass}">${this.escapeHtml(label)}${required ? '<span class="text-danger">*</span>' : ""}</label>` : ""}
-        <div class="multiselect-placeholder"
-             data-field-name="${name}"
-             data-field-type="multiselect"
-             data-field-config='${JSON.stringify({
+      <div class="multiselect-placeholder"
+           data-field-name="${name}"
+           data-field-type="multiselect"
+           data-field-config='${JSON.stringify({
       name,
       value: fieldValue,
       placeholder,
@@ -1180,22 +1218,19 @@ class FormBuilder {
       disabled,
       required
     })}'>
-          <input type="hidden" name="${name}" value="${this.escapeHtml(JSON.stringify(fieldValue))}">
-          <select class="form-select${error ? " is-invalid" : ""}" 
-                  multiple 
-                  ${disabled ? "disabled" : ""}
-                  ${required ? "required" : ""}>
-            ${options.map((opt) => {
+        <input type="hidden" name="${name}" value="${this.escapeHtml(JSON.stringify(fieldValue))}">
+        <select class="form-select${error ? " is-invalid" : ""}" 
+                multiple 
+                ${disabled ? "disabled" : ""}
+                ${required ? "required" : ""}>
+          ${options.map((opt) => {
       const optValue = typeof opt === "string" ? opt : opt.value;
       const optLabel = typeof opt === "string" ? opt : opt.label || opt.value;
       const selected = Array.isArray(fieldValue) && fieldValue.includes(optValue) ? "selected" : "";
       return `<option value="${this.escapeHtml(optValue)}" ${selected}>${this.escapeHtml(optLabel)}</option>`;
     }).join("")}
-          </select>
-          <small class="form-text text-muted">This will be enhanced with MultiSelectDropdown component</small>
-        </div>
-        ${help ? `<div class="${this.options.helpClass}">${this.escapeHtml(help)}</div>` : ""}
-        ${error ? `<div class="${this.options.errorClass}">${this.escapeHtml(error)}</div>` : ""}
+        </select>
+        <small class="form-text text-muted">This will be enhanced with MultiSelectDropdown component</small>
       </div>
     `;
   }
@@ -7157,7 +7192,7 @@ class FormView extends View {
     const textarea = this.element.querySelector(`#${targetId}`);
     if (!textarea) return;
     const htmlContent = textarea.value || "";
-    const Dialog = (await import("./Dialog-BEhVfg3C.js")).default;
+    const Dialog = (await import("./Dialog-fb2ecL0p.js")).default;
     Dialog.showHtmlPreview({
       html: htmlContent,
       title: "HTML Preview"
@@ -8243,6 +8278,41 @@ class FormView extends View {
     } catch (_e) {
     }
   }
+  /**
+   * Copy field value to clipboard
+   * @param {Event} event - Click event
+   * @param {HTMLElement} element - Button element with data-target
+   */
+  async onActionCopyToClipboard(event, element) {
+    event.preventDefault();
+    const targetId = element.getAttribute("data-target");
+    if (!targetId) return;
+    const input = this.element.querySelector("#" + targetId);
+    if (!input) return;
+    try {
+      await navigator.clipboard.writeText(input.value);
+      const icon = element.querySelector("i");
+      if (icon) {
+        const originalClass = icon.className;
+        icon.className = "bi bi-check2";
+        element.classList.add("btn-success");
+        element.classList.remove("btn-outline-secondary");
+        setTimeout(() => {
+          icon.className = originalClass;
+          element.classList.remove("btn-success");
+          element.classList.add("btn-outline-secondary");
+        }, 1500);
+      }
+      if (this.app && this.app.toast) {
+        this.app.toast.success("Copied to clipboard!");
+      }
+    } catch (err) {
+      console.error("Failed to copy to clipboard:", err);
+      if (this.app && this.app.toast) {
+        this.app.toast.error("Failed to copy to clipboard");
+      }
+    }
+  }
   /**
    * Compute a simple password strength score and associated UI metadata
    */
@@ -8563,4 +8633,4 @@ export {
   applyFileDropMixin as a,
   FormView$1 as b
 };
-//# sourceMappingURL=FormView-CijEouSb.js.map
+//# sourceMappingURL=FormView-nAFrSOID.js.map