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

package/dist/index.cjs

@@ -27,9 +27,11 @@ __export(index_exports, {
   FORBIDDEN_CHILDREN: () => FORBIDDEN_CHILDREN,
   GlobalErrorHandler: () => GlobalErrorHandler,
   HTMLNestingError: () => HTMLNestingError,
+  Island: () => Island,
   LIFECYCLE_PHASES: () => LIFECYCLE_PHASES,
   VERSION: () => VERSION,
   checkPeerDependencies: () => checkPeerDependencies,
+  compose: () => compose,
   createActionHandlers: () => createActionHandlers,
   createAsyncErrorBoundary: () => createAsyncErrorBoundary,
   createComponent: () => createComponent,
@@ -54,6 +56,7 @@ __export(index_exports, {
   emitSync: () => emitSync,
   evaluateLazy: () => evaluateLazy,
   eventSystem: () => events_default,
+  fp: () => fp,
   getComponent: () => getComponent,
   getRegisteredComponents: () => getRegisteredComponents,
   globalDOMIntegration: () => globalDOMIntegration,
@@ -61,6 +64,7 @@ __export(index_exports, {
   h: () => h,
   handleAction: () => handleAction,
   hasChildren: () => hasChildren,
+  hoc: () => hoc,
   importPeerDependency: () => importPeerDependency,
   initializeDOMIntegration: () => initializeDOMIntegration,
   isCoherentComponent: () => isCoherentComponent,
@@ -1276,7 +1280,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))}"`;
@@ -1497,6 +1507,9 @@ function createCacheManager(options = {}) {
     }
     clear();
   }
+  function hashObject(obj) {
+    return simpleHash(JSON.stringify(obj));
+  }
   return {
     get,
     set,
@@ -1506,6 +1519,7 @@ function createCacheManager(options = {}) {
     cleanup,
     destroy,
     generateCacheKey,
+    hashObject,
     get memoryUsage() {
       return memoryUsage;
     },
@@ -6220,6 +6234,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 import_meta = {};
 var scopeCounter = { value: 0 };
@@ -6275,10 +6380,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) {
@@ -6352,6 +6493,14 @@ var _corePackageJson = JSON.parse(
   (0, import_node_fs.readFileSync)(new URL("../package.json", import_meta.url), "utf-8")
 );
 var VERSION = _corePackageJson.version;
+var fp = {
+  /**
+   * Curried map: fp.map(fn)(array)
+   */
+  map(fn) {
+    return (array) => array.map(fn);
+  }
+};
 var coherent = {
   // Core rendering
   render: render2,
@@ -6422,9 +6571,11 @@ var index_default = coherent;
   FORBIDDEN_CHILDREN,
   GlobalErrorHandler,
   HTMLNestingError,
+  Island,
   LIFECYCLE_PHASES,
   VERSION,
   checkPeerDependencies,
+  compose,
   createActionHandlers,
   createAsyncErrorBoundary,
   createComponent,
@@ -6448,6 +6599,7 @@ var index_default = coherent;
   emitSync,
   evaluateLazy,
   eventSystem,
+  fp,
   getComponent,
   getRegisteredComponents,
   globalDOMIntegration,
@@ -6455,6 +6607,7 @@ var index_default = coherent;
   h,
   handleAction,
   hasChildren,
+  hoc,
   importPeerDependency,
   initializeDOMIntegration,
   isCoherentComponent,
@@ -6497,7 +6650,7 @@ var index_default = coherent;
  * 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.7
  * @author Coherent Framework Team
  * @license MIT
  */