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

Grafana Components Library

'use strict';

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

var jsxRuntime = require('react/jsx-runtime');
var css = require('@emotion/css');
var i18n = require('@grafana/i18n');
var ThemeContext = require('../../themes/ThemeContext.cjs');
var Button = require('../Button/Button.cjs');
var Field = require('../Forms/Field.cjs');
var FieldSet = require('../Forms/FieldSet.cjs');
var Input = require('../Input/Input.cjs');
var Modal = require('../Modal/Modal.cjs');

"use strict";
function VariablesInputModal({ action, onDismiss, onShowConfirm, variables, setVariables }) {
  const styles = ThemeContext.useStyles2(getStyles);
  const onModalContinue = () => {
    onDismiss();
    onShowConfirm();
  };
  return /* @__PURE__ */ jsxRuntime.jsxs(
    Modal.Modal,
    {
      isOpen: true,
      title: i18n.t("grafana-ui.action-editor.button.action-variables-title", "Action variables"),
      onDismiss,
      className: styles.variablesModal,
      children: [
        /* @__PURE__ */ jsxRuntime.jsx(FieldSet.FieldSet, { children: action.variables.map((variable) => {
          var _a;
          return /* @__PURE__ */ jsxRuntime.jsx(Field.Field, { label: variable.name, children: /* @__PURE__ */ jsxRuntime.jsx(
            Input.Input,
            {
              type: "text",
              value: (_a = variables[variable.key]) != null ? _a : "",
              onChange: (e) => {
                setVariables({ ...variables, [variable.key]: e.currentTarget.value });
              },
              placeholder: i18n.t("grafana-ui.action-editor.button.variable-value-placeholder", "Value"),
              width: 20
            }
          ) }, variable.name);
        }) }),
        /* @__PURE__ */ jsxRuntime.jsxs(Modal.Modal.ButtonRow, { children: [
          /* @__PURE__ */ jsxRuntime.jsx(Button.Button, { variant: "secondary", onClick: onDismiss, children: i18n.t("grafana-ui.action-editor.close", "Close") }),
          /* @__PURE__ */ jsxRuntime.jsx(Button.Button, { variant: "primary", onClick: onModalContinue, children: i18n.t("grafana-ui.action-editor.continue", "Continue") })
        ] })
      ]
    }
  );
}
const getStyles = () => {
  return {
    variablesModal: css.css({
      zIndex: 1e4
    })
  };
};

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