import React from "react";
import { SplitButtonProps } from "./SplitButtonProps";
import { SplitButton as KendoSplitButton } from "@progress/kendo-react-buttons";

const SplitButton: React.FC<SplitButtonProps> = ({
  dataTestId,
  accessKey,
  ariaLabel,
  buttonClass,
  children,
  className,
  dir,
  disabled,
  fillMode,
  icon,
  iconClass,
  id,
  imageUrl,
  item,
  itemRender,
  items,
  opened,
  popupSettings,
  rounded,
  size,
  style,
  svgIcon,
  tabIndex,
  text,
  textField,
  themeColor,
  title,
  onBlur,
  onButtonClick,
  onClose,
  onFocus,
  onItemClick,
  onOpen,
}) => (
  <div data-test-id={dataTestId}>
    <KendoSplitButton
      accessKey={accessKey}
      ariaLabel={ariaLabel}
      buttonClass={buttonClass}
      className={className}
      dir={dir}
      disabled={disabled}
      fillMode={fillMode}
      icon={icon}
      iconClass={iconClass}
      id={id}
      imageUrl={imageUrl}
      item={item}
      itemRender={itemRender}
      items={items}
      opened={opened}
      popupSettings={popupSettings}
      rounded={rounded}
      size={size}
      style={style}
      svgIcon={svgIcon}
      tabIndex={tabIndex}
      text={text}
      textField={textField}
      themeColor={themeColor}
      title={title}
      onBlur={onBlur}
      onButtonClick={onButtonClick}
      onClose={onClose}
      onFocus={onFocus}
      onItemClick={onItemClick}
      onOpen={onOpen}
    >
      {children}
    </KendoSplitButton>
  </div>
);

export default SplitButton;