"use strict";

var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
exports.__esModule = true;
exports.PageSubTitle = void 0;
var _react = _interopRequireDefault(require("react"));
var _designSystem = require("@wix/design-system");
var _react2 = require("@wix/bex-core/react");
var _useSelector = require("../../useSelector");
var _bexCore = require("@wix/bex-core");
var _bi = require("@wix/bex-core/bi");
var _useIsMobile = require("../../hooks/useIsMobile");
var _jsxFileName = "/home/builduser/work/843658b9f44192f0/packages/cairo/dist/cjs/components/PageSubTitle/PageSubTitle.tsx";
/**
 * Props for the PageSubTitle component.
 * @property {string} text The subtitle text.
 * @property {Object} [learnMore] An object with a `url` (required) for displaying a link button on the subtitle.
 * @property {string} learnMore.url where the link should navigate to
 * @property {string} [learnMore.label ="Learn more"] - the label of the link button. defaults to "Learn More"
 */

/**
 * Renders a page subtitle with an optional learn more button
 * @component
 * @param {PageSubTitleProps} props The props for the component.
 * @example
 * ```jsx
 * <PageSubTitle text="Welcome to my page" learnMore={{ url: "/learn-more", label: "Learn More" }} />
 * ```
 */
const PageSubTitle = ({
  text,
  learnMore
}) => {
  const {
    translate: t,
    initTask
  } = (0, _react2.useWixPatternsContainer)();
  const {
    bi
  } = (0, _react2.useCollectionPageContext)();
  (0, _useSelector.useSelector)(() => initTask.status);
  const isMobile = (0, _useIsMobile.useIsMobile)();
  return /*#__PURE__*/_react.default.createElement(_designSystem.Box, {
    dataHook: "page-subtitle",
    display: "inline",
    __self: void 0,
    __source: {
      fileName: _jsxFileName,
      lineNumber: 44,
      columnNumber: 5
    }
  }, text, learnMore && /*#__PURE__*/_react.default.createElement(_react.default.Fragment, null, /*#__PURE__*/_react.default.createElement(_designSystem.Box, {
    inline: true,
    marginLeft: "SP1",
    __self: void 0,
    __source: {
      fileName: _jsxFileName,
      lineNumber: 48,
      columnNumber: 11
    }
  }), /*#__PURE__*/_react.default.createElement(_designSystem.TextButton, {
    dataHook: "subtitle-learn-more-cta",
    as: "a",
    rel: "noopener",
    target: "_blank",
    href: learnMore.url,
    size: isMobile ? 'small' : 'medium',
    onClick: () => {
      bi == null || bi.reportBI((0, _bexCore.withoutDefaults)(_bi.cairoPageCtaClicked)({
        location: 'Collection Page Header',
        ctaType: 'link',
        ctaName: 'Learn more'
      }));
    },
    __self: void 0,
    __source: {
      fileName: _jsxFileName,
      lineNumber: 49,
      columnNumber: 11
    }
  }, learnMore.label ?? t('cairo.subtitle.learnMore'))));
};
exports.PageSubTitle = PageSubTitle;
//# sourceMappingURL=PageSubTitle.js.map