"use strict";

Object.defineProperty(exports, "__esModule", {
  value: true
});
exports.default = void 0;
var _react = _interopRequireWildcard(require("react"));
var _classnames = _interopRequireDefault(require("classnames"));
var _reactPopper = require("../../react-popper");
var _advancedTourFooter = require("./components/advanced-tour-footer");
var _advancedTourAnchor = require("./components/advanced-tour-anchor");
var _jsxRuntime = require("react/jsx-runtime");
function _interopRequireDefault(e) { return e && e.__esModule ? e : { default: e }; }
function _interopRequireWildcard(e, t) { if ("function" == typeof WeakMap) var r = new WeakMap(), n = new WeakMap(); return (_interopRequireWildcard = function (e, t) { if (!t && e && e.__esModule) return e; var o, i, f = { __proto__: null, default: e }; if (null === e || "object" != typeof e && "function" != typeof e) return f; if (o = t ? n : r) { if (o.has(e)) return o.get(e); o.set(e, f); } for (const t in e) "default" !== t && {}.hasOwnProperty.call(e, t) && ((i = (o = Object.defineProperty) && Object.getOwnPropertyDescriptor(e, t)) && (i.get || i.set) ? o(f, t, i) : f[t] = e[t]); return f; })(e, t); }
/**
 * Component to demonstrate advanced tour information.
 * Is attached to a specific component on the page in the corner.
 * @uxr-only-supported
 * @midnight-gray-supported
 * @alpine-light-supported
 * */
const AdvancedTour = ({
  step,
  setNextStep,
  setPrevStep,
  showTour,
  onSkipHandler,
  stepNumber = 0,
  totalSteps = 0,
  className = '',
  anchorRef,
  a11yProps
}) => {
  const ref = (0, _react.useRef)(null);
  const {
    content,
    headerIcon,
    headerText,
    headerIconClassName,
    headerTextClassName,
    okayButtonClassName,
    okayButtonText,
    placement
  } = step;
  return /*#__PURE__*/(0, _jsxRuntime.jsx)(_reactPopper.Popper, {
    open: showTour,
    rootEl: ref,
    placement: placement === _advancedTourAnchor.ANCHOR_PLACEMENT.LEFT ? _reactPopper.POPPER_PLACEMENTS_TYPES.TOP_START : _reactPopper.POPPER_PLACEMENTS_TYPES.TOP_END,
    anchorEl: anchorRef,
    strategy: _reactPopper.POPPER_STRATEGY_OPTIONS.FIXED,
    popperModifiers: [_reactPopper.OFFSET_MODIFIER, _reactPopper.FLIP_MODIFIER],
    children: () => /*#__PURE__*/(0, _jsxRuntime.jsxs)("div", {
      className: (0, _classnames.default)('advanced-tour-container popout-transition', className),
      ref: ref,
      "test-id": "advanced-tour-container",
      children: [/*#__PURE__*/(0, _jsxRuntime.jsxs)("header", {
        className: "advanced-tour-header",
        children: [headerIcon && /*#__PURE__*/(0, _jsxRuntime.jsx)("div", {
          className: (0, _classnames.default)('advanced-tour-header-icon', headerIconClassName),
          children: headerIcon
        }), /*#__PURE__*/(0, _jsxRuntime.jsx)("p", {
          className: (0, _classnames.default)('advanced-tour-header-text', headerTextClassName),
          "test-id": "advanced-tour-header-text",
          children: headerText
        })]
      }), /*#__PURE__*/(0, _jsxRuntime.jsx)("div", {
        className: "advanced-tour-content",
        "test-id": "advanced-tour-content",
        children: typeof content === 'string' ? /*#__PURE__*/(0, _jsxRuntime.jsx)("p", {
          children: content
        }) : content
      }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_advancedTourFooter.AdvancedTourFooter, {
        stepNumber: stepNumber,
        totalSteps: totalSteps,
        onNextHandler: setNextStep,
        onPrevHandler: setPrevStep,
        onSkipHandler: onSkipHandler,
        okayButtonText: okayButtonText,
        okayButtonClassName: okayButtonClassName,
        nextTourButtonAriaLabel: a11yProps.nextTourButtonAriaLabel,
        previousTourButtonAriaLabel: a11yProps.previousTourButtonAriaLabel
      }), /*#__PURE__*/(0, _jsxRuntime.jsx)("div", {
        "data-popper-arrow": ""
      })]
    })
  });
};
var _default = exports.default = AdvancedTour;