import _extends from "@babel/runtime/helpers/extends";
import _Select from "@alifd/next/es/select";
import React, { useEffect, useState } from "react";
import BoxSlotComponent from "../../_components/boxSlotComponent";
import { t } from "../../../../src/locale";
import { SchemaService } from "../../../_utils/schemaService";
import RenderByFormKey from "../../_components/renderByFormKey";
import { handleStringToRequest } from "../config/utils";
import { handleRenderByFormKeyData } from "../../../_utils/utils";
import { getRelationList } from "../../../_utils/formKeyType";
import { OperationType } from "../type";
export var CarouselComponent = function CarouselComponent(props) {
  var type = props.type,
    value = props.value,
    onChange = props.onChange;
  var _useState = useState((value === null || value === void 0 ? void 0 : value.componentKey) || ""),
    componentKey = _useState[0],
    setComponentKey = _useState[1];
  var _useState2 = useState(handleStringToRequest(value === null || value === void 0 ? void 0 : value.responseParams)),
    responseParams = _useState2[0],
    setResponseParams = _useState2[1];
  var _useState3 = useState([]),
    carouselDataSource = _useState3[0],
    setCarouselDataSource = _useState3[1];
  var _useState4 = useState([]),
    telegramRelationOption = _useState4[0],
    setTelegramRelationOption = _useState4[1];
  useEffect(function () {
    var schemaService = new SchemaService();
    var gList = schemaService.getCarouselListData();
    setCarouselDataSource(gList);
    setTelegramRelationOption(getRelationList());
  }, []);
  useEffect(function () {
    onChange({
      componentKey: componentKey,
      responseParams: responseParams
    });
  }, [componentKey, responseParams]);
  return /*#__PURE__*/React.createElement("div", null, /*#__PURE__*/React.createElement(BoxSlotComponent, {
    title: t("setter.CarouselComponent")
  }, /*#__PURE__*/React.createElement(_Select, {
    placeholder: t("setter.selectPlaceHolder"),
    notFoundContent: t("setter.notFoundContent"),
    showSearch: true,
    value: componentKey,
    dataSource: carouselDataSource,
    onChange: function onChange(v) {
      setComponentKey(v);
    }
  })), type === OperationType.stop && /*#__PURE__*/React.createElement(BoxSlotComponent, {
    title: "" + t("setter.result")
  }, /*#__PURE__*/React.createElement(RenderByFormKey, {
    relationOption: telegramRelationOption,
    value: responseParams,
    onChange: function onChange(v) {
      handleRenderByFormKeyData(v, function (newItem) {
        var newData = _extends({}, responseParams, newItem);
        setResponseParams(newData);
      });
    }
  })));
};