"use strict";

var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
Object.defineProperty(exports, "__esModule", {
  value: true
});
exports.default = exports.BlockBindingsPanel = void 0;
var _i18n = require("@wordpress/i18n");
var _blocks = require("@wordpress/blocks");
var _components = require("@wordpress/components");
var _data = require("@wordpress/data");
var _useBindingsAttributes = require("../hooks/use-bindings-attributes");
var _lockUnlock = require("../lock-unlock");
var _inspectorControls = _interopRequireDefault(require("../components/inspector-controls"));
var _jsxRuntime = require("react/jsx-runtime");
/**
 * WordPress dependencies
 */

/**
 * Internal dependencies
 */

const BlockBindingsPanel = ({
  name,
  metadata
}) => {
  const {
    bindings
  } = metadata || {};
  const {
    sources
  } = (0, _data.useSelect)(select => {
    const _sources = (0, _lockUnlock.unlock)(select(_blocks.store)).getAllBlockBindingsSources();
    return {
      sources: _sources
    };
  }, []);
  if (!bindings) {
    return null;
  }

  // Don't show not allowed attributes.
  // Don't show the bindings connected to pattern overrides in the inspectors panel.
  // TODO: Explore if this should be abstracted to let other sources decide.
  const filteredBindings = {
    ...bindings
  };
  Object.keys(filteredBindings).forEach(key => {
    if (!(0, _useBindingsAttributes.canBindAttribute)(name, key) || filteredBindings[key].source === 'core/pattern-overrides') {
      delete filteredBindings[key];
    }
  });
  if (Object.keys(filteredBindings).length === 0) {
    return null;
  }
  return /*#__PURE__*/(0, _jsxRuntime.jsx)(_inspectorControls.default, {
    children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_components.PanelBody, {
      title: (0, _i18n.__)('Attributes'),
      className: "components-panel__block-bindings-panel",
      children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_components.BaseControl, {
        help: (0, _i18n.__)('Attributes connected to various sources.'),
        children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_components.__experimentalItemGroup, {
          isBordered: true,
          isSeparated: true,
          size: "large",
          children: Object.keys(filteredBindings).map(key => {
            return /*#__PURE__*/(0, _jsxRuntime.jsx)(_components.__experimentalItem, {
              children: /*#__PURE__*/(0, _jsxRuntime.jsxs)(_components.__experimentalHStack, {
                children: [/*#__PURE__*/(0, _jsxRuntime.jsx)("span", {
                  children: key
                }), /*#__PURE__*/(0, _jsxRuntime.jsx)("span", {
                  className: "components-item__block-bindings-source",
                  children: sources[filteredBindings[key].source] ? sources[filteredBindings[key].source].label : filteredBindings[key].source
                })]
              })
            }, key);
          })
        })
      })
    })
  });
};
exports.BlockBindingsPanel = BlockBindingsPanel;
var _default = exports.default = {
  edit: BlockBindingsPanel,
  attributeKeys: ['metadata'],
  hasSupport() {
    return true;
  }
};
//# sourceMappingURL=block-bindings.js.map