@coherent.js/nextjs 1.0.0-beta.2 → 1.0.0-beta.5

package/dist/index.js

@@ -23,6 +23,7 @@ function createPerformanceMonitor(options = {}) {
     },
     alerts: {
       enabled: true,
+      debounceMs: 5e3,
       rules: []
     },
     resources: {
@@ -184,7 +185,7 @@ function createPerformanceMonitor(options = {}) {
         const alertKey = `${rule.metric}-${rule.condition}-${rule.threshold}`;
         const lastTriggered = alertState.triggered.get(alertKey);
         const now = Date.now();
-        if (!lastTriggered || now - lastTriggered > 5e3) {
+        if (!lastTriggered || now - lastTriggered > opts.alerts.debounceMs) {
           alertState.triggered.set(alertKey, now);
           alertState.history.push({
             rule,
@@ -474,1951 +475,98 @@ function createPerformanceMonitor(options = {}) {
 var performanceMonitor2 = createPerformanceMonitor();
 
 // ../core/src/core/object-utils.js
-function deepClone(obj, seen = /* @__PURE__ */ new WeakMap()) {
-  if (obj === null || typeof obj !== "object") {
-    return obj;
-  }
-  if (seen.has(obj)) {
-    return seen.get(obj);
-  }
-  if (obj instanceof Date) {
-    return new Date(obj.getTime());
-  }
-  if (obj instanceof RegExp) {
-    return new RegExp(obj.source, obj.flags);
-  }
-  if (Array.isArray(obj)) {
-    const clonedArray = [];
-    seen.set(obj, clonedArray);
-    for (let i = 0; i < obj.length; i++) {
-      clonedArray[i] = deepClone(obj[i], seen);
-    }
-    return clonedArray;
-  }
-  if (typeof obj === "function") {
-    return obj;
-  }
-  if (obj instanceof Map) {
-    const clonedMap = /* @__PURE__ */ new Map();
-    seen.set(obj, clonedMap);
-    for (const [key, value] of obj) {
-      clonedMap.set(deepClone(key, seen), deepClone(value, seen));
-    }
-    return clonedMap;
-  }
-  if (obj instanceof Set) {
-    const clonedSet = /* @__PURE__ */ new Set();
-    seen.set(obj, clonedSet);
-    for (const value of obj) {
-      clonedSet.add(deepClone(value, seen));
-    }
-    return clonedSet;
-  }
-  if (obj instanceof WeakMap) {
-    return /* @__PURE__ */ new WeakMap();
-  }
-  if (obj instanceof WeakSet) {
-    return /* @__PURE__ */ new WeakSet();
-  }
-  const clonedObj = {};
-  seen.set(obj, clonedObj);
-  if (obj.constructor && obj.constructor !== Object) {
-    try {
-      clonedObj.__proto__ = obj.__proto__;
-    } catch {
-      Object.setPrototypeOf(clonedObj, Object.getPrototypeOf(obj));
-    }
-  }
-  for (const key in obj) {
-    if (obj.hasOwnProperty(key)) {
-      clonedObj[key] = deepClone(obj[key], seen);
-    }
-  }
-  const descriptors = Object.getOwnPropertyDescriptors(obj);
-  for (const key of Object.keys(descriptors)) {
-    if (!descriptors[key].enumerable && descriptors[key].configurable) {
-      try {
-        Object.defineProperty(clonedObj, key, {
-          ...descriptors[key],
-          value: deepClone(descriptors[key].value, seen)
-        });
-      } catch {
-      }
-    }
-  }
-  return clonedObj;
-}
-function validateComponent(component, path2 = "root") {
-  if (component === null || component === void 0) {
-    throw new Error(`Invalid component at ${path2}: null or undefined`);
-  }
-  if (["string", "number", "boolean"].includes(typeof component)) {
-    return true;
-  }
-  if (typeof component === "function") {
-    return true;
-  }
-  if (Array.isArray(component)) {
-    component.forEach((child, index) => {
-      validateComponent(child, `${path2}[${index}]`);
-    });
-    return true;
-  }
-  if (typeof component === "object") {
-    const keys = Object.keys(component);
-    if (keys.length === 0) {
-      throw new Error(`Empty object at ${path2}`);
-    }
-    keys.forEach((key) => {
-      const value = component[key];
-      if (!/^[a-zA-Z][a-zA-Z0-9-]*$/.test(key) && key !== "text") {
-        console.warn(`Potentially invalid tag name at ${path2}: ${key}`);
-      }
-      if (value && typeof value === "object" && !Array.isArray(value)) {
-        if (value.children) {
-          validateComponent(value.children, `${path2}.${key}.children`);
-        }
-      } else if (value && typeof value !== "string" && typeof value !== "number" && typeof value !== "function") {
-        throw new Error(`Invalid value type at ${path2}.${key}: ${typeof value}`);
-      }
-    });
-    return true;
-  }
-  throw new Error(`Invalid component type at ${path2}: ${typeof component}`);
-}
-function isCoherentObject(obj) {
-  if (!obj || typeof obj !== "object" || Array.isArray(obj)) {
-    return false;
-  }
-  const keys = Object.keys(obj);
-  if (keys.length === 0) {
-    return false;
-  }
-  return keys.every((key) => {
-    if (key === "text") return true;
-    return /^[a-zA-Z][a-zA-Z0-9-]*$/.test(key);
-  });
-}
-function extractProps(coherentObj) {
-  if (!isCoherentObject(coherentObj)) {
-    return {};
-  }
-  const props = {};
-  const keys = Object.keys(coherentObj);
-  keys.forEach((tag) => {
-    const value = coherentObj[tag];
-    if (value && typeof value === "object" && !Array.isArray(value)) {
-      props[tag] = { ...value };
-    } else {
-      props[tag] = { text: value };
-    }
-  });
-  return props;
-}
-function hasChildren(component) {
-  if (Array.isArray(component)) {
-    return component.length > 0;
-  }
-  if (isCoherentObject(component)) {
-    if (component.children !== void 0 && component.children !== null) {
-      return Array.isArray(component.children) ? component.children.length > 0 : true;
-    }
-    const keys = Object.keys(component);
-    return keys.some((key) => {
-      const value = component[key];
-      return value && typeof value === "object" && value.children;
-    });
-  }
-  return false;
-}
-function normalizeChildren(children) {
-  if (children === null || children === void 0) {
-    return [];
-  }
-  if (Array.isArray(children)) {
-    return children.flat().filter((child) => child !== null && child !== void 0);
-  }
-  return [children];
-}
-
-// ../core/src/components/component-system.js
-var COMPONENT_METADATA = /* @__PURE__ */ new WeakMap();
-var ComponentState = class {
-  constructor(initialState = {}) {
-    this.state = { ...initialState };
-    this.listeners = /* @__PURE__ */ new Set();
-    this.isUpdating = false;
-  }
-  /**
-   * Get state value by key or entire state
-   * 
-   * @param {string} [key] - State key to retrieve
-   * @returns {*} State value or entire state object
-   */
-  get(key) {
-    return key ? this.state[key] : { ...this.state };
-  }
-  /**
-   * Update state with new values
-   * 
-   * @param {Object} updates - State updates to apply
-   * @returns {ComponentState} This instance for chaining
-   */
-  set(updates) {
-    if (this.isUpdating) return this;
-    const oldState = { ...this.state };
-    if (typeof updates === "function") {
-      updates = updates(oldState);
-    }
-    this.state = { ...this.state, ...updates };
-    this.notifyListeners(oldState, this.state);
-    return this;
-  }
-  subscribe(listener) {
-    this.listeners.add(listener);
-    return () => this.listeners.delete(listener);
-  }
-  notifyListeners(oldState, newState) {
-    if (this.listeners.size === 0) return;
-    this.isUpdating = true;
-    this.listeners.forEach((listener) => {
-      try {
-        listener(newState, oldState);
-      } catch (_error) {
-        console.error("State listener _error:", _error);
-      }
-    });
-    this.isUpdating = false;
-  }
-};
-var Component = class _Component {
-  constructor(definition = {}) {
-    this.definition = definition;
-    this.name = definition.name || "AnonymousComponent";
-    this.props = {};
-    this.state = new ComponentState(definition.state || {});
-    this.children = [];
-    this.parent = null;
-    this.rendered = null;
-    this.isMounted = false;
-    this.isDestroyed = false;
-    this.hooks = {
-      beforeCreate: definition.beforeCreate || (() => {
-      }),
-      created: definition.created || (() => {
-      }),
-      beforeMount: definition.beforeMount || (() => {
-      }),
-      mounted: definition.mounted || (() => {
-      }),
-      beforeUpdate: definition.beforeUpdate || (() => {
-      }),
-      updated: definition.updated || (() => {
-      }),
-      beforeDestroy: definition.beforeDestroy || (() => {
-      }),
-      destroyed: definition.destroyed || (() => {
-      }),
-      errorCaptured: definition.errorCaptured || (() => {
-      })
-    };
-    this.methods = definition.methods || {};
-    Object.keys(this.methods).forEach((methodName) => {
-      if (typeof this.methods[methodName] === "function") {
-        this[methodName] = this.methods[methodName].bind(this);
-      }
-    });
-    this.computed = definition.computed || {};
-    this.computedCache = /* @__PURE__ */ new Map();
-    this.watchers = definition.watch || {};
-    this.setupWatchers();
-    COMPONENT_METADATA.set(this, {
-      createdAt: Date.now(),
-      updateCount: 0,
-      renderCount: 0
-    });
-    this.callHook("beforeCreate");
-    this.initialize();
-    this.callHook("created");
-  }
-  /**
-   * Initialize component
-   */
-  initialize() {
-    this.unsubscribeState = this.state.subscribe((newState, oldState) => {
-      this.onStateChange(newState, oldState);
-    });
-    this.initializeComputed();
-  }
-  /**
-   * Set up watchers for reactive data
-   */
-  setupWatchers() {
-    Object.keys(this.watchers).forEach((key) => {
-      const handler = this.watchers[key];
-      this.state.subscribe((newState, oldState) => {
-        if (newState[key] !== oldState[key]) {
-          handler.call(this, newState[key], oldState[key]);
-        }
-      });
-    });
-  }
-  /**
-   * Initialize computed properties
-   */
-  initializeComputed() {
-    Object.keys(this.computed).forEach((key) => {
-      Object.defineProperty(this, key, {
-        get: () => {
-          if (!this.computedCache.has(key)) {
-            const value = this.computed[key].call(this);
-            this.computedCache.set(key, value);
-          }
-          return this.computedCache.get(key);
-        },
-        enumerable: true
-      });
-    });
-  }
-  /**
-   * Handle state changes
-   */
-  onStateChange() {
-    if (this.isDestroyed) return;
-    this.computedCache.clear();
-    if (this.isMounted) {
-      this.update();
-    }
-  }
-  /**
-   * Call lifecycle hook
-   */
-  callHook(hookName, ...args) {
-    try {
-      if (this.hooks[hookName]) {
-        return this.hooks[hookName].call(this, ...args);
-      }
-    } catch (_error) {
-      this.handleError(_error, `${hookName} hook`);
-    }
-  }
-  /**
-   * Handle component errors
-   */
-  handleError(_error) {
-    console.error(`Component Error in ${this.name}:`, _error);
-    this.callHook("errorCaptured", _error);
-    if (this.parent && this.parent.handleError) {
-      this.parent.handleError(_error, `${this.name} -> ${context}`);
-    }
-  }
-  /**
-   * Render the component
-   */
-  render(props = {}) {
-    if (this.isDestroyed) {
-      console.warn(`Attempting to render destroyed component: ${this.name}`);
-      return null;
-    }
-    try {
-      const metadata = COMPONENT_METADATA.get(this);
-      if (metadata) {
-        metadata.renderCount++;
-      }
-      this.props = { ...props };
-      if (typeof this.definition.render === "function") {
-        this.rendered = this.definition.render.call(this, this.props, this.state.get());
-      } else if (typeof this.definition.template !== "undefined") {
-        this.rendered = this.processTemplate(this.definition.template, this.props, this.state.get());
-      } else {
-        throw new Error(`Component ${this.name} must have either render method or template`);
-      }
-      if (this.rendered !== null) {
-        validateComponent(this.rendered, this.name);
-      }
-      return this.rendered;
-    } catch (_error) {
-      this.handleError(_error);
-      return { div: { className: "component-_error", text: `Error in ${this.name}` } };
-    }
-  }
-  /**
-   * Process template with data
-   */
-  processTemplate(template, props, state) {
-    if (typeof template === "function") {
-      return template.call(this, props, state);
-    }
-    if (typeof template === "string") {
-      return template.replace(/\{\{(\w+)\}\}/g, (match, key) => {
-        return props[key] || state[key] || "";
-      });
-    }
-    const processed = deepClone(template);
-    this.interpolateObject(processed, { ...props, ...state });
-    return processed;
-  }
-  /**
-   * Interpolate object with data
-   */
-  interpolateObject(obj, data) {
-    if (typeof obj === "string") {
-      return obj.replace(/\{\{(\w+)\}\}/g, (match, key) => data[key] || "");
-    }
-    if (Array.isArray(obj)) {
-      return obj.map((item) => this.interpolateObject(item, data));
-    }
-    if (obj && typeof obj === "object") {
-      Object.keys(obj).forEach((key) => {
-        obj[key] = this.interpolateObject(obj[key], data);
-      });
-    }
-    return obj;
-  }
-  /**
-   * Mount the component
-   */
-  mount() {
-    if (this.isMounted || this.isDestroyed) return this;
-    this.callHook("beforeMount");
-    this.isMounted = true;
-    this.callHook("mounted");
-    return this;
-  }
-  /**
-   * Update the component
-   */
-  update() {
-    if (!this.isMounted || this.isDestroyed) return this;
-    const metadata = COMPONENT_METADATA.get(this);
-    if (metadata) {
-      metadata.updateCount++;
-    }
-    this.callHook("beforeUpdate");
-    this.callHook("updated");
-    return this;
-  }
-  /**
-   * Destroy the component
-   */
-  destroy() {
-    if (this.isDestroyed) return this;
-    this.callHook("beforeDestroy");
-    if (this.unsubscribeState) {
-      this.unsubscribeState();
-    }
-    this.children.forEach((child) => {
-      if (child.destroy) {
-        child.destroy();
-      }
-    });
-    this.isMounted = false;
-    this.isDestroyed = true;
-    this.children = [];
-    this.parent = null;
-    this.callHook("destroyed");
-    return this;
-  }
-  /**
-   * Get component metadata
-   */
-  getMetadata() {
-    return COMPONENT_METADATA.get(this) || {};
-  }
-  /**
-   * Clone component with new props/state
-   */
-  clone(overrides = {}) {
-    const newDefinition = { ...this.definition, ...overrides };
-    return new _Component(newDefinition);
-  }
-};
-if (performanceMonitor2) {
-  const originalRender = Component.prototype.render;
-  Component.prototype.render = function(...args) {
-    const start = performance.now();
-    const result = originalRender.apply(this, args);
-    const duration = performance.now() - start;
-    performanceMonitor2.recordMetric("renderTime", duration, {
-      type: "component",
-      name: this.name,
-      propsSize: JSON.stringify(this.props || {}).length,
-      hasState: Object.keys(this.state?.get() || {}).length > 0
-    });
-    return result;
-  };
-}
-
-// ../core/src/utils/error-handler.js
-var CoherentError = class _CoherentError extends Error {
-  constructor(message, options = {}) {
-    super(message);
-    this.name = "CoherentError";
-    this.type = options.type || "generic";
-    this.component = options.component;
-    this.context = options.context;
-    this.suggestions = options.suggestions || [];
-    this.timestamp = Date.now();
-    if (Error.captureStackTrace) {
-      Error.captureStackTrace(this, _CoherentError);
-    }
-  }
-  toJSON() {
-    return {
-      name: this.name,
-      message: this.message,
-      type: this.type,
-      component: this.component,
-      context: this.context,
-      suggestions: this.suggestions,
-      timestamp: this.timestamp,
-      stack: this.stack
-    };
-  }
-};
-var ComponentValidationError = class extends CoherentError {
-  constructor(message, component, suggestions = []) {
-    super(message, {
-      type: "validation",
-      component,
-      suggestions: [
-        "Check component structure and syntax",
-        "Ensure all required properties are present",
-        "Validate prop types and values",
-        ...suggestions
-      ]
-    });
-    this.name = "ComponentValidationError";
-  }
-};
-var RenderingError = class extends CoherentError {
-  constructor(message, component, context2, suggestions = []) {
-    super(message, {
-      type: "rendering",
-      component,
-      context: context2,
-      suggestions: [
-        "Check for circular references",
-        "Validate component depth",
-        "Ensure all functions return valid components",
-        ...suggestions
-      ]
-    });
-    this.name = "RenderingError";
-  }
-};
-var PerformanceError = class extends CoherentError {
-  constructor(message, metrics, suggestions = []) {
-    super(message, {
-      type: "performance",
-      context: metrics,
-      suggestions: [
-        "Consider component memoization",
-        "Reduce component complexity",
-        "Enable caching",
-        ...suggestions
-      ]
-    });
-    this.name = "PerformanceError";
-  }
-};
-var StateError = class extends CoherentError {
-  constructor(message, state, suggestions = []) {
-    super(message, {
-      type: "state",
-      context: state,
-      suggestions: [
-        "Check state mutations",
-        "Ensure proper state initialization",
-        "Validate state transitions",
-        ...suggestions
-      ]
-    });
-    this.name = "StateError";
-  }
-};
-var ErrorHandler = class {
-  constructor(options = {}) {
-    this.options = {
-      enableStackTrace: options.enableStackTrace !== false,
-      enableSuggestions: options.enableSuggestions !== false,
-      enableLogging: options.enableLogging !== false,
-      logLevel: options.logLevel || "_error",
-      maxErrorHistory: options.maxErrorHistory || 100,
-      ...options
-    };
-    this.errorHistory = [];
-    this.errorCounts = /* @__PURE__ */ new Map();
-    this.suppressedErrors = /* @__PURE__ */ new Set();
-  }
-  /**
-   * Handle and report errors with detailed context
-   */
-  handle(_error, context2 = {}) {
-    const enhancedError = this.enhanceError(_error, context2);
-    this.addToHistory(enhancedError);
-    if (this.options.enableLogging) {
-      this.logError(enhancedError);
-    }
-    return enhancedError;
-  }
-  /**
-   * Enhance existing errors with more context
-   */
-  enhanceError(_error, context2 = {}) {
-    if (_error instanceof CoherentError) {
-      return _error;
-    }
-    const errorType = this.classifyError(_error, context2);
-    switch (errorType) {
-      case "validation":
-        return new ComponentValidationError(
-          _error.message,
-          context2.component,
-          this.generateSuggestions(_error, context2)
-        );
-      case "rendering":
-        return new RenderingError(
-          _error.message,
-          context2.component,
-          context2.renderContext,
-          this.generateSuggestions(_error, context2)
-        );
-      case "performance":
-        return new PerformanceError(
-          _error.message,
-          context2.metrics,
-          this.generateSuggestions(_error, context2)
-        );
-      case "state":
-        return new StateError(
-          _error.message,
-          context2.state,
-          this.generateSuggestions(_error, context2)
-        );
-      default:
-        return new CoherentError(_error.message, {
-          type: errorType,
-          component: context2.component,
-          context: context2.context,
-          suggestions: this.generateSuggestions(_error, context2)
-        });
-    }
-  }
-  /**
-   * Classify _error type based on message and context
-   */
-  classifyError(_error, context2) {
-    const message = _error.message.toLowerCase();
-    if (message.includes("invalid") || message.includes("validation") || message.includes("required") || message.includes("type")) {
-      return "validation";
-    }
-    if (message.includes("render") || message.includes("circular") || message.includes("depth") || message.includes("cannot render")) {
-      return "rendering";
-    }
-    if (message.includes("slow") || message.includes("memory") || message.includes("performance") || message.includes("timeout")) {
-      return "performance";
-    }
-    if (message.includes("state") || message.includes("mutation") || message.includes("store") || context2.state) {
-      return "state";
-    }
-    if (context2.component) return "validation";
-    if (context2.renderContext) return "rendering";
-    if (context2.metrics) return "performance";
-    return "generic";
-  }
-  /**
-   * Generate helpful suggestions based on _error
-   */
-  generateSuggestions(_error, context2 = {}) {
-    const suggestions = [];
-    const message = _error.message.toLowerCase();
-    const patterns = [
-      {
-        pattern: /cannot render|render.*failed/,
-        suggestions: [
-          "Check if component returns a valid object structure",
-          "Ensure all properties are properly defined",
-          "Look for undefined variables or null references"
-        ]
-      },
-      {
-        pattern: /circular.*reference/,
-        suggestions: [
-          "Remove circular references between components",
-          "Use lazy loading or memoization to break cycles",
-          "Check for self-referencing components"
-        ]
-      },
-      {
-        pattern: /maximum.*depth/,
-        suggestions: [
-          "Reduce component nesting depth",
-          "Break complex components into smaller parts",
-          "Check for infinite recursion in component functions"
-        ]
-      },
-      {
-        pattern: /invalid.*component/,
-        suggestions: [
-          "Ensure component follows the expected object structure",
-          "Check property names and values for typos",
-          "Verify component is not null or undefined"
-        ]
-      },
-      {
-        pattern: /performance|slow|timeout/,
-        suggestions: [
-          "Enable component caching",
-          "Use memoization for expensive operations",
-          "Reduce component complexity",
-          "Consider lazy loading for large components"
-        ]
-      }
-    ];
-    patterns.forEach(({ pattern, suggestions: patternSuggestions }) => {
-      if (pattern.test(message)) {
-        suggestions.push(...patternSuggestions);
-      }
-    });
-    if (context2.component) {
-      const componentType = typeof context2.component;
-      if (componentType === "function") {
-        suggestions.push("Check function component return value");
-      } else if (componentType === "object" && context2.component === null) {
-        suggestions.push("Component is null - ensure proper initialization");
-      } else if (Array.isArray(context2.component)) {
-        suggestions.push("Arrays should contain valid component objects");
-      }
-    }
-    if (suggestions.length === 0) {
-      suggestions.push(
-        "Enable development tools for more detailed debugging",
-        "Check browser console for additional _error details",
-        "Use component validation tools to identify issues"
-      );
-    }
-    return [...new Set(suggestions)];
-  }
-  /**
-   * Add _error to history with deduplication
-   */
-  addToHistory(_error) {
-    const errorKey = `${_error.name}:${_error.message}`;
-    this.errorCounts.set(errorKey, (this.errorCounts.get(errorKey) || 0) + 1);
-    const historyEntry = {
-      ..._error.toJSON(),
-      count: this.errorCounts.get(errorKey),
-      firstSeen: this.errorHistory.find((e) => e.key === errorKey)?.firstSeen || _error.timestamp,
-      key: errorKey
-    };
-    this.errorHistory = this.errorHistory.filter((e) => e.key !== errorKey);
-    this.errorHistory.unshift(historyEntry);
-    if (this.errorHistory.length > this.options.maxErrorHistory) {
-      this.errorHistory = this.errorHistory.slice(0, this.options.maxErrorHistory);
-    }
-  }
-  /**
-   * Log _error with enhanced formatting
-   */
-  logError(_error) {
-    if (this.suppressedErrors.has(`${_error.name}:${_error.message}`)) {
-      return;
-    }
-    const isRepeated = this.errorCounts.get(`${_error.name}:${_error.message}`) > 1;
-    const errorGroup = `\u{1F6A8} ${_error.name}${isRepeated ? ` (\xD7${this.errorCounts.get(`${_error.name}:${_error.message}`)})` : ""}`;
-    console.group(errorGroup);
-    console.error(`\u274C ${_error.message}`);
-    if (_error.component) {
-      console.log("\u{1F50D} Component:", this.formatComponent(_error.component));
-    }
-    if (_error.context) {
-      console.log("\u{1F4CB} Context:", _error.context);
-    }
-    if (this.options.enableSuggestions && _error.suggestions.length > 0) {
-      console.group("\u{1F4A1} Suggestions:");
-      _error.suggestions.forEach((suggestion, index) => {
-        console.log(`${index + 1}. ${suggestion}`);
-      });
-      console.groupEnd();
-    }
-    if (this.options.enableStackTrace && _error.stack) {
-      console.log("\u{1F4DA} Stack trace:", _error.stack);
-    }
-    console.groupEnd();
-  }
-  /**
-   * Format component for logging
-   */
-  formatComponent(component, maxDepth = 2, currentDepth = 0) {
-    if (currentDepth > maxDepth) {
-      return "[...deep]";
-    }
-    if (typeof component === "function") {
-      return `[Function: ${component.name || "anonymous"}]`;
-    }
-    if (Array.isArray(component)) {
-      return component.slice(0, 3).map(
-        (item) => this.formatComponent(item, maxDepth, currentDepth + 1)
-      );
-    }
-    if (component && typeof component === "object") {
-      const formatted = {};
-      const keys = Object.keys(component).slice(0, 5);
-      for (const key of keys) {
-        if (key === "children" && component[key]) {
-          formatted[key] = this.formatComponent(component[key], maxDepth, currentDepth + 1);
-        } else {
-          formatted[key] = component[key];
-        }
-      }
-      if (Object.keys(component).length > 5) {
-        formatted["..."] = `(${Object.keys(component).length - 5} more)`;
-      }
-      return formatted;
-    }
-    return component;
-  }
-  /**
-   * Suppress specific _error types
-   */
-  suppress(errorPattern) {
-    this.suppressedErrors.add(errorPattern);
-  }
-  /**
-   * Clear _error history
-   */
-  clearHistory() {
-    this.errorHistory = [];
-    this.errorCounts.clear();
-  }
-  /**
-   * Get _error statistics
-   */
-  getStats() {
-    const errorsByType = {};
-    const errorsByTime = {};
-    this.errorHistory.forEach((_error) => {
-      errorsByType[_error.type] = (errorsByType[_error.type] || 0) + _error.count;
-      const hour = new Date(_error.timestamp).toISOString().slice(0, 13);
-      errorsByTime[hour] = (errorsByTime[hour] || 0) + _error.count;
-    });
-    return {
-      totalErrors: this.errorHistory.reduce((sum, e) => sum + e.count, 0),
-      uniqueErrors: this.errorHistory.length,
-      errorsByType,
-      errorsByTime,
-      mostCommonErrors: this.getMostCommonErrors(5),
-      recentErrors: this.errorHistory.slice(0, 10)
-    };
-  }
-  /**
-   * Get most common errors
-   */
-  getMostCommonErrors(limit = 10) {
-    return this.errorHistory.sort((a, b) => b.count - a.count).slice(0, limit).map(({ name, message, count, type }) => ({
-      name,
-      message,
-      count,
-      type
-    }));
-  }
-};
-var globalErrorHandler = new ErrorHandler();
-
-// ../core/src/components/lifecycle.js
-var LIFECYCLE_PHASES = {
-  BEFORE_CREATE: "beforeCreate",
-  CREATED: "created",
-  BEFORE_MOUNT: "beforeMount",
-  MOUNTED: "mounted",
-  BEFORE_UPDATE: "beforeUpdate",
-  UPDATED: "updated",
-  BEFORE_UNMOUNT: "beforeUnmount",
-  UNMOUNTED: "unmounted",
-  ERROR: "_error"
-};
-var componentInstances = /* @__PURE__ */ new WeakMap();
-var ComponentEventSystem = class {
-  constructor() {
-    this.events = /* @__PURE__ */ new Map();
-    this.globalHandlers = /* @__PURE__ */ new Map();
-  }
-  /**
-   * Emit event to component or globally
-   */
-  emit(eventName, data = {}, target = null) {
-    const event = {
-      name: eventName,
-      data,
-      target,
-      timestamp: Date.now(),
-      stopped: false,
-      preventDefault: false
-    };
-    if (target) {
-      const instance = componentInstances.get(target);
-      if (instance) {
-        this._notifyHandlers(instance.id, event);
-      }
-    } else {
-      this._notifyGlobalHandlers(event);
-    }
-    return event;
-  }
-  /**
-   * Listen for events on component or globally
-   */
-  on(eventName, handler, componentId = null) {
-    if (componentId) {
-      if (!this.events.has(componentId)) {
-        this.events.set(componentId, /* @__PURE__ */ new Map());
-      }
-      const componentEvents = this.events.get(componentId);
-      if (!componentEvents.has(eventName)) {
-        componentEvents.set(eventName, /* @__PURE__ */ new Set());
-      }
-      componentEvents.get(eventName).add(handler);
-    } else {
-      if (!this.globalHandlers.has(eventName)) {
-        this.globalHandlers.set(eventName, /* @__PURE__ */ new Set());
-      }
-      this.globalHandlers.get(eventName).add(handler);
-    }
-    return () => this.off(eventName, handler, componentId);
-  }
-  /**
-   * Remove event handler
-   */
-  off(eventName, handler, componentId = null) {
-    if (componentId) {
-      const componentEvents = this.events.get(componentId);
-      if (componentEvents && componentEvents.has(eventName)) {
-        componentEvents.get(eventName).delete(handler);
-        if (componentEvents.get(eventName).size === 0) {
-          componentEvents.delete(eventName);
-          if (componentEvents.size === 0) {
-            this.events.delete(componentId);
-          }
-        }
-      }
-    } else {
-      const handlers = this.globalHandlers.get(eventName);
-      if (handlers) {
-        handlers.delete(handler);
-        if (handlers.size === 0) {
-          this.globalHandlers.delete(eventName);
-        }
-      }
-    }
-  }
-  /**
-   * Listen once
-   */
-  once(eventName, handler, componentId = null) {
-    const onceHandler = (event) => {
-      handler(event);
-      this.off(eventName, onceHandler, componentId);
-    };
-    return this.on(eventName, onceHandler, componentId);
-  }
-  /**
-   * Notify component handlers
-   */
-  _notifyHandlers(componentId, event) {
-    const componentEvents = this.events.get(componentId);
-    if (componentEvents && componentEvents.has(event.name)) {
-      const handlers = componentEvents.get(event.name);
-      for (const handler of handlers) {
-        if (event.stopped) break;
-        try {
-          handler(event);
-        } catch (_error) {
-          globalErrorHandler.handle(_error, {
-            type: "event-handler-_error",
-            context: { event, handler: handler.toString() }
-          });
-        }
-      }
-    }
-  }
-  /**
-   * Notify global handlers
-   */
-  _notifyGlobalHandlers(event) {
-    const handlers = this.globalHandlers.get(event.name);
-    if (handlers) {
-      for (const handler of handlers) {
-        if (event.stopped) break;
-        try {
-          handler(event);
-        } catch (_error) {
-          globalErrorHandler.handle(_error, {
-            type: "global-event-handler-_error",
-            context: { event, handler: handler.toString() }
-          });
-        }
-      }
-    }
-  }
-  /**
-   * Clean up events for a component
-   */
-  cleanup(componentId) {
-    this.events.delete(componentId);
-  }
-  /**
-   * Get event statistics
-   */
-  getStats() {
-    return {
-      componentEvents: this.events.size,
-      globalEvents: this.globalHandlers.size,
-      totalHandlers: Array.from(this.events.values()).reduce((sum, events) => {
-        return sum + Array.from(events.values()).reduce((eventSum, handlers) => {
-          return eventSum + handlers.size;
-        }, 0);
-      }, 0) + Array.from(this.globalHandlers.values()).reduce((sum, handlers) => {
-        return sum + handlers.size;
-      }, 0)
-    };
-  }
-};
-var eventSystem = new ComponentEventSystem();
-function createLifecycleHooks() {
-  const hooks = {};
-  Object.values(LIFECYCLE_PHASES).forEach((phase) => {
-    hooks[phase] = (callback) => {
-      const instance = getCurrentInstance();
-      if (instance) {
-        instance.hook(phase, callback);
-      }
-    };
-  });
-  return hooks;
-}
-var currentInstance = null;
-function getCurrentInstance() {
-  return currentInstance;
-}
-var useHooks = createLifecycleHooks();
-
-// ../core/src/events/event-bus.js
-function throttle(func, delay) {
-  let lastCall = 0;
-  let timeoutId = null;
-  return function throttled(...args) {
-    const now = Date.now();
-    const timeSinceLastCall = now - lastCall;
-    if (timeSinceLastCall >= delay) {
-      lastCall = now;
-      return func.apply(this, args);
-    } else {
-      if (timeoutId) clearTimeout(timeoutId);
-      timeoutId = setTimeout(() => {
-        lastCall = Date.now();
-        func.apply(this, args);
-      }, delay - timeSinceLastCall);
-    }
-  };
-}
-var EventBus = class {
-  constructor(options = {}) {
-    this.listeners = /* @__PURE__ */ new Map();
-    this.handlers = /* @__PURE__ */ new Map();
-    this.actionHandlers = /* @__PURE__ */ new Map();
-    this.middleware = [];
-    this.throttledEmitters = /* @__PURE__ */ new Map();
-    this.debouncedEmitters = /* @__PURE__ */ new Map();
-    this.options = {
-      debug: false,
-      performance: true,
-      maxListeners: 100,
-      enableWildcards: true,
-      enableAsync: true,
-      wildcardSeparator: ":",
-      enablePriority: true,
-      defaultPriority: 0,
-      errorHandler: null,
-      filters: {
-        allowList: null,
-        // null means allow all
-        blockList: []
-      },
-      throttle: {
-        enabled: false,
-        defaultDelay: 100,
-        events: {}
-      },
-      batching: {
-        enabled: false,
-        maxBatchSize: 10,
-        flushInterval: 16
-      },
-      ...options
-    };
-    this.stats = {
-      eventsEmitted: 0,
-      listenersExecuted: 0,
-      errorsOccurred: 0,
-      averageEmitTime: 0,
-      throttledEvents: 0,
-      filteredEvents: 0
-    };
-    if (this.options.batching.enabled) {
-      this.batchQueue = [];
-      this.batchTimer = null;
-    }
-    if (this.options.debug) {
-      this.use((event, data, next) => {
-        console.log(`[EventBus] ${event}:`, data);
-        next();
-      });
-    }
-  }
-  /**
-   * Add middleware
-   */
-  use(middleware) {
-    if (typeof middleware !== "function") {
-      throw new Error("Middleware must be a function");
-    }
-    this.middleware.push(middleware);
-    return this;
-  }
-  /**
-   * Check if event passes filters
-   */
-  passesFilters(event) {
-    const { allowList, blockList } = this.options.filters;
-    if (blockList && blockList.length > 0) {
-      for (const pattern of blockList) {
-        if (this.matchPattern(pattern, event)) {
-          this.stats.filteredEvents++;
-          return false;
-        }
-      }
-    }
-    if (allowList && allowList.length > 0) {
-      for (const pattern of allowList) {
-        if (this.matchPattern(pattern, event)) {
-          return true;
-        }
-      }
-      this.stats.filteredEvents++;
-      return false;
-    }
-    return true;
-  }
-  /**
-   * Match event against pattern
-   */
-  matchPattern(pattern, event) {
-    const sep = this.options.wildcardSeparator;
-    const patternParts = pattern.split(sep);
-    const eventParts = event.split(sep);
-    if (pattern.includes("*")) {
-      if (patternParts.length !== eventParts.length) {
-        return false;
-      }
-      return patternParts.every((part, i) => part === "*" || part === eventParts[i]);
-    }
-    return pattern === event;
-  }
-  /**
-   * Emit an event
-   */
-  async emit(event, data = null) {
-    if (!this.passesFilters(event)) {
-      if (this.options.debug) {
-        console.warn(`[EventBus] Event filtered: ${event}`);
-      }
-      return;
-    }
-    if (this.options.batching.enabled) {
-      return this.addToBatch(event, data);
-    }
-    if (this.options.throttle.enabled) {
-      const throttleDelay = this.options.throttle.events && this.options.throttle.events[event] || this.options.throttle.defaultDelay;
-      if (throttleDelay > 0) {
-        return this.emitThrottled(event, data, throttleDelay);
-      }
-    }
-    return this.emitImmediate(event, data);
-  }
-  /**
-   * Emit immediately without throttling
-   */
-  async emitImmediate(event, data = null) {
-    const startTime = this.options.performance ? performance.now() : 0;
-    try {
-      await this.runMiddleware(event, data);
-      const listeners = this.getEventListeners(event);
-      if (listeners.length === 0) {
-        if (this.options.debug) {
-          console.warn(`[EventBus] No listeners for event: ${event}`);
-        }
-        return;
-      }
-      const promises = listeners.map(
-        (listenerObj) => this.executeListener(listenerObj.listener, event, data, listenerObj.options)
-      );
-      if (this.options.enableAsync) {
-        await Promise.allSettled(promises);
-      } else {
-        for (const promise of promises) {
-          await promise;
-        }
-      }
-      this.stats.eventsEmitted++;
-      this.stats.listenersExecuted += listeners.length;
-    } catch (error) {
-      this.stats.errorsOccurred++;
-      this.handleError(error, event, data);
-    } finally {
-      if (this.options.performance) {
-        const duration = performance.now() - startTime;
-        this.updatePerformanceStats(duration);
-      }
-    }
-  }
-  /**
-   * Emit with throttling
-   */
-  emitThrottled(event, data, delay) {
-    if (!this.throttledEmitters.has(event)) {
-      const throttled = throttle((evt, d) => this.emitImmediate(evt, d), delay);
-      this.throttledEmitters.set(event, throttled);
-    }
-    this.stats.throttledEvents++;
-    return this.throttledEmitters.get(event)(event, data);
-  }
-  /**
-   * Add event to batch queue
-   */
-  addToBatch(event, data) {
-    this.batchQueue.push({ event, data, timestamp: Date.now() });
-    if (this.batchQueue.length >= this.options.batching.maxBatchSize) {
-      this.flushBatch();
-    } else if (!this.batchTimer) {
-      this.batchTimer = setTimeout(() => {
-        this.flushBatch();
-      }, this.options.batching.flushInterval);
-    }
-  }
-  /**
-   * Flush batch queue
-   */
-  async flushBatch() {
-    if (this.batchTimer) {
-      clearTimeout(this.batchTimer);
-      this.batchTimer = null;
-    }
-    const batch = this.batchQueue.splice(0);
-    for (const { event, data } of batch) {
-      await this.emitImmediate(event, data);
-    }
-  }
-  /**
-   * Register event listener with options
-   */
-  on(event, listener, options = {}) {
-    if (typeof listener !== "function") {
-      throw new Error("Listener must be a function");
-    }
-    if (!this.listeners.has(event)) {
-      this.listeners.set(event, []);
-    }
-    const listeners = this.listeners.get(event);
-    if (listeners.length >= this.options.maxListeners) {
-      console.warn(`[EventBus] Max listeners (${this.options.maxListeners}) reached for event: ${event}`);
-    }
-    const listenerId = this.generateListenerId(event);
-    const listenerObj = {
-      listener,
-      listenerId,
-      priority: options.priority !== void 0 ? options.priority : this.options.defaultPriority,
-      condition: options.condition || null,
-      timeout: options.timeout || null,
-      options
-    };
-    listener.__listenerId = listenerId;
-    listener.__event = event;
-    if (this.options.enablePriority) {
-      const insertIndex = listeners.findIndex((l) => l.priority < listenerObj.priority);
-      if (insertIndex === -1) {
-        listeners.push(listenerObj);
-      } else {
-        listeners.splice(insertIndex, 0, listenerObj);
-      }
-    } else {
-      listeners.push(listenerObj);
-    }
-    return listenerId;
-  }
-  /**
-   * Register one-time listener
-   */
-  once(event, listener, options = {}) {
-    const onceListener = (...args) => {
-      this.off(event, onceListener.__listenerId);
-      return listener.call(this, ...args);
-    };
-    if (options.timeout) {
-      const timeoutId = setTimeout(() => {
-        this.off(event, onceListener.__listenerId);
-        if (this.options.debug) {
-          console.warn(`[EventBus] Listener timeout for event: ${event}`);
-        }
-      }, options.timeout);
-      onceListener.__cleanup = () => clearTimeout(timeoutId);
-    }
-    return this.on(event, onceListener, options);
-  }
-  /**
-   * Remove listener
-   */
-  off(event, listenerId) {
-    if (!this.listeners.has(event)) {
-      return false;
-    }
-    const listeners = this.listeners.get(event);
-    const index = listeners.findIndex((l) => l.listenerId === listenerId);
-    if (index !== -1) {
-      const listenerObj = listeners[index];
-      if (listenerObj.listener.__cleanup) {
-        listenerObj.listener.__cleanup();
-      }
-      listeners.splice(index, 1);
-      if (listeners.length === 0) {
-        this.listeners.delete(event);
-      }
-      return true;
-    }
-    return false;
-  }
-  /**
-   * Remove all listeners for an event
-   */
-  removeAllListeners(event) {
-    if (event) {
-      this.listeners.delete(event);
-    } else {
-      this.listeners.clear();
-    }
-  }
-  /**
-   * Get event listeners with wildcard support
-   */
-  getEventListeners(event) {
-    const listeners = [];
-    if (this.listeners.has(event)) {
-      listeners.push(...this.listeners.get(event));
-    }
-    if (this.options.enableWildcards) {
-      for (const [pattern, patternListeners] of this.listeners) {
-        if (pattern.includes("*") && this.matchPattern(pattern, event)) {
-          listeners.push(...patternListeners);
-        }
-      }
-    }
-    if (this.options.enablePriority) {
-      listeners.sort((a, b) => b.priority - a.priority);
-    }
-    return listeners;
-  }
-  /**
-   * Execute listener with options
-   */
-  async executeListener(listener, event, data, options = {}) {
-    try {
-      if (options.condition && !options.condition(data)) {
-        return;
-      }
-      const result = listener.call(this, data, event);
-      if (result && typeof result.then === "function") {
-        await result;
-      }
-      return result;
-    } catch (error) {
-      this.handleError(error, event, data);
-    }
-  }
-  /**
-   * Run middleware chain
-   */
-  async runMiddleware(event, data) {
-    if (this.middleware.length === 0) return;
-    let index = 0;
-    const next = async () => {
-      if (index < this.middleware.length) {
-        const middleware = this.middleware[index++];
-        await middleware(event, data, next);
-      }
-    };
-    await next();
-  }
-  /**
-   * Handle errors
-   */
-  handleError(error, event, data) {
-    if (this.options.errorHandler) {
-      this.options.errorHandler(error, event, data);
-    } else if (this.options.debug) {
-      console.error(`[EventBus] Error in event ${event}:`, error, data);
-    }
-    this.emitSync("eventbus:error", { error, event, data });
+function validateComponent(component, path = "root") {
+  if (component === null || component === void 0) {
+    throw new Error(`Invalid component at ${path}: null or undefined`);
   }
-  /**
-   * Synchronous emit
-   */
-  emitSync(event, data = null) {
-    try {
-      const listeners = this.getEventListeners(event);
-      listeners.forEach((listenerObj) => {
-        try {
-          if (!listenerObj.options.condition || listenerObj.options.condition(data)) {
-            listenerObj.listener.call(this, data, event);
-          }
-        } catch (error) {
-          this.handleError(error, event, data);
-        }
-      });
-      this.stats.eventsEmitted++;
-      this.stats.listenersExecuted += listeners.length;
-    } catch (error) {
-      this.stats.errorsOccurred++;
-      this.handleError(error, event, data);
-    }
+  if (["string", "number", "boolean"].includes(typeof component)) {
+    return true;
   }
-  /**
-   * Register action handler
-   */
-  registerAction(action, handler) {
-    if (typeof handler !== "function") {
-      throw new Error("Action handler must be a function");
-    }
-    this.actionHandlers.set(action, handler);
-    if (this.options.debug) {
-      console.log(`[EventBus] Registered action: ${action}`);
-    }
+  if (typeof component === "function") {
+    return true;
   }
-  /**
-   * Register multiple actions
-   */
-  registerActions(actions) {
-    Object.entries(actions).forEach(([action, handler]) => {
-      this.registerAction(action, handler);
+  if (Array.isArray(component)) {
+    component.forEach((child, index) => {
+      validateComponent(child, `${path}[${index}]`);
     });
+    return true;
   }
-  /**
-   * Get registered actions
-   */
-  getRegisteredActions() {
-    return Array.from(this.actionHandlers.keys());
-  }
-  /**
-   * Handle action event (called by DOM integration)
-   */
-  handleAction(action, element, event, data) {
-    const handler = this.actionHandlers.get(action);
-    if (!handler) {
-      if (this.options.debug) {
-        console.warn(`[EventBus] No handler registered for action: ${action}`);
-      }
-      return;
-    }
-    try {
-      handler.call(element, {
-        element,
-        event,
-        data,
-        emit: this.emit.bind(this),
-        emitSync: this.emitSync.bind(this)
-      });
-    } catch (error) {
-      this.handleError(error, `action:${action}`, { element, event, data });
-    }
-  }
-  /**
-   * Generate unique listener ID
-   */
-  generateListenerId(event) {
-    return `${event}_${Date.now()}_${Math.random().toString(36).substr(2, 9)}`;
-  }
-  /**
-   * Update performance stats
-   */
-  updatePerformanceStats(duration) {
-    const count = this.stats.eventsEmitted;
-    this.stats.averageEmitTime = (this.stats.averageEmitTime * (count - 1) + duration) / count;
-  }
-  /**
-   * Get statistics
-   */
-  getStats() {
-    return { ...this.stats };
-  }
-  /**
-   * Reset statistics
-   */
-  resetStats() {
-    this.stats = {
-      eventsEmitted: 0,
-      listenersExecuted: 0,
-      errorsOccurred: 0,
-      averageEmitTime: 0,
-      throttledEvents: 0,
-      filteredEvents: 0
-    };
-  }
-  /**
-   * Destroy event bus
-   */
-  destroy() {
-    this.removeAllListeners();
-    this.actionHandlers.clear();
-    this.handlers.clear();
-    this.middleware = [];
-    this.throttledEmitters.clear();
-    this.debouncedEmitters.clear();
-    if (this.batchTimer) {
-      clearTimeout(this.batchTimer);
-    }
-  }
-};
-function createEventBus(options = {}) {
-  return new EventBus(options);
-}
-var globalEventBus = createEventBus();
-var emit = globalEventBus.emit.bind(globalEventBus);
-var emitSync = globalEventBus.emitSync.bind(globalEventBus);
-var on = globalEventBus.on.bind(globalEventBus);
-var once = globalEventBus.once.bind(globalEventBus);
-var off = globalEventBus.off.bind(globalEventBus);
-var registerAction = globalEventBus.registerAction.bind(globalEventBus);
-var handleAction = globalEventBus.handleAction.bind(globalEventBus);
-
-// ../core/src/events/dom-integration.js
-var DOMEventIntegration = class {
-  constructor(eventBus = globalEventBus, options = {}) {
-    this.eventBus = eventBus;
-    this.options = {
-      debug: false,
-      debounceDelay: 150,
-      throttleDelay: 100,
-      enableDelegation: true,
-      enableDebounce: true,
-      enableThrottle: false,
-      ...options
-    };
-    this.boundHandlers = /* @__PURE__ */ new Map();
-    this.activeElement = null;
-    this.isInitialized = false;
-    this.handleClick = this.handleClick.bind(this);
-    this.handleChange = this.handleChange.bind(this);
-    this.handleInput = this.handleInput.bind(this);
-    this.handleSubmit = this.handleSubmit.bind(this);
-    this.handleKeydown = this.handleKeydown.bind(this);
-    this.handleFocus = this.handleFocus.bind(this);
-    this.handleBlur = this.handleBlur.bind(this);
-  }
-  /**
-   * Initialize DOM event listeners
-   * @param {HTMLElement} rootElement - Root element to attach listeners to (default: document)
-   */
-  initialize(rootElement = document) {
-    if (this.isInitialized) {
-      console.warn("[DOMEventIntegration] Already initialized");
-      return;
-    }
-    if (typeof window === "undefined" || !rootElement) {
-      console.warn("[DOMEventIntegration] Cannot initialize: no DOM environment");
-      return;
-    }
-    this.rootElement = rootElement;
-    this.setupDOMEventListeners();
-    this.isInitialized = true;
-    if (this.options.debug) {
-      console.log("[DOMEventIntegration] Initialized with options:", this.options);
+  if (typeof component === "object") {
+    const keys = Object.keys(component);
+    if (keys.length === 0) {
+      throw new Error(`Empty object at ${path}`);
     }
-  }
-  /**
-   * Set up delegated DOM event listeners
-   * @private
-   */
-  setupDOMEventListeners() {
-    const clickHandler = this.createDelegatedHandler("click", this.handleClick);
-    this.rootElement.addEventListener("click", clickHandler, { passive: false });
-    this.boundHandlers.set("click", clickHandler);
-    const changeHandler = this.options.enableDebounce ? this.debounce(this.createDelegatedHandler("change", this.handleChange), this.options.debounceDelay) : this.createDelegatedHandler("change", this.handleChange);
-    this.rootElement.addEventListener("change", changeHandler, { passive: true });
-    this.boundHandlers.set("change", changeHandler);
-    const inputHandler = this.options.enableDebounce ? this.debounce(this.createDelegatedHandler("input", this.handleInput), this.options.debounceDelay) : this.createDelegatedHandler("input", this.handleInput);
-    this.rootElement.addEventListener("input", inputHandler, { passive: true });
-    this.boundHandlers.set("input", inputHandler);
-    const submitHandler = this.createDelegatedHandler("submit", this.handleSubmit);
-    this.rootElement.addEventListener("submit", submitHandler, { passive: false });
-    this.boundHandlers.set("submit", submitHandler);
-    const keydownHandler = this.createDelegatedHandler("keydown", this.handleKeydown);
-    this.rootElement.addEventListener("keydown", keydownHandler, { passive: false });
-    this.boundHandlers.set("keydown", keydownHandler);
-    const focusHandler = this.createDelegatedHandler("focus", this.handleFocus);
-    this.rootElement.addEventListener("focus", focusHandler, { passive: true, capture: true });
-    this.boundHandlers.set("focus", focusHandler);
-    const blurHandler = this.createDelegatedHandler("blur", this.handleBlur);
-    this.rootElement.addEventListener("blur", blurHandler, { passive: true, capture: true });
-    this.boundHandlers.set("blur", blurHandler);
-  }
-  /**
-   * Create a delegated event handler
-   * @private
-   */
-  createDelegatedHandler(eventType, handler) {
-    return (event) => {
-      const target = event.target;
-      if (!target) return;
-      const actionElement = this.options.enableDelegation ? target.closest("[data-action]") : target.hasAttribute?.("data-action") ? target : null;
-      if (actionElement) {
-        handler(actionElement, event);
-      } else {
-        handler(target, event);
+    keys.forEach((key) => {
+      const value = component[key];
+      if (!/^[a-zA-Z][a-zA-Z0-9-]*$/.test(key) && key !== "text") {
+        console.warn(`Potentially invalid tag name at ${path}: ${key}`);
       }
-    };
-  }
-  /**
-   * Handle click events
-   * @private
-   */
-  handleClick(element, event) {
-    const action = element.getAttribute?.("data-action");
-    if (action) {
-      this.handleDataAction(element, event, action);
-    }
-    this.eventBus.emitSync("dom:click", {
-      element,
-      event,
-      action,
-      data: this.parseDataAttributes(element)
-    });
-  }
-  /**
-   * Handle change events
-   * @private
-   */
-  handleChange(element, event) {
-    const action = element.getAttribute?.("data-action");
-    if (action) {
-      this.handleDataAction(element, event, action);
-    }
-    this.eventBus.emitSync("dom:change", {
-      element,
-      event,
-      value: element.value,
-      action,
-      data: this.parseDataAttributes(element)
-    });
-  }
-  /**
-   * Handle input events
-   * @private
-   */
-  handleInput(element, event) {
-    const action = element.getAttribute?.("data-action");
-    if (action) {
-      this.handleDataAction(element, event, action);
-    }
-    this.eventBus.emitSync("dom:input", {
-      element,
-      event,
-      value: element.value,
-      action,
-      data: this.parseDataAttributes(element)
-    });
-  }
-  /**
-   * Handle submit events
-   * @private
-   */
-  handleSubmit(element, event) {
-    const action = element.getAttribute?.("data-action");
-    if (action) {
-      event.preventDefault();
-      this.handleDataAction(element, event, action);
-    }
-    this.eventBus.emitSync("dom:submit", {
-      element,
-      event,
-      action,
-      formData: this.extractFormData(element),
-      data: this.parseDataAttributes(element)
-    });
-  }
-  /**
-   * Handle keydown events
-   * @private
-   */
-  handleKeydown(element, event) {
-    const action = element.getAttribute?.("data-action");
-    const keyAction = element.getAttribute?.(`data-key-${event.key.toLowerCase()}`);
-    if (action && this.shouldTriggerKeyAction(event)) {
-      this.handleDataAction(element, event, action);
-    }
-    if (keyAction) {
-      this.handleDataAction(element, event, keyAction);
-    }
-    this.eventBus.emitSync("dom:keydown", {
-      element,
-      event,
-      key: event.key,
-      code: event.code,
-      action,
-      keyAction,
-      data: this.parseDataAttributes(element)
-    });
-  }
-  /**
-   * Handle focus events
-   * @private
-   */
-  handleFocus(element, event) {
-    this.activeElement = element;
-    this.eventBus.emitSync("dom:focus", {
-      element,
-      event,
-      data: this.parseDataAttributes(element)
-    });
-  }
-  /**
-   * Handle blur events
-   * @private
-   */
-  handleBlur(element, event) {
-    if (this.activeElement === element) {
-      this.activeElement = null;
-    }
-    this.eventBus.emitSync("dom:blur", {
-      element,
-      event,
-      data: this.parseDataAttributes(element)
-    });
-  }
-  /**
-   * Handle data-action attributes
-   * @private
-   */
-  handleDataAction(element, event, action) {
-    if (!action) return;
-    const data = this.parseDataAttributes(element);
-    this.eventBus.emitSync("dom:action", {
-      action,
-      element,
-      event,
-      data
-    });
-    this.eventBus.handleAction(action, element, event, data);
-    if (this.options.debug) {
-      console.log(`[DOMEventIntegration] Action triggered: ${action}`, {
-        element,
-        event: event.type,
-        data
-      });
-    }
-  }
-  /**
-   * Parse data attributes from an element
-   * @private
-   */
-  parseDataAttributes(element) {
-    if (!element?.attributes) return {};
-    const data = {};
-    Array.from(element.attributes).forEach((attr) => {
-      if (attr.name.startsWith("data-") && attr.name !== "data-action") {
-        const key = attr.name.slice(5).replace(/-([a-z])/g, (_, letter) => letter.toUpperCase());
-        let value = attr.value;
-        try {
-          if (value === "true") value = true;
-          else if (value === "false") value = false;
-          else if (value === "null") value = null;
-          else if (value === "undefined") value = void 0;
-          else if (/^\d+$/.test(value)) value = parseInt(value, 10);
-          else if (/^\d*\.\d+$/.test(value)) value = parseFloat(value);
-          else if (value.startsWith("{") && value.endsWith("}") || value.startsWith("[") && value.endsWith("]")) {
-            value = JSON.parse(value);
-          }
-        } catch {
+      if (value && typeof value === "object" && !Array.isArray(value)) {
+        if (value.children) {
+          validateComponent(value.children, `${path}.${key}.children`);
         }
-        data[key] = value;
+      } else if (value && typeof value !== "string" && typeof value !== "number" && typeof value !== "function") {
+        throw new Error(`Invalid value type at ${path}.${key}: ${typeof value}`);
       }
     });
-    return data;
-  }
-  /**
-   * Extract form data from a form element
-   * @private
-   */
-  extractFormData(formElement) {
-    if (!formElement || formElement.tagName !== "FORM") {
-      return {};
-    }
-    const formData = new FormData(formElement);
-    const data = {};
-    for (const [key, value] of formData.entries()) {
-      if (data[key]) {
-        if (Array.isArray(data[key])) {
-          data[key].push(value);
-        } else {
-          data[key] = [data[key], value];
-        }
-      } else {
-        data[key] = value;
-      }
-    }
-    return data;
-  }
-  /**
-   * Check if a key event should trigger an action
-   * @private
-   */
-  shouldTriggerKeyAction(event) {
-    const triggerKeys = ["Enter", "Space", "Escape"];
-    return triggerKeys.includes(event.key);
+    return true;
   }
-  /**
-   * Debounce utility function
-   * @private
-   */
-  debounce(func, wait) {
-    let timeout;
-    return function executedFunction(...args) {
-      const later = () => {
-        clearTimeout(timeout);
-        func.apply(this, args);
-      };
-      clearTimeout(timeout);
-      timeout = setTimeout(later, wait);
-    };
+  throw new Error(`Invalid component type at ${path}: ${typeof component}`);
+}
+function isCoherentObject(obj) {
+  if (!obj || typeof obj !== "object" || Array.isArray(obj)) {
+    return false;
   }
-  /**
-   * Throttle utility function
-   * @private
-   */
-  throttle(func, limit) {
-    let inThrottle;
-    return function executedFunction(...args) {
-      if (!inThrottle) {
-        func.apply(this, args);
-        inThrottle = true;
-        setTimeout(() => inThrottle = false, limit);
-      }
-    };
+  const keys = Object.keys(obj);
+  if (keys.length === 0) {
+    return false;
   }
-  /**
-   * Add custom event listener
-   * @param {string} eventType - Event type
-   * @param {Function} handler - Event handler
-   * @param {Object} options - Event listener options
-   */
-  addCustomListener(eventType, handler, options = {}) {
-    const wrappedHandler = this.createDelegatedHandler(eventType, handler);
-    this.rootElement.addEventListener(eventType, wrappedHandler, options);
-    this.boundHandlers.set(`custom:${eventType}`, wrappedHandler);
+  return keys.every((key) => {
+    if (key === "text") return true;
+    return /^[a-zA-Z][a-zA-Z0-9-]*$/.test(key);
+  });
+}
+function extractProps(coherentObj) {
+  if (!isCoherentObject(coherentObj)) {
+    return {};
   }
-  /**
-   * Remove custom event listener
-   * @param {string} eventType - Event type
-   */
-  removeCustomListener(eventType) {
-    const handler = this.boundHandlers.get(`custom:${eventType}`);
-    if (handler) {
-      this.rootElement.removeEventListener(eventType, handler);
-      this.boundHandlers.delete(`custom:${eventType}`);
+  const props = {};
+  const keys = Object.keys(coherentObj);
+  keys.forEach((tag) => {
+    const value = coherentObj[tag];
+    if (value && typeof value === "object" && !Array.isArray(value)) {
+      props[tag] = { ...value };
+    } else {
+      props[tag] = { text: value };
     }
+  });
+  return props;
+}
+function hasChildren(component) {
+  if (Array.isArray(component)) {
+    return component.length > 0;
   }
-  /**
-   * Register action handlers in bulk
-   * @param {Object} actions - Object mapping action names to handlers
-   */
-  registerActions(actions) {
-    this.eventBus.registerActions(actions);
-  }
-  /**
-   * Get the currently active (focused) element
-   * @returns {HTMLElement|null}
-   */
-  getActiveElement() {
-    return this.activeElement;
-  }
-  /**
-   * Trigger an action programmatically
-   * @param {string} action - Action name
-   * @param {HTMLElement} element - Target element
-   * @param {Object} data - Additional data
-   */
-  triggerAction(action, element, data = {}) {
-    const syntheticEvent = new CustomEvent("synthetic", {
-      bubbles: true,
-      cancelable: true,
-      detail: data
-    });
-    this.eventBus.handleAction(action, element, syntheticEvent, data);
-  }
-  /**
-   * Clean up event listeners
-   */
-  destroy() {
-    if (!this.isInitialized) return;
-    this.boundHandlers.forEach((handler, eventType) => {
-      this.rootElement.removeEventListener(
-        eventType.replace("custom:", ""),
-        handler
-      );
-    });
-    this.boundHandlers.clear();
-    this.activeElement = null;
-    this.isInitialized = false;
-    if (this.options.debug) {
-      console.log("[DOMEventIntegration] Destroyed");
+  if (isCoherentObject(component)) {
+    if (component.children !== void 0 && component.children !== null) {
+      return Array.isArray(component.children) ? component.children.length > 0 : true;
     }
-  }
-};
-var globalDOMIntegration = new DOMEventIntegration(globalEventBus, {
-  debug: typeof process !== "undefined" && true
-});
-if (typeof window !== "undefined") {
-  if (document.readyState === "loading") {
-    document.addEventListener("DOMContentLoaded", () => {
-      globalDOMIntegration.initialize();
+    const keys = Object.keys(component);
+    return keys.some((key) => {
+      const value = component[key];
+      return value && typeof value === "object" && value.children;
     });
-  } else {
-    globalDOMIntegration.initialize();
   }
+  return false;
 }
-
-// ../core/src/events/index.js
-var eventSystem2 = {
-  // Core bus
-  bus: globalEventBus,
-  dom: globalDOMIntegration,
-  // Quick access methods
-  emit: globalEventBus.emit.bind(globalEventBus),
-  emitSync: globalEventBus.emitSync.bind(globalEventBus),
-  on: globalEventBus.on.bind(globalEventBus),
-  once: globalEventBus.once.bind(globalEventBus),
-  off: globalEventBus.off.bind(globalEventBus),
-  // Action methods
-  registerAction: globalEventBus.registerAction.bind(globalEventBus),
-  registerActions: globalEventBus.registerActions.bind(globalEventBus),
-  handleAction: globalEventBus.handleAction.bind(globalEventBus),
-  // Statistics and debugging
-  getStats: globalEventBus.getStats.bind(globalEventBus),
-  resetStats: globalEventBus.resetStats.bind(globalEventBus),
-  // Lifecycle
-  destroy() {
-    globalEventBus.destroy();
-    globalDOMIntegration.destroy();
+function normalizeChildren(children) {
+  if (children === null || children === void 0) {
+    return [];
   }
-};
+  if (Array.isArray(children)) {
+    return children.flat().filter((child) => child !== null && child !== void 0);
+  }
+  return [children];
+}
 
 // ../core/src/index.js
 var scopeCounter = { value: 0 };
@@ -3103,10 +1251,10 @@ function createCacheManager(options = {}) {
       cleanupInterval.unref();
     }
   }
-  function generateCacheKey(component, props = {}, context2 = {}) {
+  function generateCacheKey(component, props = {}, context = {}) {
     const componentStr = typeof component === "function" ? component.name || component.toString() : JSON.stringify(component);
     const propsStr = JSON.stringify(props, Object.keys(props).sort());
-    const contextStr = JSON.stringify(context2);
+    const contextStr = JSON.stringify(context);
     const hash = simpleHash(componentStr + propsStr + contextStr);
     return `${extractComponentName(component)}_${hash}`;
   }
@@ -3286,107 +1434,6 @@ function createCacheManager(options = {}) {
 }
 var cacheManager = createCacheManager();
 
-// ../core/src/rendering/css-manager.js
-import fs from "node:fs/promises";
-import path from "node:path";
-var CSSManager = class {
-  constructor(options = {}) {
-    this.options = {
-      basePath: process.cwd(),
-      minify: false,
-      cache: true,
-      autoprefixer: false,
-      ...options
-    };
-    this.cache = /* @__PURE__ */ new Map();
-    this.loadedFiles = /* @__PURE__ */ new Set();
-  }
-  /**
-   * Load CSS file content
-   */
-  async loadCSSFile(filePath) {
-    const fullPath = path.resolve(this.options.basePath, filePath);
-    const cacheKey = fullPath;
-    if (this.options.cache && this.cache.has(cacheKey)) {
-      return this.cache.get(cacheKey);
-    }
-    try {
-      let content = await fs.readFile(fullPath, "utf8");
-      if (this.options.minify) {
-        content = this.minifyCSS(content);
-      }
-      if (this.options.cache) {
-        this.cache.set(cacheKey, content);
-      }
-      this.loadedFiles.add(filePath);
-      return content;
-    } catch (_error) {
-      console.warn(`Failed to load CSS file: ${filePath}`, _error.message);
-      return "";
-    }
-  }
-  /**
-   * Load multiple CSS files
-   */
-  async loadCSSFiles(filePaths) {
-    if (!Array.isArray(filePaths)) {
-      filePaths = [filePaths];
-    }
-    const cssContents = await Promise.all(
-      filePaths.map((filePath) => this.loadCSSFile(filePath))
-    );
-    return cssContents.join("\n");
-  }
-  /**
-   * Generate CSS link tags for external files
-   */
-  generateCSSLinks(filePaths, baseUrl = "/") {
-    if (!Array.isArray(filePaths)) {
-      filePaths = [filePaths];
-    }
-    return filePaths.map((filePath) => {
-      const href = filePath.startsWith("http") ? filePath : `${baseUrl}${filePath}`.replace(/\/+/g, "/");
-      return `<link rel="stylesheet" href="${this.escapeHtml(href)}" />`;
-    }).join("\n");
-  }
-  /**
-   * Generate inline style tag with CSS content
-   */
-  generateInlineStyles(cssContent) {
-    if (!cssContent) return "";
-    return `<style type="text/css">
-${cssContent}
-</style>`;
-  }
-  /**
-   * Basic CSS minification
-   */
-  minifyCSS(css) {
-    return css.replace(/\/\*[\s\S]*?\*\//g, "").replace(/\s+/g, " ").replace(/;\s*}/g, "}").replace(/{\s+/g, "{").replace(/;\s+/g, ";").trim();
-  }
-  /**
-   * Escape HTML entities
-   */
-  escapeHtml(text) {
-    const div = { textContent: text };
-    return div.innerHTML || text;
-  }
-  /**
-   * Clear cache
-   */
-  clearCache() {
-    this.cache.clear();
-    this.loadedFiles.clear();
-  }
-  /**
-   * Get loaded file list
-   */
-  getLoadedFiles() {
-    return Array.from(this.loadedFiles);
-  }
-};
-var defaultCSSManager = new CSSManager();
-
 // ../core/src/rendering/html-renderer.js
 var rendererCache = createCacheManager({
   maxSize: 1e3,