wix-style-react/dist/src/GooglePreview/GooglePreview.js

wix-style-react

"use strict";

var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
exports.__esModule = true;
exports.default = void 0;
var _react = _interopRequireDefault(require("react"));
var _propTypes = _interopRequireDefault(require("prop-types"));
var _GooglePreviewSt = require("./GooglePreview.st.css");
var _Text = _interopRequireDefault(require("../Text"));
var _Box = _interopRequireDefault(require("../Box"));
var _jsxFileName = "/home/builduser/work/a9c1ac8876d5057c/packages/wix-style-react/dist/cjs/GooglePreview/GooglePreview.js";
var tooltipProps = {
  enterDelay: 200
};

/**
 *  A preview of a title, link and description of SEO result as it displayed in Google
 */
var GooglePreview = _ref => {
  var {
    dataHook,
    previewUrl,
    title,
    description,
    titleMaxLines = 1,
    descriptionMaxLines = 2,
    skin = 'light'
  } = _ref;
  return /*#__PURE__*/_react.default.createElement(_Box.default, {
    className: (0, _GooglePreviewSt.st)(_GooglePreviewSt.classes.root, {
      transparent: skin === 'transparent'
    }),
    dataHook: dataHook,
    direction: "vertical",
    __self: void 0,
    __source: {
      fileName: _jsxFileName,
      lineNumber: 22,
      columnNumber: 3
    }
  }, /*#__PURE__*/_react.default.createElement(_Text.default, {
    weight: "thin",
    size: "tiny",
    light: false,
    className: _GooglePreviewSt.classes.googlePreviewUrl,
    dataHook: "googlePreview-previewUrl",
    ellipsis: true,
    tooltipProps: tooltipProps,
    __self: void 0,
    __source: {
      fileName: _jsxFileName,
      lineNumber: 29,
      columnNumber: 5
    }
  }, previewUrl), /*#__PURE__*/_react.default.createElement(_Text.default, {
    className: _GooglePreviewSt.classes.googlePreviewTitle,
    dataHook: "googlePreview-title",
    weight: "bold",
    size: "medium",
    secondary: false,
    light: false,
    ellipsis: true,
    tooltipProps: tooltipProps,
    maxLines: titleMaxLines,
    __self: void 0,
    __source: {
      fileName: _jsxFileName,
      lineNumber: 40,
      columnNumber: 5
    }
  }, title), /*#__PURE__*/_react.default.createElement(_Text.default, {
    className: _GooglePreviewSt.classes.googlePreviewDescription,
    weight: "thin",
    size: "tiny",
    light: false,
    dataHook: "googlePreview-description",
    ellipsis: true,
    tooltipProps: tooltipProps,
    maxLines: descriptionMaxLines,
    __self: void 0,
    __source: {
      fileName: _jsxFileName,
      lineNumber: 53,
      columnNumber: 5
    }
  }, description));
};
GooglePreview.displayName = 'GooglePreview';
GooglePreview.propTypes = {
  /** Applies a data-hook HTML attribute to be used in the tests */
  dataHook: _propTypes.default.string,
  /** Sets the title of the page (middle section) */
  title: _propTypes.default.string,
  /** Truncates title text at a specific number of lines */
  titleMaxLines: _propTypes.default.number,
  /** Sets the link for the site (top section) */
  previewUrl: _propTypes.default.string,
  /** Sets a short description for the page (bottom section, optional) */
  description: _propTypes.default.string,
  /** Truncates description text at a specific number of lines */
  descriptionMaxLines: _propTypes.default.number,
  /** Sets widget background color */
  skin: _propTypes.default.oneOf(['light', 'transparent'])
};
var _default = exports.default = GooglePreview;
//# sourceMappingURL=GooglePreview.js.map