"use strict";

var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
Object.defineProperty(exports, "__esModule", {
  value: true
});
exports.default = void 0;
var _element = require("@wordpress/element");
var _reactNative = require("react-native");
var _components = require("@wordpress/components");
var _compose = require("@wordpress/compose");
var _blockEditor = require("@wordpress/block-editor");
var _controls = _interopRequireWildcard(require("./controls"));
var _editorNative = _interopRequireDefault(require("./editor.native.scss"));
function _getRequireWildcardCache(nodeInterop) { if (typeof WeakMap !== "function") return null; var cacheBabelInterop = new WeakMap(); var cacheNodeInterop = new WeakMap(); return (_getRequireWildcardCache = function (nodeInterop) { return nodeInterop ? cacheNodeInterop : cacheBabelInterop; })(nodeInterop); }
function _interopRequireWildcard(obj, nodeInterop) { if (!nodeInterop && obj && obj.__esModule) { return obj; } if (obj === null || typeof obj !== "object" && typeof obj !== "function") { return { default: obj }; } var cache = _getRequireWildcardCache(nodeInterop); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var key in obj) { if (key !== "default" && Object.prototype.hasOwnProperty.call(obj, key)) { var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null; if (desc && (desc.get || desc.set)) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } newObj.default = obj; if (cache) { cache.set(obj, newObj); } return newObj; }
/**
 * External dependencies
 */

/**
 * WordPress dependencies
 */

/**
 * Internal dependencies
 */

const DEFAULT_FONT_SIZE = 16;
const Spacer = ({
  attributes,
  context,
  setAttributes,
  isSelected,
  getStylesFromColorScheme
}) => {
  const {
    height: screenHeight,
    width: screenWidth
  } = (0, _reactNative.useWindowDimensions)();
  const cssUnitOptions = {
    height: screenHeight,
    width: screenWidth,
    fontSize: DEFAULT_FONT_SIZE
  };
  const {
    height,
    width
  } = attributes;
  const spacingSizes = [{
    name: 0,
    slug: '0',
    size: 0
  }, ...((0, _blockEditor.useSetting)('spacing.spacingSizes') || [])];
  const {
    orientation
  } = context;
  const defaultStyle = getStylesFromColorScheme(_editorNative.default.staticSpacer, _editorNative.default.staticDarkSpacer);
  (0, _element.useEffect)(() => {
    if (orientation === 'horizontal' && !width) {
      setAttributes({
        height: '0px',
        width: '72px'
      });
    }
  }, []);
  let convertedHeight = (0, _components.useConvertUnitToMobile)(height);
  let convertedWidth = (0, _components.useConvertUnitToMobile)(width);
  const presetValues = {};
  if ((0, _blockEditor.isValueSpacingPreset)(height)) {
    const heightValue = (0, _blockEditor.getCustomValueFromPreset)(height, spacingSizes);
    const parsedPresetHeightValue = parseFloat((0, _blockEditor.getPxFromCssUnit)(heightValue, cssUnitOptions));
    convertedHeight = parsedPresetHeightValue || _controls.DEFAULT_VALUES.px;
    presetValues.presetHeight = convertedHeight;
  }
  if ((0, _blockEditor.isValueSpacingPreset)(width)) {
    const widthValue = (0, _blockEditor.getCustomValueFromPreset)(width, spacingSizes);
    const parsedPresetWidthValue = parseFloat((0, _blockEditor.getPxFromCssUnit)(widthValue, cssUnitOptions));
    convertedWidth = parsedPresetWidthValue || _controls.DEFAULT_VALUES.px;
    presetValues.presetWidth = convertedWidth;
  }
  return (0, _element.createElement)(_reactNative.View, {
    style: [defaultStyle, isSelected && _editorNative.default.selectedSpacer, {
      height: convertedHeight,
      width: convertedWidth
    }]
  }, isSelected && (0, _element.createElement)(_blockEditor.InspectorControls, null, (0, _element.createElement)(_controls.default, {
    attributes: attributes,
    context: context,
    setAttributes: setAttributes,
    ...presetValues
  })));
};
var _default = (0, _compose.withPreferredColorScheme)(Spacer);
exports.default = _default;
//# sourceMappingURL=edit.native.js.map