@bloomreach/react-sdk
Version:
Bloomreach SPA SDK for React
316 lines (309 loc) • 15.1 kB
JavaScript
(function(global, factory) {
typeof exports === "object" && typeof module !== "undefined" ? factory(exports, require("react"), require("@bloomreach/spa-sdk")) : typeof define === "function" && define.amd ? define([ "exports", "react", "@bloomreach/spa-sdk" ], factory) : (global = typeof globalThis !== "undefined" ? globalThis : global || self,
factory(global.BloomreachReactSdk = {}, global.React, global.BloomreachSpaSdk));
})(this, (function(exports, React, spaSdk) {
"use strict";
function _interopDefaultLegacy(e) {
return e && typeof e === "object" && "default" in e ? e : {
default: e
};
}
var React__default = _interopDefaultLegacy(React);
function BrMeta({children, meta}) {
var _a;
const head = React.useRef(null);
const tail = React.useRef(null);
React.useEffect((() => {
var _a;
if (!((_a = head.current) === null || _a === void 0 ? void 0 : _a.nextSibling) || !tail.current) {
return undefined;
}
return meta === null || meta === void 0 ? void 0 : meta.render(head.current.nextSibling, tail.current);
}), [ meta, (_a = head.current) === null || _a === void 0 ? void 0 : _a.nextSibling, tail.current ]);
return React__default["default"].createElement(React__default["default"].Fragment, null, meta && meta.length > 0 && React__default["default"].createElement("span", {
style: {
display: "none"
},
ref: head
}), children, meta && meta.length > 0 && React__default["default"].createElement("span", {
style: {
display: "none"
},
ref: tail
}));
}
function BrContainerBox({page, children}) {
return React__default["default"].createElement("div", {
className: (page === null || page === void 0 ? void 0 : page.isPreview()) ? "hst-container" : undefined
}, React__default["default"].Children.map(children, (child => React__default["default"].createElement("div", {
className: (page === null || page === void 0 ? void 0 : page.isPreview()) ? "hst-container-item" : undefined
}, child))));
}
function BrContainerInline(props) {
const {page, children} = props;
return React__default["default"].createElement("div", {
className: (page === null || page === void 0 ? void 0 : page.isPreview()) ? "hst-container" : undefined
}, React__default["default"].Children.map(children, (child => React__default["default"].createElement("span", {
className: (page === null || page === void 0 ? void 0 : page.isPreview()) ? "hst-container-item" : undefined
}, child))));
}
function BrContainerNoMarkup({children}) {
return React__default["default"].createElement(React__default["default"].Fragment, null, children);
}
function BrContainerOrderedList({page, children}) {
return React__default["default"].createElement("ol", {
className: (page === null || page === void 0 ? void 0 : page.isPreview()) ? "hst-container" : undefined
}, React__default["default"].Children.map(children, (child => React__default["default"].createElement("li", {
className: (page === null || page === void 0 ? void 0 : page.isPreview()) ? "hst-container-item" : undefined
}, child))));
}
function BrContainerUnorderedList({page, children}) {
return React__default["default"].createElement("ul", {
className: (page === null || page === void 0 ? void 0 : page.isPreview()) ? "hst-container" : undefined
}, React__default["default"].Children.map(children, (child => React__default["default"].createElement("li", {
className: (page === null || page === void 0 ? void 0 : page.isPreview()) ? "hst-container-item" : undefined
}, child))));
}
function BrContainerItemUndefined({component}) {
return React__default["default"].createElement("div", null, `Component "${component === null || component === void 0 ? void 0 : component.getType()}" is not defined.`);
}
/******************************************************************************
Copyright (c) Microsoft Corporation.
Permission to use, copy, modify, and/or distribute this software for any
purpose with or without fee is hereby granted.
THE SOFTWARE IS PROVIDED "AS IS" AND THE AUTHOR DISCLAIMS ALL WARRANTIES WITH
REGARD TO THIS SOFTWARE INCLUDING ALL IMPLIED WARRANTIES OF MERCHANTABILITY
AND FITNESS. IN NO EVENT SHALL THE AUTHOR BE LIABLE FOR ANY SPECIAL, DIRECT,
INDIRECT, OR CONSEQUENTIAL DAMAGES OR ANY DAMAGES WHATSOEVER RESULTING FROM
LOSS OF USE, DATA OR PROFITS, WHETHER IN AN ACTION OF CONTRACT, NEGLIGENCE OR
OTHER TORTIOUS ACTION, ARISING OUT OF OR IN CONNECTION WITH THE USE OR
PERFORMANCE OF THIS SOFTWARE.
***************************************************************************** */ function __rest(s, e) {
var t = {};
for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0) t[p] = s[p];
if (s != null && typeof Object.getOwnPropertySymbols === "function") for (var i = 0, p = Object.getOwnPropertySymbols(s); i < p.length; i++) {
if (e.indexOf(p[i]) < 0 && Object.prototype.propertyIsEnumerable.call(s, p[i])) t[p[i]] = s[p[i]];
}
return t;
}
function __awaiter(thisArg, _arguments, P, generator) {
function adopt(value) {
return value instanceof P ? value : new P((function(resolve) {
resolve(value);
}));
}
return new (P || (P = Promise))((function(resolve, reject) {
function fulfilled(value) {
try {
step(generator.next(value));
} catch (e) {
reject(e);
}
}
function rejected(value) {
try {
step(generator["throw"](value));
} catch (e) {
reject(e);
}
}
function step(result) {
result.done ? resolve(result.value) : adopt(result.value).then(fulfilled, rejected);
}
step((generator = generator.apply(thisArg, _arguments || [])).next());
}));
}
typeof SuppressedError === "function" ? SuppressedError : function(error, suppressed, message) {
var e = new Error(message);
return e.name = "SuppressedError", e.error = error, e.suppressed = suppressed, e;
};
/**
* The button component that opens for editing a content.
*/ function BrManageContentButton(props) {
const {page} = props, buttonProps = __rest(props, [ "page" ]);
return page.isPreview() ? React__default["default"].createElement(BrMeta, {
meta: page.getButton(spaSdk.TYPE_MANAGE_CONTENT_BUTTON, buttonProps)
}) : React__default["default"].createElement(React__default["default"].Fragment, null);
}
/**
* The button component that opens a menu editor.
*/ function BrManageMenuButton({page, menu}) {
return page.isPreview() ? React__default["default"].createElement(BrMeta, {
meta: page.getButton(spaSdk.TYPE_MANAGE_MENU_BUTTON, menu)
}) : React__default["default"].createElement(React__default["default"].Fragment, null);
}
/**
* Node container component for rendering brXM container components with prop-based mapping.
*/ function BrNodeContainer(props) {
const {component, mapping, children} = props;
const getMapping = () => {
const type = component.getType();
if (type && type in mapping) {
return mapping[type];
}
switch (type) {
case spaSdk.TYPE_CONTAINER_INLINE:
return BrContainerInline;
case spaSdk.TYPE_CONTAINER_NO_MARKUP:
return BrContainerNoMarkup;
case spaSdk.TYPE_CONTAINER_ORDERED_LIST:
return BrContainerOrderedList;
case spaSdk.TYPE_CONTAINER_UNORDERED_LIST:
return BrContainerUnorderedList;
default:
return BrContainerBox;
}
};
const containerMapping = getMapping();
const meta = component.getMeta();
const content = containerMapping ? React__default["default"].createElement(containerMapping, props) : children;
return React__default["default"].createElement(BrMeta, {
meta
}, content);
}
/**
* Node container item component for rendering brXM container items with prop-based mapping.
*/ function BrNodeContainerItem(props) {
const {component, page, mapping, children} = props;
const [forcedRerenders, setForcedRerenders] = React.useState(0);
const onUpdate = React.useCallback((() => {
setForcedRerenders((c => c + 1));
}), []);
React.useEffect((() => {
component === null || component === void 0 ? void 0 : component.on("update", onUpdate);
return () => {
component === null || component === void 0 ? void 0 : component.off("update", onUpdate);
};
}), [ component, onUpdate ]);
React.useEffect((() => {
if (forcedRerenders > 0) {
page === null || page === void 0 ? void 0 : page.sync();
}
}), [ page, forcedRerenders ]);
const getMapping = () => {
var _a;
const type = component === null || component === void 0 ? void 0 : component.getType();
if (type && type in mapping) {
return mapping[type];
}
return (_a = mapping[spaSdk.TYPE_CONTAINER_ITEM_UNDEFINED]) !== null && _a !== void 0 ? _a : BrContainerItemUndefined;
};
const containerItemMapping = getMapping();
const meta = component === null || component === void 0 ? void 0 : component.getMeta();
const content = containerItemMapping ? React__default["default"].createElement(containerItemMapping, props) : children;
return React__default["default"].createElement(BrMeta, {
meta
}, content);
}
/**
* Node component for rendering brXM components with prop-based mapping resolution.
*/ function BrNodeComponent(props) {
const {component, mapping, children} = props;
const componentName = component === null || component === void 0 ? void 0 : component.getName();
const resolvedMapping = component && componentName && mapping[componentName];
const meta = component === null || component === void 0 ? void 0 : component.getMeta();
const content = resolvedMapping ? React__default["default"].createElement(resolvedMapping, props) : children;
return React__default["default"].createElement(BrMeta, {
meta
}, content);
}
/**
* Core node component for rendering brXM components with prop drilling.
*/ function BrNode({children, component, page, mapping}) {
if (React__default["default"].Children.count(children)) {
return React__default["default"].createElement(BrMeta, {
meta: component.getMeta()
}, children);
}
const props = {
page,
mapping
};
const childrenList = component.getChildren().map((child => React__default["default"].createElement(BrNode, Object.assign({
key: child.getId(),
component: child
}, props))));
if (spaSdk.isContainer(component)) {
return React__default["default"].createElement(BrNodeContainer, Object.assign({
component
}, props), childrenList);
}
if (spaSdk.isContainerItem(component)) {
return React__default["default"].createElement(BrNodeContainerItem, Object.assign({
component
}, props), childrenList);
}
return React__default["default"].createElement(BrNodeComponent, Object.assign({
component
}, props), childrenList);
}
/**
* The brXM component with prop-based data access.
*/ function BrComponent({path, children, component, page, mapping}) {
function getComponents() {
if (!path) {
return component.getChildren();
}
const targetComponent = component.getComponent(...path.split("/"));
return targetComponent ? [ targetComponent ] : [];
}
function renderComponents() {
return getComponents().map((comp => React__default["default"].createElement(BrNode, {
key: comp.getId(),
component: comp,
page,
mapping
}, typeof children === "function" ? children({
page,
component: comp,
mapping
}) : children)));
}
return React__default["default"].createElement(React__default["default"].Fragment, null, renderComponents());
}
/**
* The brXM page component with React Server Components (RSC) support.
*/ function BrPage({configuration, mapping, page: initialPage, children}) {
const [page, setPage] = React.useState((() => initialPage ? spaSdk.initialize(configuration, initialPage) : undefined));
React.useEffect((() => {
let isMounted = true;
const initializePage = () => __awaiter(this, void 0, void 0, (function*() {
const newPage = initialPage ? spaSdk.initialize(configuration, initialPage) : yield spaSdk.initialize(configuration);
if (isMounted) {
setPage(newPage);
}
}));
initializePage();
return () => {
isMounted = false;
};
}), [ configuration, initialPage ]);
React.useEffect((() => {
page === null || page === void 0 ? void 0 : page.sync();
}), [ page ]);
if (!page) {
if (configuration.NBRMode) {
return React__default["default"].createElement(React__default["default"].Fragment, null, children);
}
return null;
}
const component = page.getComponent();
return React__default["default"].createElement(BrNode, {
page,
mapping,
component
}, typeof children === "function" ? children({
page,
component,
mapping
}) : children);
}
exports.BrComponent = BrComponent;
exports.BrManageContentButton = BrManageContentButton;
exports.BrManageMenuButton = BrManageMenuButton;
exports.BrPage = BrPage;
Object.defineProperty(exports, "__esModule", {
value: true
});
}));
//# sourceMappingURL=index.umd.js.map