"use strict";

Object.defineProperty(exports, "__esModule", {
  value: true
});
exports.BreadcrumbList = exports.BreadcrumbContext = exports.Breadcrumb = void 0;
var _Breadcrumbs2 = _interopRequireDefault(require("@mui/material/Breadcrumbs"));
var _Menu2 = _interopRequireDefault(require("@mui/material/Menu"));
var _ButtonBase2 = _interopRequireDefault(require("@mui/material/ButtonBase"));
var _MenuItem2 = _interopRequireDefault(require("@mui/material/MenuItem"));
var _styled = _interopRequireDefault(require("@emotion/styled"));
var _react = require("react");
var _i18n = require("./i18n.generated/i18n.cjs");
var _index = require("./icons.generated/index.cjs");
var _Typography = require("./Typography.cjs");
var _jsxRuntime = require("react/jsx-runtime");
function _interopRequireDefault(e) { return e && e.__esModule ? e : { default: e }; }
/*!
 * Copyright (c) 2023-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 BreadcrumbContext = exports.BreadcrumbContext = (0, _react.createContext)({
  breadcrumbType: "listItem"
});
const BreadcrumbContent = _styled.default.span`
  white-space: nowrap;
  overflow: hidden;
  max-width: 10rem;
  text-overflow: ellipsis;
`;
const Breadcrumb = ({
  children,
  href,
  iconName,
  onClick
}) => {
  const {
    breadcrumbType
  } = (0, _react.useContext)(BreadcrumbContext);
  const onClickHandler = (0, _react.useCallback)(event => {
    if (onClick) {
      event.preventDefault();
      event.stopPropagation();
      onClick(event);
    }
  }, [onClick]);
  const breadcrumbContent = (0, _jsxRuntime.jsxs)(_jsxRuntime.Fragment, {
    children: [iconName === "group" ? (0, _jsxRuntime.jsx)(_index.GroupIcon, {}) : iconName === "user" ? (0, _jsxRuntime.jsx)(_index.UserIcon, {}) : null, (0, _jsxRuntime.jsx)(BreadcrumbContent, {
      children: children
    })]
  });
  if (!href) {
    return (0, _jsxRuntime.jsx)(_Typography.Subordinate, {
      color: "textPrimary",
      children: breadcrumbContent
    });
  }
  if (breadcrumbType === "menuItem") {
    return (0, _jsxRuntime.jsx)(_MenuItem2.default, {
      component: "a",
      href: href,
      onClick: onClickHandler,
      children: breadcrumbContent
    });
  }
  if (breadcrumbType === "currentPage") {
    return (0, _jsxRuntime.jsx)(_Typography.Subordinate, {
      ariaCurrent: "page",
      color: "textPrimary",
      children: breadcrumbContent
    });
  }
  return (0, _jsxRuntime.jsx)(_ButtonBase2.default, {
    href: href,
    onClick: onClickHandler,
    children: breadcrumbContent
  });
};
exports.Breadcrumb = Breadcrumb;
const breadcrumbProviderValue = {
  currentPage: {
    breadcrumbType: "currentPage"
  },
  listItem: {
    breadcrumbType: "listItem"
  },
  menuItem: {
    breadcrumbType: "menuItem"
  }
};
const defaultTruncationValue = 5;
const BreadcrumbList = ({
  children,
  homeHref,
  maxVisibleItems: maxVisibleItemsProp = defaultTruncationValue,
  testId,
  translate
}) => {
  const {
    t
  } = (0, _i18n.useTranslation)();
  const [anchorEl, setAnchorEl] = (0, _react.useState)(null);
  const maxVisibleItems = (0, _react.useMemo)(() => Math.min(Math.max(maxVisibleItemsProp, 0), children.length), [maxVisibleItemsProp, children]);
  const breadcrumbSections = (0, _react.useMemo)(() => {
    if (children.length <= maxVisibleItems) {
      return {
        beforeMenu: [],
        insideMenu: [],
        remainingBreadcrumbs: children
      };
    } else {
      const menuStart = Math.floor(maxVisibleItems / 2);
      const menuLength = children.length - maxVisibleItems;
      return {
        beforeMenu: children.slice(0, menuStart),
        insideMenu: children.slice(menuStart, menuStart + menuLength),
        remainingBreadcrumbs: children.slice(menuStart + menuLength)
      };
    }
  }, [children, maxVisibleItems]);
  const onMenuButtonClick = (0, _react.useCallback)(event => setAnchorEl(event.currentTarget), []);
  const onCloseMenu = (0, _react.useCallback)(() => {
    setAnchorEl(null);
  }, []);
  return (0, _jsxRuntime.jsxs)(_Breadcrumbs2.default, {
    "aria-label": t("breadcrumbs.label.text"),
    "data-se": testId,
    maxItems: children.length + 1,
    translate: translate,
    children: [homeHref && (0, _jsxRuntime.jsx)(_ButtonBase2.default, {
      "aria-label": t("breadcrumbs.home.text"),
      href: homeHref,
      children: (0, _jsxRuntime.jsx)(_index.HomeIcon, {})
    }), breadcrumbSections.beforeMenu.map((breadcrumb, index) => (0, _jsxRuntime.jsx)(BreadcrumbContext.Provider, {
      value: breadcrumbProviderValue.listItem,
      children: breadcrumb
    }, index)), breadcrumbSections.insideMenu.length > 0 && (0, _jsxRuntime.jsxs)(_jsxRuntime.Fragment, {
      children: [(0, _jsxRuntime.jsx)(_ButtonBase2.default, {
        onClick: onMenuButtonClick,
        children: "..."
      }), (0, _jsxRuntime.jsx)(_Menu2.default, {
        anchorEl: anchorEl,
        anchorOrigin: {
          horizontal: "left",
          vertical: "bottom"
        },
        MenuListProps: {
          sx: {
            minWidth: 180
          }
        },
        onClose: onCloseMenu,
        open: Boolean(anchorEl),
        children: (0, _jsxRuntime.jsx)(BreadcrumbContext.Provider, {
          value: breadcrumbProviderValue.menuItem,
          children: breadcrumbSections.insideMenu
        })
      })]
    }), breadcrumbSections.remainingBreadcrumbs.map((breadcrumb, index) => {
      if (index === breadcrumbSections.remainingBreadcrumbs.length - 1) {
        return (0, _jsxRuntime.jsx)(BreadcrumbContext.Provider, {
          value: breadcrumbProviderValue.currentPage,
          children: breadcrumb
        }, index);
      }
      return (0, _jsxRuntime.jsx)(BreadcrumbContext.Provider, {
        value: breadcrumbProviderValue.listItem,
        children: breadcrumb
      }, index);
    })]
  });
};
const MemoizedBreadcrumbList = exports.BreadcrumbList = (0, _react.memo)(BreadcrumbList);
MemoizedBreadcrumbList.displayName = "BreadcrumbList";
//# sourceMappingURL=Breadcrumbs.cjs.map