sygnal 2.9.0 → 2.9.2

package/dist/index.cjs.js

@@ -4145,6 +4145,10 @@ class Component {
     const stateSource = new state.StateSource(combined$);
     const stateField  = props.state;
 
+    if (typeof props.sygnalFactory !== 'function' && typeof props.sygnalOptions === 'object') {
+      props.sygnalFactory = component(props.sygnalOptions);
+    }
+
     const factory   = componentName === 'sygnal-factory' ? props.sygnalFactory : (this.components[componentName] || props.sygnalFactory);
     if (!factory) {
       if (componentName === 'sygnal-factory') throw new Error(`Component not found on element with Capitalized selector and nameless function: JSX transpilation replaces selectors starting with upper case letters with functions in-scope with the same name, Sygnal cannot see the name of the resulting component.`)
@@ -4293,7 +4297,7 @@ function getComponents(currentElement, componentNames, depth=0, index=0, parentI
   const sel          = currentElement.sel;
   const isCollection = sel && sel.toLowerCase() === 'collection';
   const isSwitchable = sel && sel.toLowerCase() === 'switchable';
-  const isComponent  = sel && (['collection', 'switchable', 'sygnal-factory', ...componentNames].includes(sel)) || typeof currentElement.data?.props?.sygnalFactory === 'function';
+  const isComponent  = sel && (['collection', 'switchable', 'sygnal-factory', ...componentNames].includes(sel)) || typeof currentElement.data?.props?.sygnalFactory === 'function' || typeof currentElement.data?.props?.sygnalOptions === 'object';
   const props        = (currentElement.data && currentElement.data.props) || {};
   (currentElement.data && currentElement.data.attrs) || {};
   const children     = currentElement.children || [];
@@ -4341,7 +4345,7 @@ function injectComponents(currentElement, components, componentNames, depth=0, i
 
 
   const sel          = currentElement.sel || 'NO SELECTOR';
-  const isComponent  = ['collection', 'switchable', 'sygnal-factory', ...componentNames].includes(sel) || typeof currentElement.data?.props?.sygnalFactory === 'function';
+  const isComponent  = ['collection', 'switchable', 'sygnal-factory', ...componentNames].includes(sel) || typeof currentElement.data?.props?.sygnalFactory === 'function' || typeof currentElement.data?.props?.sygnalOptions === 'object';
   const isCollection = currentElement?.data?.isCollection;
   const isSwitchable = currentElement?.data?.isSwitchable;
   (currentElement.data && currentElement.data.props) || {};
@@ -4656,6 +4660,14 @@ function logDriver(out$) {
 
 function run(app, drivers={}, options={}) {
   const { mountPoint='#root', fragments=true } = options;
+  if (!app.isSygnalComponent) {
+    const name = app.name || "FUNCTIONAL_COMPONENT";
+    const view = app;
+    const { model, intent, context, children, components, initialState, calculated, storeCalculatedInState, DOMSourceName, stateSourceName, debug } = app;
+    const options = { name, view, model, intent, context, children, components, initialState, calculated, storeCalculatedInState, DOMSourceName, stateSourceName, debug };
+
+    app = component(options);
+  }
 
   const wrapped = state.withState(app, 'STATE');
 

package/dist/index.esm.js

@@ -4145,6 +4145,10 @@ class Component {
     const stateSource = new StateSource(combined$);
     const stateField  = props.state;
 
+    if (typeof props.sygnalFactory !== 'function' && typeof props.sygnalOptions === 'object') {
+      props.sygnalFactory = component(props.sygnalOptions);
+    }
+
     const factory   = componentName === 'sygnal-factory' ? props.sygnalFactory : (this.components[componentName] || props.sygnalFactory);
     if (!factory) {
       if (componentName === 'sygnal-factory') throw new Error(`Component not found on element with Capitalized selector and nameless function: JSX transpilation replaces selectors starting with upper case letters with functions in-scope with the same name, Sygnal cannot see the name of the resulting component.`)
@@ -4293,7 +4297,7 @@ function getComponents(currentElement, componentNames, depth=0, index=0, parentI
   const sel          = currentElement.sel;
   const isCollection = sel && sel.toLowerCase() === 'collection';
   const isSwitchable = sel && sel.toLowerCase() === 'switchable';
-  const isComponent  = sel && (['collection', 'switchable', 'sygnal-factory', ...componentNames].includes(sel)) || typeof currentElement.data?.props?.sygnalFactory === 'function';
+  const isComponent  = sel && (['collection', 'switchable', 'sygnal-factory', ...componentNames].includes(sel)) || typeof currentElement.data?.props?.sygnalFactory === 'function' || typeof currentElement.data?.props?.sygnalOptions === 'object';
   const props        = (currentElement.data && currentElement.data.props) || {};
   (currentElement.data && currentElement.data.attrs) || {};
   const children     = currentElement.children || [];
@@ -4341,7 +4345,7 @@ function injectComponents(currentElement, components, componentNames, depth=0, i
 
 
   const sel          = currentElement.sel || 'NO SELECTOR';
-  const isComponent  = ['collection', 'switchable', 'sygnal-factory', ...componentNames].includes(sel) || typeof currentElement.data?.props?.sygnalFactory === 'function';
+  const isComponent  = ['collection', 'switchable', 'sygnal-factory', ...componentNames].includes(sel) || typeof currentElement.data?.props?.sygnalFactory === 'function' || typeof currentElement.data?.props?.sygnalOptions === 'object';
   const isCollection = currentElement?.data?.isCollection;
   const isSwitchable = currentElement?.data?.isSwitchable;
   (currentElement.data && currentElement.data.props) || {};
@@ -4656,6 +4660,14 @@ function logDriver(out$) {
 
 function run(app, drivers={}, options={}) {
   const { mountPoint='#root', fragments=true } = options;
+  if (!app.isSygnalComponent) {
+    const name = app.name || "FUNCTIONAL_COMPONENT";
+    const view = app;
+    const { model, intent, context, children, components, initialState, calculated, storeCalculatedInState, DOMSourceName, stateSourceName, debug } = app;
+    const options = { name, view, model, intent, context, children, components, initialState, calculated, storeCalculatedInState, DOMSourceName, stateSourceName, debug };
+
+    app = component(options);
+  }
 
   const wrapped = withState(app, 'STATE');