babel-plugin-react-compiler 0.0.0-experimental-23b8160-20240916 → 0.0.0-experimental-24ec0eb-20240918

package/dist/index.js

@@ -139601,6 +139601,8 @@ var InstructionKind;
   InstructionKind['Catch'] = 'Catch';
   InstructionKind['HoistedConst'] = 'HoistedConst';
   InstructionKind['HoistedLet'] = 'HoistedLet';
+  InstructionKind['HoistedFunction'] = 'HoistedFunction';
+  InstructionKind['Function'] = 'Function';
 })(InstructionKind || (InstructionKind = {}));
 function makeTemporaryIdentifier(id, loc) {
   return {
@@ -143160,6 +143162,24 @@ function clonePlaceToTemporary(env, place) {
   temp.reactive = place.reactive;
   return temp;
 }
+function fixScopeAndIdentifierRanges(func) {
+  var _a, _b;
+  for (const [, block] of func.blocks) {
+    const terminal = block.terminal;
+    if (terminal.kind === 'scope' || terminal.kind === 'pruned-scope') {
+      const fallthroughBlock = func.blocks.get(terminal.fallthrough);
+      const firstId =
+        (_b =
+          (_a = fallthroughBlock.instructions[0]) === null || _a === void 0
+            ? void 0
+            : _a.id) !== null && _b !== void 0
+          ? _b
+          : fallthroughBlock.terminal.id;
+      terminal.scope.range.start = terminal.id;
+      terminal.scope.range.end = firstId;
+    }
+  }
+}
 const PRIMITIVE_TYPE = {kind: 'Primitive'};
 let nextAnonId = 0;
 function createAnonId() {
@@ -144017,7 +144037,14 @@ function lowerStatement(builder, stmtPath, label = null) {
           if (builder.environment.isHoistedIdentifier(binding.identifier)) {
             continue;
           }
-          if (!binding.path.isVariableDeclarator()) {
+          let kind;
+          if (binding.kind === 'const' || binding.kind === 'var') {
+            kind = InstructionKind.HoistedConst;
+          } else if (binding.kind === 'let') {
+            kind = InstructionKind.HoistedLet;
+          } else if (binding.path.isFunctionDeclaration()) {
+            kind = InstructionKind.HoistedFunction;
+          } else if (!binding.path.isVariableDeclarator()) {
             builder.errors.push({
               severity: exports.ErrorSeverity.Todo,
               reason: 'Unsupported declaration type for hoisting',
@@ -144029,11 +144056,7 @@ function lowerStatement(builder, stmtPath, label = null) {
                   : GeneratedSource,
             });
             continue;
-          } else if (
-            binding.kind !== 'const' &&
-            binding.kind !== 'var' &&
-            binding.kind !== 'let'
-          ) {
+          } else {
             builder.errors.push({
               severity: exports.ErrorSeverity.Todo,
               reason: 'Handle non-const declarations for hoisting',
@@ -144065,12 +144088,6 @@ function lowerStatement(builder, stmtPath, label = null) {
                 ? _j
                 : GeneratedSource,
           };
-          const kind =
-            binding.kind === 'const' || binding.kind === 'var'
-              ? InstructionKind.HoistedConst
-              : binding.kind === 'let'
-                ? InstructionKind.HoistedLet
-                : assertExhaustive(binding.kind, 'Unexpected binding kind');
           lowerValueToTemporary(builder, {
             kind: 'DeclareContext',
             lvalue: {kind: kind, place: place},
@@ -144615,7 +144632,7 @@ function lowerStatement(builder, stmtPath, label = null) {
         (_10 = stmt.node.loc) !== null && _10 !== void 0
           ? _10
           : GeneratedSource,
-        InstructionKind.Let,
+        InstructionKind.Function,
         id,
         fn,
         'Assignment'
@@ -147765,7 +147782,6 @@ function lowerType(node) {
   }
 }
 function buildReactiveScopeTerminalsHIR(fn) {
-  var _a, _b;
   const queuedRewrites = [];
   recursivelyTraverseItems(
     [...getScopes(fn)],
@@ -147831,21 +147847,7 @@ function buildReactiveScopeTerminalsHIR(fn) {
   reversePostorderBlocks(fn.body);
   markPredecessors(fn.body);
   markInstructionIds(fn.body);
-  for (const [, block] of fn.body.blocks) {
-    const terminal = block.terminal;
-    if (terminal.kind === 'scope' || terminal.kind === 'pruned-scope') {
-      const fallthroughBlock = fn.body.blocks.get(terminal.fallthrough);
-      const firstId =
-        (_b =
-          (_a = fallthroughBlock.instructions[0]) === null || _a === void 0
-            ? void 0
-            : _a.id) !== null && _b !== void 0
-          ? _b
-          : fallthroughBlock.terminal.id;
-      terminal.scope.range.start = terminal.id;
-      terminal.scope.range.end = firstId;
-    }
-  }
+  fixScopeAndIdentifierRanges(fn.body);
 }
 function pushStartScopeTerminal(scope, context) {
   const blockId = context.env.nextBlockId;
@@ -150159,6 +150161,17 @@ const REACT_APIS = [
       returnValueKind: exports.ValueKind.Mutable,
     }),
   ],
+  [
+    'useImperativeHandle',
+    addHook(DEFAULT_SHAPES, {
+      positionalParams: [],
+      restParam: exports.Effect.Freeze,
+      returnType: {kind: 'Primitive'},
+      calleeEffect: exports.Effect.Read,
+      hookKind: 'useImperativeHandle',
+      returnValueKind: exports.ValueKind.Frozen,
+    }),
+  ],
   [
     'useMemo',
     addHook(DEFAULT_SHAPES, {
@@ -150600,6 +150613,7 @@ const EnvironmentConfigSchema = z.object({
   enableUseTypeAnnotations: z.boolean().default(false),
   enablePropagateDepsInHIR: z.boolean().default(false),
   enableOptionalDependencies: z.boolean().default(true),
+  enableInlineJsxTransform: z.boolean().default(false),
   validateHooksUsage: z.boolean().default(true),
   validateRefAccessDuringRender: z.boolean().default(true),
   validateNoSetStateInRender: z.boolean().default(true),
@@ -155087,6 +155101,380 @@ function instructionMayThrow(instr) {
     }
   }
 }
+function createSymbolProperty(
+  fn,
+  instr,
+  nextInstructions,
+  propertyName,
+  symbolName
+) {
+  const symbolPlace = createTemporaryPlace(fn.env, instr.value.loc);
+  const symbolInstruction = {
+    id: makeInstructionId(0),
+    lvalue: Object.assign(Object.assign({}, symbolPlace), {
+      effect: exports.Effect.Mutate,
+    }),
+    value: {
+      kind: 'LoadGlobal',
+      binding: {kind: 'Global', name: 'Symbol'},
+      loc: instr.value.loc,
+    },
+    loc: instr.loc,
+  };
+  nextInstructions.push(symbolInstruction);
+  const symbolForPlace = createTemporaryPlace(fn.env, instr.value.loc);
+  const symbolForInstruction = {
+    id: makeInstructionId(0),
+    lvalue: Object.assign(Object.assign({}, symbolForPlace), {
+      effect: exports.Effect.Read,
+    }),
+    value: {
+      kind: 'PropertyLoad',
+      object: Object.assign({}, symbolInstruction.lvalue),
+      property: 'for',
+      loc: instr.value.loc,
+    },
+    loc: instr.loc,
+  };
+  nextInstructions.push(symbolForInstruction);
+  const symbolValuePlace = createTemporaryPlace(fn.env, instr.value.loc);
+  const symbolValueInstruction = {
+    id: makeInstructionId(0),
+    lvalue: Object.assign(Object.assign({}, symbolValuePlace), {
+      effect: exports.Effect.Mutate,
+    }),
+    value: {kind: 'Primitive', value: symbolName, loc: instr.value.loc},
+    loc: instr.loc,
+  };
+  nextInstructions.push(symbolValueInstruction);
+  const $$typeofPlace = createTemporaryPlace(fn.env, instr.value.loc);
+  const $$typeofInstruction = {
+    id: makeInstructionId(0),
+    lvalue: Object.assign(Object.assign({}, $$typeofPlace), {
+      effect: exports.Effect.Mutate,
+    }),
+    value: {
+      kind: 'MethodCall',
+      receiver: symbolInstruction.lvalue,
+      property: symbolForInstruction.lvalue,
+      args: [symbolValueInstruction.lvalue],
+      loc: instr.value.loc,
+    },
+    loc: instr.loc,
+  };
+  const $$typeofProperty = {
+    kind: 'ObjectProperty',
+    key: {name: propertyName, kind: 'string'},
+    type: 'property',
+    place: Object.assign(Object.assign({}, $$typeofPlace), {
+      effect: exports.Effect.Capture,
+    }),
+  };
+  nextInstructions.push($$typeofInstruction);
+  return $$typeofProperty;
+}
+function createTagProperty(fn, instr, nextInstructions, componentTag) {
+  let tagProperty;
+  switch (componentTag.kind) {
+    case 'BuiltinTag': {
+      const tagPropertyPlace = createTemporaryPlace(fn.env, instr.value.loc);
+      const tagInstruction = {
+        id: makeInstructionId(0),
+        lvalue: Object.assign(Object.assign({}, tagPropertyPlace), {
+          effect: exports.Effect.Mutate,
+        }),
+        value: {
+          kind: 'Primitive',
+          value: componentTag.name,
+          loc: instr.value.loc,
+        },
+        loc: instr.loc,
+      };
+      tagProperty = {
+        kind: 'ObjectProperty',
+        key: {name: 'type', kind: 'string'},
+        type: 'property',
+        place: Object.assign(Object.assign({}, tagPropertyPlace), {
+          effect: exports.Effect.Capture,
+        }),
+      };
+      nextInstructions.push(tagInstruction);
+      break;
+    }
+    case 'Identifier': {
+      tagProperty = {
+        kind: 'ObjectProperty',
+        key: {name: 'type', kind: 'string'},
+        type: 'property',
+        place: Object.assign(Object.assign({}, componentTag), {
+          effect: exports.Effect.Capture,
+        }),
+      };
+      break;
+    }
+  }
+  return tagProperty;
+}
+function createPropsProperties(
+  fn,
+  instr,
+  nextInstructions,
+  propAttributes,
+  children
+) {
+  let refProperty;
+  let keyProperty;
+  const props = [];
+  propAttributes.forEach(prop => {
+    switch (prop.kind) {
+      case 'JsxAttribute': {
+        if (prop.name === 'ref') {
+          refProperty = {
+            kind: 'ObjectProperty',
+            key: {name: 'ref', kind: 'string'},
+            type: 'property',
+            place: Object.assign({}, prop.place),
+          };
+        } else if (prop.name === 'key') {
+          keyProperty = {
+            kind: 'ObjectProperty',
+            key: {name: 'key', kind: 'string'},
+            type: 'property',
+            place: Object.assign({}, prop.place),
+          };
+        } else {
+          const attributeProperty = {
+            kind: 'ObjectProperty',
+            key: {name: prop.name, kind: 'string'},
+            type: 'property',
+            place: Object.assign({}, prop.place),
+          };
+          props.push(attributeProperty);
+        }
+        break;
+      }
+      case 'JsxSpreadAttribute': {
+        props.push({kind: 'Spread', place: Object.assign({}, prop.argument)});
+        break;
+      }
+    }
+  });
+  const propsPropertyPlace = createTemporaryPlace(fn.env, instr.value.loc);
+  if (children) {
+    let childrenPropProperty;
+    if (children.length === 1) {
+      childrenPropProperty = {
+        kind: 'ObjectProperty',
+        key: {name: 'children', kind: 'string'},
+        type: 'property',
+        place: Object.assign(Object.assign({}, children[0]), {
+          effect: exports.Effect.Capture,
+        }),
+      };
+    } else {
+      const childrenPropPropertyPlace = createTemporaryPlace(
+        fn.env,
+        instr.value.loc
+      );
+      const childrenPropInstruction = {
+        id: makeInstructionId(0),
+        lvalue: Object.assign(Object.assign({}, childrenPropPropertyPlace), {
+          effect: exports.Effect.Mutate,
+        }),
+        value: {
+          kind: 'ArrayExpression',
+          elements: [...children],
+          loc: instr.value.loc,
+        },
+        loc: instr.loc,
+      };
+      nextInstructions.push(childrenPropInstruction);
+      childrenPropProperty = {
+        kind: 'ObjectProperty',
+        key: {name: 'children', kind: 'string'},
+        type: 'property',
+        place: Object.assign(Object.assign({}, childrenPropPropertyPlace), {
+          effect: exports.Effect.Capture,
+        }),
+      };
+    }
+    props.push(childrenPropProperty);
+  }
+  if (refProperty == null) {
+    const refPropertyPlace = createTemporaryPlace(fn.env, instr.value.loc);
+    const refInstruction = {
+      id: makeInstructionId(0),
+      lvalue: Object.assign(Object.assign({}, refPropertyPlace), {
+        effect: exports.Effect.Mutate,
+      }),
+      value: {kind: 'Primitive', value: null, loc: instr.value.loc},
+      loc: instr.loc,
+    };
+    refProperty = {
+      kind: 'ObjectProperty',
+      key: {name: 'ref', kind: 'string'},
+      type: 'property',
+      place: Object.assign(Object.assign({}, refPropertyPlace), {
+        effect: exports.Effect.Capture,
+      }),
+    };
+    nextInstructions.push(refInstruction);
+  }
+  if (keyProperty == null) {
+    const keyPropertyPlace = createTemporaryPlace(fn.env, instr.value.loc);
+    const keyInstruction = {
+      id: makeInstructionId(0),
+      lvalue: Object.assign(Object.assign({}, keyPropertyPlace), {
+        effect: exports.Effect.Mutate,
+      }),
+      value: {kind: 'Primitive', value: null, loc: instr.value.loc},
+      loc: instr.loc,
+    };
+    keyProperty = {
+      kind: 'ObjectProperty',
+      key: {name: 'key', kind: 'string'},
+      type: 'property',
+      place: Object.assign(Object.assign({}, keyPropertyPlace), {
+        effect: exports.Effect.Capture,
+      }),
+    };
+    nextInstructions.push(keyInstruction);
+  }
+  const propsInstruction = {
+    id: makeInstructionId(0),
+    lvalue: Object.assign(Object.assign({}, propsPropertyPlace), {
+      effect: exports.Effect.Mutate,
+    }),
+    value: {kind: 'ObjectExpression', properties: props, loc: instr.value.loc},
+    loc: instr.loc,
+  };
+  const propsProperty = {
+    kind: 'ObjectProperty',
+    key: {name: 'props', kind: 'string'},
+    type: 'property',
+    place: Object.assign(Object.assign({}, propsPropertyPlace), {
+      effect: exports.Effect.Capture,
+    }),
+  };
+  nextInstructions.push(propsInstruction);
+  return {
+    refProperty: refProperty,
+    keyProperty: keyProperty,
+    propsProperty: propsProperty,
+  };
+}
+function inlineJsxTransform(fn) {
+  for (const [, block] of fn.body.blocks) {
+    let nextInstructions = null;
+    for (let i = 0; i < block.instructions.length; i++) {
+      const instr = block.instructions[i];
+      switch (instr.value.kind) {
+        case 'JsxExpression': {
+          nextInstructions !== null && nextInstructions !== void 0
+            ? nextInstructions
+            : (nextInstructions = block.instructions.slice(0, i));
+          const {
+            refProperty: refProperty,
+            keyProperty: keyProperty,
+            propsProperty: propsProperty,
+          } = createPropsProperties(
+            fn,
+            instr,
+            nextInstructions,
+            instr.value.props,
+            instr.value.children
+          );
+          const reactElementInstruction = {
+            id: makeInstructionId(0),
+            lvalue: Object.assign(Object.assign({}, instr.lvalue), {
+              effect: exports.Effect.Store,
+            }),
+            value: {
+              kind: 'ObjectExpression',
+              properties: [
+                createSymbolProperty(
+                  fn,
+                  instr,
+                  nextInstructions,
+                  '$$typeof',
+                  'react.transitional.element'
+                ),
+                createTagProperty(fn, instr, nextInstructions, instr.value.tag),
+                refProperty,
+                keyProperty,
+                propsProperty,
+              ],
+              loc: instr.value.loc,
+            },
+            loc: instr.loc,
+          };
+          nextInstructions.push(reactElementInstruction);
+          break;
+        }
+        case 'JsxFragment': {
+          nextInstructions !== null && nextInstructions !== void 0
+            ? nextInstructions
+            : (nextInstructions = block.instructions.slice(0, i));
+          const {
+            refProperty: refProperty,
+            keyProperty: keyProperty,
+            propsProperty: propsProperty,
+          } = createPropsProperties(
+            fn,
+            instr,
+            nextInstructions,
+            [],
+            instr.value.children
+          );
+          const reactElementInstruction = {
+            id: makeInstructionId(0),
+            lvalue: Object.assign(Object.assign({}, instr.lvalue), {
+              effect: exports.Effect.Store,
+            }),
+            value: {
+              kind: 'ObjectExpression',
+              properties: [
+                createSymbolProperty(
+                  fn,
+                  instr,
+                  nextInstructions,
+                  '$$typeof',
+                  'react.transitional.element'
+                ),
+                createSymbolProperty(
+                  fn,
+                  instr,
+                  nextInstructions,
+                  'type',
+                  'react.fragment'
+                ),
+                refProperty,
+                keyProperty,
+                propsProperty,
+              ],
+              loc: instr.value.loc,
+            },
+            loc: instr.loc,
+          };
+          nextInstructions.push(reactElementInstruction);
+          break;
+        }
+        default: {
+          if (nextInstructions !== null) {
+            nextInstructions.push(instr);
+          }
+        }
+      }
+    }
+    if (nextInstructions !== null) {
+      block.instructions = nextInstructions;
+    }
+  }
+  reversePostorderBlocks(fn.body);
+  markPredecessors(fn.body);
+  markInstructionIds(fn.body);
+  fixScopeAndIdentifierRanges(fn.body);
+}
 function findScopesToMerge(fn) {
   const objectMethodDecls = new Set();
   const mergeScopesBuilder = new DisjointSet();
@@ -157991,22 +158379,12 @@ function codegenTerminal(cx, terminal) {
             suggestions: null,
           });
         case InstructionKind.Catch:
-          CompilerError.invariant(false, {
-            reason: 'Unexpected catch variable as for..in collection',
-            description: null,
-            loc: iterableItem.loc,
-            suggestions: null,
-          });
         case InstructionKind.HoistedConst:
-          CompilerError.invariant(false, {
-            reason: 'Unexpected HoistedConst variable in for..in collection',
-            description: null,
-            loc: iterableItem.loc,
-            suggestions: null,
-          });
         case InstructionKind.HoistedLet:
+        case InstructionKind.HoistedFunction:
+        case InstructionKind.Function:
           CompilerError.invariant(false, {
-            reason: 'Unexpected HoistedLet variable in for..in collection',
+            reason: `Unexpected ${iterableItem.value.lvalue.kind} variable in for..in collection`,
             description: null,
             loc: iterableItem.loc,
             suggestions: null,
@@ -158080,30 +158458,13 @@ function codegenTerminal(cx, terminal) {
           varDeclKind = 'let';
           break;
         case InstructionKind.Reassign:
-          CompilerError.invariant(false, {
-            reason:
-              'Destructure should never be Reassign as it would be an Object/ArrayPattern',
-            description: null,
-            loc: iterableItem.loc,
-            suggestions: null,
-          });
         case InstructionKind.Catch:
-          CompilerError.invariant(false, {
-            reason: 'Unexpected catch variable as for..of collection',
-            description: null,
-            loc: iterableItem.loc,
-            suggestions: null,
-          });
         case InstructionKind.HoistedConst:
-          CompilerError.invariant(false, {
-            reason: 'Unexpected HoistedConst variable in for..of collection',
-            description: null,
-            loc: iterableItem.loc,
-            suggestions: null,
-          });
         case InstructionKind.HoistedLet:
+        case InstructionKind.HoistedFunction:
+        case InstructionKind.Function:
           CompilerError.invariant(false, {
-            reason: 'Unexpected HoistedLet variable in for..of collection',
+            reason: `Unexpected ${iterableItem.value.lvalue.kind} variable in for..of collection`,
             description: null,
             loc: iterableItem.loc,
             suggestions: null,
@@ -158262,6 +158623,39 @@ function codegenInstructionNullable(cx, instr) {
           t__namespace.variableDeclarator(codegenLValue(cx, lvalue), value),
         ]);
       }
+      case InstructionKind.Function: {
+        CompilerError.invariant(instr.lvalue === null, {
+          reason: `Function declaration cannot be referenced as an expression`,
+          description: null,
+          loc: instr.value.loc,
+          suggestions: null,
+        });
+        const genLvalue = codegenLValue(cx, lvalue);
+        CompilerError.invariant(genLvalue.type === 'Identifier', {
+          reason: 'Expected an identifier as a function declaration lvalue',
+          description: null,
+          loc: instr.value.loc,
+          suggestions: null,
+        });
+        CompilerError.invariant(
+          (value === null || value === void 0 ? void 0 : value.type) ===
+            'FunctionExpression',
+          {
+            reason: 'Expected a function as a function declaration value',
+            description: null,
+            loc: instr.value.loc,
+            suggestions: null,
+          }
+        );
+        return createFunctionDeclaration(
+          instr.loc,
+          genLvalue,
+          value.params,
+          value.body,
+          value.generator,
+          value.async
+        );
+      }
       case InstructionKind.Let: {
         CompilerError.invariant(instr.lvalue === null, {
           reason: `Const declaration cannot be referenced as an expression`,
@@ -158303,19 +158697,11 @@ function codegenInstructionNullable(cx, instr) {
       case InstructionKind.Catch: {
         return t__namespace.emptyStatement();
       }
-      case InstructionKind.HoistedLet: {
+      case InstructionKind.HoistedLet:
+      case InstructionKind.HoistedConst:
+      case InstructionKind.HoistedFunction: {
         CompilerError.invariant(false, {
-          reason:
-            'Expected HoistedLet to have been pruned in PruneHoistedContexts',
-          description: null,
-          loc: instr.loc,
-          suggestions: null,
-        });
-      }
-      case InstructionKind.HoistedConst: {
-        CompilerError.invariant(false, {
-          reason:
-            'Expected HoistedConsts to have been pruned in PruneHoistedContexts',
+          reason: `Expected ${kind} to have been pruned in PruneHoistedContexts`,
           description: null,
           loc: instr.loc,
           suggestions: null,
@@ -158463,6 +158849,7 @@ function withLoc(fn) {
 const createBinaryExpression = withLoc(t__namespace.binaryExpression);
 const createExpressionStatement = withLoc(t__namespace.expressionStatement);
 const createVariableDeclaration = withLoc(t__namespace.variableDeclaration);
+const createFunctionDeclaration = withLoc(t__namespace.functionDeclaration);
 const createTaggedTemplateExpression = withLoc(
   t__namespace.taggedTemplateExpression
 );
@@ -162063,6 +162450,16 @@ let Visitor$8 = class Visitor extends ReactiveFunctionTransform {
       );
       return {kind: 'remove'};
     }
+    if (
+      instruction.value.kind === 'DeclareContext' &&
+      instruction.value.lvalue.kind === 'HoistedFunction'
+    ) {
+      state.set(
+        instruction.value.lvalue.place.identifier.declarationId,
+        InstructionKind.Function
+      );
+      return {kind: 'remove'};
+    }
     if (
       instruction.value.kind === 'StoreContext' &&
       state.has(instruction.value.lvalue.place.identifier.declarationId)
@@ -167172,7 +167569,7 @@ function equation(left, right) {
   return {left: left, right: right};
 }
 function* generate(func) {
-  if (func.env.fnType === 'Component') {
+  if (func.fnType === 'Component') {
     const [props, ref] = func.params;
     if (props && props.kind === 'Identifier') {
       yield equation(props.identifier.type, {
@@ -168204,16 +168601,131 @@ function validateNoCapitalizedCalls(fn) {
     }
   }
 }
+var _Env_changed;
+class Env extends Map {
+  constructor() {
+    super(...arguments);
+    _Env_changed.set(this, false);
+  }
+  resetChanged() {
+    __classPrivateFieldSet(this, _Env_changed, false, 'f');
+  }
+  hasChanged() {
+    return __classPrivateFieldGet(this, _Env_changed, 'f');
+  }
+  set(key, value) {
+    const cur = this.get(key);
+    const widenedValue = joinRefAccessTypes(
+      value,
+      cur !== null && cur !== void 0 ? cur : {kind: 'None'}
+    );
+    if (
+      !(cur == null && widenedValue.kind === 'None') &&
+      (cur == null || !tyEqual(cur, widenedValue))
+    ) {
+      __classPrivateFieldSet(this, _Env_changed, true, 'f');
+    }
+    return super.set(key, widenedValue);
+  }
+}
+_Env_changed = new WeakMap();
 function validateNoRefAccessInRender(fn) {
-  const state = {
-    refs: new Set(),
-    refValues: new Map(),
-    refAccessingFunctions: new Set(),
-  };
-  validateNoRefAccessInRenderImpl(fn, state).unwrap();
+  const env = new Env();
+  validateNoRefAccessInRenderImpl(fn, env).unwrap();
+}
+function refTypeOfType(identifier) {
+  if (isRefValueType(identifier)) {
+    return {kind: 'RefValue'};
+  } else if (isUseRefType(identifier)) {
+    return {kind: 'Ref'};
+  } else {
+    return {kind: 'None'};
+  }
 }
-function validateNoRefAccessInRenderImpl(fn, state) {
-  var _a, _b;
+function tyEqual(a, b) {
+  if (a.kind !== b.kind) {
+    return false;
+  }
+  switch (a.kind) {
+    case 'None':
+      return true;
+    case 'Ref':
+      return true;
+    case 'RefValue':
+      CompilerError.invariant(b.kind === 'RefValue', {
+        reason: 'Expected ref value',
+        loc: null,
+      });
+      return a.loc == b.loc;
+    case 'Structure': {
+      CompilerError.invariant(b.kind === 'Structure', {
+        reason: 'Expected structure',
+        loc: null,
+      });
+      const fnTypesEqual =
+        (a.fn === null && b.fn === null) ||
+        (a.fn !== null &&
+          b.fn !== null &&
+          a.fn.readRefEffect === b.fn.readRefEffect &&
+          tyEqual(a.fn.returnType, b.fn.returnType));
+      return (
+        fnTypesEqual &&
+        (a.value === b.value ||
+          (a.value !== null && b.value !== null && tyEqual(a.value, b.value)))
+      );
+    }
+  }
+}
+function joinRefAccessTypes(...types) {
+  function joinRefAccessRefTypes(a, b) {
+    if (a.kind === 'RefValue') {
+      return a;
+    } else if (b.kind === 'RefValue') {
+      return b;
+    } else if (a.kind === 'Ref' || b.kind === 'Ref') {
+      return {kind: 'Ref'};
+    } else {
+      CompilerError.invariant(
+        a.kind === 'Structure' && b.kind === 'Structure',
+        {reason: 'Expected structure', loc: null}
+      );
+      const fn =
+        a.fn === null
+          ? b.fn
+          : b.fn === null
+            ? a.fn
+            : {
+                readRefEffect: a.fn.readRefEffect || b.fn.readRefEffect,
+                returnType: joinRefAccessTypes(
+                  a.fn.returnType,
+                  b.fn.returnType
+                ),
+              };
+      const value =
+        a.value === null
+          ? b.value
+          : b.value === null
+            ? a.value
+            : joinRefAccessRefTypes(a.value, b.value);
+      return {kind: 'Structure', fn: fn, value: value};
+    }
+  }
+  return types.reduce(
+    (a, b) => {
+      if (a.kind === 'None') {
+        return b;
+      } else if (b.kind === 'None') {
+        return a;
+      } else {
+        return joinRefAccessRefTypes(a, b);
+      }
+    },
+    {kind: 'None'}
+  );
+}
+function validateNoRefAccessInRenderImpl(fn, env) {
+  var _a, _b, _c, _d, _e, _f;
+  let returnValues = [];
   let place;
   for (const param of fn.params) {
     if (param.kind === 'Identifier') {
@@ -168221,291 +168733,293 @@ function validateNoRefAccessInRenderImpl(fn, state) {
     } else {
       place = param.place;
     }
-    if (isRefValueType(place.identifier)) {
-      state.refValues.set(place.identifier.id, null);
-    }
-    if (isUseRefType(place.identifier)) {
-      state.refs.add(place.identifier.id);
-    }
+    const type = refTypeOfType(place.identifier);
+    env.set(place.identifier.id, type);
   }
-  const errors = new CompilerError();
-  for (const [, block] of fn.body.blocks) {
-    for (const phi of block.phis) {
-      phi.operands.forEach(operand => {
-        var _a;
-        if (state.refs.has(operand.id) || isUseRefType(phi.id)) {
-          state.refs.add(phi.id.id);
-        }
-        const refValue = state.refValues.get(operand.id);
-        if (refValue !== undefined || isRefValueType(operand)) {
-          state.refValues.set(
-            phi.id.id,
-            (_a =
-              refValue !== null && refValue !== void 0
-                ? refValue
-                : state.refValues.get(phi.id.id)) !== null && _a !== void 0
-              ? _a
-              : null
-          );
-        }
-        if (state.refAccessingFunctions.has(operand.id)) {
-          state.refAccessingFunctions.add(phi.id.id);
-        }
-      });
-    }
-    for (const instr of block.instructions) {
-      for (const operand of eachInstructionValueOperand(instr.value)) {
-        if (isRefValueType(operand.identifier)) {
-          CompilerError.invariant(state.refValues.has(operand.identifier.id), {
-            reason: 'Expected ref value to be in state',
-            loc: operand.loc,
-          });
-        }
-        if (isUseRefType(operand.identifier)) {
-          CompilerError.invariant(state.refs.has(operand.identifier.id), {
-            reason: 'Expected ref to be in state',
-            loc: operand.loc,
-          });
-        }
+  for (let i = 0; (i == 0 || env.hasChanged()) && i < 10; i++) {
+    env.resetChanged();
+    returnValues = [];
+    const errors = new CompilerError();
+    for (const [, block] of fn.body.blocks) {
+      for (const phi of block.phis) {
+        env.set(
+          phi.id.id,
+          joinRefAccessTypes(
+            ...Array(...phi.operands.values()).map(operand => {
+              var _a;
+              return (_a = env.get(operand.id)) !== null && _a !== void 0
+                ? _a
+                : {kind: 'None'};
+            })
+          )
+        );
       }
-      switch (instr.value.kind) {
-        case 'JsxExpression':
-        case 'JsxFragment': {
-          for (const operand of eachInstructionValueOperand(instr.value)) {
-            validateNoDirectRefValueAccess(errors, operand, state);
-          }
-          break;
-        }
-        case 'ComputedLoad':
-        case 'PropertyLoad': {
-          if (typeof instr.value.property !== 'string') {
-            validateNoRefValueAccess(errors, state, instr.value.property);
-          }
-          if (
-            state.refAccessingFunctions.has(instr.value.object.identifier.id)
-          ) {
-            state.refAccessingFunctions.add(instr.lvalue.identifier.id);
-          }
-          if (state.refs.has(instr.value.object.identifier.id)) {
-            state.refs.add(instr.lvalue.identifier.id);
-            state.refValues.set(instr.lvalue.identifier.id, instr.loc);
-          }
-          break;
-        }
-        case 'LoadContext':
-        case 'LoadLocal': {
-          if (
-            state.refAccessingFunctions.has(instr.value.place.identifier.id)
-          ) {
-            state.refAccessingFunctions.add(instr.lvalue.identifier.id);
-          }
-          const refValue = state.refValues.get(instr.value.place.identifier.id);
-          if (refValue !== undefined) {
-            state.refValues.set(instr.lvalue.identifier.id, refValue);
+      for (const instr of block.instructions) {
+        switch (instr.value.kind) {
+          case 'JsxExpression':
+          case 'JsxFragment': {
+            for (const operand of eachInstructionValueOperand(instr.value)) {
+              validateNoDirectRefValueAccess(errors, operand, env);
+            }
+            break;
           }
-          if (state.refs.has(instr.value.place.identifier.id)) {
-            state.refs.add(instr.lvalue.identifier.id);
+          case 'ComputedLoad':
+          case 'PropertyLoad': {
+            if (typeof instr.value.property !== 'string') {
+              validateNoDirectRefValueAccess(errors, instr.value.property, env);
+            }
+            const objType = env.get(instr.value.object.identifier.id);
+            let lookupType = null;
+            if (
+              (objType === null || objType === void 0
+                ? void 0
+                : objType.kind) === 'Structure'
+            ) {
+              lookupType = objType.value;
+            } else if (
+              (objType === null || objType === void 0
+                ? void 0
+                : objType.kind) === 'Ref'
+            ) {
+              lookupType = {kind: 'RefValue', loc: instr.loc};
+            }
+            env.set(
+              instr.lvalue.identifier.id,
+              lookupType !== null && lookupType !== void 0
+                ? lookupType
+                : refTypeOfType(instr.lvalue.identifier)
+            );
+            break;
           }
-          break;
-        }
-        case 'StoreContext':
-        case 'StoreLocal': {
-          if (
-            state.refAccessingFunctions.has(instr.value.value.identifier.id)
-          ) {
-            state.refAccessingFunctions.add(
-              instr.value.lvalue.place.identifier.id
+          case 'LoadContext':
+          case 'LoadLocal': {
+            env.set(
+              instr.lvalue.identifier.id,
+              (_a = env.get(instr.value.place.identifier.id)) !== null &&
+                _a !== void 0
+                ? _a
+                : refTypeOfType(instr.lvalue.identifier)
             );
-            state.refAccessingFunctions.add(instr.lvalue.identifier.id);
+            break;
           }
-          const refValue = state.refValues.get(instr.value.value.identifier.id);
-          if (
-            refValue !== undefined ||
-            isRefValueType(instr.value.lvalue.place.identifier)
-          ) {
-            state.refValues.set(
+          case 'StoreContext':
+          case 'StoreLocal': {
+            env.set(
               instr.value.lvalue.place.identifier.id,
-              refValue !== null && refValue !== void 0 ? refValue : null
+              (_b = env.get(instr.value.value.identifier.id)) !== null &&
+                _b !== void 0
+                ? _b
+                : refTypeOfType(instr.value.lvalue.place.identifier)
             );
-            state.refValues.set(
+            env.set(
               instr.lvalue.identifier.id,
-              refValue !== null && refValue !== void 0 ? refValue : null
+              (_c = env.get(instr.value.value.identifier.id)) !== null &&
+                _c !== void 0
+                ? _c
+                : refTypeOfType(instr.lvalue.identifier)
             );
+            break;
           }
-          if (state.refs.has(instr.value.value.identifier.id)) {
-            state.refs.add(instr.value.lvalue.place.identifier.id);
-            state.refs.add(instr.lvalue.identifier.id);
-          }
-          break;
-        }
-        case 'Destructure': {
-          const destructuredFunction = state.refAccessingFunctions.has(
-            instr.value.value.identifier.id
-          );
-          const destructuredRef = state.refs.has(
-            instr.value.value.identifier.id
-          );
-          for (const lval of eachPatternOperand(instr.value.lvalue.pattern)) {
-            if (isUseRefType(lval.identifier)) {
-              state.refs.add(lval.identifier.id);
-            }
-            if (destructuredRef || isRefValueType(lval.identifier)) {
-              state.refs.add(lval.identifier.id);
-              state.refValues.set(lval.identifier.id, null);
+          case 'Destructure': {
+            const objType = env.get(instr.value.value.identifier.id);
+            let lookupType = null;
+            if (
+              (objType === null || objType === void 0
+                ? void 0
+                : objType.kind) === 'Structure'
+            ) {
+              lookupType = objType.value;
             }
-            if (destructuredFunction) {
-              state.refAccessingFunctions.add(lval.identifier.id);
+            env.set(
+              instr.lvalue.identifier.id,
+              lookupType !== null && lookupType !== void 0
+                ? lookupType
+                : refTypeOfType(instr.lvalue.identifier)
+            );
+            for (const lval of eachPatternOperand(instr.value.lvalue.pattern)) {
+              env.set(
+                lval.identifier.id,
+                lookupType !== null && lookupType !== void 0
+                  ? lookupType
+                  : refTypeOfType(lval.identifier)
+              );
             }
+            break;
           }
-          break;
-        }
-        case 'ObjectMethod':
-        case 'FunctionExpression': {
-          if (
-            [...eachInstructionValueOperand(instr.value)].some(
-              operand =>
-                state.refValues.has(operand.identifier.id) ||
-                state.refAccessingFunctions.has(operand.identifier.id)
-            ) ||
-            ([...eachInstructionValueOperand(instr.value)].some(operand =>
-              state.refs.has(operand.identifier.id)
-            ) &&
-              validateNoRefAccessInRenderImpl(
-                instr.value.loweredFunc.func,
-                state
-              ).isErr())
-          ) {
-            state.refAccessingFunctions.add(instr.lvalue.identifier.id);
+          case 'ObjectMethod':
+          case 'FunctionExpression': {
+            let returnType = {kind: 'None'};
+            let readRefEffect = false;
+            const result = validateNoRefAccessInRenderImpl(
+              instr.value.loweredFunc.func,
+              env
+            );
+            if (result.isOk()) {
+              returnType = result.unwrap();
+            } else if (result.isErr()) {
+              readRefEffect = true;
+            }
+            env.set(instr.lvalue.identifier.id, {
+              kind: 'Structure',
+              fn: {readRefEffect: readRefEffect, returnType: returnType},
+              value: null,
+            });
+            break;
           }
-          break;
-        }
-        case 'MethodCall': {
-          if (!isEffectHook(instr.value.property.identifier)) {
+          case 'MethodCall':
+          case 'CallExpression': {
+            const callee =
+              instr.value.kind === 'CallExpression'
+                ? instr.value.callee
+                : instr.value.property;
+            const hookKind = getHookKindForType(fn.env, callee.identifier.type);
+            let returnType = {kind: 'None'};
+            const fnType = env.get(callee.identifier.id);
+            if (
+              (fnType === null || fnType === void 0 ? void 0 : fnType.kind) ===
+                'Structure' &&
+              fnType.fn !== null
+            ) {
+              returnType = fnType.fn.returnType;
+              if (fnType.fn.readRefEffect) {
+                errors.push({
+                  severity: exports.ErrorSeverity.InvalidReact,
+                  reason:
+                    'This function accesses a ref value (the `current` property), which may not be accessed during render. (https://react.dev/reference/react/useRef)',
+                  loc: callee.loc,
+                  description:
+                    callee.identifier.name !== null &&
+                    callee.identifier.name.kind === 'named'
+                      ? `Function \`${callee.identifier.name.value}\` accesses a ref`
+                      : null,
+                  suggestions: null,
+                });
+              }
+            }
             for (const operand of eachInstructionValueOperand(instr.value)) {
-              validateNoRefAccess(errors, state, operand, operand.loc);
+              if (hookKind != null) {
+                validateNoDirectRefValueAccess(errors, operand, env);
+              } else {
+                validateNoRefAccess(errors, env, operand, operand.loc);
+              }
             }
+            env.set(instr.lvalue.identifier.id, returnType);
+            break;
           }
-          break;
-        }
-        case 'CallExpression': {
-          const callee = instr.value.callee;
-          const isUseEffect = isEffectHook(callee.identifier);
-          if (!isUseEffect) {
-            if (state.refAccessingFunctions.has(callee.identifier.id)) {
-              errors.push({
-                severity: exports.ErrorSeverity.InvalidReact,
-                reason:
-                  'This function accesses a ref value (the `current` property), which may not be accessed during render. (https://react.dev/reference/react/useRef)',
-                loc: callee.loc,
-                description:
-                  callee.identifier.name !== null &&
-                  callee.identifier.name.kind === 'named'
-                    ? `Function \`${callee.identifier.name.value}\` accesses a ref`
-                    : null,
-                suggestions: null,
-              });
-            }
+          case 'ObjectExpression':
+          case 'ArrayExpression': {
+            const types = [];
             for (const operand of eachInstructionValueOperand(instr.value)) {
-              validateNoRefAccess(
-                errors,
-                state,
-                operand,
-                (_a = state.refValues.get(operand.identifier.id)) !== null &&
-                  _a !== void 0
-                  ? _a
-                  : operand.loc
+              validateNoDirectRefValueAccess(errors, operand, env);
+              types.push(
+                (_d = env.get(operand.identifier.id)) !== null && _d !== void 0
+                  ? _d
+                  : {kind: 'None'}
               );
             }
-          }
-          break;
-        }
-        case 'ObjectExpression':
-        case 'ArrayExpression': {
-          for (const operand of eachInstructionValueOperand(instr.value)) {
-            validateNoDirectRefValueAccess(errors, operand, state);
-            if (state.refAccessingFunctions.has(operand.identifier.id)) {
-              state.refAccessingFunctions.add(instr.lvalue.identifier.id);
+            const value = joinRefAccessTypes(...types);
+            if (value.kind === 'None') {
+              env.set(instr.lvalue.identifier.id, {kind: 'None'});
+            } else {
+              env.set(instr.lvalue.identifier.id, {
+                kind: 'Structure',
+                value: value,
+                fn: null,
+              });
             }
-            if (state.refs.has(operand.identifier.id)) {
-              state.refs.add(instr.lvalue.identifier.id);
+            break;
+          }
+          case 'PropertyDelete':
+          case 'PropertyStore':
+          case 'ComputedDelete':
+          case 'ComputedStore': {
+            validateNoRefAccess(errors, env, instr.value.object, instr.loc);
+            for (const operand of eachInstructionValueOperand(instr.value)) {
+              if (operand === instr.value.object) {
+                continue;
+              }
+              validateNoRefValueAccess(errors, env, operand);
             }
-            const refValue = state.refValues.get(operand.identifier.id);
-            if (refValue !== undefined) {
-              state.refValues.set(instr.lvalue.identifier.id, refValue);
+            break;
+          }
+          case 'StartMemoize':
+          case 'FinishMemoize':
+            break;
+          default: {
+            for (const operand of eachInstructionValueOperand(instr.value)) {
+              validateNoRefValueAccess(errors, env, operand);
             }
+            break;
           }
-          break;
         }
-        case 'PropertyDelete':
-        case 'PropertyStore':
-        case 'ComputedDelete':
-        case 'ComputedStore': {
-          validateNoRefAccess(
-            errors,
-            state,
-            instr.value.object,
-            (_b = state.refValues.get(instr.value.object.identifier.id)) !==
-              null && _b !== void 0
-              ? _b
-              : instr.loc
+        if (isUseRefType(instr.lvalue.identifier)) {
+          env.set(
+            instr.lvalue.identifier.id,
+            joinRefAccessTypes(
+              (_e = env.get(instr.lvalue.identifier.id)) !== null &&
+                _e !== void 0
+                ? _e
+                : {kind: 'None'},
+              {kind: 'Ref'}
+            )
           );
-          for (const operand of eachInstructionValueOperand(instr.value)) {
-            if (operand === instr.value.object) {
-              continue;
-            }
-            validateNoRefValueAccess(errors, state, operand);
-          }
-          break;
         }
-        case 'StartMemoize':
-        case 'FinishMemoize':
-          break;
-        default: {
-          for (const operand of eachInstructionValueOperand(instr.value)) {
-            validateNoRefValueAccess(errors, state, operand);
-          }
-          break;
+        if (isRefValueType(instr.lvalue.identifier)) {
+          env.set(
+            instr.lvalue.identifier.id,
+            joinRefAccessTypes(
+              (_f = env.get(instr.lvalue.identifier.id)) !== null &&
+                _f !== void 0
+                ? _f
+                : {kind: 'None'},
+              {kind: 'RefValue', loc: instr.loc}
+            )
+          );
         }
       }
-      if (isUseRefType(instr.lvalue.identifier)) {
-        state.refs.add(instr.lvalue.identifier.id);
-      }
-      if (
-        isRefValueType(instr.lvalue.identifier) &&
-        !state.refValues.has(instr.lvalue.identifier.id)
-      ) {
-        state.refValues.set(instr.lvalue.identifier.id, instr.loc);
+      for (const operand of eachTerminalOperand(block.terminal)) {
+        if (block.terminal.kind !== 'return') {
+          validateNoRefValueAccess(errors, env, operand);
+        } else {
+          validateNoDirectRefValueAccess(errors, operand, env);
+          returnValues.push(env.get(operand.identifier.id));
+        }
       }
     }
-    for (const operand of eachTerminalOperand(block.terminal)) {
-      if (block.terminal.kind !== 'return') {
-        validateNoRefValueAccess(errors, state, operand);
-      } else {
-        validateNoDirectRefValueAccess(errors, operand, state);
-      }
+    if (errors.hasErrors()) {
+      return Err(errors);
     }
   }
-  if (errors.hasErrors()) {
-    return Err(errors);
-  } else {
-    return Ok(undefined);
+  CompilerError.invariant(!env.hasChanged(), {
+    reason: 'Ref type environment did not converge',
+    loc: null,
+  });
+  return Ok(
+    joinRefAccessTypes(...returnValues.filter(env => env !== undefined))
+  );
+}
+function destructure(type) {
+  if (
+    (type === null || type === void 0 ? void 0 : type.kind) === 'Structure' &&
+    type.value !== null
+  ) {
+    return destructure(type.value);
   }
+  return type;
 }
-function validateNoRefValueAccess(errors, state, operand) {
+function validateNoRefValueAccess(errors, env, operand) {
   var _a;
+  const type = destructure(env.get(operand.identifier.id));
   if (
-    state.refValues.has(operand.identifier.id) ||
-    state.refAccessingFunctions.has(operand.identifier.id)
+    (type === null || type === void 0 ? void 0 : type.kind) === 'RefValue' ||
+    ((type === null || type === void 0 ? void 0 : type.kind) === 'Structure' &&
+      ((_a = type.fn) === null || _a === void 0 ? void 0 : _a.readRefEffect))
   ) {
     errors.push({
       severity: exports.ErrorSeverity.InvalidReact,
       reason:
         'Ref values (the `current` property) may not be accessed during render. (https://react.dev/reference/react/useRef)',
-      loc:
-        (_a = state.refValues.get(operand.identifier.id)) !== null &&
-        _a !== void 0
-          ? _a
-          : operand.loc,
+      loc: (type.kind === 'RefValue' && type.loc) || operand.loc,
       description:
         operand.identifier.name !== null &&
         operand.identifier.name.kind === 'named'
@@ -168515,17 +169029,20 @@ function validateNoRefValueAccess(errors, state, operand) {
     });
   }
 }
-function validateNoRefAccess(errors, state, operand, loc) {
+function validateNoRefAccess(errors, env, operand, loc) {
+  var _a;
+  const type = destructure(env.get(operand.identifier.id));
   if (
-    state.refs.has(operand.identifier.id) ||
-    state.refValues.has(operand.identifier.id) ||
-    state.refAccessingFunctions.has(operand.identifier.id)
+    (type === null || type === void 0 ? void 0 : type.kind) === 'Ref' ||
+    (type === null || type === void 0 ? void 0 : type.kind) === 'RefValue' ||
+    ((type === null || type === void 0 ? void 0 : type.kind) === 'Structure' &&
+      ((_a = type.fn) === null || _a === void 0 ? void 0 : _a.readRefEffect))
   ) {
     errors.push({
       severity: exports.ErrorSeverity.InvalidReact,
       reason:
         'Ref values (the `current` property) may not be accessed during render. (https://react.dev/reference/react/useRef)',
-      loc: loc,
+      loc: (type.kind === 'RefValue' && type.loc) || loc,
       description:
         operand.identifier.name !== null &&
         operand.identifier.name.kind === 'named'
@@ -168535,18 +169052,15 @@ function validateNoRefAccess(errors, state, operand, loc) {
     });
   }
 }
-function validateNoDirectRefValueAccess(errors, operand, state) {
+function validateNoDirectRefValueAccess(errors, operand, env) {
   var _a;
-  if (state.refValues.has(operand.identifier.id)) {
+  const type = destructure(env.get(operand.identifier.id));
+  if ((type === null || type === void 0 ? void 0 : type.kind) === 'RefValue') {
     errors.push({
       severity: exports.ErrorSeverity.InvalidReact,
       reason:
         'Ref values (the `current` property) may not be accessed during render. (https://react.dev/reference/react/useRef)',
-      loc:
-        (_a = state.refValues.get(operand.identifier.id)) !== null &&
-        _a !== void 0
-          ? _a
-          : operand.loc,
+      loc: (_a = type.loc) !== null && _a !== void 0 ? _a : operand.loc,
       description:
         operand.identifier.name !== null &&
         operand.identifier.name.kind === 'named'
@@ -170760,6 +171274,10 @@ function* runWithEnvironment(func, env) {
     propagateScopeDependenciesHIR(hir);
     yield log({kind: 'hir', name: 'PropagateScopeDependenciesHIR', value: hir});
   }
+  if (env.config.enableInlineJsxTransform) {
+    inlineJsxTransform(hir);
+    yield log({kind: 'hir', name: 'inlineJsxTransform', value: hir});
+  }
   const reactiveFunction = buildReactiveFunction(hir);
   yield log({
     kind: 'reactive',
@@ -170933,6 +171451,10 @@ function log(value) {
   }
   return value;
 }
+function* runPlayground(func, config, fnType) {
+  const ast = yield* run(func, config, fnType, '_c', null, null, null);
+  return ast;
+}
 function isComponentDeclaration(node) {
   return Object.prototype.hasOwnProperty.call(node, '__componentDeclaration');
 }
@@ -171999,4 +172521,5 @@ exports.printHIR = printHIR;
 exports.printReactiveFunction = printReactiveFunction;
 exports.run = run;
 exports.runBabelPluginReactCompiler = runBabelPluginReactCompiler;
+exports.runPlayground = runPlayground;
 exports.validateEnvironmentConfig = validateEnvironmentConfig;