@xailabs/altx

<!DOCTYPE html> <html> <head> <meta charset="utf-8"> <base data-ice="baseUrl" href="../"> <title data-ice="title">Function | API Document</title> <link type="text/css" rel="stylesheet" href="css/style.css"> <link type="text/css" rel="stylesheet" href="css/prettify-tomorrow.css"> <script src="script/prettify/prettify.js"></script> <script src="script/manual.js"></script> </head> <body class="layout-container" data-ice="rootContainer"> <header> <a href="./">Home</a> <a href="identifiers.html">Reference</a> <a href="source.html">Source</a> <div class="search-box"> <span> <img src="./image/search.png"> <span class="search-input-edge"></span><input class="search-input"><span class="search-input-edge"></span> </span> <ul class="search-result"></ul> </div> </header> <nav class="navigation" data-ice="nav"><div> <ul> <li data-ice="doc"><span data-ice="kind" class="kind-class">C</span><span data-ice="name"><span><a href="class/src/ImmutableStore.js~ImmutableStore.html">ImmutableStore</a></span></span></li> <li data-ice="doc"><span data-ice="kind" class="kind-function">F</span><span data-ice="name"><span><a href="function/index.html#static-function-BindHandlers">BindHandlers</a></span></span></li> <li data-ice="doc"><span data-ice="kind" class="kind-function">F</span><span data-ice="name"><span><a href="function/index.html#static-function-resetStores">resetStores</a></span></span></li> <li data-ice="doc"><span data-ice="kind" class="kind-function">F</span><span data-ice="name"><span><a href="function/index.html#static-function-getAltInstance">getAltInstance</a></span></span></li> <li data-ice="doc"><span data-ice="kind" class="kind-function">F</span><span data-ice="name"><span><a href="function/index.html#static-function-setAltInstance">setAltInstance</a></span></span></li> <li data-ice="doc"><span data-ice="kind" class="kind-function">F</span><span data-ice="name"><span><a href="function/index.html#static-function-callFactory">callFactory</a></span></span></li> <li data-ice="doc"><span data-ice="kind" class="kind-function">F</span><span data-ice="name"><span><a href="function/index.html#static-function-callSeries">callSeries</a></span></span></li> <li data-ice="doc"><span data-ice="kind" class="kind-function">F</span><span data-ice="name"><span><a href="function/index.html#static-function-createActions">createActions</a></span></span></li> <li data-ice="doc"><span data-ice="kind" class="kind-function">F</span><span data-ice="name"><span><a href="function/index.html#static-function-createStore">createStore</a></span></span></li> <li data-ice="doc"><span data-ice="kind" class="kind-function">F</span><span data-ice="name"><span><a href="function/index.html#static-function-getSources">getSources</a></span></span></li> <li data-ice="doc"><span data-ice="kind" class="kind-function">F</span><span data-ice="name"><span><a href="function/index.html#static-function-handlerFactory">handlerFactory</a></span></span></li> <li data-ice="doc"><div data-ice="dirPath" class="nav-dir-path">decorators</div><span data-ice="kind" class="kind-function">F</span><span data-ice="name"><span><a href="function/index.html#static-function-bindActions">bindActions</a></span></span></li> <li data-ice="doc"><span data-ice="kind" class="kind-function">F</span><span data-ice="name"><span><a href="function/index.html#static-function-bindCalls">bindCalls</a></span></span></li> <li data-ice="doc"><span data-ice="kind" class="kind-function">F</span><span data-ice="name"><span><a href="function/index.html#static-function-bindHandlers">bindHandlers</a></span></span></li> <li data-ice="doc"><span data-ice="kind" class="kind-function">F</span><span data-ice="name"><span><a href="function/index.html#static-function-connect">connect</a></span></span></li> <li data-ice="doc"><span data-ice="kind" class="kind-function">F</span><span data-ice="name"><span><a href="function/index.html#static-function-connectAlternative">connectAlternative</a></span></span></li> <li data-ice="doc"><div data-ice="dirPath" class="nav-dir-path">utils</div><span data-ice="kind" class="kind-function">F</span><span data-ice="name"><span><a href="function/index.html#static-function-flatten">flatten</a></span></span></li> <li data-ice="doc"><span data-ice="kind" class="kind-function">F</span><span data-ice="name"><span><a href="function/index.html#static-function-createLogger">createLogger</a></span></span></li> <li data-ice="doc"><span data-ice="kind" class="kind-function">F</span><span data-ice="name"><span><a href="function/index.html#static-function-getLevel">getLevel</a></span></span></li> <li data-ice="doc"><span data-ice="kind" class="kind-function">F</span><span data-ice="name"><span><a href="function/index.html#static-function-setLevel">setLevel</a></span></span></li> <li data-ice="doc"><span data-ice="kind" class="kind-variable">V</span><span data-ice="name"><span><a href="variable/index.html#static-variable-logLevel">logLevel</a></span></span></li> <li data-ice="doc"><div data-ice="dirPath" class="nav-dir-path">utils/validate</div><span data-ice="kind" class="kind-function">F</span><span data-ice="name"><span><a href="function/index.html#static-function-creatorConstraints">creatorConstraints</a></span></span></li> <li data-ice="doc"><span data-ice="kind" class="kind-function">F</span><span data-ice="name"><span><a href="function/index.html#static-function-validateCreator">validateCreator</a></span></span></li> <li data-ice="doc"><span data-ice="kind" class="kind-function">F</span><span data-ice="name"><span><a href="function/index.html#static-function-definitionConstraints">definitionConstraints</a></span></span></li> <li data-ice="doc"><span data-ice="kind" class="kind-function">F</span><span data-ice="name"><span><a href="function/index.html#static-function-validateDefinition">validateDefinition</a></span></span></li> <li data-ice="doc"><span data-ice="kind" class="kind-function">F</span><span data-ice="name"><span><a href="function/index.html#static-function-handlerConstraints">handlerConstraints</a></span></span></li> <li data-ice="doc"><span data-ice="kind" class="kind-function">F</span><span data-ice="name"><span><a href="function/index.html#static-function-validateHandler">validateHandler</a></span></span></li> <li data-ice="doc"><span data-ice="kind" class="kind-variable">V</span><span data-ice="name"><span><a href="variable/index.html#static-variable-loggerConstraints">loggerConstraints</a></span></span></li> </ul> </div> </nav> <div class="content" data-ice="content"><h1 data-ice="title">Function</h1> <div data-ice="summaries"><table class="summary" data-ice="summary"> <thead><tr><td data-ice="title" colspan="3">Static Public Summary</td></tr></thead> <tbody> <tr data-ice="target"> <td> <span class="access" data-ice="access">public</span> <span class="override" data-ice="override"></span> </td> <td> <div> <p> <span data-ice="name"><span><a href="function/index.html#static-function-BindHandlers">BindHandlers</a></span></span><span data-ice="signature">(args: ...<span>*</span>): <span>*</span></span> </p> </div> <div> <div data-ice="description"><p>Creates a decorator for binding action handlers to a store.</p> </div> </div> </td> <td> </td> </tr> <tr data-ice="target"> <td> <span class="access" data-ice="access">public</span> <span class="override" data-ice="override"></span> </td> <td> <div> <p> <span data-ice="name"><span><a href="function/index.html#static-function-bindActions">bindActions</a></span></span><span data-ice="signature">(args: ...<span>*</span>): <span>*</span></span> </p> </div> <div> <div data-ice="description"><p>Decorates a store with any number of viewAction definitions.</p> </div> </div> </td> <td> </td> </tr> <tr data-ice="target"> <td> <span class="access" data-ice="access">public</span> <span class="override" data-ice="override"></span> </td> <td> <div> <p> <span data-ice="name"><span><a href="function/index.html#static-function-bindCalls">bindCalls</a></span></span><span data-ice="signature">(args: ...<span>*</span>): <span>*</span></span> </p> </div> <div> <div data-ice="description"><p>Decorates a store with any number of call definitions.</p> </div> </div> </td> <td> </td> </tr> <tr data-ice="target"> <td> <span class="access" data-ice="access">public</span> <span class="override" data-ice="override"></span> </td> <td> <div> <p> <span data-ice="name"><span><a href="function/index.html#static-function-bindHandlers">bindHandlers</a></span></span><span data-ice="signature">(actions: <span>*</span>, handlers: ...<span>*</span>): <span>*</span></span> </p> </div> <div> <div data-ice="description"><p>Decorates a store with any number of action handlers.</p> </div> </div> </td> <td> </td> </tr> <tr data-ice="target"> <td> <span class="access" data-ice="access">public</span> <span class="override" data-ice="override"></span> </td> <td> <div> <p> <span data-ice="name"><span><a href="function/index.html#static-function-callFactory">callFactory</a></span></span><span data-ice="signature">(name: <span>*</span>, objectPattern1: {"namespace": <span>*</span>, "defaultActions": <span>*</span>, "actions": <span>*</span>, "logger": <span>*</span>}): {"name": <span>*</span>, "actions": <span>*</span>, "create": <span>*</span>, "createActions": <span>*</span>}</span> </p> </div> <div> </div> </td> <td> </td> </tr> <tr data-ice="target"> <td> <span class="access" data-ice="access">public</span> <span class="override" data-ice="override"></span> </td> <td> <div> <p> <span data-ice="name"><span><a href="function/index.html#static-function-callSeries">callSeries</a></span></span><span data-ice="signature">(calls: <span>array</span>, options: <span><a href="https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Object">object</a></span>): <span>promise</span></span> </p> </div> <div> <div data-ice="description"><p>Retuns a promise and executes a series of calls.</p> </div> </div> </td> <td> </td> </tr> <tr data-ice="target"> <td> <span class="access" data-ice="access">public</span> <span class="override" data-ice="override"></span> </td> <td> <div> <p> <span data-ice="name"><span><a href="function/index.html#static-function-connect">connect</a></span></span><span data-ice="signature">(definitions: <span><a href="https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Array">Array</a></span><{store: <span="">AltStore, props: <span><a href="https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Array">Array</a></span><<span><a href="https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/String">string</a></span>>}>): <span>*</span></{store:></span> </p> </div> <div> <div data-ice="description"><p>A component decorator for connecting to immutable stores.</p> </div> </div> </td> <td> </td> </tr> <tr data-ice="target"> <td> <span class="access" data-ice="access">public</span> <span class="override" data-ice="override"></span> </td> <td> <div> <p> <span data-ice="name"><span><a href="function/index.html#static-function-connectAlternative">connectAlternative</a></span></span><span data-ice="signature">(store: <span>*</span>, mapStateToProps: <span>*</span>, WrappedComponent: <span>*</span>): <span>*</span></span> </p> </div> <div> </div> </td> <td> </td> </tr> <tr data-ice="target"> <td> <span class="access" data-ice="access">public</span> <span class="override" data-ice="override"></span> </td> <td> <div> <p> <span data-ice="name"><span><a href="function/index.html#static-function-createActions">createActions</a></span></span><span data-ice="signature">(namespace: <span><a href="https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/String">string</a></span>, actions: <span>array</span><<span><a href="https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/String">string</a></span>>): <span><a href="https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Object">object</a></span></span> </p> </div> <div> <div data-ice="description"><p>Creates simple (data-pass-through) actions with a namespace.</p> </div> </div> </td> <td> </td> </tr> <tr data-ice="target"> <td> <span class="access" data-ice="access">public</span> <span class="override" data-ice="override"></span> </td> <td> <div> <p> <span data-ice="name"><span><a href="function/index.html#static-function-createLogger">createLogger</a></span></span><span data-ice="signature">(name: <span>*</span>): {"log": <span>*</span>, "info": <span>*</span>, "warn": <span>*</span>, "error": <span>*</span>, "trace": <span>*</span>}</span> </p> </div> <div> </div> </td> <td> </td> </tr> <tr data-ice="target"> <td> <span class="access" data-ice="access">public</span> <span class="override" data-ice="override"></span> </td> <td> <div> <p> <span data-ice="name"><span><a href="function/index.html#static-function-createStore">createStore</a></span></span><span data-ice="signature">(displayName: <span>*</span>, objectPattern1: {"alt": <span>*</span>, "state": <span>*</span>, "calls": <span>*</span>, "sources": <span>*</span>, "viewActions": <span>*</span>}): <span>*</span></span> </p> </div> <div> </div> </td> <td> </td> </tr> <tr data-ice="target"> <td> <span class="access" data-ice="access">public</span> <span class="override" data-ice="override"></span> </td> <td> <div> <p> <span data-ice="name"><span><a href="function/index.html#static-function-creatorConstraints">creatorConstraints</a></span></span><span data-ice="signature">()</span> </p> </div> <div> </div> </td> <td> </td> </tr> <tr data-ice="target"> <td> <span class="access" data-ice="access">public</span> <span class="override" data-ice="override"></span> </td> <td> <div> <p> <span data-ice="name"><span><a href="function/index.html#static-function-definitionConstraints">definitionConstraints</a></span></span><span data-ice="signature">()</span> </p> </div> <div> </div> </td> <td> </td> </tr> <tr data-ice="target"> <td> <span class="access" data-ice="access">public</span> <span class="override" data-ice="override"></span> </td> <td> <div> <p> <span data-ice="name"><span><a href="function/index.html#static-function-flatten">flatten</a></span></span><span data-ice="signature">(args: ...<span>*</span>): <span>*</span></span> </p> </div> <div> <div data-ice="description"><p>Reduces a mixed array to a flat one.</p> </div> </div> </td> <td> </td> </tr> <tr data-ice="target"> <td> <span class="access" data-ice="access">public</span> <span class="override" data-ice="override"></span> </td> <td> <div> <p> <span data-ice="name"><span><a href="function/index.html#static-function-getAltInstance">getAltInstance</a></span></span><span data-ice="signature">(): <span>*</span></span> </p> </div> <div> </div> </td> <td> </td> </tr> <tr data-ice="target"> <td> <span class="access" data-ice="access">public</span> <span class="override" data-ice="override"></span> </td> <td> <div> <p> <span data-ice="name"><span><a href="function/index.html#static-function-getLevel">getLevel</a></span></span><span data-ice="signature">(): <span>*</span></span> </p> </div> <div> </div> </td> <td> </td> </tr> <tr data-ice="target"> <td> <span class="access" data-ice="access">public</span> <span class="override" data-ice="override"></span> </td> <td> <div> <p> <span data-ice="name"><span><a href="function/index.html#static-function-getSources">getSources</a></span></span><span data-ice="signature">(calls: <span>*</span>): <span>*</span></span> </p> </div> <div> </div> </td> <td> </td> </tr> <tr data-ice="target"> <td> <span class="access" data-ice="access">public</span> <span class="override" data-ice="override"></span> </td> <td> <div> <p> <span data-ice="name"><span><a href="function/index.html#static-function-handlerConstraints">handlerConstraints</a></span></span><span data-ice="signature">()</span> </p> </div> <div> </div> </td> <td> </td> </tr> <tr data-ice="target"> <td> <span class="access" data-ice="access">public</span> <span class="override" data-ice="override"></span> </td> <td> <div> <p> <span data-ice="name"><span><a href="function/index.html#static-function-handlerFactory">handlerFactory</a></span></span><span data-ice="signature">(action: <span>*</span>, objectPattern1: {"namespace": <span>*</span>, "logger": <span>*</span>}): {"create": <span>*</span>}</span> </p> </div> <div> </div> </td> <td> </td> </tr> <tr data-ice="target"> <td> <span class="access" data-ice="access">public</span> <span class="override" data-ice="override"></span> </td> <td> <div> <p> <span data-ice="name"><span><a href="function/index.html#static-function-resetStores">resetStores</a></span></span><span data-ice="signature">()</span> </p> </div> <div> </div> </td> <td> </td> </tr> <tr data-ice="target"> <td> <span class="access" data-ice="access">public</span> <span class="override" data-ice="override"></span> </td> <td> <div> <p> <span data-ice="name"><span><a href="function/index.html#static-function-setAltInstance">setAltInstance</a></span></span><span data-ice="signature">(alt: <span>*</span>)</span> </p> </div> <div> </div> </td> <td> </td> </tr> <tr data-ice="target"> <td> <span class="access" data-ice="access">public</span> <span class="override" data-ice="override"></span> </td> <td> <div> <p> <span data-ice="name"><span><a href="function/index.html#static-function-setLevel">setLevel</a></span></span><span data-ice="signature">(value: <span>*</span>)</span> </p> </div> <div> </div> </td> <td> </td> </tr> <tr data-ice="target"> <td> <span class="access" data-ice="access">public</span> <span class="override" data-ice="override"></span> </td> <td> <div> <p> <span data-ice="name"><span><a href="function/index.html#static-function-validateCreator">validateCreator</a></span></span><span data-ice="signature">(call: <span>*</span>, logger: <span>*</span>): <span>*</span></span> </p> </div> <div> </div> </td> <td> </td> </tr> <tr data-ice="target"> <td> <span class="access" data-ice="access">public</span> <span class="override" data-ice="override"></span> </td> <td> <div> <p> <span data-ice="name"><span><a href="function/index.html#static-function-validateDefinition">validateDefinition</a></span></span><span data-ice="signature">(definition: <span>*</span>, logger: <span>*</span>): <span>*</span></span> </p> </div> <div> </div> </td> <td> </td> </tr> <tr data-ice="target"> <td> <span class="access" data-ice="access">public</span> <span class="override" data-ice="override"></span> </td> <td> <div> <p> <span data-ice="name"><span><a href="function/index.html#static-function-validateHandler">validateHandler</a></span></span><span data-ice="signature">(handler: <span>*</span>, logger: <span>*</span>): <span>*</span></span> </p> </div> <div> </div> </td> <td> </td> </tr> </tbody> </table> </div> <div data-ice="details"><h2 data-ice="title">Static Public </h2> <div class="detail" data-ice="detail"> <h3 data-ice="anchor" id="static-function-BindHandlers"> <span class="access" data-ice="access">public</span> <span data-ice="name">BindHandlers</span><span data-ice="signature">(args: ...<span>*</span>): <span>*</span></span> <span class="right-info"> <span data-ice="source"><span><a href="file/src/BindHandlers.js.html#lineNumber23">source</a></span></span> </span> </h3> <div data-ice="importPath" class="import-path"><pre class="prettyprint"><code data-ice="importPathCode">import BindHandlers from '<span><a href="file/src/BindHandlers.js.html#lineNumber23">@xailabs/altx/src/BindHandlers.js</a></span>'</code></pre></div> <div data-ice="description"><p>Creates a decorator for binding action handlers to a store. A binding is created for each action that has a matching handler method mapping.</p> <p>The decorator takes any number of action handler definitions as arguments and applies their bindings after concatinating them to a flat list, so you can pass either of these:</p> <ul> <li>an array of handler definitions</li> <li>any number of array of handler definitions</li> <li>any number of handlerdefinitions without arrays</li> <li>any mixed variation</li> </ul> <p>See manual/usage/action-handlers.md for more on this topic.</p> </div> <div data-ice="properties"><div data-ice="properties"> <h4 data-ice="title">Params:</h4> <table class="params"> <thead> <tr><td>Name</td><td>Type</td><td>Attribute</td><td>Description</td></tr> </thead> <tbody> <tr data-ice="property" data-depth="0"> <td data-ice="name" data-depth="0">args</td> <td data-ice="type">...<span>*</span></td> <td data-ice="appendix"></td> <td data-ice="description"></td> </tr> </tbody> </table> </div> </div> <div class="return-params" data-ice="returnParams"> <h4>Return:</h4> <table> <tbody> <tr> <td class="return-type" data-ice="returnType"><span>*</span></td> </tr> </tbody> </table> <div data-ice="returnProperties"> </div> </div> </div> <div class="detail" data-ice="detail"> <h3 data-ice="anchor" id="static-function-bindActions"> <span class="access" data-ice="access">public</span> <span data-ice="name">bindActions</span><span data-ice="signature">(args: ...<span>*</span>): <span>*</span></span> <span class="right-info"> <span data-ice="source"><span><a href="file/src/decorators/bindActions.js.html#lineNumber8">source</a></span></span> </span> </h3> <div data-ice="importPath" class="import-path"><pre class="prettyprint"><code data-ice="importPathCode">import bindActions from '<span><a href="file/src/decorators/bindActions.js.html#lineNumber8">@xailabs/altx/src/decorators/bindActions.js</a></span>'</code></pre></div> <div data-ice="description"><p>Decorates a store with any number of viewAction definitions.</p> </div> <div data-ice="properties"><div data-ice="properties"> <h4 data-ice="title">Params:</h4> <table class="params"> <thead> <tr><td>Name</td><td>Type</td><td>Attribute</td><td>Description</td></tr> </thead> <tbody> <tr data-ice="property" data-depth="0"> <td data-ice="name" data-depth="0">args</td> <td data-ice="type">...<span>*</span></td> <td data-ice="appendix"></td> <td data-ice="description"></td> </tr> </tbody> </table> </div> </div> <div class="return-params" data-ice="returnParams"> <h4>Return:</h4> <table> <tbody> <tr> <td class="return-type" data-ice="returnType"><span>*</span></td> </tr> </tbody> </table> <div data-ice="returnProperties"> </div> </div> </div> <div class="detail" data-ice="detail"> <h3 data-ice="anchor" id="static-function-bindCalls"> <span class="access" data-ice="access">public</span> <span data-ice="name">bindCalls</span><span data-ice="signature">(args: ...<span>*</span>): <span>*</span></span> <span class="right-info"> <span data-ice="source"><span><a href="file/src/decorators/bindCalls.js.html#lineNumber7">source</a></span></span> </span> </h3> <div data-ice="importPath" class="import-path"><pre class="prettyprint"><code data-ice="importPathCode">import bindCalls from '<span><a href="file/src/decorators/bindCalls.js.html#lineNumber7">@xailabs/altx/src/decorators/bindCalls.js</a></span>'</code></pre></div> <div data-ice="description"><p>Decorates a store with any number of call definitions.</p> </div> <div data-ice="properties"><div data-ice="properties"> <h4 data-ice="title">Params:</h4> <table class="params"> <thead> <tr><td>Name</td><td>Type</td><td>Attribute</td><td>Description</td></tr> </thead> <tbody> <tr data-ice="property" data-depth="0"> <td data-ice="name" data-depth="0">args</td> <td data-ice="type">...<span>*</span></td> <td data-ice="appendix"></td> <td data-ice="description"></td> </tr> </tbody> </table> </div> </div> <div class="return-params" data-ice="returnParams"> <h4>Return:</h4> <table> <tbody> <tr> <td class="return-type" data-ice="returnType"><span>*</span></td> </tr> </tbody> </table> <div data-ice="returnProperties"> </div> </div> </div> <div class="detail" data-ice="detail"> <h3 data-ice="anchor" id="static-function-bindHandlers"> <span class="access" data-ice="access">public</span> <span data-ice="name">bindHandlers</span><span data-ice="signature">(actions: <span>*</span>, handlers: ...<span>*</span>): <span>*</span></span> <span class="right-info"> <span data-ice="source"><span><a href="file/src/decorators/bindHandlers.js.html#lineNumber7">source</a></span></span> </span> </h3> <div data-ice="importPath" class="import-path"><pre class="prettyprint"><code data-ice="importPathCode">import bindHandlers from '<span><a href="file/src/decorators/bindHandlers.js.html#lineNumber7">@xailabs/altx/src/decorators/bindHandlers.js</a></span>'</code></pre></div> <div data-ice="description"><p>Decorates a store with any number of action handlers.</p> </div> <div data-ice="properties"><div data-ice="properties"> <h4 data-ice="title">Params:</h4> <table class="params"> <thead> <tr><td>Name</td><td>Type</td><td>Attribute</td><td>Description</td></tr> </thead> <tbody> <tr data-ice="property" data-depth="0"> <td data-ice="name" data-depth="0">actions</td> <td data-ice="type"><span>*</span></td> <td data-ice="appendix"></td> <td data-ice="description"></td> </tr> <tr data-ice="property" data-depth="0"> <td data-ice="name" data-depth="0">handlers</td> <td data-ice="type">...<span>*</span></td> <td data-ice="appendix"></td> <td data-ice="description"></td> </tr> </tbody> </table> </div> </div> <div class="return-params" data-ice="returnParams"> <h4>Return:</h4> <table> <tbody> <tr> <td class="return-type" data-ice="returnType"><span>*</span></td> </tr> </tbody> </table> <div data-ice="returnProperties"> </div> </div> </div> <div class="detail" data-ice="detail"> <h3 data-ice="anchor" id="static-function-callFactory"> <span class="access" data-ice="access">public</span> <span data-ice="name">callFactory</span><span data-ice="signature">(name: <span>*</span>, objectPattern1: {"namespace": <span>*</span>, "defaultActions": <span>*</span>, "actions": <span>*</span>, "logger": <span>*</span>}): {"name": <span>*</span>, "actions": <span>*</span>, "create": <span>*</span>, "createActions": <span>*</span>}</span> <span class="right-info"> <span data-ice="source"><span><a href="file/src/callFactory.js.html#lineNumber5">source</a></span></span> </span> </h3> <div data-ice="importPath" class="import-path"><pre class="prettyprint"><code data-ice="importPathCode">import callFactory from '<span><a href="file/src/callFactory.js.html#lineNumber5">@xailabs/altx/src/callFactory.js</a></span>'</code></pre></div> <div data-ice="properties"><div data-ice="properties"> <h4 data-ice="title">Params:</h4> <table class="params"> <thead> <tr><td>Name</td><td>Type</td><td>Attribute</td><td>Description</td></tr> </thead> <tbody> <tr data-ice="property" data-depth="0"> <td data-ice="name" data-depth="0">name</td> <td data-ice="type"><span>*</span></td> <td data-ice="appendix"></td> <td data-ice="description"></td> </tr> <tr data-ice="property" data-depth="0"> <td data-ice="name" data-depth="0">objectPattern1</td> <td data-ice="type">{"namespace": <span>*</span>, "defaultActions": <span>*</span>, "actions": <span>*</span>, "logger": <span>*</span>}</td> <td data-ice="appendix"><ul><li>optional</li> <li>default: {}</li></ul></td> <td data-ice="description"></td> </tr> </tbody> </table> </div> </div> <div class="return-params" data-ice="returnParams"> <h4>Return:</h4> <table> <tbody> <tr> <td class="return-type" data-ice="returnType">{"name": <span>*</span>, "actions": <span>*</span>, "create": <span>*</span>, "createActions": <span>*</span>}</td> </tr> </tbody> </table> <div data-ice="returnProperties"> </div> </div> </div> <div class="detail" data-ice="detail"> <h3 data-ice="anchor" id="static-function-callSeries"> <span class="access" data-ice="access">public</span> <span data-ice="name">callSeries</span><span data-ice="signature">(calls: <span>array</span>, options: <span><a href="https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Object">object</a></span>): <span>promise</span></span> <span class="right-info"> <span data-ice="source"><span><a href="file/src/callSeries.js.html#lineNumber13">source</a></span></span> </span> </h3> <div data-ice="importPath" class="import-path"><pre class="prettyprint"><code data-ice="importPathCode">import callSeries from '<span><a href="file/src/callSeries.js.html#lineNumber13">@xailabs/altx/src/callSeries.js</a></span>'</code></pre></div> <div data-ice="description"><p>Retuns a promise and executes a series of calls. Uses a timeout initially so that we don't run into errors when still in the middle of a dispatch.</p> <p> import {callSeries} from 'shared/flux';</p> </div> <div data-ice="properties"><div data-ice="properties"> <h4 data-ice="title">Params:</h4> <table class="params"> <thead> <tr><td>Name</td><td>Type</td><td>Attribute</td><td>Description</td></tr> </thead> <tbody> <tr data-ice="property" data-depth="0"> <td data-ice="name" data-depth="0">calls</td> <td data-ice="type"><span>array</span></td> <td data-ice="appendix"></td> <td data-ice="description"><p>An array of function that each returns a promise</p> </td> </tr> <tr data-ice="property" data-depth="0"> <td data-ice="name" data-depth="0">options</td> <td data-ice="type"><span><a href="https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Object">object</a></span></td> <td data-ice="appendix"></td> <td data-ice="description"><p>An array of function that each returns a promise</p> </td> </tr> <tr data-ice="property" data-depth="1"> <td data-ice="name" data-depth="1">options.log</td> <td data-ice="type"><span><a href="https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Boolean">boolean</a></span></td> <td data-ice="appendix"></td> <td data-ice="description"><p>Whether to log individual calls</p> </td> </tr> </tbody> </table> </div> </div> <div class="return-params" data-ice="returnParams"> <h4>Return:</h4> <table> <tbody> <tr> <td class="return-type" data-ice="returnType"><span>promise</span></td> <td class="return-desc" data-ice="returnDescription"><p>A promise that will be resolved when all calls succeeded or rejected if one call failed</p> </td> </tr> </tbody> </table> <div data-ice="returnProperties"> </div> </div> </div> <div class="detail" data-ice="detail"> <h3 data-ice="anchor" id="static-function-connect"> <span class="access" data-ice="access">public</span> <span data-ice="name">connect</span><span data-ice="signature">(definitions: <span><a href="https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Array">Array</a></span><{store: <span="">AltStore, props: <span><a href="https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Array">Array</a></span><<span><a href="https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/String">string</a></span>>}>): <span>*</span></{store:></span> <span class="right-info"> <span data-ice="source"><span><a href="file/src/decorators/connect.js.html#lineNumber97">source</a></span></span> </span> </h3> <div data-ice="importPath" class="import-path"><pre class="prettyprint"><code data-ice="importPathCode">import connect from '<span><a href="file/src/decorators/connect.js.html#lineNumber97">@xailabs/altx/src/decorators/connect.js</a></span>'</code></pre></div> <div data-ice="description"><p>A component decorator for connecting to immutable stores.</p> <p>Basically a wrapper around <code>alt/utils/connectToStores</code>.<br>Adds the necessary static methods <code>getStores()</code> and <code>getPropsFromStores()</code> to the decorated component.</p> <ul> <li>Supports multiple stores.</li> <li>Supports a simplified, string-based access to stores, with optional renaming of props.</li> <li>Supports more flexible, redux-like access to stores using mapper functions.</li> </ul> <h3 id="string-notation">String notation</h3> </div> <div data-ice="properties"><div data-ice="properties"> <h4 data-ice="title">Params:</h4> <table class="params"> <thead> <tr><td>Name</td><td>Type</td><td>Attribute</td><td>Description</td></tr> </thead> <tbody> <tr data-ice="property" data-depth="0"> <td data-ice="name" data-depth="0">definitions</td> <td data-ice="type"><span><a href="https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Array">Array</a></span><{store: <span="">AltStore, props: <span><a href="https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Array">Array</a></span><<span><a href="https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/String">string</a></span>>}></{store:></td> <td data-ice="appendix"></td> <td data-ice="description"><p>A list of objects that each define a store connection</p> </td> </tr> </tbody> </table> </div> </div> <div class="return-params" data-ice="returnParams"> <h4>Return:</h4> <table> <tbody> <tr> <td class="return-type" data-ice="returnType"><span>*</span></td> </tr> </tbody> </table> <div data-ice="returnProperties"> </div> </div> <div data-ice="example"> <h4>Example:</h4> <div class="example-doc" data-ice="exampleDoc"> <pre class="prettyprint source-code"><code data-ice="exampleCode">@connect([{store: MyStore, props: ['myValue', 'anotherValue']}]) export default class MyComponent extends React.Component { render() { const {myValue, anotherValue} = this.props; ... } } You can rename props using the ` as ` alias syntax</code></pre> </div> <div class="example-doc" data-ice="exampleDoc"> <pre class="prettyprint source-code"><code data-ice="exampleCode">@connect([{ store: PeopleStore, props: ['items as people'] }, { store: ProductStore, props: ['items as products'] }]) export default class MyComponent extends React.Component { render() { // this.props.people, this.props.products, ... } } ### Function notation Use mapper functions instead of strings in order to manually retrieve store values. The function receives the store state and the component props.</code></pre> </div> <div class="example-doc" data-ice="exampleDoc"> <pre class="prettyprint source-code"><code data-ice="exampleCode">@connect([{ store: MyStore, props: (state, props) => { return { item: state.get('items').filter(item => item.get('id') === props.id) } } }]) export default class MyComponent extends React.Component { render() { const item = this.props.item; } } Technically, you could also mix all access methods, but this defeats the purpose of simple access:</code></pre> </div> <div class="example-doc" data-ice="exampleDoc"> <pre class="prettyprint source-code"><code data-ice="exampleCode">@connect([{ store: MyStore, props: ['someProp', 'anotherProp', (state, props) => { return { item: state.get('items').filter(item => item.get('id') === props.id) } }, 'some.nested.value as foo'] }]) export default class MyComponent extends React.Component { ... } There are however valid usecase for mixing access methods. For example, you might have keys that themselves contain dots. For example, that is the case when using `validate.js` with nested constraints and keeping validation results in the store. There might be an `errors` map in your storewith keys like `user.address.street`. In such a case you wouldn't be able to access those values because the dots do not represent the actual keyPath in the tree:</code></pre> </div> <div class="example-doc" data-ice="exampleDoc"> <pre class="prettyprint source-code"><code data-ice="exampleCode">@connect([{ store, props: ['user.address.street', (state) => ({errors: state.getIn(['errors', 'user.address.street'])})] }])</code></pre> </div> </div> <div data-ice="see"><h4>See:</h4><ul><li><span><a href="https://github.com/goatslacker/alt/blob/master/docs/utils/immutable.md">https://github.com/goatslacker/alt/blob/master/docs/utils/immutable.md</a></span></li> <li><span><a href="https://github.com/goatslacker/alt/blob/master/src/utils/connectToStores.js">https://github.com/goatslacker/alt/blob/master/src/utils/connectToStores.js</a></span></li></ul></div> </div> <div class="detail" data-ice="detail"> <h3 data-ice="anchor" id="static-function-connectAlternative"> <span class="access" data-ice="access">public</span> <span data-ice="name">connectAlternative</span><span data-ice="signature">(store: <span>*</span>, mapStateToProps: <span>*</span>, WrappedComponent: <span>*</span>): <span>*</span></span> <span class="right-info"> <span data-ice="source"><span><a href="file/src/decorators/connect.js.html#lineNumber178">source</a></span></span> </span> </h3> <div data-ice="importPath" class="import-path"><pre class="prettyprint"><code data-ice="importPathCode">import {connectAlternative} from '<span><a href="file/src/decorators/connect.js.html#lineNumber178">@xailabs/altx/src/decorators/connect.js</a></span>'</code></pre></div> <div data-ice="properties"><div data-ice="properties"> <h4 data-ice="title">Params:</h4> <table class="params"> <thead> <tr><td>Name</td><td>Type</td><td>Attribute</td><td>Description</td></tr> </thead> <tbody> <tr data-ice="property" data-depth="0"> <td data-ice="name" data-depth="0">store</td> <td data-ice="type"><span>*</span></td> <td data-ice="appendix"></td> <td data-ice="description"></td> </tr> <tr data-ice="property" data-depth="0"> <td data-ice="name" data-depth="0">mapStateToProps</td> <td data-ice="type"><span>*</span></td> <td data-ice="appendix"></td> <td data-ice="description"></td> </tr> <tr data-ice="property" data-depth="0"> <td data-ice="name" data-depth="0">WrappedComponent</td> <td data-ice="type"><span>*</span></td> <td data-ice="appendix"></td> <td data-ice="description"></td> </tr> </tbody> </table> </div> </div> <div class="return-params" data-ice="returnParams"> <h4>Return:</h4> <table> <tbody> <tr> <td class="return-type" data-ice="returnType"><span>*</span></td> </tr> </tbody> </table> <div data-ice="returnProperties"> </div> </div> </div> <div class="detail" data-ice="detail"> <h3 data-ice="anchor" id="static-function-createActions"> <span class="access" data-ice="access">public</span> <span data-ice="name">createActions</span><span data-ice="signature">(namespace: <span><a href="https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/String">string</a></span>, actions: <span>array</span><<span><a href="https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/String">string</a></span>>): <span><a href="https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Object">object</a></span></span> <span class="right-info"> <span data-ice="source"><span><a href="file/src/createActions.js.html#lineNumber11">source</a></span></span> </span> </h3> <div data-ice="importPath" class="import-path"><pre class="prettyprint"><code data-ice="importPathCode">import createActions from '<span><a href="file/src/createActions.js.html#lineNumber11">@xailabs/altx/src/createActions.js</a></span>'</code></pre></div> <div data-ice="description"><p>Creates simple (data-pass-through) actions with a namespace. Basically just like <code>alt.generateActions</code>, but within a given namespace instead of 'global'.</p> </div> <div data-ice="properties"><div data-ice="properties"> <h4 data-ice="title">Params:</h4> <table class="params"> <thead> <tr><td>Name</td><td>Type</td><td>Attribute</td><td>Description</td></tr> </thead> <tbody> <tr data-ice="property" data-depth="0"> <td data-ice="name" data-depth="0">namespace</td> <td data-ice="type"><span><a href="https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/String">string</a></span></td> <td data-ice="appendix"></td> <td data-ice="description"><p>The namespace to use for the actions</p> </td> </tr> <tr data-ice="property" data-depth="0"> <td data-ice="name" data-depth="0">actions</td> <td data-ice="type"><span>array</span><<span><a href="https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/String">string</a></span>></td> <td data-ice="appendix"></td> <td data-ice="description"><p>An array of action names</p> </td> </tr> </tbody> </table> </div> </div> <div class="return-params" data-ice="returnParams"> <h4>Return:</h4> <table> <tbody> <tr> <td class="return-type" data-ice="returnType"><span><a href="https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Object">object</a></span></td> <td class="return-desc" data-ice="returnDescription"><p>An object containing the generated actions and constants</p> </td> </tr> </tbody> </table> <div data-ice="returnProperties"> </div> </div> </div> <div class="detail" data-ice="detail"> <h3 data-ice="anchor" id="static-function-createLogger"> <span class="access" data-ice="access">public</span> <span data-ice="name">createLogger</span><span data-ice="signature">(name: <span>*</span>): {"log": <span>*</span>, "info": <span>*</span>, "warn": <span>*</span>, "error": <span>*</span>, "trace": <span>*</span>}</span> <span class="right-info"> <span data-ice="source"><span><a href="file/src/utils/logging.js.html#lineNumber18">source</a></span></span> </span> </h3> <div data-ice="importPath" class="import-path"><pre class="prettyprint"><code data-ice="importPathCode">import {createLogger} from '<span><a href="file/src/utils/logging.js.html#lineNumber18">@xailabs/altx/src/utils/logging.js</a></span>'</code></pre></div> <div data-ice="properties"><div data-ice="properties"> <h4 data-ice="title">Params:</h4> <table class="params"> <thead> <tr><td>Name</td><td>Type</td><td>Attribute</td><td>Description</td></tr> </thead> <tbody> <tr data-ice="property" data-depth="0"> <td data-ice="name" data-depth="0">name</td> <td data-ice="type"><span>*</span></td> <td data-ice="appendix"></td> <td data-ice="description"></td> </tr> </tbody> </table> </div> </div> <div class="return-params" data-ice="returnParams"> <h4>Return:</h4> <table> <tbody> <tr> <td class="return-type" data-ice="returnType">{"log": <span>*</span>, "info": <span>*</span>, "warn": <span>*</span>, "error": <span>*</span>, "trace": <span>*</span>}</td> </tr> </tbody> </table> <div data-ice="returnProperties"> </div> </div> </div>