DocSpace-client/web/ASC.Web.Components/src/components/link
2019-09-10 15:08:17 +03:00
..
all.link.stories.js web: components: Moved story for Link + added base test 2019-09-08 17:26:48 +03:00
index.js web: Components: Added containerWidth property for Link component as styled-component fix. 2019-09-10 15:08:17 +03:00
link.stories.js web: components: Moved story for Link + added base test 2019-09-08 17:26:48 +03:00
link.test.js web: components: Moved story for Link + added base test 2019-09-08 17:26:48 +03:00
README.md web: components: Moved story for Link + added base test 2019-09-08 17:26:48 +03:00

Link

Usage

import { Link } from 'asc-web-components';

Description

It is a link with 2 types:

  1. page - simple link which refer to other pages and parts of current page;
  2. action - link, which usually hasn`t hyperlink and do anything on click - open dropdown, filter data, etc

Usage

<Link type = "page" color = "black" href="https://github.com" isBold = {true}>Bold page link</Link>

Properties

Props Type Required Values Default Description
type oneOf - action, page page Type of link
color string - - #333333 Color of link
fontSize number - - 13 Font size of link (in px)
href string - - undefined Used as HTML href property
isBold bool - - false Set font weight
title string - - - Used as HTML title property
target oneOf - _blank, _self, _parent, _top - The target attribute specifies where the linked document will open when the link is clicked.
isTextOverflow bool - - true Activate or deactivate text-overflow CSS property with ellipsis (' … ') value
isHovered bool - - false Set hovered state and effects of link.
isSemitransparent bool - - false Set css-property 'opacity' to 0.5. Usually apply for users with "pending" status
onClick func - - - What the link will trigger when clicked. Only for 'action' type of link
rel string - - noopener noreferrer Used as HTML rel property
tabIndex number - - -1 Used as HTML tabindex property