"use strict";

var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
exports.__esModule = true;
exports.CollectionToolbars = void 0;
var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends"));
var _designSystem = require("@wix/design-system");
var _react = _interopRequireDefault(require("react"));
var _mobxReactLite = require("mobx-react-lite");
var _CollectionToolbar = require("../CollectionToolbar");
var _CollectionToolbarsProvider = require("./CollectionToolbarsProvider");
var _ToolbarAndTitlebarContainer = require("./ToolbarAndTitlebarContainer");
var _useIsMobile = require("../../hooks/useIsMobile");
var _CollectionToolbarsVisualization = require("./CollectionToolbarsVisualization");
var _useIsCollectionToolbarExists = require("../CollectionToolbar/useIsCollectionToolbarExists");
var _jsxFileName = "/home/builduser/work/843658b9f44192f0/packages/cairo/dist/cjs/components/CollectionToolbars/CollectionToolbars.tsx";
function BorderRadiusTopCard({
  children
}) {
  const isMobile = (0, _useIsMobile.useIsMobile)();
  return /*#__PURE__*/_react.default.createElement(_designSystem.Box, {
    direction: "vertical",
    backgroundColor: "D80",
    borderTopLeftRadius: isMobile ? 0 : 8,
    borderTopRightRadius: isMobile ? 0 : 8,
    __self: this,
    __source: {
      fileName: _jsxFileName,
      lineNumber: 51,
      columnNumber: 5
    }
  }, children);
}
function BorderRadiusTopBottomCard({
  children
}) {
  const isMobile = (0, _useIsMobile.useIsMobile)();
  return /*#__PURE__*/_react.default.createElement(_designSystem.Box, {
    direction: "vertical",
    backgroundColor: "D80",
    borderRadius: isMobile ? 0 : 8,
    __self: this,
    __source: {
      fileName: _jsxFileName,
      lineNumber: 65,
      columnNumber: 5
    }
  }, children);
}
function _CollectionToolbars(props) {
  var _featuredComponents$a;
  const {
    sticky,
    state,
    selectionToolbar,
    extraToolbar,
    summaryBar,
    topNotification: topNotificationProp,
    titleBar,
    visualization: customSlot
  } = props;
  const {
    collection,
    featuredComponents,
    hasSubToolbarComponents,
    shouldDisplayFiltersTags,
    bulk: {
      selectedIds
    },
    internalScroll,
    container: {
      isPanelLayout
    }
  } = state;
  const isMobile = (0, _useIsMobile.useIsMobile)();
  const topNotification = isPanelLayout ? undefined : typeof topNotificationProp === 'function' ? topNotificationProp() : topNotificationProp;
  const AppliedFiltersTagList = (_featuredComponents$a = featuredComponents.appliedFiltersTagList.value) == null ? void 0 : _featuredComponents$a.component;
  const {
    showRefreshLoader
  } = collection;
  const shouldDisplaySubToolbar = shouldDisplayFiltersTags && hasSubToolbarComponents;
  const shouldRenderCollectionToolbar = (0, _useIsCollectionToolbarExists.useIsCollectionToolbarExists)(props);
  const toolbars = /*#__PURE__*/_react.default.createElement(_react.default.Fragment, null, selectionToolbar && !showRefreshLoader && selectedIds.length > 0 ? selectionToolbar : /*#__PURE__*/_react.default.createElement(_react.default.Fragment, null, extraToolbar, (!isMobile || shouldRenderCollectionToolbar) && /*#__PURE__*/_react.default.createElement(_CollectionToolbar.CollectionToolbar, (0, _extends2.default)({}, props, {
    dataHook: "collection-toolbar",
    __self: this,
    __source: {
      fileName: _jsxFileName,
      lineNumber: 125,
      columnNumber: 13
    }
  }))), shouldDisplaySubToolbar && /*#__PURE__*/_react.default.createElement(_designSystem.Box, {
    direction: "vertical",
    backgroundColor: "D80",
    __self: this,
    __source: {
      fileName: _jsxFileName,
      lineNumber: 130,
      columnNumber: 9
    }
  }, /*#__PURE__*/_react.default.createElement(_designSystem.Table.SubToolbar, {
    dataHook: "collection-table-sub-toolbar",
    __self: this,
    __source: {
      fileName: _jsxFileName,
      lineNumber: 131,
      columnNumber: 11
    }
  }, AppliedFiltersTagList && shouldDisplayFiltersTags && /*#__PURE__*/_react.default.createElement(AppliedFiltersTagList, {
    __self: this,
    __source: {
      fileName: _jsxFileName,
      lineNumber: 133,
      columnNumber: 15
    }
  }))), summaryBar, topNotification);

  /* wrapping with Card is WSR way to make the sticky table header not to add extra border between the header and the content https://www.docs.wixdesignsystem.com/?path=/story/components-lists-table--table#Sticky_Toolbar_&_Sub-toolbar*/

  const child = /*#__PURE__*/_react.default.createElement(_ToolbarAndTitlebarContainer.ToolbarAndTitlebarContainer, {
    state: state.toolbar,
    __self: this,
    __source: {
      fileName: _jsxFileName,
      lineNumber: 146,
      columnNumber: 5
    }
  }, customSlot ? /*#__PURE__*/_react.default.createElement(_react.default.Fragment, null, /*#__PURE__*/_react.default.createElement(BorderRadiusTopBottomCard, {
    __self: this,
    __source: {
      fileName: _jsxFileName,
      lineNumber: 149,
      columnNumber: 11
    }
  }, toolbars), /*#__PURE__*/_react.default.createElement(_CollectionToolbarsVisualization.CollectionToolbarsVisualization, {
    state: state,
    visualization: customSlot,
    __self: this,
    __source: {
      fileName: _jsxFileName,
      lineNumber: 150,
      columnNumber: 11
    }
  }), /*#__PURE__*/_react.default.createElement(BorderRadiusTopCard, {
    __self: this,
    __source: {
      fileName: _jsxFileName,
      lineNumber: 154,
      columnNumber: 11
    }
  }, titleBar)) : /*#__PURE__*/_react.default.createElement(BorderRadiusTopCard, {
    __self: this,
    __source: {
      fileName: _jsxFileName,
      lineNumber: 157,
      columnNumber: 9
    }
  }, toolbars, titleBar));
  return /*#__PURE__*/_react.default.createElement(_CollectionToolbarsProvider.CollectionToolbarsProvider, {
    __self: this,
    __source: {
      fileName: _jsxFileName,
      lineNumber: 166,
      columnNumber: 5
    }
  }, sticky && !internalScroll ? /*#__PURE__*/_react.default.createElement(_designSystem.Page.Sticky, {
    style: isMobile ? {
      top: 78
    } : undefined,
    __self: this,
    __source: {
      fileName: _jsxFileName,
      lineNumber: 168,
      columnNumber: 9
    }
  }, child) : child);
}
const CollectionToolbars = exports.CollectionToolbars = (0, _mobxReactLite.observer)(_CollectionToolbars);
//# sourceMappingURL=CollectionToolbars.js.map