/*
 * The MIT License (MIT)
 *
 * Copyright (c) 2015 - present Instructure, Inc.
 *
 * Permission is hereby granted, free of charge, to any person obtaining a copy
 * of this software and associated documentation files (the "Software"), to deal
 * in the Software without restriction, including without limitation the rights
 * to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
 * copies of the Software, and to permit persons to whom the Software is
 * furnished to do so, subject to the following conditions:
 *
 * The above copyright notice and this permission notice shall be included in all
 * copies or substantial portions of the Software.
 *
 * THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
 * IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
 * FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
 * AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
 * LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
 * OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
 * SOFTWARE.
 */

import React from 'react'
import type {
  ToProp,
  AsElementType,
  LinkTheme,
  OtherHTMLAttributes
} from '@instructure/shared-types'
import type {
  Spacing,
  WithStyleProps,
  ComponentStyle
} from '@instructure/emotion'
import type { ViewOwnProps } from '@instructure/ui-view/latest'
import { Renderable } from '@instructure/shared-types'

type LinkOwnProps = {
  /**
   * The text and/or icon displayed by the link
   */
  children: React.ReactNode

  /**
   * Sets the link's `href` attribute
   */
  href?: string

  /**
   * Designates Link's text color to accommodate light and dark backgrounds
   */
  color?: 'link' | 'link-inverse'

  /**
   * Provides a reference to the underlying HTML element
   */
  elementRef?: (element: Element | null) => void

  /**
   * The element type to render as (will default to `<a>` if href is provided)
   */
  as?: AsElementType

  /**
   * The ARIA role of the element.
   */
  role?: string

  /**
   * If the Link has an onClick handler but is not a button element,
   * force ARIA role to be "button".
   */
  forceButtonRole?: boolean

  /**
   * Determines if the link is enabled or disabled
   */
  interaction?: 'enabled' | 'disabled'

  /**
   * Valid values are `0`, `none`, `auto`, and Spacing token values,
   * see https://instructure.design/layout-spacing. Apply these values via
   * familiar CSS-like shorthand. For example, `margin="small auto large"`.
   */
  margin?: Spacing

  /**
   * Add an SVG icon to the Link. Do not add icons directly as
   * children.
   * When using Lucide icons, Link will automatically pass the appropriate size prop based on the Link's size.
   */
  renderIcon?: Renderable

  /**
   * Place the icon before or after the text in the Link.
   */
  iconPlacement?: 'start' | 'end'

  /**
   * Set the CSS display property of the Link element. 'auto' sets no display property.
   */
  display?: 'auto' | 'block' | 'inline-block' | 'flex' | 'inline-flex'

  /**
   * Fires when the Link loses focus
   */
  onBlur?: (event: React.FocusEvent<ViewOwnProps>) => void

  /**
   * Fires when the Link is clicked
   */
  onClick?: (event: React.MouseEvent<ViewOwnProps>) => void

  /**
   * Fires when the Link gains focus
   */
  onFocus?: (event: React.FocusEvent<ViewOwnProps>) => void

  /**
   * Fires when the Link is hovered
   */
  onMouseEnter?: (event: React.MouseEvent<ViewOwnProps>) => void

  /**
   * Sets pre-defined values for the component to achieve specific roles for the component
   * - `inline`
   * - `standalone`
   *
   * __Deprecated values:__
   * - `inline-small`
   * - `standalone-small`
   */
  variant?: 'inline' | 'standalone' | 'inline-small' | 'standalone-small'

  /**
   * Sets the size of the link (font size, line height, and icon gap)
   */
  size?: 'small' | 'medium' | 'large'
}

export type LinkStyleProps = {
  containsTruncateText: boolean
  hasVisibleChildren: boolean
}

type PropKeys = keyof LinkOwnProps

type AllowedPropKeys = Readonly<Array<PropKeys>>

type LinkState = {
  hasFocus: boolean
}

type LinkProps = LinkOwnProps &
  WithStyleProps<LinkTheme, LinkStyle> &
  OtherHTMLAttributes<LinkOwnProps> &
  ToProp

type LinkStyle = ComponentStyle<'link' | 'icon'>
const allowedProps: AllowedPropKeys = [
  'children',
  'href',
  'color',
  'elementRef',
  'as',
  'role',
  'forceButtonRole',
  'interaction',
  'margin',
  'renderIcon',
  'iconPlacement',
  'display',
  'onBlur',
  'onClick',
  'onFocus',
  'onMouseEnter',
  'size',
  'variant'
]

export type { LinkProps, LinkState, LinkStyle }
export { allowedProps }