Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Jump to bottom

fix: types of asComponent #1787

Merged
merged 4 commits into from Apr 21, 2020
Merged

fix: types of asComponent #1787

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
4 commits
Select commit Hold shift + click to select a range
5a60fc7
fix: types of asComponent
filipdanisko Apr 16, 2020
6af5886
chore: updating types
filipdanisko Apr 17, 2020
ca2d2d5
Merge branch 'master' into fix/types-ascomponent
vepor Apr 17, 2020
6e6e884
Merge branch 'master' into fix/types-ascomponent
vepor Apr 21, 2020
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Jump to
Jump to file
Failed to load files.
Diff view
Diff view
2 changes: 1 addition & 1 deletion src/Button/README.md
View file
Open in desktop
Expand Up @@ -20,7 +20,7 @@ Table below contains all types of the props available in Button component.
| :----------- | :------------------------- | :---------- | :---------------------------------------------------------------------------------------------------------------------------------------------- |
| ariaControls | `string` | | Id of the element the button controls. |
| ariaExpanded | `boolean` | | Tells screen reader the controlled element from `ariaControls` is expanded |
| asComponent | `() => React.Element` | `"button"` | The component used for the root node. |
| asComponent | `string \| React.Element` | `"button"` | The component used for the root node. |
| fullWidth | `boolean` | `false` | If `true`, the Button will grow up to the full width of its container. |
| bordered | `boolean` | `false` | If `true`, the Button will have a lighter version, with border and light background. |
| circled | `boolean` | `false` | If `true`, the Button will have circular shape. |
Expand Down
52 changes: 26 additions & 26 deletions src/ButtonLink/README.md
View file
Open in desktop
Expand Up @@ -16,32 +16,32 @@ After adding import into your project you can use it simply like:

Table below contains all types of the props available in ButtonLink component.

| Name | Type | Default | Description |
| :----------- | :------------------------- | :---------- | :---------------------------------------------------------------------------------------------------------------------------------------------- |
| ariaControls | `string` | | Id of the element the button controls. |
| ariaExpanded | `boolean` | | Tells screen reader the controlled element from `ariaControls` is expanded |
| asComponent | `() => React.Element` | `"button"` | The component used for the root node. |
| circled | `boolean` | `false` | If `true`, the ButtonLink will have circular shape. |
| children | `React.Node` | | The content of the ButtonLink. [See Functional specs](#functional-specs) |
| disabled | `boolean` | `false` | If `true`, the ButtonLink will be disabled. |
| dataTest | `string` | | Optional prop for testing purposes. |
| external | `boolean` | `false` | If `true`, the ButtonLink opens link in a new tab. [See Functional specs](#functional-specs) |
| fullWidth | `boolean` | `false` | If `true`, the ButtonLink will grow up to the full width of its container. |
| href | `string` | | The URL of link to open when ButtonLink is clicked. [See Functional specs](#functional-specs) |
| icon | `React.Node` | | The displayed icon on the left (will be removed in the future, use iconLeft instead). |
| iconLeft | `React.Node` | | The displayed icon on the left. |
| iconRight | `React.Node` | | The displayed icon on the right. |
| onClick | `event => void \| Promise` | | Function for handling onClick event. |
| ref | `func` | | Prop for forwarded ref of the Button. |
| role | `string` | | Specifies the role of an element. |
| **size** | [`enum`](#enum) | `"normal"` | The size of the ButtonLink. |
| spaceAfter | `enum` | | Additional `margin-bottom` after component. [See this docs](https://github.com/kiwicom/orbit-components/tree/master/src/common/getSpacingToken) |
| submit | `boolean` | `false` | If `true`, the Button will have `type="submit"` attribute, otherwise `type="button"`. |
| tabIndex | `string` | | Specifies the tab order of an element. |
| transparent | `boolean` | `false` | If `true`, the ButtonLink will not have `:hover` and `:active` state. |
| title | `string` | | Adds `aria-label`. |
| **type** | [`enum`](#enum) | `"primary"` | The type of ButtonLink. |
| width | `number` | `0` | The width of the ButtonLink. Number is defined in `px`. |
| Name | Type | Default | Description |
| :----------- | :----------------------------- | :---------- | :---------------------------------------------------------------------------------------------------------------------------------------------- |
| ariaControls | `string` | | Id of the element the button controls. |
| ariaExpanded | `boolean` | | Tells screen reader the controlled element from `ariaControls` is expanded |
| asComponent | `string | () => React.Element` | `"button"` | The component used for the root node. |
| circled | `boolean` | `false` | If `true`, the ButtonLink will have circular shape. |
| children | `React.Node` | | The content of the ButtonLink. [See Functional specs](#functional-specs) |
| disabled | `boolean` | `false` | If `true`, the ButtonLink will be disabled. |
| dataTest | `string` | | Optional prop for testing purposes. |
| external | `boolean` | `false` | If `true`, the ButtonLink opens link in a new tab. [See Functional specs](#functional-specs) |
| fullWidth | `boolean` | `false` | If `true`, the ButtonLink will grow up to the full width of its container. |
| href | `string` | | The URL of link to open when ButtonLink is clicked. [See Functional specs](#functional-specs) |
| icon | `React.Node` | | The displayed icon on the left (will be removed in the future, use iconLeft instead). |
| iconLeft | `React.Node` | | The displayed icon on the left. |
| iconRight | `React.Node` | | The displayed icon on the right. |
| onClick | `event => void \| Promise` | | Function for handling onClick event. |
| ref | `func` | | Prop for forwarded ref of the Button. |
| role | `string` | | Specifies the role of an element. |
| **size** | [`enum`](#enum) | `"normal"` | The size of the ButtonLink. |
| spaceAfter | `enum` | | Additional `margin-bottom` after component. [See this docs](https://github.com/kiwicom/orbit-components/tree/master/src/common/getSpacingToken) |
| submit | `boolean` | `false` | If `true`, the Button will have `type="submit"` attribute, otherwise `type="button"`. |
| tabIndex | `string` | | Specifies the tab order of an element. |
| transparent | `boolean` | `false` | If `true`, the ButtonLink will not have `:hover` and `:active` state. |
| title | `string` | | Adds `aria-label`. |
| **type** | [`enum`](#enum) | `"primary"` | The type of ButtonLink. |
| width | `number` | `0` | The width of the ButtonLink. Number is defined in `px`. |

### enum

Expand Down
30 changes: 15 additions & 15 deletions src/TextLink/README.md
View file
Open in desktop
Expand Up @@ -16,21 +16,21 @@ After adding import into your project you can use it simply like:

Table below contains all types of the props available in TextLink component.

| Name | Type | Default | Description |
| :-------------- | :------------------------- | :---------- | :----------------------------------------------------------------------------------------------------------------- |
| asComponent | `string \| React.Node` | `"a"` | The component used for the root node. Either a string to use a DOM element or a component. |
| children | `React.Node` | | The content of the TextLink. |
| dataTest | `string` | | Optional prop for testing purposes. |
| external | `boolean` | `false` | If `true`, the TextLink opens link in a new tab. |
| href | `string` | | The URL to link when the TextLink is clicked. |
| icon | `React.Node` | | The displayed icon. |
| onClick | `event => void \| Promise` | | Function for handling onClick event. |
| rel | `string` | | The rel of the TextLink. [See Functional specs](#functional-specs) |
| size | [`enum`](#enum) | | The size of the TextLink. [See Functional specs](#functional-specs) |
| stopPropagation | `boolean` | | If `true` the click event on children won't bubble. Useful when you use TextLink inside another clickable element. |
| tabIndex | `string` | | Specifies the tab order of an element |
| title | `string` | | HTML attribute Title, used forclarification of a link, for screen readers. |
| **type** | [`enum`](#enum) | `"primary"` | The color type of the TextLink. |
| Name | Type | Default | Description |
| :-------------- | :----------------------------- | :---------- | :----------------------------------------------------------------------------------------------------------------- |
| asComponent | `string | () => React.Element` | `"a"` | The component used for the root node. Either a string to use a DOM element or a component. |
| children | `React.Node` | | The content of the TextLink. |
| dataTest | `string` | | Optional prop for testing purposes. |
| external | `boolean` | `false` | If `true`, the TextLink opens link in a new tab. |
| href | `string` | | The URL to link when the TextLink is clicked. |
| icon | `React.Node` | | The displayed icon. |
| onClick | `event => void \| Promise` | | Function for handling onClick event. |
| rel | `string` | | The rel of the TextLink. [See Functional specs](#functional-specs) |
| size | [`enum`](#enum) | | The size of the TextLink. [See Functional specs](#functional-specs) |
| stopPropagation | `boolean` | | If `true` the click event on children won't bubble. Useful when you use TextLink inside another clickable element. |
| tabIndex | `string` | | Specifies the tab order of an element |
| title | `string` | | HTML attribute Title, used forclarification of a link, for screen readers. |
| **type** | [`enum`](#enum) | `"primary"` | The color type of the TextLink. |

### enum

Expand Down
2 changes: 1 addition & 1 deletion src/common/common.js.flow
View file
Open in desktop
Expand Up @@ -19,4 +19,4 @@ export type Translation = React$Element<React$ComponentType<any>> | string;

export type TranslationString = string;

export type Component = () => React$Element<any>;
export type Component = string | (() => React$Element<any>);