@gechiui/block-editor/build/components/list-view/block-select-button.js

Generic block editor.

"use strict";

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

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

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

var _classnames = _interopRequireDefault(require("classnames"));

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

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

var _i18n = require("@gechiui/i18n");

var _blockIcon = _interopRequireDefault(require("../block-icon"));

var _useBlockDisplayInformation = _interopRequireDefault(require("../use-block-display-information"));

var _utils = require("./utils");

var _blockTitle = _interopRequireDefault(require("../block-title"));

var _expander = _interopRequireDefault(require("./expander"));

/**
 * External dependencies
 */

/**
 * GeChiUI dependencies
 */

/**
 * Internal dependencies
 */
function ListViewBlockSelectButton(_ref, ref) {
  let {
    className,
    block: {
      clientId
    },
    isSelected,
    onClick,
    onToggleExpanded,
    position,
    siblingBlockCount,
    level,
    tabIndex,
    onFocus,
    onDragStart,
    onDragEnd,
    draggable
  } = _ref;
  const blockInformation = (0, _useBlockDisplayInformation.default)(clientId);
  const instanceId = (0, _compose.useInstanceId)(ListViewBlockSelectButton);
  const descriptionId = `list-view-block-select-button__${instanceId}`;
  const blockPositionDescription = (0, _utils.getBlockPositionDescription)(position, siblingBlockCount, level);
  return (0, _element.createElement)(_element.Fragment, null, (0, _element.createElement)(_components.Button, {
    className: (0, _classnames.default)('block-editor-list-view-block-select-button', className),
    onClick: onClick,
    "aria-describedby": descriptionId,
    ref: ref,
    tabIndex: tabIndex,
    onFocus: onFocus,
    onDragStart: onDragStart,
    onDragEnd: onDragEnd,
    draggable: draggable
  }, (0, _element.createElement)(_expander.default, {
    onClick: onToggleExpanded
  }), (0, _element.createElement)(_blockIcon.default, {
    icon: blockInformation === null || blockInformation === void 0 ? void 0 : blockInformation.icon,
    showColors: true
  }), (0, _element.createElement)(_blockTitle.default, {
    clientId: clientId
  }), (blockInformation === null || blockInformation === void 0 ? void 0 : blockInformation.anchor) && (0, _element.createElement)("span", {
    className: "block-editor-list-view-block-select-button__anchor"
  }, blockInformation.anchor), isSelected && (0, _element.createElement)(_components.VisuallyHidden, null, (0, _i18n.__)('（选定的区块）'))), (0, _element.createElement)("div", {
    className: "block-editor-list-view-block-select-button__description",
    id: descriptionId
  }, blockPositionDescription));
}

var _default = (0, _element.forwardRef)(ListViewBlockSelectButton);

exports.default = _default;
//# sourceMappingURL=block-select-button.js.map