/* index.tsx generated by @compiled/babel-plugin v0.40.0 */
"use strict";

var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
var _typeof = require("@babel/runtime/helpers/typeof");
Object.defineProperty(exports, "__esModule", {
  value: true
});
exports.default = void 0;
require("./index.compiled.css");
var _react = _interopRequireWildcard(require("react"));
var React = _react;
var _runtime = require("@compiled/react/runtime");
var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends"));
var _slicedToArray2 = _interopRequireDefault(require("@babel/runtime/helpers/slicedToArray"));
var _objectWithoutProperties2 = _interopRequireDefault(require("@babel/runtime/helpers/objectWithoutProperties"));
var _react2 = require("@compiled/react");
var _reactIntl = require("react-intl");
var _chevronDown = _interopRequireDefault(require("@atlaskit/icon/core/chevron-down"));
var _lozenge = _interopRequireWildcard(require("@atlaskit/lozenge"));
var _platformFeatureFlags = require("@atlaskit/platform-feature-flags");
var _compiled = require("@atlaskit/primitives/compiled");
var _messages = require("../../../../../../../../messages");
var _excluded = ["appearance", "isOpen", "maxWidth", "testId", "text", "triggerRef", "trailingMetric"];
/* eslint-disable @atlaskit/design-system/use-tokens-typography */
function _interopRequireWildcard(e, t) { if ("function" == typeof WeakMap) var r = new WeakMap(), n = new WeakMap(); return (_interopRequireWildcard = function _interopRequireWildcard(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 (var _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); }
var styles = {
  chevronDown: "_18u012x7 _1e0c1txw",
  lozengeContainer: "_kkk2n7od _2rko12b0 _1dqonqa1 _189ee4h9 _1h6d1j28 _bfhk1j28 _1e0c1txw _4cvr1h6o _4t3i7vkz",
  lozengeContainerSelected: "_1reo15vq _18m915vq _1h6d1v1w",
  lozengeDropdownContainer: "_ca0q1b66 _u5f31b66 _n3td1b66 _19bv1b66"
};
var textStyles = null;
var triggerLozengeStyles = null;
var triggerButtonStyles = null;
var LozengeActionTrigger = function LozengeActionTrigger(_ref) {
  var appearance = _ref.appearance,
    isOpen = _ref.isOpen,
    maxWidth = _ref.maxWidth,
    testId = _ref.testId,
    text = _ref.text,
    triggerRef = _ref.triggerRef,
    trailingMetric = _ref.trailingMetric,
    props = (0, _objectWithoutProperties2.default)(_ref, _excluded);
  var intl = (0, _reactIntl.useIntl)();
  var _useState = (0, _react.useState)(false),
    _useState2 = (0, _slicedToArray2.default)(_useState, 2),
    isPressing = _useState2[0],
    setIsPressing = _useState2[1];
  var _useState3 = (0, _react.useState)(undefined),
    _useState4 = (0, _slicedToArray2.default)(_useState3, 2),
    lozengeBackgroundColor = _useState4[0],
    setLozengeBackgroundColor = _useState4[1];
  var _useState5 = (0, _react.useState)(undefined),
    _useState6 = (0, _slicedToArray2.default)(_useState5, 2),
    lozengeForegroundColor = _useState6[0],
    setLozengeForegroundColor = _useState6[1];
  var onMouseOrKeyDown = (0, _react.useCallback)(function () {
    return setIsPressing(true);
  }, []);
  var onMouseOrKeyUp = (0, _react.useCallback)(function () {
    return setIsPressing(false);
  }, []);
  (0, _react.useEffect)(function () {
    if (isPressing) {
      setLozengeBackgroundColor("var(--ds-background-selected-pressed, #8FB8F6)");
      setLozengeForegroundColor("var(--ds-text-selected, #1868DB)");
    } else if (isOpen) {
      setLozengeBackgroundColor("var(--ds-background-selected, #E9F2FE)");
      setLozengeForegroundColor("var(--ds-text-selected, #1868DB)");
    } else {
      setLozengeBackgroundColor(undefined);
      setLozengeForegroundColor(undefined);
    }
  }, [isPressing, isOpen]);
  var lozenge = (0, _react.useMemo)(function () {
    return /*#__PURE__*/React.createElement(_compiled.Box, {
      xcss: (0, _react2.cx)(styles.lozengeContainer, (isOpen || isPressing) && styles.lozengeContainerSelected),
      as: "span"
    }, /*#__PURE__*/React.createElement(_lozenge.default, {
      appearance: appearance,
      isBold: true,
      maxWidth: maxWidth
      // eslint-disable-next-line @atlaskit/ui-styling-standard/enforce-style-prop
      ,
      style: {
        backgroundColor: lozengeBackgroundColor,
        color: lozengeForegroundColor
      }
    }, /*#__PURE__*/React.createElement("span", {
      className: (0, _runtime.ax)(["_4cvr1h6o _1e0c1txw"])
    }, /*#__PURE__*/React.createElement("span", {
      className: (0, _runtime.ax)(["_1reo15vq _18m915vq _1bto1l2s _o5721q9c"])
    }, text), /*#__PURE__*/React.createElement(_compiled.Box, {
      as: "span",
      xcss: styles.chevronDown
    }, /*#__PURE__*/React.createElement(_chevronDown.default, {
      color: "currentColor",
      label: "options",
      size: "small",
      "aria-hidden": true
    })))));
  }, [appearance, isPressing, text, isOpen, lozengeBackgroundColor, lozengeForegroundColor, maxWidth]);
  return (0, _platformFeatureFlags.fg)('platform-dst-lozenge-tag-badge-visual-uplifts') ? /*#__PURE__*/React.createElement(_compiled.Box, {
    xcss: styles.lozengeDropdownContainer
  }, /*#__PURE__*/React.createElement(_lozenge.LozengeDropdownTrigger, (0, _extends2.default)({}, props, {
    appearance: appearance,
    trailingMetric: trailingMetric,
    "data-action-open": isOpen,
    "data-testid": "".concat(testId, "--trigger"),
    maxWidth: maxWidth,
    testId: testId,
    ref: triggerRef,
    "aria-label":
    // The `as unknown` type cast is needed for react-intl v7 upgrade
    intl.formatMessage(_messages.messages.change_status, {
      status: text
    })
  }), text)) : /*#__PURE__*/React.createElement("button", (0, _extends2.default)({
    type: "button"
  }, props, {
    "data-action-open": isOpen,
    "data-testid": "".concat(testId, "--trigger"),
    style: {
      maxWidth: maxWidth
    },
    onMouseDown: onMouseOrKeyDown,
    onMouseUp: onMouseOrKeyUp,
    onKeyDown: onMouseOrKeyDown,
    onKeyUp: onMouseOrKeyUp,
    ref: triggerRef,
    "aria-label":
    // The `as unknown` type cast is needed for react-intl v7 upgrade
    intl.formatMessage(_messages.messages.change_status, {
      status: text
    }),
    className: (0, _runtime.ax)(["_kkk2n7od _ca0qidpf _u5f3idpf _n3tdidpf _19bvidpf _15vhn7od _1dqonqa1 _189e1dm9 _1h6d1j28 _bfhk1j28 _syazn7od _80omtlke _ect4n7od _1wybn7od _zg8ln7od _k48pn7od _vwz4idpf _1p1dn7od _19pkv77o _2hwxv77o _otyrv77o _18u0v77o _mizu1r31 _1guj1r31 _p8tl1r31 _ra3xglyw _pbhaglyw _1q2vglyw _128m1o36 _11ow1o36 _j8b81o36 _1bas1qi0 _19h61qi0 _1d391qi0 _1ejj1y54 _1u6l1y54 _6ssh1y54"])
  }), lozenge);
};
var _default = exports.default = LozengeActionTrigger;