web-mojo 2.1.697 → 2.1.699

package/dist/chunks/{FormView-CeoubZ-s.js → FormView-Dh8Yqk2d.js}

@@ -1,4 +1,4 @@
-import { M as Mustache, h as MOJOUtils, V as View } from "./WebApp-BsUzNFg3.js";
+import { M as Mustache, h as MOJOUtils, V as View } from "./WebApp-CCK9ce5Y.js";
 class FormBuilder {
   constructor(config = {}) {
     this.fields = config.fields || [];
@@ -974,7 +974,14 @@ class FormBuilder {
       searchable = false,
       class: fieldClass = "",
       attributes = {},
-      help = field.helpText || field.help || ""
+      help = field.helpText || field.help || "",
+      // Auto-generation parameters
+      start = field.start,
+      end = field.end,
+      step = field.step,
+      format = field.format,
+      prefix = field.prefix,
+      suffix = field.suffix
     } = field;
     const inputClass = `form-select ${fieldClass}`.trim();
     const error = this.errors[name];
@@ -982,9 +989,15 @@ class FormBuilder {
     const fieldValue = dataValue ?? value;
     const attrs = Object.entries(attributes).map(([key, val]) => `${key}="${this.escapeHtml(val)}"`).join(" ");
     const fieldId = this.getFieldId(name);
+    let generatedOptions = [...options];
+    if (start !== void 0 && end !== void 0) {
+      const stepValue = step !== void 0 ? step : 1;
+      const autoOptions = this.generateSelectOptions(start, end, stepValue, { format, prefix, suffix });
+      generatedOptions = [...generatedOptions, ...autoOptions];
+    }
     let optionsHTML = "";
-    if (Array.isArray(options)) {
-      optionsHTML = options.map((option) => {
+    if (Array.isArray(generatedOptions)) {
+      optionsHTML = generatedOptions.map((option) => {
         if (typeof option === "string") {
           const selected = option === fieldValue ? "selected" : "";
           return `<option value="${this.escapeHtml(option)}" ${selected}>${this.escapeHtml(option)}</option>`;
@@ -1616,6 +1629,7 @@ class FormBuilder {
       maxItems = 10,
       emptyFetch = false,
       debounceMs = 300,
+      requiresActiveGroup = false,
       help = field.helpText || field.help || ""
     } = field;
     const fieldId = this.getFieldId(name);
@@ -1638,7 +1652,8 @@ class FormBuilder {
       debounceMs,
       disabled,
       readonly,
-      required
+      required,
+      requiresActiveGroup
     })}'>
           <input type="text"
                  id="${fieldId}"
@@ -1873,6 +1888,78 @@ class FormBuilder {
     }
     return `btn btn-${variant}`;
   }
+  /**
+   * Generate select options automatically from numeric range or patterns
+   * Supports multiple generation modes:
+   * - Numeric ranges: start, end, step
+   * - Formatting: format function, prefix, suffix
+   * 
+   * @param {number} start - Start value (inclusive)
+   * @param {number} end - End value (inclusive)
+   * @param {number} step - Step increment (default: 1)
+   * @param {Object} options - Additional options
+   * @param {Function|string} options.format - Format function or preset ('padded', 'ordinal')
+   * @param {string} options.prefix - Prefix for label
+   * @param {string} options.suffix - Suffix for label
+   * @returns {Array} Array of option objects {value, label}
+   * 
+   * @example
+   * // Hours 1-24
+   * generateSelectOptions(1, 24, 1)
+   * 
+   * // Minutes in 15-min increments with padding
+   * generateSelectOptions(0, 45, 15, { format: 'padded' })
+   * 
+   * // Days with ordinal suffix
+   * generateSelectOptions(1, 31, 1, { format: 'ordinal' })
+   * 
+   * // Years with prefix
+   * generateSelectOptions(2020, 2030, 1, { prefix: 'Year ' })
+   * 
+   * // Percentages
+   * generateSelectOptions(0, 100, 10, { suffix: '%' })
+   * 
+   * // Custom formatter
+   * generateSelectOptions(1, 12, 1, { 
+   *   format: (v) => ['Jan', 'Feb', 'Mar', 'Apr', 'May', 'Jun', 
+   *                   'Jul', 'Aug', 'Sep', 'Oct', 'Nov', 'Dec'][v-1] 
+   * })
+   */
+  generateSelectOptions(start, end, step = 1, options = {}) {
+    const { format, prefix = "", suffix = "" } = options;
+    const results = [];
+    const increment = start <= end ? Math.abs(step) : -Math.abs(step);
+    for (let i = start; start <= end ? i <= end : i >= end; i += increment) {
+      let label = String(i);
+      if (typeof format === "function") {
+        label = format(i);
+      } else if (format === "padded" || format === "pad") {
+        const maxLength = String(Math.max(Math.abs(start), Math.abs(end))).length;
+        label = String(i).padStart(maxLength, "0");
+      } else if (format === "ordinal") {
+        label = this.formatOrdinal(i);
+      }
+      label = `${prefix}${label}${suffix}`;
+      results.push({
+        value: i,
+        label
+      });
+    }
+    return results;
+  }
+  /**
+   * Format number with ordinal suffix (1st, 2nd, 3rd, etc.)
+   * @param {number} num - Number to format
+   * @returns {string} Formatted ordinal string
+   */
+  formatOrdinal(num) {
+    const j = num % 10;
+    const k = num % 100;
+    if (j === 1 && k !== 11) return num + "st";
+    if (j === 2 && k !== 12) return num + "nd";
+    if (j === 3 && k !== 13) return num + "rd";
+    return num + "th";
+  }
   /**
    * Escape HTML characters to prevent XSS
    * @param {string} str - String to escape
@@ -2649,14 +2736,18 @@ class CollectionDropdownView extends View {
     this.focusedIndex = options.focusedIndex || -1;
   }
   async getViewData() {
-    const items = this.collection ? this.collection.toJSON().map((item, index) => ({
-      ...item,
-      labelField: item[this.labelField],
-      valueField: item[this.valueField],
-      isSelected: item[this.valueField] == this.selectedValue,
-      isFocused: index === this.focusedIndex,
-      index
-    })) : [];
+    const items = this.collection ? this.collection.toJSON().map((item, index) => {
+      const labelValue = MOJOUtils.getNestedValue(item, this.labelField);
+      const fieldValue = MOJOUtils.getNestedValue(item, this.valueField);
+      return {
+        ...item,
+        labelField: labelValue,
+        valueField: fieldValue,
+        isSelected: fieldValue == this.selectedValue,
+        isFocused: index === this.focusedIndex,
+        index
+      };
+    }) : [];
     return {
       loading: this.loading,
       hasSearched: this.hasSearched,
@@ -2734,6 +2825,7 @@ class CollectionSelectView extends View {
     this.debounceMs = options.debounceMs || 1e3;
     this.name = options.name || "collection_select";
     this.emptyFetch = options.emptyFetch !== false;
+    this.requiresActiveGroup = options.requiresActiveGroup || false;
     this.selectedValue = options.value || "0";
     this.selectedLabel = "";
     this.searchValue = "";
@@ -2744,8 +2836,8 @@ class CollectionSelectView extends View {
     this.hasError = false;
     this.errorMessage = "";
     if (this.selectedValue && typeof this.selectedValue === "object") {
-      this.selectedLabel = this.selectedValue[this.labelField] || "";
-      this.selectedValue = this.selectedValue[this.valueField] || "0";
+      this.selectedLabel = MOJOUtils.getNestedValue(this.selectedValue, this.labelField) || "";
+      this.selectedValue = MOJOUtils.getNestedValue(this.selectedValue, this.valueField) || "0";
     }
     this.searchTimer = null;
     this.dropdownView = null;
@@ -2763,6 +2855,13 @@ class CollectionSelectView extends View {
     this.defaultParams = { ...this.collection.params };
     this.collection.params.size = this.maxItems;
     this.defaultParams.size = this.maxItems;
+    if (this.requiresActiveGroup) {
+      const app = this.getApp();
+      if (app && app.activeGroup && app.activeGroup.id) {
+        this.collection.params.group = app.activeGroup.id;
+        this.defaultParams.group = app.activeGroup.id;
+      }
+    }
     this.collection.on("fetch:start", () => {
       this.loading = true;
       this.showDropdown = true;
@@ -2796,13 +2895,13 @@ class CollectionSelectView extends View {
       if (this.selectedLabel) return;
       const selectedModel = this.collection?.get(this.selectedValue);
       if (selectedModel) {
-        this.selectedLabel = selectedModel.get(this.labelField);
+        this.selectedLabel = this.getFieldValue(selectedModel, this.labelField);
         this.render(false);
         return;
       }
       let model = await this.collection.fetchOne(this.selectedValue);
       if (model) {
-        this.selectedLabel = model.get(this.labelField, `${model.constructor.name} #${model.id}`);
+        this.selectedLabel = this.getFieldValue(model, this.labelField) || `${model.constructor.name} #${model.id}`;
         this.render(false);
       }
     } catch (error) {
@@ -3074,8 +3173,8 @@ class CollectionSelectView extends View {
     let newValue = value;
     let newLabel = "";
     if (newValue && typeof newValue === "object") {
-      newLabel = newValue[this.labelField] || "";
-      newValue = newValue[this.valueField];
+      newLabel = MOJOUtils.getNestedValue(newValue, this.labelField) || "";
+      newValue = MOJOUtils.getNestedValue(newValue, this.valueField);
     }
     newValue = newValue || "0";
     if (newValue == this.selectedValue) {
@@ -3096,6 +3195,23 @@ class CollectionSelectView extends View {
       this.render();
     }
   }
+  /**
+   * Helper method to get field value from model or plain object with dot notation support
+   * @param {Object|Model} item - The item to get value from
+   * @param {string} fieldPath - The field path (supports dot notation)
+   * @returns {*} The field value
+   */
+  getFieldValue(item, fieldPath) {
+    if (!item || !fieldPath) return void 0;
+    if (typeof item.get === "function") {
+      const value = item.get(fieldPath);
+      if (value === void 0 && fieldPath.includes(".")) {
+        return MOJOUtils.getNestedValue(item, fieldPath);
+      }
+      return value;
+    }
+    return MOJOUtils.getNestedValue(item, fieldPath);
+  }
 }
 class DatePicker extends View {
   constructor(options = {}) {
@@ -6103,4 +6219,4 @@ export {
   applyFileDropMixin as a,
   FormView$1 as b
 };
-//# sourceMappingURL=FormView-CeoubZ-s.js.map
+//# sourceMappingURL=FormView-Dh8Yqk2d.js.map