[syntax] Add experimental React JSX in .iris files

compiler-backend/functional/src/convert.rs

@@ -4,6 +4,7 @@ mod application;
 mod declaration;
 mod evidence;
 mod expression;
+mod react;
 mod stylex;
 
 use std::cell::{OnceCell, RefCell};
@@ -30,6 +31,7 @@ use crate::tree::{
 
 use self::declaration::{derive_declaration, instance_declaration, term_declaration};
 use self::evidence::{EvidenceHoisting, EvidenceKeys, EvidenceScope};
+use self::react::ReactModule;
 use self::stylex::StyleXModules;
 
 type ConversionResult<T> = Result<T, ConversionError>;
@@ -87,6 +89,7 @@ struct Context<'c, Q> {
     dependencies: FxHashMap<FileId, Dependency>,
     indexed_dependencies: RefCell<FxHashMap<FileId, Arc<indexing::IndexedModule>>>,
     stylex_modules: OnceCell<StyleXModules>,
+    react_module: OnceCell<ReactModule>,
     /// Whether a term of a virtual StyleX module was referenced, the only source of StyleX
     /// intrinsics and expressions.
     references_stylex_module: bool,
@@ -153,6 +156,7 @@ where
             dependencies: FxHashMap::default(),
             indexed_dependencies: RefCell::default(),
             stylex_modules: OnceCell::new(),
+            react_module: OnceCell::new(),
             references_stylex_module: false,
             thunk_modules: OnceCell::new(),
             canonical_thunk_instances: RefCell::default(),
@@ -192,6 +196,8 @@ fn convert(mut context: Context<'_, impl checking::ExternalQueries>) -> Conversi
     }
     validate_runtime_exports(&context, &declarations, &surface)?;
     context.validate_stylex_uses(&declarations)?;
+    context.validate_react_uses(&declarations)?;
+    context.materialize_react_functions(&declarations)?;
     context.hoist_closed_evidence(&mut declarations)?;
 
     let recursive_globals = declarations

compiler-backend/functional/src/convert/application.rs

@@ -122,6 +122,9 @@ where
         {
             return Ok(expression);
         }
+        if let Some(expression) = self.react_intrinsic(known_function, &known_arguments)? {
+            return Ok(expression);
+        }
         if let Some(effect) = self.known_effect_application(known_function, &known_arguments)? {
             return Ok(self.expression(ExpressionKind::Effect { effect }));
         }

compiler-backend/functional/src/convert/expression.rs

@@ -315,6 +315,9 @@ fn variable(
                 if let Some(expression) = context.stylex_value_intrinsic(file_id, term_id)? {
                     return Ok(expression);
                 }
+                if let Some(expression) = context.react_value_intrinsic(file_id, term_id)? {
+                    return Ok(expression);
+                }
                 let global = context.term_global(file_id, term_id)?;
                 Ok(context.expression(ExpressionKind::Global { global }))
             }

compiler-backend/functional/src/convert/react.rs

@@ -0,0 +1,222 @@
+//! Recognition and lowering for the virtual React module.
+
+use building_types::QueryResult;
+use files::FileId;
+use indexing::TermItemId;
+use rustc_hash::FxHashSet;
+
+use crate::error::UnsupportedState;
+use crate::optimize::for_each_expression_child;
+use crate::react::{ReactElement, ReactExpression};
+use crate::tree::{Declaration, DeclarationKind, ExpressionId, ExpressionKind, GlobalId};
+
+use super::{Context, ConversionResult};
+
+#[derive(Clone, Copy)]
+pub(super) struct ReactModule(Option<FileId>);
+
+#[derive(Clone, Copy)]
+enum ReactIntrinsic {
+    Component,
+    Element,
+    ElementKeyed,
+    Intrinsic,
+    IntrinsicKeyed,
+    Text,
+    Array,
+    Fragment,
+    Empty,
+}
+
+impl<'c, Q: checking::ExternalQueries> Context<'c, Q> {
+    pub(super) fn react_intrinsic(
+        &mut self,
+        function: ExpressionId,
+        arguments: &[ExpressionId],
+    ) -> ConversionResult<Option<ExpressionId>> {
+        let ExpressionKind::Global { global } = self.storage[function].kind.clone() else {
+            return Ok(None);
+        };
+        let GlobalId::Term(file_id, term_id) = global.id else { return Ok(None) };
+        let Some(intrinsic) = self.react_intrinsic_identity(file_id, term_id)? else {
+            return Ok(None);
+        };
+        let expression = match (intrinsic, arguments) {
+            (ReactIntrinsic::Component, [render]) => ReactExpression::Component { render: *render },
+            (ReactIntrinsic::Element, [_, component, props]) => {
+                self.react_element(ReactElement::Component(*component), *props, None)
+            }
+            (ReactIntrinsic::ElementKeyed, [_, key, component, props]) => {
+                self.react_element(ReactElement::Component(*component), *props, Some(*key))
+            }
+            (ReactIntrinsic::Intrinsic, [_, tag, props]) => {
+                self.react_element(ReactElement::Intrinsic(*tag), *props, None)
+            }
+            (ReactIntrinsic::IntrinsicKeyed, [_, key, tag, props]) => {
+                self.react_element(ReactElement::Intrinsic(*tag), *props, Some(*key))
+            }
+            (ReactIntrinsic::Text | ReactIntrinsic::Array, [value]) => return Ok(Some(*value)),
+            (ReactIntrinsic::Fragment, [children]) => {
+                ReactExpression::Fragment { children: *children }
+            }
+            (ReactIntrinsic::Empty, []) => ReactExpression::Empty,
+            _ => return Ok(None),
+        };
+        Ok(Some(self.expression(ExpressionKind::React(expression))))
+    }
+
+    fn react_element(
+        &self,
+        component: ReactElement,
+        props: ExpressionId,
+        key: Option<ExpressionId>,
+    ) -> ReactExpression {
+        let static_multiple_children = match &self.storage[props].kind {
+            ExpressionKind::Record { fields } => fields.iter().any(|field| {
+                if field.field.name != "children" {
+                    return false;
+                }
+                match &self.storage[field.expression].kind {
+                    ExpressionKind::Array { elements } => elements.len() > 1,
+                    _ => false,
+                }
+            }),
+            _ => false,
+        };
+        ReactExpression::Element { component, props, key, static_multiple_children }
+    }
+
+    pub(super) fn react_value_intrinsic(
+        &mut self,
+        file_id: FileId,
+        term_id: TermItemId,
+    ) -> ConversionResult<Option<ExpressionId>> {
+        let Some(intrinsic) = self.react_intrinsic_identity(file_id, term_id)? else {
+            return Ok(None);
+        };
+        if matches!(intrinsic, ReactIntrinsic::Empty) {
+            return Ok(Some(self.expression(ExpressionKind::React(ReactExpression::Empty))));
+        }
+        Ok(None)
+    }
+
+    fn react_intrinsic_identity(
+        &self,
+        file_id: FileId,
+        term_id: TermItemId,
+    ) -> QueryResult<Option<ReactIntrinsic>> {
+        if self.react_module().0 != Some(file_id) {
+            return Ok(None);
+        }
+        let indexed = self.indexed_module(file_id)?;
+        let intrinsic = match indexed.items[term_id].name.as_deref() {
+            Some("component") => ReactIntrinsic::Component,
+            Some("element") => ReactIntrinsic::Element,
+            Some("elementKeyed") => ReactIntrinsic::ElementKeyed,
+            Some("intrinsic") => ReactIntrinsic::Intrinsic,
+            Some("intrinsicKeyed") => ReactIntrinsic::IntrinsicKeyed,
+            Some("text") => ReactIntrinsic::Text,
+            Some("array") => ReactIntrinsic::Array,
+            Some("fragment") => ReactIntrinsic::Fragment,
+            Some("empty") => ReactIntrinsic::Empty,
+            _ => return Ok(None),
+        };
+        Ok(Some(intrinsic))
+    }
+
+    pub(super) fn validate_react_uses(&self, declarations: &[Declaration]) -> ConversionResult<()> {
+        for declaration in declarations {
+            let DeclarationKind::Value(root) = declaration.kind else { continue };
+            self.validate_react_expression(root, root, declaration)?;
+        }
+        Ok(())
+    }
+
+    pub(super) fn materialize_react_functions(
+        &mut self,
+        declarations: &[Declaration],
+    ) -> ConversionResult<()> {
+        let roots = declarations.iter().filter_map(|declaration| match declaration.kind {
+            DeclarationKind::Value(root) => Some((root, declaration.global.id)),
+            _ => None,
+        });
+        let mut pending = roots.collect::<Vec<_>>();
+        let mut visited = FxHashSet::default();
+        while let Some((expression, declaration)) = pending.pop() {
+            if !visited.insert(expression) {
+                continue;
+            }
+            if let ExpressionKind::Global { global } = &self.storage[expression].kind
+                && let GlobalId::Term(file_id, term_id) = global.id
+                && let Some(intrinsic) = self.react_intrinsic_identity(file_id, term_id)?
+            {
+                let names: &[&str] = match intrinsic {
+                    ReactIntrinsic::Component => {
+                        return Err(self
+                            .unsupported(UnsupportedState::InvalidReactComponent { declaration }));
+                    }
+                    ReactIntrinsic::Element | ReactIntrinsic::Intrinsic => {
+                        &["dictionary", "target", "props"]
+                    }
+                    ReactIntrinsic::ElementKeyed | ReactIntrinsic::IntrinsicKeyed => {
+                        &["dictionary", "key", "target", "props"]
+                    }
+                    ReactIntrinsic::Text | ReactIntrinsic::Array => &["value"],
+                    ReactIntrinsic::Fragment => &["children"],
+                    ReactIntrinsic::Empty => &[],
+                };
+                let mut parameters = Vec::new();
+                let mut arguments = Vec::new();
+                for name in names {
+                    let parameter = self.fresh_parameter((*name).into())?;
+                    arguments.push(
+                        self.expression(ExpressionKind::Local { parameter: parameter.clone() }),
+                    );
+                    parameters.push(parameter);
+                }
+                let body = self
+                    .react_intrinsic(expression, &arguments)?
+                    .expect("React intrinsic arity mismatch");
+                let function = self.parameter_abstraction(parameters, body);
+                let kind = self.storage[function].kind.clone();
+                self.storage.replace_expression_kind(expression, kind);
+            } else {
+                for_each_expression_child(&self.storage[expression].kind, |child| {
+                    pending.push((child, declaration))
+                });
+            }
+        }
+        Ok(())
+    }
+
+    fn validate_react_expression(
+        &self,
+        expression: ExpressionId,
+        root: ExpressionId,
+        declaration: &Declaration,
+    ) -> ConversionResult<()> {
+        if let ExpressionKind::React(ReactExpression::Component { .. }) =
+            &self.storage[expression].kind
+            && (expression != root || declaration.recursive_group.is_some())
+        {
+            return Err(self.unsupported(UnsupportedState::InvalidReactComponent {
+                declaration: declaration.global.id,
+            }));
+        }
+        let mut result = Ok(());
+        for_each_expression_child(&self.storage[expression].kind, |child| {
+            if result.is_ok() {
+                result = self.validate_react_expression(child, root, declaration);
+            }
+        });
+        result
+    }
+
+    fn react_module(&self) -> ReactModule {
+        *self.react_module.get_or_init(|| ReactModule(self.queries.module_file("Iris.React")))
+    }
+
+    pub(super) fn react_module_is_virtual(&self, file_id: FileId) -> bool {
+        self.react_module().0 == Some(file_id)
+    }
+}

compiler-backend/functional/src/convert/stylex.rs

@@ -447,7 +447,7 @@ where
     }
 
     pub(super) fn module_is_virtual(&self, file_id: FileId) -> bool {
-        self.stylex_modules().module(file_id).is_some()
+        self.stylex_modules().module(file_id).is_some() || self.react_module_is_virtual(file_id)
     }
 
     pub(super) fn validate_runtime_reference(

compiler-backend/functional/src/error.rs

@@ -50,6 +50,8 @@ pub enum UnsupportedState {
     InvalidStyleXUse { function: String, declaration: GlobalId },
     #[error("Iris.StyleX.{function} {requirement}")]
     InvalidStyleXContext { function: String, requirement: String, declaration: GlobalId },
+    #[error("Iris.React.component must be a direct non-recursive top-level initializer")]
+    InvalidReactComponent { declaration: GlobalId },
     #[error("virtual module declaration {module_name}.{item_name} cannot be used at runtime")]
     VirtualModuleRuntimeReference { module_name: String, item_name: String },
 }

compiler-backend/functional/src/lib.rs

@@ -5,6 +5,7 @@ pub mod error;
 pub mod initializers;
 pub mod optimize;
 pub mod pretty;
+pub mod react;
 pub mod stylex;
 pub mod tree;
 

compiler-backend/functional/src/optimize.rs

@@ -275,6 +275,7 @@ fn is_simple_expression(
             | ExpressionKind::Application { .. }
             | ExpressionKind::UncurriedApplication { .. }
             | ExpressionKind::StyleX(_)
+            | ExpressionKind::React(_)
             | ExpressionKind::IfThenElse { .. }
             | ExpressionKind::Case { .. }
             | ExpressionKind::Guarded { .. }
@@ -337,6 +338,7 @@ pub fn try_for_each_expression_child<Error>(
             }
         }
         ExpressionKind::StyleX(stylex) => stylex.try_for_each_child(&mut visit)?,
+        ExpressionKind::React(react) => react.try_for_each_child(&mut visit)?,
         ExpressionKind::IfThenElse { condition, then, else_ } => {
             visit(*condition)?;
             visit(*then)?;

compiler-backend/functional/src/pretty.rs

@@ -2,6 +2,7 @@
 
 use pretty::{Arena, DocAllocator, DocBuilder};
 
+use crate::react::{ReactElement, ReactExpression};
 use crate::stylex::{StyleXCallTarget, StyleXConditionalCase, StyleXExpression};
 use crate::tree::{
     BinaryOperator, Declaration, DeclarationKind, EffectExpression, ExpressionId, ExpressionKind,
@@ -100,6 +101,7 @@ impl<'a> Printer<'a, '_> {
             | ExpressionKind::Application { .. }
             | ExpressionKind::UncurriedApplication { .. }
             | ExpressionKind::StyleX(_)
+            | ExpressionKind::React(_)
             | ExpressionKind::Effect { .. }
             | ExpressionKind::SynthesizedEvidence { .. } => ExpressionPrecedence::Application,
             ExpressionKind::RecordUpdate { .. } => ExpressionPrecedence::RecordUpdate,
@@ -230,6 +232,7 @@ impl<'a> Printer<'a, '_> {
                 self.arena.text("uncurried.call ").append(function).append(arguments)
             }
             ExpressionKind::StyleX(stylex) => self.stylex_expression(stylex),
+            ExpressionKind::React(react) => self.react_expression(react),
             ExpressionKind::IfThenElse { condition, then, else_ } => {
                 let condition = self.expression(*condition);
                 let then = self.expression(*then);
@@ -335,6 +338,33 @@ impl<'a> Printer<'a, '_> {
         }
     }
 
+    fn react_expression(&self, react: &ReactExpression) -> Doc<'a> {
+        match react {
+            ReactExpression::Component { render } => {
+                self.arena.text("react.component ").append(self.expression(*render))
+            }
+            ReactExpression::Element { component, props, key, .. } => {
+                let target = match component {
+                    ReactElement::Component(value) => self.expression(*value),
+                    ReactElement::Intrinsic(value) => {
+                        self.arena.text("intrinsic ").append(self.expression(*value))
+                    }
+                };
+                let key = key.map(|key| self.arena.text(" key ").append(self.expression(key)));
+                self.arena
+                    .text("react.element ")
+                    .append(target)
+                    .append(key)
+                    .append(" ")
+                    .append(self.expression(*props))
+            }
+            ReactExpression::Fragment { children } => {
+                self.arena.text("react.fragment ").append(self.expression(*children))
+            }
+            ReactExpression::Empty => self.arena.text("react.empty"),
+        }
+    }
+
     fn stylex_conditional_case(&self, case: &StyleXConditionalCase) -> Doc<'a> {
         let selector = self.expression_at(case.selector, ExpressionPrecedence::Atom);
         let marker =