react-navi-helmet-async
Version:
Use react-helmet-async to render your Navi routes' title and head.
76 lines • 2.96 kB
JavaScript
var __spreadArrays = (this && this.__spreadArrays) || function () {
for (var s = 0, i = 0, il = arguments.length; i < il; i++) s += arguments[i].length;
for (var r = Array(s), k = 0, i = 0; i < il; i++)
for (var a = arguments[i], j = 0, jl = a.length; j < jl; j++, k++)
r[k] = a[j];
return r;
};
import * as React from 'react';
import { Helmet, HelmetProvider } from 'react-helmet-async';
import { ViewHeadRendererContext } from 'react-navi';
function NaviHelmetProvider(_a) {
var canUseDOM = _a.canUseDOM, context = _a.context, children = _a.children;
var parent = React.useContext(ViewHeadRendererContext);
var defaultContext = React.useRef({}).current;
if (!context) {
context = defaultContext;
}
// react-helmet may thinks it's in a browser due to JSDOM, so we need to
// manually let it know that we're doing static rendering.
if (canUseDOM !== undefined) {
;
HelmetProvider.canUseDOM = canUseDOM;
}
if (!HelmetProvider.canUseDOM) {
context.getHelmet = function () {
return context.helmet;
};
}
if (parent) {
// If someone has already wrapped the app with a HeadProvider, e.g. for
// server side rendering, then just use that.
return React.createElement(React.Fragment, null, children);
}
else {
return (React.createElement(HelmetProvider, { context: context },
React.createElement(ViewHeadRendererContext.Provider, { value: renderViewHead }, children)));
}
}
// Memoize these to stop a bizarre react-helmet infinite loop bug when titles
// are recreated on each render
var titles = {};
function createTitleElement(str) {
var title = titles[str];
if (!title) {
title = titles[str] = React.createElement("title", null, str);
}
return title;
}
export function renderViewHead(chunks) {
var headAndTitleChunks = chunks.filter(function (chunk) { return chunk.type === 'title' || chunk.type === 'head'; });
var helmet = headAndTitleChunks &&
headAndTitleChunks.length && React.createElement.apply(React, __spreadArrays([Helmet,
null], headAndTitleChunks.map(function (chunk) {
return chunk.type === 'title'
? createTitleElement(chunk.title)
: chunk.head.type === React.Fragment || chunk.head.type === 'head'
? chunk.head.props.children
: chunk.head;
})));
return helmet || null;
}
// If building with navi-scripts, we'll need to register this module so that
// it can use it to add <head> tags to the build output.
if (typeof window !== 'undefined') {
var app = window['NaviScripts'];
if (!app) {
app = window['NaviScripts'] = {};
}
if (!app.head) {
app.head = NaviHelmetProvider;
}
}
export { NaviHelmetProvider as HelmetProvider };
export { Helmet };
export default NaviHelmetProvider;
//# sourceMappingURL=index.js.map