// AUTO-GENERATED by scripts/generate-wrappers.mjs — do not edit by hand.
// Source: packages/core/manifest.json (component "kanban").
import type { ElementType, ReactNode } from 'react';
import { Kanban as KanbanController, type KanbanOptions } from '@42/core/kanban';
import { C42 } from '../C42';

const DEFAULT_HTML: string | null = "<div data-c42-kanban-column data-value=\"todo\" data-label=\"To do\">\n    <div data-c42-kanban-list>\n      <div data-c42-kanban-item data-value=\"t1\">First task</div>\n    </div>\n  </div>\n  <div data-c42-kanban-column data-value=\"doing\" data-label=\"In progress\">\n    <div data-c42-kanban-list></div>\n  </div>";

export interface KanbanProps extends Partial<KanbanOptions> {
  /** Element/tag rendered as the controller root. Defaults to `"div"`. */
  as?: ElementType;
  className?: string;
  children?: ReactNode;
  /** Fired on `kanban:move` — detail: `{ item, from, to, fromIndex, toIndex, order }` */
  onMove?: (detail: unknown, event: CustomEvent) => void;
  /** Extra props are forwarded to the rendered `<div>` element. */
  [key: string]: unknown;
}

export function Kanban(props: KanbanProps) {
  const { as, className, children, onMove, drag, keyboard, ...rest } = props;
  const options = { drag, keyboard } as KanbanOptions;

  return (
    <C42
      controller={KanbanController}
      options={options}
      deps={[drag, keyboard]}
      events={{
        'kanban:move': onMove,
      }}
      as={(as as ElementType) ?? 'div'}
      className={className as string | undefined}
      html={DEFAULT_HTML ?? undefined}
      {...{ 'data-c42-kanban': '' }}
      {...rest}
    >
      {children as ReactNode}
    </C42>
  );
}