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

export default {
  target: PropTypes.string, // ['_blank','_self','_parent','_top']
  rel: PropTypes.string, //['alternate', 'author', 'bookmark', 'canonical', 'dns-prefetch', 'external', 'help', 'icon', 'license', 'manifest', 'modulepreload', 'next', 'nofollow', 'noopener', 'noreferrer', 'opener', 'pingback', 'preconnect', 'prefetch', 'preload', 'as', 'prerender', 'prev', 'search', 'stylesheet', 'tag']
  href: PropTypes.string,

  title: PropTypes.string,
  download: PropTypes.bool,

  children: PropTypes.any,
  text: PropTypes.string,

  textEllipsis: PropTypes.bool,
  wordWrap: PropTypes.bool,
  textDecoration: PropTypes.oneOf([
    linkConstantProps.textDecoration.overLine,
    linkConstantProps.textDecoration.lineThrough,
    linkConstantProps.textDecoration.underLine,
  ]),
  color: PropTypes.oneOf([
    linkConstantProps.colors.default,
    linkConstantProps.colors.primary,
    linkConstantProps.colors.secondary
  ]),
  size: PropTypes.oneOf([
    linkConstantProps.size.xSmall,
    linkConstantProps.size.small,
    linkConstantProps.size.medium,
    linkConstantProps.size.large,
    linkConstantProps.size.xLarge,
    linkConstantProps.size.xxLarge,
  ]),

  active: PropTypes.bool,
  visited: PropTypes.bool,
  focused: PropTypes.bool,
  hovered: PropTypes.bool,
  disabled: PropTypes.bool,

  onClick: PropTypes.func,
  hasPreventDefaultBehaviour: PropTypes.bool,

  ...automationProps,
  ...linkAriaProps,
  ...customClassProps,
  ...tagAttributeProps,
};

export const defaultProps = {
  target: "_blank",
  rel: "no-referrer",
  visited: false,
  active: false,
  color: linkConstantProps.colors.primary,
  size: linkConstantProps.size.medium,
  hasPreventDefaultBehaviour: true,
  [automationPropsName]: defaultCustomIds,
  [customClassPropName]: {},
  [tagAttributePropsName]: {},
};

export const propsDescription = {
  target: "Specifies where to open the linked document",
  rel: "To used specifies the relationship between the current document and the linked document. Only used if the href attribute is present.",
  href: "Specifies the URL of the page the link goes to",
  title: "To show the title content when hover the anchor tag",
  download: "download the content from the link href",
  underline: "To apply the style as underline format for the element",

  children:
    "Support the react component as children to render inside of anchor tag",
  text: "To render the content",

  textEllipsis:
    "To used triple dotted format content as visible if content is very length",
  wordWrap:
    "To used nexted line wrapping format content as visible if content is very length",
  textDecoration:
    "To apply the style as underline / lineThrough / overLine format for the element",
  color: "To apply the some styles from the component",

  active: "To apply the highlight style if this element is active",
  visited: "To apply the highlight style if this element once visited",
  focused: "To apply the highlight style if this element once focused",
  hovered: "To apply the highlight style if this element once hovered",
  disabled: "To apply the highlight style if this element once disabled",

  onClick: "Supported the click element for anchor tag",
  hasPreventDefaultBehaviour:
    "Used to prevent the default behaviour from the anchor tag",
};
