"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 _typographyExample = _interopRequireDefault(require("./typography-example"));
var _previewWrapper = _interopRequireDefault(require("./preview-wrapper"));
var _jsxRuntime = require("react/jsx-runtime");
/**
 * WordPress dependencies
 */

/**
 * Internal dependencies
 */

const StylesPreviewTypography = ({
  variation,
  isFocused,
  withHoverView
}) => {
  return /*#__PURE__*/(0, _jsxRuntime.jsx)(_previewWrapper.default, {
    label: variation.title,
    isFocused: isFocused,
    withHoverView: withHoverView,
    children: ({
      ratio,
      key
    }) => /*#__PURE__*/(0, _jsxRuntime.jsx)(_components.__experimentalHStack, {
      spacing: 10 * ratio,
      justify: "center",
      style: {
        height: '100%',
        overflow: 'hidden'
      },
      children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_typographyExample.default, {
        variation: variation,
        fontSize: 85 * ratio
      })
    }, key)
  });
};
var _default = exports.default = StylesPreviewTypography;
//# sourceMappingURL=preview-typography.js.map