import React, { useMemo } from "react";
import Survey from "material-survey/components/Survey";
import { setIn } from "seamless-immutable";
var form = {
  questions: [{
    name: "multiple",
    title: "Allow Multiple Classifications",
    type: "boolean"
  }, {
    name: "labels",
    title: "Labels",
    description: "Classifications or tags to be labeled.",
    type: "matrixdynamic",
    columns: [{
      cellType: "text",
      name: "id",
      title: "id"
    }, {
      cellType: "text",
      name: "displayName",
      title: "Display Name"
    }, {
      cellType: "text",
      name: "description",
      title: "Description (optional)"
    }]
  }]
};
export default (function (_ref) {
  var iface = _ref.iface,
      onChange = _ref.onChange;
  var defaultAnswers = useMemo(function () {
    return {
      multiple: false,
      labels: (iface.labels || []).map(function (a) {
        return typeof a === "string" ? {
          id: a,
          displayName: a,
          description: a
        } : a;
      }) || []
    };
  }, [iface.labels]);
  return /*#__PURE__*/React.createElement(Survey, {
    noActions: true,
    variant: "flat",
    defaultAnswers: defaultAnswers,
    onQuestionChange: function onQuestionChange(questionId, newValue, answers) {
      onChange(setIn(iface, [questionId], newValue));
    },
    form: form
  });
});