@wordpress/components/build-module/alignment-matrix-control/icon.js

UI components for WordPress.

import _extends from "@babel/runtime/helpers/esm/extends";
import { createElement } from "@wordpress/element";

/**
 * External dependencies
 */
import classnames from 'classnames';
/**
 * Internal dependencies
 */

import { ALIGNMENTS, getAlignmentIndex } from './utils';
import { Root, Cell, Point } from './styles/alignment-matrix-control-icon-styles';
const BASE_SIZE = 24;

function AlignmentMatrixControlIcon(_ref) {
  let {
    className,
    disablePointerEvents = true,
    size = BASE_SIZE,
    style = {},
    value = 'center',
    ...props
  } = _ref;
  const alignIndex = getAlignmentIndex(value);
  const scale = (size / BASE_SIZE).toFixed(2);
  const classes = classnames('component-alignment-matrix-control-icon', className);
  const styles = { ...style,
    transform: `scale(${scale})`
  };
  return createElement(Root, _extends({}, props, {
    className: classes,
    disablePointerEvents: disablePointerEvents,
    role: "presentation",
    style: styles
  }), ALIGNMENTS.map((align, index) => {
    const isActive = alignIndex === index;
    return createElement(Cell, {
      key: align
    }, createElement(Point, {
      isActive: isActive
    }));
  }));
}

export default AlignmentMatrixControlIcon;
//# sourceMappingURL=icon.js.map