"use strict";

Object.defineProperty(exports, "__esModule", {
  value: true
});
exports.default = DimensionsPanel;
var _blockEditor = require("@wordpress/block-editor");
var _element = require("@wordpress/element");
var _lockUnlock = require("../../lock-unlock");
var _jsxRuntime = require("react/jsx-runtime");
/**
 * WordPress dependencies
 */

/**
 * Internal dependencies
 */

const {
  useGlobalStyle,
  useGlobalSetting,
  useSettingsForBlockElement,
  DimensionsPanel: StylesDimensionsPanel
} = (0, _lockUnlock.unlock)(_blockEditor.privateApis);
const DEFAULT_CONTROLS = {
  contentSize: true,
  wideSize: true,
  padding: true,
  margin: true,
  blockGap: true,
  minHeight: true,
  childLayout: false
};
function DimensionsPanel() {
  const [style] = useGlobalStyle('', undefined, 'user', {
    shouldDecodeEncode: false
  });
  const [inheritedStyle, setStyle] = useGlobalStyle('', undefined, 'all', {
    shouldDecodeEncode: false
  });
  const [userSettings] = useGlobalSetting('', undefined, 'user');
  const [rawSettings, setSettings] = useGlobalSetting('');
  const settings = useSettingsForBlockElement(rawSettings);

  // These intermediary objects are needed because the "layout" property is stored
  // in settings rather than styles.
  const inheritedStyleWithLayout = (0, _element.useMemo)(() => {
    return {
      ...inheritedStyle,
      layout: settings.layout
    };
  }, [inheritedStyle, settings.layout]);
  const styleWithLayout = (0, _element.useMemo)(() => {
    return {
      ...style,
      layout: userSettings.layout
    };
  }, [style, userSettings.layout]);
  const onChange = newStyle => {
    const updatedStyle = {
      ...newStyle
    };
    delete updatedStyle.layout;
    setStyle(updatedStyle);
    if (newStyle.layout !== userSettings.layout) {
      const updatedSettings = {
        ...userSettings,
        layout: newStyle.layout
      };

      // Ensure any changes to layout definitions are not persisted.
      if (updatedSettings.layout?.definitions) {
        delete updatedSettings.layout.definitions;
      }
      setSettings(updatedSettings);
    }
  };
  return /*#__PURE__*/(0, _jsxRuntime.jsx)(StylesDimensionsPanel, {
    inheritedValue: inheritedStyleWithLayout,
    value: styleWithLayout,
    onChange: onChange,
    settings: settings,
    includeLayoutControls: true,
    defaultControls: DEFAULT_CONTROLS
  });
}
//# sourceMappingURL=dimensions-panel.js.map