import type { BdcComponent, BdcElement } from '../jsx-runtime';

type LayoutProps = {
  id?: string;
  gap?: number | string;
  padding?: number | string;
  children?: BdcElement[];
};

function layoutBlock(type: string, props: LayoutProps): BdcElement {
  return { type, props: { ...props }, children: props.children ?? [] };
}

type TextFieldProps = LayoutProps & {
  placeholder?: string;
  dataRef?: string;
  submitActionId?: string;
};

export const TextField: BdcComponent = (props) => layoutBlock('text_field', props as TextFieldProps);

type SelectRowProps = LayoutProps & {
  label?: string;
  dataRef?: string;
  optionsRef?: string;
  changeActionId?: string;
  disabled?: boolean;
};

export const SelectRow: BdcComponent = (props) => layoutBlock('select_row', props as SelectRowProps);