"use strict";

Object.defineProperty(exports, "__esModule", {
  value: true
});
exports.Workspace = Workspace;
require("reset-css");
function _pluralize() {
  const data = _interopRequireDefault(require("pluralize"));
  _pluralize = function () {
    return data;
  };
  return data;
}
function _react() {
  const data = _interopRequireWildcard(require("react"));
  _react = function () {
    return data;
  };
  return data;
}
function _reactRouterDom() {
  const data = require("react-router-dom");
  _reactRouterDom = function () {
    return data;
  };
  return data;
}
function _uiFoundationUiNotifications() {
  const data = require("@teambit/ui-foundation.ui.notifications.notification-context");
  _uiFoundationUiNotifications = function () {
    return data;
  };
  return data;
}
function _uiFoundationUiReactRouter() {
  const data = require("@teambit/ui-foundation.ui.react-router.slot-router");
  _uiFoundationUiReactRouter = function () {
    return data;
  };
  return data;
}
function _uiFoundationUi() {
  const data = require("@teambit/ui-foundation.ui.corner");
  _uiFoundationUi = function () {
    return data;
  };
  return data;
}
function _uiFoundationUiButtons() {
  const data = require("@teambit/ui-foundation.ui.buttons.collapser");
  _uiFoundationUiButtons = function () {
    return data;
  };
  return data;
}
function _baseUiSurfacesSplitPane() {
  const data = require("@teambit/base-ui.surfaces.split-pane.split-pane");
  _baseUiSurfacesSplitPane = function () {
    return data;
  };
  return data;
}
function _baseReactThemes() {
  const data = require("@teambit/base-react.themes.theme-switcher");
  _baseReactThemes = function () {
    return data;
  };
  return data;
}
function _baseUiSurfacesSplitPane2() {
  const data = require("@teambit/base-ui.surfaces.split-pane.hover-splitter");
  _baseUiSurfacesSplitPane2 = function () {
    return data;
  };
  return data;
}
function _uiFoundationUi2() {
  const data = require("@teambit/ui-foundation.ui.top-bar");
  _uiFoundationUi2 = function () {
    return data;
  };
  return data;
}
function _classnames() {
  const data = _interopRequireDefault(require("classnames"));
  _classnames = function () {
    return data;
  };
  return data;
}
function _useWorkspace() {
  const data = require("./use-workspace");
  _useWorkspace = function () {
    return data;
  };
  return data;
}
function _workspaceOverview() {
  const data = require("./workspace-overview");
  _workspaceOverview = function () {
    return data;
  };
  return data;
}
function _workspaceProvider() {
  const data = require("./workspace-provider");
  _workspaceProvider = function () {
    return data;
  };
  return data;
}
function _workspaceModule() {
  const data = _interopRequireDefault(require("./workspace.module.scss"));
  _workspaceModule = function () {
    return data;
  };
  return data;
}
function _getRequireWildcardCache(e) { if ("function" != typeof WeakMap) return null; var r = new WeakMap(), t = new WeakMap(); return (_getRequireWildcardCache = function (e) { return e ? t : r; })(e); }
function _interopRequireWildcard(e, r) { if (!r && e && e.__esModule) return e; if (null === e || "object" != typeof e && "function" != typeof e) return { default: e }; var t = _getRequireWildcardCache(r); if (t && t.has(e)) return t.get(e); var n = { __proto__: null }, a = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var u in e) if ("default" !== u && {}.hasOwnProperty.call(e, u)) { var i = a ? Object.getOwnPropertyDescriptor(e, u) : null; i && (i.get || i.set) ? Object.defineProperty(n, u, i) : n[u] = e[u]; } return n.default = e, t && t.set(e, n), n; }
function _interopRequireDefault(e) { return e && e.__esModule ? e : { default: e }; }
/**
 * main workspace component.
 */
function Workspace({
  routeSlot,
  menuSlot,
  sidebar,
  workspaceUI,
  onSidebarTogglerChange
}) {
  const reactions = useComponentNotifications();
  const {
    workspace
  } = (0, _useWorkspace().useWorkspace)(reactions);
  const theme = (0, _baseReactThemes().useThemePicker)();
  const currentTheme = theme?.current;
  const [isSidebarOpen, handleSidebarToggle] = (0, _react().useReducer)(x => !x, true);
  const sidebarOpenness = isSidebarOpen ? _baseUiSurfacesSplitPane().Layout.row : _baseUiSurfacesSplitPane().Layout.right;
  const themeName = currentTheme?.themeName || 'light';
  onSidebarTogglerChange(handleSidebarToggle);
  if (!workspace) {
    return /*#__PURE__*/_react().default.createElement("div", {
      className: _workspaceModule().default.emptyContainer
    });
  }
  workspaceUI.setComponents(workspace.components);
  return /*#__PURE__*/_react().default.createElement(_workspaceProvider().WorkspaceProvider, {
    workspace: workspace
  }, /*#__PURE__*/_react().default.createElement("div", {
    className: _workspaceModule().default.workspaceWrapper
  }, /*#__PURE__*/_react().default.createElement(_uiFoundationUi2().TopBar, {
    className: (0, _classnames().default)(_workspaceModule().default.topbar, _workspaceModule().default[themeName]),
    Corner: () => /*#__PURE__*/_react().default.createElement(_uiFoundationUi().Corner, {
      className: (0, _classnames().default)(_workspaceModule().default.corner, _workspaceModule().default[themeName]),
      name: workspace.name,
      icon: workspace.icon
    }),
    menu: menuSlot
  }), /*#__PURE__*/_react().default.createElement(_baseUiSurfacesSplitPane().SplitPane, {
    className: _workspaceModule().default.main,
    size: 246,
    layout: sidebarOpenness
  }, /*#__PURE__*/_react().default.createElement(_baseUiSurfacesSplitPane().Pane, {
    className: (0, _classnames().default)(_workspaceModule().default.sidebar, _workspaceModule().default[themeName], !isSidebarOpen && _workspaceModule().default.closed)
  }, sidebar), /*#__PURE__*/_react().default.createElement(_baseUiSurfacesSplitPane2().HoverSplitter, {
    className: _workspaceModule().default.splitter
  }, /*#__PURE__*/_react().default.createElement(_uiFoundationUiButtons().Collapser, {
    isOpen: isSidebarOpen,
    onMouseDown: e => e.stopPropagation() // avoid split-pane drag
    ,
    onClick: handleSidebarToggle,
    tooltipContent: `${isSidebarOpen ? 'Hide' : 'Show'} side panel`
  })), /*#__PURE__*/_react().default.createElement(_baseUiSurfacesSplitPane().Pane, null, /*#__PURE__*/_react().default.createElement(_uiFoundationUiReactRouter().SlotRouter, {
    slot: routeSlot
  }, /*#__PURE__*/_react().default.createElement(_reactRouterDom().Route, {
    index: true,
    element: /*#__PURE__*/_react().default.createElement(_workspaceOverview().WorkspaceOverview, null)
  }))))));
}
function useComponentNotifications() {
  const notifications = (0, _uiFoundationUiNotifications().useNotifications)();

  // memo not really needed, but for peace of mind
  return (0, _react().useMemo)(() => ({
    onComponentAdded: comps => {
      const notificationId = notifications.log(`added ${(0, _pluralize().default)('component', comps.length)}: ${comps.map(comp => comp.id.toString()).join(', ')}`);
      setTimeout(() => notifications.dismiss(notificationId), 12 * 1000);
    },
    onComponentRemoved: ids => {
      const notificationId = notifications.log(`removed ${(0, _pluralize().default)('component', ids.length)} ${ids.map(id => id.toString()).join(', ')}`);
      setTimeout(() => notifications.dismiss(notificationId), 12 * 1000);
    }
  }), [notifications]);
}

//# sourceMappingURL=workspace.js.map