Skip to content

Commit fa75902

Browse files
author
Chris Hart
committed
feat(ui-link): add ui-link package
Test plan: - Ensure Link README examples render and that the component is tagged as Experimental. - Ensure ui-link shows under Packages in the navigation and that the package is tagged as Experimental. - Ensure DeprecatedLink README examples render. DeprecatedLink should not show a deprecation console warning at this time. - Ensure the components render that are now using the new ui-link version of Link (Breadcrumb.Link, ui-docs-client - Iconography). Change-Id: I6049c363aedefd2278b95a92b94073c81d37c90d Reviewed-on: https://gerrit.instructure.com/208637 Tested-by: Jenkins Reviewed-by: Steve Jensen <sejensen@instructure.com> Product-Review: Steve Jensen <sejensen@instructure.com> QA-Review: Daniel Sasaki <dsasaki@instructure.com> Visual-Regression-Test: Chris Hart <chart@instructure.com>
1 parent 60e0c2f commit fa75902

File tree

28 files changed

+1197
-25
lines changed

28 files changed

+1197
-25
lines changed

‎packages/__docs__/components.js

Lines changed: 2 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -53,8 +53,8 @@ export {
5353
Badge,
5454
Heading,
5555
Img as DeprecatedImg,
56-
Link,
5756
Pill as DeprecatedPill,
57+
Link as DeprecatedLink,
5858
Progress,
5959
Rating,
6060
Spinner,
@@ -133,5 +133,6 @@ export { Expandable, ToggleDetails, ToggleGroup } from '@instructure/ui-toggle-d
133133
export { TreeBrowser } from '@instructure/ui-tree-browser'
134134
export { Flex } from '@instructure/ui-flex'
135135
export { FileDrop } from '@instructure/ui-file-drop'
136+
export { Link } from '@instructure/ui-link'
136137
export * from '@instructure/ui-icons'
137138
export { Guidelines, Figure } from '@instructure/ui-docs-client'

‎packages/__docs__/resolve.js

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -47,6 +47,7 @@ module.exports = {
4747
'@instructure/ui-i18n$': path.resolve(__dirname, '../ui-i18n/src/'),
4848
'@instructure/ui-img$': path.resolve(__dirname, '../ui-img/src/'),
4949
'@instructure/ui-layout$': path.resolve(__dirname, '../ui-layout/src/'),
50+
'@instructure/ui-link$': path.resolve(__dirname, '../ui-link/src'),
5051
'@instructure/ui-menu$': path.resolve(__dirname, '../ui-menu/src/'),
5152
'@instructure/ui-motion$': path.resolve(__dirname, '../ui-motion/src/'),
5253
'@instructure/ui-navigation$': path.resolve(__dirname, '../ui-navigation/src/'),

‎packages/instui-config/codemod-configs/v7/imports.config.json

Lines changed: 4 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -58,5 +58,9 @@
5858
{
5959
"pattern": "^@instructure/ui-forms/lib/FileDrop",
6060
"replace": "@instructure/ui-file-drop/lib/FileDrop"
61+
},
62+
{
63+
"pattern": "^@instructure/ui-elements/lib/Link",
64+
"replace": "@instructure/ui-link/lib/Link"
6165
}
6266
]

‎packages/instui-config/codemod-configs/v7/propNames.config.json

Lines changed: 66 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -11,6 +11,53 @@
1111
{ "old": false, "new": "block" }
1212
]},
1313
{ "old": "variant", "new": "shape" }
14+
},
15+
"DateInput": {
16+
"7.0.0": [
17+
{ "old": "label", "new": "renderLabel" }
18+
]
19+
},
20+
"Flex": {
21+
"7.0.0": [
22+
{ "old": "inline", "new": "display", "values": [
23+
{ "old": true, "new": "inline-flex" },
24+
{ "old": false, "new": "flex" }
25+
]},
26+
{ "old": "wrapItems", "new": "wrap", "values": [
27+
{ "old": true, "new": "wrap" },
28+
{ "old": false, "new": "no-wrap" }
29+
]},
30+
{ "old": "visualDebug", "new": "withVisualDebug" }
31+
]
32+
},
33+
"Flex.Item": {
34+
"7.0.0": [
35+
{ "old": "grow", "new": "shouldGrow" },
36+
{ "old": "shrink", "new": "shouldShrink" },
37+
{ "old": "visualDebug", "new": "withVisualDebug" }
38+
]
39+
},
40+
"Img": {
41+
"7.0.0": [
42+
{ "old": "grayscale", "new": "withGrayscale" },
43+
{ "old": "blur", "new": "withBlur" },
44+
{ "old": "inline", "new": "display", "values": [
45+
{ "old": true, "new": "inline-block" },
46+
{ "old": false, "new": "block" }
47+
]}
48+
]
49+
},
50+
"Link": {
51+
"7.0.0": [
52+
{ "old": "disabled", "new": "interaction", "values": [
53+
{ "old": true, "new": "disabled" },
54+
{ "old": false, "new": "enabled" }
55+
]},
56+
{ "old": "variant", "new": "color", "values": [
57+
{ "old": "default", "new": "link" },
58+
{ "old": "inverse", "new": "link-inverse" }
59+
]},
60+
{ "old": "linkRef", "new": "elementRef" }
1461
]
1562
},
1663
"NumberInput": {
@@ -31,16 +78,33 @@
3178
]}
3279
]
3380
},
81+
"Popover": {
82+
"7.0.0": [
83+
{ "old": "show", "new": "isShowingContent" },
84+
{ "old": "label", "new": "screenReaderLabel" },
85+
{ "old": "alignArrow", "new": "shouldAlignArrow" },
86+
{ "old": "trackPosition", "new": "shouldTrackPosition" },
87+
{ "old": "defaultShow", "new": "defaultIsShowingContent" },
88+
{ "old": "onShow", "new": "onRequestShowContent" },
89+
{ "old": "onDismiss", "new": "onRequestHideContent" },
90+
{ "old": "variant", "new": "color", "values": [
91+
{ "old": "default", "new": "primary" },
92+
{ "old": "inverse", "new": "primary-inverse" }
93+
]},
94+
]
95+
},
3496
"Tabs": {
3597
"7.0.0": [
3698
{ "old": "title", "new": "renderTitle" },
3799
{ "old": "onChange", "new": "onRequestTabChange" },
38100
{ "old": "focus", "new": "shouldFocusOnRender" }
39101
]
40102
},
41-
"DateInput": {
103+
"Text": {
42104
"7.0.0": [
43-
{ "old": "label", "new": "renderLabel" }
105+
{ "old": "color", "new": "color", "values": [
106+
{ "old": "error", "new": "danger" }
107+
]}
44108
]
45109
},
46110
"TextInput": {

‎packages/ui-breadcrumb/package.json

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -30,6 +30,7 @@
3030
"@instructure/ui-a11y": "^6.13.0",
3131
"@instructure/ui-elements": "^6.13.0",
3232
"@instructure/ui-icons": "^6.13.0",
33+
"@instructure/ui-link": "^6.13.0",
3334
"@instructure/ui-prop-types": "^6.13.0",
3435
"@instructure/ui-react-utils": "^6.13.0",
3536
"@instructure/ui-testable": "^6.13.0",

‎packages/ui-breadcrumb/src/Breadcrumb/BreadcrumbLink/index.js

Lines changed: 3 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -25,7 +25,8 @@
2525
import React, { Component } from 'react'
2626
import PropTypes from 'prop-types'
2727

28-
import { Link, TruncateText } from '@instructure/ui-elements'
28+
import { TruncateText } from '@instructure/ui-elements'
29+
import { Link } from '@instructure/ui-link'
2930
import { omitProps } from '@instructure/ui-react-utils'
3031
import { testable } from '@instructure/ui-testable'
3132

@@ -91,6 +92,7 @@ class BreadcrumbLink extends Component {
9192
icon={icon}
9293
iconPlacement={iconPlacement}
9394
onClick={onClick}
95+
__dangerouslyIgnoreExperimentalWarnings
9496
>
9597
<TruncateText>{children}</TruncateText>
9698
</Link>

‎packages/ui-docs-client/package.json

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -39,6 +39,7 @@
3939
"@instructure/ui-icons": "^6.13.0",
4040
"@instructure/ui-img": "^6.13.0",
4141
"@instructure/ui-layout": "^6.13.0",
42+
"@instructure/ui-link": "^6.13.0",
4243
"@instructure/ui-overlays": "^6.13.0",
4344
"@instructure/ui-tooltip": "^6.13.0",
4445
"@instructure/ui-pill": "^6.13.0",

‎packages/ui-docs-client/src/Document/index.js

Lines changed: 3 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -25,7 +25,8 @@
2525
import React, { Component } from 'react'
2626
import PropTypes from 'prop-types'
2727

28-
import { Link , Heading } from '@instructure/ui-elements'
28+
import { Heading } from '@instructure/ui-elements'
29+
import { Link } from '@instructure/ui-link'
2930
import { View } from '@instructure/ui-view'
3031
import { Tabs } from '@instructure/ui-tabs'
3132
import { CodeEditor } from '@instructure/ui-code-editor'
@@ -113,7 +114,7 @@ class Document extends Component {
113114

114115
return (
115116
<View as="div" margin="0 0 x-large 0" __dangerouslyIgnoreExperimentalWarnings>
116-
<Link href={srcUrl}>
117+
<Link href={srcUrl} __dangerouslyIgnoreExperimentalWarnings>
117118
{srcPath}
118119
</Link>
119120
</View>

‎packages/ui-docs-client/src/Icons/index.js

Lines changed: 5 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -26,7 +26,8 @@ import React, { Component } from 'react'
2626
import PropTypes from 'prop-types'
2727

2828
import { CloseButton } from '@instructure/ui-buttons'
29-
import { Heading, Link } from '@instructure/ui-elements'
29+
import { Heading } from '@instructure/ui-elements'
30+
import { Link } from '@instructure/ui-link'
3031
import { TextInput } from '@instructure/ui-text-input'
3132
import { Select, Checkbox } from '@instructure/ui-forms'
3233
import { FormFieldGroup } from '@instructure/ui-form-field'
@@ -222,7 +223,9 @@ class MyIcon extends React.Component {
222223
language="javascript"
223224
readOnly
224225
/>
225-
{ glyph.displayName && <p>See the <Link href="#SVGIcon">SVGIcon</Link> component for props and examples.</p> }
226+
{ glyph.displayName &&
227+
<p>See the <Link href="#SVGIcon" __dangerouslyIgnoreExperimentalWarnings>SVGIcon</Link> component for props and examples.</p>
228+
}
226229
</div>
227230
)
228231
}

‎packages/ui-docs-client/src/compileMarkdown.js

Lines changed: 3 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -27,8 +27,9 @@ import marked from 'marked'
2727
import grayMatter from 'gray-matter'
2828

2929
import { View } from '@instructure/ui-view'
30-
import { Heading, Link, Table } from '@instructure/ui-elements'
30+
import { Heading, Table } from '@instructure/ui-elements'
3131
import { Img } from '@instructure/ui-img'
32+
import { Link } from '@instructure/ui-link'
3233
import { CodeEditor } from '@instructure/ui-code-editor'
3334

3435
import { Playground } from './Playground'
@@ -46,7 +47,7 @@ const elements = {
4647
table: ({ children }) => <Table>{children}</Table>,
4748
a: ({ href, title, target, name, children }) => {
4849
if (href) {
49-
return <Link href={href} title={title} target={target}>{children}</Link>
50+
return <Link href={href} title={title} target={target} __dangerouslyIgnoreExperimentalWarnings>{children}</Link>
5051
} else {
5152
return <a name={name}>{children}</a> // eslint-disable-line jsx-a11y/anchor-is-valid
5253
}

0 commit comments

Comments
 (0)