@wordpress/block-editor/build/hooks/font-appearance.js

Generic block editor.

"use strict";

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

Object.defineProperty(exports, "__esModule", {
  value: true
});
exports.FontAppearanceEdit = FontAppearanceEdit;
exports.useIsFontStyleDisabled = useIsFontStyleDisabled;
exports.useIsFontWeightDisabled = useIsFontWeightDisabled;
exports.useIsFontAppearanceDisabled = useIsFontAppearanceDisabled;
exports.FONT_WEIGHT_SUPPORT_KEY = exports.FONT_STYLE_SUPPORT_KEY = void 0;

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

var _blocks = require("@wordpress/blocks");

var _fontAppearanceControl = _interopRequireDefault(require("../components/font-appearance-control"));

var _useEditorFeature = _interopRequireDefault(require("../components/use-editor-feature"));

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

/**
 * WordPress dependencies
 */

/**
 * Internal dependencies
 */

/**
 * Key within block settings' support array indicating support for font style.
 */
const FONT_STYLE_SUPPORT_KEY = '__experimentalFontStyle';
/**
 * Key within block settings' support array indicating support for font weight.
 */

exports.FONT_STYLE_SUPPORT_KEY = FONT_STYLE_SUPPORT_KEY;
const FONT_WEIGHT_SUPPORT_KEY = '__experimentalFontWeight';
/**
 * Inspector control panel containing the font appearance options.
 *
 * @param  {Object} props Block properties.
 * @return {WPElement}    Font appearance edit element.
 */

exports.FONT_WEIGHT_SUPPORT_KEY = FONT_WEIGHT_SUPPORT_KEY;

function FontAppearanceEdit(props) {
  var _style$typography, _style$typography2;

  const {
    attributes: {
      style
    },
    setAttributes
  } = props;
  const hasFontStyles = !useIsFontStyleDisabled(props);
  const hasFontWeights = !useIsFontWeightDisabled(props);

  if (!hasFontStyles && !hasFontWeights) {
    return null;
  }

  const onChange = newStyles => {
    setAttributes({
      style: (0, _utils.cleanEmptyObject)({ ...style,
        typography: { ...(style === null || style === void 0 ? void 0 : style.typography),
          fontStyle: newStyles.fontStyle,
          fontWeight: newStyles.fontWeight
        }
      })
    });
  };

  const fontStyle = style === null || style === void 0 ? void 0 : (_style$typography = style.typography) === null || _style$typography === void 0 ? void 0 : _style$typography.fontStyle;
  const fontWeight = style === null || style === void 0 ? void 0 : (_style$typography2 = style.typography) === null || _style$typography2 === void 0 ? void 0 : _style$typography2.fontWeight;
  return (0, _element.createElement)(_fontAppearanceControl.default, {
    onChange: onChange,
    hasFontStyles: hasFontStyles,
    hasFontWeights: hasFontWeights,
    value: {
      fontStyle,
      fontWeight
    }
  });
}
/**
 * Checks if font style support has been disabled either by not opting in for
 * support or by failing to provide preset styles.
 *
 * @param  {Object} props      Block properties.
 * @param  {string} props.name Name for the block type.
 * @return {boolean}           Whether font style support has been disabled.
 */


function useIsFontStyleDisabled({
  name: blockName
} = {}) {
  const styleSupport = (0, _blocks.hasBlockSupport)(blockName, FONT_STYLE_SUPPORT_KEY);
  const hasFontStyles = (0, _useEditorFeature.default)('typography.customFontStyle');
  return !styleSupport || !hasFontStyles;
}
/**
 * Checks if font weight support has been disabled either by not opting in for
 * support or by failing to provide preset weights.
 *
 * @param  {Object} props      Block properties.
 * @param  {string} props.name Name for the block type.
 * @return {boolean}           Whether font weight support has been disabled.
 */


function useIsFontWeightDisabled({
  name: blockName
} = {}) {
  const weightSupport = (0, _blocks.hasBlockSupport)(blockName, FONT_WEIGHT_SUPPORT_KEY);
  const hasFontWeights = (0, _useEditorFeature.default)('typography.customFontWeight');
  return !weightSupport || !hasFontWeights;
}
/**
 * Checks if font appearance support has been disabled.
 *
 * @param  {Object} props      Block properties.
 * @return {boolean}           Whether font appearance support has been disabled.
 */


function useIsFontAppearanceDisabled(props) {
  const stylesDisabled = useIsFontStyleDisabled(props);
  const weightsDisabled = useIsFontWeightDisabled(props);
  return stylesDisabled && weightsDisabled;
}
//# sourceMappingURL=font-appearance.js.map