@grafana/ui/dist/cjs/components/Actions/ActionButton.cjs

Grafana Components Library

'use strict';

Object.defineProperty(exports, '__esModule', { value: true });

var jsxRuntime = require('react/jsx-runtime');
var React = require('react');
var i18n = require('@grafana/i18n');
var ThemeContext = require('../../themes/ThemeContext.cjs');
var Button = require('../Button/Button.cjs');
var ConfirmModal = require('../ConfirmModal/ConfirmModal.cjs');
var VariablesInputModal = require('./VariablesInputModal.cjs');

"use strict";
function ActionButton({ action, ...buttonProps }) {
  const theme = ThemeContext.useTheme2();
  const backgroundColor = action.style.backgroundColor || theme.colors.secondary.main;
  const textColor = theme.colors.getContrastText(backgroundColor);
  const [showConfirm, setShowConfirm] = React.useState(false);
  const [showVarsModal, setShowVarsModal] = React.useState(false);
  const [actionVars, setActionVars] = React.useState({});
  const actionHasVariables = action.variables && action.variables.length > 0;
  const onClick = () => {
    if (actionHasVariables) {
      setShowVarsModal(true);
    } else {
      setShowConfirm(true);
    }
  };
  return /* @__PURE__ */ jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [
    /* @__PURE__ */ jsxRuntime.jsx(
      Button.Button,
      {
        variant: "primary",
        size: "sm",
        onClick,
        ...buttonProps,
        style: { width: "fit-content", backgroundColor, color: textColor },
        children: action.title
      }
    ),
    actionHasVariables && showVarsModal && /* @__PURE__ */ jsxRuntime.jsx(
      VariablesInputModal.VariablesInputModal,
      {
        onDismiss: () => setShowVarsModal(false),
        action,
        onShowConfirm: () => setShowConfirm(true),
        variables: actionVars,
        setVariables: setActionVars
      }
    ),
    showConfirm && /* @__PURE__ */ jsxRuntime.jsx(
      ConfirmModal.ConfirmModal,
      {
        isOpen: true,
        title: i18n.t("grafana-ui.action-editor.button.confirm-action", "Confirm action"),
        body: action.confirmation(actionVars),
        confirmText: i18n.t("grafana-ui.action-editor.button.confirm", "Confirm"),
        confirmVariant: "primary",
        onConfirm: () => {
          setShowConfirm(false);
          action.onClick(new MouseEvent("click"), null, actionVars);
        },
        onDismiss: () => {
          setShowConfirm(false);
        }
      }
    )
  ] });
}

exports.ActionButton = ActionButton;
//# sourceMappingURL=ActionButton.cjs.map