"use strict";

Object.defineProperty(exports, "__esModule", {
  value: true
});
exports.default = exports.TooltipWithCloseButton = exports.InversedTrigger = exports.InteractiveContent = exports.InlineTrigger = exports.IconTrigger = void 0;

var _react = _interopRequireDefault(require("react"));

var _Tooltip = _interopRequireDefault(require("./Tooltip"));

var _TooltipIcon = _interopRequireDefault(require("./TooltipIcon"));

var _Button = _interopRequireDefault(require("../Button/Button"));

var _excluded = ["data"];

function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }

function _objectWithoutProperties(source, excluded) { if (source == null) return {}; var target = _objectWithoutPropertiesLoose(source, excluded); var key, i; if (Object.getOwnPropertySymbols) { var sourceSymbolKeys = Object.getOwnPropertySymbols(source); for (i = 0; i < sourceSymbolKeys.length; i++) { key = sourceSymbolKeys[i]; if (excluded.indexOf(key) >= 0) continue; if (!Object.prototype.propertyIsEnumerable.call(source, key)) continue; target[key] = source[key]; } } return target; }

function _objectWithoutPropertiesLoose(source, excluded) { if (source == null) return {}; var target = {}; var sourceKeys = Object.keys(source); var key, i; for (i = 0; i < sourceKeys.length; i++) { key = sourceKeys[i]; if (excluded.indexOf(key) >= 0) continue; target[key] = source[key]; } return target; }

var _default = {
  title: 'Components/Tooltip',
  component: _Tooltip.default,
  argTypes: {
    children: {
      control: false
    },
    data: {
      table: {
        disable: true
      }
    },
    placement: {
      options: ['auto', 'auto-start', 'auto-end', 'left', 'left-start', 'left-end', 'right', 'right-start', 'right-end', 'top', 'top-start', 'top-end', 'bottom', 'bottom-start', 'bottom-end'],
      control: {
        type: 'select'
      }
    }
  }
};
exports.default = _default;

var Template = function Template(_ref) {
  var data = _ref.data,
      args = _objectWithoutProperties(_ref, _excluded);

  return /*#__PURE__*/_react.default.createElement("div", {
    className: "ds-u-display--flex ds-u-align-items--center ds-u-margin--7 ds-u-padding--7"
  }, data, /*#__PURE__*/_react.default.createElement(_Tooltip.default, args));
};

var IconTrigger = Template.bind({});
exports.IconTrigger = IconTrigger;
IconTrigger.args = {
  data: /*#__PURE__*/_react.default.createElement("p", {
    className: "ds-u-margin--0"
  }, "Tooltip with icon trigger"),
  ariaLabel: 'Label describing the subject of the tooltip',
  className: 'ds-c-tooltip__trigger-icon',
  title: 'Tooltip trigger uses <TooltipIcon> for the trigger content',
  children: /*#__PURE__*/_react.default.createElement(_TooltipIcon.default, null)
};
var InlineTrigger = Template.bind({});
exports.InlineTrigger = InlineTrigger;
InlineTrigger.args = {
  data: /*#__PURE__*/_react.default.createElement("span", null, "Tooltip with\xA0"),
  className: 'ds-c-tooltip__trigger-link',
  component: 'a',
  title: 'Tooltip trigger uses <a> for the trigger, styled with dotted underline',
  children: 'inline trigger'
};
var InteractiveContent = Template.bind({});
exports.InteractiveContent = InteractiveContent;
InteractiveContent.args = {
  dialog: true,
  className: 'ds-c-button',
  component: 'button',
  title: /*#__PURE__*/_react.default.createElement(_react.default.Fragment, null, /*#__PURE__*/_react.default.createElement("p", {
    className: "ds-u-margin--0"
  }, "Tooltip dialogs only activate on click and include a focus trap. Intended for tooltips with complex layout and ", /*#__PURE__*/_react.default.createElement("a", {
    href: "/#"
  }, "interactive elements")), /*#__PURE__*/_react.default.createElement(_Button.default, {
    size: "small",
    className: "ds-u-margin-top--2",
    href: "https://dequeuniversity.com/library/aria/tooltip-dialog"
  }, "More info")),
  children: 'Tooltip with interactive content'
};
var TooltipWithCloseButton = Template.bind({});
exports.TooltipWithCloseButton = TooltipWithCloseButton;
TooltipWithCloseButton.args = {
  dialog: true,
  title: /*#__PURE__*/_react.default.createElement(_react.default.Fragment, null, "Entering your Social Security Number helps the plan confirm with your state that you have Medicaid."),
  children: 'Tooltip trigger',
  contentHeading: 'Really long Heading for tooltip',
  showCloseButton: true,
  className: 'ds-c-button'
};
var InversedTrigger = Template.bind({});
exports.InversedTrigger = InversedTrigger;
InversedTrigger.parameters = {
  backgrounds: {
    default: process.env.STORYBOOK_DS === 'medicare' ? 'Mgov dark' : 'Hcgov dark'
  }
};
InversedTrigger.args = {
  data: /*#__PURE__*/_react.default.createElement("p", {
    className: "ds-u-margin--0 ds-u-color--base-inverse"
  }, "Tooltip with icon trigger"),
  ariaLabel: 'Label describing the subject of the tooltip',
  className: 'ds-c-tooltip__trigger-icon',
  title: 'Tooltip trigger uses <TooltipIcon> for the trigger content',
  children: /*#__PURE__*/_react.default.createElement(_TooltipIcon.default, {
    inversed: true
  }),
  inversed: true
};