"use strict";

var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
Object.defineProperty(exports, "__esModule", {
  value: true
});
exports.default = void 0;
var _components = require("@wordpress/components");
var _presetColors = _interopRequireDefault(require("./preset-colors"));
var _previewWrapper = _interopRequireDefault(require("./preview-wrapper"));
var _jsxRuntime = require("react/jsx-runtime");
/**
 * WordPress dependencies
 */

/**
 * Internal dependencies
 */

const firstFrameVariants = {
  start: {
    scale: 1,
    opacity: 1
  },
  hover: {
    scale: 0,
    opacity: 0
  }
};
const StylesPreviewColors = ({
  label,
  isFocused,
  withHoverView
}) => {
  return /*#__PURE__*/(0, _jsxRuntime.jsx)(_previewWrapper.default, {
    label: label,
    isFocused: isFocused,
    withHoverView: withHoverView,
    children: ({
      key
    }) => /*#__PURE__*/(0, _jsxRuntime.jsx)(_components.__unstableMotion.div, {
      variants: firstFrameVariants,
      style: {
        height: '100%',
        overflow: 'hidden'
      },
      children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_components.__experimentalHStack, {
        spacing: 0,
        justify: "center",
        style: {
          height: '100%',
          overflow: 'hidden'
        },
        children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_presetColors.default, {})
      })
    }, key)
  });
};
var _default = exports.default = StylesPreviewColors;
//# sourceMappingURL=preview-colors.js.map