"use strict";

var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
exports.__esModule = true;
exports.MultiSelectCheckboxFilterBase = 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 _useWindowFlipPopoverProps = require("../../utils/useWindowFlipPopoverProps");
var _providers = require("../../providers");
var _jsxFileName = "/home/builduser/work/843658b9f44192f0/packages/cairo/dist/cjs/components/MultiSelectCheckboxFilterBase/MultiSelectCheckboxFilterBase.tsx";
function _MultiSelectCheckboxFilterBase(props) {
  const {
    filter,
    dropdownSelect,
    options,
    placeholder,
    popoverProps,
    ...rest
  } = props;
  const {
    select: {
      selectedKeys
    }
  } = dropdownSelect;
  const {
    translate
  } = (0, _providers.useDropdownTranslationContext)();
  const {
    windowFlipPopoverProps,
    inputRef
  } = (0, _useWindowFlipPopoverProps.useWindowFlipPopoverProps)({
    popoverProps
  });
  return /*#__PURE__*/_react.default.createElement(_designSystem.MultiSelectCheckbox, (0, _extends2.default)({
    inputRef: ref => {
      inputRef.current = ref;
    },
    dataHook: `collection-filter-${filter.name}`,
    border: "round",
    textOverflow: "ellipsis",
    options: options,
    placeholder: placeholder ?? translate('placeholder'),
    selectedOptions: selectedKeys,
    popoverProps: windowFlipPopoverProps
  }, rest, {
    __self: this,
    __source: {
      fileName: _jsxFileName,
      lineNumber: 58,
      columnNumber: 5
    }
  }));
}
const MultiSelectCheckboxFilterBase = exports.MultiSelectCheckboxFilterBase = (0, _mobxReactLite.observer)(_MultiSelectCheckboxFilterBase);
//# sourceMappingURL=MultiSelectCheckboxFilterBase.js.map