[
{
"__docId__": 1,
"kind": "external",
"name": "Infinity",
"externalLink": "https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Infinity",
"memberof": "src/.external-ecmascript.js",
"static": true,
"longname": "src/.external-ecmascript.js~Infinity",
"access": "public",
"description": "",
"builtinExternal": true
},
{
"__docId__": 2,
"kind": "external",
"name": "NaN",
"externalLink": "https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/NaN",
"memberof": "src/.external-ecmascript.js",
"static": true,
"longname": "src/.external-ecmascript.js~NaN",
"access": "public",
"description": "",
"builtinExternal": true
},
{
"__docId__": 3,
"kind": "external",
"name": "undefined",
"externalLink": "https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/undefined",
"memberof": "src/.external-ecmascript.js",
"static": true,
"longname": "src/.external-ecmascript.js~undefined",
"access": "public",
"description": "",
"builtinExternal": true
},
{
"__docId__": 4,
"kind": "external",
"name": "null",
"externalLink": "https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/null",
"memberof": "src/.external-ecmascript.js",
"static": true,
"longname": "src/.external-ecmascript.js~null",
"access": "public",
"description": "",
"builtinExternal": true
},
{
"__docId__": 5,
"kind": "external",
"name": "Object",
"externalLink": "https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Object",
"memberof": "src/.external-ecmascript.js",
"static": true,
"longname": "src/.external-ecmascript.js~Object",
"access": "public",
"description": "",
"builtinExternal": true
},
{
"__docId__": 6,
"kind": "external",
"name": "object",
"externalLink": "https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Object",
"memberof": "src/.external-ecmascript.js",
"static": true,
"longname": "src/.external-ecmascript.js~object",
"access": "public",
"description": "",
"builtinExternal": true
},
{
"__docId__": 7,
"kind": "external",
"name": "Function",
"externalLink": "https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Function",
"memberof": "src/.external-ecmascript.js",
"static": true,
"longname": "src/.external-ecmascript.js~Function",
"access": "public",
"description": "",
"builtinExternal": true
},
{
"__docId__": 8,
"kind": "external",
"name": "function",
"externalLink": "https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Function",
"memberof": "src/.external-ecmascript.js",
"static": true,
"longname": "src/.external-ecmascript.js~function",
"access": "public",
"description": "",
"builtinExternal": true
},
{
"__docId__": 9,
"kind": "external",
"name": "Boolean",
"externalLink": "https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Boolean",
"memberof": "src/.external-ecmascript.js",
"static": true,
"longname": "src/.external-ecmascript.js~Boolean",
"access": "public",
"description": "",
"builtinExternal": true
},
{
"__docId__": 10,
"kind": "external",
"name": "boolean",
"externalLink": "https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Boolean",
"memberof": "src/.external-ecmascript.js",
"static": true,
"longname": "src/.external-ecmascript.js~boolean",
"access": "public",
"description": "",
"builtinExternal": true
},
{
"__docId__": 11,
"kind": "external",
"name": "Symbol",
"externalLink": "https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Symbol",
"memberof": "src/.external-ecmascript.js",
"static": true,
"longname": "src/.external-ecmascript.js~Symbol",
"access": "public",
"description": "",
"builtinExternal": true
},
{
"__docId__": 12,
"kind": "external",
"name": "Error",
"externalLink": "https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Error",
"memberof": "src/.external-ecmascript.js",
"static": true,
"longname": "src/.external-ecmascript.js~Error",
"access": "public",
"description": "",
"builtinExternal": true
},
{
"__docId__": 13,
"kind": "external",
"name": "EvalError",
"externalLink": "https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/EvalError",
"memberof": "src/.external-ecmascript.js",
"static": true,
"longname": "src/.external-ecmascript.js~EvalError",
"access": "public",
"description": "",
"builtinExternal": true
},
{
"__docId__": 14,
"kind": "external",
"name": "InternalError",
"externalLink": "https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/InternalError",
"memberof": "src/.external-ecmascript.js",
"static": true,
"longname": "src/.external-ecmascript.js~InternalError",
"access": "public",
"description": "",
"builtinExternal": true
},
{
"__docId__": 15,
"kind": "external",
"name": "RangeError",
"externalLink": "https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/RangeError",
"memberof": "src/.external-ecmascript.js",
"static": true,
"longname": "src/.external-ecmascript.js~RangeError",
"access": "public",
"description": "",
"builtinExternal": true
},
{
"__docId__": 16,
"kind": "external",
"name": "ReferenceError",
"externalLink": "https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/ReferenceError",
"memberof": "src/.external-ecmascript.js",
"static": true,
"longname": "src/.external-ecmascript.js~ReferenceError",
"access": "public",
"description": "",
"builtinExternal": true
},
{
"__docId__": 17,
"kind": "external",
"name": "SyntaxError",
"externalLink": "https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/SyntaxError",
"memberof": "src/.external-ecmascript.js",
"static": true,
"longname": "src/.external-ecmascript.js~SyntaxError",
"access": "public",
"description": "",
"builtinExternal": true
},
{
"__docId__": 18,
"kind": "external",
"name": "TypeError",
"externalLink": "https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/TypeError",
"memberof": "src/.external-ecmascript.js",
"static": true,
"longname": "src/.external-ecmascript.js~TypeError",
"access": "public",
"description": "",
"builtinExternal": true
},
{
"__docId__": 19,
"kind": "external",
"name": "URIError",
"externalLink": "https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/URIError",
"memberof": "src/.external-ecmascript.js",
"static": true,
"longname": "src/.external-ecmascript.js~URIError",
"access": "public",
"description": "",
"builtinExternal": true
},
{
"__docId__": 20,
"kind": "external",
"name": "Number",
"externalLink": "https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Number",
"memberof": "src/.external-ecmascript.js",
"static": true,
"longname": "src/.external-ecmascript.js~Number",
"access": "public",
"description": "",
"builtinExternal": true
},
{
"__docId__": 21,
"kind": "external",
"name": "number",
"externalLink": "https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Number",
"memberof": "src/.external-ecmascript.js",
"static": true,
"longname": "src/.external-ecmascript.js~number",
"access": "public",
"description": "",
"builtinExternal": true
},
{
"__docId__": 22,
"kind": "external",
"name": "Date",
"externalLink": "https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Date",
"memberof": "src/.external-ecmascript.js",
"static": true,
"longname": "src/.external-ecmascript.js~Date",
"access": "public",
"description": "",
"builtinExternal": true
},
{
"__docId__": 23,
"kind": "external",
"name": "String",
"externalLink": "https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/String",
"memberof": "src/.external-ecmascript.js",
"static": true,
"longname": "src/.external-ecmascript.js~String",
"access": "public",
"description": "",
"builtinExternal": true
},
{
"__docId__": 24,
"kind": "external",
"name": "string",
"externalLink": "https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/String",
"memberof": "src/.external-ecmascript.js",
"static": true,
"longname": "src/.external-ecmascript.js~string",
"access": "public",
"description": "",
"builtinExternal": true
},
{
"__docId__": 25,
"kind": "external",
"name": "RegExp",
"externalLink": "https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/RegExp",
"memberof": "src/.external-ecmascript.js",
"static": true,
"longname": "src/.external-ecmascript.js~RegExp",
"access": "public",
"description": "",
"builtinExternal": true
},
{
"__docId__": 26,
"kind": "external",
"name": "Array",
"externalLink": "https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Array",
"memberof": "src/.external-ecmascript.js",
"static": true,
"longname": "src/.external-ecmascript.js~Array",
"access": "public",
"description": "",
"builtinExternal": true
},
{
"__docId__": 27,
"kind": "external",
"name": "Int8Array",
"externalLink": "https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Int8Array",
"memberof": "src/.external-ecmascript.js",
"static": true,
"longname": "src/.external-ecmascript.js~Int8Array",
"access": "public",
"description": "",
"builtinExternal": true
},
{
"__docId__": 28,
"kind": "external",
"name": "Uint8Array",
"externalLink": "https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Uint8Array",
"memberof": "src/.external-ecmascript.js",
"static": true,
"longname": "src/.external-ecmascript.js~Uint8Array",
"access": "public",
"description": "",
"builtinExternal": true
},
{
"__docId__": 29,
"kind": "external",
"name": "Uint8ClampedArray",
"externalLink": "https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Uint8ClampedArray",
"memberof": "src/.external-ecmascript.js",
"static": true,
"longname": "src/.external-ecmascript.js~Uint8ClampedArray",
"access": "public",
"description": "",
"builtinExternal": true
},
{
"__docId__": 30,
"kind": "external",
"name": "Int16Array",
"externalLink": "https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Int16Array",
"memberof": "src/.external-ecmascript.js",
"static": true,
"longname": "src/.external-ecmascript.js~Int16Array",
"access": "public",
"description": "",
"builtinExternal": true
},
{
"__docId__": 31,
"kind": "external",
"name": "Uint16Array",
"externalLink": "https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Uint16Array",
"memberof": "src/.external-ecmascript.js",
"static": true,
"longname": "src/.external-ecmascript.js~Uint16Array",
"access": "public",
"description": "",
"builtinExternal": true
},
{
"__docId__": 32,
"kind": "external",
"name": "Int32Array",
"externalLink": "https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Int32Array",
"memberof": "src/.external-ecmascript.js",
"static": true,
"longname": "src/.external-ecmascript.js~Int32Array",
"access": "public",
"description": "",
"builtinExternal": true
},
{
"__docId__": 33,
"kind": "external",
"name": "Uint32Array",
"externalLink": "https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Uint32Array",
"memberof": "src/.external-ecmascript.js",
"static": true,
"longname": "src/.external-ecmascript.js~Uint32Array",
"access": "public",
"description": "",
"builtinExternal": true
},
{
"__docId__": 34,
"kind": "external",
"name": "Float32Array",
"externalLink": "https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Float32Array",
"memberof": "src/.external-ecmascript.js",
"static": true,
"longname": "src/.external-ecmascript.js~Float32Array",
"access": "public",
"description": "",
"builtinExternal": true
},
{
"__docId__": 35,
"kind": "external",
"name": "Float64Array",
"externalLink": "https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Float64Array",
"memberof": "src/.external-ecmascript.js",
"static": true,
"longname": "src/.external-ecmascript.js~Float64Array",
"access": "public",
"description": "",
"builtinExternal": true
},
{
"__docId__": 36,
"kind": "external",
"name": "Map",
"externalLink": "https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Map",
"memberof": "src/.external-ecmascript.js",
"static": true,
"longname": "src/.external-ecmascript.js~Map",
"access": "public",
"description": "",
"builtinExternal": true
},
{
"__docId__": 37,
"kind": "external",
"name": "Set",
"externalLink": "https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Set",
"memberof": "src/.external-ecmascript.js",
"static": true,
"longname": "src/.external-ecmascript.js~Set",
"access": "public",
"description": "",
"builtinExternal": true
},
{
"__docId__": 38,
"kind": "external",
"name": "WeakMap",
"externalLink": "https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/WeakMap",
"memberof": "src/.external-ecmascript.js",
"static": true,
"longname": "src/.external-ecmascript.js~WeakMap",
"access": "public",
"description": "",
"builtinExternal": true
},
{
"__docId__": 39,
"kind": "external",
"name": "WeakSet",
"externalLink": "https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/WeakSet",
"memberof": "src/.external-ecmascript.js",
"static": true,
"longname": "src/.external-ecmascript.js~WeakSet",
"access": "public",
"description": "",
"builtinExternal": true
},
{
"__docId__": 40,
"kind": "external",
"name": "ArrayBuffer",
"externalLink": "https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/ArrayBuffer",
"memberof": "src/.external-ecmascript.js",
"static": true,
"longname": "src/.external-ecmascript.js~ArrayBuffer",
"access": "public",
"description": "",
"builtinExternal": true
},
{
"__docId__": 41,
"kind": "external",
"name": "DataView",
"externalLink": "https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/DataView",
"memberof": "src/.external-ecmascript.js",
"static": true,
"longname": "src/.external-ecmascript.js~DataView",
"access": "public",
"description": "",
"builtinExternal": true
},
{
"__docId__": 42,
"kind": "external",
"name": "JSON",
"externalLink": "https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/JSON",
"memberof": "src/.external-ecmascript.js",
"static": true,
"longname": "src/.external-ecmascript.js~JSON",
"access": "public",
"description": "",
"builtinExternal": true
},
{
"__docId__": 43,
"kind": "external",
"name": "Promise",
"externalLink": "https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Promise",
"memberof": "src/.external-ecmascript.js",
"static": true,
"longname": "src/.external-ecmascript.js~Promise",
"access": "public",
"description": "",
"builtinExternal": true
},
{
"__docId__": 44,
"kind": "external",
"name": "Generator",
"externalLink": "https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Generator",
"memberof": "src/.external-ecmascript.js",
"static": true,
"longname": "src/.external-ecmascript.js~Generator",
"access": "public",
"description": "",
"builtinExternal": true
},
{
"__docId__": 45,
"kind": "external",
"name": "GeneratorFunction",
"externalLink": "https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/GeneratorFunction",
"memberof": "src/.external-ecmascript.js",
"static": true,
"longname": "src/.external-ecmascript.js~GeneratorFunction",
"access": "public",
"description": "",
"builtinExternal": true
},
{
"__docId__": 46,
"kind": "external",
"name": "Reflect",
"externalLink": "https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Reflect",
"memberof": "src/.external-ecmascript.js",
"static": true,
"longname": "src/.external-ecmascript.js~Reflect",
"access": "public",
"description": "",
"builtinExternal": true
},
{
"__docId__": 47,
"kind": "external",
"name": "Proxy",
"externalLink": "https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Proxy",
"memberof": "src/.external-ecmascript.js",
"static": true,
"longname": "src/.external-ecmascript.js~Proxy",
"access": "public",
"description": "",
"builtinExternal": true
},
{
"__docId__": 48,
"kind": "file",
"name": "src/children.js",
"content": "import { getReactElementFromRJX, } from './main';\r\n/**\r\n * returns a valid rjx.children property\r\n * @param {Object} options\r\n * @param {Object} [options.rjx ={}]- Valid RJX JSON \r\n * @param {Object} [options.props=options.rjx.children] - Props to pull children Object.assign(rjx.props,rjx.asyncprops,rjx.thisprops,rjx.windowprops) \r\n * @returns {Object[]|String} returns a valid rjx.children property that's either an array of RJX objects or a string \r\n * @example \r\n * const sampleRJX = {\r\n component: 'div',\r\n props: {\r\n id: 'generatedRJX',\r\n className:'rjx',\r\n },\r\n children: [\r\n {\r\n component: 'p',\r\n props: {\r\n style: {\r\n color: 'red',\r\n },\r\n },\r\n children:'hello world',\r\n },\r\n {\r\n component: 'div',\r\n children: [\r\n {\r\n component: 'ul',\r\n children: [\r\n {\r\n component: 'li',\r\n children:'list',\r\n },\r\n ],\r\n },\r\n ],\r\n },\r\n ],\r\n};\r\nconst RJXChildren = getChildrenProperty({ rjx: sampleRJX, }); //=> [ [rjx Object],[rjx Object]]\r\nconst RJXChildrenPTag = getChildrenProperty({ rjx: sampleRJX.children[ 0 ], }); //=>hello world\r\n */\r\nexport function getChildrenProperty(options = {}) {\r\n const { rjx = {}, } = options;\r\n const props = options.props || rjx.props || {};\r\n if (props._children /* && !rjx.children */) {\r\n if (Array.isArray(props._children) || typeof props._children === 'string'){\r\n return props._children;\r\n } else {\r\n return rjx.children;\r\n }\r\n } else if (typeof rjx.children === 'undefined'){\r\n if (props && props.children && (typeof props.children !== 'undefined' || Array.isArray(props.children))) {\r\n return props.children;\r\n } else {\r\n return null; \r\n }\r\n } else {\r\n return rjx.children;\r\n }\r\n}\r\n\r\n/**\r\n * Used to pass properties down to child components if passprops is set to true\r\n * @param {Object} options\r\n * @param {Object} [options.rjx ={}] - Valid RJX JSON \r\n * @param {Object} [options.childrjx ={}] - Valid RJX JSON \r\n * @param {Number} options.renderIndex - React key property \r\n * @param {Object} [options.props=options.rjx.props] - Props to pull children Object.assign(rjx.props,rjx.asyncprops,rjx.thisprops,rjx.windowprops) \r\n * @returns {Object|String} returns a valid Valid RJX Child object or a string \r\n */\r\nexport function getChildrenProps(options = {}) {\r\n const { rjx = {}, childrjx, renderIndex, } = options;\r\n const props = options.props || rjx.props || {};\r\n\r\n return (rjx.passprops && typeof childrjx==='object')\r\n ? Object.assign({},\r\n childrjx, {\r\n props: Object.assign({},\r\n props,\r\n ((childrjx.thisprops && childrjx.thisprops.style) // this is to make sure when you bind props, if you've defined props in a dynamic property, to not use bind props to remove passing down styles\r\n || (childrjx.asyncprops && childrjx.asyncprops.style)\r\n || (childrjx.windowprops && childrjx.windowprops.style))\r\n ? {}\r\n : {\r\n style: {},\r\n },\r\n childrjx.props,\r\n { key: renderIndex + Math.random(), }),\r\n })\r\n : childrjx;\r\n}\r\n\r\n/**\r\n * returns React Child Elements via RJX\r\n * @param {*} options \r\n * @property {object} this - options for getReactElementFromRJX\r\n * @property {Object} [this.componentLibraries] - react components to render with RJX\r\n * @property {boolean} [this.debug=false] - use debug messages\r\n * @property {function} [this.logError=console.error] - error logging function\r\n * @property {string[]} [this.boundedComponents=[]] - list of components that require a bound this context (usefult for redux router)\r\n */\r\nexport function getRJXChildren(options = {}) {\r\n // eslint-disable-next-line\r\n const { rjx, resources, renderIndex, logError = console.error, } = options;\r\n try {\r\n const props = options.props || rjx.props || {};\r\n rjx.children = getChildrenProperty({ rjx, props, });\r\n\r\n return (rjx.children && Array.isArray(rjx.children) && typeof rjx.children !== 'string')\r\n ? rjx.children.map(childrjx => getReactElementFromRJX.call(this, getChildrenProps({ rjx, childrjx, props, renderIndex, }), resources))\r\n : rjx.children;\r\n\r\n } catch (e) {\r\n logError(e);\r\n return null;\r\n }\r\n}",
"static": true,
"longname": "/Users/yawjosephetse/Developer/github/repetere/rjx/src/children.js",
"access": "public",
"description": null,
"lineNumber": 1
},
{
"__docId__": 49,
"kind": "function",
"name": "getChildrenProperty",
"memberof": "src/children.js",
"generator": false,
"async": false,
"static": true,
"longname": "src/children.js~getChildrenProperty",
"access": "public",
"export": true,
"importPath": "rjx/src/children.js",
"importStyle": "{getChildrenProperty}",
"description": "returns a valid rjx.children property",
"examples": [
"const sampleRJX = {\ncomponent: 'div',\nprops: {\nid: 'generatedRJX',\nclassName:'rjx',\n},\nchildren: [\n{\ncomponent: 'p',\nprops: {\nstyle: {\ncolor: 'red',\n},\n},\nchildren:'hello world',\n},\n{\ncomponent: 'div',\nchildren: [\n{\ncomponent: 'ul',\nchildren: [\n{\ncomponent: 'li',\nchildren:'list',\n},\n],\n},\n],\n},\n],\n};\nconst RJXChildren = getChildrenProperty({ rjx: sampleRJX, }); //=> [ [rjx Object],[rjx Object]]\nconst RJXChildrenPTag = getChildrenProperty({ rjx: sampleRJX.children[ 0 ], }); //=>hello world"
],
"lineNumber": 44,
"unknown": [
{
"tagName": "@returns",
"tagValue": "{Object[]|String} returns a valid rjx.children property that's either an array of RJX objects or a string "
}
],
"params": [
{
"nullable": null,
"types": [
"Object"
],
"spread": false,
"optional": false,
"name": "options",
"description": ""
},
{
"nullable": null,
"types": [
"Object"
],
"spread": false,
"optional": true,
"defaultValue": "{}",
"defaultRaw": {},
"name": "options.rjx",
"description": "Valid RJX JSON"
},
{
"nullable": null,
"types": [
"Object"
],
"spread": false,
"optional": true,
"defaultValue": "options.rjx.children",
"defaultRaw": "options.rjx.children",
"name": "options.props",
"description": "Props to pull children Object.assign(rjx.props,rjx.asyncprops,rjx.thisprops,rjx.windowprops)"
}
],
"return": {
"nullable": null,
"types": [
"Object[]",
"String"
],
"spread": false,
"description": "returns a valid rjx.children property that's either an array of RJX objects or a string"
}
},
{
"__docId__": 50,
"kind": "function",
"name": "getChildrenProps",
"memberof": "src/children.js",
"generator": false,
"async": false,
"static": true,
"longname": "src/children.js~getChildrenProps",
"access": "public",
"export": true,
"importPath": "rjx/src/children.js",
"importStyle": "{getChildrenProps}",
"description": "Used to pass properties down to child components if passprops is set to true",
"lineNumber": 73,
"unknown": [
{
"tagName": "@returns",
"tagValue": "{Object|String} returns a valid Valid RJX Child object or a string "
}
],
"params": [
{
"nullable": null,
"types": [
"Object"
],
"spread": false,
"optional": false,
"name": "options",
"description": ""
},
{
"nullable": null,
"types": [
"Object"
],
"spread": false,
"optional": true,
"defaultValue": "{}",
"defaultRaw": {},
"name": "options.rjx",
"description": "Valid RJX JSON"
},
{
"nullable": null,
"types": [
"Object"
],
"spread": false,
"optional": true,
"defaultValue": "{}",
"defaultRaw": {},
"name": "options.childrjx",
"description": "Valid RJX JSON"
},
{
"nullable": null,
"types": [
"Number"
],
"spread": false,
"optional": false,
"name": "options.renderIndex",
"description": "React key property"
},
{
"nullable": null,
"types": [
"Object"
],
"spread": false,
"optional": true,
"defaultValue": "options.rjx.props",
"defaultRaw": "options.rjx.props",
"name": "options.props",
"description": "Props to pull children Object.assign(rjx.props,rjx.asyncprops,rjx.thisprops,rjx.windowprops)"
}
],
"return": {
"nullable": null,
"types": [
"Object",
"String"
],
"spread": false,
"description": "returns a valid Valid RJX Child object or a string"
}
},
{
"__docId__": 51,
"kind": "function",
"name": "getRJXChildren",
"memberof": "src/children.js",
"generator": false,
"async": false,
"static": true,
"longname": "src/children.js~getRJXChildren",
"access": "public",
"export": true,
"importPath": "rjx/src/children.js",
"importStyle": "{getRJXChildren}",
"description": "returns React Child Elements via RJX",
"lineNumber": 104,
"params": [
{
"nullable": null,
"types": [
"*"
],
"spread": false,
"optional": false,
"name": "options",
"description": ""
}
],
"properties": [
{
"nullable": null,
"types": [
"object"
],
"spread": false,
"optional": false,
"name": "this",
"description": "options for getReactElementFromRJX"
},
{
"nullable": null,
"types": [
"Object"
],
"spread": false,
"optional": true,
"name": "this.componentLibraries",
"description": "react components to render with RJX"
},
{
"nullable": null,
"types": [
"boolean"
],
"spread": false,
"optional": true,
"defaultValue": "false",
"defaultRaw": false,
"name": "this.debug",
"description": "use debug messages"
},
{
"nullable": null,
"types": [
"function"
],
"spread": false,
"optional": true,
"defaultValue": "console.error",
"defaultRaw": "console.error",
"name": "this.logError",
"description": "error logging function"
},
{
"nullable": null,
"types": [
"string[]"
],
"spread": false,
"optional": true,
"defaultValue": "[]",
"defaultRaw": [],
"name": "this.boundedComponents",
"description": "list of components that require a bound this context (usefult for redux router)"
}
]
},
{
"__docId__": 52,
"kind": "file",
"name": "src/components.js",
"content": "import React, { useState, useEffect, useContext, useReducer, useCallback, useMemo, useRef, useImperativeHandle, useLayoutEffect, useDebugValue, Fragment, Suspense, lazy, createContext, } from 'react';\r\nimport { default as ReactDOMElements, } from 'react-dom-factories';\r\nimport { getAdvancedBinding, } from './utils';\r\nimport createReactClass from 'create-react-class';\r\nimport { getReactElementFromRJX, } from './main';\r\n// if (typeof window === 'undefined') {\r\n// var window = window || global.window || {};\r\n// }\r\nexport let advancedBinding = getAdvancedBinding();\r\n// require;\r\n/**\r\n * object of all react components available for RJX\r\n */\r\nexport let componentMap = Object.assign({ Fragment, Suspense, }, ReactDOMElements, (typeof window ==='object') ? window.__rjx_custom_elements : {});\r\n\r\n/**\r\n * getBoundedComponents returns reactComponents with certain elements that have this bounded to select components in the boundedComponents list \r\n * @param {Object} options - options for getBoundedComponents \r\n * @param {Object} options.reactComponents - all react components available for RJX\r\n * @param {string[]} boundedComponents - list of components to bind RJX this context (usually helpful for navigation and redux-router)\r\n * @returns {Object} reactComponents object of all react components available for RJX\r\n */\r\nexport function getBoundedComponents(options = {}) {\r\n const { reactComponents, boundedComponents=[], } = options;\r\n if (advancedBinding || options.advancedBinding) {\r\n return Object.assign({}, reactComponents, boundedComponents.reduce((result, componentName) => {\r\n result[ componentName ] = reactComponents[ componentName ].bind(this);\r\n return result;\r\n }, {}));\r\n // reactComponents.ResponsiveLink = ResponsiveLink.bind(this);\r\n } else return reactComponents;\r\n}\r\n\r\n/**\r\n * returns a react component from a component library\r\n * @param {Object} options - options for getComponentFromLibrary\r\n * @param {Object} [options.componentLibraries={}] - react component library like bootstrap\r\n * @param {Object} [options.rjx={}] - any valid RJX JSON\r\n * @returns {function|undefined} react component from react library like bootstrap, material design or bulma\r\n */\r\nexport function getComponentFromLibrary(options = {}) {\r\n const { componentLibraries = {}, rjx = {}, } = options;\r\n const libComponent = Object.keys(componentLibraries)\r\n .map(libraryName => {\r\n const cleanLibraryName = rjx.component.replace(`${libraryName}.`, '');\r\n const libraryNameArray = cleanLibraryName.split('.');\r\n if (libraryNameArray.length === 2\r\n && componentLibraries[ libraryName ]\r\n && componentLibraries[ libraryName ][ libraryNameArray[ 0 ] ]\r\n && typeof componentLibraries[ libraryName ][ libraryNameArray[ 0 ] ][ libraryNameArray[ 1 ] ] !== 'undefined') {\r\n return componentLibraries[ libraryName ][ libraryNameArray[ 0 ] ][ libraryNameArray[ 1 ] ];\r\n } else if (typeof componentLibraries[ libraryName ][ cleanLibraryName ] !== 'undefined') {\r\n return componentLibraries[ libraryName ][ cleanLibraryName ];\r\n }\r\n })\r\n .filter(val => val)[ 0 ];\r\n return libComponent;\r\n}\r\n\r\n/**\r\n * returns a react element from rjx.component\r\n * @example\r\n * // returns react elements\r\n * getComponentFromMap({rjx:{component:'div'}})=>div\r\n * getComponentFromMap({rjx:{component:'MyModal'},reactComponents:{MyModal:MyModal extends React.Component}})=>MyModal\r\n * getComponentFromMap({rjx:{component:'reactBootstap.nav'},componentLibraries:{reactBootstrap,}})=>reactBootstap.nav\r\n * @param {Object} options - options for getComponentFromMap\r\n * @param {object} [options.rjx={}] - any valid RJX JSON object\r\n * @param {Object} [options.reactComponents={}] - react components to render\r\n * @param {Object} [options.componentLibraries={}] - react components to render from another component library like bootstrap or bulma\r\n * @param {function} [options.logError=console.error] - error logging function\r\n * @param {boolean} [options.debug=false] - use debug messages\r\n * @returns {string|function|class} valid react element\r\n */\r\nexport function getComponentFromMap(options = {}) {\r\n // eslint-disable-next-line\r\n const { rjx = {}, reactComponents = {}, componentLibraries = {}, logError = console.error, debug } = options;\r\n\r\n try {\r\n if (typeof rjx.component !== 'string' && typeof rjx.component === 'function') {\r\n return rjx.component;\r\n } else if (ReactDOMElements[rjx.component]) {\r\n return rjx.component;\r\n } else if (reactComponents[ rjx.component ]) {\r\n return reactComponents[rjx.component];\r\n } else if (typeof rjx.component ==='string' && rjx.component.indexOf('.') > 0 && getComponentFromLibrary({ rjx, componentLibraries, })) {\r\n return getComponentFromLibrary({ rjx, componentLibraries, });\r\n } else {\r\n throw new ReferenceError(`Invalid React Component (${rjx.component})`);\r\n }\r\n } catch (e) {\r\n if(debug) logError(e, (e.stack) ? e.stack : 'no stack');\r\n throw e;\r\n }\r\n}\r\n\r\n/**\r\n * Returns a new function from an options object\r\n * @param {Object} options \r\n * @param {String} [options.body=''] - Function string body\r\n * @param {String[]} [options.args=[]] - Function arguments\r\n * @returns {Function} \r\n */\r\nexport function getFunctionFromEval(options = {}) {\r\n const { body = '', args = [], } = options;\r\n const argus = [].concat(args);\r\n argus.push(body);\r\n return Function.prototype.constructor.apply({}, argus);\r\n}\r\n\r\n/**\r\n * Returns a new React Component\r\n * @param {Boolean} [options.returnFactory=true] - returns a React component if true otherwise returns Component Class \r\n * @param {Object} [options.resources={}] - asyncprops for component\r\n * @param {String} [options.name ] - Component name\r\n * @param {Function} [options.lazy ] - function that resolves {reactComponent,options} to lazy load component for code splitting\r\n * @param {Boolean} [options.use_getState=true] - define getState prop\r\n * @param {Boolean} [options.bindContext=true] - bind class this reference to render function components\r\n * @param {Boolean} [options.passprops ] - pass props to rendered component\r\n * @param {Boolean} [options.passstate] - pass state as props to rendered component\r\n * @param {Object} [reactComponent={}] - an object of functions used for create-react-class\r\n * @param {Object} reactComponent.render.body - Valid RJX JSON\r\n * @param {String} reactComponent.getDefaultProps.body - return an object for the default props\r\n * @param {String} reactComponent.getInitialState.body - return an object for the default state\r\n * @returns {Function} \r\n * @see {@link https://reactjs.org/docs/react-without-es6.html} \r\n */\r\nexport function getReactClassComponent(reactComponent = {}, options = {}) {\r\n // const util = require('util');\r\n // console.log(util.inspect({ reactComponent },{depth:20}));\r\n if (options.lazy) {\r\n return lazy(() => options.lazy(reactComponent, Object.assign({}, options, { lazy: false, })).then((lazyComponent) => {\r\n return {\r\n default: getReactClassComponent(...lazyComponent),\r\n };\r\n }));\r\n }\r\n const context = this || {};\r\n const { returnFactory = true, resources = {}, use_getState=true, bindContext=true, disableRenderIndexKey = true, } = options;\r\n const rjc = Object.assign({\r\n getDefaultProps: {\r\n body:'return {};',\r\n },\r\n getInitialState: {\r\n body:'return {};',\r\n },\r\n }, reactComponent);\r\n const rjcKeys = Object.keys(rjc);\r\n if (rjcKeys.includes('render') === false) {\r\n throw new ReferenceError('React components require a render method');\r\n }\r\n const classOptions = rjcKeys.reduce((result, val) => { \r\n if (typeof rjc[ val ] === 'function') rjc[ val ] = { body: rjc[ val ], };\r\n const args = rjc[ val ].arguments;\r\n const body = rjc[ val ].body;\r\n if (!body) {\r\n console.warn({ rjc, });\r\n throw new SyntaxError(`Function(${val}) requires a function body`);\r\n }\r\n if (args && !Array.isArray(args) && (args.length &&(args.length && args.filter(arg=>typeof arg==='string').length)) ) {\r\n throw new TypeError(`Function(${val}) arguments must be an array or variable names`);\r\n }\r\n if (val === 'render') {\r\n result[ val ] = function () {\r\n if (options.passprops && this.props) body.props = Object.assign({}, body.props, this.props);\r\n if (options.passstate && this.state) body.props = Object.assign({}, body.props, this.state);\r\n return getReactElementFromRJX.call(Object.assign(\r\n {},\r\n context,\r\n bindContext ? this : {},\r\n { disableRenderIndexKey, },\r\n {\r\n props: use_getState\r\n ? Object.assign({}, this.props, { getState: () => this.state, })\r\n : this.props,\r\n }\r\n ), body, resources);\r\n };\r\n } else {\r\n result[ val ] = typeof body === 'function'\r\n ? body\r\n : getFunctionFromEval({\r\n body,\r\n args,\r\n });\r\n }\r\n\r\n return result;\r\n }, {});\r\n const reactComponentClass = createReactClass(classOptions);\r\n if (options.name) {\r\n Object.defineProperty(\r\n reactComponentClass,\r\n 'name',\r\n {\r\n value: options.name,\r\n }\r\n );\r\n }\r\n const reactClass = returnFactory\r\n ? React.createFactory(reactComponentClass)\r\n : reactComponentClass;\r\n return reactClass;\r\n}\r\n\r\n/**\r\n * Returns new React Function Component\r\n * @todo set 'functionprops' to set arguments for function\r\n * @param {*} reactComponent - Valid RJX to render\r\n * @param {String} functionBody - String of function component body\r\n * @param {String} options.name - Function Component name \r\n * @returns {Function}\r\n * @see {@link https://reactjs.org/docs/hooks-intro.html}\r\n * @example\r\n const rjxRender = {\r\n component:'div',\r\n passprops:'true',\r\n children:[ \r\n {\r\n component:'input',\r\n thisprops:{\r\n value:['count'],\r\n },\r\n },\r\n {\r\n component:'button',\r\n __dangerouslyBindEvalProps:{\r\n onClick:function(count,setCount){\r\n setCount(count+1);\r\n console.log('this is inline',{count,setCount});\r\n },\r\n // onClick:`(function(count,setCount){\r\n // setCount(count+1)\r\n // console.log('this is inline',{count,setCount});\r\n // })`,\r\n children:'Click me'\r\n }\r\n ]\r\n };\r\n const functionBody = 'const [count, setCount] = useState(0); const functionprops = {count,setCount};'\r\n const options = { name: IntroHook}\r\n const MyCustomFunctionComponent = rjx._rjxComponents.getReactFunctionComponent({rjxRender, functionBody, options});\r\n */\r\nexport function getReactFunctionComponent(reactComponent = {}, functionBody = '', options = {}) {\r\n if (options.lazy) {\r\n return lazy(() => options.lazy(reactComponent, functionBody, Object.assign({}, options, { lazy: false, })).then((lazyComponent) => {\r\n return {\r\n default: getReactFunctionComponent(...lazyComponent),\r\n };\r\n }));\r\n }\r\n const { resources = {}, args=[], } = options;\r\n\r\n const props = reactComponent.props;\r\n const functionArgs = [ React, useState, useEffect, useContext, useReducer, useCallback, useMemo, useRef, useImperativeHandle, useLayoutEffect, useDebugValue, getReactElementFromRJX, reactComponent, resources, props, ];\r\n if (typeof functionBody === 'function') functionBody = functionBody.toString();\r\n const functionComponent = Function('React', 'useState', 'useEffect', 'useContext', 'useReducer', 'useCallback', 'useMemo', 'useRef', 'useImperativeHandle', 'useLayoutEffect', 'useDebugValue', 'getReactElementFromRJX', 'reactComponent', 'resources', 'props', `\r\n return function ${options.name || 'Anonymous'}(props){\r\n ${functionBody}\r\n if(typeof exposeProps!=='undefined'){\r\n reactComponent.props = Object.assign({},props,exposeProps);\r\n // reactComponent.__functionargs = Object.keys(exposeProps);\r\n } else{\r\n reactComponent.props = props;\r\n }\r\n if(!props.children) delete props.children;\r\n \r\n return getReactElementFromRJX.call(this, reactComponent);\r\n }\r\n `);\r\n if (options.name) {\r\n Object.defineProperty(\r\n functionComponent,\r\n 'name',\r\n {\r\n value: options.name,\r\n }\r\n );\r\n }\r\n return functionComponent(...functionArgs);\r\n}\r\n/**\r\n * if (recharts[rjx.component.replace('recharts.', '')]) {\r\n return recharts[rjx.component.replace('recharts.', '')];\r\n }\r\n */\r\nexport function getReactContext(options = {}) {\r\n return createContext(options.value);\r\n}",
"static": true,
"longname": "/Users/yawjosephetse/Developer/github/repetere/rjx/src/components.js",
"access": "public",
"description": null,
"lineNumber": 1
},
{
"__docId__": 53,
"kind": "variable",
"name": "advancedBinding",
"memberof": "src/components.js",
"static": true,
"longname": "src/components.js~advancedBinding",
"access": "public",
"export": true,
"importPath": "rjx/src/components.js",
"importStyle": "{advancedBinding}",
"description": null,
"lineNumber": 9,
"undocument": true
},
{
"__docId__": 54,
"kind": "variable",
"name": "componentMap",
"memberof": "src/components.js",
"static": true,
"longname": "src/components.js~componentMap",
"access": "public",
"export": true,
"importPath": "rjx/src/components.js",
"importStyle": "{componentMap}",
"description": "object of all react components available for RJX",
"lineNumber": 14
},
{
"__docId__": 55,
"kind": "function",
"name": "getBoundedComponents",
"memberof": "src/components.js",
"generator": false,
"async": false,
"static": true,
"longname": "src/components.js~getBoundedComponents",
"access": "public",
"export": true,
"importPath": "rjx/src/components.js",
"importStyle": "{getBoundedComponents}",
"description": "getBoundedComponents returns reactComponents with certain elements that have this bounded to select components in the boundedComponents list ",
"lineNumber": 23,
"unknown": [
{
"tagName": "@returns",
"tagValue": "{Object} reactComponents object of all react components available for RJX"
}
],
"params": [
{
"nullable": null,
"types": [
"Object"
],
"spread": false,
"optional": false,
"name": "options",
"description": "options for getBoundedComponents"
},
{
"nullable": null,
"types": [
"Object"
],
"spread": false,
"optional": false,
"name": "options.reactComponents",
"description": "all react components available for RJX"
},
{
"nullable": null,
"types": [
"string[]"
],
"spread": false,
"optional": false,
"name": "boundedComponents",
"description": "list of components to bind RJX this context (usually helpful for navigation and redux-router)"
}
],
"return": {
"nullable": null,
"types": [
"Object"
],
"spread": false,
"description": "reactComponents object of all react components available for RJX"
}
},
{
"__docId__": 56,
"kind": "function",
"name": "getComponentFromLibrary",
"memberof": "src/components.js",
"generator": false,
"async": false,
"static": true,
"longname": "src/components.js~getComponentFromLibrary",
"access": "public",
"export": true,
"importPath": "rjx/src/components.js",
"importStyle": "{getComponentFromLibrary}",
"description": "returns a react component from a component library",
"lineNumber": 41,
"unknown": [
{
"tagName": "@returns",
"tagValue": "{function|undefined} react component from react library like bootstrap, material design or bulma"
}
],
"params": [
{
"nullable": null,
"types": [
"Object"
],
"spread": false,
"optional": false,
"name": "options",
"description": "options for getComponentFromLibrary"
},
{
"nullable": null,
"types": [
"Object"
],
"spread": false,
"optional": true,
"defaultValue": "{}",
"defaultRaw": {},
"name": "options.componentLibraries",
"description": "react component library like bootstrap"
},
{
"nullable": null,
"types": [
"Object"
],
"spread": false,
"optional": true,
"defaultValue": "{}",
"defaultRaw": {},
"name": "options.rjx",
"description": "any valid RJX JSON"
}
],
"return": {
"nullable": null,
"types": [
"function",
"undefined"
],
"spread": false,
"description": "react component from react library like bootstrap, material design or bulma"
}
},
{
"__docId__": 57,
"kind": "function",
"name": "getComponentFromMap",
"memberof": "src/components.js",
"generator": false,
"async": false,
"static": true,
"longname": "src/components.js~getComponentFromMap",
"access": "public",
"export": true,
"importPath": "rjx/src/components.js",
"importStyle": "{getComponentFromMap}",
"description": "returns a react element from rjx.component",
"examples": [
"// returns react elements\ngetComponentFromMap({rjx:{component:'div'}})=>div\ngetComponentFromMap({rjx:{component:'MyModal'},reactComponents:{MyModal:MyModal extends React.Component}})=>MyModal\ngetComponentFromMap({rjx:{component:'reactBootstap.nav'},componentLibraries:{reactBootstrap,}})=>reactBootstap.nav"
],
"lineNumber": 75,
"unknown": [
{
"tagName": "@returns",
"tagValue": "{string|function|class} valid react element"
}
],
"params": [
{
"nullable": null,
"types": [
"Object"
],
"spread": false,
"optional": false,
"name": "options",
"description": "options for getComponentFromMap"
},
{
"nullable": null,
"types": [
"object"
],
"spread": false,
"optional": true,
"defaultValue": "{}",
"defaultRaw": {},
"name": "options.rjx",
"description": "any valid RJX JSON object"
},
{
"nullable": null,
"types": [
"Object"
],
"spread": false,
"optional": true,
"defaultValue": "{}",
"defaultRaw": {},
"name": "options.reactComponents",
"description": "react components to render"
},
{
"nullable": null,
"types": [
"Object"
],
"spread": false,
"optional": true,
"defaultValue": "{}",
"defaultRaw": {},
"name": "options.componentLibraries",
"description": "react components to render from another component library like bootstrap or bulma"
},
{
"nullable": null,
"types": [
"function"
],
"spread": false,
"optional": true,
"defaultValue": "console.error",
"defaultRaw": "console.error",
"name": "options.logError",
"description": "error logging function"
},
{
"nullable": null,
"types": [
"boolean"
],
"spread": false,
"optional": true,
"defaultValue": "false",
"defaultRaw": false,
"name": "options.debug",
"description": "use debug messages"
}
],
"return": {
"nullable": null,
"types": [
"string",
"function",
"class"
],
"spread": false,
"description": "valid react element"
}
},
{
"__docId__": 58,
"kind": "function",
"name": "getFunctionFromEval",
"memberof": "src/components.js",
"generator": false,
"async": false,
"static": true,
"longname": "src/components.js~getFunctionFromEval",
"access": "public",
"export": true,
"importPath": "rjx/src/components.js",
"importStyle": "{getFunctionFromEval}",
"description": "Returns a new function from an options object",
"lineNumber": 104,
"unknown": [
{
"tagName": "@returns",
"tagValue": "{Function} "
}
],
"params": [
{
"nullable": null,
"types": [
"Object"
],
"spread": false,
"optional": false,
"name": "options",
"description": ""
},
{
"nullable": null,
"types": [
"String"
],
"spread": false,
"optional": true,
"defaultValue": "''",
"defaultRaw": "''",
"name": "options.body",
"description": "Function string body"
},
{
"nullable": null,
"types": [
"String[]"
],
"spread": false,
"optional": true,
"defaultValue": "[]",
"defaultRaw": [],
"name": "options.args",
"description": "Function arguments"
}
],
"return": {
"nullable": null,
"types": [
"Function"
],
"spread": false,
"description": ""
}
},
{
"__docId__": 59,
"kind": "function",
"name": "getReactClassComponent",
"memberof": "src/components.js",
"generator": false,
"async": false,
"static": true,
"longname": "src/components.js~getReactClassComponent",
"access": "public",
"export": true,
"importPath": "rjx/src/components.js",
"importStyle": "{getReactClassComponent}",
"description": "Returns a new React Component",
"see": [
"{@link https://reactjs.org/docs/react-without-es6.html} "
],
"lineNumber": 128,
"unknown": [
{
"tagName": "@returns",
"tagValue": "{Function} "
}
],
"params": [
{
"nullable": null,
"types": [
"Boolean"
],
"spread": false,
"optional": true,
"defaultValue": "true",
"defaultRaw": true,
"name": "options.returnFactory",
"description": "returns a React component if true otherwise returns Component Class"
},
{
"nullable": null,
"types": [
"Object"
],
"spread": false,
"optional": true,
"defaultValue": "{}",
"defaultRaw": {},
"name": "options.resources",
"description": "asyncprops for component"
},
{
"nullable": null,
"types": [
"String"
],
"spread": false,
"optional": true,
"name": "options.name",
"description": "Component name"
},
{
"nullable": null,
"types": [
"Function"
],
"spread": false,
"optional": true,
"name": "options.lazy",
"description": "function that resolves {reactComponent,options} to lazy load component for code splitting"
},
{
"nullable": null,
"types": [
"Boolean"
],
"spread": false,
"optional": true,
"defaultValue": "true",
"defaultRaw": true,
"name": "options.use_getState",
"description": "define getState prop"
},
{
"nullable": null,
"types": [
"Boolean"
],
"spread": false,
"optional": true,
"defaultValue": "true",
"defaultRaw": true,
"name": "options.bindContext",
"description": "bind class this reference to render function components"
},
{
"nullable": null,
"types": [
"Boolean"
],
"spread": false,
"optional": true,
"name": "options.passprops",
"description": "pass props to rendered component"
},
{
"nullable": null,
"types": [
"Boolean"
],
"spread": false,
"optional": true,
"name": "options.passstate",
"description": "pass state as props to rendered component"
},
{
"nullable": null,
"types": [
"Object"
],
"spread": false,
"optional": true,
"defaultValue": "{}",
"defaultRaw": {},
"name": "reactComponent",
"description": "an object of functions used for create-react-class"
},
{
"nullable": null,
"types": [
"Object"
],
"spread": false,
"optional": false,
"name": "reactComponent.render.body",
"description": "Valid RJX JSON"
},
{
"nullable": null,
"types": [
"String"
],
"spread": false,
"optional": false,
"name": "reactComponent.getDefaultProps.body",
"description": "return an object for the default props"
},
{
"nullable": null,
"types": [
"String"
],
"spread": false,
"optional": false,
"name": "reactComponent.getInitialState.body",
"description": "return an object for the default state"
}
],
"return": {
"nullable": null,
"types": [
"Function"
],
"spread": false,
"description": ""
}
},
{
"__docId__": 60,
"kind": "function",
"name": "getReactFunctionComponent",
"memberof": "src/components.js",
"generator": false,
"async": false,
"static": true,
"longname": "src/components.js~getReactFunctionComponent",
"access": "public",
"export": true,
"importPath": "rjx/src/components.js",
"importStyle": "{getReactFunctionComponent}",
"description": "Returns new React Function Component",
"examples": [
"const rjxRender = {\ncomponent:'div',\npassprops:'true',\nchildren:[ \n{\ncomponent:'input',\nthisprops:{\nvalue:['count'],\n},\n},\n{\ncomponent:'button',\n__dangerouslyBindEvalProps:{\nonClick:function(count,setCount){\nsetCount(count+1);\nconsole.log('this is inline',{count,setCount});\n},\n// onClick:`(function(count,setCount){\n// setCount(count+1)\n// console.log('this is inline',{count,setCount});\n// })`,\nchildren:'Click me'\n}\n]\n};\nconst functionBody = 'const [count, setCount] = useState(0); const functionprops = {count,setCount};'\nconst options = { name: IntroHook}\nconst MyCustomFunctionComponent = rjx._rjxComponents.getReactFunctionComponent({rjxRender, functionBody, options});"
],
"see": [
"{@link https://reactjs.org/docs/hooks-intro.html}"
],
"lineNumber": 244,
"todo": [
"set 'functionprops' to set arguments for function"
],
"unknown": [
{
"tagName": "@returns",
"tagValue": "{Function}"
}
],
"params": [
{
"nullable": null,
"types": [
"*"
],
"spread": false,
"optional": false,
"name": "reactComponent",
"description": "Valid RJX to render"
},
{
"nullable": null,
"types": [
"String"
],
"spread": false,
"optional": false,
"name": "functionBody",
"description": "String of function component body"
},
{
"nullable": null,
"types": [
"String"
],
"spread": false,
"optional": false,
"name": "options.name",
"description": "Function Component name"
}
],
"return": {
"nullable": null,
"types": [
"Function"
],
"spread": false,
"description": ""
}
},
{
"__docId__": 61,
"kind": "function",
"name": "getReactContext",
"memberof": "src/components.js",
"generator": false,
"async": false,
"static": true,
"longname": "src/components.js~getReactContext",
"access": "public",
"export": true,
"importPath": "rjx/src/components.js",
"importStyle": "{getReactContext}",
"description": "if (recharts[rjx.component.replace('recharts.', '')]) {\nreturn recharts[rjx.component.replace('recharts.', '')];\n}",
"lineNumber": 287
},
{
"__docId__": 62,
"kind": "file",
"name": "src/express.js",
"content": "import { rjxHTMLString, } from './main';\r\n/**\r\n * Use RJX for express view rendering\r\n * @param {string} filePath - path to rjx express view \r\n * @param {object} options - property used for express view {locals}\r\n * @param {object} options.__boundConfig - property used to bind this object for RJX, can be used to add custom components\r\n * @param {string} [options.__DOCTYPE=\"\"] - html doctype string\r\n * @param {*} callback \r\n */\r\nexport function __express(filePath, options, callback) {\r\n try {\r\n const rjxModule = options.__rjx || require(filePath);\r\n const resources = Object.assign({}, options);\r\n delete resources.__boundConfig;\r\n delete resources.__DOCTYPE;\r\n delete resources.__rjx;\r\n \r\n const rjxRenderedString = rjxHTMLString.call(options.__boundConfig || {}, {\r\n rjx: rjxModule,\r\n resources,\r\n });\r\n callback(null, `${options.__DOCTYPE || ''}\r\n${rjxRenderedString}`);\r\n } catch (e) {\r\n callback(e);\r\n }\r\n}\r\n",
"static": true,
"longname": "/Users/yawjosephetse/Developer/github/repetere/rjx/src/express.js",
"access": "public",
"description": null,
"lineNumber": 1
},
{
"__docId__": 63,
"kind": "function",
"name": "__express",
"memberof": "src/express.js",
"generator": false,
"async": false,
"static": true,
"longname": "src/express.js~__express",
"access": "private",
"export": true,
"importPath": "rjx/src/express.js",
"importStyle": "{__express}",
"description": "Use RJX for express view rendering",
"lineNumber": 10,
"params": [
{
"nullable": null,
"types": [
"string"
],
"spread": false,
"optional": false,
"name": "filePath",
"description": "path to rjx express view"
},
{
"nullable": null,
"types": [
"object"
],
"spread": false,
"optional": false,
"name": "options",
"description": "property used for express view {locals}"
},
{
"nullable": null,
"types": [
"object"
],
"spread": false,
"optional": false,
"name": "options.__boundConfig",
"description": "property used to bind this object for RJX, can be used to add custom components"
},
{
"nullable": null,
"types": [
"string"
],
"spread": false,
"optional": true,
"defaultValue": "\"\"",
"defaultRaw": "",
"name": "options.__DOCTYPE",
"description": "html doctype string"
},
{
"nullable": null,
"types": [
"*"
],
"spread": false,
"optional": false,
"name": "callback",
"description": ""
}
]
},
{
"__docId__": 64,
"kind": "file",
"name": "src/main.js",
"content": "// import React, { createElement, } from 'react';\r\nimport React from 'react';\r\nimport ReactDOM from 'react-dom';\r\nimport ReactDOMServer from 'react-dom/server';\r\nimport useGlobalHook from 'use-global-hook';\r\n\r\nimport * as rjxComponents from './components';\r\nimport * as rjxProps from './props';\r\nimport * as rjxChildren from './children';\r\nimport * as rjxUtils from './utils';\r\nconst createElement = React.createElement;\r\nconst { componentMap, getComponentFromMap, getBoundedComponents, } = rjxComponents;\r\nconst { getComputedProps, } = rjxProps;\r\nconst { getRJXChildren, } = rjxChildren;\r\nconst { displayComponent, } = rjxUtils;\r\nexport let renderIndex = 0;\r\n\r\n/**\r\n * Use RJX without any configuration to render RJX JSON to HTML and insert RJX into querySelector using ReactDOM.render\r\n * @example\r\n * // Uses react to create \r\n * rjx.rjxRender({ rjx: { component: 'div', props:{className:'rjx-generated',children:[{ component:'p',props:{style:{color:'red'}}, children:'hello world' }]}}, querySelector:'#myApp', });\r\n * @param {object} config - options used to inject html via ReactDOM.render\r\n * @param {object} config.rjx - any valid RJX JSON object\r\n * @param {object} config.resources - any additional resource used for asynchronous properties\r\n * @param {string} config.querySelector - selector for document.querySelector\r\n * @property {object} this - options for getReactElementFromRJX\r\n */\r\nexport function rjxRender(config = {}) {\r\n const { rjx, resources, querySelector, options, DOM, } = config;\r\n ReactDOM.render(\r\n getReactElementFromRJX.call(this || {}, rjx, resources, options),\r\n DOM || document.querySelector(querySelector)\r\n );\r\n}\r\n\r\n/**\r\n * Use ReactDOMServer.renderToString to render html from RJX\r\n * @example\r\n * // Uses react to create \r\n * rjx.outputHTML({ rjx: { component: 'div', props:{className:'rjx-generated',children:[{ component:'p',props:{style:{color:'red'}}, children:'hello world' }]}}, });\r\n * @param {object} config - options used to inject html via ReactDOM.render\r\n * @param {object} config.rjx - any valid RJX JSON object\r\n * @param {object} config.resources - any additional resource used for asynchronous properties\r\n * @property {object} this - options for getReactElementFromRJX\r\n * @returns {string} React genereated html via RJX JSON\r\n */\r\nexport function outputHTML(config = {}) {\r\n const { rjx, resources, } = config;\r\n return ReactDOMServer.renderToString(getReactElementFromRJX.call(this || {}, rjx, resources));\r\n}\r\n\r\n/**\r\n * Use React.createElement and RJX JSON to create React elements\r\n * @example\r\n * // Uses react to create the equivalent JSX hello world\r\n * rjx.getReactElementFromRJX({component:'myCompnent',props:{style:{color:'blue'}},children:'hello world'})\r\n * @param {object} rjx - any valid RJX JSON object\r\n * @param {object} resources - any additional resource used for asynchronous properties\r\n * @property {object} this - options for getReactElementFromRJX\r\n * @property {Object} [this.componentLibraries] - react components to render with RJX\r\n * @property {boolean} [this.debug=false] - use debug messages\r\n * @property {boolean} [this.returnJSON=false] - return json object of {type,props,children} instead of react element\r\n * @property {boolean} [this.disableRenderIndexKey=false] - disables auto assign a key prop\r\n * @property {function} [this.logError=console.error] - error logging function\r\n * @property {string[]} [this.boundedComponents=[]] - list of components that require a bound this context (usefult for redux router)\r\n * @returns {function} React element via React.createElement\r\n */\r\nexport function getReactElementFromRJX(rjx = {}, resources = {}) {\r\n // eslint-disable-next-line\r\n const { componentLibraries = {}, debug = false, returnJSON=false, logError = console.error, boundedComponents = [], disableRenderIndexKey = false, } = this || {};\r\n // const componentLibraries = this.componentLibraries;\r\n if (!rjx) return null;\r\n if (rjx.type) rjx.component = rjx.type;\r\n if (rjxUtils.validSimpleRJXSyntax(rjx)) rjx = rjxUtils.simpleRJXSyntax(rjx);\r\n if (!rjx.component) return createElement('span', {}, debug ? 'Error: Missing Component Object' : '');\r\n try {\r\n const components = Object.assign({}, componentMap, this.reactComponents);\r\n\r\n const reactComponents = (boundedComponents.length)\r\n ? getBoundedComponents.call(this, { boundedComponents, reactComponents: components, })\r\n : components;\r\n renderIndex++;\r\n const element = getComponentFromMap({ rjx, reactComponents, componentLibraries, debug, logError, });\r\n const props = getComputedProps.call(this, { rjx, resources, renderIndex, componentLibraries, debug, logError, });\r\n const displayElement = (rjx.comparisonprops)\r\n ? displayComponent.call(this, { rjx, props, renderIndex, componentLibraries, debug, })\r\n : true;\r\n if (displayElement) {\r\n const children = getRJXChildren.call(this, { rjx, props, resources, renderIndex, });\r\n if (this.returnJSON) return { type:element, props, children, };\r\n return createElement(element, props, children);\r\n } else {\r\n return null;\r\n }\r\n } catch (e) {\r\n if (debug) {\r\n logError({ rjx, resources, }, 'this', this);\r\n logError(e, (e.stack) ? e.stack : 'no stack');\r\n }\r\n throw e;\r\n }\r\n}\r\n\r\nexport const getRenderedJSON = getReactElementFromRJX;\r\nexport const getReactElement = getReactElementFromRJX;\r\n\r\n/** converts a json object {type,props,children} into a react element \r\n * @example\r\n * rjx.getReactElementFromJSON({type:'div',props:{title:'some title attribute'},children:'inner html text'})\r\n * @param {Object|String} options.type - 'div' or react component\r\n * @param {Object} options.props - props for react element\r\n * @param {String|[Object]} options.children - children elements\r\n * @returns {function} React element via React.createElement\r\n*/\r\nexport function getReactElementFromJSON({ type, props, children, }) {\r\n return createElement(type, props, Array.isArray(children)\r\n ? children.map(getReactElementFromJSON)\r\n : children);\r\n}\r\n\r\n/** converts a rjx json object into a react function component \r\n * @example\r\n * rjx.compile({rjx:{component:'div',props:{title:'some title attribute'},children:'inner html text'}}) //=>React Function Component\r\n * @param {Object} rjx - valid RJX JSON\r\n * @param {Object} resources - props for react element\r\n * @returns {function} React element via React.createElement\r\n*/\r\nexport function compile(rjx, resources) {\r\n const context = Object.assign({}, this, { returnJSON: true, });\r\n const json = getReactElementFromRJX.call(context, rjx, resources);\r\n const func = function compiledRJX(props) {\r\n json.props = Object.assign({}, json.props, props);\r\n return getReactElementFromJSON(json);\r\n };\r\n Object.defineProperty(func, 'name', { value: this.name, });\r\n return func;\r\n}\r\n\r\n/**\r\n * converts RJX JSON IR to JSX\r\n * @example\r\n * rjx.jsonToJSX({ type: 'div', props: { key: 5, title: 'test' }, children: 'hello' }) // => 'hello
'\r\n * @param {Object} json - {type,props,children}\r\n * @returns {String} jsx string\r\n */\r\nexport function outputJSX(rjx, resources) {\r\n const context = Object.assign({}, this, { returnJSON: true, });\r\n const json = getReactElementFromRJX.call(context, rjx, resources);\r\n return jsonToJSX(json);\r\n}\r\n\r\n/**\r\n * Compiles RJX into JSON IR format for react create element\r\n * @example\r\n * rjx.outputJSON({ component: 'div', props: { title: 'test', }, children: 'hello', }); //=> { type: 'div',\r\n props: { key: 5, title: 'test' },\r\n children: 'hello' }\r\n * @property {object} this - options for getReactElementFromRJX\r\n * @param {object} rjx - any valid RJX JSON object\r\n * @param {object} resources - any additional resource used for asynchronous properties\r\n * @returns {Object} json - {type,props,children}\r\n */\r\nexport function outputJSON(rjx, resources) {\r\n const context = Object.assign({}, this, { returnJSON: true, });\r\n return getReactElementFromRJX.call(context, rjx, resources);\r\n}\r\nexport const rjxHTMLString = outputHTML;\r\n\r\n/**\r\n * converts RJX JSON IR to JSX\r\n * @example\r\n * rjx.jsonToJSX({ type: 'div', props: { key: 5, title: 'test' }, children: 'hello' }) // => 'hello
'\r\n * @param {Object} json - {type,props,children}\r\n * @returns {String} jsx string\r\n */\r\nexport function jsonToJSX(json) {\r\n const propsString = json.props\r\n ? Object.keys(json.props)\r\n .filter(prop => prop.includes('__eval_') === false)\r\n .reduce((propString, prop) => {\r\n propString += ` ${prop.toString()}=${\r\n typeof json.props[ prop ] === 'string'\r\n ? `\"${json.props[ prop ].toString()}\"`\r\n : `{${(json.props[ `__eval_${prop}` ]||json.props[ prop ]).toString()}}`\r\n }`;\r\n return propString;\r\n }, '')\r\n : '';\r\n return Array.isArray(json.children)\r\n ? `<${json.type} ${propsString}>\r\n ${json.children.map(jsonToJSX)}\r\n`\r\n : `<${json.type}${propsString}>${json.children}`;\r\n}\r\n/**\r\n * Exposes react module used in RJX\r\n * @returns {Object} React\r\n */\r\nexport function __getReact() {\r\n return React;\r\n}\r\n\r\n/**\r\n * Exposes react dom module used in RJX\r\n * @returns {Object} ReactDOM\r\n */\r\nexport function __getReactDOM() {\r\n return ReactDOM;\r\n}\r\n\r\n/**\r\n * Exposes global hook used in RJX\r\n * @returns {Object} useGlobalHook\r\n */\r\nexport function __getUseGlobalHook() {\r\n return useGlobalHook;\r\n}\r\n\r\nexport const _rjxChildren = rjxChildren;\r\nexport const _rjxComponents = rjxComponents;\r\nexport const _rjxProps = rjxProps;\r\nexport const _rjxUtils = rjxUtils;\r\nexport { __express, } from './express';\r\n\r\nexport default getReactElementFromRJX;",
"static": true,
"longname": "/Users/yawjosephetse/Developer/github/repetere/rjx/src/main.js",
"access": "public",
"description": null,
"lineNumber": 1
},
{
"__docId__": 65,
"kind": "variable",
"name": "createElement",
"memberof": "src/main.js",
"static": true,
"longname": "src/main.js~createElement",
"access": "public",
"export": false,
"importPath": "rjx/src/main.js",
"importStyle": null,
"description": null,
"lineNumber": 11,
"undocument": true,
"ignore": true
},
{
"__docId__": 66,
"kind": "variable",
"name": "componentMap",
"memberof": "src/main.js",
"static": true,
"longname": "src/main.js~componentMap",
"access": "public",
"export": false,
"importPath": "rjx/src/main.js",
"importStyle": null,
"description": null,
"lineNumber": 12,
"undocument": true,
"ignore": true
},
{
"__docId__": 67,
"kind": "variable",
"name": "getComputedProps",
"memberof": "src/main.js",
"static": true,
"longname": "src/main.js~getComputedProps",
"access": "public",
"export": false,
"importPath": "rjx/src/main.js",
"importStyle": null,
"description": null,
"lineNumber": 13,
"undocument": true,
"ignore": true
},
{
"__docId__": 68,
"kind": "variable",
"name": "getRJXChildren",
"memberof": "src/main.js",
"static": true,
"longname": "src/main.js~getRJXChildren",
"access": "public",
"export": false,
"importPath": "rjx/src/main.js",
"importStyle": null,
"description": null,
"lineNumber": 14,
"undocument": true,
"ignore": true
},
{
"__docId__": 69,
"kind": "variable",
"name": "displayComponent",
"memberof": "src/main.js",
"static": true,
"longname": "src/main.js~displayComponent",
"access": "public",
"export": false,
"importPath": "rjx/src/main.js",
"importStyle": null,
"description": null,
"lineNumber": 15,
"undocument": true,
"ignore": true
},
{
"__docId__": 70,
"kind": "variable",
"name": "renderIndex",
"memberof": "src/main.js",
"static": true,
"longname": "src/main.js~renderIndex",
"access": "public",
"export": true,
"importPath": "rjx/src/main.js",
"importStyle": "{renderIndex}",
"description": null,
"lineNumber": 16,
"undocument": true
},
{
"__docId__": 71,
"kind": "function",
"name": "rjxRender",
"memberof": "src/main.js",
"generator": false,
"async": false,
"static": true,
"longname": "src/main.js~rjxRender",
"access": "public",
"export": true,
"importPath": "rjx/src/main.js",
"importStyle": "{rjxRender}",
"description": "Use RJX without any configuration to render RJX JSON to HTML and insert RJX into querySelector using ReactDOM.render",
"examples": [
"// Uses react to create \nrjx.rjxRender({ rjx: { component: 'div', props:{className:'rjx-generated',children:[{ component:'p',props:{style:{color:'red'}}, children:'hello world' }]}}, querySelector:'#myApp', });"
],
"lineNumber": 29,
"params": [
{
"nullable": null,
"types": [
"object"
],
"spread": false,
"optional": false,
"name": "config",
"description": "options used to inject html via ReactDOM.render"
},
{
"nullable": null,
"types": [
"object"
],
"spread": false,
"optional": false,
"name": "config.rjx",
"description": "any valid RJX JSON object"
},
{
"nullable": null,
"types": [
"object"
],
"spread": false,
"optional": false,
"name": "config.resources",
"description": "any additional resource used for asynchronous properties"
},
{
"nullable": null,
"types": [
"string"
],
"spread": false,
"optional": false,
"name": "config.querySelector",
"description": "selector for document.querySelector"
}
],
"properties": [
{
"nullable": null,
"types": [
"object"
],
"spread": false,
"optional": false,
"name": "this",
"description": "options for getReactElementFromRJX"
}
]
},
{
"__docId__": 72,
"kind": "function",
"name": "outputHTML",
"memberof": "src/main.js",
"generator": false,
"async": false,
"static": true,
"longname": "src/main.js~outputHTML",
"access": "public",
"export": true,
"importPath": "rjx/src/main.js",
"importStyle": "{outputHTML}",
"description": "Use ReactDOMServer.renderToString to render html from RJX",
"examples": [
"// Uses react to create \nrjx.outputHTML({ rjx: { component: 'div', props:{className:'rjx-generated',children:[{ component:'p',props:{style:{color:'red'}}, children:'hello world' }]}}, });"
],
"lineNumber": 48,
"unknown": [
{
"tagName": "@returns",
"tagValue": "{string} React genereated html via RJX JSON"
}
],
"params": [
{
"nullable": null,
"types": [
"object"
],
"spread": false,
"optional": false,
"name": "config",
"description": "options used to inject html via ReactDOM.render"
},
{
"nullable": null,
"types": [
"object"
],
"spread": false,
"optional": false,
"name": "config.rjx",
"description": "any valid RJX JSON object"
},
{
"nullable": null,
"types": [
"object"
],
"spread": false,
"optional": false,
"name": "config.resources",
"description": "any additional resource used for asynchronous properties"
}
],
"properties": [
{
"nullable": null,
"types": [
"object"
],
"spread": false,
"optional": false,
"name": "this",
"description": "options for getReactElementFromRJX"
}
],
"return": {
"nullable": null,
"types": [
"string"
],
"spread": false,
"description": "React genereated html via RJX JSON"
}
},
{
"__docId__": 73,
"kind": "function",
"name": "getReactElementFromRJX",
"memberof": "src/main.js",
"generator": false,
"async": false,
"static": true,
"longname": "src/main.js~getReactElementFromRJX",
"access": "public",
"export": true,
"importPath": "rjx/src/main.js",
"importStyle": "{getReactElementFromRJX}",
"description": "Use React.createElement and RJX JSON to create React elements",
"examples": [
"// Uses react to create the equivalent JSX hello world\nrjx.getReactElementFromRJX({component:'myCompnent',props:{style:{color:'blue'}},children:'hello world'})"
],
"lineNumber": 69,
"unknown": [
{
"tagName": "@returns",
"tagValue": "{function} React element via React.createElement"
}
],
"params": [
{
"nullable": null,
"types": [
"object"
],
"spread": false,
"optional": false,
"name": "rjx",
"description": "any valid RJX JSON object"
},
{
"nullable": null,
"types": [
"object"
],
"spread": false,
"optional": false,
"name": "resources",
"description": "any additional resource used for asynchronous properties"
}
],
"properties": [
{
"nullable": null,
"types": [
"object"
],
"spread": false,
"optional": false,
"name": "this",
"description": "options for getReactElementFromRJX"
},
{
"nullable": null,
"types": [
"Object"
],
"spread": false,
"optional": true,
"name": "this.componentLibraries",
"description": "react components to render with RJX"
},
{
"nullable": null,
"types": [
"boolean"
],
"spread": false,
"optional": true,
"defaultValue": "false",
"defaultRaw": false,
"name": "this.debug",
"description": "use debug messages"
},
{
"nullable": null,
"types": [
"boolean"
],
"spread": false,
"optional": true,
"defaultValue": "false",
"defaultRaw": false,
"name": "this.returnJSON",
"description": "return json object of {type,props,children} instead of react element"
},
{
"nullable": null,
"types": [
"boolean"
],
"spread": false,
"optional": true,
"defaultValue": "false",
"defaultRaw": false,
"name": "this.disableRenderIndexKey",
"description": "disables auto assign a key prop"
},
{
"nullable": null,
"types": [
"function"
],
"spread": false,
"optional": true,
"defaultValue": "console.error",
"defaultRaw": "console.error",
"name": "this.logError",
"description": "error logging function"
},
{
"nullable": null,
"types": [
"string[]"
],
"spread": false,
"optional": true,
"defaultValue": "[]",
"defaultRaw": [],
"name": "this.boundedComponents",
"description": "list of components that require a bound this context (usefult for redux router)"
}
],
"return": {
"nullable": null,
"types": [
"function"
],
"spread": false,
"description": "React element via React.createElement"
}
},
{
"__docId__": 74,
"kind": "variable",
"name": "getRenderedJSON",
"memberof": "src/main.js",
"static": true,
"longname": "src/main.js~getRenderedJSON",
"access": "public",
"export": true,
"importPath": "rjx/src/main.js",
"importStyle": "{getRenderedJSON}",
"description": null,
"lineNumber": 105,
"undocument": true
},
{
"__docId__": 75,
"kind": "variable",
"name": "getReactElement",
"memberof": "src/main.js",
"static": true,
"longname": "src/main.js~getReactElement",
"access": "public",
"export": true,
"importPath": "rjx/src/main.js",
"importStyle": "{getReactElement}",
"description": null,
"lineNumber": 106,
"undocument": true
},
{
"__docId__": 76,
"kind": "function",
"name": "getReactElementFromJSON",
"memberof": "src/main.js",
"generator": false,
"async": false,
"static": true,
"longname": "src/main.js~getReactElementFromJSON",
"access": "public",
"export": true,
"importPath": "rjx/src/main.js",
"importStyle": "{getReactElementFromJSON}",
"description": "converts a json object {type,props,children} into a react element ",
"examples": [
"rjx.getReactElementFromJSON({type:'div',props:{title:'some title attribute'},children:'inner html text'})"
],
"lineNumber": 116,
"unknown": [
{
"tagName": "@returns",
"tagValue": "{function} React element via React.createElement"
}
],
"params": [
{
"nullable": null,
"types": [
"Object",
"String"
],
"spread": false,
"optional": false,
"name": "options.type",
"description": "'div' or react component"
},
{
"nullable": null,
"types": [
"Object"
],
"spread": false,
"optional": false,
"name": "options.props",
"description": "props for react element"
},
{
"nullable": null,
"types": [
"String",
"[Object]"
],
"spread": false,
"optional": false,
"name": "options.children",
"description": "children elements"
}
],
"return": {
"nullable": null,
"types": [
"function"
],
"spread": false,
"description": "React element via React.createElement"
}
},
{
"__docId__": 77,
"kind": "function",
"name": "compile",
"memberof": "src/main.js",
"generator": false,
"async": false,
"static": true,
"longname": "src/main.js~compile",
"access": "public",
"export": true,
"importPath": "rjx/src/main.js",
"importStyle": "{compile}",
"description": "converts a rjx json object into a react function component ",
"examples": [
"rjx.compile({rjx:{component:'div',props:{title:'some title attribute'},children:'inner html text'}}) //=>React Function Component"
],
"lineNumber": 129,
"unknown": [
{
"tagName": "@returns",
"tagValue": "{function} React element via React.createElement"
}
],
"params": [
{
"nullable": null,
"types": [
"Object"
],
"spread": false,
"optional": false,
"name": "rjx",
"description": "valid RJX JSON"
},
{
"nullable": null,
"types": [
"Object"
],
"spread": false,
"optional": false,
"name": "resources",
"description": "props for react element"
}
],
"return": {
"nullable": null,
"types": [
"function"
],
"spread": false,
"description": "React element via React.createElement"
}
},
{
"__docId__": 78,
"kind": "function",
"name": "outputJSX",
"memberof": "src/main.js",
"generator": false,
"async": false,
"static": true,
"longname": "src/main.js~outputJSX",
"access": "public",
"export": true,
"importPath": "rjx/src/main.js",
"importStyle": "{outputJSX}",
"description": "converts RJX JSON IR to JSX",
"examples": [
"rjx.jsonToJSX({ type: 'div', props: { key: 5, title: 'test' }, children: 'hello' }) // => 'hello
'"
],
"lineNumber": 147,
"unknown": [
{
"tagName": "@returns",
"tagValue": "{String} jsx string"
}
],
"params": [
{
"nullable": null,
"types": [
"Object"
],
"spread": false,
"optional": false,
"name": "json",
"description": "{type,props,children}"
}
],
"return": {
"nullable": null,
"types": [
"String"
],
"spread": false,
"description": "jsx string"
}
},
{
"__docId__": 79,
"kind": "function",
"name": "outputJSON",
"memberof": "src/main.js",
"generator": false,
"async": false,
"static": true,
"longname": "src/main.js~outputJSON",
"access": "public",
"export": true,
"importPath": "rjx/src/main.js",
"importStyle": "{outputJSON}",
"description": "Compiles RJX into JSON IR format for react create element",
"examples": [
"rjx.outputJSON({ component: 'div', props: { title: 'test', }, children: 'hello', }); //=> { type: 'div',\nprops: { key: 5, title: 'test' },\nchildren: 'hello' }"
],
"lineNumber": 164,
"unknown": [
{
"tagName": "@returns",
"tagValue": "{Object} json - {type,props,children}"
}
],
"params": [
{
"nullable": null,
"types": [
"object"
],
"spread": false,
"optional": false,
"name": "rjx",
"description": "any valid RJX JSON object"
},
{
"nullable": null,
"types": [
"object"
],
"spread": false,
"optional": false,
"name": "resources",
"description": "any additional resource used for asynchronous properties"
}
],
"properties": [
{
"nullable": null,
"types": [
"object"
],
"spread": false,
"optional": false,
"name": "this",
"description": "options for getReactElementFromRJX"
}
],
"return": {
"nullable": null,
"types": [
"Object"
],
"spread": false,
"description": "json - {type,props,children}"
}
},
{
"__docId__": 80,
"kind": "variable",
"name": "rjxHTMLString",
"memberof": "src/main.js",
"static": true,
"longname": "src/main.js~rjxHTMLString",
"access": "public",
"export": true,
"importPath": "rjx/src/main.js",
"importStyle": "{rjxHTMLString}",
"description": null,
"lineNumber": 168,
"undocument": true
},
{
"__docId__": 81,
"kind": "function",
"name": "jsonToJSX",
"memberof": "src/main.js",
"generator": false,
"async": false,
"static": true,
"longname": "src/main.js~jsonToJSX",
"access": "public",
"export": true,
"importPath": "rjx/src/main.js",
"importStyle": "{jsonToJSX}",
"description": "converts RJX JSON IR to JSX",
"examples": [
"rjx.jsonToJSX({ type: 'div', props: { key: 5, title: 'test' }, children: 'hello' }) // => 'hello
'"
],
"lineNumber": 177,
"unknown": [
{
"tagName": "@returns",
"tagValue": "{String} jsx string"
}
],
"params": [
{
"nullable": null,
"types": [
"Object"
],
"spread": false,
"optional": false,
"name": "json",
"description": "{type,props,children}"
}
],
"return": {
"nullable": null,
"types": [
"String"
],
"spread": false,
"description": "jsx string"
}
},
{
"__docId__": 82,
"kind": "function",
"name": "__getReact",
"memberof": "src/main.js",
"generator": false,
"async": false,
"static": true,
"longname": "src/main.js~__getReact",
"access": "private",
"export": true,
"importPath": "rjx/src/main.js",
"importStyle": "{__getReact}",
"description": "Exposes react module used in RJX",
"lineNumber": 200,
"unknown": [
{
"tagName": "@returns",
"tagValue": "{Object} React"
}
],
"return": {
"nullable": null,
"types": [
"Object"
],
"spread": false,
"description": "React"
}
},
{
"__docId__": 83,
"kind": "function",
"name": "__getReactDOM",
"memberof": "src/main.js",
"generator": false,
"async": false,
"static": true,
"longname": "src/main.js~__getReactDOM",
"access": "private",
"export": true,
"importPath": "rjx/src/main.js",
"importStyle": "{__getReactDOM}",
"description": "Exposes react dom module used in RJX",
"lineNumber": 208,
"unknown": [
{
"tagName": "@returns",
"tagValue": "{Object} ReactDOM"
}
],
"return": {
"nullable": null,
"types": [
"Object"
],
"spread": false,
"description": "ReactDOM"
}
},
{
"__docId__": 84,
"kind": "function",
"name": "__getUseGlobalHook",
"memberof": "src/main.js",
"generator": false,
"async": false,
"static": true,
"longname": "src/main.js~__getUseGlobalHook",
"access": "private",
"export": true,
"importPath": "rjx/src/main.js",
"importStyle": "{__getUseGlobalHook}",
"description": "Exposes global hook used in RJX",
"lineNumber": 216,
"unknown": [
{
"tagName": "@returns",
"tagValue": "{Object} useGlobalHook"
}
],
"return": {
"nullable": null,
"types": [
"Object"
],
"spread": false,
"description": "useGlobalHook"
}
},
{
"__docId__": 85,
"kind": "variable",
"name": "_rjxChildren",
"memberof": "src/main.js",
"static": true,
"longname": "src/main.js~_rjxChildren",
"access": "private",
"export": true,
"importPath": "rjx/src/main.js",
"importStyle": "{_rjxChildren}",
"description": null,
"lineNumber": 220,
"undocument": true
},
{
"__docId__": 86,
"kind": "variable",
"name": "_rjxComponents",
"memberof": "src/main.js",
"static": true,
"longname": "src/main.js~_rjxComponents",
"access": "private",
"export": true,
"importPath": "rjx/src/main.js",
"importStyle": "{_rjxComponents}",
"description": null,
"lineNumber": 221,
"undocument": true
},
{
"__docId__": 87,
"kind": "variable",
"name": "_rjxProps",
"memberof": "src/main.js",
"static": true,
"longname": "src/main.js~_rjxProps",
"access": "private",
"export": true,
"importPath": "rjx/src/main.js",
"importStyle": "{_rjxProps}",
"description": null,
"lineNumber": 222,
"undocument": true
},
{
"__docId__": 88,
"kind": "variable",
"name": "_rjxUtils",
"memberof": "src/main.js",
"static": true,
"longname": "src/main.js~_rjxUtils",
"access": "private",
"export": true,
"importPath": "rjx/src/main.js",
"importStyle": "{_rjxUtils}",
"description": null,
"lineNumber": 223,
"undocument": true
},
{
"__docId__": 89,
"kind": "file",
"name": "src/props.js",
"content": "import React from 'react';\r\nimport { getRenderedJSON, } from './main';\r\nimport * as utilities from './utils';\r\nimport { getComponentFromMap, } from './components';\r\n// if (typeof window === 'undefined') {\r\n// var window = window || {};\r\n// }\r\n\r\n//https://stackoverflow.com/questions/1007981/how-to-get-function-parameter-names-values-dynamically\r\nexport const STRIP_COMMENTS = /((\\/\\/.*$)|(\\/\\*[\\s\\S]*?\\*\\/))/mg;\r\nexport const ARGUMENT_NAMES = /([^\\s,]+)/g;\r\n/**\r\n * returns the names of parameters from a function declaration\r\n * @example\r\n * const arrowFunctionAdd = (a,b)=>a+b;\r\n * function regularFunctionAdd(c,d){return c+d;}\r\n * getParamNames(arrowFunctionAdd) // => ['a','b']\r\n * getParamNames(regularFunctionAdd) // => ['c','d']\r\n * @param {Function} func \r\n * @todo write tests\r\n */\r\nexport function getParamNames(func) {\r\n var fnStr = func.toString().replace(STRIP_COMMENTS, '');\r\n var result = fnStr.slice(fnStr.indexOf('(')+1, fnStr.indexOf(')')).match(ARGUMENT_NAMES);\r\n if(result === null){\r\n result = [];\r\n }\r\n return result;\r\n}\r\n\r\n/**\r\n * It uses traverse on a traverseObject to returns a resolved object on propName. So if you're making an ajax call and want to pass properties into a component, you can assign them using asyncprops and reference object properties by an array of property paths\r\n * @param {Object} [traverseObject={}] - the object that contains values of propName\r\n * @param {Object} options \r\n * @param {Object} options.rjx - Valid RJX JSON \r\n * @param {Object} [options.propName='asyncprops'] - Property on RJX to resolve values onto, i.e (asyncprops,thisprops,windowprops) \r\n * @returns {Object} resolved object\r\n * @example\r\n const traverseObject = {\r\n user: {\r\n name: 'rjx',\r\n description: 'react withouth javascript',\r\n },\r\n stats: {\r\n logins: 102,\r\n comments: 3,\r\n },\r\n authentication: 'OAuth2',\r\n};\r\nconst testRJX = {\r\n component: 'div',\r\n props: {\r\n id: 'generatedRJX',\r\n className:'rjx',\r\n },\r\n asyncprops:{\r\n auth: [ 'authentication', ],\r\n username: [ 'user', 'name', ],\r\n },\r\n children: [\r\n {\r\n component: 'p',\r\n props: {\r\n style: {\r\n color: 'red',\r\n fontWeight:'bold',\r\n },\r\n },\r\n children:'hello world',\r\n },\r\n ],\r\n};\r\nconst RJXP = getRJXProps({ rjx: testRJX, traverseObject, });\r\n// => {\r\n// auth: 'OAuth2',\r\n// username: 'rjx'\r\n// }\r\n\r\n//finally resolves:\r\nconst testRJX = {\r\n component: 'div',\r\n props: {\r\n id: 'generatedRJX',\r\n className:'rjx',\r\n auth: 'OAuth2',\r\n username: 'rjx',\r\n },\r\n children: [\r\n {\r\n component: 'p',\r\n props: {\r\n style: {\r\n color: 'red',\r\n fontWeight:'bold',\r\n },\r\n },\r\n children:'hello world',\r\n },\r\n ],\r\n};\r\n */\r\nexport function getRJXProps(options = {}) {\r\n // eslint-disable-next-line\r\n let { rjx = {}, propName = 'asyncprops', traverseObject = {}, } = options;\r\n // return (rjx.asyncprops && typeof rjx.asyncprops === 'object')\r\n // ? utilities.traverse(rjx.asyncprops, resources)\r\n // : {};\r\n return (rjx[ propName ] && typeof rjx[ propName ] === 'object')\r\n ? utilities.traverse(rjx[ propName ], traverseObject)\r\n : {};\r\n}\r\n\r\n/**\r\n * returns children rjx components defined on __spreadComponent spread over an array on props.__spread\r\n * @param {*} options \r\n */\r\nexport function getChildrenComponents(options = {}) {\r\n const { allProps = {}, rjx = {}, } = options;\r\n // const asyncprops = getRJXProps({ rjx, propName: 'spreadprops', traverseObject: allProps, });\r\n if (Array.isArray(allProps.__spread) === false) {\r\n if ((this && this.debug) || rjx.debug) {\r\n return {\r\n children: new Error('Using __spreadComponent requires an array prop \\'__spread\\'').toString(),\r\n };\r\n } else {\r\n return { children:undefined, };\r\n }\r\n } else {\r\n return {\r\n _children: allProps.__spread.map(__item => {\r\n const clonedChild = Object.assign({}, rjx.__spreadComponent);\r\n const clonedChildProps = Object.assign({}, clonedChild.props);\r\n clonedChildProps.__item = __item;\r\n clonedChild.props = clonedChildProps;\r\n return clonedChild;\r\n }),\r\n };\r\n }\r\n}\r\n\r\nexport function boundArgsReducer(rjx = {}) {\r\n return (args, arg) => {\r\n let val;\r\n if (this && this.state && typeof this.state[ arg ] !== undefined) val = (this.state[ arg ]);\r\n else if (this && this.props && typeof this.props[ arg ] !== undefined) val = (this.props[ arg ]);\r\n else if (rjx.props && typeof rjx.props[ arg ] !== undefined) val = (rjx.props[ arg ]);\r\n if (typeof val !== undefined) args.push(val);\r\n return args.filter(a=>typeof a!=='undefined');\r\n };\r\n}\r\n\r\n/**\r\n * Used to evalute javascript and set those variables as props. getEvalProps evaluates __dangerouslyEvalProps and __dangerouslyBindEvalProps properties with eval, this is used when component properties are functions, __dangerouslyBindEvalProps is used when those functions require that this is bound to the function. For __dangerouslyBindEvalProps it must resolve an expression, so functions should be wrapped in (). I.e. (function f(x){ return this.minimum+x;})\r\n * @param {Object} options \r\n * @param {Object} options.rjx - Valid RJX JSON \r\n * @returns {Object} returns resolved object with evaluated javascript\r\n * @example\r\n const testVals = {\r\n auth: 'true',\r\n username: '(user={})=>user.name',\r\n };\r\n const testRJX = Object.assign({}, sampleRJX, {\r\n __dangerouslyEvalProps: testVals, __dangerouslyBindEvalProps: {\r\n email: '(function getUser(user={}){ return this.testBound(); })',\r\n },\r\n });\r\n const RJXP = getEvalProps.call({ testBound: () => 'bounded', }, { rjx: testRJX, });\r\n const evalutedComputedFunc = RJXP.username({ name: 'bob', });\r\n const evalutedComputedBoundFunc = RJXP.email({ email:'test@email.domain', });\r\n // expect(RJXP.auth).to.be.true;\r\n // expect(evalutedComputedFunc).to.eql('bob');\r\n // expect(evalutedComputedBoundFunc).to.eql('bounded');\r\n */\r\nexport function getEvalProps(options = {}) {\r\n const { rjx, } = options;\r\n const scopedEval = eval; //https://github.com/rollup/rollup/wiki/Troubleshooting#avoiding-eval\r\n const evProps = Object.keys(rjx.__dangerouslyEvalProps || {}).reduce((eprops, epropName) => {\r\n let evVal;\r\n let evValString;\r\n try {\r\n // eslint-disable-next-line\r\n evVal = scopedEval(rjx.__dangerouslyEvalProps[ epropName ]);\r\n evValString = evVal.toString();\r\n } catch (e) { \r\n if (this.debug || rjx.debug) evVal = e;\r\n }\r\n eprops[ epropName ] = (typeof evVal === 'function')\r\n ? evVal.call(this, { rjx, })\r\n : evVal;\r\n if (this.exposeEval) eprops[ `__eval_${epropName}` ] = evValString;\r\n return eprops;\r\n }, {});\r\n const evBindProps = Object.keys(rjx.__dangerouslyBindEvalProps || {}).reduce((eprops, epropName) => {\r\n let evVal;\r\n let evValString;\r\n\r\n try {\r\n let args;\r\n const functionBody = rjx.__dangerouslyBindEvalProps[ epropName ];\r\n // InlineFunction = Function.prototype.constructor.apply({}, args);\r\n let functionDefinition;\r\n if (typeof functionBody === 'function') {\r\n functionDefinition = functionBody;\r\n } else {\r\n functionDefinition = scopedEval(rjx.__dangerouslyBindEvalProps[ epropName ]);\r\n evValString = functionDefinition.toString();\r\n\r\n } // eslint-disable-next-line\r\n if (rjx.__functionargs && rjx.__functionargs[epropName]) {\r\n args = [this, ].concat(rjx.__functionargs[epropName].reduce(boundArgsReducer.call(this, rjx), []));\r\n } else if (rjx.__functionparams===false) {\r\n args = [this, ];\r\n } else {\r\n const functionDefArgs = getParamNames(functionDefinition);\r\n args = [this, ].concat(functionDefArgs.reduce(boundArgsReducer.call(this, rjx), []));\r\n }\r\n // eslint-disable-next-line\r\n evVal = functionDefinition.bind(...args);\r\n } catch (e) { \r\n if (this.debug || rjx.debug) evVal = e;\r\n }\r\n // eslint-disable-next-line\r\n eprops[ epropName ] = evVal;\r\n if (this.exposeEval) eprops[ `__eval_${epropName}` ] = evValString;\r\n return eprops;\r\n }, {});\r\n\r\n return Object.assign({}, evProps, evBindProps);\r\n}\r\n\r\n/**\r\n * Resolves rjx.__dangerouslyInsertComponents into an object that turns each value into a React components. This is typically used in a library like Recharts where you pass custom components for chart ticks or plot points. \r\n * @param {Object} options \r\n * @param {Object} options.rjx - Valid RJX JSON \r\n * @param {Object} [options.resources={}] - object to use for resourceprops(asyncprops), usually a result of an asynchronous call\r\n * @returns {Object} resolved object of React Components\r\n */\r\nexport function getComponentProps(options = {}) {\r\n const { rjx, resources, } = options;\r\n return Object.keys(rjx.__dangerouslyInsertComponents).reduce((cprops, cpropName) => {\r\n let componentVal;\r\n try {\r\n // eslint-disable-next-line\r\n componentVal = getRenderedJSON.call(this, rjx.__dangerouslyInsertComponents[ cpropName ], resources);\r\n } catch (e) {\r\n if (this.debug || rjx.debug) componentVal = e;\r\n }\r\n cprops[ cpropName ] = componentVal;\r\n return cprops;\r\n }, {});\r\n}\r\n\r\n/**\r\n * Resolves rjx.__dangerouslyInsertReactComponents into an object that turns each value into a React components. This is typically used in a library like Recharts where you pass custom components for chart ticks or plot points. \r\n * @param {Object} options \r\n * @param {Object} options.rjx - Valid RJX JSON \r\n// * @param {Object} [options.resources={}] - object to use for asyncprops, usually a result of an asynchronous call\r\n * @returns {Object} resolved object of React Components\r\n */\r\nexport function getReactComponentProps(options = {}) {\r\n const { rjx, } = options;\r\n if (rjx.__dangerouslyInsertRJXComponents && Object.keys(rjx.__dangerouslyInsertRJXComponents).length) { \r\n return Object.keys(rjx.__dangerouslyInsertRJXComponents).reduce((cprops, cpropName) => {\r\n let componentVal;\r\n try {\r\n componentVal = getComponentFromMap({\r\n rjx: rjx.__dangerouslyInsertRJXComponents[ cpropName ],\r\n reactComponents: this.reactComponents,\r\n componentLibraries: this.componentLibraries,\r\n });\r\n } catch (e) {\r\n if (this.debug || rjx.debug) componentVal = e;\r\n }\r\n // eslint-disable-next-line\r\n cprops[ cpropName ] = componentVal;\r\n return cprops;\r\n }, {});\r\n } else {\r\n return Object.keys(rjx.__dangerouslyInsertReactComponents).reduce((cprops, cpropName) => {\r\n let componentVal;\r\n try {\r\n componentVal = getComponentFromMap({\r\n rjx: {\r\n component: rjx.__dangerouslyInsertReactComponents[ cpropName ],\r\n props: rjx.__dangerouslyInsertComponentProps\r\n ? rjx.__dangerouslyInsertComponentProps[ cpropName ]\r\n : {},\r\n },\r\n reactComponents: this.reactComponents,\r\n componentLibraries: this.componentLibraries,\r\n });\r\n } catch (e) {\r\n if (this.debug || rjx.debug) componentVal = e;\r\n }\r\n // eslint-disable-next-line\r\n cprops[ cpropName ] = componentVal;\r\n return cprops;\r\n }, {});\r\n }\r\n}\r\n\r\n/**\r\n * Takes a function string and returns a function on either this.props or window. The function can only be 2 levels deep\r\n * @param {Object} options \r\n * @param {String} [options.propFunc='func:'] - function string, like func:window.LocalStorage.getItem or func:this.props.onClick or func:inline.myInlineFunction\r\n * @param {Object} [options.allProps={}] - merged computed props, Object.assign({ key: renderIndex, }, thisprops, rjx.props, resourceprops, asyncprops, windowprops, evalProps, insertedComponents);\r\n * @returns {Function} returns a function from this.props or window functions\r\n * @example\r\n * getFunctionFromProps({ propFunc='func:this.props.onClick', }) // => this.props.onClick\r\n */\r\nexport function getFunctionFromProps(options) {\r\n const { propFunc='func:', propBody, rjx, functionProperty='', } = options;\r\n // eslint-disable-next-line\r\n const { logError = console.error, debug, } = this;\r\n const windowObject = this.window || global.window || {};\r\n try {\r\n const functionNameString = propFunc.split(':')[ 1 ] || '';\r\n const functionNameArray = functionNameString.split('.');\r\n const functionName = (functionNameArray.length) ? functionNameArray[ functionNameArray.length - 1 ] : '';\r\n\r\n if (propFunc.includes('func:inline')) {\r\n // eslint-disable-next-line\r\n let InlineFunction;\r\n if (rjx.__functionargs) {\r\n const args = [].concat(rjx.__functionargs[functionProperty]);\r\n args.push(propBody);\r\n InlineFunction = Function.prototype.constructor.apply({}, args);\r\n } else {\r\n InlineFunction = Function('param1', 'param2', '\"use strict\";' + propBody);\r\n }\r\n const [propFuncName, funcName, ] = propFunc.split('.');\r\n \r\n Object.defineProperty(\r\n InlineFunction,\r\n 'name',\r\n {\r\n value: funcName,\r\n }\r\n );\r\n if (rjx.__functionargs) {\r\n const boundArgs = [this,].concat(rjx.__functionargs[functionProperty].map(arg => rjx.props[ arg ]));\r\n return InlineFunction.bind(...boundArgs);\r\n } else {\r\n return InlineFunction.bind(this);\r\n }\r\n } else if (propFunc.indexOf('func:window') !== -1) {\r\n if (functionNameArray.length === 3) {\r\n try {\r\n return windowObject[ functionNameArray[ 1 ] ][ functionName ].bind(this);\r\n } catch (e) {\r\n if (debug) {\r\n logError(e);\r\n }\r\n return windowObject[ functionNameArray[ 1 ] ][ functionName ];\r\n }\r\n } else {\r\n try {\r\n return windowObject[ functionName ].bind(this);\r\n } catch (e) {\r\n if (debug) {\r\n logError(e);\r\n }\r\n return windowObject[ functionName ];\r\n }\r\n }\r\n } else if (functionNameArray.length === 4) {\r\n return (this.props)\r\n ? this.props[ functionNameArray[ 2 ] ][ functionName ]\r\n : rjx.props[ functionNameArray[ 2 ] ][ functionName ];\r\n } else if (functionNameArray.length === 3) {\r\n return (this.props)\r\n ? this.props[ functionName ].bind(this)\r\n : rjx.props[ functionName ].bind(this);\r\n } else {\r\n return function () {};\r\n }\r\n } catch (e) {\r\n if (this.debug){\r\n logError(e);\r\n if (rjx && rjx.debug) return e;\r\n }\r\n return function () {};\r\n }\r\n}\r\n\r\n/**\r\n * Returns a resolved object from function strings that has functions pulled from rjx.__functionProps\r\n * @param {Object} options \r\n * @param {Object} options.rjx - Valid RJX JSON \r\n * @param {Object} [options.allProps={}] - merged computed props, Object.assign({ key: renderIndex, }, thisprops, rjx.props, asyncprops, windowprops, evalProps, insertedComponents);\r\n * @returns {Object} resolved object of functions from function strings\r\n */\r\nexport function getFunctionProps(options = {}) {\r\n const { allProps = {}, rjx = {}, } = options;\r\n const getFunction = getFunctionFromProps.bind(this);\r\n const funcProps = rjx.__functionProps;\r\n //Allowing for window functions\r\n Object.keys(funcProps).forEach(key => {\r\n if (typeof funcProps[ key ] === 'string' && funcProps[ key ].indexOf('func:') !== -1) {\r\n allProps[ key ] = getFunction({\r\n propFunc: funcProps[ key ],\r\n propBody: (rjx.__inline)?rjx.__inline[ key ]:'',\r\n rjx,\r\n functionProperty:key,\r\n });\r\n } \r\n });\r\n return allProps;\r\n}\r\n\r\n/**\r\n * Returns a resolved object that has React Components pulled from window.__rjx_custom_elements\r\n * @param {Object} options \r\n * @param {Object} options.rjx - Valid RJX JSON \r\n * @param {Object} [options.allProps={}] - merged computed props, Object.assign({ key: renderIndex, }, thisprops, rjx.props, asyncprops, windowprops, evalProps, insertedComponents);\r\n * @returns {Object} resolved object of with React Components from a window property window.__rjx_custom_elements\r\n */\r\nexport function getWindowComponents(options = {}) {\r\n const { allProps, rjx, } = options;\r\n const windowComponents = rjx.__windowComponents;\r\n const window = this.window || global.window || {};\r\n const windowFuncPrefix = 'func:window.__rjx_custom_elements';\r\n // if (rjx.hasWindowComponent && window.__rjx_custom_elements) {\r\n Object.keys(windowComponents).forEach(key => {\r\n const windowKEY = (typeof windowComponents[ key ] === 'string')\r\n ? windowComponents[ key ].replace(`${windowFuncPrefix}.`, '')\r\n : '';\r\n if (typeof windowComponents[ key ] === 'string' && windowComponents[ key ].indexOf(windowFuncPrefix) !== -1 && typeof window.__rjx_custom_elements[ windowKEY ] === 'function') {\r\n const windowComponentElement = window.__rjx_custom_elements[ windowKEY ];\r\n const windowComponentProps = (allProps[ '__windowComponentProps' ]) ? allProps[ '__windowComponentProps' ]\r\n : this.props;\r\n allProps[ key ] = React.createElement(\r\n windowComponentElement,\r\n windowComponentProps,\r\n null);\r\n }\r\n });\r\n return allProps;\r\n}\r\n\r\n/**\r\n * Returns computed properties for React Components and any property that's prefixed with __ is a computedProperty\r\n * @param {Object} options \r\n * @param {Object} options.rjx - Valid RJX JSON \r\n * @param {Object} [options.resources={}] - object to use for asyncprops, usually a result of an asynchronous call\r\n * @param {Number} options.renderIndex - number used for React key prop\r\n * @param {function} [options.logError=console.error] - error logging function\r\n * @param {Object} [options.componentLibraries] - react components to render with RJX\r\n * @param {Boolean} [options.useReduxState=true] - use redux props in this.props\r\n * @param {Boolean} [options.ignoreReduxPropsInComponentLibraries=true] - ignore redux props in this.props for component libraries, this is helpful incase these properties collide with component library element properties\r\n * @param {boolean} [options.debug=false] - use debug messages\r\n * @example\r\nconst testRJX = { component: 'div',\r\n props: { id: 'generatedRJX', className: 'rjx' },\r\n children: [ [Object] ],\r\n asyncprops: { auth: [Array], username: [Array] },\r\n __dangerouslyEvalProps: { getUsername: '(user={})=>user.name' },\r\n __dangerouslyInsertComponents: { myComponent: [Object] } \r\nconst resources = {\r\n user: {\r\n name: 'rjx',\r\n description: 'react withouth javascript',\r\n },\r\n stats: {\r\n logins: 102,\r\n comments: 3,\r\n },\r\n authentication: 'OAuth2',\r\n};\r\nconst renderIndex = 1;\r\ngetComputedProps.call({}, {\r\n rjx: testRJX,\r\n resources,\r\n renderIndex,\r\n });\r\ncomputedProps = { key: 1,\r\n id: 'generatedRJX',\r\n className: 'rjx',\r\n auth: 'OAuth2',\r\n username: 'rjx',\r\n getUsername: [Function],\r\n myComponent:\r\n { '$$typeof': Symbol(react.element),\r\n type: 'p',\r\n key: '8',\r\n ref: null,\r\n props: [Object],\r\n _owner: null,\r\n _store: {} } } }\r\n *\r\n */\r\nexport function getComputedProps(options = {}) {\r\n // eslint-disable-next-line\r\n const { rjx = {}, resources = {}, renderIndex, logError = console.error, useReduxState=true, ignoreReduxPropsInComponentLibraries=true, componentLibraries, debug, } = options;\r\n try {\r\n const componentThisProp = (rjx.thisprops)\r\n ? Object.assign({\r\n __rjx: {\r\n _component: rjx,\r\n _resources: resources,\r\n },\r\n }, this.props,\r\n rjx.props,\r\n (useReduxState && !rjx.ignoreReduxProps && (ignoreReduxPropsInComponentLibraries && !componentLibraries[ rjx.component ]))\r\n ? (this.props && this.props.getState) ? this.props.getState() : {}\r\n : {}\r\n )\r\n : undefined;\r\n const windowTraverse = typeof window !== 'undefined' ? window : {};\r\n const asyncprops = rjx.asyncprops ? getRJXProps({ rjx, propName: 'asyncprops', traverseObject: resources, }) : {};\r\n const resourceprops = rjx.resourceprops ? getRJXProps({ rjx, propName: 'resourceprops', traverseObject: resources, }) : {};\r\n const windowprops = rjx.windowprops ? getRJXProps({ rjx, propName: 'windowprops', traverseObject: windowTraverse, }) : {};\r\n const thisprops = rjx.thisprops ? getRJXProps({ rjx, propName: 'thisprops', traverseObject: componentThisProp, }) : {};\r\n const thisstate = rjx.thisstate ? getRJXProps({ rjx, propName: 'thisstate', traverseObject: this.state, }) : {};\r\n\r\n //allowing javascript injections\r\n const evalProps = (rjx.__dangerouslyEvalProps || rjx.__dangerouslyBindEvalProps)\r\n ? getEvalProps.call(this, { rjx, })\r\n : {};\r\n const insertedComponents = (rjx.__dangerouslyInsertComponents)\r\n ? getComponentProps.call(this, { rjx, resources, debug, })\r\n : {};\r\n const insertedReactComponents = (rjx.__dangerouslyInsertReactComponents || rjx.__dangerouslyInsertRJXComponents)\r\n ? getReactComponentProps.call(this, { rjx, debug, })\r\n : {};\r\n const allProps = Object.assign({}, this.disableRenderIndexKey ? {}: { key: renderIndex, }, rjx.props, thisprops, thisstate, resourceprops, asyncprops, windowprops, evalProps, insertedComponents, insertedReactComponents);\r\n const computedProps = Object.assign({}, allProps,\r\n rjx.__functionProps ? getFunctionProps.call(this, { allProps, rjx, }) : {},\r\n rjx.__windowComponents ? getWindowComponents.call(this, { allProps, rjx, }) : {},\r\n rjx.__spreadComponent ? getChildrenComponents.call(this, { allProps, rjx, }) : {});\r\n if (rjx.debug) console.debug({ rjx, computedProps, });\r\n return computedProps;\r\n } catch (e) {\r\n debug && logError(e, (e.stack) ? e.stack : 'no stack');\r\n return null;\r\n }\r\n}",
"static": true,
"longname": "/Users/yawjosephetse/Developer/github/repetere/rjx/src/props.js",
"access": "public",
"description": null,
"lineNumber": 1
},
{
"__docId__": 90,
"kind": "variable",
"name": "STRIP_COMMENTS",
"memberof": "src/props.js",
"static": true,
"longname": "src/props.js~STRIP_COMMENTS",
"access": "public",
"export": true,
"importPath": "rjx/src/props.js",
"importStyle": "{STRIP_COMMENTS}",
"description": null,
"lineNumber": 10,
"undocument": true
},
{
"__docId__": 91,
"kind": "variable",
"name": "ARGUMENT_NAMES",
"memberof": "src/props.js",
"static": true,
"longname": "src/props.js~ARGUMENT_NAMES",
"access": "public",
"export": true,
"importPath": "rjx/src/props.js",
"importStyle": "{ARGUMENT_NAMES}",
"description": null,
"lineNumber": 11,
"undocument": true
},
{
"__docId__": 92,
"kind": "function",
"name": "getParamNames",
"memberof": "src/props.js",
"generator": false,
"async": false,
"static": true,
"longname": "src/props.js~getParamNames",
"access": "public",
"export": true,
"importPath": "rjx/src/props.js",
"importStyle": "{getParamNames}",
"description": "returns the names of parameters from a function declaration",
"examples": [
"const arrowFunctionAdd = (a,b)=>a+b;\nfunction regularFunctionAdd(c,d){return c+d;}\ngetParamNames(arrowFunctionAdd) // => ['a','b']\ngetParamNames(regularFunctionAdd) // => ['c','d']"
],
"lineNumber": 22,
"todo": [
"write tests"
],
"params": [
{
"nullable": null,
"types": [
"Function"
],
"spread": false,
"optional": false,
"name": "func",
"description": ""
}
]
},
{
"__docId__": 93,
"kind": "function",
"name": "getRJXProps",
"memberof": "src/props.js",
"generator": false,
"async": false,
"static": true,
"longname": "src/props.js~getRJXProps",
"access": "public",
"export": true,
"importPath": "rjx/src/props.js",
"importStyle": "{getRJXProps}",
"description": "It uses traverse on a traverseObject to returns a resolved object on propName. So if you're making an ajax call and want to pass properties into a component, you can assign them using asyncprops and reference object properties by an array of property paths",
"examples": [
"const traverseObject = {\nuser: {\nname: 'rjx',\ndescription: 'react withouth javascript',\n},\nstats: {\nlogins: 102,\ncomments: 3,\n},\nauthentication: 'OAuth2',\n};\nconst testRJX = {\ncomponent: 'div',\nprops: {\nid: 'generatedRJX',\nclassName:'rjx',\n},\nasyncprops:{\nauth: [ 'authentication', ],\nusername: [ 'user', 'name', ],\n},\nchildren: [\n{\ncomponent: 'p',\nprops: {\nstyle: {\ncolor: 'red',\nfontWeight:'bold',\n},\n},\nchildren:'hello world',\n},\n],\n};\nconst RJXP = getRJXProps({ rjx: testRJX, traverseObject, });\n// => {\n// auth: 'OAuth2',\n// username: 'rjx'\n// }\n\n//finally resolves:\nconst testRJX = {\ncomponent: 'div',\nprops: {\nid: 'generatedRJX',\nclassName:'rjx',\nauth: 'OAuth2',\nusername: 'rjx',\n},\nchildren: [\n{\ncomponent: 'p',\nprops: {\nstyle: {\ncolor: 'red',\nfontWeight:'bold',\n},\n},\nchildren:'hello world',\n},\n],\n};"
],
"lineNumber": 102,
"unknown": [
{
"tagName": "@returns",
"tagValue": "{Object} resolved object"
}
],
"params": [
{
"nullable": null,
"types": [
"Object"
],
"spread": false,
"optional": true,
"defaultValue": "{}",
"defaultRaw": {},
"name": "traverseObject",
"description": "the object that contains values of propName"
},
{
"nullable": null,
"types": [
"Object"
],
"spread": false,
"optional": false,
"name": "options",
"description": ""
},
{
"nullable": null,
"types": [
"Object"
],
"spread": false,
"optional": false,
"name": "options.rjx",
"description": "Valid RJX JSON"
},
{
"nullable": null,
"types": [
"Object"
],
"spread": false,
"optional": true,
"defaultValue": "'asyncprops'",
"defaultRaw": "'asyncprops'",
"name": "options.propName",
"description": "Property on RJX to resolve values onto, i.e (asyncprops,thisprops,windowprops)"
}
],
"return": {
"nullable": null,
"types": [
"Object"
],
"spread": false,
"description": "resolved object"
}
},
{
"__docId__": 94,
"kind": "function",
"name": "getChildrenComponents",
"memberof": "src/props.js",
"generator": false,
"async": false,
"static": true,
"longname": "src/props.js~getChildrenComponents",
"access": "public",
"export": true,
"importPath": "rjx/src/props.js",
"importStyle": "{getChildrenComponents}",
"description": "returns children rjx components defined on __spreadComponent spread over an array on props.__spread",
"lineNumber": 117,
"params": [
{
"nullable": null,
"types": [
"*"
],
"spread": false,
"optional": false,
"name": "options",
"description": ""
}
]
},
{
"__docId__": 95,
"kind": "function",
"name": "boundArgsReducer",
"memberof": "src/props.js",
"generator": false,
"async": false,
"static": true,
"longname": "src/props.js~boundArgsReducer",
"access": "public",
"export": true,
"importPath": "rjx/src/props.js",
"importStyle": "{boundArgsReducer}",
"description": null,
"lineNumber": 141,
"undocument": true
},
{
"__docId__": 96,
"kind": "function",
"name": "getEvalProps",
"memberof": "src/props.js",
"generator": false,
"async": false,
"static": true,
"longname": "src/props.js~getEvalProps",
"access": "public",
"export": true,
"importPath": "rjx/src/props.js",
"importStyle": "{getEvalProps}",
"description": "Used to evalute javascript and set those variables as props. getEvalProps evaluates __dangerouslyEvalProps and __dangerouslyBindEvalProps properties with eval, this is used when component properties are functions, __dangerouslyBindEvalProps is used when those functions require that this is bound to the function. For __dangerouslyBindEvalProps it must resolve an expression, so functions should be wrapped in (). I.e. (function f(x){ return this.minimum+x;})",
"examples": [
"const testVals = {\nauth: 'true',\nusername: '(user={})=>user.name',\n};\nconst testRJX = Object.assign({}, sampleRJX, {\n__dangerouslyEvalProps: testVals, __dangerouslyBindEvalProps: {\nemail: '(function getUser(user={}){ return this.testBound(); })',\n},\n});\nconst RJXP = getEvalProps.call({ testBound: () => 'bounded', }, { rjx: testRJX, });\nconst evalutedComputedFunc = RJXP.username({ name: 'bob', });\nconst evalutedComputedBoundFunc = RJXP.email({ email:'test@email.domain', });\n// expect(RJXP.auth).to.be.true;\n// expect(evalutedComputedFunc).to.eql('bob');\n// expect(evalutedComputedBoundFunc).to.eql('bounded');"
],
"lineNumber": 174,
"unknown": [
{
"tagName": "@returns",
"tagValue": "{Object} returns resolved object with evaluated javascript"
}
],
"params": [
{
"nullable": null,
"types": [
"Object"
],
"spread": false,
"optional": false,
"name": "options",
"description": ""
},
{
"nullable": null,
"types": [
"Object"
],
"spread": false,
"optional": false,
"name": "options.rjx",
"description": "Valid RJX JSON"
}
],
"return": {
"nullable": null,
"types": [
"Object"
],
"spread": false,
"description": "returns resolved object with evaluated javascript"
}
},
{
"__docId__": 97,
"kind": "function",
"name": "getComponentProps",
"memberof": "src/props.js",
"generator": false,
"async": false,
"static": true,
"longname": "src/props.js~getComponentProps",
"access": "public",
"export": true,
"importPath": "rjx/src/props.js",
"importStyle": "{getComponentProps}",
"description": "Resolves rjx.__dangerouslyInsertComponents into an object that turns each value into a React components. This is typically used in a library like Recharts where you pass custom components for chart ticks or plot points. ",
"lineNumber": 238,
"unknown": [
{
"tagName": "@returns",
"tagValue": "{Object} resolved object of React Components"
}
],
"params": [
{
"nullable": null,
"types": [
"Object"
],
"spread": false,
"optional": false,
"name": "options",
"description": ""
},
{
"nullable": null,
"types": [
"Object"
],
"spread": false,
"optional": false,
"name": "options.rjx",
"description": "Valid RJX JSON"
},
{
"nullable": null,
"types": [
"Object"
],
"spread": false,
"optional": true,
"defaultValue": "{}",
"defaultRaw": {},
"name": "options.resources",
"description": "object to use for resourceprops(asyncprops), usually a result of an asynchronous call"
}
],
"return": {
"nullable": null,
"types": [
"Object"
],
"spread": false,
"description": "resolved object of React Components"
}
},
{
"__docId__": 98,
"kind": "function",
"name": "getReactComponentProps",
"memberof": "src/props.js",
"generator": false,
"async": false,
"static": true,
"longname": "src/props.js~getReactComponentProps",
"access": "public",
"export": true,
"importPath": "rjx/src/props.js",
"importStyle": "{getReactComponentProps}",
"description": "Resolves rjx.__dangerouslyInsertReactComponents into an object that turns each value into a React components. This is typically used in a library like Recharts where you pass custom components for chart ticks or plot points. ",
"lineNumber": 260,
"unknown": [
{
"tagName": "@returns",
"tagValue": "{Object} resolved object of React Components"
}
],
"params": [
{
"nullable": null,
"types": [
"Object"
],
"spread": false,
"optional": false,
"name": "options",
"description": ""
},
{
"nullable": null,
"types": [
"Object"
],
"spread": false,
"optional": false,
"name": "options.rjx",
"description": "Valid RJX JSON \n// * @param {Object} [options.resources={}] - object to use for asyncprops, usually a result of an asynchronous call"
}
],
"return": {
"nullable": null,
"types": [
"Object"
],
"spread": false,
"description": "resolved object of React Components"
}
},
{
"__docId__": 99,
"kind": "function",
"name": "getFunctionFromProps",
"memberof": "src/props.js",
"generator": false,
"async": false,
"static": true,
"longname": "src/props.js~getFunctionFromProps",
"access": "public",
"export": true,
"importPath": "rjx/src/props.js",
"importStyle": "{getFunctionFromProps}",
"description": "Takes a function string and returns a function on either this.props or window. The function can only be 2 levels deep",
"examples": [
"getFunctionFromProps({ propFunc='func:this.props.onClick', }) // => this.props.onClick"
],
"lineNumber": 311,
"unknown": [
{
"tagName": "@returns",
"tagValue": "{Function} returns a function from this.props or window functions"
}
],
"params": [
{
"nullable": null,
"types": [
"Object"
],
"spread": false,
"optional": false,
"name": "options",
"description": ""
},
{
"nullable": null,
"types": [
"String"
],
"spread": false,
"optional": true,
"defaultValue": "'func:'",
"defaultRaw": "'func:'",
"name": "options.propFunc",
"description": "function string, like func:window.LocalStorage.getItem or func:this.props.onClick or func:inline.myInlineFunction"
},
{
"nullable": null,
"types": [
"Object"
],
"spread": false,
"optional": true,
"defaultValue": "{}",
"defaultRaw": {},
"name": "options.allProps",
"description": "merged computed props, Object.assign({ key: renderIndex, }, thisprops, rjx.props, resourceprops, asyncprops, windowprops, evalProps, insertedComponents);"
}
],
"return": {
"nullable": null,
"types": [
"Function"
],
"spread": false,
"description": "returns a function from this.props or window functions"
}
},
{
"__docId__": 100,
"kind": "function",
"name": "getFunctionProps",
"memberof": "src/props.js",
"generator": false,
"async": false,
"static": true,
"longname": "src/props.js~getFunctionProps",
"access": "public",
"export": true,
"importPath": "rjx/src/props.js",
"importStyle": "{getFunctionProps}",
"description": "Returns a resolved object from function strings that has functions pulled from rjx.__functionProps",
"lineNumber": 393,
"unknown": [
{
"tagName": "@returns",
"tagValue": "{Object} resolved object of functions from function strings"
}
],
"params": [
{
"nullable": null,
"types": [
"Object"
],
"spread": false,
"optional": false,
"name": "options",
"description": ""
},
{
"nullable": null,
"types": [
"Object"
],
"spread": false,
"optional": false,
"name": "options.rjx",
"description": "Valid RJX JSON"
},
{
"nullable": null,
"types": [
"Object"
],
"spread": false,
"optional": true,
"defaultValue": "{}",
"defaultRaw": {},
"name": "options.allProps",
"description": "merged computed props, Object.assign({ key: renderIndex, }, thisprops, rjx.props, asyncprops, windowprops, evalProps, insertedComponents);"
}
],
"return": {
"nullable": null,
"types": [
"Object"
],
"spread": false,
"description": "resolved object of functions from function strings"
}
},
{
"__docId__": 101,
"kind": "function",
"name": "getWindowComponents",
"memberof": "src/props.js",
"generator": false,
"async": false,
"static": true,
"longname": "src/props.js~getWindowComponents",
"access": "public",
"export": true,
"importPath": "rjx/src/props.js",
"importStyle": "{getWindowComponents}",
"description": "Returns a resolved object that has React Components pulled from window.__rjx_custom_elements",
"lineNumber": 418,
"unknown": [
{
"tagName": "@returns",
"tagValue": "{Object} resolved object of with React Components from a window property window.__rjx_custom_elements"
}
],
"params": [
{
"nullable": null,
"types": [
"Object"
],
"spread": false,
"optional": false,
"name": "options",
"description": ""
},
{
"nullable": null,
"types": [
"Object"
],
"spread": false,
"optional": false,
"name": "options.rjx",
"description": "Valid RJX JSON"
},
{
"nullable": null,
"types": [
"Object"
],
"spread": false,
"optional": true,
"defaultValue": "{}",
"defaultRaw": {},
"name": "options.allProps",
"description": "merged computed props, Object.assign({ key: renderIndex, }, thisprops, rjx.props, asyncprops, windowprops, evalProps, insertedComponents);"
}
],
"return": {
"nullable": null,
"types": [
"Object"
],
"spread": false,
"description": "resolved object of with React Components from a window property window.__rjx_custom_elements"
}
},
{
"__docId__": 102,
"kind": "function",
"name": "getComputedProps",
"memberof": "src/props.js",
"generator": false,
"async": false,
"static": true,
"longname": "src/props.js~getComputedProps",
"access": "public",
"export": true,
"importPath": "rjx/src/props.js",
"importStyle": "{getComputedProps}",
"description": "Returns computed properties for React Components and any property that's prefixed with __ is a computedProperty",
"examples": [
"const testRJX = { component: 'div',\nprops: { id: 'generatedRJX', className: 'rjx' },\nchildren: [ [Object] ],\nasyncprops: { auth: [Array], username: [Array] },\n__dangerouslyEvalProps: { getUsername: '(user={})=>user.name' },\n__dangerouslyInsertComponents: { myComponent: [Object] } \nconst resources = {\nuser: {\nname: 'rjx',\ndescription: 'react withouth javascript',\n},\nstats: {\nlogins: 102,\ncomments: 3,\n},\nauthentication: 'OAuth2',\n};\nconst renderIndex = 1;\ngetComputedProps.call({}, {\nrjx: testRJX,\nresources,\nrenderIndex,\n});\ncomputedProps = { key: 1,\nid: 'generatedRJX',\nclassName: 'rjx',\nauth: 'OAuth2',\nusername: 'rjx',\ngetUsername: [Function],\nmyComponent:\n{ '$$typeof': Symbol(react.element),\ntype: 'p',\nkey: '8',\nref: null,\nprops: [Object],\n_owner: null,\n_store: {} } } }"
],
"lineNumber": 492,
"params": [
{
"nullable": null,
"types": [
"Object"
],
"spread": false,
"optional": false,
"name": "options",
"description": ""
},
{
"nullable": null,
"types": [
"Object"
],
"spread": false,
"optional": false,
"name": "options.rjx",
"description": "Valid RJX JSON"
},
{
"nullable": null,
"types": [
"Object"
],
"spread": false,
"optional": true,
"defaultValue": "{}",
"defaultRaw": {},
"name": "options.resources",
"description": "object to use for asyncprops, usually a result of an asynchronous call"
},
{
"nullable": null,
"types": [
"Number"
],
"spread": false,
"optional": false,
"name": "options.renderIndex",
"description": "number used for React key prop"
},
{
"nullable": null,
"types": [
"function"
],
"spread": false,
"optional": true,
"defaultValue": "console.error",
"defaultRaw": "console.error",
"name": "options.logError",
"description": "error logging function"
},
{
"nullable": null,
"types": [
"Object"
],
"spread": false,
"optional": true,
"name": "options.componentLibraries",
"description": "react components to render with RJX"
},
{
"nullable": null,
"types": [
"Boolean"
],
"spread": false,
"optional": true,
"defaultValue": "true",
"defaultRaw": true,
"name": "options.useReduxState",
"description": "use redux props in this.props"
},
{
"nullable": null,
"types": [
"Boolean"
],
"spread": false,
"optional": true,
"defaultValue": "true",
"defaultRaw": true,
"name": "options.ignoreReduxPropsInComponentLibraries",
"description": "ignore redux props in this.props for component libraries, this is helpful incase these properties collide with component library element properties"
},
{
"nullable": null,
"types": [
"boolean"
],
"spread": false,
"optional": true,
"defaultValue": "false",
"defaultRaw": false,
"name": "options.debug",
"description": "use debug messages"
}
]
},
{
"__docId__": 103,
"kind": "file",
"name": "src/utils.js",
"content": "import UAParser from 'ua-parser-js';\r\n\r\n\r\n/**\r\n * Used to evaluate whether or not to render a component\r\n * @param {Object} options \r\n * @param {Object} options.rjx - Valid RJX JSON \r\n * @param {Object} options.props - Props to test comparison values against, usually Object.assign(rjx.props,rjx.asyncprops,rjx.thisprops,rjx.windowprops) \r\n * @returns {Boolean} returns true if all comparisons are true or if using or comparisons, at least one condition is true\r\n * @example\r\n const sampleRJX = {\r\n component: 'div',\r\n props: {\r\n id: 'generatedRJX',\r\n className: 'rjx',\r\n bigNum: 1430931039,\r\n smallNum: 0.425,\r\n falsey: false,\r\n truthy: true,\r\n },\r\n children: 'some div',\r\n};\r\nconst testRJX = Object.assign({}, sampleRJX, {\r\n comparisonprops: [{\r\n left: ['truthy',],\r\n operation:'==',\r\n right:['falsey',],\r\n }],\r\n});\r\ndisplayComponent({ rjx: testRJX, props: testRJX2.props, }) // => false\r\n */\r\nexport function displayComponent(options = {}) {\r\n const { rjx = {}, props, } = options;\r\n const propsToCompare = rjx.comparisonprops;\r\n const comparisons = Array.isArray(propsToCompare) ? propsToCompare.map(comp => {\r\n const compares = {};\r\n if (Array.isArray(comp.left)) {\r\n compares.left = comp.left;\r\n }\r\n if (Array.isArray(comp.right)) {\r\n compares.right = comp.right;\r\n }\r\n const propcompares = traverse(compares, props||rjx.props);\r\n const opscompares = Object.assign({}, comp, propcompares);\r\n // console.debug({ opscompares, compares, renderedCompProps });\r\n switch (opscompares.operation) {\r\n case 'eq':\r\n case '==':\r\n // return opscompares.left == opscompares.right;\r\n // eslint-disable-next-line\r\n return opscompares.left == opscompares.right;\r\n case 'dneq':\r\n case '!=':\r\n case '!':\r\n // return opscompares.left != opscompares.right;\r\n return opscompares.left !== opscompares.right;\r\n case 'dnseq':\r\n case '!==':\r\n return opscompares.left !== opscompares.right;\r\n case 'seq':\r\n case '===':\r\n return opscompares.left === opscompares.right;\r\n case 'lt':\r\n case '<':\r\n return opscompares.left < opscompares.right;\r\n case 'lte':\r\n case '<=':\r\n return opscompares.left <= opscompares.right;\r\n case 'gt':\r\n case '>':\r\n return opscompares.left > opscompares.right;\r\n case 'gte':\r\n case '>=':\r\n return opscompares.left >= opscompares.right;\r\n case 'dne':\r\n case 'undefined':\r\n case 'null':\r\n return opscompares.left === undefined || opscompares.left === null; \r\n case '!null':\r\n case '!undefined':\r\n case 'exists':\r\n default://'exists'\r\n return opscompares.left !== undefined && opscompares.left !== null;\r\n }\r\n // }\r\n // if (opscompares.operation === 'eq') {\r\n // // return opscompares.left == opscompares.right;\r\n // // eslint-disable-next-line\r\n // return opscompares.left == opscompares.right;\r\n // } else if (opscompares.operation === 'dneq') {\r\n // // return opscompares.left != opscompares.right;\r\n // return opscompares.left !== opscompares.right;\r\n // } else if (opscompares.operation === 'dnseq') {\r\n // return opscompares.left !== opscompares.right;\r\n // } else if (opscompares.operation === 'seq') {\r\n // return opscompares.left === opscompares.right;\r\n // } else if (opscompares.operation === 'lt') {\r\n // return opscompares.left < opscompares.right;\r\n // } else if (opscompares.operation === 'lte') {\r\n // return opscompares.left <= opscompares.right;\r\n // } else if (opscompares.operation === 'gt') {\r\n // return opscompares.left > opscompares.right;\r\n // } else if (opscompares.operation === 'gte') {\r\n // return opscompares.left >= opscompares.right;\r\n // } else if (opscompares.operation === 'dne') {\r\n // return opscompares.left === undefined || opscompares.left === null;\r\n // } else { //'exists'\r\n // return opscompares.left !== undefined && opscompares.left !== null;\r\n // }\r\n }) : [];\r\n const validProps = comparisons.filter(comp => comp === true);\r\n if (!rjx.comparisonprops) {\r\n return true;\r\n } else if (rjx.comparisonorprops && validProps.length < 1) {\r\n return false;\r\n } else if (validProps.length !== comparisons.length && !rjx.comparisonorprops) {\r\n return false;\r\n } else {\r\n return true;\r\n }\r\n}\r\n\r\n/**\r\n * Use to test if can bind components this context for react-redux-router \r\n * @returns {Boolean} true if browser is not IE or old android / chrome\r\n */\r\nexport function getAdvancedBinding() {\r\n \r\n if (typeof window === 'undefined') {\r\n var window = (this && this.window)\r\n ? this.window\r\n : global.window || {};\r\n if (!window.navigator) return false;\r\n }\r\n try {\r\n if (window && window.navigator && window.navigator.userAgent && typeof window.navigator.userAgent === 'string') {\r\n // console.log('window.navigator.userAgent',window.navigator.userAgent)\r\n if(window.navigator.userAgent.indexOf('Trident') !== -1) {\r\n return false;\r\n }\r\n const uastring = window.navigator.userAgent;\r\n const parser = new UAParser();\r\n parser.setUA(uastring);\r\n const parseUserAgent = parser.getResult();\r\n // console.log({ parseUserAgent, });\r\n if ((parseUserAgent.browser.name === 'Chrome' || parseUserAgent.browser.name === 'Chrome WebView' ) && parseUserAgent.os.name === 'Android' && parseInt(parseUserAgent.browser.version, 10) < 50) {\r\n return false;\r\n }\r\n if (parseUserAgent.browser.name === 'Android Browser') {\r\n return false;\r\n }\r\n }\r\n } catch (e) {\r\n e;\r\n console.error(e);\r\n // console.warn('could not detect browser support', e);\r\n return false;\r\n }\r\n return true;\r\n}\r\n\r\n/**\r\n * take an object of array paths to traverse and resolve\r\n * @example\r\n * const testObj = {\r\n user: {\r\n name: 'rjx',\r\n description: 'react withouth javascript',\r\n },\r\n stats: {\r\n logins: 102,\r\n comments: 3,\r\n },\r\n authentication: 'OAuth2',\r\n };\r\nconst testVals = { auth: ['authentication', ], username: ['user', 'name', ], };\r\n\r\n traverse(testVals, testObj) // =>{ auth:'OAuth2', username:'rjx', }\r\n * @param {Object} paths - an object to resolve array property paths \r\n * @param {Object} data - object to traverse\r\n * @returns {Object} resolved object with traversed properties\r\n * @throws {TypeError} \r\n */\r\nexport function traverse(paths = {}, data = {}) {\r\n let keys = Object.keys(paths);\r\n if (!keys.length) return paths;\r\n return keys.reduce((result, key) => {\r\n if (typeof paths[key] === 'string') result[key] = data[paths[key]];\r\n else if (Array.isArray(paths[key])) {\r\n let _path = Object.assign([], paths[key]);\r\n let value = data;\r\n while (_path.length && value && typeof value === 'object') {\r\n let prop = _path.shift();\r\n value = value[prop];\r\n }\r\n result[key] = (_path.length) ? undefined : value;\r\n } else throw new TypeError('dynamic property paths must be a string or an array of strings or numeric indexes');\r\n return result;\r\n }, {});\r\n}\r\n\r\n/**\r\n * Validates RJX JSON Syntax\r\n * @example\r\n * validateRJX({component:'p',children:'hello world'})=>true\r\n * validateRJX({children:'hello world'})=>throw SyntaxError('[0001] Missing React Component')\r\n * @param {Object} rjx - RJX JSON to validate \r\n * @param {Boolean} [returnAllErrors=false] - flag to either throw error or to return all errors in an array of errors\r\n * @returns {Boolean|Error[]} either returns true if RJX is valid, or throws validation error or returns list of errors in array\r\n * @throws {SyntaxError|TypeError|ReferenceError}\r\n */\r\nexport function validateRJX(rjx = {}, returnAllErrors = false) {\r\n const dynamicPropsNames = ['asyncprops', 'resourceprops', 'windowprops', 'thisprops', 'thisstate',];\r\n const evalPropNames = ['__dangerouslyEvalProps', '__dangerouslyBindEvalProps',];\r\n const validKeys = ['component', 'props', 'children', '__spreadComponent', '__inline','__functionargs', '__dangerouslyInsertComponents', '__dangerouslyInsertComponentProps', '__dangerouslyInsertRJXComponents', '__functionProps', '__functionparams', '__windowComponents', '__windowComponentProps', 'comparisonprops', 'comparisonorprops', 'passprops', 'debug' ].concat(dynamicPropsNames, evalPropNames);\r\n let errors = [];\r\n if (!rjx.component) {\r\n errors.push(SyntaxError('[0001] Missing React Component'));\r\n }\r\n if (rjx.props) {\r\n if (typeof rjx.props !== 'object' || Array.isArray(rjx.props)) {\r\n errors.push(TypeError('[0002] '+rjx.component+': props must be an Object / valid React props'));\r\n }\r\n if (rjx.props.children && (typeof rjx.props.children !== 'string' || !Array.isArray(rjx.props.children))) {\r\n errors.push(TypeError('[0003] '+rjx.component+': props.children must be an array of RJX JSON objects or a string'));\r\n }\r\n if (rjx.props._children && (typeof rjx.props._children !== 'string' || !Array.isArray(rjx.props._children))) {\r\n errors.push(TypeError('[0004] '+rjx.component+': props._children must be an array of RJX JSON objects or a string'));\r\n }\r\n }\r\n if (rjx.children) {\r\n if (typeof rjx.children !== 'string' && !Array.isArray(rjx.children)) {\r\n errors.push(TypeError('[0005] '+rjx.component+': children must be an array of RJX JSON objects or a string'));\r\n }\r\n if (Array.isArray(rjx.children)) {\r\n const childrenErrors = rjx.children\r\n .filter(c => typeof c === 'object')\r\n .map(c => validateRJX(c, returnAllErrors));\r\n errors = errors.concat(...childrenErrors);\r\n }\r\n }\r\n dynamicPropsNames.forEach(dynamicprop => {\r\n const rjxDynamicProps = rjx[ dynamicprop ];\r\n if (rjxDynamicProps) {\r\n // if (dynamicprop === 'thisprops') {\r\n // console.log({ dynamicprop, rjxDynamicProps });\r\n // }\r\n if (typeof rjxDynamicProps !== 'object') {\r\n errors.push(TypeError(`[0006] ${dynamicprop} must be an object`));\r\n }\r\n Object.keys(rjxDynamicProps).forEach(resolvedDynamicProp => {\r\n if (!Array.isArray(rjxDynamicProps[ resolvedDynamicProp ])) {\r\n errors.push(TypeError(`[0007] rjx.${dynamicprop}.${resolvedDynamicProp} must be an array of strings`));\r\n }\r\n if (Array.isArray(rjxDynamicProps[resolvedDynamicProp])) {\r\n const allStringArray = rjxDynamicProps[resolvedDynamicProp].filter(propArrayItem => typeof propArrayItem === 'string');\r\n \r\n if (allStringArray.length !== rjxDynamicProps[ resolvedDynamicProp ].length) {\r\n errors.push(TypeError(`[0008] rjx.${dynamicprop}.${resolvedDynamicProp} must be an array of strings`));\r\n }\r\n }\r\n });\r\n }\r\n });\r\n const evalProps = rjx.__dangerouslyEvalProps;\r\n const boundEvalProps = rjx.__dangerouslyBindEvalProps;\r\n if (evalProps || boundEvalProps) {\r\n if ((evalProps && typeof evalProps !== 'object') || (boundEvalProps && typeof boundEvalProps !== 'object')) {\r\n errors.push(TypeError('[0009] __dangerouslyEvalProps must be an object of strings to convert to valid javascript'));\r\n }\r\n evalPropNames\r\n .filter(evalProp => rjx[ evalProp ])\r\n .forEach(eProps => {\r\n const evProp = rjx[ eProps ];\r\n const scopedEval = eval; \r\n Object.keys(evProp).forEach(propToEval => {\r\n if (typeof evProp[ propToEval ] !== 'string') {\r\n errors.push(TypeError(`[0010] rjx.${eProps}.${evProp} must be a string`));\r\n }\r\n try {\r\n // console.log({ eProps });\r\n if (eProps === '__dangerouslyBindEvalProps') {\r\n const funcToBind = scopedEval(`(${evProp[ propToEval ]})`);\r\n funcToBind.call({ bounded: true, });\r\n } else {\r\n scopedEval(evProp[ propToEval ]);\r\n }\r\n } catch (e) {\r\n errors.push(e);\r\n }\r\n });\r\n });\r\n }\r\n if (rjx.__dangerouslyInsertComponents) {\r\n Object.keys(rjx.__dangerouslyInsertComponents).forEach(insertedComponents => {\r\n try {\r\n validateRJX(rjx.__dangerouslyInsertComponents[ insertedComponents ]);\r\n } catch (e) {\r\n errors.push(TypeError(`[0011] rjx.__dangerouslyInsertComponents.${insertedComponents} must be a valid RJX JSON Object: ${e.toString()}`));\r\n }\r\n });\r\n }\r\n if (rjx.__functionProps) {\r\n if (typeof rjx.__functionProps !== 'object') {\r\n errors.push(TypeError('[0012] rjx.__functionProps must be an object'));\r\n } else {\r\n \r\n Object.keys(rjx.__functionProps)\r\n .forEach(fProp => {\r\n if (rjx.__functionProps[fProp] &&( typeof rjx.__functionProps[fProp] !=='string' || rjx.__functionProps[fProp].indexOf('func:') === -1)) {\r\n errors.push(ReferenceError(`[0013] rjx.__functionProps.${fProp} must reference a function (i.e. func:this.props.logoutUser())`));\r\n }\r\n });\r\n }\r\n }\r\n if (rjx.__windowComponentProps && (typeof rjx.__windowComponentProps !=='object' || Array.isArray(rjx.__windowComponentProps))) {\r\n errors.push(TypeError('[0013] rjx.__windowComponentProps must be an object'));\r\n }\r\n if (rjx.__windowComponents) {\r\n if (typeof rjx.__windowComponents !== 'object') {\r\n errors.push(TypeError('[0014] rjx.__windowComponents must be an object'));\r\n }\r\n Object.keys(rjx.__windowComponents)\r\n .forEach(cProp => {\r\n if (typeof rjx.__windowComponents[cProp]!=='string'||rjx.__windowComponents[cProp].indexOf('func:') === -1) {\r\n errors.push(ReferenceError(`[0015] rjx.__windowComponents.${cProp} must reference a window element on window.__rjx_custom_elements (i.e. func:window.__rjx_custom_elements.bootstrapModal)`));\r\n }\r\n });\r\n }\r\n if (typeof rjx.comparisonorprops !== 'undefined' && typeof rjx.comparisonorprops !== 'boolean') {\r\n errors.push(TypeError('[0016] rjx.comparisonorprops must be boolean'));\r\n }\r\n if (rjx.comparisonprops) {\r\n if(!Array.isArray(rjx.comparisonprops)) {\r\n errors.push(TypeError('[0017] rjx.comparisonprops must be an array or comparisons'));\r\n } else {\r\n rjx.comparisonprops.forEach(c => {\r\n if (typeof c !== 'object') {\r\n errors.push(TypeError('[0018] rjx.comparisonprops must be an array or comparisons objects'));\r\n } else if(typeof c.left==='undefined') {\r\n errors.push(TypeError('[0019] rjx.comparisonprops must be have a left comparison value'));\r\n }\r\n });\r\n }\r\n }\r\n if (typeof rjx.passprops !== 'undefined' && typeof rjx.passprops !== 'boolean') {\r\n errors.push(TypeError('[0020] rjx.passprops must be boolean'));\r\n }\r\n const invalidKeys = Object.keys(rjx).filter(key => validKeys.indexOf(key) === -1);\r\n if (errors.length) {\r\n if (returnAllErrors) return errors;\r\n throw errors[ 0 ];\r\n }\r\n return invalidKeys.length\r\n ? `Warning: Invalid Keys [${invalidKeys.join()}]`\r\n : true;\r\n}\r\n\r\n/**\r\n * validates simple RJX Syntax {[component]:{props,children}}\r\n * @param {Object} simpleRJX - Any valid simple RJX Syntax\r\n * @return {Boolean} returns true if simpleRJX is valid\r\n */\r\nexport function validSimpleRJXSyntax(simpleRJX = {}) {\r\n if (Object.keys(simpleRJX).length !== 1 && !simpleRJX.component) {\r\n return false;\r\n } else {\r\n const componentName = Object.keys(simpleRJX)[ 0 ];\r\n return (Object.keys(simpleRJX).length === 1 && !simpleRJX[componentName].component && typeof simpleRJX[componentName]==='object')\r\n ? true\r\n : false; \r\n }\r\n}\r\n\r\n/**\r\n * Transforms SimpleRJX to Valid RJX JSON {[component]:{props,children}} => {component,props,children}\r\n * @param {Object} simpleRJX JSON Object \r\n * @return {Object} - returns a valid RJX JSON Object from a simple RJX JSON Object\r\n */\r\nexport function simpleRJXSyntax(simpleRJX = {}) {\r\n const component = Object.keys(simpleRJX)[ 0 ];\r\n try {\r\n return Object.assign({},\r\n {\r\n component,\r\n },\r\n simpleRJX[ component ], {\r\n children: (simpleRJX[ component ].children && Array.isArray(simpleRJX[ component ].children))\r\n ? simpleRJX[ component ].children\r\n .map(simpleRJXSyntax)\r\n : simpleRJX[ component ].children,\r\n });\r\n } catch (e) {\r\n throw SyntaxError('Invalid Simple RXJ Syntax', e);\r\n } \r\n}\r\n\r\n/**\r\n * Transforms Valid RJX JSON to SimpleRJX {component,props,children} => {[component]:{props,children}}\r\n * @param {Object} rjx Valid RJX JSON object \r\n * @return {Object} - returns a simple RJX JSON Object from a valid RJX JSON Object \r\n */\r\nexport function getSimplifiedRJX(rjx = {}) {\r\n try {\r\n if (!rjx.component) return rjx; //already simple\r\n const componentName = rjx.component;\r\n rjx.children = (Array.isArray(rjx.children))\r\n ? rjx.children\r\n .filter(child => child)//remove empty children\r\n .map(getSimplifiedRJX) \r\n : rjx.children;\r\n delete rjx.component;\r\n return {\r\n [ componentName ]: rjx,\r\n };\r\n } catch (e) {\r\n throw e;\r\n }\r\n}",
"static": true,
"longname": "/Users/yawjosephetse/Developer/github/repetere/rjx/src/utils.js",
"access": "public",
"description": null,
"lineNumber": 1
},
{
"__docId__": 104,
"kind": "function",
"name": "displayComponent",
"memberof": "src/utils.js",
"generator": false,
"async": false,
"static": true,
"longname": "src/utils.js~displayComponent",
"access": "public",
"export": true,
"importPath": "rjx/src/utils.js",
"importStyle": "{displayComponent}",
"description": "Used to evaluate whether or not to render a component",
"examples": [
"const sampleRJX = {\ncomponent: 'div',\nprops: {\nid: 'generatedRJX',\nclassName: 'rjx',\nbigNum: 1430931039,\nsmallNum: 0.425,\nfalsey: false,\ntruthy: true,\n},\nchildren: 'some div',\n};\nconst testRJX = Object.assign({}, sampleRJX, {\ncomparisonprops: [{\nleft: ['truthy',],\noperation:'==',\nright:['falsey',],\n}],\n});\ndisplayComponent({ rjx: testRJX, props: testRJX2.props, }) // => false"
],
"lineNumber": 32,
"unknown": [
{
"tagName": "@returns",
"tagValue": "{Boolean} returns true if all comparisons are true or if using or comparisons, at least one condition is true"
}
],
"params": [
{
"nullable": null,
"types": [
"Object"
],
"spread": false,
"optional": false,
"name": "options",
"description": ""
},
{
"nullable": null,
"types": [
"Object"
],
"spread": false,
"optional": false,
"name": "options.rjx",
"description": "Valid RJX JSON"
},
{
"nullable": null,
"types": [
"Object"
],
"spread": false,
"optional": false,
"name": "options.props",
"description": "Props to test comparison values against, usually Object.assign(rjx.props,rjx.asyncprops,rjx.thisprops,rjx.windowprops)"
}
],
"return": {
"nullable": null,
"types": [
"Boolean"
],
"spread": false,
"description": "returns true if all comparisons are true or if using or comparisons, at least one condition is true"
}
},
{
"__docId__": 105,
"kind": "function",
"name": "getAdvancedBinding",
"memberof": "src/utils.js",
"generator": false,
"async": false,
"static": true,
"longname": "src/utils.js~getAdvancedBinding",
"access": "public",
"export": true,
"importPath": "rjx/src/utils.js",
"importStyle": "{getAdvancedBinding}",
"description": "Use to test if can bind components this context for react-redux-router ",
"lineNumber": 127,
"unknown": [
{
"tagName": "@returns",
"tagValue": "{Boolean} true if browser is not IE or old android / chrome"
}
],
"return": {
"nullable": null,
"types": [
"Boolean"
],
"spread": false,
"description": "true if browser is not IE or old android / chrome"
}
},
{
"__docId__": 106,
"kind": "function",
"name": "traverse",
"memberof": "src/utils.js",
"generator": false,
"async": false,
"static": true,
"longname": "src/utils.js~traverse",
"access": "public",
"export": true,
"importPath": "rjx/src/utils.js",
"importStyle": "{traverse}",
"description": "take an object of array paths to traverse and resolve",
"examples": [
"const testObj = {\nuser: {\nname: 'rjx',\ndescription: 'react withouth javascript',\n},\nstats: {\nlogins: 102,\ncomments: 3,\n},\nauthentication: 'OAuth2',\n};\nconst testVals = { auth: ['authentication', ], username: ['user', 'name', ], };\n\ntraverse(testVals, testObj) // =>{ auth:'OAuth2', username:'rjx', }"
],
"lineNumber": 184,
"unknown": [
{
"tagName": "@returns",
"tagValue": "{Object} resolved object with traversed properties"
}
],
"params": [
{
"nullable": null,
"types": [
"Object"
],
"spread": false,
"optional": false,
"name": "paths",
"description": "an object to resolve array property paths"
},
{
"nullable": null,
"types": [
"Object"
],
"spread": false,
"optional": false,
"name": "data",
"description": "object to traverse"
}
],
"return": {
"nullable": null,
"types": [
"Object"
],
"spread": false,
"description": "resolved object with traversed properties"
},
"throws": [
{
"types": [
"TypeError"
],
"description": ""
}
]
},
{
"__docId__": 107,
"kind": "function",
"name": "validateRJX",
"memberof": "src/utils.js",
"generator": false,
"async": false,
"static": true,
"longname": "src/utils.js~validateRJX",
"access": "public",
"export": true,
"importPath": "rjx/src/utils.js",
"importStyle": "{validateRJX}",
"description": "Validates RJX JSON Syntax",
"examples": [
"validateRJX({component:'p',children:'hello world'})=>true\nvalidateRJX({children:'hello world'})=>throw SyntaxError('[0001] Missing React Component')"
],
"lineNumber": 212,
"unknown": [
{
"tagName": "@returns",
"tagValue": "{Boolean|Error[]} either returns true if RJX is valid, or throws validation error or returns list of errors in array"
}
],
"params": [
{
"nullable": null,
"types": [
"Object"
],
"spread": false,
"optional": false,
"name": "rjx",
"description": "RJX JSON to validate"
},
{
"nullable": null,
"types": [
"Boolean"
],
"spread": false,
"optional": true,
"defaultValue": "false",
"defaultRaw": false,
"name": "returnAllErrors",
"description": "flag to either throw error or to return all errors in an array of errors"
}
],
"return": {
"nullable": null,
"types": [
"Boolean",
"Error[]"
],
"spread": false,
"description": "either returns true if RJX is valid, or throws validation error or returns list of errors in array"
},
"throws": [
{
"types": [
"SyntaxError",
"TypeError",
"ReferenceError"
],
"description": ""
}
]
},
{
"__docId__": 108,
"kind": "function",
"name": "validSimpleRJXSyntax",
"memberof": "src/utils.js",
"generator": false,
"async": false,
"static": true,
"longname": "src/utils.js~validSimpleRJXSyntax",
"access": "public",
"export": true,
"importPath": "rjx/src/utils.js",
"importStyle": "{validSimpleRJXSyntax}",
"description": "validates simple RJX Syntax {[component]:{props,children}}",
"lineNumber": 364,
"params": [
{
"nullable": null,
"types": [
"Object"
],
"spread": false,
"optional": false,
"name": "simpleRJX",
"description": "Any valid simple RJX Syntax"
}
],
"return": {
"nullable": null,
"types": [
"Boolean"
],
"spread": false,
"description": "returns true if simpleRJX is valid"
}
},
{
"__docId__": 109,
"kind": "function",
"name": "simpleRJXSyntax",
"memberof": "src/utils.js",
"generator": false,
"async": false,
"static": true,
"longname": "src/utils.js~simpleRJXSyntax",
"access": "public",
"export": true,
"importPath": "rjx/src/utils.js",
"importStyle": "{simpleRJXSyntax}",
"description": "Transforms SimpleRJX to Valid RJX JSON {[component]:{props,children}} => {component,props,children}",
"lineNumber": 380,
"params": [
{
"nullable": null,
"types": [
"Object"
],
"spread": false,
"optional": false,
"name": "simpleRJX",
"description": "JSON Object"
}
],
"return": {
"nullable": null,
"types": [
"Object"
],
"spread": false,
"description": "returns a valid RJX JSON Object from a simple RJX JSON Object"
}
},
{
"__docId__": 110,
"kind": "function",
"name": "getSimplifiedRJX",
"memberof": "src/utils.js",
"generator": false,
"async": false,
"static": true,
"longname": "src/utils.js~getSimplifiedRJX",
"access": "public",
"export": true,
"importPath": "rjx/src/utils.js",
"importStyle": "{getSimplifiedRJX}",
"description": "Transforms Valid RJX JSON to SimpleRJX {component,props,children} => {[component]:{props,children}}",
"lineNumber": 403,
"params": [
{
"nullable": null,
"types": [
"Object"
],
"spread": false,
"optional": false,
"name": "rjx",
"description": "Valid RJX JSON object"
}
],
"return": {
"nullable": null,
"types": [
"Object"
],
"spread": false,
"description": "returns a simple RJX JSON Object from a valid RJX JSON Object"
}
},
{
"kind": "index",
"content": "# React JSON Syntax (RJX)\n\n[](https://coveralls.io/github/repetere/rjx?branch=master) [](https://travis-ci.org/repetere/rjx)\n\n## Description\n\n**React JSON Syntax (RJX)** takes a RXJ JSON object and can create (Suspense, Lazy, Functional and Class) React Components, output HTML and JSX and render React components without transpilers. **RJX** lets you get up and running with React without extra configuration management of more complicated tool chains.\n\n\n## Installation\n\n```sh\n$ npm i rjx\n```\n\n### [Full Documentation](https://repetere.github.io/rjx/)\n\n### Examples ( [HTML/Browser Example](https://github.com/repetere/rjx/blob/master/dist/example.html) ) \n\n```javascript\nimport { default as rjx } from 'rjx';\nconst exampleRJX = {\n component:'p',\n props:{style:{color:'blue'}},\n children:'hello world'\n};\n//Rendering React Components\nrjx.getReactElement(exampleRJX);\n// => JSX Equivalent: hello world
\n\nconst exampleToHTMLandJSX = {\n component: 'div',\n props:{ className:'rjx-generated', },\n children:[\n { \n component:'p',\n props:{ style:{ color:'red', }, },\n children:'hello world',\n }\n ]\n};\n//Generating HTML strings\nrjx.outputHTML({ rjx: exampleToHTMLandJSX, });\n// => ''\n//Generating JSX strings\nrjx.outputJSX({ rjx: exampleToHTMLandJSX, });\n// => ''\n\n//Rendering HTML Dom with React\nrjx.rjxRender({ rjx: { component: 'div', props:{className:'rjx-generated',children:[{ component:'p',props:{style:{color:'red'}}, children:'hello world' }]}}, querySelector:'#myApp', });\n// \n// \n// \n// \n```\n\n### RJX JSON Spec\n\nRXJ JSON is valid JSON that more or less mimics JSX in JSON notation with a couple of special properties. The properties for RXJ JSON are the arguments passed to [React.createElement](https://reactjs.org/docs/react-api.html#createelement). The only required property is the component (which is passed as the `type` argument)\n\n```javascript\nReact.createElement(\n type,\n [props],\n [...children]\n)\n```\n\nYou can pass React component libraries for additional components, or you own custom components (see Advanced, also see Full Spec).\n\n```javascript\n//sample RJX\n{\n component:'ul',\n props:{\n className:'list-class',\n },\n children:[\n {\n component:'li',\n children:'first bullet'\n },\n {\n component:'li',\n children:'second bullet',\n }\n ]\n}\n\n```\n\n```JSX\n// Equivalent JSX\n\n - first bullet
\n - second bullet
\n
\n```\n\n#### Validating RJX JSON\n\n```javascript \nimport * as rjx from 'rjx';\n\n//use the built in RJX Validator\nconst valid_rjx_json = {\n component:'p',\n props:{\n className:'title',\n },\n children:'hello world'\n};\nconst invalid_rjx_json = {\n props:{\n className:'title',\n },\n children:'hello world'\n};\nconst multiple_invalid_rjx_json = {\n props:'must be obj',\n children:'hello world'\n};\n\nrjx._rjxUtils.validateRJX(testRJXJSON) // => true\nrjx._rjxUtils.validateRJX(invalid_rjx_json) // => throws SyntaxError('[0001] Missing React Component')\nrjx._rjxUtils.validateRJX(multiple_invalid_rjx_json, true) // =>\n// [ [Error: [0001] Missing React Component],[ Error: [0002] props must be an Object / valid React props] ]\n\n/**\n * @param {Object} rjx - RJX JSON to validate \n * @param {Boolean} [returnAllErrors=false] - flag to either throw error or to return all errors in an array of errors\n * /\nfunction validateRJX(rjx = {}, returnAllErrors= false);\n```\n\n### Simple RJX Syntax\n\nIf you want to save time, you can use the property name as the component and define properties for a cleaner simple syntax\n\n```javascript\n//shorthand simple rjx\n{\n ul: {\n props:{\n className:'list-class',\n },\n children:[\n {\n li: {\n children:'first bullet',\n },\n },\n {\n li: {\n children:'second bullet',\n },\n }\n ]\n }\n}\n```\n\n### RJX Module\n\n```javascript\n\"rjx\" : {\n getReactElement: [Function: getReactElement], {aliases:[getRenderedJSON,getReactElementFromRJX]} //Use React.createElement and RJX JSON to create React elements\n getReactElementFromJSON: [Function: getReactElementFromJSON], // Use compiledJSON object {type,props,children} to create React elements\n rjxRender: [Function: getRenderedJSON], //Use RJX without any configuration to render RJX JSON to HTML and insert RJX into querySelector using ReactDOM.render\n outputHTML: [Function: outputHTML], //Use ReactDOMServer.renderToString to render html from RJX\n outputJSX: [Function: outputJSX], //Generate valid JSX from RJX\n outputJSON: [Function: outputJSON], //Generate computed static values from RJX into JSON\n compile: [Function: compile], //Generate React Function Component from RJX\n\n jsonToJSX: [Function: jsonToJSX], //Converts JSON to JSX\n __express: [Function: __express], //render express views with RJX\n __getReact: [Function: __getReact], //Expose reference to React\n __getReactDOM: [Function: __getReactDOM], //Expose reference to ReactDOM\n __getUseGlobalHook: [Function: __getUseGlobalHook], //Expose reference to useGlobalHook\n\n\n_rjxChildren: {\n getChildrenProperty: [Function: getChildrenProperty], // returns a valid rjx.children property\n getChildrenProps: [Function: getChildrenProps], // Used to pass properties down to child components if passprops is set to true\n getRJXChildren: [Function: getRJXChildren], // returns React Child Elements via RJX\n },\n _rjxComponents: {\n componentMap: {}, // object of all react components available for RJX\n getBoundedComponents: [Function: getBoundedComponents], // getBoundedComponents returns reactComponents with certain elements that have this bounded to select components in the boundedComponents list\n getComponentFromLibrary: [Function: getComponentFromLibrary], // returns a react component from a component library (like material-ui, or semantic-ui)\n getComponentFromMap: [Function: getComponentFromMap], // returns a react element from rjx.component\n getReactClassComponent: [Function: getReactClassComponent], // returns a react class component and support lifecycle functions, lazy and suspense components\n getReactFunctionComponent: [Function: getReactFunctionComponent], // returns a react function component and support lifecycle functions, hooks, lazy and suspense components\n },\n _rjxProps: {\n getRJXProps: [Function: getRJXProps], // It uses traverse on a traverseObject to returns a resolved object on propName. So if you're making an ajax call and want to pass properties into a component, you can assign them using asyncprops and reference object properties by an array of property paths\n getEvalProps: [Function: getEvalProps], //Used to evalute javascript and set those variables as props. getEvalProps evaluates __dangerouslyEvalProps and __dangerouslyBindEvalProps properties with eval, this is used when component properties are functions, __dangerouslyBindEvalProps is used when those functions require that this is bound to the function. For __dangerouslyBindEvalProps it must resolve an expression, so functions should be wrapped in (). I.e. (function f(x){ return this.minimum+x;})\n getComponentProps: [Function: getComponentProps], // Resolves rjx.__dangerouslyInsertComponents into an object that turns each value into a React components. This is typically used in a library like Recharts where you pass custom components for chart ticks or plot points.\n getReactComponentProps: [Function: getReactComponentProps], // Resolves rjx.__dangerouslyInsertReactComponents into an object that turns each value into a the React component from reactComponents, componentLibraries or ReactDOM.\n getFunctionFromProps: [Function: getFunctionFromProps], // Takes a function string and returns a function on either this.props or window.\n getFunctionProps: [Function: getFunctionProps], // Returns a resolved object from function strings that has functions pulled from rjx.__functionProps\n getWindowComponents: [Function: getWindowComponents], // Returns a resolved object that has React Components pulled from window.__rjx_custom_elements\n getComputedProps: [Function: getComputedProps], // Returns computed properties for React Components and any property that's prefixed with __ is a computedProperty\n },\n _rjxUtils: {\n validateRJX: [Function: validateRJX], //Validates RJX JSON Syntax\n displayComponent: [Function displayComponent], // Used to evaluate whether or not to render a component\n traverse: [Function traverse], //take an object of array paths to traverse and resolve\n getAdvancedBinding: [Function: getAdvancedBinding], // Use to test if can bind components this context for react-redux-router\n },\n}\n```\n\n### Full RJX Spec\n```javascript\nrjx = {\n //standard properties\n component:String, // Any React DOM element, or custom component div,p, Boomer.Hero, MaterialUI.Button, myCustomComponent (can also use the property 'type' instead of 'component')\n props:Object, // Standard React component properties\n children:Array|String, // Any String or Array of valid RJX JSON objects\n\n\n //dynamic properties\n resourceprops:Object, // An object from async resources to merge onto rjx.props once fully resolved\n asyncprops:Object, // An object from async resources to merge onto rjx.props once fully resolved (alias for resourceprops)\n thisprops:Object, // An object to merge onto rjx.props from properties already bound to this.props\n windowprops:Object, // An object to merge onto rjx.props from the window object\n\n\n //evaluated properties\n __dangerouslyEvalProps:Object, // An object of evaluated JavaScript strings, used as inline functions onto rjx.props, if the prop is a function it will be called bound to 'this' and the returned value will be assigned\n __dangerouslyBindEvalProps:Object, // An object of evaluated JavaScript functions that are bound to this, used as inline functions onto rjx.props\n //computed properties\n __functionProps:Object, // An object of parsed function strings(func:this.props.onClick, func:window.localStorage.getItem),merged onto rjx.props\n __dangerouslyInsertComponents:Object, // An object that turns each RXJ JSON value into a React components. This is typically used in a library like Recharts where you pass custom components for chart ticks or plot points.\n __dangerouslyInsertReactComponents:Object, // An object that returns the react element from either ReactDOM, reactComponents or componentLibraries.\n __spreadComponent:Object, // A RJX element that is mapped on any array prop called __spread\n __windowComponents:Object, // An object of components merged onto rjx.props from window.__rjx_custom_elements\n __windowComponentProps:Object,\n\n\n //display properties\n comparisonprops:[Object], // An array of Objects used to conditionally display the current rjx.component\n //flag properties\n passprops:Boolean, // A flag to pass parent properties to children RJX objects (except for the style property)\n comparisonorprops:Boolean, // A flag to use an or condition instead of and conditions between comparisions\n}\n```\n\n#### Advanced - Using Custom Components & UI Libraries\n\nIf you plan on using an entire UI library, then bind the library to this before using RJX.\n\n```javascript\nimport * as rjx from 'rjx';\nimport { * as Semantic } from 'semantic-ui-react';\n\nconst getReactElement = rjx.getReactElement.bind({\n componentLibraries:{\n Semantic,\n }\n});\n\nconst myRJX = {\n component:'Semantic.Container',\n children:[\n {\n component:'Semantic.Header',\n props:{\n as:'h1',\n },\n children:'Hello World!',\n },\n {\n component:'Semantic.Button',\n props:{\n content:'Discover docs',\n href:'http://react.semantic-ui.com',\n icon:'github',\n labelPosition:'left',\n }\n }\n ]\n}\n\nconst myReactElements = getReactElement(myRJX);\n```\n\n\n#### Advanced - Using New & Custom Components\n\nIf you're only adding single components or using your own components you can add them to RJX's component my individually.\n\n```javascript\nimport React from 'react';\nimport * as rjx from 'rjx';\nimport { Header } from 'semantic-ui-react';\n\nclass MyButton extends React.Component {\n render() {\n return {this.props.children}\n }\n}\n\n\nconst getReactElement = rjx.getReactElement.bind({\n reactComponents:{\n Header,\n MyButton,\n }\n});\n\nconst myRJX = {\n component:'div',\n children:[\n {\n component:'Header',\n props:{\n as:'h1',\n },\n children:'Hello World!',\n },\n {\n component:'MyButton',\n props:{\n title:'Discover docs',\n href:'http://react.semantic-ui.com',\n },\n __dangerouslyEvalProps:{\n onClick:'()=>alert(\"click works\")'\n },\n children:'click me',\n }\n ]\n}\n\nconst myReactElements = getReactElement(myRJX);\n```\n\n#### Advanced - Special properties\n\n##### resourceprops (asyncprops) / thisprops / windowprops\n\nThe only different between resourceprops (asyncprops), thisprops and windowprops are the source of the transverse Object.\n\nResourceprops transverse an object that is manually passed (usually as a result of an asynchronous fetch all - hence the name asyncpropc).\n\nThisprops transverse anything bound to `this.props`, a good example would be if you're storing and passing a user object on `this.props.user`, pulling the username would be where you would use thisprops.\n\nWindowprops transverse anything on the global window object, like the current page location `window.location.href`.\n\nDynamic props are transversed by passing an array to the property value you want, so for a window's location (`window.location.href`) the property value is accessed by an array to the href `['location','href']` where you omit the transverse object from the array path.\n\n```javascript\nconst traverseObject = {\n user: {\n name: 'rjx',\n description: 'react without javascript',\n },\n stats: {\n logins: 102,\n comments: 3,\n },\n authentication: 'OAuth2',\n};\nconst testRJX = {\n component: 'div',\n props: {\n id: 'generatedRJX',\n className:'rjx',\n },\n resourceprops:{\n auth: [ 'authentication', ],\n username: [ 'user', 'name', ],\n },\n children: [\n {\n component: 'p',\n props: {\n style: {\n color: 'red',\n fontWeight:'bold',\n },\n },\n asyncprops:{\n title: ['user','description']\n },\n children:'hello world',\n },\n ],\n};\nconst RJXP = getRJXProps({ rjx: testRJX, traverseObject, });\n// => {\n// auth: 'OAuth2',\n// username: 'rjx'\n// }\n\n//finally resolves:\nconst testRJX = {\n component: 'div',\n props: {\n id: 'generatedRJX',\n className:'rjx',\n auth: 'OAuth2',\n username: 'rjx',\n },\n children: [\n {\n component: 'p',\n props: {\n style: {\n color: 'red',\n fontWeight:'bold',\n },\n title:'react without javascript',\n },\n children:'hello world',\n },\n ],\n};\n```\n\n##### __dangerouslyEvalProps / __dangerouslyBindEvalProps\n\nThe only difference between `__dangerouslyEvalProps` and `__dangerouslyBindEvalProps` is each `__dangerouslyBindEvalProps` has to be a function, because it's returned as the bound instance of the function with `this`.\n\n```javascript\n const testVals = {\n auth: 'true',\n username: '()=>(user={})=>user.name',\n };\n const testRJX = Object.assign({}, sampleRJX, {\n __dangerouslyEvalProps: testVals, __dangerouslyBindEvalProps: {\n email: '(function getUser(user={}){ return this.testBound(); })',\n },\n });\n const RJXP = getEvalProps.call({ testBound: () => 'bounded', }, { rjx: testRJX, });\n const evalutedComputedFunc = RJXP.username({ name: 'bob', });\n const evalutedComputedBoundFunc = RJXP.email({ email:'test@email.domain', });\n // expect(RJXP.auth).to.be.true;\n // expect(evalutedComputedFunc).to.eql('bob');\n // expect(evalutedComputedBoundFunc).to.eql('bounded');\n```\n\n##### __functionProps\n\nFunction props merge onto rjx.props after evaluating each functon string.\n\n```javascript\nconst thisProp = {\n debug: true,\n window: {\n print: () => 'printed',\n localStorage: {\n getItem:()=>'gotItem',\n },\n },\n props: {\n onClick:()=>'clicked',\n reduxRouter: {\n push:()=>'pushed',\n pop:()=>'poped',\n },\n },\n};\nconst rxjTest = {\n component:'div',\n props: {\n name:'test',\n },\n __functionProps: {\n onclick:'func:this.props.onClick',\n printPage: 'func:window.print',\n nav:'func:this.props.reduxRouter.push',\n },\n};\nconst rxjObj = getFunctionProps.call(thisProp, {\n rjx: rxjTest,\n});\nexpect(rxjObj).is.an('object');\nexpect(Object.keys(rxjObj)).to.eql(Object.keys(rxjTest.__functionProps));\nexpect(rxjObj.onclick()).to.eq('clicked');\nexpect(rxjObj.printPage()).to.eql('printed');\nexpect(rxjObj.nav()).to.eql('pushed');\n```\n\n##### comparisionprops\n\nComparison props are used to contionally show components if they're truthy. They compare an array of left and right side values, if they are all true, the component is rendered. If `comparisonorprops:true` then only one condition needs to be true in order to render the component\n\n```javascript\n//and conditions\nrjx={\n comparisonprops: [{\n left: ['bigNum',],\n operation:'lte',\n right:['smallNum',],\n },{\n left: ['smallNum',],\n operation:'<=',\n right:['bigNum',],\n }],\n}\n//or conditions\nrjx={\n comparisonorprops:true,\n comparisonprops: [{\n left: ['truthy',],\n operation:'eq',\n right:['falsey',],\n },{\n left: ['smallNum',],\n operation:'eq',\n right:['smallNum',],\n }],\n}\n\n// All comparison operations\nswitch (opscompares.operation) {\n case 'eq':\n case '==':\n return opscompares.left == opscompares.right;\n case 'dneq':\n case '!=':\n case '!':\n return opscompares.left !== opscompares.right;\n case 'dnseq':\n case '!==':\n return opscompares.left !== opscompares.right;\n case 'seq':\n case '===':\n return opscompares.left === opscompares.right;\n case 'lt':\n case '<':\n return opscompares.left < opscompares.right;\n case 'lte':\n case '<=':\n return opscompares.left <= opscompares.right;\n case 'gt':\n case '>':\n return opscompares.left > opscompares.right;\n case 'gte':\n case '>=':\n return opscompares.left >= opscompares.right;\n case 'dne':\n case 'undefined':\n case 'null':\n return opscompares.left === undefined || opscompares.left === null; \n case '!null':\n case '!undefined':\n case 'exists':\n default://'exists'\n return opscompares.left !== undefined && opscompares.left !== null;\n}\n```\n\n### Advanced - Custom React Components & Lifecycle Functions\n\nYou can also create react components with lifecycle functions using `getReactClassComponent`.\n\nThe only required function is a render function, the body of the function has to be valid rjx.\n\n```javascript\nconst MyCustomComponent = rjx._rjxComponents.getReactClassComponent({\n //\n // Initialization function\n //\n getInitialState:{\n body:'return { status:\"not-loaded\", name:\"rjx test\", customNumber:1, }',\n arguments:[],\n },\n getDefaultProps:{\n body:'return { someProp:1, someOtherProp:2, status:\"original status\" }',\n arguments:[],\n },\n componentDidMount:{\n body:`console.log('mounted', 'this.props',this.props, 'this.state',this.state)`,\n arguments:[],\n },\n componentWillUnmount:{\n body:`console.log('unmounted',this.props)`,\n arguments:[],\n },\n //\n // State change functions\n //\n shouldComponentUpdate:{\n body:'console.log(\"should update component\",{nextProps,nextState}); return true;',\n arguments:['nextProps', 'nextState']\n },\n componentWillUpdate:{\n body:'console.log(\"will update component\",{nextProps,nextState}); return true;',\n arguments:['nextProps', 'nextState']\n },\n componentDidUpdate:{\n body:'console.log(\"did update component\",{prevProps,prevState}); return true;',\n arguments:['prevProps', 'prevState']\n },\n //\n // Prop change functions\n //\n componentWillReceiveProps: {\n body:'console.log(\"will recieve props\",{nextProps}); return true;',\n arguments:['nextProps']\n },\n //\n // RENDER IS THE ONLY ***REQUIRED*** FUNCTION\n //\n render:{\n body:{\n component:'p',\n props:{\n status:'from inline prop'\n },\n passprops:true,\n children:[\n {\n component:'span',\n children: 'My Custom React Component Status: ',\n },\n {\n component:'span',\n thisprops:{\n children:['status']\n }\n }\n ]\n },\n }\n });\nconst sampleRJX = {\n component:'MyCustomComponent',\n props:{\n status:'Amazing',\n }\n};\nconst boundConfig = {\n debug:true, \n reactComponents:{\n MyCustomComponent,\n }\n};\nrjx.rjxRender.call(boundConfig, {\n rjx: sampleRJX, \n querySelector:'#root', });\n```\n\nConsole output after mounting\n```javascript\n[Log] mounted (4)\n\"this.props\"\n{status: \"Amazing\", children: {}, someProp: 1, someOtherProp: 2}\n\"this.state\"\n{status: \"not-loaded\", name: \"rjx test\", customNumber: 1}\n```\n\nCheckout the `dist/example.html` for example usage.\n\n\n### Development\n\nNote *Make sure you have grunt installed*\n\n```sh\n$ npm i -g grunt-cli jsdoc-to-markdown\n```\n\nFor generating documentation\n\n```sh\n$ grunt doc\n$ jsdoc2md src/**/*.js > docs/api.md\n```\n\n### Notes\n\nCheck out [https://repetere.github.io/rjx/](https://repetere.github.io/rjx/) for the full rjx Documentation\n\n### Testing\n\n```sh\n$ npm i\n$ grunt test\n```\n\n### Contributing\n\nFork, write tests and create a pull request!\n\n### Example Browser Usage\n\n```html\n\n\n \n \n RJX TEST\n \n \n \n \n \n \n\n ```\n\n\n\n
![](\"https://raw.githubusercontent.com/repetere/rjx/master/docs/rjx-logo.png\")
\n\n
hello world
\n\nconst exampleToHTMLandJSX = {\n component: 'div',\n props:{ className:'rjx-generated', },\n children:[\n { \n component:'p',\n props:{ style:{ color:'red', }, },\n children:'hello world',\n }\n ]\n};\n//Generating HTML strings\nrjx.outputHTML({ rjx: exampleToHTMLandJSX, });\n// => ''\n//Generating JSX strings\nrjx.outputJSX({ rjx: exampleToHTMLandJSX, });\n// => ''\n\n//Rendering HTML Dom with React\nrjx.rjxRender({ rjx: { component: 'div', props:{className:'rjx-generated',children:[{ component:'p',props:{style:{color:'red'}}, children:'hello world' }]}}, querySelector:'#myApp', });\n// \n// \n// \n// \n```\n\n### RJX JSON Spec\n\nRXJ JSON is valid JSON that more or less mimics JSX in JSON notation with a couple of special properties. The properties for RXJ JSON are the arguments passed to [React.createElement](https://reactjs.org/docs/react-api.html#createelement). The only required property is the component (which is passed as the `type` argument)\n\n```javascript\nReact.createElement(\n type,\n [props],\n [...children]\n)\n```\n\nYou can pass React component libraries for additional components, or you own custom components (see Advanced, also see Full Spec).\n\n```javascript\n//sample RJX\n{\n component:'ul',\n props:{\n className:'list-class',\n },\n children:[\n {\n component:'li',\n children:'first bullet'\n },\n {\n component:'li',\n children:'second bullet',\n }\n ]\n}\n\n```\n\n```JSX\n// Equivalent JSX\n\n - first bullet
\n - second bullet
\n
\n```\n\n#### Validating RJX JSON\n\n```javascript \nimport * as rjx from 'rjx';\n\n//use the built in RJX Validator\nconst valid_rjx_json = {\n component:'p',\n props:{\n className:'title',\n },\n children:'hello world'\n};\nconst invalid_rjx_json = {\n props:{\n className:'title',\n },\n children:'hello world'\n};\nconst multiple_invalid_rjx_json = {\n props:'must be obj',\n children:'hello world'\n};\n\nrjx._rjxUtils.validateRJX(testRJXJSON) // => true\nrjx._rjxUtils.validateRJX(invalid_rjx_json) // => throws SyntaxError('[0001] Missing React Component')\nrjx._rjxUtils.validateRJX(multiple_invalid_rjx_json, true) // =>\n// [ [Error: [0001] Missing React Component],[ Error: [0002] props must be an Object / valid React props] ]\n\n/**\n * @param {Object} rjx - RJX JSON to validate \n * @param {Boolean} [returnAllErrors=false] - flag to either throw error or to return all errors in an array of errors\n * /\nfunction validateRJX(rjx = {}, returnAllErrors= false);\n```\n\n### Simple RJX Syntax\n\nIf you want to save time, you can use the property name as the component and define properties for a cleaner simple syntax\n\n```javascript\n//shorthand simple rjx\n{\n ul: {\n props:{\n className:'list-class',\n },\n children:[\n {\n li: {\n children:'first bullet',\n },\n },\n {\n li: {\n children:'second bullet',\n },\n }\n ]\n }\n}\n```\n\n### RJX Module\n\n```javascript\n\"rjx\" : {\n getReactElement: [Function: getReactElement], {aliases:[getRenderedJSON,getReactElementFromRJX]} //Use React.createElement and RJX JSON to create React elements\n getReactElementFromJSON: [Function: getReactElementFromJSON], // Use compiledJSON object {type,props,children} to create React elements\n rjxRender: [Function: getRenderedJSON], //Use RJX without any configuration to render RJX JSON to HTML and insert RJX into querySelector using ReactDOM.render\n outputHTML: [Function: outputHTML], //Use ReactDOMServer.renderToString to render html from RJX\n outputJSX: [Function: outputJSX], //Generate valid JSX from RJX\n outputJSON: [Function: outputJSON], //Generate computed static values from RJX into JSON\n compile: [Function: compile], //Generate React Function Component from RJX\n\n jsonToJSX: [Function: jsonToJSX], //Converts JSON to JSX\n __express: [Function: __express], //render express views with RJX\n __getReact: [Function: __getReact], //Expose reference to React\n __getReactDOM: [Function: __getReactDOM], //Expose reference to ReactDOM\n __getUseGlobalHook: [Function: __getUseGlobalHook], //Expose reference to useGlobalHook\n\n\n_rjxChildren: {\n getChildrenProperty: [Function: getChildrenProperty], // returns a valid rjx.children property\n getChildrenProps: [Function: getChildrenProps], // Used to pass properties down to child components if passprops is set to true\n getRJXChildren: [Function: getRJXChildren], // returns React Child Elements via RJX\n },\n _rjxComponents: {\n componentMap: {}, // object of all react components available for RJX\n getBoundedComponents: [Function: getBoundedComponents], // getBoundedComponents returns reactComponents with certain elements that have this bounded to select components in the boundedComponents list\n getComponentFromLibrary: [Function: getComponentFromLibrary], // returns a react component from a component library (like material-ui, or semantic-ui)\n getComponentFromMap: [Function: getComponentFromMap], // returns a react element from rjx.component\n getReactClassComponent: [Function: getReactClassComponent], // returns a react class component and support lifecycle functions, lazy and suspense components\n getReactFunctionComponent: [Function: getReactFunctionComponent], // returns a react function component and support lifecycle functions, hooks, lazy and suspense components\n },\n _rjxProps: {\n getRJXProps: [Function: getRJXProps], // It uses traverse on a traverseObject to returns a resolved object on propName. So if you're making an ajax call and want to pass properties into a component, you can assign them using asyncprops and reference object properties by an array of property paths\n getEvalProps: [Function: getEvalProps], //Used to evalute javascript and set those variables as props. getEvalProps evaluates __dangerouslyEvalProps and __dangerouslyBindEvalProps properties with eval, this is used when component properties are functions, __dangerouslyBindEvalProps is used when those functions require that this is bound to the function. For __dangerouslyBindEvalProps it must resolve an expression, so functions should be wrapped in (). I.e. (function f(x){ return this.minimum+x;})\n getComponentProps: [Function: getComponentProps], // Resolves rjx.__dangerouslyInsertComponents into an object that turns each value into a React components. This is typically used in a library like Recharts where you pass custom components for chart ticks or plot points.\n getReactComponentProps: [Function: getReactComponentProps], // Resolves rjx.__dangerouslyInsertReactComponents into an object that turns each value into a the React component from reactComponents, componentLibraries or ReactDOM.\n getFunctionFromProps: [Function: getFunctionFromProps], // Takes a function string and returns a function on either this.props or window.\n getFunctionProps: [Function: getFunctionProps], // Returns a resolved object from function strings that has functions pulled from rjx.__functionProps\n getWindowComponents: [Function: getWindowComponents], // Returns a resolved object that has React Components pulled from window.__rjx_custom_elements\n getComputedProps: [Function: getComputedProps], // Returns computed properties for React Components and any property that's prefixed with __ is a computedProperty\n },\n _rjxUtils: {\n validateRJX: [Function: validateRJX], //Validates RJX JSON Syntax\n displayComponent: [Function displayComponent], // Used to evaluate whether or not to render a component\n traverse: [Function traverse], //take an object of array paths to traverse and resolve\n getAdvancedBinding: [Function: getAdvancedBinding], // Use to test if can bind components this context for react-redux-router\n },\n}\n```\n\n### Full RJX Spec\n```javascript\nrjx = {\n //standard properties\n component:String, // Any React DOM element, or custom component div,p, Boomer.Hero, MaterialUI.Button, myCustomComponent (can also use the property 'type' instead of 'component')\n props:Object, // Standard React component properties\n children:Array|String, // Any String or Array of valid RJX JSON objects\n\n\n //dynamic properties\n resourceprops:Object, // An object from async resources to merge onto rjx.props once fully resolved\n asyncprops:Object, // An object from async resources to merge onto rjx.props once fully resolved (alias for resourceprops)\n thisprops:Object, // An object to merge onto rjx.props from properties already bound to this.props\n windowprops:Object, // An object to merge onto rjx.props from the window object\n\n\n //evaluated properties\n __dangerouslyEvalProps:Object, // An object of evaluated JavaScript strings, used as inline functions onto rjx.props, if the prop is a function it will be called bound to 'this' and the returned value will be assigned\n __dangerouslyBindEvalProps:Object, // An object of evaluated JavaScript functions that are bound to this, used as inline functions onto rjx.props\n //computed properties\n __functionProps:Object, // An object of parsed function strings(func:this.props.onClick, func:window.localStorage.getItem),merged onto rjx.props\n __dangerouslyInsertComponents:Object, // An object that turns each RXJ JSON value into a React components. This is typically used in a library like Recharts where you pass custom components for chart ticks or plot points.\n __dangerouslyInsertReactComponents:Object, // An object that returns the react element from either ReactDOM, reactComponents or componentLibraries.\n __spreadComponent:Object, // A RJX element that is mapped on any array prop called __spread\n __windowComponents:Object, // An object of components merged onto rjx.props from window.__rjx_custom_elements\n __windowComponentProps:Object,\n\n\n //display properties\n comparisonprops:[Object], // An array of Objects used to conditionally display the current rjx.component\n //flag properties\n passprops:Boolean, // A flag to pass parent properties to children RJX objects (except for the style property)\n comparisonorprops:Boolean, // A flag to use an or condition instead of and conditions between comparisions\n}\n```\n\n#### Advanced - Using Custom Components & UI Libraries\n\nIf you plan on using an entire UI library, then bind the library to this before using RJX.\n\n```javascript\nimport * as rjx from 'rjx';\nimport { * as Semantic } from 'semantic-ui-react';\n\nconst getReactElement = rjx.getReactElement.bind({\n componentLibraries:{\n Semantic,\n }\n});\n\nconst myRJX = {\n component:'Semantic.Container',\n children:[\n {\n component:'Semantic.Header',\n props:{\n as:'h1',\n },\n children:'Hello World!',\n },\n {\n component:'Semantic.Button',\n props:{\n content:'Discover docs',\n href:'http://react.semantic-ui.com',\n icon:'github',\n labelPosition:'left',\n }\n }\n ]\n}\n\nconst myReactElements = getReactElement(myRJX);\n```\n\n\n#### Advanced - Using New & Custom Components\n\nIf you're only adding single components or using your own components you can add them to RJX's component my individually.\n\n```javascript\nimport React from 'react';\nimport * as rjx from 'rjx';\nimport { Header } from 'semantic-ui-react';\n\nclass MyButton extends React.Component {\n render() {\n return {this.props.children}\n }\n}\n\n\nconst getReactElement = rjx.getReactElement.bind({\n reactComponents:{\n Header,\n MyButton,\n }\n});\n\nconst myRJX = {\n component:'div',\n children:[\n {\n component:'Header',\n props:{\n as:'h1',\n },\n children:'Hello World!',\n },\n {\n component:'MyButton',\n props:{\n title:'Discover docs',\n href:'http://react.semantic-ui.com',\n },\n __dangerouslyEvalProps:{\n onClick:'()=>alert(\"click works\")'\n },\n children:'click me',\n }\n ]\n}\n\nconst myReactElements = getReactElement(myRJX);\n```\n\n#### Advanced - Special properties\n\n##### resourceprops (asyncprops) / thisprops / windowprops\n\nThe only different between resourceprops (asyncprops), thisprops and windowprops are the source of the transverse Object.\n\nResourceprops transverse an object that is manually passed (usually as a result of an asynchronous fetch all - hence the name asyncpropc).\n\nThisprops transverse anything bound to `this.props`, a good example would be if you're storing and passing a user object on `this.props.user`, pulling the username would be where you would use thisprops.\n\nWindowprops transverse anything on the global window object, like the current page location `window.location.href`.\n\nDynamic props are transversed by passing an array to the property value you want, so for a window's location (`window.location.href`) the property value is accessed by an array to the href `['location','href']` where you omit the transverse object from the array path.\n\n```javascript\nconst traverseObject = {\n user: {\n name: 'rjx',\n description: 'react without javascript',\n },\n stats: {\n logins: 102,\n comments: 3,\n },\n authentication: 'OAuth2',\n};\nconst testRJX = {\n component: 'div',\n props: {\n id: 'generatedRJX',\n className:'rjx',\n },\n resourceprops:{\n auth: [ 'authentication', ],\n username: [ 'user', 'name', ],\n },\n children: [\n {\n component: 'p',\n props: {\n style: {\n color: 'red',\n fontWeight:'bold',\n },\n },\n asyncprops:{\n title: ['user','description']\n },\n children:'hello world',\n },\n ],\n};\nconst RJXP = getRJXProps({ rjx: testRJX, traverseObject, });\n// => {\n// auth: 'OAuth2',\n// username: 'rjx'\n// }\n\n//finally resolves:\nconst testRJX = {\n component: 'div',\n props: {\n id: 'generatedRJX',\n className:'rjx',\n auth: 'OAuth2',\n username: 'rjx',\n },\n children: [\n {\n component: 'p',\n props: {\n style: {\n color: 'red',\n fontWeight:'bold',\n },\n title:'react without javascript',\n },\n children:'hello world',\n },\n ],\n};\n```\n\n##### __dangerouslyEvalProps / __dangerouslyBindEvalProps\n\nThe only difference between `__dangerouslyEvalProps` and `__dangerouslyBindEvalProps` is each `__dangerouslyBindEvalProps` has to be a function, because it's returned as the bound instance of the function with `this`.\n\n```javascript\n const testVals = {\n auth: 'true',\n username: '()=>(user={})=>user.name',\n };\n const testRJX = Object.assign({}, sampleRJX, {\n __dangerouslyEvalProps: testVals, __dangerouslyBindEvalProps: {\n email: '(function getUser(user={}){ return this.testBound(); })',\n },\n });\n const RJXP = getEvalProps.call({ testBound: () => 'bounded', }, { rjx: testRJX, });\n const evalutedComputedFunc = RJXP.username({ name: 'bob', });\n const evalutedComputedBoundFunc = RJXP.email({ email:'test@email.domain', });\n // expect(RJXP.auth).to.be.true;\n // expect(evalutedComputedFunc).to.eql('bob');\n // expect(evalutedComputedBoundFunc).to.eql('bounded');\n```\n\n##### __functionProps\n\nFunction props merge onto rjx.props after evaluating each functon string.\n\n```javascript\nconst thisProp = {\n debug: true,\n window: {\n print: () => 'printed',\n localStorage: {\n getItem:()=>'gotItem',\n },\n },\n props: {\n onClick:()=>'clicked',\n reduxRouter: {\n push:()=>'pushed',\n pop:()=>'poped',\n },\n },\n};\nconst rxjTest = {\n component:'div',\n props: {\n name:'test',\n },\n __functionProps: {\n onclick:'func:this.props.onClick',\n printPage: 'func:window.print',\n nav:'func:this.props.reduxRouter.push',\n },\n};\nconst rxjObj = getFunctionProps.call(thisProp, {\n rjx: rxjTest,\n});\nexpect(rxjObj).is.an('object');\nexpect(Object.keys(rxjObj)).to.eql(Object.keys(rxjTest.__functionProps));\nexpect(rxjObj.onclick()).to.eq('clicked');\nexpect(rxjObj.printPage()).to.eql('printed');\nexpect(rxjObj.nav()).to.eql('pushed');\n```\n\n##### comparisionprops\n\nComparison props are used to contionally show components if they're truthy. They compare an array of left and right side values, if they are all true, the component is rendered. If `comparisonorprops:true` then only one condition needs to be true in order to render the component\n\n```javascript\n//and conditions\nrjx={\n comparisonprops: [{\n left: ['bigNum',],\n operation:'lte',\n right:['smallNum',],\n },{\n left: ['smallNum',],\n operation:'<=',\n right:['bigNum',],\n }],\n}\n//or conditions\nrjx={\n comparisonorprops:true,\n comparisonprops: [{\n left: ['truthy',],\n operation:'eq',\n right:['falsey',],\n },{\n left: ['smallNum',],\n operation:'eq',\n right:['smallNum',],\n }],\n}\n\n// All comparison operations\nswitch (opscompares.operation) {\n case 'eq':\n case '==':\n return opscompares.left == opscompares.right;\n case 'dneq':\n case '!=':\n case '!':\n return opscompares.left !== opscompares.right;\n case 'dnseq':\n case '!==':\n return opscompares.left !== opscompares.right;\n case 'seq':\n case '===':\n return opscompares.left === opscompares.right;\n case 'lt':\n case '<':\n return opscompares.left < opscompares.right;\n case 'lte':\n case '<=':\n return opscompares.left <= opscompares.right;\n case 'gt':\n case '>':\n return opscompares.left > opscompares.right;\n case 'gte':\n case '>=':\n return opscompares.left >= opscompares.right;\n case 'dne':\n case 'undefined':\n case 'null':\n return opscompares.left === undefined || opscompares.left === null; \n case '!null':\n case '!undefined':\n case 'exists':\n default://'exists'\n return opscompares.left !== undefined && opscompares.left !== null;\n}\n```\n\n### Advanced - Custom React Components & Lifecycle Functions\n\nYou can also create react components with lifecycle functions using `getReactClassComponent`.\n\nThe only required function is a render function, the body of the function has to be valid rjx.\n\n```javascript\nconst MyCustomComponent = rjx._rjxComponents.getReactClassComponent({\n //\n // Initialization function\n //\n getInitialState:{\n body:'return { status:\"not-loaded\", name:\"rjx test\", customNumber:1, }',\n arguments:[],\n },\n getDefaultProps:{\n body:'return { someProp:1, someOtherProp:2, status:\"original status\" }',\n arguments:[],\n },\n componentDidMount:{\n body:`console.log('mounted', 'this.props',this.props, 'this.state',this.state)`,\n arguments:[],\n },\n componentWillUnmount:{\n body:`console.log('unmounted',this.props)`,\n arguments:[],\n },\n //\n // State change functions\n //\n shouldComponentUpdate:{\n body:'console.log(\"should update component\",{nextProps,nextState}); return true;',\n arguments:['nextProps', 'nextState']\n },\n componentWillUpdate:{\n body:'console.log(\"will update component\",{nextProps,nextState}); return true;',\n arguments:['nextProps', 'nextState']\n },\n componentDidUpdate:{\n body:'console.log(\"did update component\",{prevProps,prevState}); return true;',\n arguments:['prevProps', 'prevState']\n },\n //\n // Prop change functions\n //\n componentWillReceiveProps: {\n body:'console.log(\"will recieve props\",{nextProps}); return true;',\n arguments:['nextProps']\n },\n //\n // RENDER IS THE ONLY ***REQUIRED*** FUNCTION\n //\n render:{\n body:{\n component:'p',\n props:{\n status:'from inline prop'\n },\n passprops:true,\n children:[\n {\n component:'span',\n children: 'My Custom React Component Status: ',\n },\n {\n component:'span',\n thisprops:{\n children:['status']\n }\n }\n ]\n },\n }\n });\nconst sampleRJX = {\n component:'MyCustomComponent',\n props:{\n status:'Amazing',\n }\n};\nconst boundConfig = {\n debug:true, \n reactComponents:{\n MyCustomComponent,\n }\n};\nrjx.rjxRender.call(boundConfig, {\n rjx: sampleRJX, \n querySelector:'#root', });\n```\n\nConsole output after mounting\n```javascript\n[Log] mounted (4)\n\"this.props\"\n{status: \"Amazing\", children: {}, someProp: 1, someOtherProp: 2}\n\"this.state\"\n{status: \"not-loaded\", name: \"rjx test\", customNumber: 1}\n```\n\nCheckout the `dist/example.html` for example usage.\n\n\n### Development\n\nNote *Make sure you have grunt installed*\n\n```sh\n$ npm i -g grunt-cli jsdoc-to-markdown\n```\n\nFor generating documentation\n\n```sh\n$ grunt doc\n$ jsdoc2md src/**/*.js > docs/api.md\n```\n\n### Notes\n\nCheck out [https://repetere.github.io/rjx/](https://repetere.github.io/rjx/) for the full rjx Documentation\n\n### Testing\n\n```sh\n$ npm i\n$ grunt test\n```\n\n### Contributing\n\nFork, write tests and create a pull request!\n\n### Example Browser Usage\n\n```html\n\n\n \n \n RJX TEST\n \n \n \n \n \n \n\n ```\n\n\n\n
\n\n
\r\n `);\r\n // global.document = dom.window.document;\r\n // global.document.createElement = React.createElement;\r\n // console.log('dom.window',dom.window)\r\n global.window = dom.window;\r\n global.window.React = React;\r\n global.document = global.window.document;\r\n // console.log(\"dom.window.document.querySelector('#root')\",dom.window.document.querySelector('#root'));\r\n const ReactiveJSON = rjx.compile(sampleRJXJSON);\r\n const testDOM = ReactTestUtils.renderIntoDocument(ReactiveJSON());\r\n // console.log({testDOM});\r\n expect(ReactTestUtils.isDOMComponent(testDOM)).to.be.true;\r\n expect(ReactiveJSON).to.be.a('function');\r\n // expect(ReactTestUtils.isCompositeComponent(ReactiveJSON)).to.be.true;\r\n });\r\n });\r\n describe('outputJSON', () => { \r\n it('should convert RJX to JSON', () => {\r\n const compiledJSON = rjx.outputJSON(simpleDiv);\r\n const compiledRJXJSON = rjx.getReactElementFromRJX.call({ returnJSON: true, }, simpleDiv);\r\n expect(compiledJSON.children).to.eql(compiledRJXJSON.children);\r\n expect(compiledJSON.type).to.eql(compiledRJXJSON.type);\r\n });\r\n });\r\n describe('outputJSX', () => {\r\n it('should compile to JSX String', () => {\r\n const JSXString = rjx.outputJSX(simpleDiv);\r\n expect(JSXString).to.include('title=\"test\">hello
');\r\n // console.log({ JSXString, complexJSXString, });\r\n });\r\n });\r\n describe('jsonToJSX', () => {\r\n // const util = require('util');\r\n // console.log(util.inspect({ simpleDivJSON, complexDivJSON, },{depth:20}));\r\n it('should compile to JSX String', () => {\r\n const JSXString = rjx.jsonToJSX(simpleDivJSON);\r\n const complexJSXString = rjx.jsonToJSX(complexDivJSON);\r\n expect(JSXString).to.include('title=\"test\">hello');\r\n expect(complexJSXString).to.be.a('string');\r\n // console.log({ JSXString, complexJSXString, });\r\n });\r\n });\r\n describe('outputHTML', () => {\r\n it('should be an alias for rjxHTMLString', () => {\r\n expect(rjx.outputHTML).to.eql(rjx.rjxHTMLString);\r\n });\r\n });\r\n describe('rjxHTMLString', () => {\r\n it('should return an HTML string', () => {\r\n const rjxString = rjx.rjxHTMLString({ rjx: sampleRJX, });\r\n const dom = new JSDOM(`${rjxString}`);\r\n\r\n expect(rjxString).to.be.a('string');\r\n expect(dom.window.document.body.querySelector('p').innerHTML).to.eql('hello world');\r\n expect(dom.window.document.body.querySelector('p').style.color).to.eql('red');\r\n });\r\n });\r\n describe('__express', () => {\r\n const sampleRJXFilepath = path.resolve('./test/mock/sample.rjx');\r\n const spantext = 'should render in express';\r\n it('should return an HTML string', (done) => {\r\n rjx.__express(\r\n sampleRJXFilepath,\r\n {\r\n spantext,\r\n __boundConfig: {\r\n debug:true,\r\n },\r\n __DOCTYPE:'',\r\n },\r\n ((err, renderedString) => {\r\n const dom = new JSDOM(renderedString);\r\n if (renderedString) {\r\n expect(dom.window.document.querySelector('#generatedRJX').getAttribute('title')).to.eql(spantext);\r\n expect(err).to.be.null;\r\n expect(renderedString).to.be.a('String');\r\n }\r\n done(err);\r\n })\r\n );\r\n });\r\n it('it should handle errors', (done) => {\r\n expect(rjx.__express.bind()).to.throw;\r\n rjx.__express(null,null, (err) => {\r\n expect(err).to.be.a('error');\r\n done();\r\n })\r\n });\r\n });\r\n describe('rjxRender', () => {\r\n before(function () {\r\n this.jsdom = mochaJSDOM();\r\n });\r\n it('should render component inside of querySelector', function () {\r\n const containerDiv = document.createElement('div');\r\n containerDiv.setAttribute('id', 'reactContainer');\r\n document.body.appendChild(containerDiv);\r\n rjx.rjxRender({ rjx: sampleRJX, querySelector:'#reactContainer', });\r\n \r\n expect(document.body.querySelector('p').innerHTML).to.eql('hello world');\r\n expect(document.body.querySelector('p').style.color).to.eql('red');\r\n }); \r\n after(function () {\r\n this.jsdom();\r\n });\r\n });\r\n});",
"static": true,
"longname": "/Users/yawjosephetse/Developer/github/repetere/rjx/test/unit/rjx_spec.js",
"access": null,
"description": null,
"lineNumber": 1
},
{
"__docId__": 186,
"kind": "test",
"name": "describe71",
"testId": 71,
"memberof": "test/unit/rjx_spec.js",
"testDepth": 0,
"static": true,
"longname": "test/unit/rjx_spec.js~describe71",
"access": null,
"description": "rjx",
"lineNumber": 94
},
{
"__docId__": 187,
"kind": "test",
"name": "describe72",
"testId": 72,
"memberof": "test/unit/rjx_spec.js~describe71",
"testDepth": 1,
"static": true,
"longname": "test/unit/rjx_spec.js~describe71.describe72",
"access": null,
"description": "helper functions",
"lineNumber": 95
},
{
"__docId__": 188,
"kind": "test",
"name": "it73",
"testId": 73,
"memberof": "test/unit/rjx_spec.js~describe71.describe72",
"testDepth": 2,
"static": true,
"longname": "test/unit/rjx_spec.js~describe71.describe72.it73",
"access": null,
"description": "should return useGlobalHook",
"lineNumber": 96
},
{
"__docId__": 189,
"kind": "test",
"name": "it74",
"testId": 74,
"memberof": "test/unit/rjx_spec.js~describe71.describe72",
"testDepth": 2,
"static": true,
"longname": "test/unit/rjx_spec.js~describe71.describe72.it74",
"access": null,
"description": "should return React",
"lineNumber": 99
},
{
"__docId__": 190,
"kind": "test",
"name": "it75",
"testId": 75,
"memberof": "test/unit/rjx_spec.js~describe71.describe72",
"testDepth": 2,
"static": true,
"longname": "test/unit/rjx_spec.js~describe71.describe72.it75",
"access": null,
"description": "should return ReactDOM",
"lineNumber": 102
},
{
"__docId__": 191,
"kind": "test",
"name": "describe76",
"testId": 76,
"memberof": "test/unit/rjx_spec.js~describe71",
"testDepth": 1,
"static": true,
"longname": "test/unit/rjx_spec.js~describe71.describe76",
"access": null,
"description": "getReactElementFromRJX",
"lineNumber": 106
},
{
"__docId__": 192,
"kind": "test",
"name": "it77",
"testId": 77,
"memberof": "test/unit/rjx_spec.js~describe71.describe76",
"testDepth": 2,
"static": true,
"longname": "test/unit/rjx_spec.js~describe71.describe76.it77",
"access": null,
"description": "should return an instance of a react element",
"lineNumber": 107
},
{
"__docId__": 193,
"kind": "test",
"name": "it78",
"testId": 78,
"memberof": "test/unit/rjx_spec.js~describe71.describe76",
"testDepth": 2,
"static": true,
"longname": "test/unit/rjx_spec.js~describe71.describe76.it78",
"access": null,
"description": "should handle errors with empty components",
"lineNumber": 119
},
{
"__docId__": 194,
"kind": "test",
"name": "it79",
"testId": 79,
"memberof": "test/unit/rjx_spec.js~describe71.describe76",
"testDepth": 2,
"static": true,
"longname": "test/unit/rjx_spec.js~describe71.describe76.it79",
"access": null,
"description": "should throw an error with invalid components",
"lineNumber": 126
},
{
"__docId__": 195,
"kind": "test",
"name": "describe80",
"testId": 80,
"memberof": "test/unit/rjx_spec.js~describe71",
"testDepth": 1,
"static": true,
"longname": "test/unit/rjx_spec.js~describe71.describe80",
"access": null,
"description": "getReactElementFromJSON",
"lineNumber": 137
},
{
"__docId__": 196,
"kind": "test",
"name": "it81",
"testId": 81,
"memberof": "test/unit/rjx_spec.js~describe71.describe80",
"testDepth": 2,
"static": true,
"longname": "test/unit/rjx_spec.js~describe71.describe80.it81",
"access": null,
"description": "should return an instance of a react element",
"lineNumber": 138
},
{
"__docId__": 197,
"kind": "test",
"name": "describe82",
"testId": 82,
"memberof": "test/unit/rjx_spec.js~describe71",
"testDepth": 1,
"static": true,
"longname": "test/unit/rjx_spec.js~describe71.describe82",
"access": null,
"description": "compile",
"lineNumber": 151
},
{
"__docId__": 198,
"kind": "test",
"name": "it83",
"testId": 83,
"memberof": "test/unit/rjx_spec.js~describe71.describe82",
"testDepth": 2,
"static": true,
"longname": "test/unit/rjx_spec.js~describe71.describe82.it83",
"access": null,
"description": "should convert RJX to React Element",
"lineNumber": 152
},
{
"__docId__": 199,
"kind": "test",
"name": "describe84",
"testId": 84,
"memberof": "test/unit/rjx_spec.js~describe71",
"testDepth": 1,
"static": true,
"longname": "test/unit/rjx_spec.js~describe71.describe84",
"access": null,
"description": "outputJSON",
"lineNumber": 172
},
{
"__docId__": 200,
"kind": "test",
"name": "it85",
"testId": 85,
"memberof": "test/unit/rjx_spec.js~describe71.describe84",
"testDepth": 2,
"static": true,
"longname": "test/unit/rjx_spec.js~describe71.describe84.it85",
"access": null,
"description": "should convert RJX to JSON",
"lineNumber": 173
},
{
"__docId__": 201,
"kind": "test",
"name": "describe86",
"testId": 86,
"memberof": "test/unit/rjx_spec.js~describe71",
"testDepth": 1,
"static": true,
"longname": "test/unit/rjx_spec.js~describe71.describe86",
"access": null,
"description": "outputJSX",
"lineNumber": 180
},
{
"__docId__": 202,
"kind": "test",
"name": "it87",
"testId": 87,
"memberof": "test/unit/rjx_spec.js~describe71.describe86",
"testDepth": 2,
"static": true,
"longname": "test/unit/rjx_spec.js~describe71.describe86.it87",
"access": null,
"description": "should compile to JSX String",
"lineNumber": 181
},
{
"__docId__": 203,
"kind": "test",
"name": "describe88",
"testId": 88,
"memberof": "test/unit/rjx_spec.js~describe71",
"testDepth": 1,
"static": true,
"longname": "test/unit/rjx_spec.js~describe71.describe88",
"access": null,
"description": "jsonToJSX",
"lineNumber": 187
},
{
"__docId__": 204,
"kind": "test",
"name": "it89",
"testId": 89,
"memberof": "test/unit/rjx_spec.js~describe71.describe88",
"testDepth": 2,
"static": true,
"longname": "test/unit/rjx_spec.js~describe71.describe88.it89",
"access": null,
"description": "should compile to JSX String",
"lineNumber": 190
},
{
"__docId__": 205,
"kind": "test",
"name": "describe90",
"testId": 90,
"memberof": "test/unit/rjx_spec.js~describe71",
"testDepth": 1,
"static": true,
"longname": "test/unit/rjx_spec.js~describe71.describe90",
"access": null,
"description": "outputHTML",
"lineNumber": 198
},
{
"__docId__": 206,
"kind": "test",
"name": "it91",
"testId": 91,
"memberof": "test/unit/rjx_spec.js~describe71.describe90",
"testDepth": 2,
"static": true,
"longname": "test/unit/rjx_spec.js~describe71.describe90.it91",
"access": null,
"description": "should be an alias for rjxHTMLString",
"lineNumber": 199
},
{
"__docId__": 207,
"kind": "test",
"name": "describe92",
"testId": 92,
"memberof": "test/unit/rjx_spec.js~describe71",
"testDepth": 1,
"static": true,
"longname": "test/unit/rjx_spec.js~describe71.describe92",
"access": null,
"description": "rjxHTMLString",
"lineNumber": 203
},
{
"__docId__": 208,
"kind": "test",
"name": "it93",
"testId": 93,
"memberof": "test/unit/rjx_spec.js~describe71.describe92",
"testDepth": 2,
"static": true,
"longname": "test/unit/rjx_spec.js~describe71.describe92.it93",
"access": null,
"description": "should return an HTML string",
"lineNumber": 204
},
{
"__docId__": 209,
"kind": "test",
"name": "describe94",
"testId": 94,
"memberof": "test/unit/rjx_spec.js~describe71",
"testDepth": 1,
"static": true,
"longname": "test/unit/rjx_spec.js~describe71.describe94",
"access": null,
"description": "__express",
"lineNumber": 213
},
{
"__docId__": 210,
"kind": "test",
"name": "it95",
"testId": 95,
"memberof": "test/unit/rjx_spec.js~describe71.describe94",
"testDepth": 2,
"static": true,
"longname": "test/unit/rjx_spec.js~describe71.describe94.it95",
"access": null,
"description": "should return an HTML string",
"lineNumber": 216
},
{
"__docId__": 211,
"kind": "test",
"name": "it96",
"testId": 96,
"memberof": "test/unit/rjx_spec.js~describe71.describe94",
"testDepth": 2,
"static": true,
"longname": "test/unit/rjx_spec.js~describe71.describe94.it96",
"access": null,
"description": "it should handle errors",
"lineNumber": 237
},
{
"__docId__": 212,
"kind": "test",
"name": "describe97",
"testId": 97,
"memberof": "test/unit/rjx_spec.js~describe71",
"testDepth": 1,
"static": true,
"longname": "test/unit/rjx_spec.js~describe71.describe97",
"access": null,
"description": "rjxRender",
"lineNumber": 245
},
{
"__docId__": 213,
"kind": "test",
"name": "it98",
"testId": 98,
"memberof": "test/unit/rjx_spec.js~describe71.describe97",
"testDepth": 2,
"static": true,
"longname": "test/unit/rjx_spec.js~describe71.describe97.it98",
"access": null,
"description": "should render component inside of querySelector",
"lineNumber": 249
},
{
"__docId__": 214,
"kind": "testFile",
"name": "test/unit/util_spec.js",
"content": "import * as rjx from '../../src/main';\r\nimport * as _rjxUtils from '../../src/utils';\r\n\r\nimport mochaJSDOM from 'jsdom-global';\r\nimport chai from 'chai';\r\nimport sinon from 'sinon';\r\nimport React from 'react';\r\nimport ReactTestUtils from 'react-dom/test-utils'; // ES6\r\nimport ReactDOM from 'react-dom';\r\nimport ReactDOMElements from 'react-dom-factories';\r\nimport { expect } from 'chai';\r\nimport { JSDOM, } from 'jsdom';\r\nchai.use(require('sinon-chai'));\r\nimport 'mocha-sinon';\r\n\r\nconst sampleRJX = {\r\n component: 'div',\r\n props: {\r\n id: 'generatedRJX',\r\n className: 'rjx',\r\n bigNum: 1430931039,\r\n smallNum: 0.425,\r\n falsey: false,\r\n truthy: true,\r\n },\r\n children: 'some div',\r\n};\r\n\r\ndescribe('rjx utils', function () { \r\n describe('displayComponent', () => {\r\n const displayComponent = _rjxUtils.displayComponent;\r\n it('should display by default return true', () => {\r\n expect(displayComponent()).to.be.true;\r\n });\r\n it('should display if left !== null||undefined', () => {\r\n const testRJX = Object.assign({}, sampleRJX, {\r\n comparisonprops: [{\r\n left: ['truthy', ],\r\n },],\r\n });\r\n const testRJX2 = Object.assign({}, sampleRJX, {\r\n comparisonprops: [{\r\n left: ['falsey', ],\r\n operation:'exists',\r\n },],\r\n });\r\n const testRJX3 = Object.assign({}, sampleRJX, {\r\n comparisonprops: [{\r\n left: null,\r\n },],\r\n });\r\n expect(displayComponent({ rjx: testRJX, props: testRJX.props, })).to.be.true;\r\n expect(displayComponent({ rjx: testRJX2, props: testRJX2.props, })).to.be.true;\r\n expect(displayComponent({ rjx: testRJX3, props: testRJX3.props, })).to.be.false;\r\n });\r\n it('should display if left === null||undefined', () => {\r\n const testRJX = Object.assign({}, sampleRJX, {\r\n comparisonprops: [{\r\n left: ['truthy',],\r\n operation:'dne',\r\n },],\r\n });\r\n const testRJX2 = Object.assign({}, sampleRJX, {\r\n comparisonprops: [{\r\n left: ['falsey', ],\r\n operation:'undefined',\r\n },],\r\n });\r\n const testRJX3 = Object.assign({}, sampleRJX, {\r\n comparisonprops: [{\r\n left: null,\r\n operation:'null',\r\n },],\r\n });\r\n expect(displayComponent({ rjx: testRJX, props: testRJX.props, })).to.be.false;\r\n expect(displayComponent({ rjx: testRJX2, props: testRJX2.props, })).to.be.false;\r\n expect(displayComponent({ rjx: testRJX3, props: testRJX3.props, })).to.be.true;\r\n });\r\n it('should display if left == right', () => {\r\n const testRJX = Object.assign({}, sampleRJX, {\r\n comparisonprops: [{\r\n left: ['truthy', ],\r\n operation:'eq',\r\n right:['truthy', ],\r\n },],\r\n });\r\n const testRJX2 = Object.assign({}, sampleRJX, {\r\n comparisonprops: [{\r\n left: ['truthy', ],\r\n operation:'==',\r\n right:['falsey', ],\r\n },],\r\n });\r\n const testRJX3 = Object.assign({}, sampleRJX, {\r\n comparisonprops: [{\r\n left: ['truthy', ],\r\n operation:'eq',\r\n right:1,\r\n },],\r\n });\r\n expect(displayComponent({ rjx: testRJX, props: testRJX.props, })).to.be.true;\r\n expect(displayComponent({ rjx: testRJX2, props: testRJX2.props, })).to.be.false;\r\n expect(displayComponent({ rjx: testRJX3, props: testRJX3.props, })).to.be.true;\r\n });\r\n it('should display if left === right', () => {\r\n const testRJX = Object.assign({}, sampleRJX, {\r\n comparisonprops: [{\r\n left: ['truthy', ],\r\n operation:'seq',\r\n right:['truthy', ],\r\n },],\r\n });\r\n const testRJX2 = Object.assign({}, sampleRJX, {\r\n comparisonprops: [{\r\n left: ['truthy', ],\r\n operation:'===',\r\n right:['falsey', ],\r\n },],\r\n });\r\n const testRJX3 = Object.assign({}, sampleRJX, {\r\n comparisonprops: [{\r\n left: ['truthy', ],\r\n operation:'seq',\r\n right:1,\r\n },],\r\n });\r\n expect(displayComponent({ rjx: testRJX, props: testRJX.props, })).to.be.true;\r\n expect(displayComponent({ rjx: testRJX2, props: testRJX2.props, })).to.be.false;\r\n expect(displayComponent({ rjx: testRJX3, props: testRJX3.props, })).to.be.false;\r\n });\r\n it('should display if left != right', () => {\r\n const testRJX = Object.assign({}, sampleRJX, {\r\n comparisonprops: [{\r\n left: ['truthy', ],\r\n operation:'dneq',\r\n right:['truthy', ],\r\n },],\r\n });\r\n const testRJX2 = Object.assign({}, sampleRJX, {\r\n comparisonprops: [{\r\n left: ['truthy', ],\r\n operation:'!=',\r\n right:['falsey', ],\r\n },],\r\n });\r\n const testRJX3 = Object.assign({}, sampleRJX, {\r\n comparisonprops: [{\r\n left: ['truthy', ],\r\n operation:'dneq',\r\n right:1,\r\n },],\r\n });\r\n expect(displayComponent({ rjx: testRJX, props: testRJX.props, })).to.be.false;\r\n expect(displayComponent({ rjx: testRJX2, props: testRJX2.props, })).to.be.true;\r\n expect(displayComponent({ rjx: testRJX3, props: testRJX3.props, })).to.be.true;\r\n });\r\n it('should display if left !== right', () => {\r\n const testRJX = Object.assign({}, sampleRJX, {\r\n comparisonprops: [{\r\n left: ['truthy', ],\r\n operation:'dnseq',\r\n right:['truthy', ],\r\n },],\r\n });\r\n const testRJX2 = Object.assign({}, sampleRJX, {\r\n comparisonprops: [{\r\n left: ['truthy', ],\r\n operation:'!==',\r\n right:['falsey', ],\r\n },],\r\n });\r\n const testRJX3 = Object.assign({}, sampleRJX, {\r\n comparisonprops: [{\r\n left: ['truthy', ],\r\n operation:'dnseq',\r\n right:1,\r\n },],\r\n });\r\n expect(displayComponent({ rjx: testRJX, props: testRJX.props, })).to.be.false;\r\n expect(displayComponent({ rjx: testRJX2, props: testRJX2.props, })).to.be.true;\r\n expect(displayComponent({ rjx: testRJX3, props: testRJX3.props, })).to.be.true;\r\n });\r\n it('should display if left > right', () => {\r\n const testRJX = Object.assign({}, sampleRJX, {\r\n comparisonprops: [{\r\n left: ['bigNum', ],\r\n operation:'gt',\r\n right:['smallNum', ],\r\n },],\r\n });\r\n const testRJX2 = Object.assign({}, sampleRJX, {\r\n comparisonprops: [{\r\n left: ['smallNum', ],\r\n operation:'>',\r\n right:['bigNum', ],\r\n },],\r\n });\r\n const testRJX3 = Object.assign({}, sampleRJX, {\r\n comparisonprops: [{\r\n left: ['smallNum', ],\r\n operation:'gt',\r\n right:['smallNum', ],\r\n },],\r\n });\r\n expect(displayComponent({ rjx: testRJX, props: testRJX.props, })).to.be.true;\r\n expect(displayComponent({ rjx: testRJX2, props: testRJX2.props, })).to.be.false;\r\n expect(displayComponent({ rjx: testRJX3, props: testRJX3.props, })).to.be.false;\r\n });\r\n it('should display if left >= right', () => {\r\n const testRJX = Object.assign({}, sampleRJX, {\r\n comparisonprops: [{\r\n left: ['bigNum', ],\r\n operation:'gte',\r\n right:['smallNum', ],\r\n },],\r\n });\r\n const testRJX2 = Object.assign({}, sampleRJX, {\r\n comparisonprops: [{\r\n left: ['smallNum', ],\r\n operation:'>=',\r\n right:['bigNum', ],\r\n },],\r\n });\r\n const testRJX3 = Object.assign({}, sampleRJX, {\r\n comparisonprops: [{\r\n left: ['smallNum', ],\r\n operation:'gte',\r\n right:['smallNum', ],\r\n },],\r\n });\r\n expect(displayComponent({ rjx: testRJX, props: testRJX.props, })).to.be.true;\r\n expect(displayComponent({ rjx: testRJX2, props: testRJX2.props, })).to.be.false;\r\n expect(displayComponent({ rjx: testRJX3, props: testRJX3.props, })).to.be.true;\r\n });\r\n it('should display if left < right', () => {\r\n const testRJX = Object.assign({}, sampleRJX, {\r\n comparisonprops: [{\r\n left: ['bigNum', ],\r\n operation:'<',\r\n right:['smallNum', ],\r\n },],\r\n });\r\n const testRJX2 = Object.assign({}, sampleRJX, {\r\n comparisonprops: [{\r\n left: ['smallNum', ],\r\n operation:'lt',\r\n right:['bigNum', ],\r\n },],\r\n });\r\n const testRJX3 = Object.assign({}, sampleRJX, {\r\n comparisonprops: [{\r\n left: ['smallNum', ],\r\n operation:'lt',\r\n right:['smallNum', ],\r\n },],\r\n });\r\n expect(displayComponent({ rjx: testRJX, props: testRJX.props, })).to.be.false;\r\n expect(displayComponent({ rjx: testRJX2, props: testRJX2.props, })).to.be.true;\r\n expect(displayComponent({ rjx: testRJX3, props: testRJX3.props, })).to.be.false;\r\n });\r\n it('should display if left <= right', () => {\r\n const testRJX = Object.assign({}, sampleRJX, {\r\n comparisonprops: [{\r\n left: ['bigNum', ],\r\n operation:'lte',\r\n right:['smallNum', ],\r\n },],\r\n });\r\n const testRJX2 = Object.assign({}, sampleRJX, {\r\n comparisonprops: [{\r\n left: ['smallNum', ],\r\n operation:'<=',\r\n right:['bigNum', ],\r\n },],\r\n });\r\n const testRJX3 = Object.assign({}, sampleRJX, {\r\n comparisonprops: [{\r\n left: ['smallNum', ],\r\n operation:'lte',\r\n right:['smallNum', ],\r\n },],\r\n });\r\n expect(displayComponent({ rjx: testRJX, props: testRJX.props, })).to.be.false;\r\n expect(displayComponent({ rjx: testRJX2, props: testRJX2.props, })).to.be.true;\r\n expect(displayComponent({ rjx: testRJX3, props: testRJX3.props, })).to.be.true;\r\n });\r\n it('should display if multiple comprisons are true', () => {\r\n const testRJX = Object.assign({}, sampleRJX, {\r\n comparisonprops: [{\r\n left: ['truthy', ],\r\n operation:'eq',\r\n right:['truthy', ],\r\n }, {\r\n left: ['smallNum', ],\r\n operation:'==',\r\n right:['smallNum', ],\r\n },],\r\n });\r\n const testRJX2 = Object.assign({}, sampleRJX, {\r\n comparisonprops: [{\r\n left: ['truthy', ],\r\n operation:'eq',\r\n right:['falsey', ],\r\n }, {\r\n left: ['smallNum', ],\r\n operation:'eq',\r\n right:['smallNum', ],\r\n },],\r\n });\r\n expect(displayComponent({ rjx: testRJX, props: testRJX.props, })).to.be.true;\r\n expect(displayComponent({ rjx: testRJX2, props: testRJX2.props, })).to.be.false;\r\n });\r\n it('should display if one or more using comparisonorprops comprisons are true', () => {\r\n const testRJX = Object.assign({}, sampleRJX, {\r\n comparisonorprops:true,\r\n comparisonprops: [{\r\n left: ['truthy', ],\r\n operation:'eq',\r\n right:['truthy', ],\r\n }, {\r\n left: ['smallNum', ],\r\n operation:'==',\r\n right:['smallNum', ],\r\n },],\r\n });\r\n const testRJX2 = Object.assign({}, sampleRJX, {\r\n comparisonorprops:true,\r\n comparisonprops: [{\r\n left: ['truthy', ],\r\n operation:'eq',\r\n right:['falsey', ],\r\n }, {\r\n left: ['smallNum', ],\r\n operation:'eq',\r\n right:['smallNum', ],\r\n },],\r\n });\r\n const testRJX3 = Object.assign({}, sampleRJX, {\r\n comparisonorprops:true,\r\n comparisonprops: [{\r\n left: ['truthy', ],\r\n operation:'eq',\r\n right:['falsey', ],\r\n }, {\r\n left: ['bigNum', ],\r\n operation:'eq',\r\n right:['smallNum', ],\r\n },],\r\n });\r\n expect(displayComponent({ rjx: testRJX, props: testRJX.props, })).to.be.true;\r\n expect(displayComponent({ rjx: testRJX2, props: testRJX2.props, })).to.be.true;\r\n expect(displayComponent({ rjx: testRJX3, props: testRJX3.props, })).to.be.false;\r\n });\r\n });\r\n describe('getAdvancedBinding', () => {\r\n const getAdvancedBinding = _rjxUtils.getAdvancedBinding;\r\n it('should return true if browser supports deep nesting', function () {\r\n const window = {\r\n navigator: {\r\n userAgent: 'Webkit',\r\n },\r\n };\r\n expect(getAdvancedBinding.call({ window, })).to.be.true;\r\n }); \r\n it('should return false on all versions of IE/Trident', function () {\r\n const window = {\r\n navigator: {\r\n userAgent: 'Trident',\r\n },\r\n };\r\n expect(getAdvancedBinding.call({ window, })).to.be.false;\r\n }); \r\n it('should return false on old Android Browser', function () {\r\n const window = {\r\n navigator: {\r\n userAgent: 'Mozilla/5.0 (Linux; U; Android 1.5; de-de; HTC Magic Build/CRB17) AppleWebKit/528.5 (KHTML, like Gecko) Version/3.1.2 Mobile Safari/525.20.1',\r\n },\r\n };\r\n expect(getAdvancedBinding.call({ window, })).to.be.false;\r\n }); \r\n it('should return false on old Chrome Browser', function () {\r\n const window = {\r\n navigator: {\r\n userAgent: 'Mozilla/5.0 (Linux; Android 4.1.2; GT-I9300 Build/JZO54K) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/31.0.1650.59 Mobile Safari/537.36',\r\n },\r\n };\r\n expect(getAdvancedBinding.call({ window, })).to.be.false;\r\n }); \r\n it('should return false unknown browser', function () {\r\n expect(getAdvancedBinding.call({ })).to.be.false;\r\n }); \r\n });\r\n describe('traverse', () => {\r\n const testObj = {\r\n user: {\r\n name: 'rjx',\r\n description: 'react withouth javascript',\r\n },\r\n stats: {\r\n logins: 102,\r\n comments: 3,\r\n },\r\n authentication: 'OAuth2',\r\n };\r\n const traverse = _rjxUtils.traverse;\r\n it('should return properties from an object from the array of paths', () => {\r\n const testVals = { auth: ['authentication', ], username: ['user', 'name', ], };\r\n expect( traverse(testVals, testObj)).to.eql({ auth:testObj.authentication, username:testObj.user.name, });\r\n });\r\n it('should return the entire object if no paths provided', () => {\r\n const testVals = { wholeObj: [], };\r\n expect( traverse(testVals, testObj)).to.eql({ wholeObj:testObj, });\r\n });\r\n it('should return undefined if paths are invalid', () => {\r\n const testVals = { emptyObj: ['invalid', 'path',], };\r\n expect( traverse(testVals, testObj)).to.eql({ emptyObj:undefined, });\r\n });\r\n it('should throw an error if paths are not an array of strings or numeric indexes', () => {\r\n const testVals = { emptyObj: ()=>undefined, };\r\n expect(traverse.bind(null, testVals, testObj)).to.throw(Error);\r\n });\r\n });\r\n describe('validateRJX', () => {\r\n const validateRJX = _rjxUtils.validateRJX;\r\n it('should return true if RJX is valid', ()=> {\r\n expect(validateRJX(sampleRJX)).to.be.true;\r\n });\r\n it('should return string and warn of invalid RJX props', () => {\r\n const invalidKeys = { incorrect: true, extra: true, };\r\n const invalidKeyRJX = Object.assign({}, sampleRJX, invalidKeys);\r\n const validationTest = validateRJX(invalidKeyRJX);\r\n expect(validationTest).to.be.a('string').and.to.be.ok;\r\n expect(validationTest).to.eql(`Warning: Invalid Keys [${Object.keys(invalidKeys).join()}]`);\r\n });\r\n it('should throw a syntax error if RJX is missing a component', () => {\r\n const validationTest = validateRJX.bind({});\r\n expect(validationTest).to.throw('Missing React Component');\r\n expect(validationTest).to.throw(SyntaxError);\r\n });\r\n it('should throw multiple errors if returnAllErrors is true', () => {\r\n const validationTest = validateRJX( {\r\n props: [],\r\n }, true);\r\n expect(validationTest).to.be.an('array');\r\n expect(validationTest[ 0 ]).to.be.an('error');\r\n });\r\n it('should throw a type error if RJX props is not an object, props.children or props._children', () => {\r\n const badPropTest1 = validateRJX.bind(null, { component:'div', props:{ children:{}, }, });\r\n expect(validateRJX.bind(null, { component:'div', props:'bad', })).to.throw(TypeError);\r\n expect(validateRJX.bind(null, { component:'div', props:[], })).to.throw(TypeError);\r\n expect(badPropTest1).to.throw(TypeError);\r\n expect(validateRJX.bind(null, { component: 'div', props: { _children: {}, }, })).to.throw(TypeError);\r\n });\r\n it('should throw a type error if RJX children is not an array or RJX docs or a string', () => {\r\n expect(validateRJX.bind(null, { component:'div', children:{}, })).to.throw(TypeError);\r\n });\r\n it('should validate child objects', () => {\r\n const rjxObj = {\r\n component: 'div',\r\n children: [\r\n {\r\n props:'this is missing a component',\r\n },\r\n {\r\n component: 'p',\r\n children: {},\r\n asyncprops:'',\r\n },\r\n ],\r\n };\r\n const childrenErrors = validateRJX(rjxObj, true);\r\n expect(childrenErrors).to.be.an('array');\r\n expect(childrenErrors[ 0 ]).to.be.an('error');\r\n });\r\n it('should validate dynamic props[asyncprops,resourceprops,thisprops,windowprops]', () => {\r\n const rjxObj = {\r\n component: 'myComponent',\r\n asyncprops: '[]',\r\n resourceprops: '[]',\r\n thisprops: {\r\n notStrings: [undefined, {}, ],\r\n },\r\n windowprops: {\r\n title:['navigator', 'userAgent', ],\r\n },\r\n };\r\n const dynamicerrors = validateRJX(rjxObj, true);\r\n expect(dynamicerrors).to.be.an('array');\r\n expect(dynamicerrors.length).to.eql(7);\r\n expect(dynamicerrors[ 0 ]).to.be.an('error');\r\n });\r\n it('should validate eval props[__dangerouslyEvalProps,__dangerouslyBindEvalProps]', () => {\r\n const rjxObj = {\r\n component: 'myComponent',\r\n __dangerouslyEvalProps: 'badobj',\r\n };\r\n const rjxObj2 = {\r\n component: 'myComponent',\r\n __dangerouslyEvalProps: {\r\n testJS:'()=>true',\r\n testJS1:'3',\r\n },\r\n };\r\n const evalError = validateRJX(rjxObj, true);\r\n const evalError2 = validateRJX(rjxObj2);\r\n expect(evalError[ 0 ]).to.be.an('error');\r\n expect(evalError2).to.be.true;\r\n // console.log({ evalError3 });\r\n // expect(dynamicerrors).to.be.an('array');\r\n // expect(dynamicerrors.length).to.eql(4);\r\n // expect(dynamicerrors[ 0 ]).to.be.an('error');\r\n });\r\n it('should validate __dangerouslyEvalProps javascript', () => {\r\n const rjxObj3 = {\r\n component: 'myComponent',\r\n __dangerouslyEvalProps: {\r\n testJS: '(=>true',\r\n },\r\n };\r\n const evalError3 = validateRJX(rjxObj3, true);\r\n expect(evalError3[ 0 ]).to.be.an('error');\r\n });\r\n it('should validate __dangerouslyBindEvalProps as a function that can be bound javascript', () => {\r\n const rjxObj4 = {\r\n component: 'myComponent',\r\n __dangerouslyBindEvalProps: {\r\n testJS1: '{}',\r\n },\r\n };\r\n const evalError4 = validateRJX(rjxObj4, true);\r\n expect(evalError4[ 0 ]).to.be.an('error');\r\n });\r\n it('should validate __dangerouslyInsertComponents are valid RJX objects', () => {\r\n const rjxObj = {\r\n component: 'myComponent',\r\n __dangerouslyInsertComponents: {\r\n testComponent: {\r\n component_missing: 'nodiv',\r\n props: {},\r\n },\r\n },\r\n };\r\n const evalError = validateRJX(rjxObj, true);\r\n expect(evalError[ 0 ]).to.be.an('error');\r\n });\r\n it('should validate __functionProps are valid function strings', () => {\r\n const rjxObj = {\r\n component: 'myComponent',\r\n __functionProps: {\r\n invalidFunc: {\r\n isString: {},\r\n },\r\n },\r\n };\r\n const rjxObj2 = {\r\n component: 'myComponent',\r\n __functionProps: 'should be an obj',\r\n };\r\n const rjxObjValid = {\r\n component: 'myComponent',\r\n __functionProps: {\r\n goodFunc:'func:this.someFunc',\r\n },\r\n };\r\n const evalError = validateRJX(rjxObj, true);\r\n const evalError2 = validateRJX(rjxObj2, true);\r\n const validTest = validateRJX(rjxObjValid);\r\n expect(evalError[ 0 ]).to.be.an('error');\r\n expect(evalError2[ 0 ]).to.be.an('error');\r\n expect(validTest).to.be.true;\r\n });\r\n it('should validate __windowComponentProps is an object', () => {\r\n const rjxObj = {\r\n component: 'myComponent',\r\n __windowComponentProps: 'should be an obj',\r\n };\r\n const rjxObjValid = {\r\n component: 'myComponent',\r\n __windowComponentProps: {\r\n goodProps:'ok',\r\n },\r\n };\r\n const evalError = validateRJX(rjxObj, true);\r\n const validTest = validateRJX(rjxObjValid);\r\n expect(evalError[ 0 ]).to.be.an('error');\r\n expect(validTest).to.be.true;\r\n });\r\n it('should validate __windowComponents are valid function strings', () => {\r\n const rjxObj = {\r\n component: 'myComponent',\r\n __windowComponents: {\r\n invalidFunc: {\r\n isString: {},\r\n },\r\n },\r\n };\r\n const rjxObj2 = {\r\n component: 'myComponent',\r\n __windowComponents: 'should be an obj',\r\n };\r\n const rjxObjValid = {\r\n component: 'myComponent',\r\n __windowComponents: {\r\n goodFunc:'func:this.someFunc',\r\n },\r\n };\r\n const evalError = validateRJX(rjxObj, true);\r\n const evalError2 = validateRJX(rjxObj2, true);\r\n const validTest = validateRJX(rjxObjValid);\r\n expect(evalError[ 0 ]).to.be.an('error');\r\n expect(evalError2[ 0 ]).to.be.an('error');\r\n expect(validTest).to.be.true;\r\n });\r\n it('should validate comparisonorprops is boolean', () => {\r\n const rjxObj = {\r\n component: 'myComponent',\r\n comparisonorprops: 'should be an obj',\r\n };\r\n const rjxObjValid = {\r\n component: 'myComponent',\r\n comparisonorprops: true,\r\n };\r\n const evalError = validateRJX(rjxObj, true);\r\n const validTest = validateRJX(rjxObjValid);\r\n expect(evalError[ 0 ]).to.be.an('error');\r\n expect(validTest).to.be.true;\r\n });\r\n it('should validate comparisonprops is an array of comaprisons', () => {\r\n const rjxObj = {\r\n component: 'myComponent',\r\n comparisonprops: 'should be an array',\r\n };\r\n const rjxObjValid = {\r\n component: 'myComponent',\r\n comparisonprops: [],\r\n };\r\n const rjxObjin1 = {\r\n component: 'myComponent',\r\n comparisonprops: [{},],\r\n };\r\n const rjxObjin2 = {\r\n component: 'myComponent',\r\n comparisonprops: [() => { },],\r\n };\r\n const evalError = validateRJX(rjxObj, true);\r\n const evalError1 = validateRJX(rjxObjin1, true);\r\n const evalError2 = validateRJX(rjxObjin2, true);\r\n const validTest = validateRJX(rjxObjValid);\r\n expect(evalError[ 0 ]).to.be.an('error');\r\n expect(evalError1[ 0 ]).to.be.an('error');\r\n expect(evalError2[ 0 ]).to.be.an('error');\r\n expect(validTest).to.be.true;\r\n });\r\n it('should validate passprops is boolean', () => {\r\n const rjxObj = {\r\n component: 'myComponent',\r\n passprops: 'should be an obj',\r\n };\r\n const rjxObjValid = {\r\n component: 'myComponent',\r\n passprops: true,\r\n };\r\n const evalError = validateRJX(rjxObj, true);\r\n const validTest = validateRJX(rjxObjValid);\r\n expect(evalError[ 0 ]).to.be.an('error');\r\n expect(validTest).to.be.true;\r\n });\r\n });\r\n describe('validSimpleRJXSyntax', () => {\r\n const validSimpleRJXSyntax = _rjxUtils.validSimpleRJXSyntax;\r\n it('should invalidate shorthard simple syntax', () => {\r\n const invalidShorthand = {\r\n component:'p',\r\n };\r\n const invalidShorthand2 = {\r\n component: 'p',\r\n props: {\r\n style: {\r\n background:'red',\r\n },\r\n },\r\n };\r\n const invalidShorthand3 = {\r\n component: 'p',\r\n props:'hey',\r\n };\r\n const invalidShorthand4 = {\r\n component: 'p',\r\n props: {\r\n style: {\r\n background:'red',\r\n },\r\n },\r\n children:'hey',\r\n };\r\n const invalidShorthand5 = {\r\n children:'p',\r\n };\r\n const invalidShorthand6 = {\r\n anything:'p',\r\n };\r\n const invalidShorthand7 = {\r\n anything: {\r\n component: 'p',\r\n },\r\n };\r\n expect(validSimpleRJXSyntax(invalidShorthand)).to.be.false;\r\n expect(validSimpleRJXSyntax(invalidShorthand2)).to.be.false;\r\n expect(validSimpleRJXSyntax(invalidShorthand3)).to.be.false;\r\n expect(validSimpleRJXSyntax(invalidShorthand4)).to.be.false;\r\n expect(validSimpleRJXSyntax(invalidShorthand5)).to.be.false;\r\n expect(validSimpleRJXSyntax(invalidShorthand6)).to.be.false;\r\n });\r\n it('should validate shorthard simple syntax', () => {\r\n const validShorthand = {\r\n p:{},\r\n };\r\n const validShorthand2 = {\r\n p: {\r\n props: {\r\n style: {\r\n background:'red',\r\n },\r\n },\r\n },\r\n };\r\n const validShorthand3 = {\r\n p: {\r\n props:'hey',\r\n },\r\n };\r\n const validShorthand4 = {\r\n p: {\r\n props: {\r\n style: {\r\n background:'red',\r\n },\r\n },\r\n children:'hey',\r\n },\r\n };\r\n const validShorthand5 = {\r\n children: {\r\n children:'p',\r\n },\r\n };\r\n expect(validSimpleRJXSyntax(validShorthand)).to.be.true;\r\n expect(validSimpleRJXSyntax(validShorthand2)).to.be.true;\r\n expect(validSimpleRJXSyntax(validShorthand3)).to.be.true;\r\n expect(validSimpleRJXSyntax(validShorthand4)).to.be.true;\r\n expect(validSimpleRJXSyntax(validShorthand5)).to.be.true;\r\n });\r\n });\r\n describe('simpleRJXSyntax', () => {\r\n const simpleRJXSyntax = _rjxUtils.simpleRJXSyntax;\r\n it('should return valid RJX from simple RJX syntax', () => {\r\n const validShorthand = {\r\n p:{},\r\n };\r\n const validShorthand2 = {\r\n p: {\r\n props: {\r\n style: {\r\n background:'red',\r\n },\r\n },\r\n },\r\n };\r\n const validShorthand3 = {\r\n p: {\r\n props:'hey',\r\n },\r\n };\r\n const validShorthand4 = {\r\n div: {\r\n props: {\r\n style: {\r\n background:'red',\r\n },\r\n },\r\n children: [\r\n {\r\n p: { children: 'hey', },\r\n },\r\n ],\r\n },\r\n };\r\n const validShorthand5 = {\r\n children: {\r\n children:'p',\r\n },\r\n };\r\n const transformedSimpleSyntaxValid = _rjxUtils.validateRJX(simpleRJXSyntax(validShorthand), true);\r\n const transformedSimpleSyntaxValid2 = _rjxUtils.validateRJX(simpleRJXSyntax(validShorthand2), true);\r\n const transformedSimpleSyntaxValid3 = _rjxUtils.validateRJX(simpleRJXSyntax(validShorthand3), true);\r\n const transformedSimpleSyntaxValid4 = _rjxUtils.validateRJX(simpleRJXSyntax(validShorthand4), true);\r\n const transformedSimpleSyntaxValid5 = _rjxUtils.validateRJX(simpleRJXSyntax(validShorthand5), true);\r\n \r\n expect((transformedSimpleSyntaxValid)).to.be.true;\r\n expect((transformedSimpleSyntaxValid2)).to.be.true;\r\n expect((transformedSimpleSyntaxValid3[0])).to.be.an('error');\r\n expect((transformedSimpleSyntaxValid4[0])).to.be.true;\r\n expect((transformedSimpleSyntaxValid5)).to.be.true;\r\n });\r\n it('should produce equivalent RXJ', () => {\r\n const sampleRJX = {\r\n component: 'div',\r\n props: {\r\n id: 'generatedRJX',\r\n className: 'rjx',\r\n },\r\n asyncprops: {\r\n test:['ok', 'cool',],\r\n },\r\n children: [\r\n {\r\n component: 'p',\r\n props: {\r\n style: {\r\n color: 'red',\r\n fontWeight: 'bold',\r\n },\r\n },\r\n children: 'hello world',\r\n },\r\n ],\r\n };\r\n\r\n const simpleRJX = {\r\n div: {\r\n props: {\r\n id: 'generatedRJX',\r\n className: 'rjx',\r\n },\r\n asyncprops: {\r\n test:['ok', 'cool',],\r\n },\r\n children: [\r\n {\r\n p: {\r\n props: {\r\n style: {\r\n color: 'red',\r\n fontWeight: 'bold',\r\n },\r\n },\r\n children: 'hello world',\r\n },\r\n },\r\n ],\r\n },\r\n };\r\n const transformedRJXSTRING = simpleRJXSyntax(simpleRJX).toString();\r\n const RJXSTRING = sampleRJX.toString();\r\n\r\n expect(transformedRJXSTRING).to.eql(RJXSTRING);\r\n });\r\n });\r\n describe('getSimplifiedRJX', () => {\r\n const getSimplifiedRJX = _rjxUtils.getSimplifiedRJX;\r\n const simpleRJX = {\r\n div: {\r\n props: {\r\n id: 'generatedRJX',\r\n className: 'rjx',\r\n },\r\n asyncprops: {\r\n test:['ok', 'cool',],\r\n },\r\n children: [\r\n {\r\n p: {\r\n props: {\r\n style: {\r\n color: 'red',\r\n fontWeight: 'bold',\r\n },\r\n },\r\n children: 'hello world',\r\n },\r\n },\r\n ],\r\n },\r\n };\r\n const sampleRJX = {\r\n component: 'div',\r\n props: {\r\n id: 'generatedRJX',\r\n className: 'rjx',\r\n },\r\n asyncprops: {\r\n test:['ok', 'cool',],\r\n },\r\n children: [\r\n {\r\n component: 'p',\r\n props: {\r\n style: {\r\n color: 'red',\r\n fontWeight: 'bold',\r\n },\r\n },\r\n children: 'hello world',\r\n },\r\n ],\r\n };\r\n it('should produce equivalent SimpleRJX', () => {\r\n const transformedRJXSTRING = getSimplifiedRJX(sampleRJX).toString();\r\n const RJXSTRING = simpleRJX.toString();\r\n expect(transformedRJXSTRING).to.eql(RJXSTRING);\r\n });\r\n it('should return SimpleRJX if already simple', () => {\r\n expect(simpleRJX).to.eql(getSimplifiedRJX(simpleRJX));\r\n });\r\n });\r\n});",
"static": true,
"longname": "/Users/yawjosephetse/Developer/github/repetere/rjx/test/unit/util_spec.js",
"access": null,
"description": null,
"lineNumber": 1
},
{
"__docId__": 215,
"kind": "test",
"name": "describe99",
"testId": 99,
"memberof": "test/unit/util_spec.js",
"testDepth": 0,
"static": true,
"longname": "test/unit/util_spec.js~describe99",
"access": null,
"description": "rjx utils",
"lineNumber": 29
},
{
"__docId__": 216,
"kind": "test",
"name": "describe100",
"testId": 100,
"memberof": "test/unit/util_spec.js~describe99",
"testDepth": 1,
"static": true,
"longname": "test/unit/util_spec.js~describe99.describe100",
"access": null,
"description": "displayComponent",
"lineNumber": 30
},
{
"__docId__": 217,
"kind": "test",
"name": "it101",
"testId": 101,
"memberof": "test/unit/util_spec.js~describe99.describe100",
"testDepth": 2,
"static": true,
"longname": "test/unit/util_spec.js~describe99.describe100.it101",
"access": null,
"description": "should display by default return true",
"lineNumber": 32
},
{
"__docId__": 218,
"kind": "test",
"name": "it102",
"testId": 102,
"memberof": "test/unit/util_spec.js~describe99.describe100",
"testDepth": 2,
"static": true,
"longname": "test/unit/util_spec.js~describe99.describe100.it102",
"access": null,
"description": "should display if left !== null||undefined",
"lineNumber": 35
},
{
"__docId__": 219,
"kind": "test",
"name": "it103",
"testId": 103,
"memberof": "test/unit/util_spec.js~describe99.describe100",
"testDepth": 2,
"static": true,
"longname": "test/unit/util_spec.js~describe99.describe100.it103",
"access": null,
"description": "should display if left === null||undefined",
"lineNumber": 56
},
{
"__docId__": 220,
"kind": "test",
"name": "it104",
"testId": 104,
"memberof": "test/unit/util_spec.js~describe99.describe100",
"testDepth": 2,
"static": true,
"longname": "test/unit/util_spec.js~describe99.describe100.it104",
"access": null,
"description": "should display if left == right",
"lineNumber": 79
},
{
"__docId__": 221,
"kind": "test",
"name": "it105",
"testId": 105,
"memberof": "test/unit/util_spec.js~describe99.describe100",
"testDepth": 2,
"static": true,
"longname": "test/unit/util_spec.js~describe99.describe100.it105",
"access": null,
"description": "should display if left === right",
"lineNumber": 105
},
{
"__docId__": 222,
"kind": "test",
"name": "it106",
"testId": 106,
"memberof": "test/unit/util_spec.js~describe99.describe100",
"testDepth": 2,
"static": true,
"longname": "test/unit/util_spec.js~describe99.describe100.it106",
"access": null,
"description": "should display if left != right",
"lineNumber": 131
},
{
"__docId__": 223,
"kind": "test",
"name": "it107",
"testId": 107,
"memberof": "test/unit/util_spec.js~describe99.describe100",
"testDepth": 2,
"static": true,
"longname": "test/unit/util_spec.js~describe99.describe100.it107",
"access": null,
"description": "should display if left !== right",
"lineNumber": 157
},
{
"__docId__": 224,
"kind": "test",
"name": "it108",
"testId": 108,
"memberof": "test/unit/util_spec.js~describe99.describe100",
"testDepth": 2,
"static": true,
"longname": "test/unit/util_spec.js~describe99.describe100.it108",
"access": null,
"description": "should display if left > right",
"lineNumber": 183
},
{
"__docId__": 225,
"kind": "test",
"name": "it109",
"testId": 109,
"memberof": "test/unit/util_spec.js~describe99.describe100",
"testDepth": 2,
"static": true,
"longname": "test/unit/util_spec.js~describe99.describe100.it109",
"access": null,
"description": "should display if left >= right",
"lineNumber": 209
},
{
"__docId__": 226,
"kind": "test",
"name": "it110",
"testId": 110,
"memberof": "test/unit/util_spec.js~describe99.describe100",
"testDepth": 2,
"static": true,
"longname": "test/unit/util_spec.js~describe99.describe100.it110",
"access": null,
"description": "should display if left < right",
"lineNumber": 235
},
{
"__docId__": 227,
"kind": "test",
"name": "it111",
"testId": 111,
"memberof": "test/unit/util_spec.js~describe99.describe100",
"testDepth": 2,
"static": true,
"longname": "test/unit/util_spec.js~describe99.describe100.it111",
"access": null,
"description": "should display if left <= right",
"lineNumber": 261
},
{
"__docId__": 228,
"kind": "test",
"name": "it112",
"testId": 112,
"memberof": "test/unit/util_spec.js~describe99.describe100",
"testDepth": 2,
"static": true,
"longname": "test/unit/util_spec.js~describe99.describe100.it112",
"access": null,
"description": "should display if multiple comprisons are true",
"lineNumber": 287
},
{
"__docId__": 229,
"kind": "test",
"name": "it113",
"testId": 113,
"memberof": "test/unit/util_spec.js~describe99.describe100",
"testDepth": 2,
"static": true,
"longname": "test/unit/util_spec.js~describe99.describe100.it113",
"access": null,
"description": "should display if one or more using comparisonorprops comprisons are true",
"lineNumber": 313
},
{
"__docId__": 230,
"kind": "test",
"name": "describe114",
"testId": 114,
"memberof": "test/unit/util_spec.js~describe99",
"testDepth": 1,
"static": true,
"longname": "test/unit/util_spec.js~describe99.describe114",
"access": null,
"description": "getAdvancedBinding",
"lineNumber": 355
},
{
"__docId__": 231,
"kind": "test",
"name": "it115",
"testId": 115,
"memberof": "test/unit/util_spec.js~describe99.describe114",
"testDepth": 2,
"static": true,
"longname": "test/unit/util_spec.js~describe99.describe114.it115",
"access": null,
"description": "should return true if browser supports deep nesting",
"lineNumber": 357
},
{
"__docId__": 232,
"kind": "test",
"name": "it116",
"testId": 116,
"memberof": "test/unit/util_spec.js~describe99.describe114",
"testDepth": 2,
"static": true,
"longname": "test/unit/util_spec.js~describe99.describe114.it116",
"access": null,
"description": "should return false on all versions of IE/Trident",
"lineNumber": 365
},
{
"__docId__": 233,
"kind": "test",
"name": "it117",
"testId": 117,
"memberof": "test/unit/util_spec.js~describe99.describe114",
"testDepth": 2,
"static": true,
"longname": "test/unit/util_spec.js~describe99.describe114.it117",
"access": null,
"description": "should return false on old Android Browser",
"lineNumber": 373
},
{
"__docId__": 234,
"kind": "test",
"name": "it118",
"testId": 118,
"memberof": "test/unit/util_spec.js~describe99.describe114",
"testDepth": 2,
"static": true,
"longname": "test/unit/util_spec.js~describe99.describe114.it118",
"access": null,
"description": "should return false on old Chrome Browser",
"lineNumber": 381
},
{
"__docId__": 235,
"kind": "test",
"name": "it119",
"testId": 119,
"memberof": "test/unit/util_spec.js~describe99.describe114",
"testDepth": 2,
"static": true,
"longname": "test/unit/util_spec.js~describe99.describe114.it119",
"access": null,
"description": "should return false unknown browser",
"lineNumber": 389
},
{
"__docId__": 236,
"kind": "test",
"name": "describe120",
"testId": 120,
"memberof": "test/unit/util_spec.js~describe99",
"testDepth": 1,
"static": true,
"longname": "test/unit/util_spec.js~describe99.describe120",
"access": null,
"description": "traverse",
"lineNumber": 393
},
{
"__docId__": 237,
"kind": "test",
"name": "it121",
"testId": 121,
"memberof": "test/unit/util_spec.js~describe99.describe120",
"testDepth": 2,
"static": true,
"longname": "test/unit/util_spec.js~describe99.describe120.it121",
"access": null,
"description": "should return properties from an object from the array of paths",
"lineNumber": 406
},
{
"__docId__": 238,
"kind": "test",
"name": "it122",
"testId": 122,
"memberof": "test/unit/util_spec.js~describe99.describe120",
"testDepth": 2,
"static": true,
"longname": "test/unit/util_spec.js~describe99.describe120.it122",
"access": null,
"description": "should return the entire object if no paths provided",
"lineNumber": 410
},
{
"__docId__": 239,
"kind": "test",
"name": "it123",
"testId": 123,
"memberof": "test/unit/util_spec.js~describe99.describe120",
"testDepth": 2,
"static": true,
"longname": "test/unit/util_spec.js~describe99.describe120.it123",
"access": null,
"description": "should return undefined if paths are invalid",
"lineNumber": 414
},
{
"__docId__": 240,
"kind": "test",
"name": "it124",
"testId": 124,
"memberof": "test/unit/util_spec.js~describe99.describe120",
"testDepth": 2,
"static": true,
"longname": "test/unit/util_spec.js~describe99.describe120.it124",
"access": null,
"description": "should throw an error if paths are not an array of strings or numeric indexes",
"lineNumber": 418
},
{
"__docId__": 241,
"kind": "test",
"name": "describe125",
"testId": 125,
"memberof": "test/unit/util_spec.js~describe99",
"testDepth": 1,
"static": true,
"longname": "test/unit/util_spec.js~describe99.describe125",
"access": null,
"description": "validateRJX",
"lineNumber": 423
},
{
"__docId__": 242,
"kind": "test",
"name": "it126",
"testId": 126,
"memberof": "test/unit/util_spec.js~describe99.describe125",
"testDepth": 2,
"static": true,
"longname": "test/unit/util_spec.js~describe99.describe125.it126",
"access": null,
"description": "should return true if RJX is valid",
"lineNumber": 425
},
{
"__docId__": 243,
"kind": "test",
"name": "it127",
"testId": 127,
"memberof": "test/unit/util_spec.js~describe99.describe125",
"testDepth": 2,
"static": true,
"longname": "test/unit/util_spec.js~describe99.describe125.it127",
"access": null,
"description": "should return string and warn of invalid RJX props",
"lineNumber": 428
},
{
"__docId__": 244,
"kind": "test",
"name": "it128",
"testId": 128,
"memberof": "test/unit/util_spec.js~describe99.describe125",
"testDepth": 2,
"static": true,
"longname": "test/unit/util_spec.js~describe99.describe125.it128",
"access": null,
"description": "should throw a syntax error if RJX is missing a component",
"lineNumber": 435
},
{
"__docId__": 245,
"kind": "test",
"name": "it129",
"testId": 129,
"memberof": "test/unit/util_spec.js~describe99.describe125",
"testDepth": 2,
"static": true,
"longname": "test/unit/util_spec.js~describe99.describe125.it129",
"access": null,
"description": "should throw multiple errors if returnAllErrors is true",
"lineNumber": 440
},
{
"__docId__": 246,
"kind": "test",
"name": "it130",
"testId": 130,
"memberof": "test/unit/util_spec.js~describe99.describe125",
"testDepth": 2,
"static": true,
"longname": "test/unit/util_spec.js~describe99.describe125.it130",
"access": null,
"description": "should throw a type error if RJX props is not an object, props.children or props._children",
"lineNumber": 447
},
{
"__docId__": 247,
"kind": "test",
"name": "it131",
"testId": 131,
"memberof": "test/unit/util_spec.js~describe99.describe125",
"testDepth": 2,
"static": true,
"longname": "test/unit/util_spec.js~describe99.describe125.it131",
"access": null,
"description": "should throw a type error if RJX children is not an array or RJX docs or a string",
"lineNumber": 454
},
{
"__docId__": 248,
"kind": "test",
"name": "it132",
"testId": 132,
"memberof": "test/unit/util_spec.js~describe99.describe125",
"testDepth": 2,
"static": true,
"longname": "test/unit/util_spec.js~describe99.describe125.it132",
"access": null,
"description": "should validate child objects",
"lineNumber": 457
},
{
"__docId__": 249,
"kind": "test",
"name": "it133",
"testId": 133,
"memberof": "test/unit/util_spec.js~describe99.describe125",
"testDepth": 2,
"static": true,
"longname": "test/unit/util_spec.js~describe99.describe125.it133",
"access": null,
"description": "should validate dynamic props[asyncprops,resourceprops,thisprops,windowprops]",
"lineNumber": 475
},
{
"__docId__": 250,
"kind": "test",
"name": "it134",
"testId": 134,
"memberof": "test/unit/util_spec.js~describe99.describe125",
"testDepth": 2,
"static": true,
"longname": "test/unit/util_spec.js~describe99.describe125.it134",
"access": null,
"description": "should validate eval props[__dangerouslyEvalProps,__dangerouslyBindEvalProps]",
"lineNumber": 492
},
{
"__docId__": 251,
"kind": "test",
"name": "it135",
"testId": 135,
"memberof": "test/unit/util_spec.js~describe99.describe125",
"testDepth": 2,
"static": true,
"longname": "test/unit/util_spec.js~describe99.describe125.it135",
"access": null,
"description": "should validate __dangerouslyEvalProps javascript",
"lineNumber": 513
},
{
"__docId__": 252,
"kind": "test",
"name": "it136",
"testId": 136,
"memberof": "test/unit/util_spec.js~describe99.describe125",
"testDepth": 2,
"static": true,
"longname": "test/unit/util_spec.js~describe99.describe125.it136",
"access": null,
"description": "should validate __dangerouslyBindEvalProps as a function that can be bound javascript",
"lineNumber": 523
},
{
"__docId__": 253,
"kind": "test",
"name": "it137",
"testId": 137,
"memberof": "test/unit/util_spec.js~describe99.describe125",
"testDepth": 2,
"static": true,
"longname": "test/unit/util_spec.js~describe99.describe125.it137",
"access": null,
"description": "should validate __dangerouslyInsertComponents are valid RJX objects",
"lineNumber": 533
},
{
"__docId__": 254,
"kind": "test",
"name": "it138",
"testId": 138,
"memberof": "test/unit/util_spec.js~describe99.describe125",
"testDepth": 2,
"static": true,
"longname": "test/unit/util_spec.js~describe99.describe125.it138",
"access": null,
"description": "should validate __functionProps are valid function strings",
"lineNumber": 546
},
{
"__docId__": 255,
"kind": "test",
"name": "it139",
"testId": 139,
"memberof": "test/unit/util_spec.js~describe99.describe125",
"testDepth": 2,
"static": true,
"longname": "test/unit/util_spec.js~describe99.describe125.it139",
"access": null,
"description": "should validate __windowComponentProps is an object",
"lineNumber": 572
},
{
"__docId__": 256,
"kind": "test",
"name": "it140",
"testId": 140,
"memberof": "test/unit/util_spec.js~describe99.describe125",
"testDepth": 2,
"static": true,
"longname": "test/unit/util_spec.js~describe99.describe125.it140",
"access": null,
"description": "should validate __windowComponents are valid function strings",
"lineNumber": 588
},
{
"__docId__": 257,
"kind": "test",
"name": "it141",
"testId": 141,
"memberof": "test/unit/util_spec.js~describe99.describe125",
"testDepth": 2,
"static": true,
"longname": "test/unit/util_spec.js~describe99.describe125.it141",
"access": null,
"description": "should validate comparisonorprops is boolean",
"lineNumber": 614
},
{
"__docId__": 258,
"kind": "test",
"name": "it142",
"testId": 142,
"memberof": "test/unit/util_spec.js~describe99.describe125",
"testDepth": 2,
"static": true,
"longname": "test/unit/util_spec.js~describe99.describe125.it142",
"access": null,
"description": "should validate comparisonprops is an array of comaprisons",
"lineNumber": 628
},
{
"__docId__": 259,
"kind": "test",
"name": "it143",
"testId": 143,
"memberof": "test/unit/util_spec.js~describe99.describe125",
"testDepth": 2,
"static": true,
"longname": "test/unit/util_spec.js~describe99.describe125.it143",
"access": null,
"description": "should validate passprops is boolean",
"lineNumber": 654
},
{
"__docId__": 260,
"kind": "test",
"name": "describe144",
"testId": 144,
"memberof": "test/unit/util_spec.js~describe99",
"testDepth": 1,
"static": true,
"longname": "test/unit/util_spec.js~describe99.describe144",
"access": null,
"description": "validSimpleRJXSyntax",
"lineNumber": 669
},
{
"__docId__": 261,
"kind": "test",
"name": "it145",
"testId": 145,
"memberof": "test/unit/util_spec.js~describe99.describe144",
"testDepth": 2,
"static": true,
"longname": "test/unit/util_spec.js~describe99.describe144.it145",
"access": null,
"description": "should invalidate shorthard simple syntax",
"lineNumber": 671
},
{
"__docId__": 262,
"kind": "test",
"name": "it146",
"testId": 146,
"memberof": "test/unit/util_spec.js~describe99.describe144",
"testDepth": 2,
"static": true,
"longname": "test/unit/util_spec.js~describe99.describe144.it146",
"access": null,
"description": "should validate shorthard simple syntax",
"lineNumber": 714
},
{
"__docId__": 263,
"kind": "test",
"name": "describe147",
"testId": 147,
"memberof": "test/unit/util_spec.js~describe99",
"testDepth": 1,
"static": true,
"longname": "test/unit/util_spec.js~describe99.describe147",
"access": null,
"description": "simpleRJXSyntax",
"lineNumber": 754
},
{
"__docId__": 264,
"kind": "test",
"name": "it148",
"testId": 148,
"memberof": "test/unit/util_spec.js~describe99.describe147",
"testDepth": 2,
"static": true,
"longname": "test/unit/util_spec.js~describe99.describe147.it148",
"access": null,
"description": "should return valid RJX from simple RJX syntax",
"lineNumber": 756
},
{
"__docId__": 265,
"kind": "test",
"name": "it149",
"testId": 149,
"memberof": "test/unit/util_spec.js~describe99.describe147",
"testDepth": 2,
"static": true,
"longname": "test/unit/util_spec.js~describe99.describe147.it149",
"access": null,
"description": "should produce equivalent RXJ",
"lineNumber": 805
},
{
"__docId__": 266,
"kind": "test",
"name": "describe150",
"testId": 150,
"memberof": "test/unit/util_spec.js~describe99",
"testDepth": 1,
"static": true,
"longname": "test/unit/util_spec.js~describe99.describe150",
"access": null,
"description": "getSimplifiedRJX",
"lineNumber": 859
},
{
"__docId__": 267,
"kind": "test",
"name": "it151",
"testId": 151,
"memberof": "test/unit/util_spec.js~describe99.describe150",
"testDepth": 2,
"static": true,
"longname": "test/unit/util_spec.js~describe99.describe150.it151",
"access": null,
"description": "should produce equivalent SimpleRJX",
"lineNumber": 907
},
{
"__docId__": 268,
"kind": "test",
"name": "it152",
"testId": 152,
"memberof": "test/unit/util_spec.js~describe99.describe150",
"testDepth": 2,
"static": true,
"longname": "test/unit/util_spec.js~describe99.describe150.it152",
"access": null,
"description": "should return SimpleRJX if already simple",
"lineNumber": 912
}
]