@shopify/react-html/build/esm/serializer.mjs

A component to render your React app with no static HTML

import React from 'react';
import { useServerEffect } from '@shopify/react-effect';
import { HtmlContext } from './context.mjs';
import { useServerDomEffect } from './hooks.mjs';

function useSerialized(id) {
  const manager = React.useContext(HtmlContext);
  const data = React.useMemo(() => manager.getSerialization(id), [id, manager]);
  const Serialize = React.useMemo(() => function Serialize({
    data
  }) {
    useServerDomEffect(manager => {
      const result = data();
      const handleResult = manager.setSerialization.bind(manager, id);
      return typeof result === 'object' && result != null && isPromise(result) ? result.then(handleResult) : handleResult(result);
    });
    return null;
  }, [id]);
  return [data, Serialize];
}
function createSerializer(id) {
  function Serialize({
    data
  }) {
    const manager = React.useContext(HtmlContext);
    useServerEffect(() => {
      const result = data();
      const handleResult = manager.setSerialization.bind(manager, id);
      return typeof result === 'object' && result != null && isPromise(result) ? result.then(handleResult) : handleResult(result);
    }, manager === null || manager === void 0 ? void 0 : manager.effect);
    return null;
  }
  function WithSerialized({
    children
  }) {
    const manager = React.useContext(HtmlContext);
    return children(manager.getSerialization(id));
  }
  return {
    Serialize,
    WithSerialized
  };
}
function isPromise(maybePromise) {
  return maybePromise != null && maybePromise.then != null;
}

export { createSerializer, useSerialized };