"use strict";

var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
exports.__esModule = true;
exports.CollectionTableWSRTable = void 0;
var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends"));
var _designSystem = require("@wix/design-system");
var _react = _interopRequireWildcard(require("react"));
var _mobxReactLite = require("mobx-react-lite");
var _bi = require("@wix/bex-core/bi");
var _CollectionContext = require("../CollectionContext");
var _commonStCss = require("../common.st.css.js");
var _CollectionToolbars = require("../CollectionToolbars/CollectionToolbars");
var _BorderOnlyBox = require("../BorderOnlyBox");
var _react2 = require("@wix/bex-core/react");
var _useIsMobile = require("../../hooks/useIsMobile");
var _buildMobileColumns = require("./buildMobileColumns");
var _jsxFileName = "/home/builduser/work/843658b9f44192f0/packages/cairo/dist/cjs/components/CollectionTable/CollectionTableWSRTable.tsx";
function _interopRequireWildcard(e, t) { if ("function" == typeof WeakMap) var r = new WeakMap(), n = new WeakMap(); return (_interopRequireWildcard = function (e, t) { if (!t && e && e.__esModule) return e; var o, i, f = { __proto__: null, default: e }; if (null === e || "object" != typeof e && "function" != typeof e) return f; if (o = t ? n : r) { if (o.has(e)) return o.get(e); o.set(e, f); } for (const t in e) "default" !== t && {}.hasOwnProperty.call(e, t) && ((i = (o = Object.defineProperty) && Object.getOwnPropertyDescriptor(e, t)) && (i.get || i.set) ? o(f, t, i) : f[t] = e[t]); return f; })(e, t); }
function _CollectionTableWSRTable(props) {
  const {
    state,
    filters,
    title,
    tabs,
    customColumns: customColumnsProp,
    multiLevelSorting: multiLevelSortingProp,
    views,
    extraToolbar,
    summaryBar,
    topNotification,
    selectionToolbar,
    dragAndDropReorderModeToolbar,
    showSelection: showSelectionProp,
    exportButton,
    tags,
    sticky,
    onRowClick,
    search,
    children,
    tableGridSwitchButton,
    useShowLoaderWhenEmpty,
    dragAndDrop,
    showTitleBar,
    horizontalScroll,
    stickyColumns,
    stickySelectionColumn,
    hideBulkSelectionCheckbox,
    columns,
    primaryActionButton,
    secondaryActions,
    onSelectionChanged,
    moreActions,
    visualization
  } = props;
  const isMobile = (0, _useIsMobile.useIsMobile)();
  const {
    toolbar,
    showEmptyState,
    tableState: table,
    keyedItems: stateKeyedItems
  } = state;
  const {
    internalExperiments,
    isPanelLayout
  } = (0, _react2.useWixPatternsContainer)();
  const isGreyHeadersEnabled = internalExperiments == null ? void 0 : internalExperiments.enabled('specs.cairo.tableGreyHeaders');
  const {
    bulk,
    initTask
  } = toolbar;
  const keyedItems = props.keyedItems ?? stateKeyedItems;
  const {
    collection
  } = table;
  const {
    showRefreshLoader,
    showErrorState
  } = collection;
  const {
    stackingRootRef
  } = (0, _react2.usePageContext)();
  const handleRowCLick = (0, _react.useCallback)((item, index) => {
    state.toolbar.reportBi((0, _bi.cairoCtaClicked)({
      ctaName: 'row_area',
      ctaIndex: index,
      itemId: item.id,
      itemIndex: item.index,
      url: typeof window !== 'undefined' ? window.location.href : ''
    }));
    onRowClick == null || onRowClick(item, index);
  }, [onRowClick]);
  const Table = _designSystem.Table;
  const showSelection = showSelectionProp ?? selectionToolbar != null;
  const hideTitleBar = isMobile || showEmptyState || toolbar.showInitialLoader || initTask.status.isError;
  const showBorderBox = !isPanelLayout && (!table.showLoadingState || !showTitleBar) && (hideTitleBar || !showTitleBar);
  const actionCellColumn = columns.find(column => column.key === 'cairo-action-cell');
  const columnsWithoutActionCell = columns.filter(column => column.key !== 'cairo-action-cell');
  const tableColumns = isMobile ? [...(0, _buildMobileColumns.buildMobileColumns)(columnsWithoutActionCell), ...(actionCellColumn ? [actionCellColumn] : [])] : columns;
  const keyedItemsWithTooltip = keyedItems.map(item => {
    const isDisabled = bulk.isRowCheckboxDisabled(item);
    if (isDisabled) {
      const tooltipContent = bulk.getCheckboxTooltipContent(item);
      if (tooltipContent) {
        return {
          ...item,
          checkboxTooltipContent: tooltipContent
        };
      }
    }
    return item;
  });
  return /*#__PURE__*/_react.default.createElement("div", {
    "data-hook": "collection-table",
    className: (0, _commonStCss.st)(_commonStCss.classes.fullHeight, _commonStCss.classes.column),
    __self: this,
    __source: {
      fileName: _jsxFileName,
      lineNumber: 215,
      columnNumber: 5
    }
  }, /*#__PURE__*/_react.default.createElement(Table, (0, _extends2.default)({}, props, {
    skin: isGreyHeadersEnabled ? 'neutral' : props.skin,
    withWrapper: false,
    data: keyedItemsWithTooltip,
    viewportRef: stackingRootRef,
    columns: tableColumns,
    onRowClick: onRowClick ? handleRowCLick : undefined
    // this forces WSR <Table/> to render the loader even when `data.length=0`
    ,
    showHeaderWhenEmpty: useShowLoaderWhenEmpty && !showRefreshLoader && !showErrorState && !showEmptyState,
    hideBulkSelectionCheckbox: selectionToolbar ? false : hideBulkSelectionCheckbox,
    bulkSelectionCheckboxRef: bulk.bulkSelectionCheckboxRef,
    dragAndDrop: dragAndDrop,
    rowDataHook: rowData => `table-row-${rowData.key}`,
    controlled: true,
    horizontalScroll: horizontalScroll,
    stickyColumns: table.getStickyColumnsCount({
      horizontalScroll,
      stickyColumns,
      showSelection,
      stickySelectionColumn
    }),
    showSelection: showSelection,
    selectedIds: bulk.selectedIds,
    onSelectionStarted: state.toolbar.onSelectionStarted,
    onSelectionChanged: onSelectionChanged ?? ((_selectedIds, _change) => {
      state.toolbar.onSelectionChanged(_selectedIds, _change);
    }),
    __self: this,
    __source: {
      fileName: _jsxFileName,
      lineNumber: 219,
      columnNumber: 7
    }
  }), /*#__PURE__*/_react.default.createElement(_CollectionToolbars.CollectionToolbars, {
    sticky: sticky,
    state: toolbar,
    search: search,
    customColumns: customColumnsProp,
    multiLevelSorting: multiLevelSortingProp,
    views: views,
    title: title,
    tabs: tabs,
    filters: filters,
    selectionToolbar: selectionToolbar,
    dragAndDropReorderModeToolbar: dragAndDropReorderModeToolbar,
    extraToolbar: extraToolbar,
    summaryBar: summaryBar,
    topNotification: typeof topNotification === 'function' ? () => topNotification({
      query: collection.result.originQuery
    }) : topNotification,
    titleBar: /*#__PURE__*/_react.default.createElement(_react.default.Fragment, null, showBorderBox && /*#__PURE__*/_react.default.createElement(_BorderOnlyBox.BorderOnlyBox, {
      __self: this,
      __source: {
        fileName: _jsxFileName,
        lineNumber: 279,
        columnNumber: 33
      }
    }), !hideTitleBar && /*#__PURE__*/_react.default.createElement("div", {
      "data-hook": "titlebar-a11y-wrapper",
      style: {
        display: showTitleBar ? undefined : 'none'
      },
      __self: this,
      __source: {
        fileName: _jsxFileName,
        lineNumber: 281,
        columnNumber: 17
      }
    }, /*#__PURE__*/_react.default.createElement(_designSystem.Table.Titlebar, {
      __self: this,
      __source: {
        fileName: _jsxFileName,
        lineNumber: 285,
        columnNumber: 19
      }
    }))),
    tableGridSwitchButton: tableGridSwitchButton,
    exportButton: exportButton,
    tags: tags,
    primaryActionButton: primaryActionButton,
    secondaryActions: secondaryActions,
    moreActions: moreActions,
    visualization: visualization,
    __self: this,
    __source: {
      fileName: _jsxFileName,
      lineNumber: 258,
      columnNumber: 9
    }
  }), /*#__PURE__*/_react.default.createElement(_CollectionContext.CollectionProvider, {
    value: collection,
    __self: this,
    __source: {
      fileName: _jsxFileName,
      lineNumber: 298,
      columnNumber: 9
    }
  }, /*#__PURE__*/_react.default.createElement(_designSystem.Box, {
    width: "100%",
    direction: "vertical",
    minHeight: 0,
    flex: 1,
    verticalAlign: "middle",
    __self: this,
    __source: {
      fileName: _jsxFileName,
      lineNumber: 299,
      columnNumber: 11
    }
  }, children))));
}
const CollectionTableWSRTable = exports.CollectionTableWSRTable = (0, _mobxReactLite.observer)(_CollectionTableWSRTable);
//# sourceMappingURL=CollectionTableWSRTable.js.map