@wordpress/block-editor/build/components/border-radius-control/all-input-control.js

Generic block editor.

"use strict";

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

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

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

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

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

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

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

/**
 * WordPress dependencies
 */

/**
 * Internal dependencies
 */
function AllInputControl({
  onChange,
  selectedUnits,
  setSelectedUnits,
  values,
  ...props
}) {
  let allValue = (0, _utils.getAllValue)(values);

  if (allValue === undefined) {
    // If we don't have any value set the unit to any current selection
    // or the most common unit from the individual radii values.
    allValue = (0, _utils.getAllUnit)(selectedUnits);
  }

  const hasValues = (0, _utils.hasDefinedValues)(values);
  const isMixed = hasValues && (0, _utils.hasMixedValues)(values);
  const allPlaceholder = isMixed ? (0, _i18n.__)('Mixed') : null; // Filter out CSS-unit-only values to prevent invalid styles.

  const handleOnChange = next => {
    const isNumeric = !isNaN(parseFloat(next));
    const nextValue = isNumeric ? next : undefined;
    onChange(nextValue);
  }; // Store current unit selection for use as fallback for individual
  // radii controls.


  const handleOnUnitChange = unit => {
    setSelectedUnits({
      topLeft: unit,
      topRight: unit,
      bottomLeft: unit,
      bottomRight: unit
    });
  };

  return (0, _element.createElement)(_components.__experimentalUnitControl, (0, _extends2.default)({}, props, {
    "aria-label": (0, _i18n.__)('Border radius'),
    disableUnits: isMixed,
    isOnly: true,
    value: allValue,
    onChange: handleOnChange,
    onUnitChange: handleOnUnitChange,
    placeholder: allPlaceholder,
    size: '__unstable-large'
  }));
}
//# sourceMappingURL=all-input-control.js.map