@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 _element = require("@wordpress/element");

var _coreData = require("@wordpress/core-data");

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

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

var _blockEditor = require("@wordpress/block-editor");

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

/**
 * WordPress dependencies
 */
function TemplatePartAdvancedControls(_ref) {
  let {
    tagName,
    setAttributes,
    isEntityAvailable,
    templatePartId,
    defaultWrapper
  } = _ref;
  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 {
    areaOptions
  } = (0, _data.useSelect)(select => {
    // FIXME: @wordpress/block-library should not depend on @wordpress/editor.
    // Blocks can be loaded into a *non-post* block editor.

    /* eslint-disable @wordpress/data-no-store-string-literals */
    const definedAreas = select('core/editor').__experimentalGetDefaultTemplatePartAreas();
    /* eslint-enable @wordpress/data-no-store-string-literals */


    return {
      areaOptions: definedAreas.map(_ref2 => {
        let {
          label,
          area: _area
        } = _ref2;
        return {
          label,
          value: _area
        };
      })
    };
  }, []);
  return (0, _element.createElement)(_blockEditor.InspectorControls, {
    __experimentalGroup: "advanced"
  }, isEntityAvailable && (0, _element.createElement)(_element.Fragment, null, (0, _element.createElement)(_components.TextControl, {
    label: (0, _i18n.__)('Title'),
    value: title,
    onChange: value => {
      setTitle(value);
    },
    onFocus: event => event.target.select()
  }), (0, _element.createElement)(_components.SelectControl, {
    label: (0, _i18n.__)('Area'),
    labelPosition: "top",
    options: areaOptions,
    value: area,
    onChange: setArea
  })), (0, _element.createElement)(_components.SelectControl, {
    label: (0, _i18n.__)('HTML element'),
    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'
    }],
    value: tagName || '',
    onChange: value => setAttributes({
      tagName: value
    })
  }));
}
//# sourceMappingURL=advanced-controls.js.map