@atlaskit/onboarding/dist/cjs/components/spotlight.js

An onboarding spotlight introduces new features to users through focused messages or multi-step tours.

"use strict";

var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
Object.defineProperty(exports, "__esModule", {
  value: true
});
exports.default = void 0;
var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends"));
var _objectWithoutProperties2 = _interopRequireDefault(require("@babel/runtime/helpers/objectWithoutProperties"));
var _react = _interopRequireDefault(require("react"));
var _spotlightInner = _interopRequireDefault(require("./spotlight-inner"));
var _spotlightManager = require("./spotlight-manager");
var _excluded = ["actions", "actionsBeforeElement", "children", "dialogPlacement", "dialogWidth", "footer", "header", "heading", "headingAfterElement", "image", "label", "pulse", "scrollPositionBlock", "shouldWatchTarget", "target", "targetBgColor", "targetNode", "targetOnClick", "targetRadius", "targetReplacement", "testId", "titleId"];
/**
 * __Spotlight__
 *
 * An onboarding spotlight introduces new features to users through focused messages or multi-step tours.
 *
 * - [Examples](https://atlassian.design/components/onboarding/examples)
 * - [Code](https://atlassian.design/components/onboarding/code)
 * - [Usage](https://atlassian.design/components/onboarding/usage)
 *
 * @deprecated Use `@atlaskit/spotlight` instead.
 */
var Spotlight = function Spotlight(_ref) {
  var actions = _ref.actions,
    actionsBeforeElement = _ref.actionsBeforeElement,
    children = _ref.children,
    dialogPlacement = _ref.dialogPlacement,
    _ref$dialogWidth = _ref.dialogWidth,
    dialogWidth = _ref$dialogWidth === void 0 ? 400 : _ref$dialogWidth,
    footer = _ref.footer,
    header = _ref.header,
    heading = _ref.heading,
    headingAfterElement = _ref.headingAfterElement,
    image = _ref.image,
    label = _ref.label,
    _ref$pulse = _ref.pulse,
    pulse = _ref$pulse === void 0 ? true : _ref$pulse,
    scrollPositionBlock = _ref.scrollPositionBlock,
    _ref$shouldWatchTarge = _ref.shouldWatchTarget,
    shouldWatchTarget = _ref$shouldWatchTarge === void 0 ? false : _ref$shouldWatchTarge,
    target = _ref.target,
    targetBgColor = _ref.targetBgColor,
    targetNode = _ref.targetNode,
    targetOnClick = _ref.targetOnClick,
    targetRadius = _ref.targetRadius,
    targetReplacement = _ref.targetReplacement,
    _ref$testId = _ref.testId,
    testId = _ref$testId === void 0 ? 'spotlight' : _ref$testId,
    titleId = _ref.titleId,
    rest = (0, _objectWithoutProperties2.default)(_ref, _excluded);
  return /*#__PURE__*/_react.default.createElement(_spotlightManager.SpotlightConsumer, null, function (_ref2) {
    var opened = _ref2.opened,
      closed = _ref2.closed,
      targets = _ref2.targets;
    // use the targetNode prop or try get the target from context targets using name
    var actualTargetNode = targetNode || (typeof target === 'string' ? targets[target] : undefined);
    return actualTargetNode ? /*#__PURE__*/_react.default.createElement(_spotlightInner.default, (0, _extends2.default)({}, rest, {
      actions: actions,
      actionsBeforeElement: actionsBeforeElement,
      children: children,
      dialogPlacement: dialogPlacement,
      dialogWidth: dialogWidth,
      footer: footer,
      header: header,
      heading: heading,
      headingAfterElement: headingAfterElement,
      image: image,
      label: label,
      onClosed: closed,
      onOpened: opened,
      pulse: pulse,
      scrollPositionBlock: scrollPositionBlock,
      shouldWatchTarget: shouldWatchTarget,
      target: target,
      targetBgColor: targetBgColor,
      targetNode: actualTargetNode,
      targetOnClick: targetOnClick,
      targetRadius: targetRadius,
      targetReplacement: targetReplacement,
      testId: testId,
      titleId: titleId
    })) : null;
  });
};
var _default = exports.default = Spotlight;