@wordpress/block-library/build/template-part/edit/advanced-controls.js

Block library for the WordPress editor.

"use strict";

Object.defineProperty(exports, "__esModule", {
  value: true
});
exports.TemplatePartAdvancedControls = TemplatePartAdvancedControls;
var _coreData = require("@wordpress/core-data");
var _components = require("@wordpress/components");
var _i18n = require("@wordpress/i18n");
var _data = require("@wordpress/data");
var _blockEditor = require("@wordpress/block-editor");
var _importControls = require("./import-controls");
var _lockUnlock = require("../../lock-unlock");
var _jsxRuntime = require("react/jsx-runtime");
/**
 * WordPress dependencies
 */

/**
 * Internal dependencies
 */

const {
  HTMLElementControl
} = (0, _lockUnlock.unlock)(_blockEditor.privateApis);
function TemplatePartAdvancedControls({
  tagName,
  setAttributes,
  isEntityAvailable,
  templatePartId,
  defaultWrapper,
  hasInnerBlocks,
  clientId
}) {
  const [area, setArea] = (0, _coreData.useEntityProp)('postType', 'wp_template_part', 'area', templatePartId);
  const [title, setTitle] = (0, _coreData.useEntityProp)('postType', 'wp_template_part', 'title', templatePartId);
  const defaultTemplatePartAreas = (0, _data.useSelect)(select => select(_coreData.store).getCurrentTheme()?.default_template_part_areas || [], []);
  const areaOptions = defaultTemplatePartAreas.map(({
    label,
    area: _area
  }) => ({
    label,
    value: _area
  }));
  return /*#__PURE__*/(0, _jsxRuntime.jsxs)(_jsxRuntime.Fragment, {
    children: [isEntityAvailable && /*#__PURE__*/(0, _jsxRuntime.jsxs)(_jsxRuntime.Fragment, {
      children: [/*#__PURE__*/(0, _jsxRuntime.jsx)(_components.TextControl, {
        __next40pxDefaultSize: true,
        __nextHasNoMarginBottom: true,
        label: (0, _i18n.__)('Title'),
        value: title,
        onChange: value => {
          setTitle(value);
        },
        onFocus: event => event.target.select()
      }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_components.SelectControl, {
        __next40pxDefaultSize: true,
        __nextHasNoMarginBottom: true,
        label: (0, _i18n.__)('Area'),
        labelPosition: "top",
        options: areaOptions,
        value: area,
        onChange: setArea
      })]
    }), /*#__PURE__*/(0, _jsxRuntime.jsx)(HTMLElementControl, {
      tagName: tagName || '',
      onChange: value => setAttributes({
        tagName: value
      }),
      clientId: clientId,
      options: [{
        label: (0, _i18n.sprintf)(/* translators: %s: HTML tag based on area. */
        (0, _i18n.__)('Default based on area (%s)'), `<${defaultWrapper}>`),
        value: ''
      }, {
        label: '<header>',
        value: 'header'
      }, {
        label: '<main>',
        value: 'main'
      }, {
        label: '<section>',
        value: 'section'
      }, {
        label: '<article>',
        value: 'article'
      }, {
        label: '<aside>',
        value: 'aside'
      }, {
        label: '<footer>',
        value: 'footer'
      }, {
        label: '<div>',
        value: 'div'
      }]
    }), !hasInnerBlocks && /*#__PURE__*/(0, _jsxRuntime.jsx)(_importControls.TemplatePartImportControls, {
      area: area,
      setAttributes: setAttributes
    })]
  });
}
//# sourceMappingURL=advanced-controls.js.map