@wordpress/components/build/box-control/icon.js

UI components for WordPress.

"use strict";

Object.defineProperty(exports, "__esModule", {
  value: true
});
exports.default = BoxControlIcon;
var _boxControlIconStyles = require("./styles/box-control-icon-styles");
var _jsxRuntime = require("react/jsx-runtime");
/**
 * Internal dependencies
 */

const BASE_ICON_SIZE = 24;
function BoxControlIcon({
  size = 24,
  side = 'all',
  sides,
  ...props
}) {
  const isSideDisabled = value => sides?.length && !sides.includes(value);
  const hasSide = value => {
    if (isSideDisabled(value)) {
      return false;
    }
    return side === 'all' || side === value;
  };
  const top = hasSide('top') || hasSide('vertical');
  const right = hasSide('right') || hasSide('horizontal');
  const bottom = hasSide('bottom') || hasSide('vertical');
  const left = hasSide('left') || hasSide('horizontal');

  // Simulates SVG Icon scaling.
  const scale = size / BASE_ICON_SIZE;
  return /*#__PURE__*/(0, _jsxRuntime.jsx)(_boxControlIconStyles.Root, {
    style: {
      transform: `scale(${scale})`
    },
    ...props,
    children: /*#__PURE__*/(0, _jsxRuntime.jsxs)(_boxControlIconStyles.Viewbox, {
      children: [/*#__PURE__*/(0, _jsxRuntime.jsx)(_boxControlIconStyles.TopStroke, {
        isFocused: top
      }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_boxControlIconStyles.RightStroke, {
        isFocused: right
      }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_boxControlIconStyles.BottomStroke, {
        isFocused: bottom
      }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_boxControlIconStyles.LeftStroke, {
        isFocused: left
      })]
    })
  });
}
//# sourceMappingURL=icon.js.map