@coherent.js/core 1.0.0-beta.6 → 1.0.0-beta.8

package/dist/index.js

@@ -10,9 +10,6 @@ var __export = (target, all) => {
     __defProp(target, name, { get: all[name], enumerable: true });
 };
 
-// src/index.js
-import { readFileSync } from "node:fs";
-
 // src/performance/monitor.js
 function createPerformanceMonitor(options = {}) {
   const opts = {
@@ -464,6 +461,23 @@ function createPerformanceMonitor(options = {}) {
     startReporting();
     startProfiling();
   }
+  let _renderCounter = 0;
+  const _renderTimers = /* @__PURE__ */ new Map();
+  function startRender() {
+    const id = `render_${++_renderCounter}`;
+    _renderTimers.set(id, performance.now());
+    return id;
+  }
+  function endRender(id) {
+    const startTime = _renderTimers.get(id);
+    if (startTime !== void 0) {
+      const duration = performance.now() - startTime;
+      _renderTimers.delete(id);
+      recordMetric("render", duration);
+      return duration;
+    }
+    return 0;
+  }
   return {
     recordMetric,
     measure,
@@ -473,6 +487,8 @@ function createPerformanceMonitor(options = {}) {
     generateReport,
     getStats,
     reset,
+    startRender,
+    endRender,
     start() {
       opts.enabled = true;
       startResourceMonitoring();
@@ -1193,7 +1209,13 @@ function formatAttributes(props) {
           }
         }
       }
-      if (value === true) {
+      if (attributeName === "style" && typeof value === "object" && value !== null) {
+        const cssString = Object.entries(value).map(([prop, val]) => {
+          const kebabProp = prop.replace(/[A-Z]/g, (m) => `-${m.toLowerCase()}`);
+          return `${kebabProp}: ${val}`;
+        }).join("; ");
+        formatted += ` ${attributeName}="${escapeHtml(cssString)}"`;
+      } else if (value === true) {
         formatted += ` ${attributeName}`;
       } else if (value !== false && value !== null && value !== void 0) {
         formatted += ` ${attributeName}="${escapeHtml(String(value))}"`;
@@ -1414,6 +1436,9 @@ function createCacheManager(options = {}) {
     }
     clear();
   }
+  function hashObject(obj) {
+    return simpleHash(JSON.stringify(obj));
+  }
   return {
     get,
     set,
@@ -1423,6 +1448,7 @@ function createCacheManager(options = {}) {
     cleanup,
     destroy,
     generateCacheKey,
+    hashObject,
     get memoryUsage() {
       return memoryUsage;
     },
@@ -2075,6 +2101,11 @@ var HTMLRenderer = class extends BaseRenderer {
     const { children, text, key: _key, html: _rawHtml, ...attributes } = element || {};
     const attributeString = formatAttributes(attributes);
     const openingTag = attributeString ? `<${tagName} ${attributeString}>` : `<${tagName}>`;
+    if (_rawHtml !== void 0) {
+      const rawContent = typeof _rawHtml === "function" ? String(_rawHtml()) : String(_rawHtml);
+      const result = `${openingTag}${rawContent}</${tagName}>`;
+      return result;
+    }
     let textContent = "";
     if (text !== void 0) {
       const isScript = tagName === "script";
@@ -5004,7 +5035,7 @@ var EventBus = class {
     }
   }
   /**
-   * Emit with throttling
+   * Emit throttled event
    */
   emitThrottled(event, data, delay) {
     if (!this.throttledEmitters.has(event)) {
@@ -5028,7 +5059,7 @@ var EventBus = class {
     }
   }
   /**
-   * Flush batch queue
+   * Flush batched events
    */
   async flushBatch() {
     if (this.batchTimer) {
@@ -5166,7 +5197,7 @@ var EventBus = class {
     }
   }
   /**
-   * Run middleware chain
+   * Run middleware
    */
   async runMiddleware(event, data) {
     if (this.middleware.length === 0) return;
@@ -5366,7 +5397,6 @@ var DOMEventIntegration = class {
   }
   /**
    * Set up delegated DOM event listeners
-   * @private
    */
   setupDOMEventListeners() {
     const clickHandler = this.createDelegatedHandler("click", this.handleClick);
@@ -5393,7 +5423,6 @@ var DOMEventIntegration = class {
   }
   /**
    * Create a delegated event handler
-   * @private
    */
   createDelegatedHandler(eventType, handler) {
     return (event) => {
@@ -5409,7 +5438,6 @@ var DOMEventIntegration = class {
   }
   /**
    * Handle click events
-   * @private
    */
   handleClick(element, event) {
     const action = element.getAttribute?.("data-action");
@@ -5425,7 +5453,6 @@ var DOMEventIntegration = class {
   }
   /**
    * Handle change events
-   * @private
    */
   handleChange(element, event) {
     const action = element.getAttribute?.("data-action");
@@ -5442,7 +5469,6 @@ var DOMEventIntegration = class {
   }
   /**
    * Handle input events
-   * @private
    */
   handleInput(element, event) {
     const action = element.getAttribute?.("data-action");
@@ -5459,7 +5485,6 @@ var DOMEventIntegration = class {
   }
   /**
    * Handle submit events
-   * @private
    */
   handleSubmit(element, event) {
     const action = element.getAttribute?.("data-action");
@@ -5477,7 +5502,6 @@ var DOMEventIntegration = class {
   }
   /**
    * Handle keydown events
-   * @private
    */
   handleKeydown(element, event) {
     const action = element.getAttribute?.("data-action");
@@ -5500,7 +5524,6 @@ var DOMEventIntegration = class {
   }
   /**
    * Handle focus events
-   * @private
    */
   handleFocus(element, event) {
     this.activeElement = element;
@@ -5512,7 +5535,6 @@ var DOMEventIntegration = class {
   }
   /**
    * Handle blur events
-   * @private
    */
   handleBlur(element, event) {
     if (this.activeElement === element) {
@@ -5526,7 +5548,6 @@ var DOMEventIntegration = class {
   }
   /**
    * Handle data-action attributes
-   * @private
    */
   handleDataAction(element, event, action) {
     if (!action) return;
@@ -5548,7 +5569,6 @@ var DOMEventIntegration = class {
   }
   /**
    * Parse data attributes from an element
-   * @private
    */
   parseDataAttributes(element) {
     if (!element?.attributes) return {};
@@ -5576,7 +5596,6 @@ var DOMEventIntegration = class {
   }
   /**
    * Extract form data from a form element
-   * @private
    */
   extractFormData(formElement) {
     if (!formElement || formElement.tagName !== "FORM") {
@@ -5599,7 +5618,6 @@ var DOMEventIntegration = class {
   }
   /**
    * Check if a key event should trigger an action
-   * @private
    */
   shouldTriggerKeyAction(event) {
     const triggerKeys = ["Enter", "Space", "Escape"];
@@ -5607,7 +5625,6 @@ var DOMEventIntegration = class {
   }
   /**
    * Debounce utility function
-   * @private
    */
   debounce(func, wait) {
     let timeout;
@@ -5622,7 +5639,6 @@ var DOMEventIntegration = class {
   }
   /**
    * Throttle utility function
-   * @private
    */
   throttle(func, limit) {
     let inThrottle;
@@ -6137,6 +6153,97 @@ var eventSystem2 = {
 };
 var events_default = eventSystem2;
 
+// src/components/enhanced-composition.js
+var hoc = {
+  /**
+   * Wrap component with additional props
+   */
+  withProps(additionalProps) {
+    return (Component2) => (props) => {
+      return Component2({ ...props, ...additionalProps });
+    };
+  },
+  /**
+   * Conditional rendering HOC
+   */
+  withCondition(condition) {
+    return (Component2) => (props) => {
+      return condition(props) ? Component2(props) : null;
+    };
+  },
+  /**
+   * Loading state HOC
+   */
+  withLoading(loadingComponent) {
+    return (Component2) => (props) => {
+      return props.loading ? loadingComponent(props) : Component2(props);
+    };
+  },
+  /**
+   * Error boundary HOC
+   */
+  withError(errorComponent) {
+    return (Component2) => (props) => {
+      try {
+        return Component2(props);
+      } catch (error) {
+        return errorComponent({ error, ...props });
+      }
+    };
+  },
+  /**
+   * Memoization HOC
+   */
+  withMemo(getMemoKey) {
+    const cache = /* @__PURE__ */ new Map();
+    return (Component2) => (props) => {
+      const key = getMemoKey ? getMemoKey(props) : JSON.stringify(props);
+      if (cache.has(key)) {
+        return cache.get(key);
+      }
+      const result = Component2(props);
+      cache.set(key, result);
+      return result;
+    };
+  }
+};
+var compose = {
+  /**
+   * Combine multiple components into one
+   */
+  combine(...components) {
+    return (props) => ({
+      fragment: {
+        children: components.map((Component2) => Component2(props))
+      }
+    });
+  },
+  /**
+   * Pipe components through transformations
+   */
+  pipe(...transformers) {
+    return (Component2) => {
+      return transformers.reduce((acc, transformer) => transformer(acc), Component2);
+    };
+  },
+  /**
+   * Branch based on conditions
+   */
+  branch(condition, leftComponent, rightComponent) {
+    return (props) => {
+      return condition(props) ? leftComponent(props) : rightComponent(props);
+    };
+  },
+  /**
+   * Render component or fallback
+   */
+  maybe(Component2, fallback = null) {
+    return (props) => {
+      return Component2 ? Component2(props) : fallback;
+    };
+  }
+};
+
 // src/index.js
 var scopeCounter = { value: 0 };
 function generateScopeId() {
@@ -6191,10 +6298,46 @@ function dangerouslySetInnerContent(content) {
     __trusted: true
   };
 }
+function injectHydrationAttributes(component, options) {
+  if (!component || typeof component !== "object" || Array.isArray(component)) {
+    return component;
+  }
+  const tagName = Object.keys(component)[0];
+  if (!tagName) return component;
+  const props = component[tagName];
+  if (typeof props !== "object" || props === null) return component;
+  const injected = { ...props };
+  if (options.hydratable) {
+    injected["data-hydratable"] = "true";
+  }
+  if (options.island) {
+    injected["data-coherent-island"] = "true";
+  }
+  if (options._islandComponentName) {
+    injected["data-coherent-island-component"] = options._islandComponentName;
+  }
+  return { [tagName]: injected };
+}
+function Island(componentFn) {
+  const componentName = componentFn.name || "Anonymous";
+  return function IslandComponent(props) {
+    const result = componentFn(props);
+    return injectHydrationAttributes(result, {
+      island: true,
+      _islandComponentName: componentName
+    });
+  };
+}
 function render2(obj, options = {}) {
   const scoped = options.scoped ?? options.encapsulate ?? false;
-  const { scoped: _scoped, encapsulate: _encapsulate, ...rendererOptions } = options;
-  const component = scoped ? renderScopedComponent(obj) : obj;
+  const { scoped: _scoped, encapsulate: _encapsulate, hydratable: _hydratable, island: _island, ...rendererOptions } = options;
+  let component = scoped ? renderScopedComponent(obj) : obj;
+  if (typeof component === "function") {
+    component = component(options);
+  }
+  if (_hydratable || _island) {
+    component = injectHydrationAttributes(component, { hydratable: _hydratable, island: _island });
+  }
   return render(component, rendererOptions);
 }
 function renderScopedComponent(component) {
@@ -6264,10 +6407,15 @@ function deepClone2(obj) {
   }
   return cloned;
 }
-var _corePackageJson = JSON.parse(
-  readFileSync(new URL("../package.json", import.meta.url), "utf-8")
-);
-var VERSION = _corePackageJson.version;
+var VERSION = "1.0.0-beta.8";
+var fp = {
+  /**
+   * Curried map: fp.map(fn)(array)
+   */
+  map(fn) {
+    return (array) => array.map(fn);
+  }
+};
 var coherent = {
   // Core rendering
   render: render2,
@@ -6337,9 +6485,11 @@ export {
   FORBIDDEN_CHILDREN,
   GlobalErrorHandler,
   HTMLNestingError,
+  Island,
   LIFECYCLE_PHASES,
   VERSION,
   checkPeerDependencies,
+  compose,
   createActionHandlers,
   createAsyncErrorBoundary,
   createComponent,
@@ -6364,6 +6514,7 @@ export {
   emitSync,
   evaluateLazy,
   events_default as eventSystem,
+  fp,
   getComponent,
   getRegisteredComponents,
   globalDOMIntegration,
@@ -6371,6 +6522,7 @@ export {
   h,
   handleAction,
   hasChildren,
+  hoc,
   importPeerDependency,
   initializeDOMIntegration,
   isCoherentComponent,
@@ -6413,7 +6565,7 @@ export {
  * Coherent.js - Object-Based Rendering Framework
  * A pure JavaScript framework for server-side rendering using natural object syntax
  *
- * @version 1.0.0-beta.6
+ * @version 1.0.0-beta.8
  * @author Coherent Framework Team
  * @license MIT
  */