/**
 * WordPress dependencies
 */
import { __ } from '@wordpress/i18n';
import { store as blocksStore } from '@wordpress/blocks';
import { BaseControl, PanelBody, __experimentalHStack as HStack, __experimentalItemGroup as ItemGroup, __experimentalItem as Item } from '@wordpress/components';
import { useSelect } from '@wordpress/data';

/**
 * Internal dependencies
 */
import { canBindAttribute } from '../hooks/use-bindings-attributes';
import { unlock } from '../lock-unlock';
import InspectorControls from '../components/inspector-controls';
import { jsx as _jsx } from "react/jsx-runtime";
import { jsxs as _jsxs } from "react/jsx-runtime";
export const BlockBindingsPanel = ({
  name,
  metadata
}) => {
  const {
    bindings
  } = metadata || {};
  const {
    sources
  } = useSelect(select => {
    const _sources = unlock(select(blocksStore)).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 (!canBindAttribute(name, key) || filteredBindings[key].source === 'core/pattern-overrides') {
      delete filteredBindings[key];
    }
  });
  if (Object.keys(filteredBindings).length === 0) {
    return null;
  }
  return /*#__PURE__*/_jsx(InspectorControls, {
    children: /*#__PURE__*/_jsx(PanelBody, {
      title: __('Attributes'),
      className: "components-panel__block-bindings-panel",
      children: /*#__PURE__*/_jsx(BaseControl, {
        help: __('Attributes connected to various sources.'),
        children: /*#__PURE__*/_jsx(ItemGroup, {
          isBordered: true,
          isSeparated: true,
          size: "large",
          children: Object.keys(filteredBindings).map(key => {
            return /*#__PURE__*/_jsx(Item, {
              children: /*#__PURE__*/_jsxs(HStack, {
                children: [/*#__PURE__*/_jsx("span", {
                  children: key
                }), /*#__PURE__*/_jsx("span", {
                  className: "components-item__block-bindings-source",
                  children: sources[filteredBindings[key].source] ? sources[filteredBindings[key].source].label : filteredBindings[key].source
                })]
              })
            }, key);
          })
        })
      })
    })
  });
};
export default {
  edit: BlockBindingsPanel,
  attributeKeys: ['metadata'],
  hasSupport() {
    return true;
  }
};
//# sourceMappingURL=block-bindings.js.map