"use strict";

Object.defineProperty(exports, "__esModule", {
  value: true
});
exports.renderUiShell = exports.optionalComponentSlotNames = void 0;
var _reactErrorBoundary = require("react-error-boundary");
var _bufferLatest = require("../tools/bufferLatest.cjs");
var _createMessageBus = require("../tools/createMessageBus.cjs");
var _renderReactInWebComponent = require("../web-component/renderReactInWebComponent.cjs");
var _UiShell = require("./UiShell.cjs");
var _useHasUiShell = require("./useHasUiShell.cjs");
var _jsxRuntime = require("react/jsx-runtime");
/*!
 * Copyright (c) 2024-present, Okta, Inc. and/or its affiliates. All rights reserved.
 * The Okta software accompanied by this notice is provided pursuant to the Apache License, Version 2.0 (the "License.")
 *
 * You may obtain a copy of the License at http://www.apache.org/licenses/LICENSE-2.0.
 * Unless required by applicable law or agreed to in writing, software
 * distributed under the License is distributed on an "AS IS" BASIS, WITHOUT
 * WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
 *
 * See the License for the specific language governing permissions and limitations under the License.
 */

const optionalComponentSlotNames = exports.optionalComponentSlotNames = {
  banners: "banners",
  rightSideMenu: "right-side-menu",
  sideNavFooter: "side-nav-footer",
  topNavLeftSide: "top-nav-left-side",
  topNavRightSide: "top-nav-right-side"
};
const renderUiShell = ({
  appBackgroundColor,
  appBackgroundContrastMode,
  appElement: providedAppElement,
  appElementScrollingMode,
  breakpointConfig,
  hasStandardAppContentPadding,
  initialVisibleSections,
  onError = console.error,
  onRender,
  parentElement,
  sideNavBackgroundColor,
  sideNavBackgroundContrastColor,
  topNavBackgroundColor,
  nonce = window.cspNonce
}) => {
  const appElement = providedAppElement || document.createElement("div");
  parentElement.setAttribute(_useHasUiShell.uiShellDataAttribute, "");
  const {
    publish: publishPropChanges,
    subscribe: subscribeToPropChanges
  } = (0, _createMessageBus.createMessageBus)();
  const {
    publish: publishSubscriptionCreated,
    subscribe: subscribeToReactAppSubscribed
  } = (0, _createMessageBus.createMessageBus)();
  const publishAfterReactAppReadyForProps = (0, _bufferLatest.bufferLatest)({
    publish: publishPropChanges,
    subscribe: subscribeToReactAppSubscribed
  });
  const {
    publish: closeRightSideMenu,
    subscribe: subscribeToCloseRightSideMenu
  } = (0, _createMessageBus.createMessageBus)();
  const {
    publish: closeSideNavMenu,
    subscribe: subscribeToCloseSideNavMenu
  } = (0, _createMessageBus.createMessageBus)();
  const slottedElements = Object.fromEntries(Object.entries(optionalComponentSlotNames).map(([optionalComponentKey, slotName]) => {
    const element = document.createElement("div");
    element.setAttribute("slot", slotName);
    return [optionalComponentKey, element];
  }));
  const webComponentChildren = Object.values(slottedElements);
  const uiShellElement = (0, _renderReactInWebComponent.renderReactInWebComponent)({
    getReactComponent: reactRootElements => (0, _jsxRuntime.jsx)(_reactErrorBoundary.ErrorBoundary, {
      fallback: (0, _jsxRuntime.jsx)("div", {
        "data-error": true
      }),
      onError: onError,
      children: (0, _jsxRuntime.jsx)(_UiShell.UiShell, {
        appBackgroundColor: appBackgroundColor,
        appBackgroundContrastMode: appBackgroundContrastMode,
        appElement: appElement,
        appElementScrollingMode: appElementScrollingMode,
        breakpointConfig: breakpointConfig,
        closeSideNavMenu: closeSideNavMenu,
        hasStandardAppContentPadding: hasStandardAppContentPadding,
        initialVisibleSections: initialVisibleSections,
        onError: onError,
        onSubscriptionCreated: publishSubscriptionCreated,
        optionalComponents: Object.fromEntries(Object.entries(optionalComponentSlotNames).map(([optionalComponentKey, slotName]) => [optionalComponentKey, (0, _jsxRuntime.jsx)("slot", {
          name: slotName
        })])),
        sideNavBackgroundColor: sideNavBackgroundColor,
        sideNavBackgroundContrastColor: sideNavBackgroundContrastColor,
        subscribeToCloseRightSideMenu: subscribeToCloseRightSideMenu,
        subscribeToCloseSideNavMenu: subscribeToCloseSideNavMenu,
        subscribeToPropChanges: subscribeToPropChanges,
        topNavBackgroundColor: topNavBackgroundColor,
        uiShellAppElement: reactRootElements.appRootElement,
        uiShellStylesElement: reactRootElements.stylesRootElement
      })
    }),
    webComponentChildren,
    webComponentParentElement: parentElement,
    nonce
  });
  const unsubscribeFromUnifiedUiShellRendered = subscribeToReactAppSubscribed(() => {
    unsubscribeFromUnifiedUiShellRendered();
    onRender?.({
      appElement,
      closeRightSideMenu,
      closeSideNavMenu,
      setComponentProps: publishAfterReactAppReadyForProps,
      slottedElements,
      uiShellElement
    });
  });
  parentElement.appendChild(appElement);
  return {
    appElement,
    closeRightSideMenu,
    closeSideNavMenu,
    setComponentProps: publishAfterReactAppReadyForProps,
    slottedElements,
    uiShellElement
  };
};
exports.renderUiShell = renderUiShell;
//# sourceMappingURL=renderUiShell.cjs.map