@sproutsocial/racine 7.4.0-beta-xyz.0 → 7.4.0-beta-link-update.0
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/CHANGELOG.md +6 -0
- package/README.md +9 -44
- package/__flow__/Link/index.js +3 -0
- package/__flow__/Link/index.stories.js +8 -0
- package/__flow__/Link/index.test.js +5 -0
- package/__flow__/Link/styles.js +1 -1
- package/commonjs/EnumIconNames.js +1 -0
- package/commonjs/IconViewBoxes.js +346 -0
- package/commonjs/Link/index.js +3 -1
- package/commonjs/Link/styles.js +3 -1
- package/lib/Link/index.js +3 -1
- package/lib/Link/styles.js +3 -1
- package/package.json +2 -7
package/CHANGELOG.md
CHANGED
package/README.md
CHANGED
|
@@ -104,7 +104,7 @@ Test any local package in another project by utilizing [yarn link](https://yarnp
|
|
|
104
104
|
|
|
105
105
|
Contributions to Racine are welcomed and encouraged from every member of the team. Whether you're adding a new component or simply fixing a bug, every improvement to the library is future leverage for our peers, our product, and our customers.
|
|
106
106
|
|
|
107
|
-
###
|
|
107
|
+
### 🔍 Step 1: Find a way to contribute
|
|
108
108
|
|
|
109
109
|
There are a few ways to get involved:
|
|
110
110
|
|
|
@@ -113,7 +113,7 @@ There are a few ways to get involved:
|
|
|
113
113
|
- [Racine uses a GitHub project board to track our backlog, in-flight changes, and future changes](https://github.com/sproutsocial/racine/projects/2). It's a great way to get a broad look at what's happening in Racine.
|
|
114
114
|
- Come to the bi-weekly Racine Component Review meeting, where engineers gather to discuss new components and changes to existing ones.
|
|
115
115
|
|
|
116
|
-
###
|
|
116
|
+
### 🗺 Step 2: Find your way around
|
|
117
117
|
|
|
118
118
|
Racine's file structure is set up like this:
|
|
119
119
|
|
|
@@ -136,11 +136,11 @@ And you can interact with Racine via the command line with these commands:
|
|
|
136
136
|
- `yarn clean` - Delete all generated files and directories.
|
|
137
137
|
- `yarn release` - This will trigger the release process for creating a new version of the Racine package on npm. **Only Racine administrators can perform the release process.**
|
|
138
138
|
|
|
139
|
-
###
|
|
139
|
+
### ✅ Step 3: Make your changes
|
|
140
140
|
|
|
141
141
|
Racine uses a tool called [changesets](https://github.com/atlassian/changesets) to automatically pick new version numbers and update the changelog whenever we publish a new version of the package.
|
|
142
142
|
|
|
143
|
-
**
|
|
143
|
+
**If you are submitting a PR to Racine that should result in a version bump to the package, you should run `yarn change` to generate a changeset.**
|
|
144
144
|
|
|
145
145
|
We use semantic versioning for the Racine package, which allows users to understand the scope of a package's changes based on the version number, which is in the format `major.minor.patch`.
|
|
146
146
|
|
|
@@ -150,47 +150,12 @@ When running this command, you will be asked to select whether your change is a
|
|
|
150
150
|
- **minor** changes are for new features or improvements, and they bump the middle digit in the version number (`x.0.x`)
|
|
151
151
|
- **major** changes are *breaking changes*, and they bump the first digit (`0.x.x`). These types of changes are rare and should be coordinated in advance with the Design Systems team.
|
|
152
152
|
|
|
153
|
-
The changeset CLI will also ask you to input a message detailing your changes.
|
|
153
|
+
The changeset CLI will also ask you to input a message detailing your changes. Try to be as descriptive and informative as possible with these messages, as they will be used to build a changelog file when a new version is released. You may also use Markdown formatting within changesets.
|
|
154
154
|
|
|
155
|
-
**You can add as many changesets to a PR as you would like.** If your PR makes several distinct changes to Racine, you should create a changeset detailing each one individually.
|
|
155
|
+
**You can add as many changesets to a PR as you would like.** If your PR makes several distinct changes to Racine, you should create a changeset detailing each one individually.
|
|
156
156
|
|
|
157
|
-
### **β Step 4: Create a beta version *(optional)***
|
|
158
157
|
|
|
159
|
-
|
|
160
|
-
|
|
161
|
-
#### **Releasing a beta**
|
|
162
|
-
|
|
163
|
-
To release a beta version, commit your current changes and then run `yarn beta:release`. This command will create a new beta version with a semantic bump level based on your changeset(s), and will prompt you to include a differentiating suffix. Alternatively, you can specify the suffix as a param to the command. For example, if making a minor change to versions `6.55.3`, executing `yarn beta:release uncle-momo` would:
|
|
164
|
-
1. create version `6.56.0-beta-uncle-momo.0`,
|
|
165
|
-
1. add a corresponding tag in git,
|
|
166
|
-
1. push the tag and version commit to Github,
|
|
167
|
-
1. run the *beta-release* Github action,
|
|
168
|
-
1. publish your new beta version to the npm registry.
|
|
169
|
-
|
|
170
|
-
Once the action completes, your beta will be available in the *Current (distribution) Tags* on [NPM](https://www.npmjs.com/package/@sproutsocial/racine?activeTab=versions). Note: your published beta is marked as *deprecated* to prevent it from showing in the package's *Version History*
|
|
171
|
-
|
|
172
|
-
Once you beta release is published, you can include it as a dependency from `web-app-core` or `seeds`.
|
|
173
|
-
|
|
174
|
-
The differentiating suffix is necessary to enable if two or more developers to concurrently create their own beta versions from the current version of Racine. Without the suffixes, the names of the beta versions could collide.
|
|
175
|
-
|
|
176
|
-
##### **Modify your beta**
|
|
177
|
-
|
|
178
|
-
As you continue to make changes, rerunning `yarn beta:release` will release a new version of your beta. From the example above, it would create `6.56.0-beta-uncle-momo.1` as the next beta release. Running it again would create `6.56.0-beta-uncle-momo.2` and so on...
|
|
179
|
-
|
|
180
|
-
#### **Checking beta status**
|
|
181
|
-
|
|
182
|
-
Run `yarn beta:status` to see the info Racine has about your current beta version.
|
|
183
|
-
|
|
184
|
-
#### **Completing a beta**
|
|
185
|
-
|
|
186
|
-
When you are satisfied that all of your changes are correct, you can end your beta by running `yarn beta:complete`. This will:
|
|
187
|
-
- remove any local and remote git tags for your beta,
|
|
188
|
-
- restore the original version within `package.json`,
|
|
189
|
-
- delete any beta metadata.
|
|
190
|
-
|
|
191
|
-
Doing so will prime the changeset mechanism to complete the standard release process. (Note: The version of the final release is set at the last moment to ensure it actually is properly set the next valid semantic version as other versions of Racine may have been released during the time you are working on yours.)
|
|
192
|
-
|
|
193
|
-
### **🗣 Step 5: Create a pull request**
|
|
158
|
+
### 🗣 Step 4: Create a pull request
|
|
194
159
|
|
|
195
160
|
Once you're ready to submit your changes for review, open a PR to this repository. A few things will happen:
|
|
196
161
|
|
|
@@ -200,12 +165,12 @@ Once you're ready to submit your changes for review, open a PR to this repositor
|
|
|
200
165
|
|
|
201
166
|
Once your tests are passing and you have at least one approving review, feel free to merge your changes into Racine!
|
|
202
167
|
|
|
203
|
-
###
|
|
168
|
+
### ☁️ Step 5: Publish your changes to npm
|
|
204
169
|
|
|
205
170
|
As PRs get merged into Racine, changsets will keep a running PR open called `Version Packages`. This PR will detail all of the changes that have been made to the package since the last publish. **Anyone can release a new version of Racine by merging this PR.**
|
|
206
171
|
|
|
207
172
|
When the PR is merged, [GitHub will kick off a publish of the new version](https://github.com/sproutsocial/racine/actions?query=workflow%3ARelease). There will be a notification in #eng-design-systems in Slack when the new version is available.
|
|
208
173
|
|
|
209
|
-
###
|
|
174
|
+
### ✍ Step 6: Document your changes
|
|
210
175
|
|
|
211
176
|
Racine components are documented in [Seeds](https://sproutsocial.com/seeds/components), Sprout's design system. You can open a PR to the [Seeds repository](https://github.com/sproutsocial/seeds) to add or edit component documentation. Reach out to the Design Systems team for help getting started.
|
package/__flow__/Link/index.js
CHANGED
|
@@ -14,6 +14,7 @@ type TypeProps = {
|
|
|
14
14
|
/** Setting this prop will cause the component to be rendered as a button instead of an anchor) */
|
|
15
15
|
onClick?: (e: SyntheticEvent<HTMLButtonElement>) => void,
|
|
16
16
|
as?: $PropertyType<TypeStyledComponentsCommonProps, "as">,
|
|
17
|
+
underline?: boolean,
|
|
17
18
|
qa?: Object,
|
|
18
19
|
};
|
|
19
20
|
|
|
@@ -24,6 +25,7 @@ const Link = ({
|
|
|
24
25
|
disabled,
|
|
25
26
|
onClick,
|
|
26
27
|
as,
|
|
28
|
+
underline,
|
|
27
29
|
qa = {},
|
|
28
30
|
...rest
|
|
29
31
|
}: TypeProps) => {
|
|
@@ -45,6 +47,7 @@ const Link = ({
|
|
|
45
47
|
aria-disabled={disabled ? disabled : undefined}
|
|
46
48
|
disabled={disabled}
|
|
47
49
|
onClick={onClick}
|
|
50
|
+
underline={underline}
|
|
48
51
|
data-qa-link={""}
|
|
49
52
|
data-qa-link-isdisabled={disabled === true}
|
|
50
53
|
{...qa}
|
|
@@ -145,3 +145,11 @@ export const differentFontSizes = () => (
|
|
|
145
145
|
differentFontSizes.story = {
|
|
146
146
|
name: "Different font sizes",
|
|
147
147
|
};
|
|
148
|
+
|
|
149
|
+
export const underlinedLink = () => (
|
|
150
|
+
<Link underline>{text("children", "Underlined Link")}</Link>
|
|
151
|
+
);
|
|
152
|
+
|
|
153
|
+
underlinedLink.story = {
|
|
154
|
+
name: "Underlined Link",
|
|
155
|
+
};
|
|
@@ -99,4 +99,9 @@ describe("Racine Link", () => {
|
|
|
99
99
|
expect(getByText("Link").type).toBeFalsy();
|
|
100
100
|
expect(getByText("Link").type).not.toEqual("button");
|
|
101
101
|
});
|
|
102
|
+
|
|
103
|
+
it("Can render with an underline", () => {
|
|
104
|
+
const { getByText } = render(<Link underline>Link</Link>);
|
|
105
|
+
expect(getByText("Link")).toHaveStyleRule("text-decoration", "underline");
|
|
106
|
+
});
|
|
102
107
|
});
|
package/__flow__/Link/styles.js
CHANGED
|
@@ -11,7 +11,7 @@ const Container = styled<typeof Text, TypeTheme, any>(Text)`
|
|
|
11
11
|
font-family: ${(props) => props.theme.fontFamily};
|
|
12
12
|
transition: all ${(props) => props.theme.duration.fast}
|
|
13
13
|
${(props) => props.theme.easing.ease_inout};
|
|
14
|
-
text-decoration: none;
|
|
14
|
+
text-decoration: ${(props) => (props.underline ? "underline" : "none")};
|
|
15
15
|
appearance: none;
|
|
16
16
|
cursor: pointer;
|
|
17
17
|
${(props) =>
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
"use strict";
|
|
@@ -0,0 +1,346 @@
|
|
|
1
|
+
"use strict";
|
|
2
|
+
|
|
3
|
+
module.exports = {
|
|
4
|
+
"active-listener": "0 0 16 16",
|
|
5
|
+
"add-item": "0 0 16 16",
|
|
6
|
+
"add-keyword": "0 0 16 16",
|
|
7
|
+
"add-team-member": "0 0 18 13",
|
|
8
|
+
"address-card-solid": "0 0 18 16",
|
|
9
|
+
"adobe-experience-manager": "0 0 16 18",
|
|
10
|
+
"ads": "0 0 9 16",
|
|
11
|
+
"android": "0 0 14 16",
|
|
12
|
+
"apple": "0 0 14 16",
|
|
13
|
+
"approval-indicator-outline": "0 0 14 16",
|
|
14
|
+
"approval-indicator": "0 0 14 16",
|
|
15
|
+
"archive": "0 0 16 16",
|
|
16
|
+
"arrow-down-line": "0 0 14 16",
|
|
17
|
+
"arrow-down": "0 0 16 16",
|
|
18
|
+
"arrow-left-line": "0 0 16 18",
|
|
19
|
+
"arrow-left": "0 0 16 16",
|
|
20
|
+
"arrow-right-line": "0 0 16 18",
|
|
21
|
+
"arrow-right": "0 0 16 16",
|
|
22
|
+
"arrow-up-line": "0 0 14 16",
|
|
23
|
+
"arrow-up": "0 0 16 16",
|
|
24
|
+
"arrows": "0 0 16 16",
|
|
25
|
+
"asset-library-outline": "0 0 16 16",
|
|
26
|
+
"asset-library": "0 0 16 16",
|
|
27
|
+
"assign": "0 0 18 15",
|
|
28
|
+
"atom": "0 0 14 16",
|
|
29
|
+
"audio": "0 0 16 14",
|
|
30
|
+
"back-to-top": "0 0 15 16",
|
|
31
|
+
"bambu-icon-outline": "0 0 16 16",
|
|
32
|
+
"bambu-icon": "0 0 16 16",
|
|
33
|
+
"barcode": "0 0 18 16",
|
|
34
|
+
"basketball": "0 0 16 16",
|
|
35
|
+
"bell-outline": "0 0 14 16",
|
|
36
|
+
"bitly": "0 0 16 16",
|
|
37
|
+
"bold": "0 0 16 16",
|
|
38
|
+
"book": "0 0 14 16",
|
|
39
|
+
"bot": "0 0 16 16",
|
|
40
|
+
"browser": "0 0 16 16",
|
|
41
|
+
"business": "0 0 16 16",
|
|
42
|
+
"calendar-outline": "0 0 14 16",
|
|
43
|
+
"calendar": "0 0 14 16",
|
|
44
|
+
"camera-outline": "0 0 18 16",
|
|
45
|
+
"camera-story": "0 0 18 16",
|
|
46
|
+
"camera": "0 0 18 16",
|
|
47
|
+
"campaign": "0 0 16 14",
|
|
48
|
+
"canva": "0 0 16 18",
|
|
49
|
+
"carousel": "0 0 16 18",
|
|
50
|
+
"cart-plus-outline": "0 0 17 15",
|
|
51
|
+
"cart-plus": "0 0 17 15",
|
|
52
|
+
"check": "0 0 16 16",
|
|
53
|
+
"chevron-down-filled": "0 0 16 21",
|
|
54
|
+
"chevron-down": "0 0 16 18",
|
|
55
|
+
"chevron-left": "0 0 10 16",
|
|
56
|
+
"chevron-right": "0 0 10 17",
|
|
57
|
+
"chevron-up-down-filled": "0 0 12 20",
|
|
58
|
+
"chevron-up-filled": "0 0 16 21",
|
|
59
|
+
"chevron-up": "0 0 16 18",
|
|
60
|
+
"circle-check-outline": "0 0 16 16",
|
|
61
|
+
"circle-check": "0 0 16 16",
|
|
62
|
+
"circle": "0 0 16 16",
|
|
63
|
+
"circle+": "0 0 16 16",
|
|
64
|
+
"circles": "0 0 16 16",
|
|
65
|
+
"circlex": "0 0 16 16",
|
|
66
|
+
"click-to-view": "0 0 12 16",
|
|
67
|
+
"clicks": "0 0 10 16",
|
|
68
|
+
"clipboard-outline": "0 0 12 16",
|
|
69
|
+
"clipboard": "0 0 12 16",
|
|
70
|
+
"clock": "0 0 16 16",
|
|
71
|
+
"closed-captioning": "0 0 16 16",
|
|
72
|
+
"cloud": "0 0 16 13",
|
|
73
|
+
"code": "0 0 18 16",
|
|
74
|
+
"columns": "0 0 16 16",
|
|
75
|
+
"comment-alt-outline": "0 0 16 15",
|
|
76
|
+
"comment-alt": "0 0 16 15",
|
|
77
|
+
"comment-lines-alt-outline": "0 0 16 16",
|
|
78
|
+
"comment": "0 0 16 13",
|
|
79
|
+
"compact-density": "0 0 16 16",
|
|
80
|
+
"compact-indicator": "0 0 16 16",
|
|
81
|
+
"comparison": "0 0 16 14",
|
|
82
|
+
"competitor": "0 0 14 16",
|
|
83
|
+
"compose": "0 0 16 16",
|
|
84
|
+
"content-suggestions": "0 0 16 16",
|
|
85
|
+
"credit-card": "0 0 16 14",
|
|
86
|
+
"crop": "0 0 16 16",
|
|
87
|
+
"crown": "0 0 16 16",
|
|
88
|
+
"dashboard": "0 0 16 14",
|
|
89
|
+
"discovery": "0 0 16 16",
|
|
90
|
+
"dislike-outline": "0 0 15 16",
|
|
91
|
+
"dislike": "0 0 16 16",
|
|
92
|
+
"dm-link-outline": "0 0 16 16",
|
|
93
|
+
"dm-link": "0 0 16 16",
|
|
94
|
+
"dotdotdot": "0 0 16 16",
|
|
95
|
+
"download": "0 0 16 16",
|
|
96
|
+
"drafts-outline": "0 0 12 16",
|
|
97
|
+
"drafts": "0 0 12 16",
|
|
98
|
+
"dropbox": "0 0 18 16",
|
|
99
|
+
"duplicate-outline": "0 0 14 16",
|
|
100
|
+
"duplicate": "0 0 14 16",
|
|
101
|
+
"emoji-outline": "0 0 16 16",
|
|
102
|
+
"emoji": "0 0 16 16",
|
|
103
|
+
"empty-image": "0 0 16 18",
|
|
104
|
+
"engagement-per-post": "0 0 16 16",
|
|
105
|
+
"engagements": "0 0 16 15",
|
|
106
|
+
"error": "0 0 16 16",
|
|
107
|
+
"exchange-alt": "0 0 16 16",
|
|
108
|
+
"expanded-indicator": "0 0 16 16",
|
|
109
|
+
"export": "0 0 14 17",
|
|
110
|
+
"extended-circles": "0 0 16 16",
|
|
111
|
+
"external-link-alt": "0 0 16 16",
|
|
112
|
+
"external-link": "0 0 16 16",
|
|
113
|
+
"extreme-negative-sentiment": "0 0 16 16",
|
|
114
|
+
"eye-outline": "0 0 18 16",
|
|
115
|
+
"eye-slash-outline": "0 0 20 16",
|
|
116
|
+
"eye-slash": "0 0 20 16",
|
|
117
|
+
"eye": "0 0 18 16",
|
|
118
|
+
"facebook-audience-network": "0 0 16 16",
|
|
119
|
+
"facebook-branded-content-outline": "0 0 18 15",
|
|
120
|
+
"facebook-branded-content": "0 0 18 15",
|
|
121
|
+
"facebook-groups": "0 0 16 16",
|
|
122
|
+
"facebook": "0 0 16 16",
|
|
123
|
+
"fb-reactions-angry": "0 0 16 16",
|
|
124
|
+
"fb-reactions-haha": "0 0 16 16",
|
|
125
|
+
"fb-reactions-like": "0 0 16 16",
|
|
126
|
+
"fb-reactions-love": "0 0 16 16",
|
|
127
|
+
"fb-reactions-sad": "0 0 16 16",
|
|
128
|
+
"fb-reactions-wow": "0 0 16 16",
|
|
129
|
+
"feedly": "0 0 16 15",
|
|
130
|
+
"feeds": "0 0 16 15",
|
|
131
|
+
"female": "0 0 11 18",
|
|
132
|
+
"file-chart-line": "0 0 12 16",
|
|
133
|
+
"file-edit": "0 0 12 16",
|
|
134
|
+
"file-times-solid": "0 0 12 16",
|
|
135
|
+
"filter": "0 0 16 16",
|
|
136
|
+
"flag-outline": "0 0 16 16",
|
|
137
|
+
"flag": "0 0 16 16",
|
|
138
|
+
"folder-open": "0 0 16 15",
|
|
139
|
+
"folder": "0 0 16 16",
|
|
140
|
+
"follow-outline": "0 0 20 16",
|
|
141
|
+
"follow": "0 0 20 16",
|
|
142
|
+
"follower-increase": "0 0 19 16",
|
|
143
|
+
"following": "0 0 20 16",
|
|
144
|
+
"font": "0 0 18 16",
|
|
145
|
+
"full-access": "0 0 16 16",
|
|
146
|
+
"gear": "0 0 16 16",
|
|
147
|
+
"gears": "0 0 16 16",
|
|
148
|
+
"glassdoor": "0 0 16 16",
|
|
149
|
+
"glasses": "0 0 18 14",
|
|
150
|
+
"globe": "0 0 16 16",
|
|
151
|
+
"google-analytics-color": "0 0 14 18",
|
|
152
|
+
"google-business-messages": "0 0 16 16",
|
|
153
|
+
"google-drive": "0 0 16 14",
|
|
154
|
+
"google-my-business": "0 0 16 14",
|
|
155
|
+
"grip": "0 0 8 18",
|
|
156
|
+
"h1": "0 0 16 16",
|
|
157
|
+
"h2": "0 0 16 16",
|
|
158
|
+
"hamburger": "0 0 16 18",
|
|
159
|
+
"hashtag": "0 0 16 16",
|
|
160
|
+
"headset": "0 0 16 16",
|
|
161
|
+
"heart-outline": "0 0 16 16",
|
|
162
|
+
"heart": "0 0 16 16",
|
|
163
|
+
"heartbeat": "0 0 18 16",
|
|
164
|
+
"help": "0 0 16 16",
|
|
165
|
+
"hiking": "0 0 16 16",
|
|
166
|
+
"history": "0 0 16 16",
|
|
167
|
+
"home": "0 0 16 15",
|
|
168
|
+
"hourglass": "0 0 12 16",
|
|
169
|
+
"hubspot": "0 0 16 16",
|
|
170
|
+
"image-caption": "0 0 16 14",
|
|
171
|
+
"image": "0 0 16 16",
|
|
172
|
+
"images": "0 0 16 15",
|
|
173
|
+
"impressions-per-post": "0 0 16 16",
|
|
174
|
+
"impressions": "0 0 18 16",
|
|
175
|
+
"inactive-listener": "0 0 16 12",
|
|
176
|
+
"inbox-action": "0 0 16 16",
|
|
177
|
+
"inbox-views": "0 0 16 13",
|
|
178
|
+
"inbox": "0 0 16 14",
|
|
179
|
+
"indicator": "0 0 16 16",
|
|
180
|
+
"industry": "0 0 14 16",
|
|
181
|
+
"info": "0 0 16 16",
|
|
182
|
+
"instagram": "0 0 16 16",
|
|
183
|
+
"internal-activity-outline": "0 0 16 16",
|
|
184
|
+
"internal-activity": "0 0 16 16",
|
|
185
|
+
"italic": "0 0 16 16",
|
|
186
|
+
"key": "0 0 16 16",
|
|
187
|
+
"keyboard": "0 0 18 16",
|
|
188
|
+
"laptop-phone": "0 0 16 16",
|
|
189
|
+
"large-density": "0 0 16 16",
|
|
190
|
+
"lift": "0 0 23 16",
|
|
191
|
+
"like-outline": "0 0 15 16",
|
|
192
|
+
"like": "0 0 16 16",
|
|
193
|
+
"link": "0 0 16 16",
|
|
194
|
+
"linkedin-audience-network": "0 0 16 16",
|
|
195
|
+
"linkedin": "0 0 16 16",
|
|
196
|
+
"list-ol": "0 0 16 16",
|
|
197
|
+
"listening": "0 0 14 16",
|
|
198
|
+
"lists": "0 0 16 16",
|
|
199
|
+
"location-outline": "0 0 12 16",
|
|
200
|
+
"location": "0 0 12 16",
|
|
201
|
+
"lock": "0 0 14 16",
|
|
202
|
+
"male": "0 0 16 20",
|
|
203
|
+
"marketo": "0 0 16 18",
|
|
204
|
+
"mention": "0 0 16 16",
|
|
205
|
+
"message-preview-outline": "0 0 18 16",
|
|
206
|
+
"message-preview": "0 0 18 16",
|
|
207
|
+
"message": "0 0 16 16",
|
|
208
|
+
"messages-outline": "0 0 16 16",
|
|
209
|
+
"messages": "0 0 16 16",
|
|
210
|
+
"messenger": "0 0 16 16",
|
|
211
|
+
"metric-table": "0 0 16 16",
|
|
212
|
+
"microsoft-dynamics": "0 0 16 16",
|
|
213
|
+
"minus": "0 0 16 16",
|
|
214
|
+
"mobile": "0 0 10 16",
|
|
215
|
+
"monitor": "0 0 12 16",
|
|
216
|
+
"moon": "0 0 15 16",
|
|
217
|
+
"negative-sentiment": "0 0 16 16",
|
|
218
|
+
"neutral-positive-sentiment": "0 0 16 16",
|
|
219
|
+
"neutral-sentiment": "0 0 16 16",
|
|
220
|
+
"new-trend": "0 0 12 16",
|
|
221
|
+
"newspaper": "0 0 16 16",
|
|
222
|
+
"no-access": "0 0 16 16",
|
|
223
|
+
"notepad": "0 0 12 16",
|
|
224
|
+
"notifications-publishing-outline": "0 0 16 16",
|
|
225
|
+
"notifications-publishing": "0 0 16 16",
|
|
226
|
+
"notifications": "0 0 14 16",
|
|
227
|
+
"offline": "0 0 18 15",
|
|
228
|
+
"online": "0 0 18 15",
|
|
229
|
+
"paid-promotion-outline": "0 0 16 16",
|
|
230
|
+
"paid-promotion": "0 0 16 16",
|
|
231
|
+
"paid": "0 0 14 16",
|
|
232
|
+
"paint": "0 0 18 16",
|
|
233
|
+
"palette": "0 0 16 16",
|
|
234
|
+
"paperclip": "0 0 14 16",
|
|
235
|
+
"pause": "0 0 16 18",
|
|
236
|
+
"pencil-outline": "0 0 16 16",
|
|
237
|
+
"pencil": "0 0 16 16",
|
|
238
|
+
"person": "0 0 14 16",
|
|
239
|
+
"phone": "0 0 16 16",
|
|
240
|
+
"pinterest-boards-outline": "0 0 14 16",
|
|
241
|
+
"pinterest-boards": "0 0 14 16",
|
|
242
|
+
"pinterest": "0 0 16 16",
|
|
243
|
+
"play-circle": "0 0 16 16",
|
|
244
|
+
"play": "0 0 14 16",
|
|
245
|
+
"plus": "0 0 16 18",
|
|
246
|
+
"positive-sentiment": "0 0 16 16",
|
|
247
|
+
"power-up": "0 0 10 16",
|
|
248
|
+
"profile-connect": "0 0 16 16",
|
|
249
|
+
"profile-disconnect": "0 0 16 16",
|
|
250
|
+
"publishing-outline": "0 0 16 16",
|
|
251
|
+
"publishing": "0 0 16 16",
|
|
252
|
+
"puzzle-piece": "0 0 18 16",
|
|
253
|
+
"qr-code": "0 0 16 16",
|
|
254
|
+
"queue": "0 0 16 16",
|
|
255
|
+
"recommendation": "0 0 16 16",
|
|
256
|
+
"reddit-alien": "0 0 16 16",
|
|
257
|
+
"reddit": "0 0 16 16",
|
|
258
|
+
"referrals": "0 0 16 16",
|
|
259
|
+
"refresh": "0 0 16 16",
|
|
260
|
+
"rejected": "0 0 16 16",
|
|
261
|
+
"reply-outline": "0 0 16 16",
|
|
262
|
+
"reply": "0 0 16 16",
|
|
263
|
+
"reporting-period": "0 0 14 16",
|
|
264
|
+
"reporting": "0 0 16 16",
|
|
265
|
+
"reports-home": "0 0 16 16",
|
|
266
|
+
"reports": "0 0 16 15",
|
|
267
|
+
"retweet": "0 0 18 16",
|
|
268
|
+
"rss": "0 0 16 16",
|
|
269
|
+
"sales": "0 0 9 16",
|
|
270
|
+
"salesforce": "0 0 20 16",
|
|
271
|
+
"save-assets": "0 0 16 16",
|
|
272
|
+
"saved-messages": "0 0 16 16",
|
|
273
|
+
"saved-reply-outline": "0 0 16 12",
|
|
274
|
+
"saved-reply": "0 0 16 12",
|
|
275
|
+
"search": "0 0 16 16",
|
|
276
|
+
"sent-message-outline": "0 0 16 14",
|
|
277
|
+
"sent-message": "0 0 16 14",
|
|
278
|
+
"share": "0 0 16 14",
|
|
279
|
+
"shopify": "0 0 16 18",
|
|
280
|
+
"slack": "0 0 16 16",
|
|
281
|
+
"small-density": "0 0 16 16",
|
|
282
|
+
"smiley": "0 0 16 16",
|
|
283
|
+
"some-access": "0 0 16 16",
|
|
284
|
+
"sparkles": "0 0 16 16",
|
|
285
|
+
"spike-alert": "0 0 16 16",
|
|
286
|
+
"star-half-alt-solid": "0 0 18 16",
|
|
287
|
+
"star-of-life": "0 0 16 16",
|
|
288
|
+
"star-outline": "0 0 18 16",
|
|
289
|
+
"star": "0 0 18 16",
|
|
290
|
+
"sticky-note-outline": "0 0 16 16",
|
|
291
|
+
"sticky-note": "0 0 16 16",
|
|
292
|
+
"stories": "0 0 16 17",
|
|
293
|
+
"story": "0 0 16 16",
|
|
294
|
+
"suggestions": "0 0 11 16",
|
|
295
|
+
"sun": "0 0 16 16",
|
|
296
|
+
"tag-outline": "0 0 16 16",
|
|
297
|
+
"tag": "0 0 16 16",
|
|
298
|
+
"targeting-outline": "0 0 16 16",
|
|
299
|
+
"targeting": "0 0 16 16",
|
|
300
|
+
"tasks-outline": "0 0 12 16",
|
|
301
|
+
"tasks": "0 0 12 16",
|
|
302
|
+
"team-conversation-outline": "0 0 16 18",
|
|
303
|
+
"team-conversation": "0 0 16 18",
|
|
304
|
+
"team": "0 0 18 16",
|
|
305
|
+
"text-asset": "0 0 16 16",
|
|
306
|
+
"text": "0 0 8 16",
|
|
307
|
+
"times": "0 0 16 22",
|
|
308
|
+
"trash-can-outline": "0 0 14 16",
|
|
309
|
+
"trash-can": "0 0 14 16",
|
|
310
|
+
"trend-down": "0 0 18 18",
|
|
311
|
+
"trend-neutral": "0 0 20 18",
|
|
312
|
+
"trend-up": "0 0 18 18",
|
|
313
|
+
"trends": "0 0 16 17",
|
|
314
|
+
"triangle-black": "0 0 16 16",
|
|
315
|
+
"triangle": "0 0 16 16",
|
|
316
|
+
"tripadvisor-circle-outline": "0 0 16 16",
|
|
317
|
+
"tripadvisor-circle": "0 0 16 16",
|
|
318
|
+
"tripadvisor": "0 0 16 16",
|
|
319
|
+
"trophy-outline": "0 0 18 16",
|
|
320
|
+
"tumblr": "0 0 16 16",
|
|
321
|
+
"twitter-audience-network": "0 0 17 16",
|
|
322
|
+
"twitter": "0 0 17 16",
|
|
323
|
+
"unfollow-outline": "0 0 20 16",
|
|
324
|
+
"unfollow": "0 0 20 16",
|
|
325
|
+
"unlink": "0 0 16 16",
|
|
326
|
+
"unlock": "0 0 14 16",
|
|
327
|
+
"upload": "0 0 16 17",
|
|
328
|
+
"user-circle": "0 0 16 16",
|
|
329
|
+
"users": "0 0 18 16",
|
|
330
|
+
"verified": "0 0 16 16",
|
|
331
|
+
"video-camera-story": "0 0 18 15",
|
|
332
|
+
"video-camera": "0 0 18 16",
|
|
333
|
+
"vip": "0 0 16 16",
|
|
334
|
+
"weight": "0 0 16 16",
|
|
335
|
+
"whatsapp": "0 0 16 16",
|
|
336
|
+
"window-maximize": "0 0 16 16",
|
|
337
|
+
"window-minimize": "0 0 16 16",
|
|
338
|
+
"window-regular": "0 0 16 16",
|
|
339
|
+
"window-restore": "0 0 16 16",
|
|
340
|
+
"x": "0 0 16 18",
|
|
341
|
+
"yelp-full-star": "0 0 16 16",
|
|
342
|
+
"yelp-half-star": "0 0 16 16",
|
|
343
|
+
"yelp": "0 0 14 16",
|
|
344
|
+
"youtube": "0 0 16 15",
|
|
345
|
+
"zendesk": "0 0 16 16"
|
|
346
|
+
};
|
package/commonjs/Link/index.js
CHANGED
|
@@ -24,9 +24,10 @@ var Link = function Link(_ref) {
|
|
|
24
24
|
disabled = _ref.disabled,
|
|
25
25
|
onClick = _ref.onClick,
|
|
26
26
|
as = _ref.as,
|
|
27
|
+
underline = _ref.underline,
|
|
27
28
|
_ref$qa = _ref.qa,
|
|
28
29
|
qa = _ref$qa === void 0 ? {} : _ref$qa,
|
|
29
|
-
rest = _objectWithoutPropertiesLoose(_ref, ["href", "external", "children", "disabled", "onClick", "as", "qa"]);
|
|
30
|
+
rest = _objectWithoutPropertiesLoose(_ref, ["href", "external", "children", "disabled", "onClick", "as", "underline", "qa"]);
|
|
30
31
|
|
|
31
32
|
if (!href && external) {
|
|
32
33
|
console.warn("Warning: external prop cannot be set without a href declaration");
|
|
@@ -42,6 +43,7 @@ var Link = function Link(_ref) {
|
|
|
42
43
|
"aria-disabled": disabled ? disabled : undefined,
|
|
43
44
|
disabled: disabled,
|
|
44
45
|
onClick: onClick,
|
|
46
|
+
underline: underline,
|
|
45
47
|
"data-qa-link": "",
|
|
46
48
|
"data-qa-link-isdisabled": disabled === true
|
|
47
49
|
}, qa, rest), children);
|
package/commonjs/Link/styles.js
CHANGED
|
@@ -20,12 +20,14 @@ function _interopRequireWildcard(obj, nodeInterop) { if (!nodeInterop && obj &&
|
|
|
20
20
|
var Container = (0, _styledComponents.default)(_Text.default).withConfig({
|
|
21
21
|
displayName: "styles__Container",
|
|
22
22
|
componentId: "adcw4a-0"
|
|
23
|
-
})(["border:0;font-family:", ";transition:all ", " ", ";text-decoration:
|
|
23
|
+
})(["border:0;font-family:", ";transition:all ", " ", ";text-decoration:", ";appearance:none;cursor:pointer;", " font-weight:", ";color:", ";&:hover{color:", ";text-decoration:underline;}&:active{color:", ";}&:focus{", "}&:focus:active{box-shadow:none;}", " ", " ", " ", ""], function (props) {
|
|
24
24
|
return props.theme.fontFamily;
|
|
25
25
|
}, function (props) {
|
|
26
26
|
return props.theme.duration.fast;
|
|
27
27
|
}, function (props) {
|
|
28
28
|
return props.theme.easing.ease_inout;
|
|
29
|
+
}, function (props) {
|
|
30
|
+
return props.underline ? "underline" : "none";
|
|
29
31
|
}, function (props) {
|
|
30
32
|
return props.disabled && (0, _styledComponents.css)(["opacity:0.4;cursor:not-allowed;"]);
|
|
31
33
|
}, function (props) {
|
package/lib/Link/index.js
CHANGED
|
@@ -12,9 +12,10 @@ var Link = function Link(_ref) {
|
|
|
12
12
|
disabled = _ref.disabled,
|
|
13
13
|
onClick = _ref.onClick,
|
|
14
14
|
as = _ref.as,
|
|
15
|
+
underline = _ref.underline,
|
|
15
16
|
_ref$qa = _ref.qa,
|
|
16
17
|
qa = _ref$qa === void 0 ? {} : _ref$qa,
|
|
17
|
-
rest = _objectWithoutPropertiesLoose(_ref, ["href", "external", "children", "disabled", "onClick", "as", "qa"]);
|
|
18
|
+
rest = _objectWithoutPropertiesLoose(_ref, ["href", "external", "children", "disabled", "onClick", "as", "underline", "qa"]);
|
|
18
19
|
|
|
19
20
|
if (!href && external) {
|
|
20
21
|
console.warn("Warning: external prop cannot be set without a href declaration");
|
|
@@ -30,6 +31,7 @@ var Link = function Link(_ref) {
|
|
|
30
31
|
"aria-disabled": disabled ? disabled : undefined,
|
|
31
32
|
disabled: disabled,
|
|
32
33
|
onClick: onClick,
|
|
34
|
+
underline: underline,
|
|
33
35
|
"data-qa-link": "",
|
|
34
36
|
"data-qa-link-isdisabled": disabled === true
|
|
35
37
|
}, qa, rest), children);
|
package/lib/Link/styles.js
CHANGED
|
@@ -5,12 +5,14 @@ import { TYPOGRAPHY, COMMON } from "../utils/system-props";
|
|
|
5
5
|
var Container = styled(Text).withConfig({
|
|
6
6
|
displayName: "styles__Container",
|
|
7
7
|
componentId: "adcw4a-0"
|
|
8
|
-
})(["border:0;font-family:", ";transition:all ", " ", ";text-decoration:
|
|
8
|
+
})(["border:0;font-family:", ";transition:all ", " ", ";text-decoration:", ";appearance:none;cursor:pointer;", " font-weight:", ";color:", ";&:hover{color:", ";text-decoration:underline;}&:active{color:", ";}&:focus{", "}&:focus:active{box-shadow:none;}", " ", " ", " ", ""], function (props) {
|
|
9
9
|
return props.theme.fontFamily;
|
|
10
10
|
}, function (props) {
|
|
11
11
|
return props.theme.duration.fast;
|
|
12
12
|
}, function (props) {
|
|
13
13
|
return props.theme.easing.ease_inout;
|
|
14
|
+
}, function (props) {
|
|
15
|
+
return props.underline ? "underline" : "none";
|
|
14
16
|
}, function (props) {
|
|
15
17
|
return props.disabled && css(["opacity:0.4;cursor:not-allowed;"]);
|
|
16
18
|
}, function (props) {
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@sproutsocial/racine",
|
|
3
|
-
"version": "7.4.0-beta-
|
|
3
|
+
"version": "7.4.0-beta-link-update.0",
|
|
4
4
|
"license": "MIT",
|
|
5
5
|
"files": [
|
|
6
6
|
"__flow__",
|
|
@@ -47,10 +47,7 @@
|
|
|
47
47
|
"build-storybook": "build-storybook --quiet -c .storybook -o .storybook-dist",
|
|
48
48
|
"icon-lint": "node bin/icon-lint/cli",
|
|
49
49
|
"playroom:start": "playroom start",
|
|
50
|
-
"playroom:build": "playroom build"
|
|
51
|
-
"beta:release": "node ./bin/beta release",
|
|
52
|
-
"beta:status": "node ./bin/beta status",
|
|
53
|
-
"beta:complete": "node ./bin/beta complete"
|
|
50
|
+
"playroom:build": "playroom build"
|
|
54
51
|
},
|
|
55
52
|
"lint-staged": {
|
|
56
53
|
"**/*.js": [
|
|
@@ -152,13 +149,11 @@
|
|
|
152
149
|
"pify": "^4.0.1",
|
|
153
150
|
"playroom": "^0.22.2",
|
|
154
151
|
"prettier": "^2.0.5",
|
|
155
|
-
"prompts": "^2.4.2",
|
|
156
152
|
"prop-types": "^15.6.1",
|
|
157
153
|
"react": "16.12.0",
|
|
158
154
|
"react-dates": "^21.8.0",
|
|
159
155
|
"react-dom": "16.12.0",
|
|
160
156
|
"rimraf": "^2.6.3",
|
|
161
|
-
"semver": "^7.3.5",
|
|
162
157
|
"storybook-dark-mode": "^1.0.7",
|
|
163
158
|
"styled-components": "5.0.0-rc.2",
|
|
164
159
|
"stylelint": "^13.8.0",
|