web-mojo 2.2.11 → 2.2.14

package/dist/chunks/{DataView-BYNjIf--.js.map → DataView-R_LkYBAw.js.map}

@@ -1 +1 @@
-{"version":3,"file":"DataView-BYNjIf--.js","sources":["../../src/core/views/data/DataView.js"],"sourcesContent":["/**\n * DataView - Key/Value data display component for MOJO framework\n * Extends View to display object data in a responsive grid layout with intelligent formatting support\n *\n * Features:\n * - Automatic field generation from data with intelligent type inference\n * - Smart DataFormatter pipe chains (e.g., \"date('MMM D, YYYY')|capitalize\")\n * - Contextual formatting based on field names and values\n * - Support for complex pipe chains like \"truncate(100)|capitalize|badge\"\n * - Nested DataView support with type=\"dataview\" for complex objects\n * - Custom format overrides with fluent API\n * - No format collision: custom field.format completely overrides DataView formatting\n *\n * Format Behavior:\n * - No field.format: DataView applies type-based HTML formatting (badges, links, etc.)\n * - With field.format: DataFormatter handles ALL formatting, DataView only escapes HTML\n *\n * Example Usage:\n * ```javascript\n * const dataView = new DataView({\n *   data: {\n *     name: 'john doe',\n *     email: 'john@example.com',\n *     createdAt: '2024-01-15T10:30:00Z',\n *     price: 99.99,\n *     description: 'A very long description that should be truncated...',\n *     isActive: true\n *   }\n * });\n *\n * // Auto-inferred formats (DataView adds HTML styling):\n * // name: \"truncate(50)|capitalize\"\n * // email: no format → DataView creates mailto: link\n * // createdAt: \"date('MMM D, YYYY')\"\n * // price: \"currency\"\n * // description: \"truncate(200)\"\n * // isActive: no format → DataView creates badge styling\n *\n * // Custom format overrides (DataFormatter handles ALL formatting):\n * dataView\n *   .setFieldFormat('name', 'uppercase|truncate(20)')      // No DataView HTML styling\n *   .setFieldFormat('email', 'email|uppercase')           // No mailto: link\n *   .setFieldFormat('isActive', 'boolean|uppercase')      // No badge styling\n *   .setFieldFormats({\n *     description: 'truncate(50)|capitalize',\n *     createdAt: 'relative'\n *   });\n *\n * // Nested DataView for complex objects:\n * dataView.setFieldFormat('permissions', null); // Clear auto-format\n * // Then configure field: { name: 'permissions', type: 'dataview', label: 'User Permissions' }\n * ```\n */\n\nimport View from '@core/View.js';\nimport dataFormatter from '@core/utils/DataFormatter.js';\n\nclass DataView extends View {\n  constructor(options = {}) {\n    // Extract DataView-specific options\n    const {\n      data,\n      model,\n      fields,\n      columns,\n      responsive,\n      showEmptyValues,\n      emptyValueText,\n      ...viewOptions\n    } = options;\n\n    // Set default view options\n    super({\n      tagName: 'div',\n      className: 'data-view',\n      ...viewOptions\n    });\n\n    // Core properties\n    this.data = data || {};\n    this.fields = fields || [];\n    this.model = model || null;\n\n    // If a model is provided, use it as data source\n    if (this.model) {\n      this.data = this.model;\n    }\n\n    // DataView-specific configuration\n    this.dataViewOptions = {\n      columns: columns || 2,\n      responsive: responsive !== false,  // Default to true\n      showEmptyValues: showEmptyValues || false,\n      emptyValueText: emptyValueText || '—',\n      rowClass: 'row g-3',\n      itemClass: 'data-view-item',\n      labelClass: 'data-view-label fw-semibold text-muted small text-uppercase',\n      valueClass: 'data-view-value'\n    };\n  }\n\n  /**\n   * Lifecycle hook - prepare data and fields before rendering\n   */\n  async onBeforeRender() {\n\n    // Auto-generate fields from data if none provided\n    if (this.fields.length === 0 && this.getData()) {\n      this.generateFieldsFromData();\n    }\n  }\n\n  /**\n   * Override renderTemplate to generate HTML directly\n   * @returns {string} Complete HTML string\n   */\n  async renderTemplate() {\n    const items = this.buildItemsHTML();\n\n    return `\n      <div class=\"${this.dataViewOptions.rowClass}\">\n        ${items}\n      </div>\n    `;\n  }\n\n  /**\n   * Auto-generate field definitions from data object with intelligent type inference\n   */\n  generateFieldsFromData() {\n    const dataObj = this.getData();\n\n    if (dataObj && typeof dataObj === 'object') {\n      this.fields = Object.keys(dataObj).map(key => {\n        const value = dataObj[key];\n        const fieldType = this.inferFieldType(value, key);\n        const formatter = this.inferFormatter(value, key, fieldType);\n\n        return {\n          name: key,\n          label: this.formatLabel(key),\n          type: fieldType,\n          format: formatter,\n          formatter: formatter  // Alias for consistency with TableView\n        };\n      });\n    }\n  }\n\n  /**\n   * Format field name into a readable label\n   * @param {string} name - Field name\n   * @returns {string} Formatted label\n   */\n  formatLabel(name) {\n    return name\n      .replace(/([A-Z])/g, ' $1')  // Add space before capital letters\n      .replace(/[_-]/g, ' ')        // Replace underscores and hyphens with spaces\n      .replace(/\\b\\w/g, l => l.toUpperCase())  // Title case\n      .trim();\n  }\n\n  /**\n   * Infer field type from value and key with improved intelligence\n   * @param {*} value - Field value\n   * @param {string} key - Field key\n   * @returns {string} Field type\n   */\n  inferFieldType(value, key = '') {\n    if (value === null || value === undefined) return 'text';\n\n    const keyLower = key.toLowerCase();\n    const type = typeof value;\n\n    // Date/time patterns\n    if (keyLower.includes('date') || keyLower.includes('time') ||\n        keyLower.includes('created') || keyLower.includes('updated') ||\n        keyLower.includes('modified') || keyLower.includes('last_login') ||\n        keyLower.includes('expires') || keyLower.includes('last_activity')) {\n      return 'datetime';\n    }\n\n    // Email patterns\n    if (keyLower.includes('email') || keyLower.includes('mail')) {\n      return 'email';\n    }\n\n    // URL patterns\n    if (keyLower.includes('url') || keyLower.includes('link') ||\n        keyLower.includes('website') || keyLower.includes('homepage')) {\n      return 'url';\n    }\n\n    // Phone patterns\n    if (keyLower.includes('phone') || keyLower.includes('tel') ||\n        keyLower.includes('mobile') || keyLower.includes('cell')) {\n      return 'phone';\n    }\n\n    // Currency/price patterns\n    if (keyLower.includes('price') || keyLower.includes('cost') ||\n        keyLower.includes('amount') || keyLower.includes('fee') ||\n        keyLower.includes('salary') || keyLower.includes('revenue')) {\n      return 'currency';\n    }\n\n    // File size patterns\n    if (keyLower.includes('size') || keyLower.includes('bytes')) {\n      return 'filesize';\n    }\n\n    // Percentage patterns\n    if (keyLower.includes('percent') || keyLower.includes('rate') ||\n        keyLower.includes('ratio') && type === 'number') {\n      return 'percent';\n    }\n\n    // Type-based inference\n    if (type === 'boolean') return 'boolean';\n    if (type === 'number') return 'number';\n\n    if (type === 'object') {\n      if (Array.isArray(value)) return 'array';\n      if (value && value.renditions) return 'file';\n\n      // Check if object should be displayed as nested DataView\n      if (this.shouldUseDataView(value, keyLower)) {\n        return 'dataview';\n      }\n\n      return 'object';\n    }\n\n    if (type === 'string') {\n      // Pattern matching for strings\n      if (value.includes('@') && value.includes('.')) return 'email';\n      if (value.match(/^\\d{4}-\\d{2}-\\d{2}/)) return 'date';\n      if (value.match(/^https?:\\/\\//)) return 'url';\n      if (value.match(/^\\+?[\\d\\s\\-\\(\\)]+$/)) return 'phone';\n    }\n\n    return 'text';\n  }\n\n  /**\n   * Infer appropriate formatter based on type and context\n   * @param {*} value - Field value\n   * @param {string} key - Field key\n   * @param {string} fieldType - Inferred field type\n   * @returns {string|null} Formatter pipe string\n   */\n  inferFormatter(value, key, fieldType) {\n    const keyLower = key.toLowerCase();\n    const formatters = [];\n\n    switch (fieldType) {\n      case 'datetime':\n        if (keyLower.includes('time') && !keyLower.includes('date')) {\n          formatters.push('time');\n        } else if (keyLower.includes('relative') || keyLower.includes('ago') || keyLower.includes('last_')) {\n          formatters.push('relative');\n        } else if (keyLower.includes('created') || keyLower.includes('updated') || keyLower.includes('modified')) {\n          formatters.push('date(\"MMM D, YYYY\")');\n        } else {\n          formatters.push('date(\"MMMM D, YYYY\")');\n        }\n        break;\n\n      case 'date':\n        if (keyLower.includes('birth') || keyLower.includes('dob')) {\n          formatters.push('date(\"MMMM D, YYYY\")');\n        } else {\n          formatters.push('date(\"MMM D, YYYY\")');\n        }\n        break;\n\n      case 'email':\n        // Don't apply email formatter - DataView handles mailto: links automatically\n        break;\n\n      case 'url':\n        // Don't apply url formatter - DataView handles clickable links automatically\n        break;\n\n      case 'phone':\n        formatters.push('phone');\n        break;\n\n      case 'currency':\n        formatters.push('currency');\n        // Add currency symbol detection if needed\n        if (keyLower.includes('eur') || keyLower.includes('euro')) {\n          formatters[formatters.length - 1] = 'currency(\"EUR\")';\n        } else if (keyLower.includes('gbp') || keyLower.includes('pound')) {\n          formatters[formatters.length - 1] = 'currency(\"GBP\")';\n        }\n        break;\n\n      case 'filesize':\n        formatters.push('filesize');\n        break;\n\n      case 'percent':\n        formatters.push('percent');\n        break;\n\n      case 'number':\n        // Smart number formatting with pipe chains\n        if (typeof value === 'number') {\n          if (keyLower.includes('count') || keyLower.includes('total') || keyLower.includes('followers') || keyLower.includes('views')) {\n            if (value >= 1000) {\n              formatters.push('compact');\n            } else {\n              formatters.push('number');\n            }\n          } else if (keyLower.includes('score') || keyLower.includes('rating')) {\n            formatters.push('number');\n            // Add decimal places for scores\n            if (value % 1 !== 0) {\n              formatters[formatters.length - 1] = 'number(1)';\n            }\n          } else if (keyLower.includes('version') || keyLower.includes('id')) {\n            // Don't format IDs and versions\n            return null;\n          } else {\n            formatters.push('number');\n          }\n        }\n        break;\n\n      case 'boolean':\n        // Don't apply boolean formatter - DataView handles badge styling automatically\n        break;\n\n      case 'text':\n        // Smart text formatting with contextual pipe chains\n        if (typeof value === 'string') {\n          // Handle different text contexts\n          if (keyLower.includes('description') || keyLower.includes('content') || keyLower.includes('body')) {\n            if (value.length > 200) {\n              formatters.push('truncate(200)');\n            } else if (value.length > 100) {\n              formatters.push('truncate(100)');\n            }\n          } else if (keyLower.includes('summary') || keyLower.includes('excerpt')) {\n            if (value.length > 150) {\n              formatters.push('truncate(150)');\n            }\n          } else if (keyLower.includes('name') || keyLower.includes('title') || keyLower.includes('label')) {\n            formatters.push('capitalize');\n            if (value.length > 50) {\n              formatters.unshift('truncate(50)'); // Truncate first, then capitalize\n            }\n          } else if (keyLower.includes('slug') || keyLower.includes('handle') || keyLower.includes('username')) {\n            formatters.push('slug');\n          } else if (keyLower.includes('code') || keyLower.includes('token') || keyLower.includes('key')) {\n            // Show codes/tokens with masking if long\n            if (value.length > 20) {\n              formatters.push('mask');\n            }\n          } else {\n            // Generic text handling\n            if (value.length > 100) {\n              formatters.push('truncate(100)');\n            }\n          }\n        }\n        break;\n\n      case 'array':\n      case 'object':\n        // Don't apply json formatter - DataView handles JSON display automatically\n        break;\n\n      case 'dataview':\n        // Don't apply any formatter - nested DataView handles its own formatting\n        break;\n\n      default:\n        // Handle any missed cases with basic text formatting\n        if (typeof value === 'string' && value.length > 100) {\n          formatters.push('truncate(100)');\n        }\n        break;\n    }\n\n    return formatters.length > 0 ? formatters.join('|') : null;\n  }\n\n  /**\n   * Determine if an object should be displayed as nested DataView vs JSON\n   * @param {object} value - Object value to check\n   * @param {string} keyLower - Lowercase field key\n   * @returns {boolean} True if should use DataView\n   */\n  shouldUseDataView(value, keyLower) {\n    if (!value || typeof value !== 'object' || Array.isArray(value)) {\n      return false;\n    }\n\n    // Check for common patterns that benefit from DataView display\n    const dataViewPatterns = [\n      'permissions', 'perms', 'access', 'rights',\n      'settings', 'config', 'configuration', 'options',\n      'profile', 'info', 'details', 'data',\n      'metadata', 'meta', 'attributes', 'props',\n      'preferences', 'prefs', 'user_data',\n      'contact', 'address', 'location',\n      'stats', 'statistics', 'metrics', 'counts'\n    ];\n\n    if (window.utils && window.utils.isObject(value) && value.id) {\n        return true;\n    }\n\n    // Check if key matches common patterns\n    const matchesPattern = dataViewPatterns.some(pattern => keyLower.includes(pattern));\n\n    if (matchesPattern) {\n      // Additional checks to ensure it's suitable for DataView\n      const keys = Object.keys(value);\n\n      // Good candidates: objects with multiple simple key-value pairs\n      if (keys.length >= 2 && keys.length <= 20) {\n        const hasComplexNesting = keys.some(k =>\n          typeof value[k] === 'object' &&\n          value[k] !== null &&\n          !Array.isArray(value[k]) &&\n          Object.keys(value[k]).length > 3\n        );\n\n        // Use DataView if not too deeply nested\n        if (!hasComplexNesting) {\n          return true;\n        }\n      }\n    }\n\n    return false;\n  }\n\n  /**\n   * Get data object (handles both raw objects and Models)\n   * @returns {object} Data object\n   */\n  getData() {\n    if (this.model && this.model.attributes) {\n      return { ...this.model.attributes };\n    }\n    return this.data || {};\n  }\n\n  /**\n   * Get field value with formatting support\n   * @param {object} field - Field definition\n   * @returns {*} Field value (formatted if specified)\n   */\n  getFieldValue(field) {\n    let value;\n    let key = field.name || field.key;\n    let formatString = field.format || field.formatter;\n    if (!key) return null;\n\n    // Check if the name field contains a pipe (e.g., 'is_tor|status_text')\n    // This allows inline formatter syntax in the name field\n    if (key && key.includes('|')) {\n      const parts = key.split('|');\n      key = parts[0].trim();\n      // If no explicit formatter was set, use the one from the name\n      if (!formatString) {\n        formatString = parts.slice(1).join('|').trim();\n      }\n    }\n\n    // Get raw value from data source\n    if (this.model && typeof this.model.get === 'function') {\n      // For models, get raw value first, then apply formatting separately\n      // This ensures we don't break pipe chains by concatenating strings\n      value = this.model.get(key);\n    } else {\n      // Plain object access\n      value = this.getData()[key];\n    }\n\n    // Apply formatting using DataFormatter pipe system if specified\n    // Support both 'format' and 'formatter' for consistency with TableView\n    if (formatString) {\n      value = dataFormatter.pipe(value, formatString);\n    }\n\n    // Handle empty values\n    if (value === null || value === undefined || value === '') {\n      return this.dataViewOptions.showEmptyValues ? this.dataViewOptions.emptyValueText : null;\n    }\n\n    // Apply template if provided\n    if (field.template) {\n      const modelData = this.model ? this.model : this.data;\n      return this.renderTemplateString(field.template, modelData);\n    }\n\n    return value;\n  }\n\n  /**\n   * Render a template string with data from a model or object.\n   * Replaces {{key}} and {{nested.key}} placeholders.\n   * @param {string} templateString - The template string.\n   * @param {object} data - The data object or model.\n   * @returns {string} The rendered string.\n   */\n  renderTemplateString(templateString, data) {\n    if (!templateString || !data) {\n      return '';\n    }\n\n    // Regex to find all {{...}} placeholders\n    return templateString.replace(/\\{\\{([^}]+)\\}\\}/g, (match, key) => {\n      const trimmedKey = key.trim();\n      let value;\n\n      // Handle potential formatters in the template key\n      const parts = trimmedKey.split('|');\n      const dataKey = parts[0];\n      const formatters = parts.slice(1).join('|');\n\n      // Get value from model or plain object\n      if (this.model && typeof this.model.get === 'function') {\n        value = this.model.get(dataKey);\n      } else {\n        // Handle nested keys for plain objects\n        value = dataKey.split('.').reduce((o, i) => (o ? o[i] : undefined), data);\n      }\n\n      // Apply formatters if any\n      if (formatters) {\n        value = dataFormatter.pipe(value, formatters);\n      }\n\n      return value !== undefined && value !== null ? value : '';\n    });\n  }\n\n  /**\n   * Generate column classes based on configuration\n   * @param {object} field - Field definition\n   * @returns {string} CSS classes\n   */\n  getColumnClasses(field) {\n      let classes = this.getColumnSizeClasses(field);\n      if (field.justify == \"right\") {\n        classes += ` d-flex justify-content-end`;\n      } else if (field.justify == \"center\") {\n        classes += ` d-flex justify-content-center`;\n      }\n      return classes;\n  }\n\n  /**\n   * Generate column size classes based on configuration\n   * @param {object} field - Field definition\n   * @returns {string} CSS classes\n   */\n  getColumnSizeClasses(field) {\n    // JSON objects and nested DataViews always use full width for better display\n    if (field.type === 'array' || field.type === 'object' || field.type === 'dataview') {\n      return 'col-12';\n    }\n\n    const colSize = field.columns || field.colSize || field.cols || Math.floor(12 / this.dataViewOptions.columns);\n\n    if (this.dataViewOptions.responsive) {\n      // Responsive breakpoints: 1 column on small, configured on larger screens\n      return `col-12 col-md-${colSize}`;\n    }\n\n    return `col-${colSize}`;\n  }\n\n  /**\n   * Build HTML for all data items\n   * @returns {string} Items HTML\n   */\n  buildItemsHTML() {\n    return this.fields\n      .map(field => this.buildItemHTML(field))\n      .filter(Boolean)  // Remove empty items\n      .join('');\n  }\n\n  /**\n   * Build HTML for a single data item\n   * @param {object} field - Field definition\n   * @returns {string} Item HTML\n   */\n  buildItemHTML(field) {\n    const value = this.getFieldValue(field);\n\n    // Skip fields with no value if showEmptyValues is false\n    if (value === null && !this.dataViewOptions.showEmptyValues) {\n      return '';\n    }\n\n    const label = field.label || this.formatLabel(field.name);\n    const colClasses = this.getColumnClasses(field);\n\n    return `\n      <div class=\"${colClasses}\">\n        <div class=\"${this.dataViewOptions.itemClass} ${field.className}\" data-field=\"${field.name}\">\n          ${this.buildLabelHTML(label, field)}\n          ${this.buildValueHTML(value, field)}\n        </div>\n      </div>\n    `;\n  }\n\n  /**\n   * Build label HTML\n   * @param {string} label - Label text\n   * @param {object} field - Field definition\n   * @returns {string} Label HTML\n   */\n  buildLabelHTML(label, field) {\n    const labelClass = field.labelClass || this.dataViewOptions.labelClass;\n    return `<div class=\"${labelClass}\">${this.escapeHtml(label)}:</div>`;\n  }\n\n  /**\n   * Build value HTML with type-specific formatting\n   * @param {*} value - Field value\n   * @param {object} field - Field definition\n   * @returns {string} Value HTML\n   */\n  buildValueHTML(value, field) {\n    const valueClass = field.valueClass || this.dataViewOptions.valueClass;\n    const displayValue = this.formatDisplayValue(value, field);\n    return `<div class=\"${valueClass}\">${displayValue}</div>`;\n  }\n\n  /**\n   * Format value for display with enhanced type handling\n   * @param {*} value - Formatted value from DataFormatter (or raw if no format)\n   * @param {object} field - Field definition\n   * @returns {string} Formatted display value with HTML markup\n   */\n  formatDisplayValue(value, field) {\n    if (value === null || value === undefined) {\n      return this.dataViewOptions.emptyValueText;\n    }\n\n    // If a template was used, the value is already the final HTML. Return it directly.\n    if (field.template) {\n      return String(value);\n    }\n\n    // If a custom format is specified, trust the DataFormatter output.\n    // Support both 'format' and 'formatter' for consistency with TableView\n    const formatString = field.format || field.formatter;\n    if (formatString) {\n      // If a formatter is explicitly specified, render its output as HTML\n      // The DataFormatter is responsible for proper escaping when needed\n      return String(value);\n    }\n\n    // No custom format - apply DataView's default type-specific HTML formatting\n    // Get original raw value for special cases\n    const rawValue = this.getData()[field.name];\n\n    // Handle types that need special HTML presentation (only when no custom format)\n    switch (field.type) {\n      case 'boolean':\n        // Use standard boolean badges (no custom format was applied)\n        return rawValue ?\n          '<span class=\"badge bg-success\">Yes</span>' :\n          '<span class=\"badge bg-secondary\">No</span>';\n\n      case 'email':\n        // Create clickable email links (no custom format was applied)\n        const emailStr = String(value);\n        return `<a href=\"mailto:${this.escapeHtml(emailStr)}\" class=\"text-decoration-none\">${this.escapeHtml(emailStr)}</a>`;\n\n      case 'url':\n        // Create clickable URL links (no custom format was applied)\n        const urlStr = String(value);\n        return `<a href=\"${this.escapeHtml(urlStr)}\" target=\"_blank\" rel=\"noopener\" class=\"text-decoration-none\">${this.escapeHtml(urlStr)} <i class=\"bi bi-box-arrow-up-right\"></i></a>`;\n\n      case 'array':\n      case 'object':\n        // Display as JSON with special HTML formatting (no custom format was applied)\n        return this.formatAsJson(rawValue);\n\n      case 'dataview':\n        // Create nested DataView for complex objects\n        return this.formatAsDataView(rawValue, field);\n\n      case 'phone':\n        // Create tel: links for phone numbers (no custom format was applied)\n        const phoneStr = String(value);\n        const telHref = phoneStr.replace(/[^\\d\\+]/g, ''); // Clean for tel: link\n        return `<a href=\"tel:${telHref}\" class=\"text-decoration-none\">${this.escapeHtml(phoneStr)}</a>`;\n\n      default:\n        // For all other types with no custom format, just escape and return\n        return this.escapeHtml(String(value));\n    }\n  }\n\n  /**\n   * Format object/array values as styled JSON\n   * @param {*} value - Object or array value\n   * @returns {string} Formatted JSON HTML\n   */\n  formatAsJson(value) {\n    try {\n      const jsonString = JSON.stringify(value, null, 2);\n      const escapedJson = this.escapeHtml(jsonString);\n      const lines = jsonString.split('\\n').length;\n      const isLarge = lines > 10 || jsonString.length > 500;\n      const uniqueId = `json-${Math.random().toString(36).substr(2, 9)}`;\n\n      // Create collapsible JSON display for large objects\n      if (isLarge) {\n        const preview = JSON.stringify(value).substring(0, 100) + (JSON.stringify(value).length > 100 ? '...' : '');\n        const escapedPreview = this.escapeHtml(preview);\n\n        return `\n          <div class=\"json-container\">\n            <div class=\"d-flex align-items-center justify-content-between mb-1\">\n              <small class=\"text-muted\">${Array.isArray(value) ? 'Array' : 'Object'} (${lines} lines)</small>\n              <div class=\"btn-group btn-group-sm\" role=\"group\">\n                <button type=\"button\" class=\"btn btn-outline-secondary btn-sm json-toggle\" data-bs-toggle=\"collapse\" data-bs-target=\"#${uniqueId}\" aria-expanded=\"false\">\n                  <i class=\"bi bi-eye\"></i> Show\n                </button>\n                <button type=\"button\" class=\"btn btn-outline-secondary btn-sm json-copy\" data-json='${this.escapeHtml(jsonString)}' title=\"Copy JSON\">\n                  <i class=\"bi bi-clipboard\"></i>\n                </button>\n              </div>\n            </div>\n            <div class=\"json-preview bg-light p-2 rounded small border\" style=\"font-family: 'Courier New', monospace;\">\n              <code class=\"text-muted\">${escapedPreview}</code>\n            </div>\n            <div class=\"collapse mt-2\" id=\"${uniqueId}\">\n              <pre class=\"json-display p-3 rounded small mb-0\" style=\"max-height: 400px; overflow-y: auto; white-space: pre-wrap; font-family: 'Courier New', monospace;\"><code>${this.syntaxHighlightJson(escapedJson)}</code></pre>\n            </div>\n          </div>\n        `;\n      } else {\n        // Small objects - show directly with copy button\n        return `\n          <div class=\"json-container\">\n            <div class=\"d-flex align-items-center justify-content-between mb-1\">\n              <small class=\"text-muted\">${Array.isArray(value) ? 'Array' : 'Object'}</small>\n              <button type=\"button\" class=\"btn btn-outline-secondary btn-sm json-copy\" data-json='${this.escapeHtml(jsonString)}' title=\"Copy JSON\">\n                <i class=\"bi bi-clipboard\"></i>\n              </button>\n            </div>\n            <pre class=\"json-display bg-light p-2 rounded small mb-0 border\" style=\"white-space: pre-wrap; font-family: 'Courier New', monospace;\"><code>${this.syntaxHighlightJson(escapedJson)}</code></pre>\n          </div>\n        `;\n      }\n    } catch (error) {\n      // Fallback for objects that can't be stringified\n      return `<span class=\"text-muted fst-italic\">[Object: ${typeof value}] - Cannot display as JSON</span>`;\n    }\n  }\n\n  /**\n   * Apply basic syntax highlighting to JSON\n   * @param {string} json - Escaped JSON string\n   * @returns {string} JSON with basic syntax highlighting\n   */\n  syntaxHighlightJson(json) {\n    return json\n      .replace(/(\"([^\"\\\\]|\\\\.)*\")\\s*:/g, '<span style=\"color: #0969da;\">$1</span>:') // Keys (blue)\n      .replace(/:\\s*(\"([^\"\\\\]|\\\\.)*\")/g, ': <span style=\"color: #0a3069;\">$1</span>') // String values (dark blue)\n      .replace(/:\\s*(true|false)/g, ': <span style=\"color: #8250df;\">$1</span>') // Booleans (purple)\n      .replace(/:\\s*(null)/g, ': <span style=\"color: #656d76;\">$1</span>') // Null (gray)\n      .replace(/:\\s*(-?\\d+\\.?\\d*)/g, ': <span style=\"color: #0550ae;\">$1</span>'); // Numbers (blue)\n  }\n\n  /**\n   * Bind events including JSON interaction handlers\n   */\n  bindEvents() {\n    super.bindEvents();\n\n    if (!this.element) return;\n\n    // Add click handler for field interactions\n    this.element.addEventListener('click', (e) => {\n      const fieldElement = e.target.closest('[data-field]');\n      if (fieldElement) {\n        const fieldName = fieldElement.dataset.field;\n        const field = this.fields.find(f => f.name === fieldName);\n        this.emit('field:click', { field, fieldName, element: fieldElement, event: e });\n      }\n\n      // Handle JSON copy button clicks\n      if (e.target.closest('.json-copy')) {\n        e.preventDefault();\n        e.stopPropagation();\n        this.handleJsonCopy(e.target.closest('.json-copy'));\n      }\n\n      // Handle JSON toggle button clicks\n      if (e.target.closest('.json-toggle')) {\n        this.handleJsonToggle(e.target.closest('.json-toggle'));\n      }\n    });\n  }\n\n  /**\n   * Handle copying JSON to clipboard\n   * @param {HTMLElement} button - Copy button element\n   */\n  handleJsonCopy(button) {\n    const jsonData = button.getAttribute('data-json');\n    if (!jsonData) return;\n\n    try {\n      // Use modern clipboard API if available\n      if (navigator.clipboard && window.isSecureContext) {\n        navigator.clipboard.writeText(jsonData).then(() => {\n          this.showCopyFeedback(button);\n        });\n      } else {\n        // Fallback for older browsers\n        const textarea = document.createElement('textarea');\n        textarea.value = jsonData;\n        document.body.appendChild(textarea);\n        textarea.select();\n        document.execCommand('copy');\n        document.body.removeChild(textarea);\n        this.showCopyFeedback(button);\n      }\n    } catch (error) {\n      console.warn('Failed to copy JSON:', error);\n    }\n  }\n\n  /**\n   * Handle JSON toggle button state\n   * @param {HTMLElement} button - Toggle button element\n   */\n  handleJsonToggle(button) {\n    const icon = button.querySelector('i');\n    const isExpanded = button.getAttribute('aria-expanded') === 'true';\n\n    // Update button text and icon\n    setTimeout(() => {\n      if (isExpanded) {\n        icon.className = 'bi bi-eye-slash';\n        button.innerHTML = '<i class=\"bi bi-eye-slash\"></i> Hide';\n      } else {\n        icon.className = 'bi bi-eye';\n        button.innerHTML = '<i class=\"bi bi-eye\"></i> Show';\n      }\n    }, 10);\n  }\n\n  /**\n   * Show visual feedback for successful copy\n   * @param {HTMLElement} button - Copy button element\n   */\n  showCopyFeedback(button) {\n    const originalIcon = button.querySelector('i').className;\n    const icon = button.querySelector('i');\n\n    // Show success state\n    icon.className = 'bi bi-check text-success';\n    button.classList.add('btn-success');\n    button.classList.remove('btn-outline-secondary');\n\n    // Reset after 1 second\n    setTimeout(() => {\n      icon.className = originalIcon;\n      button.classList.remove('btn-success');\n      button.classList.add('btn-outline-secondary');\n    }, 1000);\n  }\n\n  /**\n   * Format complex objects as nested DataView\n   * @param {object} value - Object value to display as DataView\n   * @param {object} field - Field definition\n   * @returns {string} Formatted DataView HTML\n   */\n  formatAsDataView(value, field) {\n    if (!value || typeof value !== 'object') {\n      return `<span class=\"text-muted fst-italic\">No data available</span>`;\n    }\n\n    try {\n      // Create nested DataView instance\n      const nestedView = new (this.constructor)({\n        data: value,\n        columns: field.dataViewColumns || 2,\n        showEmptyValues: field.showEmptyValues ?? true,\n        emptyValueText: field.emptyValueText || 'Not set',\n        // Pass any other dataView-specific options from field config\n        ...(field.dataViewOptions || {})\n      });\n\n        nestedView.onInit();\n        nestedView.generateFieldsFromData();\n      // Generate the nested DataView HTML\n      const nestedHtml = nestedView.buildItemsHTML();\n\n      // Wrap in a styled container with optional label\n      // const labelHtml = field.label ?\n      //   `<h6 class=\"fw-semibold text-muted mb-3 border-bottom pb-2\">${this.escapeHtml(field.label)}</h6>` :\n      //   '';\n\n      return `\n        <div class=\"nested-dataview border rounded p-3 bg-light\">\n          <div class=\"${nestedView.dataViewOptions.rowClass}\">\n            ${nestedHtml}\n          </div>\n        </div>\n      `;\n    } catch (error) {\n      console.error('Error creating nested DataView:', error);\n      return `<span class=\"text-danger\">Error displaying nested data</span>`;\n    }\n  }\n\n  /**\n   * Update the data and re-render\n   * @param {object} newData - New data object\n   * @returns {Promise<DataView>} Promise resolving to this instance\n   */\n  async updateData(newData) {\n    this.data = newData;\n\n    // If model is provided, update it instead\n    if (this.model && typeof this.model.set === 'function') {\n      this.model.set(newData);\n    }\n\n    // Clear fields to trigger regeneration on next render\n    if (this.fields.length > 0 && !this.options.fields) {\n      this.fields = [];\n    }\n\n    await this.render();\n    this.emit('data:updated', { data: newData });\n    return this;\n  }\n\n  /**\n   * Update field configuration and re-render\n   * @param {array} newFields - New field configuration\n   * @returns {Promise<DataView>} Promise resolving to this instance\n   */\n  async updateFields(newFields) {\n    this.fields = newFields;\n    await this.render();\n    this.emit('fields:updated', { fields: newFields });\n    return this;\n  }\n\n  /**\n   * Update configuration and re-render\n   * @param {object} newOptions - New configuration options\n   * @returns {Promise<DataView>} Promise resolving to this instance\n   */\n  async updateConfig(newOptions) {\n    this.dataViewOptions = { ...this.dataViewOptions, ...newOptions };\n    await this.render();\n    this.emit('config:updated', { options: this.dataViewOptions });\n    return this;\n  }\n\n  /**\n   * Refresh data from model if available\n   * @returns {Promise<DataView>} Promise resolving to this instance\n   */\n  async refresh() {\n    if (this.model && typeof this.model.fetch === 'function') {\n      try {\n        await this.model.fetch();\n        this.emit('data:refreshed', { model: this.model });\n      } catch (error) {\n        this.emit('error', { error, message: 'Failed to refresh data' });\n        throw error;\n      }\n    }\n    return this;\n  }\n\n  /**\n   * Get current data\n   * @returns {object} Current data object\n   */\n  getCurrentData() {\n    return this.getData();\n  }\n\n  /**\n   * Get field definition by name\n   * @param {string} name - Field name\n   * @returns {object|null} Field definition\n   */\n  getField(name) {\n    return this.fields.find(field => field.name === name) || null;\n  }\n\n  /**\n   * Set custom format for a specific field\n   * @param {string} fieldName - Name of the field\n   * @param {string} format - Pipe format string (e.g., \"currency|uppercase\")\n   * @returns {DataView} This instance for chaining\n   */\n  setFieldFormat(fieldName, format) {\n    const field = this.getField(fieldName);\n    if (field) {\n      field.format = format;\n      field.formatter = format;  // Keep both in sync\n    } else {\n      // Create new field if it doesn't exist\n      this.fields.push({\n        name: fieldName,\n        label: this.formatLabel(fieldName),\n        type: this.inferFieldType(this.getData()[fieldName], fieldName),\n        format: format,\n        formatter: format  // Keep both in sync\n      });\n    }\n    return this;\n  }\n\n  /**\n   * Add additional formatter to existing field format pipe chain\n   * @param {string} fieldName - Name of the field\n   * @param {string} formatter - Formatter to add (e.g., \"uppercase\", \"truncate(50)\")\n   * @returns {DataView} This instance for chaining\n   */\n  addFormatPipe(fieldName, formatter) {\n    const field = this.getField(fieldName);\n    if (field) {\n      if (field.format) {\n        field.format += `|${formatter}`;\n        field.formatter = field.format;  // Keep both in sync\n      } else {\n        field.format = formatter;\n        field.formatter = formatter;  // Keep both in sync\n      }\n    }\n    return this;\n  }\n\n  /**\n   * Clear custom format for a field (revert to auto-inferred format)\n   * @param {string} fieldName - Name of the field\n   * @returns {DataView} This instance for chaining\n   */\n  clearFieldFormat(fieldName) {\n    const field = this.getField(fieldName);\n    if (field) {\n      const data = this.getData();\n      const inferred = this.inferFormatter(data[fieldName], fieldName, field.type);\n      field.format = inferred;\n      field.formatter = inferred;  // Keep both in sync\n    }\n    return this;\n  }\n\n  /**\n   * Get formatted value for a specific field without rendering\n   * @param {string} fieldName - Name of the field\n   * @param {*} value - Optional value to format (uses current data if not provided)\n   * @returns {*} Formatted value\n   */\n  getFormattedValue(fieldName, value = null) {\n    const field = this.getField(fieldName);\n    if (!field) return null;\n\n    const targetValue = value !== null ? value : this.getData()[fieldName];\n\n    // Support both 'format' and 'formatter' for consistency with TableView\n    const formatString = field.format || field.formatter;\n    if (formatString && targetValue != null) {\n      return dataFormatter.pipe(targetValue, formatString);\n    }\n\n    return targetValue;\n  }\n\n  /**\n   * Set multiple field formats at once\n   * @param {object} formats - Object mapping field names to format strings\n   * @returns {DataView} This instance for chaining\n   */\n  setFieldFormats(formats) {\n    Object.entries(formats).forEach(([fieldName, format]) => {\n      this.setFieldFormat(fieldName, format);\n    });\n    return this;\n  }\n\n  /**\n   * Get all current field formats as an object\n   * @returns {object} Object mapping field names to their current formats\n   */\n  getFieldFormats() {\n    const formats = {};\n    this.fields.forEach(field => {\n      const formatString = field.format || field.formatter;\n      if (formatString) {\n        formats[field.name] = formatString;\n      }\n    });\n    return formats;\n  }\n\n  /**\n   * Set up model event listeners if model is provided\n   */\n  onInit() {\n    super.onInit();\n\n    // Listen for model changes\n    if (this.model && typeof this.model.on === 'function') {\n      this.model.on('change', () => {\n        this.render();\n      });\n    }\n  }\n\n  /**\n   * Static factory method\n   * @param {object} options - DataView options\n   * @returns {DataView} New DataView instance\n   */\n  static create(options = {}) {\n    return new DataView(options);\n  }\n}\n\nexport default DataView;\n"],"names":["DataView","View","constructor","options","data","model","fields","columns","responsive","showEmptyValues","emptyValueText","viewOptions","super","tagName","className","this","dataViewOptions","rowClass","itemClass","labelClass","valueClass","onBeforeRender","length","getData","generateFieldsFromData","renderTemplate","items","buildItemsHTML","dataObj","Object","keys","map","key","value","fieldType","inferFieldType","formatter","inferFormatter","name","label","formatLabel","type","format","replace","l","toUpperCase","trim","keyLower","toLowerCase","includes","Array","isArray","renditions","shouldUseDataView","match","formatters","push","unshift","join","window","utils","isObject","id","some","pattern","k","attributes","getFieldValue","field","formatString","parts","split","slice","get","dataFormatter","pipe","template","modelData","renderTemplateString","templateString","dataKey","reduce","o","i","getColumnClasses","classes","getColumnSizeClasses","justify","colSize","cols","Math","floor","buildItemHTML","filter","Boolean","buildLabelHTML","buildValueHTML","escapeHtml","formatDisplayValue","String","rawValue","emailStr","urlStr","formatAsJson","formatAsDataView","phoneStr","jsonString","JSON","stringify","escapedJson","lines","isLarge","uniqueId","random","toString","substr","preview","substring","escapedPreview","syntaxHighlightJson","error","json","bindEvents","element","addEventListener","e","fieldElement","target","closest","fieldName","dataset","find","f","emit","event","preventDefault","stopPropagation","handleJsonCopy","handleJsonToggle","button","jsonData","getAttribute","navigator","clipboard","isSecureContext","writeText","then","showCopyFeedback","textarea","document","createElement","body","appendChild","select","execCommand","removeChild","console","warn","icon","querySelector","isExpanded","setTimeout","innerHTML","originalIcon","classList","add","remove","nestedView","dataViewColumns","onInit","nestedHtml","updateData","newData","set","render","updateFields","newFields","updateConfig","newOptions","refresh","fetch","message","getCurrentData","getField","setFieldFormat","addFormatPipe","clearFieldFormat","inferred","getFormattedValue","targetValue","setFieldFormats","formats","entries","forEach","getFieldFormats","on","create"],"mappings":"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"}
+{"version":3,"file":"DataView-R_LkYBAw.js","sources":["../../src/core/views/data/DataView.js"],"sourcesContent":["/**\n * DataView - Key/Value data display component for MOJO framework\n * Extends View to display object data in a responsive grid layout with intelligent formatting support\n *\n * Features:\n * - Automatic field generation from data with intelligent type inference\n * - Smart DataFormatter pipe chains (e.g., \"date('MMM D, YYYY')|capitalize\")\n * - Contextual formatting based on field names and values\n * - Support for complex pipe chains like \"truncate(100)|capitalize|badge\"\n * - Nested DataView support with type=\"dataview\" for complex objects\n * - Custom format overrides with fluent API\n * - No format collision: custom field.format completely overrides DataView formatting\n *\n * Format Behavior:\n * - No field.format: DataView applies type-based HTML formatting (badges, links, etc.)\n * - With field.format: DataFormatter handles ALL formatting, DataView only escapes HTML\n *\n * Example Usage:\n * ```javascript\n * const dataView = new DataView({\n *   data: {\n *     name: 'john doe',\n *     email: 'john@example.com',\n *     createdAt: '2024-01-15T10:30:00Z',\n *     price: 99.99,\n *     description: 'A very long description that should be truncated...',\n *     isActive: true\n *   }\n * });\n *\n * // Auto-inferred formats (DataView adds HTML styling):\n * // name: \"truncate(50)|capitalize\"\n * // email: no format → DataView creates mailto: link\n * // createdAt: \"date('MMM D, YYYY')\"\n * // price: \"currency\"\n * // description: \"truncate(200)\"\n * // isActive: no format → DataView creates badge styling\n *\n * // Custom format overrides (DataFormatter handles ALL formatting):\n * dataView\n *   .setFieldFormat('name', 'uppercase|truncate(20)')      // No DataView HTML styling\n *   .setFieldFormat('email', 'email|uppercase')           // No mailto: link\n *   .setFieldFormat('isActive', 'boolean|uppercase')      // No badge styling\n *   .setFieldFormats({\n *     description: 'truncate(50)|capitalize',\n *     createdAt: 'relative'\n *   });\n *\n * // Nested DataView for complex objects:\n * dataView.setFieldFormat('permissions', null); // Clear auto-format\n * // Then configure field: { name: 'permissions', type: 'dataview', label: 'User Permissions' }\n * ```\n */\n\nimport View from '@core/View.js';\nimport dataFormatter from '@core/utils/DataFormatter.js';\n\nclass DataView extends View {\n  constructor(options = {}) {\n    // Extract DataView-specific options\n    const {\n      data,\n      model,\n      fields,\n      columns,\n      responsive,\n      showEmptyValues,\n      emptyValueText,\n      ...viewOptions\n    } = options;\n\n    // Set default view options\n    super({\n      tagName: 'div',\n      className: 'data-view',\n      ...viewOptions\n    });\n\n    // Core properties\n    this.data = data || {};\n    this.fields = fields || [];\n    this.model = model || null;\n\n    // If a model is provided, use it as data source\n    if (this.model) {\n      this.data = this.model;\n    }\n\n    // DataView-specific configuration\n    this.dataViewOptions = {\n      columns: columns || 2,\n      responsive: responsive !== false,  // Default to true\n      showEmptyValues: showEmptyValues || false,\n      emptyValueText: emptyValueText || '—',\n      rowClass: 'row g-3',\n      itemClass: 'data-view-item',\n      labelClass: 'data-view-label fw-semibold text-muted small text-uppercase',\n      valueClass: 'data-view-value'\n    };\n  }\n\n  /**\n   * Lifecycle hook - prepare data and fields before rendering\n   */\n  async onBeforeRender() {\n\n    // Auto-generate fields from data if none provided\n    if (this.fields.length === 0 && this.getData()) {\n      this.generateFieldsFromData();\n    }\n  }\n\n  /**\n   * Override renderTemplate to generate HTML directly\n   * @returns {string} Complete HTML string\n   */\n  async renderTemplate() {\n    const items = this.buildItemsHTML();\n\n    return `\n      <div class=\"${this.dataViewOptions.rowClass}\">\n        ${items}\n      </div>\n    `;\n  }\n\n  /**\n   * Auto-generate field definitions from data object with intelligent type inference\n   */\n  generateFieldsFromData() {\n    const dataObj = this.getData();\n\n    if (dataObj && typeof dataObj === 'object') {\n      this.fields = Object.keys(dataObj).map(key => {\n        const value = dataObj[key];\n        const fieldType = this.inferFieldType(value, key);\n        const formatter = this.inferFormatter(value, key, fieldType);\n\n        return {\n          name: key,\n          label: this.formatLabel(key),\n          type: fieldType,\n          format: formatter,\n          formatter: formatter  // Alias for consistency with TableView\n        };\n      });\n    }\n  }\n\n  /**\n   * Format field name into a readable label\n   * @param {string} name - Field name\n   * @returns {string} Formatted label\n   */\n  formatLabel(name) {\n    return name\n      .replace(/([A-Z])/g, ' $1')  // Add space before capital letters\n      .replace(/[_-]/g, ' ')        // Replace underscores and hyphens with spaces\n      .replace(/\\b\\w/g, l => l.toUpperCase())  // Title case\n      .trim();\n  }\n\n  /**\n   * Infer field type from value and key with improved intelligence\n   * @param {*} value - Field value\n   * @param {string} key - Field key\n   * @returns {string} Field type\n   */\n  inferFieldType(value, key = '') {\n    if (value === null || value === undefined) return 'text';\n\n    const keyLower = key.toLowerCase();\n    const type = typeof value;\n\n    // Date/time patterns\n    if (keyLower.includes('date') || keyLower.includes('time') ||\n        keyLower.includes('created') || keyLower.includes('updated') ||\n        keyLower.includes('modified') || keyLower.includes('last_login') ||\n        keyLower.includes('expires') || keyLower.includes('last_activity')) {\n      return 'datetime';\n    }\n\n    // Email patterns\n    if (keyLower.includes('email') || keyLower.includes('mail')) {\n      return 'email';\n    }\n\n    // URL patterns\n    if (keyLower.includes('url') || keyLower.includes('link') ||\n        keyLower.includes('website') || keyLower.includes('homepage')) {\n      return 'url';\n    }\n\n    // Phone patterns\n    if (keyLower.includes('phone') || keyLower.includes('tel') ||\n        keyLower.includes('mobile') || keyLower.includes('cell')) {\n      return 'phone';\n    }\n\n    // Currency/price patterns\n    if (keyLower.includes('price') || keyLower.includes('cost') ||\n        keyLower.includes('amount') || keyLower.includes('fee') ||\n        keyLower.includes('salary') || keyLower.includes('revenue')) {\n      return 'currency';\n    }\n\n    // File size patterns\n    if (keyLower.includes('size') || keyLower.includes('bytes')) {\n      return 'filesize';\n    }\n\n    // Percentage patterns\n    if (keyLower.includes('percent') || keyLower.includes('rate') ||\n        keyLower.includes('ratio') && type === 'number') {\n      return 'percent';\n    }\n\n    // Type-based inference\n    if (type === 'boolean') return 'boolean';\n    if (type === 'number') return 'number';\n\n    if (type === 'object') {\n      if (Array.isArray(value)) return 'array';\n      if (value && value.renditions) return 'file';\n\n      // Check if object should be displayed as nested DataView\n      if (this.shouldUseDataView(value, keyLower)) {\n        return 'dataview';\n      }\n\n      return 'object';\n    }\n\n    if (type === 'string') {\n      // Pattern matching for strings\n      if (value.includes('@') && value.includes('.')) return 'email';\n      if (value.match(/^\\d{4}-\\d{2}-\\d{2}/)) return 'date';\n      if (value.match(/^https?:\\/\\//)) return 'url';\n      if (value.match(/^\\+?[\\d\\s\\-\\(\\)]+$/)) return 'phone';\n    }\n\n    return 'text';\n  }\n\n  /**\n   * Infer appropriate formatter based on type and context\n   * @param {*} value - Field value\n   * @param {string} key - Field key\n   * @param {string} fieldType - Inferred field type\n   * @returns {string|null} Formatter pipe string\n   */\n  inferFormatter(value, key, fieldType) {\n    const keyLower = key.toLowerCase();\n    const formatters = [];\n\n    switch (fieldType) {\n      case 'datetime':\n        if (keyLower.includes('time') && !keyLower.includes('date')) {\n          formatters.push('time');\n        } else if (keyLower.includes('relative') || keyLower.includes('ago') || keyLower.includes('last_')) {\n          formatters.push('relative');\n        } else if (keyLower.includes('created') || keyLower.includes('updated') || keyLower.includes('modified')) {\n          formatters.push('date(\"MMM D, YYYY\")');\n        } else {\n          formatters.push('date(\"MMMM D, YYYY\")');\n        }\n        break;\n\n      case 'date':\n        if (keyLower.includes('birth') || keyLower.includes('dob')) {\n          formatters.push('date(\"MMMM D, YYYY\")');\n        } else {\n          formatters.push('date(\"MMM D, YYYY\")');\n        }\n        break;\n\n      case 'email':\n        // Don't apply email formatter - DataView handles mailto: links automatically\n        break;\n\n      case 'url':\n        // Don't apply url formatter - DataView handles clickable links automatically\n        break;\n\n      case 'phone':\n        formatters.push('phone');\n        break;\n\n      case 'currency':\n        formatters.push('currency');\n        // Add currency symbol detection if needed\n        if (keyLower.includes('eur') || keyLower.includes('euro')) {\n          formatters[formatters.length - 1] = 'currency(\"EUR\")';\n        } else if (keyLower.includes('gbp') || keyLower.includes('pound')) {\n          formatters[formatters.length - 1] = 'currency(\"GBP\")';\n        }\n        break;\n\n      case 'filesize':\n        formatters.push('filesize');\n        break;\n\n      case 'percent':\n        formatters.push('percent');\n        break;\n\n      case 'number':\n        // Smart number formatting with pipe chains\n        if (typeof value === 'number') {\n          if (keyLower.includes('count') || keyLower.includes('total') || keyLower.includes('followers') || keyLower.includes('views')) {\n            if (value >= 1000) {\n              formatters.push('compact');\n            } else {\n              formatters.push('number');\n            }\n          } else if (keyLower.includes('score') || keyLower.includes('rating')) {\n            formatters.push('number');\n            // Add decimal places for scores\n            if (value % 1 !== 0) {\n              formatters[formatters.length - 1] = 'number(1)';\n            }\n          } else if (keyLower.includes('version') || keyLower.includes('id')) {\n            // Don't format IDs and versions\n            return null;\n          } else {\n            formatters.push('number');\n          }\n        }\n        break;\n\n      case 'boolean':\n        // Don't apply boolean formatter - DataView handles badge styling automatically\n        break;\n\n      case 'text':\n        // Smart text formatting with contextual pipe chains\n        if (typeof value === 'string') {\n          // Handle different text contexts\n          if (keyLower.includes('description') || keyLower.includes('content') || keyLower.includes('body')) {\n            if (value.length > 200) {\n              formatters.push('truncate(200)');\n            } else if (value.length > 100) {\n              formatters.push('truncate(100)');\n            }\n          } else if (keyLower.includes('summary') || keyLower.includes('excerpt')) {\n            if (value.length > 150) {\n              formatters.push('truncate(150)');\n            }\n          } else if (keyLower.includes('name') || keyLower.includes('title') || keyLower.includes('label')) {\n            formatters.push('capitalize');\n            if (value.length > 50) {\n              formatters.unshift('truncate(50)'); // Truncate first, then capitalize\n            }\n          } else if (keyLower.includes('slug') || keyLower.includes('handle') || keyLower.includes('username')) {\n            formatters.push('slug');\n          } else if (keyLower.includes('code') || keyLower.includes('token') || keyLower.includes('key')) {\n            // Show codes/tokens with masking if long\n            if (value.length > 20) {\n              formatters.push('mask');\n            }\n          } else {\n            // Generic text handling\n            if (value.length > 100) {\n              formatters.push('truncate(100)');\n            }\n          }\n        }\n        break;\n\n      case 'array':\n      case 'object':\n        // Don't apply json formatter - DataView handles JSON display automatically\n        break;\n\n      case 'dataview':\n        // Don't apply any formatter - nested DataView handles its own formatting\n        break;\n\n      default:\n        // Handle any missed cases with basic text formatting\n        if (typeof value === 'string' && value.length > 100) {\n          formatters.push('truncate(100)');\n        }\n        break;\n    }\n\n    return formatters.length > 0 ? formatters.join('|') : null;\n  }\n\n  /**\n   * Determine if an object should be displayed as nested DataView vs JSON\n   * @param {object} value - Object value to check\n   * @param {string} keyLower - Lowercase field key\n   * @returns {boolean} True if should use DataView\n   */\n  shouldUseDataView(value, keyLower) {\n    if (!value || typeof value !== 'object' || Array.isArray(value)) {\n      return false;\n    }\n\n    // Check for common patterns that benefit from DataView display\n    const dataViewPatterns = [\n      'permissions', 'perms', 'access', 'rights',\n      'settings', 'config', 'configuration', 'options',\n      'profile', 'info', 'details', 'data',\n      'metadata', 'meta', 'attributes', 'props',\n      'preferences', 'prefs', 'user_data',\n      'contact', 'address', 'location',\n      'stats', 'statistics', 'metrics', 'counts'\n    ];\n\n    if (window.utils && window.utils.isObject(value) && value.id) {\n        return true;\n    }\n\n    // Check if key matches common patterns\n    const matchesPattern = dataViewPatterns.some(pattern => keyLower.includes(pattern));\n\n    if (matchesPattern) {\n      // Additional checks to ensure it's suitable for DataView\n      const keys = Object.keys(value);\n\n      // Good candidates: objects with multiple simple key-value pairs\n      if (keys.length >= 2 && keys.length <= 20) {\n        const hasComplexNesting = keys.some(k =>\n          typeof value[k] === 'object' &&\n          value[k] !== null &&\n          !Array.isArray(value[k]) &&\n          Object.keys(value[k]).length > 3\n        );\n\n        // Use DataView if not too deeply nested\n        if (!hasComplexNesting) {\n          return true;\n        }\n      }\n    }\n\n    return false;\n  }\n\n  /**\n   * Get data object (handles both raw objects and Models)\n   * @returns {object} Data object\n   */\n  getData() {\n    if (this.model && this.model.attributes) {\n      return { ...this.model.attributes };\n    }\n    return this.data || {};\n  }\n\n  /**\n   * Get field value with formatting support\n   * @param {object} field - Field definition\n   * @returns {*} Field value (formatted if specified)\n   */\n  getFieldValue(field) {\n    let value;\n    let key = field.name || field.key;\n    let formatString = field.format || field.formatter;\n    if (!key) return null;\n\n    // Check if the name field contains a pipe (e.g., 'is_tor|status_text')\n    // This allows inline formatter syntax in the name field\n    if (key && key.includes('|')) {\n      const parts = key.split('|');\n      key = parts[0].trim();\n      // If no explicit formatter was set, use the one from the name\n      if (!formatString) {\n        formatString = parts.slice(1).join('|').trim();\n      }\n    }\n\n    // Get raw value from data source\n    if (this.model && typeof this.model.get === 'function') {\n      // For models, get raw value first, then apply formatting separately\n      // This ensures we don't break pipe chains by concatenating strings\n      value = this.model.get(key);\n    } else {\n      // Plain object access\n      value = this.getData()[key];\n    }\n\n    // Apply formatting using DataFormatter pipe system if specified\n    // Support both 'format' and 'formatter' for consistency with TableView\n    if (formatString) {\n      value = dataFormatter.pipe(value, formatString);\n    }\n\n    // Handle empty values\n    if (value === null || value === undefined || value === '') {\n      return this.dataViewOptions.showEmptyValues ? this.dataViewOptions.emptyValueText : null;\n    }\n\n    // Apply template if provided\n    if (field.template) {\n      const modelData = this.model ? this.model : this.data;\n      return this.renderTemplateString(field.template, modelData);\n    }\n\n    return value;\n  }\n\n  /**\n   * Render a template string with data from a model or object.\n   * Replaces {{key}} and {{nested.key}} placeholders.\n   * @param {string} templateString - The template string.\n   * @param {object} data - The data object or model.\n   * @returns {string} The rendered string.\n   */\n  renderTemplateString(templateString, data) {\n    if (!templateString || !data) {\n      return '';\n    }\n\n    // Regex to find all {{...}} placeholders\n    return templateString.replace(/\\{\\{([^}]+)\\}\\}/g, (match, key) => {\n      const trimmedKey = key.trim();\n      let value;\n\n      // Handle potential formatters in the template key\n      const parts = trimmedKey.split('|');\n      const dataKey = parts[0];\n      const formatters = parts.slice(1).join('|');\n\n      // Get value from model or plain object\n      if (this.model && typeof this.model.get === 'function') {\n        value = this.model.get(dataKey);\n      } else {\n        // Handle nested keys for plain objects\n        value = dataKey.split('.').reduce((o, i) => (o ? o[i] : undefined), data);\n      }\n\n      // Apply formatters if any\n      if (formatters) {\n        value = dataFormatter.pipe(value, formatters);\n      }\n\n      return value !== undefined && value !== null ? value : '';\n    });\n  }\n\n  /**\n   * Generate column classes based on configuration\n   * @param {object} field - Field definition\n   * @returns {string} CSS classes\n   */\n  getColumnClasses(field) {\n      let classes = this.getColumnSizeClasses(field);\n      if (field.justify == \"right\") {\n        classes += ` d-flex justify-content-end`;\n      } else if (field.justify == \"center\") {\n        classes += ` d-flex justify-content-center`;\n      }\n      return classes;\n  }\n\n  /**\n   * Generate column size classes based on configuration\n   * @param {object} field - Field definition\n   * @returns {string} CSS classes\n   */\n  getColumnSizeClasses(field) {\n    // JSON objects and nested DataViews always use full width for better display\n    if (field.type === 'array' || field.type === 'object' || field.type === 'dataview') {\n      return 'col-12';\n    }\n\n    const colSize = field.columns || field.colSize || field.cols || Math.floor(12 / this.dataViewOptions.columns);\n\n    if (this.dataViewOptions.responsive) {\n      // Responsive breakpoints: 1 column on small, configured on larger screens\n      return `col-12 col-md-${colSize}`;\n    }\n\n    return `col-${colSize}`;\n  }\n\n  /**\n   * Build HTML for all data items\n   * @returns {string} Items HTML\n   */\n  buildItemsHTML() {\n    return this.fields\n      .map(field => this.buildItemHTML(field))\n      .filter(Boolean)  // Remove empty items\n      .join('');\n  }\n\n  /**\n   * Build HTML for a single data item\n   * @param {object} field - Field definition\n   * @returns {string} Item HTML\n   */\n  buildItemHTML(field) {\n    const value = this.getFieldValue(field);\n\n    // Skip fields with no value if showEmptyValues is false\n    if (value === null && !this.dataViewOptions.showEmptyValues) {\n      return '';\n    }\n\n    const label = field.label || this.formatLabel(field.name);\n    const colClasses = this.getColumnClasses(field);\n\n    return `\n      <div class=\"${colClasses}\">\n        <div class=\"${this.dataViewOptions.itemClass} ${field.className}\" data-field=\"${field.name}\">\n          ${this.buildLabelHTML(label, field)}\n          ${this.buildValueHTML(value, field)}\n        </div>\n      </div>\n    `;\n  }\n\n  /**\n   * Build label HTML\n   * @param {string} label - Label text\n   * @param {object} field - Field definition\n   * @returns {string} Label HTML\n   */\n  buildLabelHTML(label, field) {\n    const labelClass = field.labelClass || this.dataViewOptions.labelClass;\n    return `<div class=\"${labelClass}\">${this.escapeHtml(label)}:</div>`;\n  }\n\n  /**\n   * Build value HTML with type-specific formatting\n   * @param {*} value - Field value\n   * @param {object} field - Field definition\n   * @returns {string} Value HTML\n   */\n  buildValueHTML(value, field) {\n    const valueClass = field.valueClass || this.dataViewOptions.valueClass;\n    const displayValue = this.formatDisplayValue(value, field);\n    return `<div class=\"${valueClass}\">${displayValue}</div>`;\n  }\n\n  /**\n   * Format value for display with enhanced type handling\n   * @param {*} value - Formatted value from DataFormatter (or raw if no format)\n   * @param {object} field - Field definition\n   * @returns {string} Formatted display value with HTML markup\n   */\n  formatDisplayValue(value, field) {\n    if (value === null || value === undefined) {\n      return this.dataViewOptions.emptyValueText;\n    }\n\n    // If a template was used, the value is already the final HTML. Return it directly.\n    if (field.template) {\n      return String(value);\n    }\n\n    // If a custom format is specified, trust the DataFormatter output.\n    // Support both 'format' and 'formatter' for consistency with TableView\n    const formatString = field.format || field.formatter;\n    if (formatString) {\n      // If a formatter is explicitly specified, render its output as HTML\n      // The DataFormatter is responsible for proper escaping when needed\n      return String(value);\n    }\n\n    // No custom format - apply DataView's default type-specific HTML formatting\n    // Get original raw value for special cases\n    const rawValue = this.getData()[field.name];\n\n    // Handle types that need special HTML presentation (only when no custom format)\n    switch (field.type) {\n      case 'boolean':\n        // Use standard boolean badges (no custom format was applied)\n        return rawValue ?\n          '<span class=\"badge bg-success\">Yes</span>' :\n          '<span class=\"badge bg-secondary\">No</span>';\n\n      case 'email':\n        // Create clickable email links (no custom format was applied)\n        const emailStr = String(value);\n        return `<a href=\"mailto:${this.escapeHtml(emailStr)}\" class=\"text-decoration-none\">${this.escapeHtml(emailStr)}</a>`;\n\n      case 'url':\n        // Create clickable URL links (no custom format was applied)\n        const urlStr = String(value);\n        return `<a href=\"${this.escapeHtml(urlStr)}\" target=\"_blank\" rel=\"noopener\" class=\"text-decoration-none\">${this.escapeHtml(urlStr)} <i class=\"bi bi-box-arrow-up-right\"></i></a>`;\n\n      case 'array':\n      case 'object':\n        // Display as JSON with special HTML formatting (no custom format was applied)\n        return this.formatAsJson(rawValue);\n\n      case 'dataview':\n        // Create nested DataView for complex objects\n        return this.formatAsDataView(rawValue, field);\n\n      case 'phone':\n        // Create tel: links for phone numbers (no custom format was applied)\n        const phoneStr = String(value);\n        const telHref = phoneStr.replace(/[^\\d\\+]/g, ''); // Clean for tel: link\n        return `<a href=\"tel:${telHref}\" class=\"text-decoration-none\">${this.escapeHtml(phoneStr)}</a>`;\n\n      default:\n        // For all other types with no custom format, just escape and return\n        return this.escapeHtml(String(value));\n    }\n  }\n\n  /**\n   * Format object/array values as styled JSON\n   * @param {*} value - Object or array value\n   * @returns {string} Formatted JSON HTML\n   */\n  formatAsJson(value) {\n    try {\n      const jsonString = JSON.stringify(value, null, 2);\n      const escapedJson = this.escapeHtml(jsonString);\n      const lines = jsonString.split('\\n').length;\n      const isLarge = lines > 10 || jsonString.length > 500;\n      const uniqueId = `json-${Math.random().toString(36).substr(2, 9)}`;\n\n      // Create collapsible JSON display for large objects\n      if (isLarge) {\n        const preview = JSON.stringify(value).substring(0, 100) + (JSON.stringify(value).length > 100 ? '...' : '');\n        const escapedPreview = this.escapeHtml(preview);\n\n        return `\n          <div class=\"json-container\">\n            <div class=\"d-flex align-items-center justify-content-between mb-1\">\n              <small class=\"text-muted\">${Array.isArray(value) ? 'Array' : 'Object'} (${lines} lines)</small>\n              <div class=\"btn-group btn-group-sm\" role=\"group\">\n                <button type=\"button\" class=\"btn btn-outline-secondary btn-sm json-toggle\" data-bs-toggle=\"collapse\" data-bs-target=\"#${uniqueId}\" aria-expanded=\"false\">\n                  <i class=\"bi bi-eye\"></i> Show\n                </button>\n                <button type=\"button\" class=\"btn btn-outline-secondary btn-sm json-copy\" data-json='${this.escapeHtml(jsonString)}' title=\"Copy JSON\">\n                  <i class=\"bi bi-clipboard\"></i>\n                </button>\n              </div>\n            </div>\n            <div class=\"json-preview bg-light p-2 rounded small border\" style=\"font-family: 'Courier New', monospace;\">\n              <code class=\"text-muted\">${escapedPreview}</code>\n            </div>\n            <div class=\"collapse mt-2\" id=\"${uniqueId}\">\n              <pre class=\"json-display p-3 rounded small mb-0\" style=\"max-height: 400px; overflow-y: auto; white-space: pre-wrap; font-family: 'Courier New', monospace;\"><code>${this.syntaxHighlightJson(escapedJson)}</code></pre>\n            </div>\n          </div>\n        `;\n      } else {\n        // Small objects - show directly with copy button\n        return `\n          <div class=\"json-container\">\n            <div class=\"d-flex align-items-center justify-content-between mb-1\">\n              <small class=\"text-muted\">${Array.isArray(value) ? 'Array' : 'Object'}</small>\n              <button type=\"button\" class=\"btn btn-outline-secondary btn-sm json-copy\" data-json='${this.escapeHtml(jsonString)}' title=\"Copy JSON\">\n                <i class=\"bi bi-clipboard\"></i>\n              </button>\n            </div>\n            <pre class=\"json-display bg-light p-2 rounded small mb-0 border\" style=\"white-space: pre-wrap; font-family: 'Courier New', monospace;\"><code>${this.syntaxHighlightJson(escapedJson)}</code></pre>\n          </div>\n        `;\n      }\n    } catch (error) {\n      // Fallback for objects that can't be stringified\n      return `<span class=\"text-muted fst-italic\">[Object: ${typeof value}] - Cannot display as JSON</span>`;\n    }\n  }\n\n  /**\n   * Apply basic syntax highlighting to JSON\n   * @param {string} json - Escaped JSON string\n   * @returns {string} JSON with basic syntax highlighting\n   */\n  syntaxHighlightJson(json) {\n    return json\n      .replace(/(\"([^\"\\\\]|\\\\.)*\")\\s*:/g, '<span style=\"color: #0969da;\">$1</span>:') // Keys (blue)\n      .replace(/:\\s*(\"([^\"\\\\]|\\\\.)*\")/g, ': <span style=\"color: #0a3069;\">$1</span>') // String values (dark blue)\n      .replace(/:\\s*(true|false)/g, ': <span style=\"color: #8250df;\">$1</span>') // Booleans (purple)\n      .replace(/:\\s*(null)/g, ': <span style=\"color: #656d76;\">$1</span>') // Null (gray)\n      .replace(/:\\s*(-?\\d+\\.?\\d*)/g, ': <span style=\"color: #0550ae;\">$1</span>'); // Numbers (blue)\n  }\n\n  /**\n   * Bind events including JSON interaction handlers\n   */\n  bindEvents() {\n    super.bindEvents();\n\n    if (!this.element) return;\n\n    // Add click handler for field interactions\n    this.element.addEventListener('click', (e) => {\n      const fieldElement = e.target.closest('[data-field]');\n      if (fieldElement) {\n        const fieldName = fieldElement.dataset.field;\n        const field = this.fields.find(f => f.name === fieldName);\n        this.emit('field:click', { field, fieldName, element: fieldElement, event: e });\n      }\n\n      // Handle JSON copy button clicks\n      if (e.target.closest('.json-copy')) {\n        e.preventDefault();\n        e.stopPropagation();\n        this.handleJsonCopy(e.target.closest('.json-copy'));\n      }\n\n      // Handle JSON toggle button clicks\n      if (e.target.closest('.json-toggle')) {\n        this.handleJsonToggle(e.target.closest('.json-toggle'));\n      }\n    });\n  }\n\n  /**\n   * Handle copying JSON to clipboard\n   * @param {HTMLElement} button - Copy button element\n   */\n  handleJsonCopy(button) {\n    const jsonData = button.getAttribute('data-json');\n    if (!jsonData) return;\n\n    try {\n      // Use modern clipboard API if available\n      if (navigator.clipboard && window.isSecureContext) {\n        navigator.clipboard.writeText(jsonData).then(() => {\n          this.showCopyFeedback(button);\n        });\n      } else {\n        // Fallback for older browsers\n        const textarea = document.createElement('textarea');\n        textarea.value = jsonData;\n        document.body.appendChild(textarea);\n        textarea.select();\n        document.execCommand('copy');\n        document.body.removeChild(textarea);\n        this.showCopyFeedback(button);\n      }\n    } catch (error) {\n      console.warn('Failed to copy JSON:', error);\n    }\n  }\n\n  /**\n   * Handle JSON toggle button state\n   * @param {HTMLElement} button - Toggle button element\n   */\n  handleJsonToggle(button) {\n    const icon = button.querySelector('i');\n    const isExpanded = button.getAttribute('aria-expanded') === 'true';\n\n    // Update button text and icon\n    setTimeout(() => {\n      if (isExpanded) {\n        icon.className = 'bi bi-eye-slash';\n        button.innerHTML = '<i class=\"bi bi-eye-slash\"></i> Hide';\n      } else {\n        icon.className = 'bi bi-eye';\n        button.innerHTML = '<i class=\"bi bi-eye\"></i> Show';\n      }\n    }, 10);\n  }\n\n  /**\n   * Show visual feedback for successful copy\n   * @param {HTMLElement} button - Copy button element\n   */\n  showCopyFeedback(button) {\n    const originalIcon = button.querySelector('i').className;\n    const icon = button.querySelector('i');\n\n    // Show success state\n    icon.className = 'bi bi-check text-success';\n    button.classList.add('btn-success');\n    button.classList.remove('btn-outline-secondary');\n\n    // Reset after 1 second\n    setTimeout(() => {\n      icon.className = originalIcon;\n      button.classList.remove('btn-success');\n      button.classList.add('btn-outline-secondary');\n    }, 1000);\n  }\n\n  /**\n   * Format complex objects as nested DataView\n   * @param {object} value - Object value to display as DataView\n   * @param {object} field - Field definition\n   * @returns {string} Formatted DataView HTML\n   */\n  formatAsDataView(value, field) {\n    if (!value || typeof value !== 'object') {\n      return `<span class=\"text-muted fst-italic\">No data available</span>`;\n    }\n\n    try {\n      // Create nested DataView instance\n      const nestedView = new (this.constructor)({\n        data: value,\n        columns: field.dataViewColumns || 2,\n        showEmptyValues: field.showEmptyValues ?? true,\n        emptyValueText: field.emptyValueText || 'Not set',\n        // Pass any other dataView-specific options from field config\n        ...(field.dataViewOptions || {})\n      });\n\n        nestedView.onInit();\n        nestedView.generateFieldsFromData();\n      // Generate the nested DataView HTML\n      const nestedHtml = nestedView.buildItemsHTML();\n\n      // Wrap in a styled container with optional label\n      // const labelHtml = field.label ?\n      //   `<h6 class=\"fw-semibold text-muted mb-3 border-bottom pb-2\">${this.escapeHtml(field.label)}</h6>` :\n      //   '';\n\n      return `\n        <div class=\"nested-dataview border rounded p-3 bg-light\">\n          <div class=\"${nestedView.dataViewOptions.rowClass}\">\n            ${nestedHtml}\n          </div>\n        </div>\n      `;\n    } catch (error) {\n      console.error('Error creating nested DataView:', error);\n      return `<span class=\"text-danger\">Error displaying nested data</span>`;\n    }\n  }\n\n  /**\n   * Update the data and re-render\n   * @param {object} newData - New data object\n   * @returns {Promise<DataView>} Promise resolving to this instance\n   */\n  async updateData(newData) {\n    this.data = newData;\n\n    // If model is provided, update it instead\n    if (this.model && typeof this.model.set === 'function') {\n      this.model.set(newData);\n    }\n\n    // Clear fields to trigger regeneration on next render\n    if (this.fields.length > 0 && !this.options.fields) {\n      this.fields = [];\n    }\n\n    await this.render();\n    this.emit('data:updated', { data: newData });\n    return this;\n  }\n\n  /**\n   * Update field configuration and re-render\n   * @param {array} newFields - New field configuration\n   * @returns {Promise<DataView>} Promise resolving to this instance\n   */\n  async updateFields(newFields) {\n    this.fields = newFields;\n    await this.render();\n    this.emit('fields:updated', { fields: newFields });\n    return this;\n  }\n\n  /**\n   * Update configuration and re-render\n   * @param {object} newOptions - New configuration options\n   * @returns {Promise<DataView>} Promise resolving to this instance\n   */\n  async updateConfig(newOptions) {\n    this.dataViewOptions = { ...this.dataViewOptions, ...newOptions };\n    await this.render();\n    this.emit('config:updated', { options: this.dataViewOptions });\n    return this;\n  }\n\n  /**\n   * Refresh data from model if available\n   * @returns {Promise<DataView>} Promise resolving to this instance\n   */\n  async refresh() {\n    if (this.model && typeof this.model.fetch === 'function') {\n      try {\n        await this.model.fetch();\n        this.emit('data:refreshed', { model: this.model });\n      } catch (error) {\n        this.emit('error', { error, message: 'Failed to refresh data' });\n        throw error;\n      }\n    }\n    return this;\n  }\n\n  /**\n   * Get current data\n   * @returns {object} Current data object\n   */\n  getCurrentData() {\n    return this.getData();\n  }\n\n  /**\n   * Get field definition by name\n   * @param {string} name - Field name\n   * @returns {object|null} Field definition\n   */\n  getField(name) {\n    return this.fields.find(field => field.name === name) || null;\n  }\n\n  /**\n   * Set custom format for a specific field\n   * @param {string} fieldName - Name of the field\n   * @param {string} format - Pipe format string (e.g., \"currency|uppercase\")\n   * @returns {DataView} This instance for chaining\n   */\n  setFieldFormat(fieldName, format) {\n    const field = this.getField(fieldName);\n    if (field) {\n      field.format = format;\n      field.formatter = format;  // Keep both in sync\n    } else {\n      // Create new field if it doesn't exist\n      this.fields.push({\n        name: fieldName,\n        label: this.formatLabel(fieldName),\n        type: this.inferFieldType(this.getData()[fieldName], fieldName),\n        format: format,\n        formatter: format  // Keep both in sync\n      });\n    }\n    return this;\n  }\n\n  /**\n   * Add additional formatter to existing field format pipe chain\n   * @param {string} fieldName - Name of the field\n   * @param {string} formatter - Formatter to add (e.g., \"uppercase\", \"truncate(50)\")\n   * @returns {DataView} This instance for chaining\n   */\n  addFormatPipe(fieldName, formatter) {\n    const field = this.getField(fieldName);\n    if (field) {\n      if (field.format) {\n        field.format += `|${formatter}`;\n        field.formatter = field.format;  // Keep both in sync\n      } else {\n        field.format = formatter;\n        field.formatter = formatter;  // Keep both in sync\n      }\n    }\n    return this;\n  }\n\n  /**\n   * Clear custom format for a field (revert to auto-inferred format)\n   * @param {string} fieldName - Name of the field\n   * @returns {DataView} This instance for chaining\n   */\n  clearFieldFormat(fieldName) {\n    const field = this.getField(fieldName);\n    if (field) {\n      const data = this.getData();\n      const inferred = this.inferFormatter(data[fieldName], fieldName, field.type);\n      field.format = inferred;\n      field.formatter = inferred;  // Keep both in sync\n    }\n    return this;\n  }\n\n  /**\n   * Get formatted value for a specific field without rendering\n   * @param {string} fieldName - Name of the field\n   * @param {*} value - Optional value to format (uses current data if not provided)\n   * @returns {*} Formatted value\n   */\n  getFormattedValue(fieldName, value = null) {\n    const field = this.getField(fieldName);\n    if (!field) return null;\n\n    const targetValue = value !== null ? value : this.getData()[fieldName];\n\n    // Support both 'format' and 'formatter' for consistency with TableView\n    const formatString = field.format || field.formatter;\n    if (formatString && targetValue != null) {\n      return dataFormatter.pipe(targetValue, formatString);\n    }\n\n    return targetValue;\n  }\n\n  /**\n   * Set multiple field formats at once\n   * @param {object} formats - Object mapping field names to format strings\n   * @returns {DataView} This instance for chaining\n   */\n  setFieldFormats(formats) {\n    Object.entries(formats).forEach(([fieldName, format]) => {\n      this.setFieldFormat(fieldName, format);\n    });\n    return this;\n  }\n\n  /**\n   * Get all current field formats as an object\n   * @returns {object} Object mapping field names to their current formats\n   */\n  getFieldFormats() {\n    const formats = {};\n    this.fields.forEach(field => {\n      const formatString = field.format || field.formatter;\n      if (formatString) {\n        formats[field.name] = formatString;\n      }\n    });\n    return formats;\n  }\n\n  /**\n   * Set up model event listeners if model is provided\n   */\n  onInit() {\n    super.onInit();\n\n    // Listen for model changes\n    if (this.model && typeof this.model.on === 'function') {\n      this.model.on('change', () => {\n        this.render();\n      });\n    }\n  }\n\n  /**\n   * Static factory method\n   * @param {object} options - DataView options\n   * @returns {DataView} New DataView instance\n   */\n  static create(options = {}) {\n    return new DataView(options);\n  }\n}\n\nexport default DataView;\n"],"names":["DataView","View","constructor","options","data","model","fields","columns","responsive","showEmptyValues","emptyValueText","viewOptions","super","tagName","className","this","dataViewOptions","rowClass","itemClass","labelClass","valueClass","onBeforeRender","length","getData","generateFieldsFromData","renderTemplate","items","buildItemsHTML","dataObj","Object","keys","map","key","value","fieldType","inferFieldType","formatter","inferFormatter","name","label","formatLabel","type","format","replace","l","toUpperCase","trim","keyLower","toLowerCase","includes","Array","isArray","renditions","shouldUseDataView","match","formatters","push","unshift","join","window","utils","isObject","id","some","pattern","k","attributes","getFieldValue","field","formatString","parts","split","slice","get","dataFormatter","pipe","template","modelData","renderTemplateString","templateString","dataKey","reduce","o","i","getColumnClasses","classes","getColumnSizeClasses","justify","colSize","cols","Math","floor","buildItemHTML","filter","Boolean","buildLabelHTML","buildValueHTML","escapeHtml","formatDisplayValue","String","rawValue","emailStr","urlStr","formatAsJson","formatAsDataView","phoneStr","jsonString","JSON","stringify","escapedJson","lines","isLarge","uniqueId","random","toString","substr","preview","substring","escapedPreview","syntaxHighlightJson","error","json","bindEvents","element","addEventListener","e","fieldElement","target","closest","fieldName","dataset","find","f","emit","event","preventDefault","stopPropagation","handleJsonCopy","handleJsonToggle","button","jsonData","getAttribute","navigator","clipboard","isSecureContext","writeText","then","showCopyFeedback","textarea","document","createElement","body","appendChild","select","execCommand","removeChild","console","warn","icon","querySelector","isExpanded","setTimeout","innerHTML","originalIcon","classList","add","remove","nestedView","dataViewColumns","onInit","nestedHtml","updateData","newData","set","render","updateFields","newFields","updateConfig","newOptions","refresh","fetch","message","getCurrentData","getField","setFieldFormat","addFormatPipe","clearFieldFormat","inferred","getFormattedValue","targetValue","setFieldFormats","formats","entries","forEach","getFieldFormats","on","create"],"mappings":"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"}

package/dist/chunks/{Dialog-DX5h2QA9.js → Dialog--hl_Uh6X.js}

@@ -1,2 +1,2 @@
-"use strict";const e=require("./Rest-DhD-U1vp.js");class Router{constructor(e={}){this.defaultRoute=e.defaultRoute||"home",this.routes=[],this.currentRoute=null,this.eventEmitter=e.eventEmitter||null,this.boundHandlePopState=this.handlePopState.bind(this)}start(){window.addEventListener("popstate",this.boundHandlePopState),this.handleCurrentLocation()}stop(){window.removeEventListener("popstate",this.boundHandlePopState)}addRoute(e,t){this.routes.push({pattern:this.normalizePattern(e),regex:this.patternToRegex(e),pageName:t,paramNames:this.extractParamNames(e)})}async navigate(e,t={}){const{replace:s=!1,state:i=null,trigger:o=!0}=t,{pageName:n,queryParams:r}=this.parseInput(e);o&&await this.handleRouteChange(n,r)}back(){window.history.back()}forward(){window.history.forward()}getCurrentRoute(){return this.currentRoute}getCurrentPath(){const{pageName:e,queryParams:t}=this.parseCurrentUrl();return this.buildPublicUrl(e,t)}handlePopState(e){this.allowPopState?this.handleCurrentLocation():console.warn("PopStateEvent is not allowed")}async handleCurrentLocation(){const{pageName:e,queryParams:t}=this.parseCurrentUrl();await this.handleRouteChange(e,t)}async handleRouteChange(e,t){const s="/"+e,i=this.matchRoute(s),o=this.buildPublicUrl(e,t);return i?(this.currentRoute=i,this.eventEmitter&&this.eventEmitter.emit("route:changed",{path:o,pageName:i.pageName,params:i.params,query:t,route:i}),i):(this.eventEmitter&&this.eventEmitter.emit("route:notfound",{path:o}),null)}matchRoute(e){for(const t of this.routes){const s=e.match(t.regex);if(s){const i={};return t.paramNames.forEach((e,t)=>{i[e]=s[t+1]}),{...t,params:i,path:e}}}return null}parseInput(e){let t=this.defaultRoute,s={};if(!e)return{pageName:t,queryParams:s};try{if(e.includes("?")){const[i,o]=e.split("?",2),n=new URLSearchParams(o);if(n.has("page")){t=n.get("page")||this.defaultRoute;for(const[e,t]of n)"page"!==e&&(s[e]=t)}else{t=i.startsWith("/")?i.substring(1)||this.defaultRoute:i||this.defaultRoute;for(const[e,t]of n)s[e]=t}}else t=e.startsWith("/")?e.substring(1)||this.defaultRoute:e}catch(i){console.warn("Failed to parse input:",e,i),t=this.defaultRoute,s={}}return{pageName:t,queryParams:s}}parseCurrentUrl(){const e=new URLSearchParams(window.location.search),t=e.get("page")||this.defaultRoute,s={};for(const[i,o]of e)"page"!==i&&(s[i]=o);return{pageName:t,queryParams:s}}buildPublicUrl(e,t={}){const s=new URLSearchParams;return s.set("page",e),Object.entries(t).forEach(([e,t])=>{null!=t&&""!==t&&s.set(e,String(t))}),"?"+s.toString()}updateBrowserUrl(e,t,s,i){const o=new URL(window.location.origin+window.location.pathname);o.searchParams.set("page",e),Object.entries(t).forEach(([e,t])=>{null!=t&&""!==t&&o.searchParams.set(e,String(t))});const n=o.toString();s?window.history.replaceState(i,"",n):window.history.pushState(i,"",n)}patternToRegex(e){let t=e.replace(/[-[\]{}()*+?.,\\^$|#\s]/g,"\\$&").replace(/\/:([^/?]+)\?/g,"(?:/([^/]+))?").replace(/:([^/]+)/g,"([^/]+)");return new RegExp(`^${t}$`)}extractParamNames(e){return(e.match(/:([^/?]+)\??/g)||[]).map(e=>e.replace(/[:?]/g,""))}normalizePattern(e){return e.startsWith("/")?e:`/${e}`}updateUrl(e={},t={}){const{replace:s=!1}=t,{pageName:i}=this.parseCurrentUrl();this.updateBrowserUrl(i,e,s)}buildUrl(e,t={}){return this.buildPublicUrl(e,t)}doRoutesMatch(e,t){if(!e||!t)return!1;const{pageName:s}=this.parseInput(e),{pageName:i}=this.parseInput(t);return s===i}}class EventBus{constructor(){this.listeners={},this.onceListeners={},this.maxListeners=100,this.debugMode=!1,this.eventStats={}}on(e,t){if("function"!=typeof t)throw new Error("Callback must be a function");return Array.isArray(e)?(e.forEach(e=>this.on(e,t)),this):(this.listeners[e]||(this.listeners[e]=[]),this.listeners[e].length>=this.maxListeners&&console.warn(`Max listeners (${this.maxListeners}) exceeded for event: ${e}`),this.listeners[e].push(t),this)}once(e,t){if("function"!=typeof t)throw new Error("Callback must be a function");return Array.isArray(e)?(e.forEach(e=>this.once(e,t)),this):(this.onceListeners[e]||(this.onceListeners[e]=[]),this.onceListeners[e].push(t),this)}off(e,t){if(Array.isArray(e))return e.forEach(e=>this.off(e,t)),this;if(!t)return delete this.listeners[e],delete this.onceListeners[e],this;if(this.listeners[e]){const s=this.listeners[e].indexOf(t);-1!==s&&(this.listeners[e].splice(s,1),0===this.listeners[e].length&&delete this.listeners[e])}if(this.onceListeners[e]){const s=this.onceListeners[e].indexOf(t);-1!==s&&(this.onceListeners[e].splice(s,1),0===this.onceListeners[e].length&&delete this.onceListeners[e])}return this}emit(e,t){this.updateEventStats(e),this.debugMode;const s=[];return this.listeners[e]&&s.push(...this.listeners[e]),this.listeners["*"]&&s.push(...this.listeners["*"]),this.onceListeners[e]&&(s.push(...this.onceListeners[e]),delete this.onceListeners[e]),this.onceListeners["*"]&&(s.push(...this.onceListeners["*"]),delete this.onceListeners["*"]),this.debugMode&&s.length>0&&s.length,s.forEach(s=>{try{s(t,e)&&(e.stopPropagation&&e.stopPropagation(),e.preventDefault&&e.preventDefault())}catch(i){console.error(`Error in event listener for '${e}':`,i),this.emitError(i,e,s)}}),this}async emitAsync(e,t){const s=[];this.listeners[e]&&s.push(...this.listeners[e]),this.listeners["*"]&&s.push(...this.listeners["*"]),this.onceListeners[e]&&(s.push(...this.onceListeners[e]),delete this.onceListeners[e]),this.onceListeners["*"]&&(s.push(...this.onceListeners["*"]),delete this.onceListeners["*"]);const i=s.map(s=>new Promise(i=>{try{i(s(t,e))}catch(o){console.error(`Error in async event listener for '${e}':`,o),this.emitError(o,e,s),i()}}));return await Promise.all(i),this}removeAllListeners(){return this.listeners={},this.onceListeners={},this}listenerCount(e){return(this.listeners[e]?this.listeners[e].length:0)+(this.onceListeners[e]?this.onceListeners[e].length:0)}eventNames(){const e=Object.keys(this.listeners),t=Object.keys(this.onceListeners);return[.../* @__PURE__ */new Set([...e,...t])]}setMaxListeners(e){if("number"!=typeof e||e<0)throw new Error("Max listeners must be a non-negative number");return this.maxListeners=e,this}namespace(e){const t=t=>`${e}:${t}`;return{on:(e,s)=>this.on(t(e),s),once:(e,s)=>this.once(t(e),s),off:(e,s)=>this.off(t(e),s),emit:(e,s)=>this.emit(t(e),s),emitAsync:(e,s)=>this.emitAsync(t(e),s)}}use(e){if("function"!=typeof e)throw new Error("Middleware must be a function");const t=this.emit;return this.emit=(s,i)=>{try{const o=e(s,i);if(!1===o)return this;const n=void 0!==o?o:i;return t.call(this,s,n)}catch(o){return console.error("Error in event middleware:",o),t.call(this,s,i)}},this}emitError(e,t,s){"error"!==t&&setTimeout(()=>{this.emit("error",{error:e,originalEvent:t,callback:s.toString()})},0)}waitFor(e,t=null){return new Promise((s,i)=>{let o=null;const n=e=>{o&&clearTimeout(o),s(e)};this.once(e,n),t&&(o=setTimeout(()=>{this.off(e,n),i(new Error(`Timeout waiting for event: ${e}`))},t))})}debug(e=!0){return this.debugMode=e,this}getStats(){const e=this.eventNames(),t={totalEvents:e.length,totalListeners:0,events:{},emissions:{...this.eventStats}};return e.forEach(e=>{const s=this.listenerCount(e);t.events[e]=s,t.totalListeners+=s}),t}updateEventStats(e){this.eventStats[e]||(this.eventStats[e]={count:0,firstEmission:Date.now(),lastEmission:null}),this.eventStats[e].count++,this.eventStats[e].lastEmission=Date.now()}getEventStats(e){const t=this.eventStats[e];return t?{...t,listenerCount:this.listenerCount(e),avgEmissionsPerMinute:this.calculateEmissionRate(t)}:null}calculateEmissionRate(e){if(!e.firstEmission||!e.lastEmission)return 0;const t=e.lastEmission-e.firstEmission;if(0===t)return 0;const s=t/6e4;return Math.round(e.count/s*100)/100}resetStats(){return this.eventStats={},this}getTopEvents(e=10){return Object.entries(this.eventStats).map(([e,t])=>({event:e,count:t.count,rate:this.calculateEmissionRate(t),listeners:this.listenerCount(e)})).sort((e,t)=>t.count-e.count).slice(0,e)}debugInfo(){this.debugMode,this.maxListeners;const e=this.getStats();return e.totalEvents,e.totalListeners,Object.keys(this.eventStats).length>0&&this.getTopEvents(5),this}}class WebApp{constructor(t={}){this.config=t,this.initPluginRegistry(),this.name=t.name||"MOJO App",this.version=t.version||"1.0.0",this.debug=t.debug||!1,this.container=t.container||"#app",this.layoutType=t.layout||"portal",this.layoutConfig=t.layoutConfig||{},t.sidebar&&(this.layoutConfig.sidebarConfig=t.sidebar),t.topbar&&(this.layoutConfig.topbarConfig=t.topbar),this.layout=null,this.layoutConfig.containerId=this.container||this.containerId||"#app",this.pageContainer=t.pageContainer||"#page-container",this.basePath=t.basePath||"",this.routerMode=t.routerMode||t.router?.mode||"param",this.basePath=t.basePath||t.router?.base||"",this.defaultRoute=t.defaultRoute||"home",this.session=t.session||{},this.router=null,this.navigation=t.navigation||{},this.state={currentPage:null,previousPage:null,loading:!1},this.events=new EventBus,this.rest=e.rest,t.api&&this.rest.configure(t.api),this.router=new Router({mode:"param"===this.routerMode?"params":this.routerMode,basePath:this.basePath,defaultRoute:this.defaultRoute,eventEmitter:this.events}),this.events.on("route:changed",async e=>{const{pageName:t,params:s,query:i}=e;await this.showPage(t,i,s,{fromRouter:!0})}),"undefined"!=typeof window&&(window.MOJO=window.MOJO||{},window.MOJO.router=this.router),this.setupFocusTracking(),this.pageCache=/* @__PURE__ */new Map,this.pageClasses=/* @__PURE__ */new Map,this.componentClasses=/* @__PURE__ */new Map,this.modelClasses=/* @__PURE__ */new Map,this.currentPage=null,this.isStarted=!1,window.matchUUID?window[window.matchUUID]=this:window.MOJO?window.MOJO.app=this:window.__app__=this}async start(){if(this.isStarted)console.warn("WebApp already started");else try{this.setupPageContainer(),this.validateDefaultRoute(),await this.setupRouter(),this.isStarted=!0,this.router.allowPopState=!1,this.events.emit("app:ready",{app:this})}catch(e){throw console.error(`Failed to start ${this.name}:`,e),this.showError("Failed to start application"),e}}async setupRouter(){this.router?(this.events.on("route:notfound",async e=>{console.warn(`Route not found: ${e.path}`),this._show404(e.path)}),this.router.start(),this.routerMode):console.error("Router not initialized")}setupPageContainer(){const e="string"==typeof this.container?document.querySelector(this.container):this.container;e&&!e.querySelector("#page-container")&&(e.innerHTML='<div id="page-container"></div>'),this.pageContainer="#page-container"}registerPage(e,t,s={}){if("string"!=typeof e||!e)return console.error("registerPage: pageName must be a non-empty string"),this;if("function"!=typeof t)return console.error("registerPage: PageClass must be a constructor function"),this;if(s.containerId||(s.containerId=this.pageContainer),this.pageClasses.set(e,{PageClass:t,constructorOptions:s}),this.router){let t=s.route||`/${e}`;t.startsWith("/")||(t=`/${t}`),s.route=t,this.router.addRoute(t,e)}return this}getPage(e){return this.pageCache.get(e)}getPagePermissions(e){if(this.pageCache.has(e))return this.pageCache.get(e).permissions;const t=this.pageClasses.get(e);if(!t)return null;const{PageClass:s,constructorOptions:i}=t;return i?i.permissions:null}getOrCreatePage(e){if(this.pageCache.has(e))return this.pageCache.get(e);const t=this.pageClasses.get(e);if(!t)return console.error(`Page not registered: ${e}`),null;const{PageClass:s,constructorOptions:i}=t;try{const t=new s({pageName:e,...i,app:this});return i.route&&(t.route=i.route),this.pageCache.set(e,t),t.route,t}catch(o){return console.error(`Failed to create page ${e}:`,o),null}}async showPage(e,t={},s={},i={}){const{fromRouter:o=!1,replace:n=!1,force:r=!1}=i;try{let i,n;"string"==typeof e?(n=e,i=this.getOrCreatePage(e)):e&&"object"==typeof e&&(i=e,n=e.pageName),this.events.emit("page:showing",{page:i,pageName:i.pageName,params:s,query:t,fromRouter:o});const r=this.currentPage;if(!i)return void this._show404(n,s,t,o);if(!i.canEnter())return void this._showDeniedPage(i,s,t,o);r&&r!==i&&await this._exitOldPage(r),await i.onParams(s,t),r!==i&&await i.onEnter(),i.syncUrl(),this.events.emit("page:show",{page:i,pageName:i.pageName,params:s,query:t,fromRouter:o}),await i.render(),this.currentPage=i,i.pageName}catch(a){console.error("Error in showPage:",a),this.showError(`Failed to load page: ${a.message}`),"error"!==e&&await this.showPage("error",{},{error:a,originalPage:e},{fromRouter:o})}}async _show404(e,t,s,i){const o=this.getOrCreatePage("404");o&&(o.setInfo&&o.setInfo(e),await this._exitOldPage(this.currentPage),await o.render(),this.currentPage=o,this.events.emit("page:404",{page:null,pageName:e,params:t,query:s,fromRouter:i}))}async _showDeniedPage(e,t,s,i){const o=this.getOrCreatePage("denied");o.setDeniedPage&&o.setDeniedPage(e),await this._exitOldPage(this.currentPage),await o.render(),this.currentPage=o,this.events.emit("page:denied",{page:e,pageName:e.pageName,params:t,query:s,fromRouter:i})}async _exitOldPage(e){if(e)try{await e.onExit(),await e.unmount(),this.events.emit("page:hide",{page:e})}catch(t){console.error(`Error exiting page ${e.pageName}:`,t)}}async navigate(e,t={},s={}){if(!this.router)return void console.error("Router not initialized");let i=e;if(Object.keys(t).length>0){const s=new URLSearchParams(t).toString();i+=(e.includes("?")?"&":"?")+s}return await this.router.navigate(i,s)}async navigateToDefault(e={}){return await this.showPage(this.defaultRoute,{},{},e)}back(){this.router?this.router.back():console.warn("Router not initialized")}forward(){this.router?this.router.forward():console.warn("Router not initialized")}getCurrentPage(){return this.currentPage}getPageContainer(){return this.layout&&this.layout.getPageContainer?this.layout.getPageContainer():"string"==typeof this.pageContainer?document.querySelector(this.pageContainer):this.pageContainer}async showError(e){try{const s=(await Promise.resolve().then(()=>t)).default;await s.alert(e,"Error",{size:"md",class:"text-danger"})}catch(s){this.events.emit("notification",{message:e,type:"error"}),"undefined"!=typeof window&&window?.console&&console.error("[WebApp] showError fallback:",s),"undefined"!=typeof window&&alert(`Error: ${e}`)}}async showSuccess(e){try{const s=(await Promise.resolve().then(()=>t)).default;await s.alert(e,"Success",{size:"md",class:"text-success"})}catch(s){this.events.emit("notification",{message:e,type:"success"}),"undefined"!=typeof window&&window?.console&&console.warn("[WebApp] showSuccess fallback:",s),"undefined"!=typeof window&&alert(`Success: ${e}`)}}async showInfo(e){try{const s=(await Promise.resolve().then(()=>t)).default;await s.alert(e,"Information",{size:"md",class:"text-info"})}catch(s){this.events.emit("notification",{message:e,type:"info"}),"undefined"!=typeof window&&window,"undefined"!=typeof window&&alert(`Info: ${e}`)}}async showWarning(e){try{const s=(await Promise.resolve().then(()=>t)).default;await s.alert(e,"Warning",{size:"md",class:"text-warning"})}catch(s){this.events.emit("notification",{message:e,type:"warning"}),"undefined"!=typeof window&&window?.console&&console.warn("[WebApp] showWarning fallback:",s),"undefined"!=typeof window&&alert(`Warning: ${e}`)}}showNotification(e,t="info"){this.events.emit("notification",{message:e,type:t})}async showLoading(e={}){"string"==typeof e&&(e={message:e});try{(await Promise.resolve().then(()=>t)).default.showBusy(e)}catch(s){"undefined"!=typeof window&&window?.console&&console.warn("[WebApp] showLoading fallback:",s,e),this.events.emit("notification",{message:e.message||"Loading...",type:"info"})}}async hideLoading(){try{(await Promise.resolve().then(()=>t)).default.hideBusy()}catch(e){"undefined"!=typeof window&&window?.console&&console.warn("[WebApp] hideLoading fallback:",e)}}async showModelForm(e={}){try{const s=(await Promise.resolve().then(()=>t)).default;return await s.showModelForm(e)}catch(s){throw"undefined"!=typeof window&&window?.console&&console.error("[WebApp] showModelForm failed:",s),s}}async showForm(e={}){try{const s=(await Promise.resolve().then(()=>t)).default;return await s.showForm(e)}catch(s){throw"undefined"!=typeof window&&window?.console&&console.error("[WebApp] showForm failed:",s),s}}async showDialog(e={}){try{const s=(await Promise.resolve().then(()=>t)).default;return await s.showDialog(e)}catch(s){throw"undefined"!=typeof window&&window?.console&&console.error("[WebApp] showDialog failed:",s),s}}async confirm(e,s="Confirm",i={}){const o=(await Promise.resolve().then(()=>t)).default;return await o.confirm(e,s,i)}setupFocusTracking(){if("undefined"==typeof window)return;this.isFocused=!document.hidden;const e=()=>{const e=this.isFocused;this.isFocused=!document.hidden,e!==this.isFocused&&(this.isFocused?this.events.emit("browser:focus"):this.events.emit("browser:blur"))},t=()=>{this.isFocused||(this.isFocused=!0,this.events.emit("browser:focus"))},s=()=>{this.isFocused&&(this.isFocused=!1,this.events.emit("browser:blur"))};document.addEventListener("visibilitychange",e),window.addEventListener("focus",t),window.addEventListener("blur",s),this._focusHandlers={visibilitychange:e,focus:t,blur:s}}setupErrorHandling(){window.addEventListener("error",e=>{console.error("Global error:",e.error),this.debug&&this.showError(`Error: ${e.error?.message||"Unknown error"}`)}),window.addEventListener("unhandledrejection",e=>{console.error("Unhandled promise rejection:",e.reason),this.debug&&this.showError(`Promise rejected: ${e.reason?.message||"Unknown error"}`)})}escapeHtml(e){return e.replace(/&/g,"&amp;").replace(/</g,"&lt;").replace(/>/g,"&gt;").replace(/"/g,"&quot;").replace(/'/g,"&#039;")}getState(e){return e?this.state[e]:this.state}setState(e){const t={...this.state};Object.assign(this.state,e),this.events.emit("state:changed",{oldState:t,newState:this.state,updates:e})}registerComponent(e,t){this.componentClasses.set(e,t)}getComponent(e){return this.componentClasses.get(e)}registerModel(e,t){this.modelClasses.set(e,t)}getModel(e){return this.modelClasses.get(e)}setupRest(){this.rest=e.rest,e.rest.configure(this.api)}async destroy(){this.router&&this.router.stop(),this._focusHandlers&&"undefined"!=typeof window&&(document.removeEventListener("visibilitychange",this._focusHandlers.visibilitychange),window.removeEventListener("focus",this._focusHandlers.focus),window.removeEventListener("blur",this._focusHandlers.blur));const e=Array.from(this.pageCache.values());if(await Promise.allSettled(e.map(async e=>{try{e.destroy&&await e.destroy()}catch(t){console.error("Error destroying page:",t)}})),this.layout&&this.layout.destroy)try{await this.layout.destroy()}catch(t){console.error("Error destroying layout:",t)}this.pageCache.clear(),this.pageClasses.clear(),this.componentClasses.clear(),this.modelClasses.clear(),"undefined"!=typeof window&&window.MOJO&&delete window.MOJO.router,this.isStarted=!1,this.name}buildPagePath(e,t,s){let i=e.route||`/${e.pageName.toLowerCase()}`;if(Object.keys(t).forEach(e=>{"string"!=typeof t[e]&&"number"!=typeof t[e]||(i=i.replace(`:${e}`,t[e]))}),s&&Object.keys(s).length>0){const e=new URLSearchParams(s).toString();i+=(i.includes("?")?"&":"?")+e}return i}validateDefaultRoute(){this.pageClasses.has(this.defaultRoute)?this.defaultRoute:(console.warn(`⚠️  Default route '${this.defaultRoute}' is not registered!`),console.warn(`   Please register a page: app.registerPage('${this.defaultRoute}', YourPageClass);`),console.warn("   Or change default route: new WebApp({ defaultRoute: 'your-page' });"))}findFallbackPage(){const e=["404","error","denied"];for(const[t]of this.pageClasses.entries())if(!e.includes(t))return t;return null}static create(e={}){return new WebApp(e)}initPluginRegistry(){"undefined"!=typeof window&&(window.MOJO||(window.MOJO={}),window.MOJO.plugins||(window.MOJO.plugins={}),window.MOJO.app=this)}static registerPlugin(e,t){"undefined"!=typeof window&&(window.MOJO||(window.MOJO={}),window.MOJO.plugins||(window.MOJO.plugins={}),window.MOJO.plugins[e]=t)}}class Dialog extends e.View{static _openDialogs=[];static _baseZIndex={backdrop:1050,modal:1055};static getFullscreenAwareZIndex(){return document.querySelector(".table-fullscreen")?{backdrop:10040,modal:10050}:this._baseZIndex}static _busyIndicator=null;static _busyCounter=0;static _busyTimeout=null;static fixAllBackdropStacking(){const e=document.querySelectorAll(".modal-backdrop"),t=Dialog._openDialogs;if(0===e.length||0===t.length)return;const s=[...t].sort((e,t)=>(e._dialogZIndex||0)-(t._dialogZIndex||0));e.forEach((e,t)=>{if(t<s.length){const i=s[t]._dialogZIndex-5;e.style.zIndex=i;const o=document.querySelector(".table-fullscreen")||document.body;e.parentNode!==o&&o.appendChild(e)}})}static updateAllBackdropStacking(){Dialog.fixAllBackdropStacking()}static showBusy(e={}){const{timeout:t=3e4,message:s="Loading..."}=e;if(this._busyCounter++,1===this._busyCounter){if(this._busyTimeout&&clearTimeout(this._busyTimeout),!this._busyIndicator){const e=this.getFullscreenAwareZIndex().modal+1e3;this._busyIndicator=document.createElement("div"),this._busyIndicator.className="mojo-busy-indicator",this._busyIndicator.innerHTML=`\n                  <div class="mojo-busy-spinner">\n                      <div class="spinner-border text-light" role="status">\n                          <span class="visually-hidden">Loading...</span>\n                      </div>\n                      <p class="mojo-busy-message mt-3 text-light">${s}</p>\n                  </div>\n                  <style>\n                      .mojo-busy-indicator {\n                          position: fixed; top: 0; left: 0; width: 100vw; height: 100vh;\n                          background-color: rgba(0, 0, 0, 0.5); z-index: ${e};\n                          display: flex; align-items: center; justify-content: center;\n                          opacity: 0; transition: opacity 0.15s linear;\n                      }\n                      .mojo-busy-indicator.show { opacity: 1; }\n                      .mojo-busy-spinner .spinner-border { width: 3rem; height: 3rem; }\n                  </style>\n              `,document.body.appendChild(this._busyIndicator)}const e=this._busyIndicator.querySelector(".mojo-busy-message");e&&(e.textContent=s),setTimeout(()=>this._busyIndicator.classList.add("show"),10),this._busyTimeout=setTimeout(()=>{console.error("Busy indicator timed out."),this.hideBusy(!0),this.alert({title:"Operation Timed Out",message:"The operation took too long. Please check your connection and try again.",type:"danger"})},t)}}static hideBusy(e=!1){e?this._busyCounter=0:this._busyCounter--,this._busyCounter<=0&&(this._busyCounter=0,this._busyTimeout&&(clearTimeout(this._busyTimeout),this._busyTimeout=null),this._busyIndicator&&(this._busyIndicator.classList.remove("show"),setTimeout(()=>{this._busyIndicator&&0===this._busyCounter&&(this._busyIndicator.remove(),this._busyIndicator=null)},150)))}constructor(e={}){const t=e.id||`modal-${Date.now()}`;super({...e,id:t,tagName:"div",className:`modal ${!1!==e.fade?"fade":""} ${e.className||""}`,attributes:{tabindex:"-1","aria-hidden":"true","aria-labelledby":e.labelledBy||`${t}-label`,"aria-describedby":e.describedBy||null,...e.attributes}}),this.modalId=t,this.title=e.title||"",this.titleId=`${this.modalId}-label`,this.size=e.size||"",this.centered=void 0!==e.centered&&e.centered,this.scrollable=void 0!==e.scrollable&&e.scrollable,this.autoSize=e.autoSize||"auto"===e.size,this.backdrop=void 0===e.backdrop||e.backdrop,this.keyboard=void 0===e.keyboard||e.keyboard,this.focus=void 0===e.focus||e.focus,this.header=void 0===e.header||e.header,this.headerContent=e.headerContent||null,this.closeButton=void 0===e.closeButton||e.closeButton,this.contextMenu=e.contextMenu||null,this.body=e.body||e.content||"",this.bodyView=null,this.bodyClass=e.bodyClass||"",this.noBodyPadding=e.noBodyPadding||!1,this.minWidth=e.minWidth||300,this.minHeight=e.minHeight||200,e.maxHeight&&(this.maxHeight=e.maxHeight),this.maxWidthPercent=e.maxWidthPercent||.9,this.maxHeightPercent=e.maxHeightPercent||.8,this._processBodyContent(this.body),this.footer=e.footer||null,this.footerView=null,this.footerClass=e.footerClass||"",this._processFooterContent(this.footer),this.buttons=e.buttons||null,this.onShow=e.onShow||null,this.onShown=e.onShown||null,this.onHide=e.onHide||null,this.onHidden=e.onHidden||null,this.onHidePrevented=e.onHidePrevented||null,this.autoShow=void 0!==e.autoShow&&e.autoShow,this.modal=null,this.relatedTarget=e.relatedTarget||null}_processBodyContent(t){if(t&&t.render)this.bodyView=t,this.body="",this.addChild(this.bodyView);else if("function"==typeof t)try{const s=t();s instanceof e.View?(this.bodyView=s,this.body="",this.addChild(this.bodyView)):s instanceof Promise?(this.bodyPromise=s,this.body='<div class="text-center"><div class="spinner-border spinner-border-sm"></div></div>'):this.body=s}catch(s){console.error("Error processing body function:",s),this.body=t}else this.body=t}_processFooterContent(t){if(t instanceof e.View)this.footerView=t,this.footer=null,this.addChild(this.footerView);else if("function"==typeof t)try{const s=t();s instanceof e.View?(this.footerView=s,this.footer=null,this.addChild(this.footerView)):s instanceof Promise?(this.footerPromise=s,this.footer='<div class="text-center"><div class="spinner-border spinner-border-sm"></div></div>'):this.footer=s}catch(s){console.error("Error processing footer function:",s),this.footer=t}else this.footer=t}async getTemplate(){const e=["modal-dialog"];return this.size&&"auto"!==this.size&&(this.size.startsWith("fullscreen")?e.push(`modal-${this.size}`):["sm","lg","xl","xxl"].includes(this.size)&&(e.push(`modal-${this.size}`),["lg","xl","xxl"].includes(this.size)&&e.push("modal-fullscreen-sm-down"))),this.centered&&e.push("modal-dialog-centered"),this.scrollable&&(this.maxHeight?e.push("overflow-hidden"):e.push("modal-dialog-scrollable")),`\n      <div class="${e.join(" ")}">\n        <div class="modal-content">\n          ${await this.buildHeader()}\n          ${await this.buildBody()}\n          ${await this.buildFooter()}\n        </div>\n      </div>\n    `}async buildHeader(){if(!this.header)return"";if(this.headerContent)return`<div class="modal-header">${this.headerContent}</div>`;let e="";return this.contextMenu&&this.contextMenu.items&&this.contextMenu.items.length>0?e=await this.buildContextMenu():this.closeButton&&(e='<button type="button" class="btn-close" data-bs-dismiss="modal" aria-label="Close"></button>'),`\n      <div class="modal-header">\n        ${this.title?`<h5 class="modal-title" id="${this.titleId}">${this.title}</h5>`:""}\n        ${e}\n      </div>\n    `}async buildContextMenu(){const e=await this.filterContextMenuItems();if(0===e.length)return this.closeButton?'<button type="button" class="btn-close" data-bs-dismiss="modal" aria-label="Close"></button>':"";const t=this.contextMenu.icon||"bi-three-dots-vertical";return`\n      <div class="dropdown">\n        <button class="${this.contextMenu.buttonClass||"btn btn-link p-1 mojo-modal-context-menu-btn"}" type="button" data-bs-toggle="dropdown" aria-expanded="false">\n          <i class="${t}"></i>\n        </button>\n        <ul class="dropdown-menu dropdown-menu-end">\n          ${e.map(e=>{if("divider"===e.type)return'<li><hr class="dropdown-divider"></li>';const t=e.icon?`<i class="${e.icon} me-2"></i>`:"",s=e.label||"";if(e.href)return`<li><a class="dropdown-item" href="${e.href}"${e.target?` target="${e.target}"`:""}>${t}${s}</a></li>`;if(e.action){const i=Object.keys(e).filter(e=>e.startsWith("data-")).map(t=>`${t}="${e[t]}"`).join(" ");return`<li><a class="dropdown-item" data-action="${e.action}" ${i}>${t}${s}</a></li>`}return""}).join("")}\n        </ul>\n      </div>\n    `}async filterContextMenuItems(){if(!this.contextMenu||!this.contextMenu.items)return[];const e=[];for(const i of this.contextMenu.items)if("divider"!==i.type){if(i.permissions)try{const e=this.getApp?.();let s=null;if(e&&(s=e.activeUser||e.getState?.("activeUser")),!s&&"undefined"!=typeof window&&window.getApp)try{const e=window.getApp();s=e?.activeUser}catch(t){}if(!s||!s.hasPermission)continue;if(!s.hasPermission(i.permissions))continue}catch(s){console.warn("Error checking permissions for context menu item:",s);continue}e.push(i)}else e.push(i);return e}async buildBody(){return this.bodyView?(this.bodyView.replaceById=!0,`<div class="${this.noBodyPadding?`modal-body p-0 ${this.bodyClass}`:`modal-body ${this.bodyClass}`}" data-view-container="body">\n        \x3c!-- View will be mounted here --\x3e\n        <div id="${this.bodyView.id}"></div>\n      </div>`):this.body||""===this.body?`\n      <div class="${this.noBodyPadding?`modal-body p-0 ${this.bodyClass}`:`modal-body ${this.bodyClass}`}">\n        ${this.body}\n      </div>\n    `:""}async buildFooter(){if(this.footerView)return`<div class="modal-footer ${this.footerClass}" data-view-container="footer"></div>`;if(null!==this.footer&&"string"==typeof this.footer)return`<div class="modal-footer ${this.footerClass}">${this.footer}</div>`;if(this.buttons&&this.buttons.length>0){const e=this.buttons.map(e=>{const t=e.dismiss?'data-bs-dismiss="modal"':"",s=e.action?`data-action="${e.action}"`:"",i=e.id?`id="${e.id}"`:"",o=e.disabled?"disabled":"";return`\n          <button type="${e.type||"button"}"\n                  class="btn ${e.class||"btn-secondary"}"\n                  ${i}\n                  ${t}\n                  ${s}\n                  ${o}>\n            ${e.icon?`<i class="bi ${e.icon} me-1"></i>`:""}\n            ${e.text||"Button"}\n          </button>\n        `}).join("");return`<div class="modal-footer ${this.footerClass}">${e}</div>`}return""}async mount(e=null){if(!this.mounted&&!this.destroyed){if(!this.element)throw new Error("Cannot mount dialog without element");return await this.onBeforeMount(),(document.querySelector(".table-fullscreen")||document.body).appendChild(this.element),this.bindEvents(),this.mounted=!0,await this.onAfterMount(),this.emit("mounted",{view:this}),this}}async onAfterRender(){if(await super.onAfterRender(),window.Prism&&this.element&&this.element.querySelectorAll("pre code").length>0&&window.Prism.highlightAllUnder(this.element),this.autoSize)this.setupAutoSizing();else if(this.maxHeight){const e=this.element.querySelector(".modal-body");e&&(e.style.maxHeight=`${this.maxHeight}px`)}}async onAfterMount(){await super.onAfterMount(),"undefined"!=typeof window&&window.bootstrap&&window.bootstrap.Modal&&("static"===this.backdrop&&this.element.setAttribute("data-bs-backdrop","static"),this.keyboard||this.element.setAttribute("data-bs-keyboard","false"),this.modal=new window.bootstrap.Modal(this.element,{backdrop:this.backdrop,keyboard:this.keyboard,focus:this.focus}),this.bindBootstrapEvents(),this.autoShow&&this.show(this.relatedTarget))}setupAutoSizing(){this.element&&(this.element.addEventListener("shown.bs.modal",()=>{this.applyAutoSizing()},{once:!0}),setTimeout(()=>{this.isShown()&&this.applyAutoSizing()},100))}applyAutoSizing(){if(this.element)try{const e=this.element.querySelector(".modal-dialog"),t=this.element.querySelector(".modal-content"),s=this.element.querySelector(".modal-body");if(!e||!t||!s)return void console.warn("Dialog auto-sizing: Required elements not found");if(this.bodyView&&!this.bodyView.element)return void setTimeout(()=>this.applyAutoSizing(),50);const i={dialogMaxWidth:e.style.maxWidth,dialogWidth:e.style.width,contentWidth:t.style.width,contentMaxHeight:t.style.maxHeight,hadScrollableClass:e.classList.contains("modal-dialog-scrollable")};e.style.maxWidth="none",e.style.width="auto",t.style.width="auto",t.style.maxHeight="none",t.offsetHeight;const o=t.getBoundingClientRect(),n=40,r=Math.min(window.innerWidth*this.maxWidthPercent,window.innerWidth-n);let a=Math.min(window.innerHeight*this.maxHeightPercent,window.innerHeight-n),l=Math.max(this.minWidth,Math.ceil(o.width+20)),d=Math.max(this.minHeight,Math.ceil(o.height));this.maxHeight&&(a=Math.min(this.maxHeight,a),e.style.maxHeight=`${a}px`),l=Math.min(l,r);const c=o.height>a;e.style.maxWidth=`${l}px`,e.style.width=`${l}px`,c&&(e.classList.contains("modal-dialog-scrollable")||e.classList.add("modal-dialog-scrollable"),t.style.maxHeight=`${a}px`,d=a),this.autoSizedWidth=l,this.autoSizedHeight=d,this._originalStyles=i}catch(e){console.error("Error in dialog auto-sizing:",e),this.element.querySelector(".modal-dialog").style.maxWidth=""}}resetAutoSizing(){if(this.autoSize&&this._originalStyles&&this.element)try{const e=this.element.querySelector(".modal-dialog"),t=this.element.querySelector(".modal-content"),s=this.element.querySelector(".modal-body");e&&t&&s&&(e.style.maxWidth=this._originalStyles.dialogMaxWidth||"",e.style.width=this._originalStyles.dialogWidth||"",t.style.width=this._originalStyles.contentWidth||"",t.style.maxHeight=this._originalStyles.contentMaxHeight||"",!this._originalStyles.hadScrollableClass&&e.classList.contains("modal-dialog-scrollable")&&e.classList.remove("modal-dialog-scrollable"),delete this.autoSizedWidth,delete this.autoSizedHeight,delete this._originalStyles)}catch(e){console.error("Error resetting dialog auto-sizing:",e)}}bindBootstrapEvents(){this.element.addEventListener("show.bs.modal",e=>{const t=Dialog._openDialogs.length,s=Dialog.getFullscreenAwareZIndex().modal+20*t;this.element.style.zIndex=s,this._dialogZIndex=s,this._backdropZIndex=s-10,Dialog._openDialogs.push(this),this.onShow&&this.onShow(e),this.emit("show",{dialog:this,relatedTarget:e.relatedTarget})}),this.element.addEventListener("shown.bs.modal",e=>{if(setTimeout(()=>{Dialog.fixAllBackdropStacking()},50),this.onShown&&this.onShown(e),this.emit("shown",{dialog:this,relatedTarget:e.relatedTarget}),this.focus){const e=this.element.querySelector('input:not([type="hidden"]), textarea, select');e&&e.focus()}}),this.element.addEventListener("hide.bs.modal",e=>{const t=this.element.querySelector(":focus");t&&t.blur(),this.onHide&&!1===this.onHide(e)?e.preventDefault():this.emit("hide",{dialog:this})}),this.element.addEventListener("hidden.bs.modal",e=>{const t=Dialog._openDialogs.indexOf(this);t>-1&&Dialog._openDialogs.splice(t,1),Dialog._openDialogs.length>0&&(document.body.classList.add("modal-open"),setTimeout(()=>{Dialog.fixAllBackdropStacking()},50)),this.previousFocus&&document.body.contains(this.previousFocus)&&this.previousFocus.focus(),this.onHidden&&this.onHidden(e),this.emit("hidden",{dialog:this})}),this.element.addEventListener("hidePrevented.bs.modal",e=>{this.onHidePrevented&&this.onHidePrevented(e),this.emit("hidePrevented",{dialog:this})})}show(e=null){this.previousFocus=document.activeElement,window.lastDialog=this,this.modal&&this.modal.show(e)}hide(){const e=this.element?.querySelector(":focus");e&&e.blur(),this.modal&&this.modal.hide()}toggle(e=null){this.modal&&this.modal.toggle(e)}async destroy(){if(this.modal){const e=this.element?.querySelector(":focus");e&&e.blur(),this.modal.dispose(),this.modal=null}this.previousFocus&&document.body.contains(this.previousFocus)&&(this.previousFocus.focus(),this.previousFocus=null),this.autoSize&&this.resetAutoSizing(),await super.destroy()}handleUpdate(){this.modal&&this.modal.handleUpdate()}async setContent(t){if(t instanceof e.View){this.bodyView&&(await this.bodyView.destroy(),this.removeChild(this.bodyView)),this.bodyView=t,this.body="",this.addChild(this.bodyView);const e=this.element?.querySelector(".modal-body");e&&(e.innerHTML="",await this.bodyView.render(e))}else{this.body=t;const e=this.element?.querySelector(".modal-body");e&&(e.innerHTML=t)}this.handleUpdate()}setTitle(e){this.title=e;const t=this.element?.querySelector(".modal-title");t&&(t.textContent=e)}setLoading(e=!0,t="Loading..."){const s=this.element?.querySelector(".modal-body");s&&(e?s.innerHTML=`\n          <div class="text-center py-4">\n            <div class="spinner-border text-primary mb-3" role="status">\n              <span class="visually-hidden">Loading...</span>\n            </div>\n            <p>${t}</p>\n          </div>\n        `:this.bodyView&&s.replaceChildren(this.bodyView.element))}async onBeforeDestroy(){this.bodyView&&await this.bodyView.destroy(),this.footerView&&await this.footerView.destroy(),await super.onBeforeDestroy(),this.modal&&(this.modal.dispose(),this.modal=null)}static async showCode(e={}){const t=new Dialog({title:e.title||"Source Code",size:e.size||"lg",scrollable:!0,body:Dialog.formatCode(e.code,e.language),buttons:[{text:"Copy to Clipboard",class:"btn-primary",icon:"bi-clipboard",action:"copy"},{text:"Close",class:"btn-secondary",dismiss:!0}]});t.on("action:copy",async()=>{if(navigator.clipboard)try{await navigator.clipboard.writeText(e.code),t.showCopySuccess()}catch(s){console.error("Failed to copy:",s)}});const s=document.querySelector(".table-fullscreen")||document.body;return await t.render(!0,s),window.Prism&&t.element&&window.Prism.highlightAllUnder(t.element),t.show(),t.on("hidden",()=>{t.destroy(),t.element.remove()}),t}static formatCode(e,t="javascript"){let s;s=window.Prism&&window.Prism.languages[t]?window.Prism.highlight(e,window.Prism.languages[t],t):e.replace(/&/g,"&amp;").replace(/</g,"&lt;").replace(/>/g,"&gt;").replace(/"/g,"&quot;").replace(/'/g,"&#039;");const i=window.Prism?`language-${t}`:"";return`\n      <style>\n        /* Custom Prism theme overrides for Dialog */\n        .dialog-code-block .token.comment { color: #6a9955; }\n        .dialog-code-block .token.string { color: #ce9178; }\n        .dialog-code-block .token.keyword { color: #569cd6; }\n        .dialog-code-block .token.function { color: #dcdcaa; }\n        .dialog-code-block .token.number { color: #b5cea8; }\n        .dialog-code-block .token.operator { color: #d4d4d4; }\n        .dialog-code-block .token.class-name { color: #4ec9b0; }\n        .dialog-code-block .token.punctuation { color: #d4d4d4; }\n        .dialog-code-block .token.boolean { color: #569cd6; }\n        .dialog-code-block .token.property { color: #9cdcfe; }\n        .dialog-code-block .token.tag { color: #569cd6; }\n        .dialog-code-block .token.attr-name { color: #9cdcfe; }\n        .dialog-code-block .token.attr-value { color: #ce9178; }\n        .dialog-code-block ::selection { background: #264f78; }\n      </style>\n      <pre class="${i} dialog-code-block" style="${"\n      max-height: 60vh;\n      overflow-y: auto;\n      background: #1e1e1e;\n      color: #d4d4d4;\n      padding: 1.25rem;\n      border-radius: 0.5rem;\n      margin: 0;\n      font-family: 'Cascadia Code', 'Fira Code', 'JetBrains Mono', 'Consolas', 'Monaco', monospace;\n      font-size: 0.9rem;\n      line-height: 1.6;\n      border: 1px solid #2d2d30;\n      box-shadow: 0 4px 6px rgba(0, 0, 0, 0.3);\n    ".replace(/\s+/g," ").trim()}">\n        <code class="${i}" style="color: inherit; background: transparent; text-shadow: none;">${s}</code>\n      </pre>\n    `}static highlightCodeBlocks(e=document){window.Prism&&window.Prism.highlightAllUnder&&window.Prism.highlightAllUnder(e)}showCopySuccess(){const e=this.element.querySelector('[data-action="copy"]');if(e){const t=e.innerHTML;e.innerHTML='<i class="bi bi-check me-1"></i>Copied!',e.classList.remove("btn-primary"),e.classList.add("btn-success"),e.disabled=!0,setTimeout(()=>{e.innerHTML=t,e.classList.remove("btn-success"),e.classList.add("btn-primary"),e.disabled=!1},2e3)}}static async showDialog(e={}){"string"==typeof e&&(e={...arguments[2]||{},body:arguments[0],title:arguments[1]||"Alert"});const{title:t="Dialog",content:s,body:i=s||"",size:o="md",centered:n=!0,buttons:r=[{text:"OK",class:"btn-primary",value:!0}],rejectOnDismiss:a=!1,...l}=e,d=new Dialog({title:t,body:i,size:o,centered:n,buttons:r,...l}),c=document.querySelector(".table-fullscreen")||document.body;return await d.render(!0,c),new Promise((e,t)=>{let s=!1;d.element.querySelectorAll(".modal-footer button").forEach((t,i)=>{const o=r[i];o&&t.addEventListener("click",async t=>{if(s)return;const n=void 0!==o.value?o.value:o.action??i;if("function"==typeof o.handler)try{const r=await o.handler({dialog:d,button:o,index:i,event:t});if(null===r||!1===r)return;const a=!0===r||void 0===r?n:r;s=!0,o.dismiss||d.hide(),e(a)}catch(r){return void console.error("Dialog button handler error:",r)}else s=!0,o.dismiss||d.hide(),e(n)})}),d.on("hidden",()=>{s||(s=!0,a?t(new Error("Dialog dismissed")):e(null)),setTimeout(()=>{d.destroy(),d.element.remove()},100)}),d.show()})}static async alert(e={}){"string"==typeof e&&(e={message:e,title:"Alert"});const{message:t="",title:s="Alert",type:i="info",...o}=e;let n="",r="";switch(i){case"success":n='<i class="bi bi-check-circle-fill text-success me-2"></i>',r="text-success";break;case"warning":n='<i class="bi bi-exclamation-triangle-fill text-warning me-2"></i>',r="text-warning";break;case"danger":case"error":n='<i class="bi bi-x-circle-fill text-danger me-2"></i>',r="text-danger";break;default:n='<i class="bi bi-info-circle-fill text-info me-2"></i>',r="text-info"}return Dialog.showDialog({title:`<span class="${r}">${n}${s}</span>`,body:`<p>${t}</p>`,size:"sm",centered:!0,buttons:[{text:"OK",class:"btn-primary",value:!0}],...o})}static async confirm(e,t="Confirm",s={}){"object"==typeof e&&(e=(s=e).message,t=s.title||t);const i=new Dialog({title:t,body:`<p>${e}</p>`,size:s.size||"sm",centered:!0,backdrop:"static",buttons:[{text:s.cancelText||"Cancel",class:"btn-secondary",dismiss:!0,action:"cancel"},{text:s.confirmText||"Confirm",class:s.confirmClass||"btn-primary",action:"confirm"}],...s}),o=document.querySelector(".table-fullscreen")||document.body;return await i.render(!0,o),i.show(),new Promise(e=>{let t=!1;i.on("action:confirm",()=>{t=!0,i.hide()}),i.on("hidden",()=>{i.destroy(),i.element.remove(),e(t)})})}static async prompt(e,t="Input",s={}){const i=`prompt-input-${Date.now()}`,o=s.defaultValue||"",n=s.inputType||"text",r=s.placeholder||"",a=new Dialog({title:t,body:`\n        <p>${e}</p>\n        <input type="${n}"\n               class="form-control"\n               id="${i}"\n               value="${o}"\n               placeholder="${r}">\n      `,size:s.size||"sm",centered:!0,backdrop:"static",buttons:[{text:"Cancel",class:"btn-secondary",dismiss:!0},{text:"OK",class:"btn-primary",action:"ok"}],...s}),l=document.querySelector(".table-fullscreen")||document.body;return await a.render(!0,l),a.show(),a.on("shown",()=>{const e=a.element.querySelector(`#${i}`);e&&(e.focus(),e.select())}),new Promise(e=>{let t=null;a.on("action:ok",()=>{const e=a.element.querySelector(`#${i}`);t=e?e.value:null,a.hide()}),a.on("hidden",()=>{a.destroy(),a.element.remove(),e(t)})})}getModal(){return this.modal}isShown(){return this.element?.classList.contains("show")||!1}static async showForm(e={}){const{title:t="Form",formConfig:s={},size:i="md",centered:o=!0,submitText:n="Submit",cancelText:r="Cancel",...a}=e,l=new(0,(await Promise.resolve().then(()=>require("./FormView-Bwofbd8S.js")).then(e=>e.FormView$1)).default)({fileHandling:e.fileHandling||"base64",data:e.data,defaults:e.defaults,model:e.model,formConfig:{fields:s.fields||e.fields,...s,submitButton:!1,resetButton:!1}}),d=new Dialog({title:t,body:l,size:i,centered:o,buttons:[{text:r,class:"btn-secondary",action:"cancel"},{text:n,class:"btn-primary",action:"submit"}],...a}),c=document.querySelector(".table-fullscreen")||document.body;return await d.render(!0,c),d.show(),new Promise(t=>{let s=!1;d.on("action:submit",async()=>{if(!s)if(l.validate()){if(e.autoSave&&e.model){d.setLoading(!0);const e=await l.saveModel();if(!e.success)return d.setLoading(!1),d.render(),void d.getApp().toast.error(e.message);s=!0,d.hide(),t(e)}try{const e=await l.getFormData();s=!0,d.hide(),t(e)}catch(i){console.error("Error collecting form data:",i),l.showError("Error collecting form data")}}else l.focusFirstError()}),d.on("action:cancel",()=>{s||(s=!0,d.hide(),t(null))}),d.on("hidden",()=>{s||(s=!0,t(null)),setTimeout(()=>{l.destroy(),d.destroy()},100)})})}static async showModelForm(e={}){const{title:t="Edit",formConfig:s={},size:i="md",centered:o=!0,submitText:n="Save",cancelText:r="Cancel",model:a,fields:l,...d}=e;if(!a)throw new Error("showModelForm requires a model");const c=new(0,(await Promise.resolve().then(()=>require("./FormView-Bwofbd8S.js")).then(e=>e.FormView$1)).default)({fileHandling:e.fileHandling||"base64",model:a,data:e.data,defaults:e.defaults,formConfig:{fields:l||s.fields||[],...s,submitButton:!1,resetButton:!1}}),h=new Dialog({title:t,body:c,size:i,centered:o,buttons:[{text:r,class:"btn-secondary",action:"cancel"},{text:n,class:"btn-primary",action:"submit"}],...d}),u=document.querySelector(".table-fullscreen")||document.body;return await h.render(!0,u),h.show(),new Promise(e=>{let t=!1;h.on("action:submit",async()=>{if(!t){h.setLoading(!0,"Saving...");try{const s=await c.handleSubmit();if(s.success)t=!0,h.hide(),e(s);else{h.setLoading(!1);let e=s.error;s.data&&s.data.error&&(e=s.data.error),h.getApp().toast.error(e)}}catch(s){console.error("Error saving form:",s),await h.setContent(c),c.showError(s.message||"An error occurred while saving")}}}),h.on("action:cancel",()=>{t||(t=!0,h.hide(),e(null))}),h.on("hidden",()=>{t||(t=!0,e(null)),setTimeout(()=>{c.destroy(),h.destroy()},100)})})}static async showData(e={}){const{title:t="Data View",data:s={},model:i=null,fields:o=[],columns:n=2,responsive:r=!0,showEmptyValues:a=!1,emptyValueText:l="—",size:d="lg",centered:c=!0,closeText:h="Close",...u}=e,m=new(0,(await Promise.resolve().then(()=>require("./DataView-BYNjIf--.js"))).default)({data:s,model:i,fields:o,columns:n,responsive:r,showEmptyValues:a,emptyValueText:l}),g=new Dialog({title:t,body:m,size:d,centered:c,buttons:[{text:h,class:"btn-secondary",value:"close"}],...u}),p=document.querySelector(".table-fullscreen")||document.body;return await g.render(!0,p),g.show(),new Promise(e=>{let t=!1;const s=g.element.querySelector(".modal-footer button");s?.addEventListener("click",()=>{t||(t=!0,g.hide(),e(!0))}),g.on("hidden",()=>{t||(t=!0,e(!0)),setTimeout(()=>{m.destroy(),g.destroy(),g.element.remove()},100)}),m.on("field:click",e=>{g.emit("dataview:field:click",e)}),m.on("error",e=>{g.emit("dataview:error",e)})})}}Dialog.showConfirm=Dialog.confirm,Dialog.showError=Dialog.alert;const t=/* @__PURE__ */Object.freeze(/* @__PURE__ */Object.defineProperty({__proto__:null,default:Dialog},Symbol.toStringTag,{value:"Module"}));exports.Dialog=Dialog,exports.EventBus=EventBus,exports.Router=Router,exports.WebApp=WebApp;
-//# sourceMappingURL=Dialog-DX5h2QA9.js.map
+"use strict";const e=require("./Rest-P-KCJpjB.js");class Router{constructor(e={}){this.defaultRoute=e.defaultRoute||"home",this.routes=[],this.currentRoute=null,this.eventEmitter=e.eventEmitter||null,this.boundHandlePopState=this.handlePopState.bind(this)}start(){window.addEventListener("popstate",this.boundHandlePopState),this.handleCurrentLocation()}stop(){window.removeEventListener("popstate",this.boundHandlePopState)}addRoute(e,t){this.routes.push({pattern:this.normalizePattern(e),regex:this.patternToRegex(e),pageName:t,paramNames:this.extractParamNames(e)})}async navigate(e,t={}){const{replace:s=!1,state:i=null,trigger:o=!0}=t,{pageName:n,queryParams:r}=this.parseInput(e);o&&await this.handleRouteChange(n,r)}back(){window.history.back()}forward(){window.history.forward()}getCurrentRoute(){return this.currentRoute}getCurrentPath(){const{pageName:e,queryParams:t}=this.parseCurrentUrl();return this.buildPublicUrl(e,t)}handlePopState(e){this.allowPopState?this.handleCurrentLocation():console.warn("PopStateEvent is not allowed")}async handleCurrentLocation(){const{pageName:e,queryParams:t}=this.parseCurrentUrl();await this.handleRouteChange(e,t)}async handleRouteChange(e,t){const s="/"+e,i=this.matchRoute(s),o=this.buildPublicUrl(e,t);return i?(this.currentRoute=i,this.eventEmitter&&this.eventEmitter.emit("route:changed",{path:o,pageName:i.pageName,params:i.params,query:t,route:i}),i):(this.eventEmitter&&this.eventEmitter.emit("route:notfound",{path:o}),null)}matchRoute(e){for(const t of this.routes){const s=e.match(t.regex);if(s){const i={};return t.paramNames.forEach((e,t)=>{i[e]=s[t+1]}),{...t,params:i,path:e}}}return null}parseInput(e){let t=this.defaultRoute,s={};if(!e)return{pageName:t,queryParams:s};try{if(e.includes("?")){const[i,o]=e.split("?",2),n=new URLSearchParams(o);if(n.has("page")){t=n.get("page")||this.defaultRoute;for(const[e,t]of n)"page"!==e&&(s[e]=t)}else{t=i.startsWith("/")?i.substring(1)||this.defaultRoute:i||this.defaultRoute;for(const[e,t]of n)s[e]=t}}else t=e.startsWith("/")?e.substring(1)||this.defaultRoute:e}catch(i){console.warn("Failed to parse input:",e,i),t=this.defaultRoute,s={}}return{pageName:t,queryParams:s}}parseCurrentUrl(){const e=new URLSearchParams(window.location.search),t=e.get("page")||this.defaultRoute,s={};for(const[i,o]of e)"page"!==i&&(s[i]=o);return{pageName:t,queryParams:s}}buildPublicUrl(e,t={}){const s=new URLSearchParams;return s.set("page",e),Object.entries(t).forEach(([e,t])=>{null!=t&&""!==t&&s.set(e,String(t))}),"?"+s.toString()}updateBrowserUrl(e,t,s,i){const o=new URL(window.location.origin+window.location.pathname);o.searchParams.set("page",e),Object.entries(t).forEach(([e,t])=>{null!=t&&""!==t&&o.searchParams.set(e,String(t))});const n=o.toString();s?window.history.replaceState(i,"",n):window.history.pushState(i,"",n)}patternToRegex(e){let t=e.replace(/[-[\]{}()*+?.,\\^$|#\s]/g,"\\$&").replace(/\/:([^/?]+)\?/g,"(?:/([^/]+))?").replace(/:([^/]+)/g,"([^/]+)");return new RegExp(`^${t}$`)}extractParamNames(e){return(e.match(/:([^/?]+)\??/g)||[]).map(e=>e.replace(/[:?]/g,""))}normalizePattern(e){return e.startsWith("/")?e:`/${e}`}updateUrl(e={},t={}){const{replace:s=!1}=t,{pageName:i}=this.parseCurrentUrl();this.updateBrowserUrl(i,e,s)}buildUrl(e,t={}){return this.buildPublicUrl(e,t)}doRoutesMatch(e,t){if(!e||!t)return!1;const{pageName:s}=this.parseInput(e),{pageName:i}=this.parseInput(t);return s===i}}class EventBus{constructor(){this.listeners={},this.onceListeners={},this.maxListeners=100,this.debugMode=!1,this.eventStats={}}on(e,t){if("function"!=typeof t)throw new Error("Callback must be a function");return Array.isArray(e)?(e.forEach(e=>this.on(e,t)),this):(this.listeners[e]||(this.listeners[e]=[]),this.listeners[e].length>=this.maxListeners&&console.warn(`Max listeners (${this.maxListeners}) exceeded for event: ${e}`),this.listeners[e].push(t),this)}once(e,t){if("function"!=typeof t)throw new Error("Callback must be a function");return Array.isArray(e)?(e.forEach(e=>this.once(e,t)),this):(this.onceListeners[e]||(this.onceListeners[e]=[]),this.onceListeners[e].push(t),this)}off(e,t){if(Array.isArray(e))return e.forEach(e=>this.off(e,t)),this;if(!t)return delete this.listeners[e],delete this.onceListeners[e],this;if(this.listeners[e]){const s=this.listeners[e].indexOf(t);-1!==s&&(this.listeners[e].splice(s,1),0===this.listeners[e].length&&delete this.listeners[e])}if(this.onceListeners[e]){const s=this.onceListeners[e].indexOf(t);-1!==s&&(this.onceListeners[e].splice(s,1),0===this.onceListeners[e].length&&delete this.onceListeners[e])}return this}emit(e,t){this.updateEventStats(e),this.debugMode;const s=[];return this.listeners[e]&&s.push(...this.listeners[e]),this.listeners["*"]&&s.push(...this.listeners["*"]),this.onceListeners[e]&&(s.push(...this.onceListeners[e]),delete this.onceListeners[e]),this.onceListeners["*"]&&(s.push(...this.onceListeners["*"]),delete this.onceListeners["*"]),this.debugMode&&s.length>0&&s.length,s.forEach(s=>{try{s(t,e)&&(e.stopPropagation&&e.stopPropagation(),e.preventDefault&&e.preventDefault())}catch(i){console.error(`Error in event listener for '${e}':`,i),this.emitError(i,e,s)}}),this}async emitAsync(e,t){const s=[];this.listeners[e]&&s.push(...this.listeners[e]),this.listeners["*"]&&s.push(...this.listeners["*"]),this.onceListeners[e]&&(s.push(...this.onceListeners[e]),delete this.onceListeners[e]),this.onceListeners["*"]&&(s.push(...this.onceListeners["*"]),delete this.onceListeners["*"]);const i=s.map(s=>new Promise(i=>{try{i(s(t,e))}catch(o){console.error(`Error in async event listener for '${e}':`,o),this.emitError(o,e,s),i()}}));return await Promise.all(i),this}removeAllListeners(){return this.listeners={},this.onceListeners={},this}listenerCount(e){return(this.listeners[e]?this.listeners[e].length:0)+(this.onceListeners[e]?this.onceListeners[e].length:0)}eventNames(){const e=Object.keys(this.listeners),t=Object.keys(this.onceListeners);return[.../* @__PURE__ */new Set([...e,...t])]}setMaxListeners(e){if("number"!=typeof e||e<0)throw new Error("Max listeners must be a non-negative number");return this.maxListeners=e,this}namespace(e){const t=t=>`${e}:${t}`;return{on:(e,s)=>this.on(t(e),s),once:(e,s)=>this.once(t(e),s),off:(e,s)=>this.off(t(e),s),emit:(e,s)=>this.emit(t(e),s),emitAsync:(e,s)=>this.emitAsync(t(e),s)}}use(e){if("function"!=typeof e)throw new Error("Middleware must be a function");const t=this.emit;return this.emit=(s,i)=>{try{const o=e(s,i);if(!1===o)return this;const n=void 0!==o?o:i;return t.call(this,s,n)}catch(o){return console.error("Error in event middleware:",o),t.call(this,s,i)}},this}emitError(e,t,s){"error"!==t&&setTimeout(()=>{this.emit("error",{error:e,originalEvent:t,callback:s.toString()})},0)}waitFor(e,t=null){return new Promise((s,i)=>{let o=null;const n=e=>{o&&clearTimeout(o),s(e)};this.once(e,n),t&&(o=setTimeout(()=>{this.off(e,n),i(new Error(`Timeout waiting for event: ${e}`))},t))})}debug(e=!0){return this.debugMode=e,this}getStats(){const e=this.eventNames(),t={totalEvents:e.length,totalListeners:0,events:{},emissions:{...this.eventStats}};return e.forEach(e=>{const s=this.listenerCount(e);t.events[e]=s,t.totalListeners+=s}),t}updateEventStats(e){this.eventStats[e]||(this.eventStats[e]={count:0,firstEmission:Date.now(),lastEmission:null}),this.eventStats[e].count++,this.eventStats[e].lastEmission=Date.now()}getEventStats(e){const t=this.eventStats[e];return t?{...t,listenerCount:this.listenerCount(e),avgEmissionsPerMinute:this.calculateEmissionRate(t)}:null}calculateEmissionRate(e){if(!e.firstEmission||!e.lastEmission)return 0;const t=e.lastEmission-e.firstEmission;if(0===t)return 0;const s=t/6e4;return Math.round(e.count/s*100)/100}resetStats(){return this.eventStats={},this}getTopEvents(e=10){return Object.entries(this.eventStats).map(([e,t])=>({event:e,count:t.count,rate:this.calculateEmissionRate(t),listeners:this.listenerCount(e)})).sort((e,t)=>t.count-e.count).slice(0,e)}debugInfo(){this.debugMode,this.maxListeners;const e=this.getStats();return e.totalEvents,e.totalListeners,Object.keys(this.eventStats).length>0&&this.getTopEvents(5),this}}class WebApp{constructor(t={}){this.config=t,this.initPluginRegistry(),this.name=t.name||"MOJO App",this.version=t.version||"1.0.0",this.debug=t.debug||!1,this.container=t.container||"#app",this.layoutType=t.layout||"portal",this.layoutConfig=t.layoutConfig||{},t.sidebar&&(this.layoutConfig.sidebarConfig=t.sidebar),t.topbar&&(this.layoutConfig.topbarConfig=t.topbar),this.layout=null,this.layoutConfig.containerId=this.container||this.containerId||"#app",this.pageContainer=t.pageContainer||"#page-container",this.basePath=t.basePath||"",this.routerMode=t.routerMode||t.router?.mode||"param",this.basePath=t.basePath||t.router?.base||"",this.defaultRoute=t.defaultRoute||"home",this.session=t.session||{},this.router=null,this.navigation=t.navigation||{},this.state={currentPage:null,previousPage:null,loading:!1},this.events=new EventBus,this.rest=e.rest,t.api&&this.rest.configure(t.api),this.router=new Router({mode:"param"===this.routerMode?"params":this.routerMode,basePath:this.basePath,defaultRoute:this.defaultRoute,eventEmitter:this.events}),this.events.on("route:changed",async e=>{const{pageName:t,params:s,query:i}=e;await this.showPage(t,i,s,{fromRouter:!0})}),"undefined"!=typeof window&&(window.MOJO=window.MOJO||{},window.MOJO.router=this.router),this.setupFocusTracking(),this.pageCache=/* @__PURE__ */new Map,this.pageClasses=/* @__PURE__ */new Map,this.componentClasses=/* @__PURE__ */new Map,this.modelClasses=/* @__PURE__ */new Map,this.currentPage=null,this.isStarted=!1,window.matchUUID?window[window.matchUUID]=this:window.MOJO?window.MOJO.app=this:window.__app__=this}async start(){if(this.isStarted)console.warn("WebApp already started");else try{this.setupPageContainer(),this.validateDefaultRoute(),await this.setupRouter(),this.isStarted=!0,this.router.allowPopState=!1,this.events.emit("app:ready",{app:this})}catch(e){throw console.error(`Failed to start ${this.name}:`,e),this.showError("Failed to start application"),e}}async setupRouter(){this.router?(this.events.on("route:notfound",async e=>{console.warn(`Route not found: ${e.path}`),this._show404(e.path)}),this.router.start(),this.routerMode):console.error("Router not initialized")}setupPageContainer(){const e="string"==typeof this.container?document.querySelector(this.container):this.container;e&&!e.querySelector("#page-container")&&(e.innerHTML='<div id="page-container"></div>'),this.pageContainer="#page-container"}registerPage(e,t,s={}){if("string"!=typeof e||!e)return console.error("registerPage: pageName must be a non-empty string"),this;if("function"!=typeof t)return console.error("registerPage: PageClass must be a constructor function"),this;if(s.containerId||(s.containerId=this.pageContainer),this.pageClasses.set(e,{PageClass:t,constructorOptions:s}),this.router){let t=s.route||`/${e}`;t.startsWith("/")||(t=`/${t}`),s.route=t,this.router.addRoute(t,e)}return this}getPage(e){return this.pageCache.get(e)}getPagePermissions(e){if(this.pageCache.has(e))return this.pageCache.get(e).permissions;const t=this.pageClasses.get(e);if(!t)return null;const{PageClass:s,constructorOptions:i}=t;return i?i.permissions:null}getOrCreatePage(e){if(this.pageCache.has(e))return this.pageCache.get(e);const t=this.pageClasses.get(e);if(!t)return console.error(`Page not registered: ${e}`),null;const{PageClass:s,constructorOptions:i}=t;try{const t=new s({pageName:e,...i,app:this});return i.route&&(t.route=i.route),this.pageCache.set(e,t),t.route,t}catch(o){return console.error(`Failed to create page ${e}:`,o),null}}async showPage(e,t={},s={},i={}){const{fromRouter:o=!1,replace:n=!1,force:r=!1}=i;try{let i,n;"string"==typeof e?(n=e,i=this.getOrCreatePage(e)):e&&"object"==typeof e&&(i=e,n=e.pageName),this.events.emit("page:showing",{page:i,pageName:i.pageName,params:s,query:t,fromRouter:o});const r=this.currentPage;if(!i)return void this._show404(n,s,t,o);if(!i.canEnter())return void this._showDeniedPage(i,s,t,o);r&&r!==i&&await this._exitOldPage(r),await i.onParams(s,t),r!==i&&await i.onEnter(),i.syncUrl(),this.events.emit("page:show",{page:i,pageName:i.pageName,params:s,query:t,fromRouter:o}),await i.render(),this.currentPage=i,i.pageName}catch(a){console.error("Error in showPage:",a),this.showError(`Failed to load page: ${a.message}`),"error"!==e&&await this.showPage("error",{},{error:a,originalPage:e},{fromRouter:o})}}async _show404(e,t,s,i){const o=this.getOrCreatePage("404");o&&(o.setInfo&&o.setInfo(e),await this._exitOldPage(this.currentPage),await o.render(),this.currentPage=o,this.events.emit("page:404",{page:null,pageName:e,params:t,query:s,fromRouter:i}))}async _showDeniedPage(e,t,s,i){const o=this.getOrCreatePage("denied");o.setDeniedPage&&o.setDeniedPage(e),await this._exitOldPage(this.currentPage),await o.render(),this.currentPage=o,this.events.emit("page:denied",{page:e,pageName:e.pageName,params:t,query:s,fromRouter:i})}async _exitOldPage(e){if(e)try{await e.onExit(),await e.unmount(),this.events.emit("page:hide",{page:e})}catch(t){console.error(`Error exiting page ${e.pageName}:`,t)}}async navigate(e,t={},s={}){if(!this.router)return void console.error("Router not initialized");let i=e;if(Object.keys(t).length>0){const s=new URLSearchParams(t).toString();i+=(e.includes("?")?"&":"?")+s}return await this.router.navigate(i,s)}async navigateToDefault(e={}){return await this.showPage(this.defaultRoute,{},{},e)}back(){this.router?this.router.back():console.warn("Router not initialized")}forward(){this.router?this.router.forward():console.warn("Router not initialized")}getCurrentPage(){return this.currentPage}getPageContainer(){return this.layout&&this.layout.getPageContainer?this.layout.getPageContainer():"string"==typeof this.pageContainer?document.querySelector(this.pageContainer):this.pageContainer}async showError(e){try{const s=(await Promise.resolve().then(()=>t)).default;await s.alert(e,"Error",{size:"md",class:"text-danger"})}catch(s){this.events.emit("notification",{message:e,type:"error"}),"undefined"!=typeof window&&window?.console&&console.error("[WebApp] showError fallback:",s),"undefined"!=typeof window&&alert(`Error: ${e}`)}}async showSuccess(e){try{const s=(await Promise.resolve().then(()=>t)).default;await s.alert(e,"Success",{size:"md",class:"text-success"})}catch(s){this.events.emit("notification",{message:e,type:"success"}),"undefined"!=typeof window&&window?.console&&console.warn("[WebApp] showSuccess fallback:",s),"undefined"!=typeof window&&alert(`Success: ${e}`)}}async showInfo(e){try{const s=(await Promise.resolve().then(()=>t)).default;await s.alert(e,"Information",{size:"md",class:"text-info"})}catch(s){this.events.emit("notification",{message:e,type:"info"}),"undefined"!=typeof window&&window,"undefined"!=typeof window&&alert(`Info: ${e}`)}}async showWarning(e){try{const s=(await Promise.resolve().then(()=>t)).default;await s.alert(e,"Warning",{size:"md",class:"text-warning"})}catch(s){this.events.emit("notification",{message:e,type:"warning"}),"undefined"!=typeof window&&window?.console&&console.warn("[WebApp] showWarning fallback:",s),"undefined"!=typeof window&&alert(`Warning: ${e}`)}}showNotification(e,t="info"){this.events.emit("notification",{message:e,type:t})}async showLoading(e={}){"string"==typeof e&&(e={message:e});try{(await Promise.resolve().then(()=>t)).default.showBusy(e)}catch(s){"undefined"!=typeof window&&window?.console&&console.warn("[WebApp] showLoading fallback:",s,e),this.events.emit("notification",{message:e.message||"Loading...",type:"info"})}}async hideLoading(){try{(await Promise.resolve().then(()=>t)).default.hideBusy()}catch(e){"undefined"!=typeof window&&window?.console&&console.warn("[WebApp] hideLoading fallback:",e)}}async showModelForm(e={}){try{const s=(await Promise.resolve().then(()=>t)).default;return await s.showModelForm(e)}catch(s){throw"undefined"!=typeof window&&window?.console&&console.error("[WebApp] showModelForm failed:",s),s}}async showForm(e={}){try{const s=(await Promise.resolve().then(()=>t)).default;return await s.showForm(e)}catch(s){throw"undefined"!=typeof window&&window?.console&&console.error("[WebApp] showForm failed:",s),s}}async showDialog(e={}){try{const s=(await Promise.resolve().then(()=>t)).default;return await s.showDialog(e)}catch(s){throw"undefined"!=typeof window&&window?.console&&console.error("[WebApp] showDialog failed:",s),s}}async confirm(e,s="Confirm",i={}){const o=(await Promise.resolve().then(()=>t)).default;return await o.confirm(e,s,i)}setupFocusTracking(){if("undefined"==typeof window)return;this.isFocused=!document.hidden;const e=()=>{const e=this.isFocused;this.isFocused=!document.hidden,e!==this.isFocused&&(this.isFocused?this.events.emit("browser:focus"):this.events.emit("browser:blur"))},t=()=>{this.isFocused||(this.isFocused=!0,this.events.emit("browser:focus"))},s=()=>{this.isFocused&&(this.isFocused=!1,this.events.emit("browser:blur"))};document.addEventListener("visibilitychange",e),window.addEventListener("focus",t),window.addEventListener("blur",s),this._focusHandlers={visibilitychange:e,focus:t,blur:s}}setupErrorHandling(){window.addEventListener("error",e=>{console.error("Global error:",e.error),this.debug&&this.showError(`Error: ${e.error?.message||"Unknown error"}`)}),window.addEventListener("unhandledrejection",e=>{console.error("Unhandled promise rejection:",e.reason),this.debug&&this.showError(`Promise rejected: ${e.reason?.message||"Unknown error"}`)})}escapeHtml(e){return e.replace(/&/g,"&amp;").replace(/</g,"&lt;").replace(/>/g,"&gt;").replace(/"/g,"&quot;").replace(/'/g,"&#039;")}getState(e){return e?this.state[e]:this.state}setState(e){const t={...this.state};Object.assign(this.state,e),this.events.emit("state:changed",{oldState:t,newState:this.state,updates:e})}registerComponent(e,t){this.componentClasses.set(e,t)}getComponent(e){return this.componentClasses.get(e)}registerModel(e,t){this.modelClasses.set(e,t)}getModel(e){return this.modelClasses.get(e)}setupRest(){this.rest=e.rest,e.rest.configure(this.api)}async destroy(){this.router&&this.router.stop(),this._focusHandlers&&"undefined"!=typeof window&&(document.removeEventListener("visibilitychange",this._focusHandlers.visibilitychange),window.removeEventListener("focus",this._focusHandlers.focus),window.removeEventListener("blur",this._focusHandlers.blur));const e=Array.from(this.pageCache.values());if(await Promise.allSettled(e.map(async e=>{try{e.destroy&&await e.destroy()}catch(t){console.error("Error destroying page:",t)}})),this.layout&&this.layout.destroy)try{await this.layout.destroy()}catch(t){console.error("Error destroying layout:",t)}this.pageCache.clear(),this.pageClasses.clear(),this.componentClasses.clear(),this.modelClasses.clear(),"undefined"!=typeof window&&window.MOJO&&delete window.MOJO.router,this.isStarted=!1,this.name}buildPagePath(e,t,s){let i=e.route||`/${e.pageName.toLowerCase()}`;if(Object.keys(t).forEach(e=>{"string"!=typeof t[e]&&"number"!=typeof t[e]||(i=i.replace(`:${e}`,t[e]))}),s&&Object.keys(s).length>0){const e=new URLSearchParams(s).toString();i+=(i.includes("?")?"&":"?")+e}return i}validateDefaultRoute(){this.pageClasses.has(this.defaultRoute)?this.defaultRoute:(console.warn(`⚠️  Default route '${this.defaultRoute}' is not registered!`),console.warn(`   Please register a page: app.registerPage('${this.defaultRoute}', YourPageClass);`),console.warn("   Or change default route: new WebApp({ defaultRoute: 'your-page' });"))}findFallbackPage(){const e=["404","error","denied"];for(const[t]of this.pageClasses.entries())if(!e.includes(t))return t;return null}static create(e={}){return new WebApp(e)}initPluginRegistry(){"undefined"!=typeof window&&(window.MOJO||(window.MOJO={}),window.MOJO.plugins||(window.MOJO.plugins={}),window.MOJO.app=this)}static registerPlugin(e,t){"undefined"!=typeof window&&(window.MOJO||(window.MOJO={}),window.MOJO.plugins||(window.MOJO.plugins={}),window.MOJO.plugins[e]=t)}}class Dialog extends e.View{static _openDialogs=[];static _baseZIndex={backdrop:1050,modal:1055};static getFullscreenAwareZIndex(){return document.querySelector(".table-fullscreen")?{backdrop:10040,modal:10050}:this._baseZIndex}static _busyIndicator=null;static _busyCounter=0;static _busyTimeout=null;static fixAllBackdropStacking(){const e=document.querySelectorAll(".modal-backdrop"),t=Dialog._openDialogs;if(0===e.length||0===t.length)return;const s=[...t].sort((e,t)=>(e._dialogZIndex||0)-(t._dialogZIndex||0));e.forEach((e,t)=>{if(t<s.length){const i=s[t]._dialogZIndex-5;e.style.zIndex=i;const o=document.querySelector(".table-fullscreen")||document.body;e.parentNode!==o&&o.appendChild(e)}})}static updateAllBackdropStacking(){Dialog.fixAllBackdropStacking()}static showBusy(e={}){const{timeout:t=3e4,message:s="Loading..."}=e;if(this._busyCounter++,1===this._busyCounter){if(this._busyTimeout&&clearTimeout(this._busyTimeout),!this._busyIndicator){const e=this.getFullscreenAwareZIndex().modal+1e3;this._busyIndicator=document.createElement("div"),this._busyIndicator.className="mojo-busy-indicator",this._busyIndicator.innerHTML=`\n                  <div class="mojo-busy-spinner">\n                      <div class="spinner-border text-light" role="status">\n                          <span class="visually-hidden">Loading...</span>\n                      </div>\n                      <p class="mojo-busy-message mt-3 text-light">${s}</p>\n                  </div>\n                  <style>\n                      .mojo-busy-indicator {\n                          position: fixed; top: 0; left: 0; width: 100vw; height: 100vh;\n                          background-color: rgba(0, 0, 0, 0.5); z-index: ${e};\n                          display: flex; align-items: center; justify-content: center;\n                          opacity: 0; transition: opacity 0.15s linear;\n                      }\n                      .mojo-busy-indicator.show { opacity: 1; }\n                      .mojo-busy-spinner .spinner-border { width: 3rem; height: 3rem; }\n                  </style>\n              `,document.body.appendChild(this._busyIndicator)}const e=this._busyIndicator.querySelector(".mojo-busy-message");e&&(e.textContent=s),setTimeout(()=>this._busyIndicator.classList.add("show"),10),this._busyTimeout=setTimeout(()=>{console.error("Busy indicator timed out."),this.hideBusy(!0),this.alert({title:"Operation Timed Out",message:"The operation took too long. Please check your connection and try again.",type:"danger"})},t)}}static hideBusy(e=!1){e?this._busyCounter=0:this._busyCounter--,this._busyCounter<=0&&(this._busyCounter=0,this._busyTimeout&&(clearTimeout(this._busyTimeout),this._busyTimeout=null),this._busyIndicator&&(this._busyIndicator.classList.remove("show"),setTimeout(()=>{this._busyIndicator&&0===this._busyCounter&&(this._busyIndicator.remove(),this._busyIndicator=null)},150)))}constructor(e={}){const t=e.id||`modal-${Date.now()}`;super({...e,id:t,tagName:"div",className:`modal ${!1!==e.fade?"fade":""} ${e.className||""}`,attributes:{tabindex:"-1","aria-hidden":"true","aria-labelledby":e.labelledBy||`${t}-label`,"aria-describedby":e.describedBy||null,...e.attributes}}),this.modalId=t,this.title=e.title||"",this.titleId=`${this.modalId}-label`,this.size=e.size||"",this.centered=void 0!==e.centered&&e.centered,this.scrollable=void 0!==e.scrollable&&e.scrollable,this.autoSize=e.autoSize||"auto"===e.size,this.backdrop=void 0===e.backdrop||e.backdrop,this.keyboard=void 0===e.keyboard||e.keyboard,this.focus=void 0===e.focus||e.focus,this.header=void 0===e.header||e.header,this.headerContent=e.headerContent||null,this.closeButton=void 0===e.closeButton||e.closeButton,this.contextMenu=e.contextMenu||null,this.body=e.body||e.content||"",this.bodyView=null,this.bodyClass=e.bodyClass||"",this.noBodyPadding=e.noBodyPadding||!1,this.minWidth=e.minWidth||300,this.minHeight=e.minHeight||200,e.maxHeight&&(this.maxHeight=e.maxHeight),this.maxWidthPercent=e.maxWidthPercent||.9,this.maxHeightPercent=e.maxHeightPercent||.8,this._processBodyContent(this.body),this.footer=e.footer||null,this.footerView=null,this.footerClass=e.footerClass||"",this._processFooterContent(this.footer),this.buttons=e.buttons||null,this.onShow=e.onShow||null,this.onShown=e.onShown||null,this.onHide=e.onHide||null,this.onHidden=e.onHidden||null,this.onHidePrevented=e.onHidePrevented||null,this.autoShow=void 0!==e.autoShow&&e.autoShow,this.modal=null,this.relatedTarget=e.relatedTarget||null}_processBodyContent(t){if(t&&t.render)this.bodyView=t,this.body="",this.addChild(this.bodyView);else if("function"==typeof t)try{const s=t();s instanceof e.View?(this.bodyView=s,this.body="",this.addChild(this.bodyView)):s instanceof Promise?(this.bodyPromise=s,this.body='<div class="text-center"><div class="spinner-border spinner-border-sm"></div></div>'):this.body=s}catch(s){console.error("Error processing body function:",s),this.body=t}else this.body=t}_processFooterContent(t){if(t instanceof e.View)this.footerView=t,this.footer=null,this.addChild(this.footerView);else if("function"==typeof t)try{const s=t();s instanceof e.View?(this.footerView=s,this.footer=null,this.addChild(this.footerView)):s instanceof Promise?(this.footerPromise=s,this.footer='<div class="text-center"><div class="spinner-border spinner-border-sm"></div></div>'):this.footer=s}catch(s){console.error("Error processing footer function:",s),this.footer=t}else this.footer=t}async getTemplate(){const e=["modal-dialog"];return this.size&&"auto"!==this.size&&(this.size.startsWith("fullscreen")?e.push(`modal-${this.size}`):["sm","lg","xl","xxl"].includes(this.size)&&(e.push(`modal-${this.size}`),["lg","xl","xxl"].includes(this.size)&&e.push("modal-fullscreen-sm-down"))),this.centered&&e.push("modal-dialog-centered"),this.scrollable&&(this.maxHeight?e.push("overflow-hidden"):e.push("modal-dialog-scrollable")),`\n      <div class="${e.join(" ")}">\n        <div class="modal-content">\n          ${await this.buildHeader()}\n          ${await this.buildBody()}\n          ${await this.buildFooter()}\n        </div>\n      </div>\n    `}async buildHeader(){if(!this.header)return"";if(this.headerContent)return`<div class="modal-header">${this.headerContent}</div>`;let e="";return this.contextMenu&&this.contextMenu.items&&this.contextMenu.items.length>0?e=await this.buildContextMenu():this.closeButton&&(e='<button type="button" class="btn-close" data-bs-dismiss="modal" aria-label="Close"></button>'),`\n      <div class="modal-header">\n        ${this.title?`<h5 class="modal-title" id="${this.titleId}">${this.title}</h5>`:""}\n        ${e}\n      </div>\n    `}async buildContextMenu(){const e=await this.filterContextMenuItems();if(0===e.length)return this.closeButton?'<button type="button" class="btn-close" data-bs-dismiss="modal" aria-label="Close"></button>':"";const t=this.contextMenu.icon||"bi-three-dots-vertical";return`\n      <div class="dropdown">\n        <button class="${this.contextMenu.buttonClass||"btn btn-link p-1 mojo-modal-context-menu-btn"}" type="button" data-bs-toggle="dropdown" aria-expanded="false">\n          <i class="${t}"></i>\n        </button>\n        <ul class="dropdown-menu dropdown-menu-end">\n          ${e.map(e=>{if("divider"===e.type)return'<li><hr class="dropdown-divider"></li>';const t=e.icon?`<i class="${e.icon} me-2"></i>`:"",s=e.label||"";if(e.href)return`<li><a class="dropdown-item" href="${e.href}"${e.target?` target="${e.target}"`:""}>${t}${s}</a></li>`;if(e.action){const i=Object.keys(e).filter(e=>e.startsWith("data-")).map(t=>`${t}="${e[t]}"`).join(" ");return`<li><a class="dropdown-item" data-action="${e.action}" ${i}>${t}${s}</a></li>`}return""}).join("")}\n        </ul>\n      </div>\n    `}async filterContextMenuItems(){if(!this.contextMenu||!this.contextMenu.items)return[];const e=[];for(const i of this.contextMenu.items)if("divider"!==i.type){if(i.permissions)try{const e=this.getApp?.();let s=null;if(e&&(s=e.activeUser||e.getState?.("activeUser")),!s&&"undefined"!=typeof window&&window.getApp)try{const e=window.getApp();s=e?.activeUser}catch(t){}if(!s||!s.hasPermission)continue;if(!s.hasPermission(i.permissions))continue}catch(s){console.warn("Error checking permissions for context menu item:",s);continue}e.push(i)}else e.push(i);return e}async buildBody(){return this.bodyView?(this.bodyView.replaceById=!0,`<div class="${this.noBodyPadding?`modal-body p-0 ${this.bodyClass}`:`modal-body ${this.bodyClass}`}" data-view-container="body">\n        \x3c!-- View will be mounted here --\x3e\n        <div id="${this.bodyView.id}"></div>\n      </div>`):this.body||""===this.body?`\n      <div class="${this.noBodyPadding?`modal-body p-0 ${this.bodyClass}`:`modal-body ${this.bodyClass}`}">\n        ${this.body}\n      </div>\n    `:""}async buildFooter(){if(this.footerView)return`<div class="modal-footer ${this.footerClass}" data-view-container="footer"></div>`;if(null!==this.footer&&"string"==typeof this.footer)return`<div class="modal-footer ${this.footerClass}">${this.footer}</div>`;if(this.buttons&&this.buttons.length>0){const e=this.buttons.map(e=>{const t=e.dismiss?'data-bs-dismiss="modal"':"",s=e.action?`data-action="${e.action}"`:"",i=e.id?`id="${e.id}"`:"",o=e.disabled?"disabled":"";return`\n          <button type="${e.type||"button"}"\n                  class="btn ${e.class||"btn-secondary"}"\n                  ${i}\n                  ${t}\n                  ${s}\n                  ${o}>\n            ${e.icon?`<i class="bi ${e.icon} me-1"></i>`:""}\n            ${e.text||"Button"}\n          </button>\n        `}).join("");return`<div class="modal-footer ${this.footerClass}">${e}</div>`}return""}async mount(e=null){if(!this.mounted&&!this.destroyed){if(!this.element)throw new Error("Cannot mount dialog without element");return await this.onBeforeMount(),(document.querySelector(".table-fullscreen")||document.body).appendChild(this.element),this.bindEvents(),this.mounted=!0,await this.onAfterMount(),this.emit("mounted",{view:this}),this}}async onAfterRender(){if(await super.onAfterRender(),window.Prism&&this.element&&this.element.querySelectorAll("pre code").length>0&&window.Prism.highlightAllUnder(this.element),this.autoSize)this.setupAutoSizing();else if(this.maxHeight){const e=this.element.querySelector(".modal-body");e&&(e.style.maxHeight=`${this.maxHeight}px`)}}async onAfterMount(){await super.onAfterMount(),"undefined"!=typeof window&&window.bootstrap&&window.bootstrap.Modal&&("static"===this.backdrop&&this.element.setAttribute("data-bs-backdrop","static"),this.keyboard||this.element.setAttribute("data-bs-keyboard","false"),this.modal=new window.bootstrap.Modal(this.element,{backdrop:this.backdrop,keyboard:this.keyboard,focus:this.focus}),this.bindBootstrapEvents(),this.autoShow&&this.show(this.relatedTarget))}setupAutoSizing(){this.element&&(this.element.addEventListener("shown.bs.modal",()=>{this.applyAutoSizing()},{once:!0}),setTimeout(()=>{this.isShown()&&this.applyAutoSizing()},100))}applyAutoSizing(){if(this.element)try{const e=this.element.querySelector(".modal-dialog"),t=this.element.querySelector(".modal-content"),s=this.element.querySelector(".modal-body");if(!e||!t||!s)return void console.warn("Dialog auto-sizing: Required elements not found");if(this.bodyView&&!this.bodyView.element)return void setTimeout(()=>this.applyAutoSizing(),50);const i={dialogMaxWidth:e.style.maxWidth,dialogWidth:e.style.width,contentWidth:t.style.width,contentMaxHeight:t.style.maxHeight,hadScrollableClass:e.classList.contains("modal-dialog-scrollable")};e.style.maxWidth="none",e.style.width="auto",t.style.width="auto",t.style.maxHeight="none",t.offsetHeight;const o=t.getBoundingClientRect(),n=40,r=Math.min(window.innerWidth*this.maxWidthPercent,window.innerWidth-n);let a=Math.min(window.innerHeight*this.maxHeightPercent,window.innerHeight-n),l=Math.max(this.minWidth,Math.ceil(o.width+20)),d=Math.max(this.minHeight,Math.ceil(o.height));this.maxHeight&&(a=Math.min(this.maxHeight,a),e.style.maxHeight=`${a}px`),l=Math.min(l,r);const c=o.height>a;e.style.maxWidth=`${l}px`,e.style.width=`${l}px`,c&&(e.classList.contains("modal-dialog-scrollable")||e.classList.add("modal-dialog-scrollable"),t.style.maxHeight=`${a}px`,d=a),this.autoSizedWidth=l,this.autoSizedHeight=d,this._originalStyles=i}catch(e){console.error("Error in dialog auto-sizing:",e),this.element.querySelector(".modal-dialog").style.maxWidth=""}}resetAutoSizing(){if(this.autoSize&&this._originalStyles&&this.element)try{const e=this.element.querySelector(".modal-dialog"),t=this.element.querySelector(".modal-content"),s=this.element.querySelector(".modal-body");e&&t&&s&&(e.style.maxWidth=this._originalStyles.dialogMaxWidth||"",e.style.width=this._originalStyles.dialogWidth||"",t.style.width=this._originalStyles.contentWidth||"",t.style.maxHeight=this._originalStyles.contentMaxHeight||"",!this._originalStyles.hadScrollableClass&&e.classList.contains("modal-dialog-scrollable")&&e.classList.remove("modal-dialog-scrollable"),delete this.autoSizedWidth,delete this.autoSizedHeight,delete this._originalStyles)}catch(e){console.error("Error resetting dialog auto-sizing:",e)}}bindBootstrapEvents(){this.element.addEventListener("show.bs.modal",e=>{const t=Dialog._openDialogs.length,s=Dialog.getFullscreenAwareZIndex().modal+20*t;this.element.style.zIndex=s,this._dialogZIndex=s,this._backdropZIndex=s-10,Dialog._openDialogs.push(this),this.onShow&&this.onShow(e),this.emit("show",{dialog:this,relatedTarget:e.relatedTarget})}),this.element.addEventListener("shown.bs.modal",e=>{if(setTimeout(()=>{Dialog.fixAllBackdropStacking()},50),this.onShown&&this.onShown(e),this.emit("shown",{dialog:this,relatedTarget:e.relatedTarget}),this.focus){const e=this.element.querySelector('input:not([type="hidden"]), textarea, select');e&&e.focus()}}),this.element.addEventListener("hide.bs.modal",e=>{const t=this.element.querySelector(":focus");t&&t.blur(),this.onHide&&!1===this.onHide(e)?e.preventDefault():this.emit("hide",{dialog:this})}),this.element.addEventListener("hidden.bs.modal",e=>{const t=Dialog._openDialogs.indexOf(this);t>-1&&Dialog._openDialogs.splice(t,1),Dialog._openDialogs.length>0&&(document.body.classList.add("modal-open"),setTimeout(()=>{Dialog.fixAllBackdropStacking()},50)),this.previousFocus&&document.body.contains(this.previousFocus)&&this.previousFocus.focus(),this.onHidden&&this.onHidden(e),this.emit("hidden",{dialog:this})}),this.element.addEventListener("hidePrevented.bs.modal",e=>{this.onHidePrevented&&this.onHidePrevented(e),this.emit("hidePrevented",{dialog:this})})}show(e=null){this.previousFocus=document.activeElement,window.lastDialog=this,this.modal&&this.modal.show(e)}hide(){const e=this.element?.querySelector(":focus");e&&e.blur(),this.modal&&this.modal.hide()}toggle(e=null){this.modal&&this.modal.toggle(e)}async destroy(){if(this.modal){const e=this.element?.querySelector(":focus");e&&e.blur(),this.modal.dispose(),this.modal=null}this.previousFocus&&document.body.contains(this.previousFocus)&&(this.previousFocus.focus(),this.previousFocus=null),this.autoSize&&this.resetAutoSizing(),await super.destroy()}handleUpdate(){this.modal&&this.modal.handleUpdate()}async setContent(t){if(t instanceof e.View){this.bodyView&&(await this.bodyView.destroy(),this.removeChild(this.bodyView)),this.bodyView=t,this.body="",this.addChild(this.bodyView);const e=this.element?.querySelector(".modal-body");e&&(e.innerHTML="",await this.bodyView.render(e))}else{this.body=t;const e=this.element?.querySelector(".modal-body");e&&(e.innerHTML=t)}this.handleUpdate()}setTitle(e){this.title=e;const t=this.element?.querySelector(".modal-title");t&&(t.textContent=e)}setLoading(e=!0,t="Loading..."){const s=this.element?.querySelector(".modal-body");s&&(e?s.innerHTML=`\n          <div class="text-center py-4">\n            <div class="spinner-border text-primary mb-3" role="status">\n              <span class="visually-hidden">Loading...</span>\n            </div>\n            <p>${t}</p>\n          </div>\n        `:this.bodyView&&s.replaceChildren(this.bodyView.element))}async onBeforeDestroy(){this.bodyView&&await this.bodyView.destroy(),this.footerView&&await this.footerView.destroy(),await super.onBeforeDestroy(),this.modal&&(this.modal.dispose(),this.modal=null)}static async showCode(e={}){const t=new Dialog({title:e.title||"Source Code",size:e.size||"lg",scrollable:!0,body:Dialog.formatCode(e.code,e.language),buttons:[{text:"Copy to Clipboard",class:"btn-primary",icon:"bi-clipboard",action:"copy"},{text:"Close",class:"btn-secondary",dismiss:!0}]});t.on("action:copy",async()=>{if(navigator.clipboard)try{await navigator.clipboard.writeText(e.code),t.showCopySuccess()}catch(s){console.error("Failed to copy:",s)}});const s=document.querySelector(".table-fullscreen")||document.body;return await t.render(!0,s),window.Prism&&t.element&&window.Prism.highlightAllUnder(t.element),t.show(),t.on("hidden",()=>{t.destroy(),t.element.remove()}),t}static formatCode(e,t="javascript"){let s;s=window.Prism&&window.Prism.languages[t]?window.Prism.highlight(e,window.Prism.languages[t],t):e.replace(/&/g,"&amp;").replace(/</g,"&lt;").replace(/>/g,"&gt;").replace(/"/g,"&quot;").replace(/'/g,"&#039;");const i=window.Prism?`language-${t}`:"";return`\n      <style>\n        /* Custom Prism theme overrides for Dialog */\n        .dialog-code-block .token.comment { color: #6a9955; }\n        .dialog-code-block .token.string { color: #ce9178; }\n        .dialog-code-block .token.keyword { color: #569cd6; }\n        .dialog-code-block .token.function { color: #dcdcaa; }\n        .dialog-code-block .token.number { color: #b5cea8; }\n        .dialog-code-block .token.operator { color: #d4d4d4; }\n        .dialog-code-block .token.class-name { color: #4ec9b0; }\n        .dialog-code-block .token.punctuation { color: #d4d4d4; }\n        .dialog-code-block .token.boolean { color: #569cd6; }\n        .dialog-code-block .token.property { color: #9cdcfe; }\n        .dialog-code-block .token.tag { color: #569cd6; }\n        .dialog-code-block .token.attr-name { color: #9cdcfe; }\n        .dialog-code-block .token.attr-value { color: #ce9178; }\n        .dialog-code-block ::selection { background: #264f78; }\n      </style>\n      <pre class="${i} dialog-code-block" style="${"\n      max-height: 60vh;\n      overflow-y: auto;\n      background: #1e1e1e;\n      color: #d4d4d4;\n      padding: 1.25rem;\n      border-radius: 0.5rem;\n      margin: 0;\n      font-family: 'Cascadia Code', 'Fira Code', 'JetBrains Mono', 'Consolas', 'Monaco', monospace;\n      font-size: 0.9rem;\n      line-height: 1.6;\n      border: 1px solid #2d2d30;\n      box-shadow: 0 4px 6px rgba(0, 0, 0, 0.3);\n    ".replace(/\s+/g," ").trim()}">\n        <code class="${i}" style="color: inherit; background: transparent; text-shadow: none;">${s}</code>\n      </pre>\n    `}static highlightCodeBlocks(e=document){window.Prism&&window.Prism.highlightAllUnder&&window.Prism.highlightAllUnder(e)}showCopySuccess(){const e=this.element.querySelector('[data-action="copy"]');if(e){const t=e.innerHTML;e.innerHTML='<i class="bi bi-check me-1"></i>Copied!',e.classList.remove("btn-primary"),e.classList.add("btn-success"),e.disabled=!0,setTimeout(()=>{e.innerHTML=t,e.classList.remove("btn-success"),e.classList.add("btn-primary"),e.disabled=!1},2e3)}}static async showDialog(e={}){"string"==typeof e&&(e={...arguments[2]||{},body:arguments[0],title:arguments[1]||"Alert"});const{title:t="Dialog",content:s,body:i=s||"",size:o="md",centered:n=!0,buttons:r=[{text:"OK",class:"btn-primary",value:!0}],rejectOnDismiss:a=!1,...l}=e,d=new Dialog({title:t,body:i,size:o,centered:n,buttons:r,...l}),c=document.querySelector(".table-fullscreen")||document.body;return await d.render(!0,c),new Promise((e,t)=>{let s=!1;d.element.querySelectorAll(".modal-footer button").forEach((t,i)=>{const o=r[i];o&&t.addEventListener("click",async t=>{if(s)return;const n=void 0!==o.value?o.value:o.action??i;if("function"==typeof o.handler)try{const r=await o.handler({dialog:d,button:o,index:i,event:t});if(null===r||!1===r)return;const a=!0===r||void 0===r?n:r;s=!0,o.dismiss||d.hide(),e(a)}catch(r){return void console.error("Dialog button handler error:",r)}else s=!0,o.dismiss||d.hide(),e(n)})}),d.on("hidden",()=>{s||(s=!0,a?t(new Error("Dialog dismissed")):e(null)),setTimeout(()=>{d.destroy(),d.element.remove()},100)}),d.show()})}static async alert(e={}){"string"==typeof e&&(e={message:e,title:"Alert"});const{message:t="",title:s="Alert",type:i="info",...o}=e;let n="",r="";switch(i){case"success":n='<i class="bi bi-check-circle-fill text-success me-2"></i>',r="text-success";break;case"warning":n='<i class="bi bi-exclamation-triangle-fill text-warning me-2"></i>',r="text-warning";break;case"danger":case"error":n='<i class="bi bi-x-circle-fill text-danger me-2"></i>',r="text-danger";break;default:n='<i class="bi bi-info-circle-fill text-info me-2"></i>',r="text-info"}return Dialog.showDialog({title:`<span class="${r}">${n}${s}</span>`,body:`<p>${t}</p>`,size:"sm",centered:!0,buttons:[{text:"OK",class:"btn-primary",value:!0}],...o})}static async confirm(e,t="Confirm",s={}){"object"==typeof e&&(e=(s=e).message,t=s.title||t);const i=new Dialog({title:t,body:`<p>${e}</p>`,size:s.size||"sm",centered:!0,backdrop:"static",buttons:[{text:s.cancelText||"Cancel",class:"btn-secondary",dismiss:!0,action:"cancel"},{text:s.confirmText||"Confirm",class:s.confirmClass||"btn-primary",action:"confirm"}],...s}),o=document.querySelector(".table-fullscreen")||document.body;return await i.render(!0,o),i.show(),new Promise(e=>{let t=!1;i.on("action:confirm",()=>{t=!0,i.hide()}),i.on("hidden",()=>{i.destroy(),i.element.remove(),e(t)})})}static async prompt(e,t="Input",s={}){const i=`prompt-input-${Date.now()}`,o=s.defaultValue||"",n=s.inputType||"text",r=s.placeholder||"",a=new Dialog({title:t,body:`\n        <p>${e}</p>\n        <input type="${n}"\n               class="form-control"\n               id="${i}"\n               value="${o}"\n               placeholder="${r}">\n      `,size:s.size||"sm",centered:!0,backdrop:"static",buttons:[{text:"Cancel",class:"btn-secondary",dismiss:!0},{text:"OK",class:"btn-primary",action:"ok"}],...s}),l=document.querySelector(".table-fullscreen")||document.body;return await a.render(!0,l),a.show(),a.on("shown",()=>{const e=a.element.querySelector(`#${i}`);e&&(e.focus(),e.select())}),new Promise(e=>{let t=null;a.on("action:ok",()=>{const e=a.element.querySelector(`#${i}`);t=e?e.value:null,a.hide()}),a.on("hidden",()=>{a.destroy(),a.element.remove(),e(t)})})}getModal(){return this.modal}isShown(){return this.element?.classList.contains("show")||!1}static async showForm(e={}){const{title:t="Form",formConfig:s={},size:i="md",centered:o=!0,submitText:n="Submit",cancelText:r="Cancel",...a}=e,l=new(0,(await Promise.resolve().then(()=>require("./FormView-C1emfj3B.js")).then(e=>e.FormView$1)).default)({fileHandling:e.fileHandling||"base64",data:e.data,defaults:e.defaults,model:e.model,formConfig:{fields:s.fields||e.fields,...s,submitButton:!1,resetButton:!1}}),d=new Dialog({title:t,body:l,size:i,centered:o,buttons:[{text:r,class:"btn-secondary",action:"cancel"},{text:n,class:"btn-primary",action:"submit"}],...a}),c=document.querySelector(".table-fullscreen")||document.body;return await d.render(!0,c),d.show(),new Promise(t=>{let s=!1;d.on("action:submit",async()=>{if(!s)if(l.validate()){if(e.autoSave&&e.model){d.setLoading(!0);const e=await l.saveModel();if(!e.success)return d.setLoading(!1),d.render(),void d.getApp().toast.error(e.message);s=!0,d.hide(),t(e)}try{const e=await l.getFormData();s=!0,d.hide(),t(e)}catch(i){console.error("Error collecting form data:",i),l.showError("Error collecting form data")}}else l.focusFirstError()}),d.on("action:cancel",()=>{s||(s=!0,d.hide(),t(null))}),d.on("hidden",()=>{s||(s=!0,t(null)),setTimeout(()=>{l.destroy(),d.destroy()},100)})})}static async showModelForm(e={}){const{title:t="Edit",formConfig:s={},size:i="md",centered:o=!0,submitText:n="Save",cancelText:r="Cancel",model:a,fields:l,...d}=e;if(!a)throw new Error("showModelForm requires a model");const c=new(0,(await Promise.resolve().then(()=>require("./FormView-C1emfj3B.js")).then(e=>e.FormView$1)).default)({fileHandling:e.fileHandling||"base64",model:a,data:e.data,defaults:e.defaults,formConfig:{fields:l||s.fields||[],...s,submitButton:!1,resetButton:!1}}),h=new Dialog({title:t,body:c,size:i,centered:o,buttons:[{text:r,class:"btn-secondary",action:"cancel"},{text:n,class:"btn-primary",action:"submit"}],...d}),u=document.querySelector(".table-fullscreen")||document.body;return await h.render(!0,u),h.show(),new Promise(e=>{let t=!1;h.on("action:submit",async()=>{if(!t){h.setLoading(!0,"Saving...");try{const s=await c.handleSubmit();if(s.success)t=!0,h.hide(),e(s);else{h.setLoading(!1);let e=s.error;s.data&&s.data.error&&(e=s.data.error),h.getApp().toast.error(e)}}catch(s){console.error("Error saving form:",s),await h.setContent(c),c.showError(s.message||"An error occurred while saving")}}}),h.on("action:cancel",()=>{t||(t=!0,h.hide(),e(null))}),h.on("hidden",()=>{t||(t=!0,e(null)),setTimeout(()=>{c.destroy(),h.destroy()},100)})})}static async showData(e={}){const{title:t="Data View",data:s={},model:i=null,fields:o=[],columns:n=2,responsive:r=!0,showEmptyValues:a=!1,emptyValueText:l="—",size:d="lg",centered:c=!0,closeText:h="Close",...u}=e,m=new(0,(await Promise.resolve().then(()=>require("./DataView-R_LkYBAw.js"))).default)({data:s,model:i,fields:o,columns:n,responsive:r,showEmptyValues:a,emptyValueText:l}),g=new Dialog({title:t,body:m,size:d,centered:c,buttons:[{text:h,class:"btn-secondary",value:"close"}],...u}),p=document.querySelector(".table-fullscreen")||document.body;return await g.render(!0,p),g.show(),new Promise(e=>{let t=!1;const s=g.element.querySelector(".modal-footer button");s?.addEventListener("click",()=>{t||(t=!0,g.hide(),e(!0))}),g.on("hidden",()=>{t||(t=!0,e(!0)),setTimeout(()=>{m.destroy(),g.destroy(),g.element.remove()},100)}),m.on("field:click",e=>{g.emit("dataview:field:click",e)}),m.on("error",e=>{g.emit("dataview:error",e)})})}}Dialog.showConfirm=Dialog.confirm,Dialog.showError=Dialog.alert;const t=/* @__PURE__ */Object.freeze(/* @__PURE__ */Object.defineProperty({__proto__:null,default:Dialog},Symbol.toStringTag,{value:"Module"}));exports.Dialog=Dialog,exports.EventBus=EventBus,exports.Router=Router,exports.WebApp=WebApp;
+//# sourceMappingURL=Dialog--hl_Uh6X.js.map