@teleporthq/teleport-plugin-common 0.41.0 → 0.42.0

package/dist/esm/node-handlers/node-to-html/utils.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"utils.d.ts","sourceRoot":"","sources":["../../../../src/node-handlers/node-to-html/utils.ts"],"names":[],"mappings":"AAEA,OAAO,EAEL,mBAAmB,EACnB,QAAQ,EACR,kBAAkB,EAClB,yBAAyB,EACzB,eAAe,EAChB,MAAM,4BAA4B,CAAA;AACnC,OAAO,EAAE,4BAA4B,EAAE,kBAAkB,EAAE,MAAM,SAAS,CAAA;AAE1E,eAAO,MAAM,eAAe,aAChB,QAAQ,eACL,MAAM,WACV,MAAM,aACJ,kBAAkB,UACrB,4BAA4B,kBACpB,kBAAkB,QAC5B,eAAe,SAgDtB,CAAA;AAED,eAAO,MAAM,WAAW,aACZ,QAAQ,eACL,MAAM,YACT,MAAM,0BACQ,yBAAyB,EAAE,UAC3C,4BAA4B,kBACpB,kBAAkB,SAiCnC,CAAA;AAED,eAAO,MAAM,0BAA0B,SAAU,mBAAmB,KAAG,MAWtE,CAAA"}
+{"version":3,"file":"utils.d.ts","sourceRoot":"","sources":["../../../../src/node-handlers/node-to-html/utils.ts"],"names":[],"mappings":"AAEA,OAAO,EAEL,mBAAmB,EACnB,QAAQ,EACR,kBAAkB,EAClB,yBAAyB,EACzB,eAAe,EAGhB,MAAM,4BAA4B,CAAA;AACnC,OAAO,EAAE,4BAA4B,EAAE,kBAAkB,EAAE,MAAM,SAAS,CAAA;AAI1E,eAAO,MAAM,eAAe,aAChB,QAAQ,eACL,MAAM,WACV,MAAM,aACJ,kBAAkB,UACrB,4BAA4B,kBACpB,kBAAkB,QAC5B,eAAe,SA6EtB,CAAA;AAED,eAAO,MAAM,WAAW,aACZ,QAAQ,eACL,MAAM,YACT,MAAM,0BACQ,yBAAyB,EAAE,UAC3C,4BAA4B,kBACpB,kBAAkB,SAiCnC,CAAA;AAED,eAAO,MAAM,0BAA0B,SAAU,mBAAmB,KAAG,MAkBtE,CAAA"}

package/dist/esm/node-handlers/node-to-html/utils.js

@@ -1,5 +1,7 @@
 import * as hastUtils from '../../utils/hast-utils';
 import { StringUtils } from '@teleporthq/teleport-shared';
+import { createHTMLNode } from '../../builders/hast-builders';
+import generateElementNode from '../node-to-html';
 export var handleAttribute = function (htmlNode, elementName, attrKey, attrValue, params, templateSyntax, node) {
     var dataObject = params.dataObject;
     var dynamicAttrKey = templateSyntax.valueBinding(attrKey, node);
@@ -35,6 +37,27 @@ export var handleAttribute = function (htmlNode, elementName, attrKey, attrValue
                 hastUtils.addAttributeToNode(htmlNode, dynamicAttrKey, attrValue.content.toString());
             }
             break;
+        case 'element':
+            var templateNode = createHTMLNode(templateSyntax.slotTagName);
+            var templateContent = generateElementNode(attrValue, params, templateSyntax);
+            if (templateSyntax.slotBinding === 'v-slot') {
+                hastUtils.addBooleanAttributeToNode(templateNode, "".concat(templateSyntax.slotBinding, ":").concat(attrKey));
+            }
+            else {
+                hastUtils.addBooleanAttributeToNode(templateNode, "".concat(templateSyntax.slotBinding).concat(attrKey));
+            }
+            hastUtils.addChildNode(templateNode, templateContent);
+            hastUtils.addChildNode(htmlNode, templateNode);
+            break;
+        case 'object': {
+            dataObject[attrKey] = attrValue.content;
+            hastUtils.addAttributeToNode(htmlNode, dynamicAttrKey, attrKey);
+            break;
+        }
+        case 'expr':
+            // TODO: Check this in the future. Not throwing an error for now
+            console.info("Expressions are not supported in HTML templates");
+            break;
         default:
             throw new Error("generateElementNode could not generate code for attribute of type ".concat(JSON.stringify(attrValue)));
     }
@@ -66,11 +89,17 @@ export var handleEvent = function (htmlNode, elementName, eventKey, eventHandler
 export var createConditionalStatement = function (node) {
     var _a = node.content, childNode = _a.node, reference = _a.reference, value = _a.value, condition = _a.condition;
     var expression = standardizeUIDLConditionalExpression(value, condition);
-    var statement = createConditional(reference.content.id, expression);
-    if (childNode.type === 'conditional') {
-        return "".concat(statement, " && ").concat(createConditionalStatement(childNode));
+    if (reference.type === 'dynamic') {
+        var statement = createConditional(reference.content.id, expression);
+        if (childNode.type === 'conditional') {
+            return "".concat(statement, " && ").concat(createConditionalStatement(childNode));
+        }
+        return statement;
+    }
+    // expression nodes are not supported in html based templates.
+    if (reference.type === 'expr') {
+        return '';
     }
-    return statement;
 };
 var standardizeUIDLConditionalExpression = function (value, condition) {
     var conditionalExpression = value !== null && value !== undefined
@@ -87,6 +116,9 @@ var createConditional = function (conditionalKey, conditionalExpression) {
     }
     var stringConditions = conditions.map(function (_a) {
         var operation = _a.operation, operand = _a.operand;
+        // @todo
+        // unlike jsx code generation, we are not converting the operand to binary or unary operation.
+        // Please refer to https://github.com/teleporthq/teleport-code-generators/blob/development/packages/teleport-plugin-common/src/node-handlers/node-to-jsx/utils.ts#L303-L319
         return "(".concat(stringifyConditionalExpression(conditionalKey, operation, operand), ")");
     });
     var joinOperator = matchingCriteria === 'all' ? '&&' : '||';
@@ -99,6 +131,15 @@ var stringifyConditionalExpression = function (identifier, operation, value) {
     if (typeof value === 'string') {
         return "".concat(identifier, " ").concat(operation, " '").concat(value, "'");
     }
+    if (typeof value === 'number') {
+        return "".concat(identifier, " ").concat(operation, " ").concat(value);
+    }
+    if (value.type === 'dynamic') {
+        return "".concat(identifier, " ").concat(operation, " ").concat(value.content.id);
+    }
+    if (value.type === 'expr') {
+        return "".concat(identifier, " ").concat(operation, " ").concat(value.content);
+    }
     return "".concat(identifier, " ").concat(operation, " ").concat(value);
 };
 //# sourceMappingURL=utils.js.map

package/dist/esm/node-handlers/node-to-html/utils.js.map

@@ -1 +1 @@
-{"version":3,"file":"utils.js","sourceRoot":"","sources":["../../../../src/node-handlers/node-to-html/utils.ts"],"names":[],"mappings":"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"}
+{"version":3,"file":"utils.js","sourceRoot":"","sources":["../../../../src/node-handlers/node-to-html/utils.ts"],"names":[],"mappings":"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"}

package/dist/esm/node-handlers/node-to-jsx/index.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../src/node-handlers/node-to-jsx/index.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,cAAc,CAAA;AACrC,OAAO,EACL,eAAe,EAWhB,MAAM,4BAA4B,CAAA;AAEnC,OAAO,EAAoB,SAAS,EAAE,MAAM,SAAS,CAAA;AAuBrD,QAAA,MAAM,mBAAmB,EAAE,SAAS,CAAC,eAAe,EAAE,KAAK,CAAC,UAAU,CAqHrE,CAAA;AAED,eAAe,mBAAmB,CAAA"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../src/node-handlers/node-to-jsx/index.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,cAAc,CAAA;AACrC,OAAO,EACL,eAAe,EAehB,MAAM,4BAA4B,CAAA;AAEnC,OAAO,EAA+D,SAAS,EAAE,MAAM,SAAS,CAAA;AA2GhG,QAAA,MAAM,mBAAmB,EAAE,SAAS,CAAC,eAAe,EAAE,KAAK,CAAC,UAAU,CAgGrE,CAAA;AAED,eAAe,mBAAmB,CAAA"}

package/dist/esm/node-handlers/node-to-jsx/index.js

@@ -9,19 +9,100 @@ var __assign = (this && this.__assign) || function () {
     };
     return __assign.apply(this, arguments);
 };
+var __spreadArray = (this && this.__spreadArray) || function (to, from, pack) {
+    if (pack || arguments.length === 2) for (var i = 0, l = from.length, ar; i < l; i++) {
+        if (ar || !(i in from)) {
+            if (!ar) ar = Array.prototype.slice.call(from, 0, i);
+            ar[i] = from[i];
+        }
+    }
+    return to.concat(ar || Array.prototype.slice.call(from));
+};
 import * as types from '@babel/types';
 import { UIDLUtils, StringUtils } from '@teleporthq/teleport-shared';
 import { addEventHandlerToTag, createConditionIdentifier, createDynamicValueExpression, createConditionalJSXExpression, getRepeatSourceIdentifier, } from './utils';
-import { addChildJSXText, addChildJSXTag, addAttributeToJSXTag, addDynamicAttributeToJSXTag, addRawAttributeToJSXTag, generateDynamicWindowImport, addDynamicExpressionAttributeToJSXTag, resolveObjectValue, } from '../../utils/ast-utils';
+import { addChildJSXText, addChildJSXTag, addAttributeToJSXTag, addDynamicAttributeToJSXTag, addRawAttributeToJSXTag, generateDynamicWindowImport, addDynamicExpressionAttributeToJSXTag, resolveObjectValue, objectToObjectExpression, } from '../../utils/ast-utils';
 import { createJSXTag, createSelfClosingJSXTag } from '../../builders/ast-builders';
 import { DEFAULT_JSX_OPTIONS } from './constants';
 import { ASTBuilders, ASTUtils } from '../..';
+var getElementType = function (node) {
+    if (node.type === 'element' &&
+        node.content &&
+        typeof node.content === 'object' &&
+        'elementType' in node.content) {
+        return node.content.elementType;
+    }
+    if ((node.type === 'data-source-list' || node.type === 'data-source-item') && node.content) {
+        return node.content.elementType || 'DataProvider';
+    }
+    return null;
+};
+var getClassName = function (node) {
+    if (node.type === 'element' &&
+        node.content &&
+        typeof node.content === 'object' &&
+        'key' in node.content) {
+        return node.content.key || null;
+    }
+    return null;
+};
+var reorderChildrenForSearch = function (children) {
+    var searchNodes = [];
+    var dataProviderNodes = [];
+    var paginationNodes = [];
+    var otherNodes = [];
+    children.forEach(function (child) {
+        var elementType = getElementType(child);
+        var nodeType = child.type;
+        var className = getClassName(child);
+        // Check for search nodes - use className since elementType is replaced by semanticType
+        if (className &&
+            (className.includes('data-source-search') || className.includes('search-node'))) {
+            searchNodes.push(child);
+        }
+        // Check for DataProvider nodes - these should appear SECOND
+        else if (nodeType === 'data-source-list' ||
+            nodeType === 'data-source-item' ||
+            elementType === 'DataProvider') {
+            dataProviderNodes.push(child);
+        }
+        // Check for pagination nodes - use className since elementType is replaced by semanticType
+        else if ((elementType &&
+            (elementType.includes('pagination') || elementType.includes('cms-pagination'))) ||
+            (className && (className.includes('pagination') || className.includes('cms-pagination')))) {
+            paginationNodes.push(child);
+        }
+        // Everything else goes in the middle
+        else {
+            otherNodes.push(child);
+        }
+    });
+    // Only reorder if we have search or pagination nodes alongside a DataProvider
+    // This ensures we only reorder when there's an actual pagination/search group
+    // If there's no search/pagination, keep original order to preserve DataProvider positions
+    var hasSearchOrPagination = searchNodes.length > 0 || paginationNodes.length > 0;
+    var hasDataProvider = dataProviderNodes.length > 0;
+    if (hasSearchOrPagination && hasDataProvider) {
+        // Order: search nodes first, then data providers, then other nodes, then pagination last
+        // This ensures: search input -> DataProvider -> content -> pagination buttons
+        return __spreadArray(__spreadArray(__spreadArray(__spreadArray([], searchNodes, true), dataProviderNodes, true), otherNodes, true), paginationNodes, true);
+    }
+    else {
+        // No reordering needed - preserve original order
+        return children;
+    }
+};
 var generateElementNode = function (node, params, jsxOptions) {
-    var dependencies = params.dependencies, nodesLookup = params.nodesLookup, _a = params.projectResources, projectResources = _a === void 0 ? {} : _a;
-    var options = __assign(__assign(__assign({}, DEFAULT_JSX_OPTIONS), jsxOptions), { projectResources: projectResources });
-    var _b = node.content, elementType = _b.elementType, selfClosing = _b.selfClosing, children = _b.children, key = _b.key, attrs = _b.attrs, dependency = _b.dependency, events = _b.events;
+    var dependencies = params.dependencies, nodesLookup = params.nodesLookup;
+    var options = __assign(__assign({}, DEFAULT_JSX_OPTIONS), jsxOptions);
+    var _a = node.content, elementType = _a.elementType, selfClosing = _a.selfClosing, children = _a.children, key = _a.key, attrs = _a.attrs, dependency = _a.dependency, events = _a.events;
     var originalElementName = elementType || 'component';
     var tagName = originalElementName;
+    // Check if this is a fragment element - normalize to Fragment before processing
+    var isFragment = tagName.toLowerCase() === 'fragment';
+    if (isFragment) {
+        tagName = 'Fragment';
+    }
     if (dependency) {
         if (options.dependencyHandling === 'import' ||
             (options.dependencyHandling === 'ignore' && (dependency === null || dependency === void 0 ? void 0 : dependency.type) === 'package')) {
@@ -40,40 +121,25 @@ var generateElementNode = function (node, params, jsxOptions) {
             params.windowImports[dependency.path] = dynamicWindowImport;
         }
     }
+    else if (isFragment) {
+        // If no dependency was provided but this is a fragment, add Fragment dependency
+        if (options.dependencyHandling === 'import') {
+            dependencies.Fragment = {
+                type: 'package',
+                path: 'react',
+                version: 'latest',
+                meta: {
+                    namedImport: true,
+                },
+            };
+        }
+    }
     var elementName = dependency && dependency.type === 'local' && options.customElementTag
         ? options.customElementTag(tagName)
         : tagName;
     var elementTag = selfClosing ? createSelfClosingJSXTag(elementName) : createJSXTag(elementName);
     if (attrs) {
-        Object.keys(attrs).forEach(function (attrKey) {
-            var attributeValue = attrs[attrKey];
-            switch (attributeValue.type) {
-                case 'dynamic':
-                    var referenceType = attributeValue.content.referenceType;
-                    switch (referenceType) {
-                        default:
-                            var prefix = options.dynamicReferencePrefixMap[referenceType];
-                            addDynamicAttributeToJSXTag(elementTag, attrKey, attributeValue.content.id, prefix);
-                            break;
-                    }
-                    break;
-                case 'import':
-                    addDynamicAttributeToJSXTag(elementTag, attrKey, attributeValue.content.id);
-                    break;
-                case 'raw':
-                    addRawAttributeToJSXTag(elementTag, attrKey, attributeValue);
-                    break;
-                case 'comp-style':
-                case 'static':
-                    addAttributeToJSXTag(elementTag, attrKey, attributeValue.content);
-                    break;
-                case 'expr':
-                    addDynamicExpressionAttributeToJSXTag(elementTag, attributeValue, attrKey);
-                    break;
-                default:
-                    throw new Error("generateElementNode could not generate code for attribute of type ".concat(JSON.stringify(attributeValue)));
-            }
-        });
+        addAttributesToJSXTag(attrs, elementTag, options, params);
     }
     if (events) {
         Object.keys(events).forEach(function (eventKey) {
@@ -81,7 +147,9 @@ var generateElementNode = function (node, params, jsxOptions) {
         });
     }
     if (!selfClosing && children) {
-        children.forEach(function (child) {
+        // Reorder children to ensure search nodes appear before DataProvider nodes
+        var reorderedChildren = reorderChildrenForSearch(children);
+        reorderedChildren.forEach(function (child) {
             var childTags = generateNode(child, params, options);
             childTags.forEach(function (childTag) {
                 if (typeof childTag === 'string') {
@@ -100,6 +168,52 @@ var generateElementNode = function (node, params, jsxOptions) {
     return elementTag;
 };
 export default generateElementNode;
+var addAttributesToJSXTag = function (attrs, elementTag, options, params) {
+    Object.keys(attrs !== null && attrs !== void 0 ? attrs : {}).forEach(function (attrKey) {
+        var attributeValue = attrs[attrKey];
+        if (!attributeValue.type) {
+            return;
+        }
+        switch (attributeValue.type) {
+            case 'dynamic':
+                var referenceType = attributeValue.content.referenceType;
+                switch (referenceType) {
+                    default:
+                        var prefix = options.dynamicReferencePrefixMap[referenceType];
+                        addDynamicAttributeToJSXTag(elementTag, attrKey, attributeValue.content.id, prefix);
+                        break;
+                }
+                break;
+            case 'import':
+                addDynamicAttributeToJSXTag(elementTag, attrKey, attributeValue.content.id);
+                break;
+            case 'raw':
+                addRawAttributeToJSXTag(elementTag, attrKey, attributeValue);
+                break;
+            case 'comp-style':
+            case 'static':
+                addAttributeToJSXTag(elementTag, attrKey, attributeValue.content);
+                break;
+            case 'expr':
+                addDynamicExpressionAttributeToJSXTag(elementTag, attributeValue, attrKey);
+                break;
+            case 'element':
+                addAttributeToJSXTag(elementTag, attrKey, generateElementNode(attributeValue, params, options));
+                break;
+            case 'object': {
+                var content = attributeValue.content;
+                if (typeof content !== 'object') {
+                    return;
+                }
+                var expression = objectToObjectExpression(content);
+                elementTag.openingElement.attributes.push(types.jsxAttribute(types.jsxIdentifier(attrKey), types.jsxExpressionContainer(expression)));
+                break;
+            }
+            default:
+                throw new Error("generateElementNode could not generate code for attribute of type ".concat(JSON.stringify(attributeValue)));
+        }
+    });
+};
 var generateNode = function (node, params, options) {
     switch (node.type) {
         case 'expr':
@@ -112,25 +226,80 @@ var generateNode = function (node, params, options) {
             ];
         case 'inject':
             if (node === null || node === void 0 ? void 0 : node.dependency) {
-                /* tslint:disable:no-string-literal */
-                params.dependencies['Script'] = node.dependency;
+                params.dependencies.Script = node.dependency;
             }
             return [node.content.toString()];
         case 'static':
             return [StringUtils.encode(node.content.toString())];
         case 'dynamic':
-            return [createDynamicValueExpression(node, options, undefined)];
+            switch (node.content.referenceType) {
+                case 'prop': {
+                    // If the dynamic node is a prop and has a default value of type UIDLElementNode,
+                    // we should use it with a logical expression.
+                    var prop = params.propDefinitions[node.content.id];
+                    if ((prop === null || prop === void 0 ? void 0 : prop.type) === 'element' && prop.defaultValue) {
+                        var prefix = options.dynamicReferencePrefixMap[node.content.referenceType] || '';
+                        var propDefault = prop.defaultValue;
+                        var jsxNode = params.nodesLookup[propDefault.content.key];
+                        if (jsxNode === undefined) {
+                            throw Error("Prop ".concat(node.content.id, " is of type element \n\n              The JSXNode of the prop-").concat(node.content.id, " is missing from the nodesLookup"));
+                        }
+                        return [
+                            types.logicalExpression('??', prefix === ''
+                                ? types.identifier(node.content.id)
+                                : types.memberExpression(types.identifier(prefix), types.identifier(node.content.id)), jsxNode),
+                        ];
+                    }
+                    return [createDynamicValueExpression(node, options)];
+                }
+                case 'locale': {
+                    // Locale is not handled the same in all frameworks.
+                    // So, we need to handle it differently using individual plugins for each framework.
+                    var emptyExpression = types.jsxEmptyExpression();
+                    emptyExpression.innerComments = [
+                        {
+                            type: 'CommentBlock',
+                            value: "locale-".concat(node.content.id),
+                        },
+                    ];
+                    var expression = types.jsxExpressionContainer(emptyExpression);
+                    var jsxTag = createJSXTag('span');
+                    addChildJSXTag(jsxTag, expression);
+                    params.localeReferences.push(jsxTag);
+                    return [jsxTag];
+                }
+                case 'global': {
+                    params.globalReferences.push(node.content.id);
+                    return [createDynamicValueExpression(node, options)];
+                }
+                default:
+                    return [createDynamicValueExpression(node, options)];
+            }
         case 'cms-item':
         case 'cms-list':
             return generateCMSNode(node, params, options);
+        case 'cms-list-repeater':
+            return generateCMSListRepeaterNode(node, params, options);
+        case 'cms-mixed-type':
+            return generateCMSMixedTypeNode(node, params, options);
+        case 'data-source-item':
+        case 'data-source-list':
+            return generateDataSourceNode(node, params, options);
         case 'element':
+            // Check if this element node is wrapping a data-source node
+            if (node.content &&
+                typeof node.content === 'object' &&
+                'type' in node.content &&
+                (node.content.type === 'data-source-item' || node.content.type === 'data-source-list')) {
+                // Treat it as a data-source node
+                // tslint:disable-next-line:no-any
+                return generateDataSourceNode(node.content, params, options);
+            }
             return [generateElementNode(node, params, options)];
         case 'repeat':
             return generateRepeatNode(node, params, options);
         case 'conditional':
             return generateConditionalNode(node, params, options);
-        case 'cms-list-repeater':
-            return generateCMSListRepeaterNode(node, params, options);
         case 'slot':
             if (options.slotHandling === 'native') {
                 return [generateNativeSlotNode(node, params, options)];
@@ -144,7 +313,33 @@ var generateNode = function (node, params, options) {
 };
 var generateExpressionNode = function (node) {
     var expression = ASTUtils.getExpressionFromUIDLExpressionNode(node);
-    return types.jsxExpressionContainer(expression);
+    // Wrap expression to safely handle objects/arrays: (typeof val === 'object' && val !== null) ? JSON.stringify(val) : val
+    var safeExpression = types.conditionalExpression(types.logicalExpression('&&', types.binaryExpression('===', types.unaryExpression('typeof', expression, true), types.stringLiteral('object')), types.binaryExpression('!==', expression, types.nullLiteral())), types.callExpression(types.memberExpression(types.identifier('JSON'), types.identifier('stringify')), [expression]), expression);
+    return types.jsxExpressionContainer(safeExpression);
+};
+var generateCMSMixedTypeNode = function (node, params, options) {
+    var _a = node.content, _b = _a.nodes, error = _b.error, fallback = _b.fallback, elementType = _a.elementType, renderPropIdentifier = _a.renderPropIdentifier, _c = _a.mappings, mappings = _c === void 0 ? {} : _c, attrs = _a.attrs, dependency = _a.dependency;
+    var jsxTag = StringUtils.dashCaseToUpperCamelCase(elementType);
+    var cmsMixedNode = ASTBuilders.createJSXTag(jsxTag, [], true);
+    var mappingsObject = [];
+    if (attrs) {
+        addAttributesToJSXTag(attrs, cmsMixedNode, options, params);
+    }
+    if (dependency) {
+        params.dependencies[elementType] = dependency;
+    }
+    Object.keys(mappings).forEach(function (key) {
+        var element = generateElementNode(mappings[key], params, options);
+        mappingsObject.push(types.objectProperty(types.identifier("\"".concat(key, "\"")), types.arrowFunctionExpression([types.identifier(renderPropIdentifier)], element)));
+    });
+    cmsMixedNode.openingElement.attributes.push(types.jsxAttribute(types.jsxIdentifier('mappingConfiguration'), types.jsxExpressionContainer(types.objectExpression(mappingsObject))));
+    if (fallback) {
+        cmsMixedNode.openingElement.attributes.push(types.jSXAttribute(types.jsxIdentifier('renderDefault'), types.jsxExpressionContainer(types.arrowFunctionExpression([types.identifier(renderPropIdentifier)], generateElementNode(fallback, params, options)))));
+    }
+    if (error) {
+        cmsMixedNode.openingElement.attributes.push(types.jSXAttribute(types.jsxIdentifier('renderError'), types.jsxExpressionContainer(types.arrowFunctionExpression([types.identifier(renderPropIdentifier)], generateElementNode(error, params, options)))));
+    }
+    return [cmsMixedNode];
 };
 var generateCMSNode = function (node, params, options) {
     var _a = node.content, initialData = _a.initialData, key = _a.key, renderPropIdentifier = _a.renderPropIdentifier, _b = _a.resource, _c = _b === void 0 ? {} : _b, resourceParams = _c.params, router = _a.router, elementType = _a.elementType, dependency = _a.dependency;
@@ -210,6 +405,72 @@ var generateCMSNode = function (node, params, options) {
     params.nodesLookup[key] = cmsNode;
     return [cmsNode];
 };
+var generateDataSourceNode = function (node, params, options) {
+    var _a, _b, _c, _d;
+    var _e = node.content, renderPropIdentifier = _e.renderPropIdentifier, elementType = _e.elementType, dependency = _e.dependency, resourceDefinition = _e.resourceDefinition;
+    var key = node.content.key || "ds-".concat(resourceDefinition.dataSourceId, "-").concat(Date.now());
+    var name = node.content.name || renderPropIdentifier;
+    // tslint:disable-next-line:no-any
+    var children = node.content.children && node.content.children.length > 0
+        ? node.content.children
+        : ((_a = node.content.nodes) === null || _a === void 0 ? void 0 : _a.success)
+            ? [node.content.nodes.success]
+            : [];
+    var jsxTag = StringUtils.dashCaseToUpperCamelCase(elementType);
+    if (dependency && options.dependencyHandling === 'import') {
+        params.dependencies[elementType] = dependency;
+    }
+    var dataSourceNode = ASTBuilders.createJSXTag(jsxTag, [], true);
+    dataSourceNode.openingElement.attributes.push(types.jsxAttribute(types.jsxIdentifier('resourceDefinition'), types.jsxExpressionContainer(types.objectExpression([
+        types.objectProperty(types.stringLiteral('type'), types.stringLiteral('external-data-source')),
+        types.objectProperty(types.stringLiteral('dataSourceId'), types.stringLiteral(resourceDefinition.dataSourceId)),
+        types.objectProperty(types.stringLiteral('tableName'), types.stringLiteral(resourceDefinition.tableName)),
+        types.objectProperty(types.stringLiteral('dataSourceType'), types.stringLiteral(resourceDefinition.dataSourceType)),
+    ]))));
+    dataSourceNode.openingElement.attributes.push(types.jsxAttribute(types.jsxIdentifier('name'), types.jsxExpressionContainer(types.stringLiteral(name))));
+    if (children && children.length > 0) {
+        var childrenNodes = children.flatMap(function (child) { return generateNode(child, params, options); });
+        var renderFunction = types.arrowFunctionExpression([types.identifier(renderPropIdentifier)], types.jsxFragment(types.jsxOpeningFragment(), types.jsxClosingFragment(), childrenNodes));
+        dataSourceNode.openingElement.attributes.push(types.jsxAttribute(types.jsxIdentifier('renderSuccess'), types.jsxExpressionContainer(renderFunction)));
+    }
+    // tslint:disable-next-line:no-any
+    if ((_b = node.content.nodes) === null || _b === void 0 ? void 0 : _b.loading) {
+        // tslint:disable-next-line:no-any
+        var loadingNode = generateNode(node.content.nodes.loading, params, options)[0];
+        dataSourceNode.openingElement.attributes.push(types.jsxAttribute(types.jsxIdentifier('renderLoading'), types.jsxExpressionContainer(types.arrowFunctionExpression([], loadingNode))));
+    }
+    // tslint:disable-next-line:no-any
+    if ((_c = node.content.nodes) === null || _c === void 0 ? void 0 : _c.error) {
+        // tslint:disable-next-line:no-any
+        var errorNode = generateNode(node.content.nodes.error, params, options)[0];
+        dataSourceNode.openingElement.attributes.push(types.jsxAttribute(types.jsxIdentifier('renderError'), types.jsxExpressionContainer(types.arrowFunctionExpression([], errorNode))));
+    }
+    // Add resource params if they exist
+    // tslint:disable-next-line:no-any
+    var resourceParams = (_d = node.content.resource) === null || _d === void 0 ? void 0 : _d.params;
+    if (resourceParams && Object.keys(resourceParams).length > 0) {
+        var nodeParams = Object.keys(resourceParams).reduce(function (acc, attrKey) {
+            var property = resourceParams[attrKey];
+            if (property.type === 'static') {
+                acc.push(types.objectProperty(types.stringLiteral(attrKey), resolveObjectValue(property)));
+            }
+            if (property.type === 'expr') {
+                var expression = ASTUtils.getExpressionFromUIDLExpressionNode(property);
+                acc.push(types.objectProperty(types.stringLiteral(attrKey), expression));
+            }
+            if (property.type === 'dynamic') {
+                var refType = property.content.referenceType;
+                acc.push(types.objectProperty(types.stringLiteral(attrKey), property.content.referenceType === 'prop'
+                    ? types.memberExpression(types.identifier(options.dynamicReferencePrefixMap[refType]), types.identifier(property.content.id))
+                    : types.identifier(property.content.id)));
+            }
+            return acc;
+        }, []);
+        dataSourceNode.openingElement.attributes.push(types.jsxAttribute(types.jsxIdentifier('params'), types.jsxExpressionContainer(types.objectExpression(nodeParams))));
+    }
+    params.nodesLookup[key] = dataSourceNode;
+    return [dataSourceNode];
+};
 var generateRepeatNode = function (node, params, options) {
     var _a = node.content, repeatContent = _a.node, dataSource = _a.dataSource, meta = _a.meta;
     var contentASTs = generateNode(repeatContent, params, options);
@@ -231,22 +492,42 @@ var generateRepeatNode = function (node, params, options) {
 };
 var generateConditionalNode = function (node, params, options) {
     var _a = node.content, reference = _a.reference, value = _a.value;
-    var conditionIdentifier = createConditionIdentifier(reference, params, options);
     var subTrees = generateNode(node.content.node, params, options);
     var condition = value !== undefined && value !== null
         ? { conditions: [{ operand: value, operation: '===' }] }
         : node.content.condition;
-    return subTrees.map(function (subTree) {
+    var conditionIdentifier = createConditionIdentifier(reference, params, options);
+    var conditionalExpressions = subTrees.map(function (subTree) {
         return createConditionalJSXExpression(subTree, condition, conditionIdentifier);
     });
+    return conditionalExpressions;
 };
 var generateCMSListRepeaterNode = function (node, params, options) {
-    var repeaterNode = ASTBuilders.createJSXTag('Repeater', [], true);
-    repeaterNode.openingElement.attributes.push(types.jsxAttribute(types.jsxIdentifier('items'), types.jsxExpressionContainer(types.identifier('params'))));
-    repeaterNode.openingElement.attributes.push(types.jsxAttribute(types.jSXIdentifier('renderItem'), types.jsxExpressionContainer(types.arrowFunctionExpression([types.identifier(node.content.renderPropIdentifier)], generateNode(node.content.nodes.list, params, options)[0]))));
+    var _a, _b;
+    var jsxTag = StringUtils.dashCaseToUpperCamelCase(node.content.elementType);
+    var repeaterNode = ASTBuilders.createJSXTag(jsxTag, [], true);
+    repeaterNode.openingElement.attributes.push(types.jsxAttribute(types.jsxIdentifier('items'), types.jsxExpressionContainer(types.identifier((_a = node.content.source) !== null && _a !== void 0 ? _a : 'params'))));
+    var listElement = generateNode(node.content.nodes.list, params, __assign(__assign({}, options), { localIdentifier: node.content.renderPropIdentifier }))[0];
+    // Create key as template literal: `${item?.id}${index}`
+    var keyAttribute = types.jsxAttribute(types.jsxIdentifier('key'), types.jsxExpressionContainer(types.templateLiteral([
+        types.templateElement({ raw: '', cooked: '' }, false),
+        types.templateElement({ raw: '', cooked: '' }, false),
+        types.templateElement({ raw: '', cooked: '' }, true),
+    ], [
+        types.optionalMemberExpression(types.identifier(node.content.renderPropIdentifier), types.identifier('id'), false, true),
+        types.identifier('index'),
+    ])));
+    listElement.openingElement.attributes.push(keyAttribute);
+    repeaterNode.openingElement.attributes.push(types.jsxAttribute(types.jSXIdentifier('renderItem'), types.jsxExpressionContainer(types.arrowFunctionExpression([types.identifier(node.content.renderPropIdentifier), types.identifier('index')], listElement))));
     if ('empty' in node.content.nodes) {
         repeaterNode.openingElement.attributes.push(types.jsxAttribute(types.jsxIdentifier('renderEmpty'), types.jsxExpressionContainer(types.arrowFunctionExpression([], generateNode(node.content.nodes.empty, params, options)[0]))));
     }
+    if ('loading' in node.content.nodes) {
+        generateNode(node.content.nodes.loading, params, options);
+    }
+    if (((_b = node.content) === null || _b === void 0 ? void 0 : _b.dependency) && options.dependencyHandling === 'import') {
+        params.dependencies[jsxTag] = node.content.dependency;
+    }
     return [repeaterNode];
 };
 var generatePropsSlotNode = function (node, params, options) {