// @ts-nocheck

import { COLOR_LIGHT, COLOR_PRIMARY, COLOR_DARK } from './Const';
import CreateColumnPanel from './CreateColumnPanel';
import AddDragDropColumnPanelBehavior from './AddDragDropColumnPanelBehavior';

import { TreeNode } from 'src/types/stores/kanvaso';

type Scene = {
  rexUI: {

    add: {
      sizer: (config: SizerConfig) => Sizer;
    };
  };

};

type SizerConfig = {
  orientation: string;
  space: {

    left: number;
    right: number;
    top: number;
    bottom: number;

  };
};

type Sizer = {
  add: (item: any, config: any) => void;
};

const CreateColumnPanelsBox = (
  scene: Scene,
  item: TreeNode,
  registry,
): Sizer => {

  const config: SizerConfig = {

    orientation: 'x',
    space: {
      left: 10,
      right: 10,
      top: 10,
      bottom: 10,
    },

  };

  const columnPanelsBox: Sizer = scene.rexUI.add.sizer(config);
  // .addBackground(
  //     scene.rexUI.add.roundRectangle({
  //         strokeColor: COLOR_PRIMARY,
  //         strokeWidth: 3,
  //     }),
  //     'background'
  // )

  item.childrens.forEach((child) => {

    const columnPanel = CreateColumnPanel(scene, child, registry);

    columnPanelsBox.add(columnPanel, { proportion: 0, expand: true });

  });

  AddDragDropColumnPanelBehavior(columnPanelsBox); // Убедитесь, что функция AddDragDropColumnPanelBehavior определена где-то в вашем коде

  return columnPanelsBox;

};

export default CreateColumnPanelsBox;