import PropTypes from "prop-types";
import InternalIcon from './InternalIcon.constantProps';
import customClassProps, {customClassPropName} from "../../propTypes/customClassName.propTypes";
import automationProps, {automationPropsName} from "../../propTypes/automation.propTypes";
import tagAttributeProps,{tagAttributePropsName} from "../../propTypes/htmlAttributes.propTypes"
import defaultCustomIds from "./InternalIcon.customIds";

export default {
    name : PropTypes.string,
    size : PropTypes.oneOf([
        InternalIcon.size.small,
        InternalIcon.size.medium,
        InternalIcon.size.large,
        InternalIcon.size.xLarge
      ]),
    title : PropTypes.string,
    ariaLabel : PropTypes.string,
    disabled : PropTypes.bool,
    cursor : PropTypes.oneOf([
        InternalIcon.cursor.default,
        InternalIcon.cursor.pointer,
        InternalIcon.cursor.move,
        InternalIcon.cursor.notAllowed
      ]),
    color : PropTypes.oneOf([
        InternalIcon.color.white,
        InternalIcon.color.black
      ]),
    onClick : PropTypes.func, 
    tabIndex : PropTypes.oneOfType([PropTypes.string,PropTypes.number]),
    ...customClassProps,
    ...automationProps,
    ...tagAttributeProps
}

export const defaultProps = {
    size : InternalIcon.size.medium,
    disabled : false,
    [customClassPropName]: {},
    [automationPropsName]: defaultCustomIds,
    tagAttributeProps : {},
    [tagAttributePropsName] : {}
}

export const propsDescription={
    name : "This defines the name that is show the icon",
    size : "This defines the size of interal icon",
    disabled: "This defines the disabled state",
    cursor:"That indicates the position on a display screen where the next character entered from the keyboard will appear, or where user action is possible",
    color:"There will be black & white color need use the color props.",
    title:"To show the title content when hover the Icon component",
    onClick: "This defines the onClick action",
    tabIndex : "The tabindex attribute specifies the tab order of an element",
    customClassName : "the CustomClassName defines the classnames that can be directly given to the component",
    ariaLabel:"This defines the label of the element",
}

