import { ReactNode, Ref } from "react";

import "./TabbarItem.css";
import { getCN, randomId, getClassName } from "../utils";
import ButtonTouch from "../ButtonTouch/ButtonTouch";

function TabbarItem({ children, text, selected, ...props }: { [x: string]: any }) {
  return (
    <ButtonTouch stretched {...props} data-selected={selected} componentName="MYUI-TabbarItem">
      <div className="MYUI-TabbarItem__children">{children}</div>
      {text && <div className="MYUI-TabbarItem__text">{text}</div>}
    </ButtonTouch>
  );
}

export default TabbarItem;