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

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

import _extends from "@babel/runtime/helpers/extends";
import _objectWithoutProperties from "@babel/runtime/helpers/objectWithoutProperties";
var _excluded = ["actions", "actionsBeforeElement", "children", "dialogPlacement", "dialogWidth", "footer", "header", "heading", "headingAfterElement", "image", "label", "pulse", "scrollPositionBlock", "shouldWatchTarget", "target", "targetBgColor", "targetNode", "targetOnClick", "targetRadius", "targetReplacement", "testId", "titleId"];
import React from 'react';
import SpotlightInner from './spotlight-inner';
import { SpotlightConsumer } from './spotlight-manager';

/**
 * __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 = _objectWithoutProperties(_ref, _excluded);
  return /*#__PURE__*/React.createElement(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.createElement(SpotlightInner, _extends({}, 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;
  });
};
export default Spotlight;