@wordpress/edit-post/build/components/manage-blocks-modal/category.js

Edit Post module for WordPress.

"use strict";

var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");

Object.defineProperty(exports, "__esModule", {
  value: true
});
exports.default = void 0;

var _element = require("@wordpress/element");

var _lodash = require("lodash");

var _data = require("@wordpress/data");

var _compose = require("@wordpress/compose");

var _components = require("@wordpress/components");

var _checklist = _interopRequireDefault(require("./checklist"));

var _editPostSettings = _interopRequireDefault(require("../edit-post-settings"));

var _store = require("../../store");

/**
 * External dependencies
 */

/**
 * WordPress dependencies
 */

/**
 * Internal dependencies
 */
function BlockManagerCategory({
  instanceId,
  title,
  blockTypes,
  hiddenBlockTypes,
  toggleVisible,
  toggleAllVisible
}) {
  const settings = (0, _element.useContext)(_editPostSettings.default);
  const {
    allowedBlockTypes
  } = settings;
  const filteredBlockTypes = (0, _element.useMemo)(() => {
    if (allowedBlockTypes === true) {
      return blockTypes;
    }

    return blockTypes.filter(({
      name
    }) => {
      return (0, _lodash.includes)(allowedBlockTypes || [], name);
    });
  }, [allowedBlockTypes, blockTypes]);

  if (!filteredBlockTypes.length) {
    return null;
  }

  const checkedBlockNames = (0, _lodash.without)((0, _lodash.map)(filteredBlockTypes, 'name'), ...hiddenBlockTypes);
  const titleId = 'edit-post-manage-blocks-modal__category-title-' + instanceId;
  const isAllChecked = checkedBlockNames.length === filteredBlockTypes.length;
  let ariaChecked;

  if (isAllChecked) {
    ariaChecked = 'true';
  } else if (checkedBlockNames.length > 0) {
    ariaChecked = 'mixed';
  } else {
    ariaChecked = 'false';
  }

  return (0, _element.createElement)("div", {
    role: "group",
    "aria-labelledby": titleId,
    className: "edit-post-manage-blocks-modal__category"
  }, (0, _element.createElement)(_components.CheckboxControl, {
    checked: isAllChecked,
    onChange: toggleAllVisible,
    className: "edit-post-manage-blocks-modal__category-title",
    "aria-checked": ariaChecked,
    label: (0, _element.createElement)("span", {
      id: titleId
    }, title)
  }), (0, _element.createElement)(_checklist.default, {
    blockTypes: filteredBlockTypes,
    value: checkedBlockNames,
    onItemChange: toggleVisible
  }));
}

var _default = (0, _compose.compose)([_compose.withInstanceId, (0, _data.withSelect)(select => {
  const {
    getPreference
  } = select(_store.store);
  return {
    hiddenBlockTypes: getPreference('hiddenBlockTypes')
  };
}), (0, _data.withDispatch)((dispatch, ownProps) => {
  const {
    showBlockTypes,
    hideBlockTypes
  } = dispatch(_store.store);
  return {
    toggleVisible(blockName, nextIsChecked) {
      if (nextIsChecked) {
        showBlockTypes(blockName);
      } else {
        hideBlockTypes(blockName);
      }
    },

    toggleAllVisible(nextIsChecked) {
      const blockNames = (0, _lodash.map)(ownProps.blockTypes, 'name');

      if (nextIsChecked) {
        showBlockTypes(blockNames);
      } else {
        hideBlockTypes(blockNames);
      }
    }

  };
})])(BlockManagerCategory);

exports.default = _default;
//# sourceMappingURL=category.js.map