import i18n from "@/i18n/config";
import { PanelConfig } from "@/page/App/components/InspectPanel/interface";
import { VALIDATION_TYPES } from "@/utils/validationFactory";
import { SLIDER_EVENT_HANDLER_CONFIG} from "./eventHandlerConfig";
import { generatorEventHandlerConfig } from "../PublicSector/utils/generatorEventHandlerConfig";

const baseWidgetName = "slider";

// cardWidth = 150,
// bank_name = "BANK NAME",
// card_no,
// cardholder_name = "cardholder_name",
// expiry_date = "00/00",
export const SLIDER_PANEL_CONFIG: PanelConfig[] = [
  {
    id: `${baseWidgetName}-basic`,
    groupName: i18n.t("editor.inspect.setter_group.basic"),
    children: [
      {
        id: `${baseWidgetName}-card-sliderDara`,
        labelName: "Slidar Data",
        attrName: "sliderData",
        setterType: "INPUT_SETTER",
        expectedType: VALIDATION_TYPES.ARRAY,
      },
    ],
  },
    {
      id: `${baseWidgetName}-interaction`,
      groupName: "INTERACTION",
      children: [
        {
          ...generatorEventHandlerConfig(
            baseWidgetName,
            SLIDER_EVENT_HANDLER_CONFIG.events
          ),
        },
      ],
    },
  {
    id: `${baseWidgetName}-style`,
    groupName: i18n.t("editor.inspect.setter_group.style"),
    children: [
      {
        id: `${baseWidgetName}-validation-classesCondition`,
        labelName: "Style Class Condition",
        labelDesc: i18n.t("editor.inspect.setter_tooltip.form_data_key"),
        setterType: "INPUT_SETTER",
        expectedType: VALIDATION_TYPES.BOOLEAN,
        defaultValue: true,
        attrName: "isClassTrue",
      },
      {
        id: `${baseWidgetName}-style-classes`,
        labelName: "Select True CSS Classes  :",
        isSetterSingleRow: true,
        attrName: "trueClasses",
        setterType: "BASE_MULTI_SELECT_SETTER",
        expectedType: VALIDATION_TYPES.ARRAY,
      },
      {
        id: `${baseWidgetName}-style-classes`,
        labelName: "Select false CSS Classes  :",
        isSetterSingleRow: true,
        attrName: "falseClasses",
        setterType: "BASE_MULTI_SELECT_SETTER",
        expectedType: VALIDATION_TYPES.ARRAY,
      },
    ],
  },
];
