@veecode-platform/plugin-kong-service-manager/dist/components/PluginsList/DrawerComponent/FieldsCustom/incrementalFields/IncrementalFields.esm.js

import React from 'react';
import { Box, FormLabel, TextField, IconButton, Button } from '@material-ui/core';
import AddIcon from '@material-ui/icons/Add';
import DeleteIcon from '@material-ui/icons/Delete';
import { useIncrementalFieldStyles } from './styles.esm.js';

const IncrementalFields = (props) => {
  const { name, required, items, isMetrics, setState, handleChange, id, state } = props;
  const { box, field, input, label, addField } = useIncrementalFieldStyles();
  const [inputFields, setInputFields] = React.useState(items);
  const handleChangeInput = (event, index) => {
    if (event.target.value !== "") {
      const values = [...inputFields];
      values[index] = event.target.value;
      if (isMetrics) {
        setState(values);
      } else {
        setState((prevConfigState) => {
          const updatedConfigState = {
            ...prevConfigState,
            [event.target.name]: values
          };
          return updatedConfigState;
        });
      }
      if (!!handleChange) {
        handleChange(name, state, id);
      }
      setInputFields(values);
    }
  };
  const handleAddFields = () => setInputFields([...inputFields, ""]);
  const handleRemoveFields = (index) => {
    const values = [...inputFields];
    values.splice(index, 1);
    setInputFields(values);
  };
  return /* @__PURE__ */ React.createElement(Box, { className: box }, /* @__PURE__ */ React.createElement(FormLabel, { className: label }, name), inputFields.map((inputField, index) => /* @__PURE__ */ React.createElement("div", { key: index, className: field }, /* @__PURE__ */ React.createElement(
    TextField,
    {
      name,
      label: "",
      variant: "outlined",
      value: inputField,
      onChange: (event) => handleChangeInput(event, index),
      className: input,
      required,
      key: index
    }
  ), inputFields.length >= 1 && /* @__PURE__ */ React.createElement(IconButton, { onClick: () => handleRemoveFields(index) }, /* @__PURE__ */ React.createElement(DeleteIcon, null)))), /* @__PURE__ */ React.createElement(Button, { className: addField, onClick: () => handleAddFields() }, /* @__PURE__ */ React.createElement(AddIcon, null), " ", "Add"));
};

export { IncrementalFields };
//# sourceMappingURL=IncrementalFields.esm.js.map