@teleporthq/teleport-plugin-common 0.42.35 → 0.43.0

package/dist/cjs/utils/ast-utils.js

@@ -35,12 +35,38 @@ var __importDefault = (this && this.__importDefault) || function (mod) {
     return (mod && mod.__esModule) ? mod : { "default": mod };
 };
 Object.defineProperty(exports, "__esModule", { value: true });
-exports.convertToUnaryOperator = exports.convertToBinaryOperator = exports.isJSXElement = exports.getExpressionFromUIDLExpressionNode = exports.convertFilterDestinationToExpression = exports.isUIDLDynamicReference = exports.resolveObjectValue = exports.computeFetchUrl = exports.generateURLParamsAST = exports.generateMemberExpressionASTFromPath = exports.parseValuePath = exports.generateMemberExpressionASTFromBase = exports.generateRemoteResourceASTs = exports.wrapObjectPropertiesWithExpression = exports.generateDynamicWindowImport = exports.createStateHookAST = exports.createReturnExpressionSyntax = exports.createPureComponent = exports.createClassComponent = exports.removeAttributeByName = exports.findAttributeByName = exports.getTSAnnotationForType = exports.addPropertyToASTObject = exports.convertValueToLiteral = exports.objectToObjectExpression = exports.renameJSXTag = exports.addSpreadAttributeToJSXTag = exports.addChildJSXText = exports.addChildJSXTag = exports.addRawAttributeToJSXTag = exports.addAttributeToJSXTag = exports.stringAsTemplateLiteral = exports.addMultipleDynamicAttributesToJSXTag = exports.addDynamicExpressionAttributeToJSXTag = exports.addDynamicAttributeToJSXTag = exports.addClassStringOnJSXTag = void 0;
+exports.convertToUnaryOperator = exports.convertToBinaryOperator = exports.isJSXElement = exports.getExpressionFromUIDLExpressionNode = exports.convertFilterDestinationToExpression = exports.isUIDLDynamicReference = exports.resolveObjectValue = exports.computeFetchUrl = exports.generateURLParamsAST = exports.generateMemberExpressionASTFromPath = exports.parseValuePath = exports.generateMemberExpressionASTFromBase = exports.generateRemoteResourceASTs = exports.wrapObjectPropertiesWithExpression = exports.generateDynamicWindowImport = exports.collectGlobalStateReferencesFromObjectStates = exports.collectGlobalReferencesFromObjectStates = exports.resolveGlobalRefId = exports.GLOBAL_REF_ID_MAP = exports.convertObjectStateDefaultToExpression = exports.isObjectStateWithEntries = exports.createStateHookAST = exports.createReturnExpressionSyntax = exports.createPureComponent = exports.createClassComponent = exports.removeAttributeByName = exports.findAttributeByName = exports.getTSAnnotationForType = exports.addPropertyToASTObject = exports.convertValueToLiteral = exports.objectToObjectExpression = exports.renameJSXTag = exports.addSpreadAttributeToJSXTag = exports.addChildJSXText = exports.addChildJSXTag = exports.addRawAttributeToJSXTag = exports.addAttributeToJSXTag = exports.parseStringWithTemplateExpressions = exports.parseJSExpressionAsAST = exports.containsTemplateExpression = exports.stringAsTemplateLiteral = exports.addMultipleDynamicAttributesToJSXTag = exports.addDynamicExpressionAttributeToJSXTag = exports.sanitizeExprContent = exports.addDynamicAttributeToJSXTag = exports.addClassStringOnJSXTag = exports.convertToReactAttributeName = void 0;
 var types = __importStar(require("@babel/types"));
 var core_1 = require("@babel/core");
 var parsed_ast_1 = __importDefault(require("./parsed-ast"));
 var teleport_shared_1 = require("@teleporthq/teleport-shared");
 var preset_react_1 = __importDefault(require("@babel/preset-react"));
+/**
+ * Converts HTML attribute names to React/JSX camelCase format
+ * Preserves data-* and aria-* attributes as-is
+ */
+var convertToReactAttributeName = function (attrName) {
+    if (attrName.startsWith('data-') || attrName.startsWith('aria-')) {
+        return attrName;
+    }
+    var htmlToReact = {
+        colspan: 'colSpan',
+        rowspan: 'rowSpan',
+        maxlength: 'maxLength',
+        minlength: 'minLength',
+        readonly: 'readOnly',
+        autocomplete: 'autoComplete',
+        autofocus: 'autoFocus',
+        tabindex: 'tabIndex',
+        contenteditable: 'contentEditable',
+        spellcheck: 'spellCheck',
+    };
+    if (htmlToReact[attrName]) {
+        return htmlToReact[attrName];
+    }
+    return attrName.replace(/-([a-z])/g, function (_, letter) { return letter.toUpperCase(); });
+};
+exports.convertToReactAttributeName = convertToReactAttributeName;
 /**
  * Adds a CSS class definition string to an existing string of classes
  */
@@ -107,10 +133,11 @@ var getClassAttribute = function (jsxNode, _a, t) {
 var addDynamicAttributeToJSXTag = function (jsxASTNode, name, value, prefix, t) {
     if (prefix === void 0) { prefix = ''; }
     if (t === void 0) { t = types; }
+    var reactName = (0, exports.convertToReactAttributeName)(name);
     var content = prefix === ''
         ? t.identifier(value)
         : t.memberExpression(t.identifier(prefix), t.identifier(value));
-    jsxASTNode.openingElement.attributes.push(t.jsxAttribute(t.jsxIdentifier(name), t.jsxExpressionContainer(content)));
+    jsxASTNode.openingElement.attributes.push(t.jsxAttribute(t.jsxIdentifier(reactName), t.jsxExpressionContainer(content)));
 };
 exports.addDynamicAttributeToJSXTag = addDynamicAttributeToJSXTag;
 /**
@@ -119,13 +146,48 @@ exports.addDynamicAttributeToJSXTag = addDynamicAttributeToJSXTag;
  * the corresponding value from the contexts for now
  * and in the future with other sources.
  */
+/**
+ * UIDL `expr` values are opaque JavaScript expressions, but authoring tools
+ * (notably Teleport-GUI while the differentiator-navlink contract is mid-
+ * migration) occasionally emit malformed template literals with empty
+ * substitutions like `` `/profile/${}` ``. Babel rejects these and the whole
+ * generation run fails.
+ *
+ * We only repair a narrow set of known-safe patterns to avoid silently
+ * masking real UIDL bugs:
+ *   1. `/profile/${}`  → `/profile/${currentUser?.id}` (My Profile navlink
+ *                         per the dual-mode profile page contract).
+ *   2. any remaining empty `${}` → `${''}` — at least the output parses and
+ *      the placeholder is visibly empty at runtime.
+ * Each repair logs a warning so the upstream UIDL bug remains visible.
+ */
+var sanitizeExprContent = function (content, attrKey) {
+    if (typeof content !== 'string' || !content.includes('${}')) {
+        return content;
+    }
+    var repaired = content;
+    // My Profile navlink: the differentiator is always the session user's id.
+    repaired = repaired.replace(/`([^`]*\/profile\/)\$\{\}([^`]*)`/g, '`$1' + '$' + '{' + 'currentUser?.id}' + '$2`');
+    // Generic fallback: any other empty `${}` becomes an empty string literal so
+    // downstream Babel parsing succeeds. This is intentionally lossy — the goal
+    // is not to guess the original intent, just to keep the build from crashing.
+    if (repaired.includes('${}')) {
+        repaired = repaired.replace(/\$\{\}/g, '$' + '{' + "'" + "'" + '}');
+    }
+    if (repaired !== content) {
+        // tslint:disable-next-line:no-console
+        console.warn("[teleport] Repaired malformed empty template substitution in expr".concat(attrKey ? " attribute \"".concat(attrKey, "\"") : '', ": ").concat(content, " \u2192 ").concat(repaired));
+    }
+    return repaired;
+};
+exports.sanitizeExprContent = sanitizeExprContent;
 var addDynamicExpressionAttributeToJSXTag = function (jsxASTNode, dynamicRef, attrKey, t) {
     if (t === void 0) { t = types; }
     var dynamicContent = dynamicRef.content;
     if (dynamicRef.type !== 'expr') {
         throw new Error("This method only works with dynamic nodes that have code expressions");
     }
-    var code = dynamicContent;
+    var code = (0, exports.sanitizeExprContent)(dynamicContent, attrKey);
     var options = {
         sourceType: 'module',
     };
@@ -137,7 +199,18 @@ var addDynamicExpressionAttributeToJSXTag = function (jsxASTNode, dynamicRef, at
     if (theStatementOnlyWihtoutTheProgram.type !== 'ExpressionStatement') {
         throw new Error("Expr dynamic attribute only support expressions statements at the moment.");
     }
-    jsxASTNode.openingElement.attributes.push(t.jsxAttribute(t.jsxIdentifier(attrKey), t.jsxExpressionContainer(theStatementOnlyWihtoutTheProgram.expression)));
+    var expression = theStatementOnlyWihtoutTheProgram.expression;
+    // When an expression accesses `.value` on a simple identifier (e.g. `galleryImage?.value`),
+    // wrap it with a typeof check so that if the item is already a string we use it directly:
+    // `typeof galleryImage === 'string' ? galleryImage : galleryImage?.value`
+    if ((expression.type === 'OptionalMemberExpression' || expression.type === 'MemberExpression') &&
+        expression.object.type === 'Identifier' &&
+        expression.property.type === 'Identifier' &&
+        expression.property.name === 'value') {
+        var varName = expression.object.name;
+        expression = t.conditionalExpression(t.binaryExpression('===', t.unaryExpression('typeof', t.identifier(varName)), t.stringLiteral('string')), t.identifier(varName), expression);
+    }
+    jsxASTNode.openingElement.attributes.push(t.jsxAttribute(t.jsxIdentifier((0, exports.convertToReactAttributeName)(attrKey)), t.jsxExpressionContainer(expression)));
 };
 exports.addDynamicExpressionAttributeToJSXTag = addDynamicExpressionAttributeToJSXTag;
 /*
@@ -182,30 +255,122 @@ var stringAsTemplateLiteral = function (str) {
 };
 exports.stringAsTemplateLiteral = stringAsTemplateLiteral;
 /**
- * Converts HTML attribute names to React/JSX camelCase format
- * Preserves data-* and aria-* attributes as-is
+ * Checks if a string contains {{ expression }} template patterns
  */
-var convertToReactAttributeName = function (attrName) {
-    // Keep data-* and aria-* attributes as-is (React supports these)
-    if (attrName.startsWith('data-') || attrName.startsWith('aria-')) {
-        return attrName;
+var containsTemplateExpression = function (str) {
+    return /\{\{.+?\}\}/.test(str);
+};
+exports.containsTemplateExpression = containsTemplateExpression;
+/**
+ * Parses a JavaScript expression string into an AST Expression node.
+ * e.g. "item.type || 'coin'" → LogicalExpression AST
+ */
+var parseJSExpressionAsAST = function (expr) {
+    var ast = (0, core_1.parse)("(".concat(expr, ")"), {
+        sourceType: 'module',
+    });
+    if (!ast || !('program' in ast)) {
+        throw new Error("Failed to parse expression: ".concat(expr));
     }
-    // Convert hyphenated attributes to camelCase for React
-    return attrName.replace(/-([a-z])/g, function (_, letter) { return letter.toUpperCase(); });
+    return ast.program.body[0].expression;
 };
+exports.parseJSExpressionAsAST = parseJSExpressionAsAST;
+/**
+ * Parses a string containing {{ expr }} template patterns into a TemplateLiteral AST node.
+ * e.g. "translate({{ enemy.x || '0' }}px)" → `translate(${enemy.x || '0'}px)`
+ */
+var parseStringWithTemplateExpressions = function (str) {
+    // Step 1: Normalize state references: state.xxx → xxx
+    var normalized = str.replace(/state\.(\w+)/g, '$1');
+    // Step 2: Convert well-formed {{ expr }} to ${expr}
+    var templateStr = normalized.replace(/\{\{\s*(.+?)\s*\}\}/g, function (_, expr) { return '${' + expr.trim() + '}'; });
+    // Step 3: Handle unclosed {{ expr (no closing }})
+    // After step 2, any remaining {{ was not well-formed
+    if (/\{\{/.test(templateStr)) {
+        templateStr = templateStr.replace(/\{\{\s*(.+?)$/gm, function (_, expr) { return '${' + expr.trim() + '}'; });
+    }
+    // Step 4: Detect and fix incomplete CSS function calls
+    // If the original string contained a CSS function like translateX(...) or translate(...)
+    // but the template expression consumed the closing, we need to re-close it.
+    var openParens = (templateStr.match(/\(/g) || []).length;
+    var closeParens = (templateStr.match(/\)/g) || []).length;
+    if (openParens > closeParens) {
+        // Determine the CSS unit by:
+        // 1. Looking for existing units already in the string (e.g. "translate(${x}px, ${y" → px)
+        // 2. Inferring from the CSS function name
+        var existingUnit = templateStr.match(/(px|deg|em|rem|%|vh|vw)[),\s]/);
+        var unit = 'px'; // default
+        if (existingUnit) {
+            unit = existingUnit[1];
+        }
+        else {
+            // Infer unit from the CSS function name
+            var fnMatch = templateStr.match(/\b(rotate|skew|skewX|skewY)\s*\(/);
+            if (fnMatch) {
+                unit = 'deg';
+            }
+            var noUnitFns = /\b(scale|scaleX|scaleY|scale3d|opacity)\s*\(/;
+            if (noUnitFns.test(templateStr)) {
+                unit = '';
+            }
+        }
+        var missingCloses = openParens - closeParens;
+        templateStr += unit + ')'.repeat(missingCloses);
+    }
+    var ast = (0, core_1.parse)('const x = `' + templateStr + '`', {
+        sourceType: 'module',
+    });
+    if (!ast || !('program' in ast)) {
+        throw new Error("Failed to parse template expression: ".concat(str));
+    }
+    var decl = ast.program.body[0];
+    return decl.declarations[0].init;
+};
+exports.parseStringWithTemplateExpressions = parseStringWithTemplateExpressions;
+var REACT_BOOLEAN_DOM_PROPS = new Set([
+    'disabled',
+    'required',
+    'readOnly',
+    'checked',
+    'multiple',
+    'hidden',
+    'autoFocus',
+    'muted',
+    'loop',
+    'playsInline',
+    'controls',
+    'async',
+    'defer',
+    'inert',
+    'scoped',
+    'reversed',
+    'allowFullScreen',
+    'defaultChecked',
+    'selected',
+    'formNoValidate',
+    'noValidate',
+]);
 var addAttributeToJSXTag = function (jsxNode, attrName, attrValue, t) {
     if (t === void 0) { t = types; }
-    var reactAttrName = convertToReactAttributeName(attrName);
+    var reactAttrName = (0, exports.convertToReactAttributeName)(attrName);
     var nameOfAttribute = t.jsxIdentifier(reactAttrName);
     var attributeDefinition;
-    if (typeof attrValue === 'boolean') {
-        attributeDefinition = t.jsxAttribute(nameOfAttribute, attrValue === true ? undefined : t.jsxExpressionContainer(t.booleanLiteral(attrValue)));
+    var normalizedValue = attrValue;
+    if (typeof attrValue === 'string' &&
+        (attrValue === 'true' || attrValue === 'false') &&
+        REACT_BOOLEAN_DOM_PROPS.has(reactAttrName)) {
+        normalizedValue = attrValue === 'true';
+    }
+    if (typeof normalizedValue === 'boolean') {
+        attributeDefinition = t.jsxAttribute(nameOfAttribute, normalizedValue === true
+            ? undefined
+            : t.jsxExpressionContainer(t.booleanLiteral(normalizedValue)));
     }
     else if (t.isNode(attrValue) && t.isJSXElement(attrValue)) {
         attributeDefinition = t.jsxAttribute(nameOfAttribute, t.jsxExpressionContainer(attrValue));
     }
     else {
-        attributeDefinition = t.jsxAttribute(nameOfAttribute, getProperAttributeValueAssignment(attrValue));
+        attributeDefinition = t.jsxAttribute(nameOfAttribute, getProperAttributeValueAssignment(normalizedValue));
     }
     var attribute = jsxNode.openingElement.attributes.find(function (attr) {
         if (attr.type === 'JSXAttribute') {
@@ -248,12 +413,12 @@ exports.addRawAttributeToJSXTag = addRawAttributeToJSXTag;
  */
 var getProperAttributeValueAssignment = function (value, t) {
     if (t === void 0) { t = types; }
-    if (!value) {
-        return null;
-    }
     if (typeof value === 'string') {
         return t.stringLiteral(teleport_shared_1.StringUtils.encode(value));
     }
+    if (!value && value !== 0 && value !== false) {
+        return null;
+    }
     return t.jsxExpressionContainer((0, exports.convertValueToLiteral)(value));
 };
 var addChildJSXTag = function (tag, childNode, t) {
@@ -347,6 +512,21 @@ value, explicitType, t) {
     if (Array.isArray(value)) {
         return t.arrayExpression(value.map(function (val) { return (0, exports.convertValueToLiteral)(val); }));
     }
+    if (explicitType === 'array' && typeof value === 'object' && value !== null) {
+        var arr = Object.keys(value)
+            .sort(function (a, b) { return Number(a) - Number(b); })
+            .map(function (key) { return (0, exports.convertValueToLiteral)(value[key]); });
+        return t.arrayExpression(arr);
+    }
+    if ((explicitType === 'array' || explicitType === 'object') && typeof value === 'string') {
+        try {
+            var parsed = JSON.parse(value);
+            return (0, exports.convertValueToLiteral)(parsed, explicitType, t);
+        }
+        catch (_a) {
+            // If parsing fails, fall through to treat as a regular string
+        }
+    }
     var actualType = typeof value;
     var typeToCompare = explicitType && explicitType === actualType ? explicitType : actualType;
     switch (typeToCompare) {
@@ -396,7 +576,7 @@ var removeAttributeByName = function (jsxTag, attrName) {
     });
 };
 exports.removeAttributeByName = removeAttributeByName;
-var createClassComponent = function (name, propDefinitions, stateDefinitions, jsxTagTree, t) {
+var createClassComponent = function (name, propDefinitions, stateDefinitions, jsxTagTree, dynamicReferencePrefixMap, t) {
     if (t === void 0) { t = types; }
     // TODO: Add event handlers as separate functions later
     var classMethodsAndProperties = [];
@@ -407,6 +587,11 @@ var createClassComponent = function (name, propDefinitions, stateDefinitions, js
     if (Object.keys(stateDefinitions).length > 0) {
         var stateDeclarationsAST = Object.keys(stateDefinitions).map(function (stateKey) {
             var stateDefinition = stateDefinitions[stateKey];
+            if (stateDefinition.type === 'object' &&
+                dynamicReferencePrefixMap &&
+                (0, exports.isObjectStateWithEntries)(stateDefinition)) {
+                return t.objectProperty(t.identifier(stateKey), (0, exports.convertObjectStateDefaultToExpression)(stateDefinition.defaultValue, dynamicReferencePrefixMap, t));
+            }
             return t.objectProperty(t.identifier(stateKey), (0, exports.convertValueToLiteral)(stateDefinition.defaultValue));
         });
         classMethodsAndProperties.push(t.classProperty(t.identifier('state'), t.objectExpression(stateDeclarationsAST)));
@@ -419,22 +604,22 @@ var createClassComponent = function (name, propDefinitions, stateDefinitions, js
     return classDeclaration;
 };
 exports.createClassComponent = createClassComponent;
-var createPureComponent = function (name, stateDefinitions, jsxTagTree, windowImports, t) {
+var createPureComponent = function (name, stateDefinitions, jsxTagTree, windowImports, dynamicReferencePrefixMap, t) {
     if (windowImports === void 0) { windowImports = {}; }
     if (t === void 0) { t = types; }
-    var arrowFunctionBody = (0, exports.createReturnExpressionSyntax)(stateDefinitions, jsxTagTree, windowImports);
+    var arrowFunctionBody = (0, exports.createReturnExpressionSyntax)(stateDefinitions, jsxTagTree, windowImports, dynamicReferencePrefixMap);
     var arrowFunction = t.arrowFunctionExpression([t.identifier('props')], arrowFunctionBody);
     var declarator = t.variableDeclarator(t.identifier(name), arrowFunction);
     var component = t.variableDeclaration('const', [declarator]);
     return component;
 };
 exports.createPureComponent = createPureComponent;
-var createReturnExpressionSyntax = function (stateDefinitions, jsxTagTree, windowImports, t) {
+var createReturnExpressionSyntax = function (stateDefinitions, jsxTagTree, windowImports, dynamicReferencePrefixMap, t) {
     if (windowImports === void 0) { windowImports = {}; }
     if (t === void 0) { t = types; }
     var returnStatement = t.returnStatement(jsxTagTree);
     var stateHooks = Object.keys(stateDefinitions).map(function (stateKey) {
-        return (0, exports.createStateHookAST)(stateKey, stateDefinitions[stateKey]);
+        return (0, exports.createStateHookAST)(stateKey, stateDefinitions[stateKey], dynamicReferencePrefixMap);
     });
     return t.blockStatement(__spreadArray(__spreadArray(__spreadArray([], stateHooks, true), Object.values(windowImports), true), [returnStatement], false));
 };
@@ -442,17 +627,206 @@ exports.createReturnExpressionSyntax = createReturnExpressionSyntax;
 /**
  * Creates an AST line for defining a single state hook
  */
-var createStateHookAST = function (stateKey, stateDefinition, t) {
+var createStateHookAST = function (stateKey, stateDefinition, dynamicReferencePrefixMap, t) {
     if (t === void 0) { t = types; }
-    var defaultValueArgument = (0, exports.convertValueToLiteral)(stateDefinition.defaultValue, stateDefinition.type);
+    var defaultValueArgument;
+    if (stateDefinition.type === 'object' &&
+        dynamicReferencePrefixMap &&
+        (0, exports.isObjectStateWithEntries)(stateDefinition)) {
+        defaultValueArgument = (0, exports.convertObjectStateDefaultToExpression)(stateDefinition.defaultValue, dynamicReferencePrefixMap, t);
+    }
+    else {
+        defaultValueArgument = (0, exports.convertValueToLiteral)(stateDefinition.defaultValue, stateDefinition.type);
+    }
+    // When the state has a dataSourceBinding, the initial value comes from props
+    // Generated: useState(props.stateKey !== undefined ? props.stateKey : defaultValue)
+    var useStateArgument = defaultValueArgument;
+    if (stateDefinition.dataSourceBinding) {
+        var propAccess = t.memberExpression(t.identifier('props'), t.identifier(stateKey));
+        useStateArgument = t.conditionalExpression(t.binaryExpression('!==', propAccess, t.identifier('undefined')), propAccess, defaultValueArgument);
+    }
+    else if (stateDefinition.urlSearchParamBinding &&
+        typeof stateDefinition.urlSearchParamBinding.key === 'string' &&
+        stateDefinition.urlSearchParamBinding.key !== '') {
+        // URL-search-param binding: seed the initial state directly from
+        // `window.location.search`. We deliberately DO NOT use Next.js'
+        // `router.query` here because on statically-generated pages (getStaticProps
+        // / getStaticPaths) `router.query` is empty on the first render and only
+        // hydrates after `router.isReady` flips to true — by which point React's
+        // `useState` initializer has already captured the fallback default. That
+        // regression shipped as "detail panel does not auto-open on deep links to
+        // /admin/products?products_detail_panel_item_id=<id>". `window.location`
+        // is populated synchronously on both direct loads and client-side
+        // navigations, and the `typeof window` guard keeps SSR falling back to
+        // the declared static default cleanly.
+        //
+        // Emitted shape:
+        //   useState(
+        //     (typeof window !== "undefined"
+        //       ? new URLSearchParams(window.location.search).get("<key>")
+        //       : null) ?? <defaultValueLiteral>
+        //   )
+        var paramKey = stateDefinition.urlSearchParamBinding.key;
+        var urlSearchParamsExpr = t.newExpression(t.identifier('URLSearchParams'), [
+            t.memberExpression(t.memberExpression(t.identifier('window'), t.identifier('location')), t.identifier('search')),
+        ]);
+        var readParamExpr = t.callExpression(t.memberExpression(urlSearchParamsExpr, t.identifier('get')), [t.stringLiteral(paramKey)]);
+        var browserGuard = t.binaryExpression('!==', t.unaryExpression('typeof', t.identifier('window')), t.stringLiteral('undefined'));
+        useStateArgument = t.logicalExpression('??', t.conditionalExpression(browserGuard, readParamExpr, t.nullLiteral()), defaultValueArgument);
+    }
     return t.variableDeclaration('const', [
         t.variableDeclarator(t.arrayPattern([
             t.identifier(stateKey),
             t.identifier(teleport_shared_1.StringUtils.createStateStoringFunction(stateKey)),
-        ]), t.callExpression(t.identifier('useState'), [defaultValueArgument])),
+        ]), t.callExpression(t.identifier('useState'), [useStateArgument])),
     ]);
 };
 exports.createStateHookAST = createStateHookAST;
+var isObjectStateWithEntries = function (stateDefinition) {
+    if (stateDefinition.type !== 'object') {
+        return false;
+    }
+    var defaultValue = stateDefinition.defaultValue;
+    if (typeof defaultValue !== 'object' || defaultValue === null || Array.isArray(defaultValue)) {
+        return false;
+    }
+    return Object.values(defaultValue).some(function (entry) {
+        if (typeof entry !== 'object' || entry === null) {
+            return false;
+        }
+        var typed = entry;
+        return (typed.type === 'static' || typed.type === 'dynamic') && 'content' in typed;
+    });
+};
+exports.isObjectStateWithEntries = isObjectStateWithEntries;
+var convertObjectStateDefaultToExpression = function (defaultValue, prefixMap, t) {
+    if (t === void 0) { t = types; }
+    var properties = Object.keys(defaultValue).map(function (key) {
+        var valueExpression = resolveObjectStateEntry(defaultValue[key], prefixMap, t);
+        return t.objectProperty(t.stringLiteral(key), valueExpression);
+    });
+    return t.objectExpression(properties);
+};
+exports.convertObjectStateDefaultToExpression = convertObjectStateDefaultToExpression;
+var resolveObjectStateEntry = function (entry, prefixMap, t) {
+    if (t === void 0) { t = types; }
+    if (typeof entry !== 'object' || entry === null) {
+        return (0, exports.convertValueToLiteral)(entry);
+    }
+    var typed = entry;
+    if (typed.type === 'static') {
+        return (0, exports.convertValueToLiteral)(typed.content);
+    }
+    if (typed.type === 'dynamic') {
+        var content = typed.content;
+        var referenceType = content.referenceType, id = content.id, refPath = content.refPath;
+        if (referenceType === 'globalState') {
+            var gsRefPath = refPath || [];
+            var expr = t.identifier(id);
+            for (var _i = 0, gsRefPath_1 = gsRefPath; _i < gsRefPath_1.length; _i++) {
+                var segment = gsRefPath_1[_i];
+                expr = t.optionalMemberExpression(expr, t.identifier(segment), false, true);
+            }
+            return expr;
+        }
+        if (referenceType === 'global') {
+            // Normalize Shape B ({ refPath: ['Current User', 'id'] }) to Shape A
+            // ({ id: 'currentUser', refPath: ['id'] }) so downstream access is uniform.
+            var resolvedId = (0, exports.resolveGlobalRefId)(content);
+            if (resolvedId) {
+                var tail = !id && refPath && refPath.length > 0 ? refPath.slice(1) : refPath || [];
+                var expr = t.identifier(resolvedId);
+                for (var _a = 0, tail_1 = tail; _a < tail_1.length; _a++) {
+                    var segment = tail_1[_a];
+                    expr = t.optionalMemberExpression(expr, t.identifier(segment), false, true);
+                }
+                return expr;
+            }
+        }
+        var idWithPath = teleport_shared_1.UIDLUtils.generateIdWithRefPath(id, refPath);
+        var prefix = prefixMap[referenceType] || '';
+        return prefix === ''
+            ? t.identifier(idWithPath)
+            : t.memberExpression(t.identifier(prefix), t.identifier(idWithPath));
+    }
+    return (0, exports.convertValueToLiteral)(entry);
+};
+// Mapping from the UIDL display name used in a global reference refPath
+// to the runtime variable name that holds the value. Kept here so both the
+// JSX emitter and the object-state global-reference collectors stay in sync.
+exports.GLOBAL_REF_ID_MAP = {
+    'E-commerce': 'ecommerce',
+    Cart: 'cart',
+    'Current User': 'currentUser',
+};
+var resolveGlobalRefId = function (content) {
+    if (!content) {
+        return undefined;
+    }
+    if (content.id) {
+        return content.id;
+    }
+    if (!content.refPath || content.refPath.length === 0) {
+        return undefined;
+    }
+    return exports.GLOBAL_REF_ID_MAP[content.refPath[0]];
+};
+exports.resolveGlobalRefId = resolveGlobalRefId;
+var collectGlobalReferencesFromObjectStates = function (stateDefinitions) {
+    var globalRefs = [];
+    Object.values(stateDefinitions).forEach(function (stateDef) {
+        if (stateDef.type !== 'object') {
+            return;
+        }
+        var defaultValue = stateDef.defaultValue;
+        if (typeof defaultValue !== 'object' || defaultValue === null || Array.isArray(defaultValue)) {
+            return;
+        }
+        Object.values(defaultValue).forEach(function (entry) {
+            if (typeof entry !== 'object' || entry === null) {
+                return;
+            }
+            var typed = entry;
+            if (typed.type === 'dynamic') {
+                var content = typed.content;
+                if (content.referenceType === 'global') {
+                    var resolvedId = (0, exports.resolveGlobalRefId)(content);
+                    if (resolvedId) {
+                        globalRefs.push(resolvedId);
+                    }
+                }
+            }
+        });
+    });
+    return globalRefs;
+};
+exports.collectGlobalReferencesFromObjectStates = collectGlobalReferencesFromObjectStates;
+var collectGlobalStateReferencesFromObjectStates = function (stateDefinitions) {
+    var refs = [];
+    Object.values(stateDefinitions).forEach(function (stateDef) {
+        if (stateDef.type !== 'object') {
+            return;
+        }
+        var defaultValue = stateDef.defaultValue;
+        if (typeof defaultValue !== 'object' || defaultValue === null || Array.isArray(defaultValue)) {
+            return;
+        }
+        Object.values(defaultValue).forEach(function (entry) {
+            if (typeof entry !== 'object' || entry === null) {
+                return;
+            }
+            var typed = entry;
+            if (typed.type === 'dynamic') {
+                var content = typed.content;
+                if (content.referenceType === 'globalState' && content.id) {
+                    refs.push({ id: content.id });
+                }
+            }
+        });
+    });
+    return refs;
+};
+exports.collectGlobalStateReferencesFromObjectStates = collectGlobalStateReferencesFromObjectStates;
 var generateDynamicWindowImport = function (hookName, dependency) {
     if (hookName === void 0) { hookName = 'useEffect'; }
     return types.expressionStatement(types.callExpression(types.identifier(hookName), [
@@ -736,6 +1110,18 @@ var computeFetchUrl = function (resource) {
         var cleanBaseUrl = baseUrlStr.endsWith('/') ? baseUrlStr.slice(0, -1) : baseUrlStr;
         var cleanRoute = routeStr.startsWith('/') ? routeStr.slice(1) : routeStr;
         var stringsToJoin = [cleanBaseUrl, cleanRoute].filter(function (item) { return item; }).join('/');
+        // If the URL is relative (starts with /), add a runtime base URL prefix
+        // so fetch() works in server-side contexts (getStaticProps/getServerSideProps).
+        // Non-NEXT_PUBLIC_ env vars are only available server-side in Next.js,
+        // so NEXTAUTH_URL naturally resolves to undefined on the client (making baseUrl '').
+        if (stringsToJoin.startsWith('/')) {
+            var processEnv = types.memberExpression(types.identifier('process'), types.identifier('env'));
+            var serverBaseUrlExpr = types.logicalExpression('||', types.logicalExpression('||', types.memberExpression(processEnv, types.identifier('NEXT_PUBLIC_SITE_URL')), types.memberExpression(types.memberExpression(types.identifier('process'), types.identifier('env')), types.identifier('NEXTAUTH_URL'))), types.stringLiteral(''));
+            return types.templateLiteral([
+                types.templateElement({ cooked: '', raw: '' }, false),
+                types.templateElement({ cooked: "".concat(stringsToJoin), raw: "".concat(stringsToJoin) }, true),
+            ], [serverBaseUrlExpr]);
+        }
         return types.templateLiteral([types.templateElement({ cooked: "".concat(stringsToJoin), raw: "".concat(stringsToJoin) }, true)], []);
     }
     if (!routeType) {
@@ -859,7 +1245,7 @@ exports.convertFilterDestinationToExpression = convertFilterDestinationToExpress
 var getExpressionFromUIDLExpressionNode = function (node) {
     var ast;
     try {
-        ast = (0, core_1.parse)(node.content, {
+        ast = (0, core_1.parse)((0, exports.sanitizeExprContent)(node.content), {
             sourceType: 'module',
         });
     }