"use client"
import { Button as ButtonRAC } from "react-aria-components"

import {
  MaterialIcon
,type 
  MaterialIconProps} from "@scandic-hotels/design-system/Icons/MaterialIcon"
import { Typography } from "@scandic-hotels/design-system/Typography"

import styles from "./button.module.css"


interface ButtonProps extends React.PropsWithChildren {
  icon: MaterialIconProps["icon"]
  isDisabled?: boolean
}

export default function Button({
  children,
  icon,
  isDisabled = false,
}: ButtonProps) {
  return (
    <ButtonRAC className={styles.button} isDisabled={isDisabled}>
      <MaterialIcon color="Icon/Interactive/Default" icon={icon} />
      <Typography variant="Body/Paragraph/mdBold">
        <span className={styles.text}>{children}</span>
      </Typography>
    </ButtonRAC>
  )
}