@sproutsocial/racine 10.0.1-dependencies.0 → 10.0.2-menuCSS.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/__flow__/Avatar/index.test.js +5 -0
- package/__flow__/Badge/index.test.js +5 -0
- package/__flow__/Button/index.stories.js +67 -51
- package/__flow__/CharacterCounter/index.test.js +8 -0
- package/__flow__/ChartLegend/index.test.js +37 -0
- package/__flow__/EmptyState/index.test.js +3 -1
- package/__flow__/Link/index.test.js +10 -0
- package/__flow__/Listbox/index.test.js +0 -18
- package/__flow__/Loader/index.test.js +14 -0
- package/__flow__/Menu/__snapshots__/index.test.js.snap +3 -272
- package/__flow__/Menu/index.test.js +0 -4
- package/__flow__/Menu/styles.js +10 -2
- package/__flow__/Modal/index.test.js +19 -0
- package/__flow__/Text/index.test.js +39 -0
- package/commonjs/Menu/styles.js +1 -1
- package/lib/Menu/styles.js +2 -2
- package/package.json +15 -18
- package/__flow__/Listbox/__snapshots__/index.test.js.snap +0 -1316
|
@@ -1,274 +1,5 @@
|
|
|
1
1
|
// Jest Snapshot v1, https://goo.gl/fbAQLP
|
|
2
2
|
|
|
3
|
-
exports[`Menu AsMenu should match snapshot 1`] = `
|
|
4
|
-
.c0 {
|
|
5
|
-
box-sizing: border-box;
|
|
6
|
-
font-family: system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI","Roboto","Oxygen","Ubuntu","Cantarell","Fira Sans","Droid Sans","Helvetica Neue",sans-serif;
|
|
7
|
-
margin: 0px;
|
|
8
|
-
padding: 0px;
|
|
9
|
-
width: 200px;
|
|
10
|
-
overflow: hidden;
|
|
11
|
-
}
|
|
12
|
-
|
|
13
|
-
.c2 {
|
|
14
|
-
box-sizing: border-box;
|
|
15
|
-
font-family: system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI","Roboto","Oxygen","Ubuntu","Cantarell","Fira Sans","Droid Sans","Helvetica Neue",sans-serif;
|
|
16
|
-
padding-left: 16px;
|
|
17
|
-
margin-top: -1px;
|
|
18
|
-
border-top: 1px solid;
|
|
19
|
-
border-color: #dee1e1;
|
|
20
|
-
}
|
|
21
|
-
|
|
22
|
-
.c4 {
|
|
23
|
-
box-sizing: border-box;
|
|
24
|
-
font-family: system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI","Roboto","Oxygen","Ubuntu","Cantarell","Fira Sans","Droid Sans","Helvetica Neue",sans-serif;
|
|
25
|
-
margin: 8px;
|
|
26
|
-
padding: 8px;
|
|
27
|
-
}
|
|
28
|
-
|
|
29
|
-
.c5 {
|
|
30
|
-
box-sizing: border-box;
|
|
31
|
-
font-family: system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI","Roboto","Oxygen","Ubuntu","Cantarell","Fira Sans","Droid Sans","Helvetica Neue",sans-serif;
|
|
32
|
-
}
|
|
33
|
-
|
|
34
|
-
.c7 {
|
|
35
|
-
display: block;
|
|
36
|
-
width: 100%;
|
|
37
|
-
border-radius: 6px;
|
|
38
|
-
background-color: transparent;
|
|
39
|
-
border: none;
|
|
40
|
-
text-align: left;
|
|
41
|
-
color: #364141;
|
|
42
|
-
font-family: system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI","Roboto","Oxygen","Ubuntu","Cantarell","Fira Sans","Droid Sans","Helvetica Neue",sans-serif;
|
|
43
|
-
font-weight: 400;
|
|
44
|
-
padding: 6px 8px;
|
|
45
|
-
list-style-type: none;
|
|
46
|
-
outline: 0;
|
|
47
|
-
font-size: 13px;
|
|
48
|
-
line-height: 21.333333333333332px;
|
|
49
|
-
}
|
|
50
|
-
|
|
51
|
-
.c7:focus,
|
|
52
|
-
.c7:hover {
|
|
53
|
-
color: #364141;
|
|
54
|
-
background-color: #f3f4f4;
|
|
55
|
-
}
|
|
56
|
-
|
|
57
|
-
.c7:focus .Icon-svg,
|
|
58
|
-
.c7:hover .Icon-svg {
|
|
59
|
-
color: unset;
|
|
60
|
-
}
|
|
61
|
-
|
|
62
|
-
.c7:hover {
|
|
63
|
-
cursor: pointer;
|
|
64
|
-
}
|
|
65
|
-
|
|
66
|
-
.c6 {
|
|
67
|
-
display: block;
|
|
68
|
-
width: 100%;
|
|
69
|
-
border-radius: 6px;
|
|
70
|
-
background-color: transparent;
|
|
71
|
-
border: none;
|
|
72
|
-
text-align: left;
|
|
73
|
-
color: #364141;
|
|
74
|
-
font-family: system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI","Roboto","Oxygen","Ubuntu","Cantarell","Fira Sans","Droid Sans","Helvetica Neue",sans-serif;
|
|
75
|
-
font-weight: 400;
|
|
76
|
-
padding: 6px 8px;
|
|
77
|
-
list-style-type: none;
|
|
78
|
-
outline: 0;
|
|
79
|
-
font-size: 13px;
|
|
80
|
-
line-height: 21.333333333333332px;
|
|
81
|
-
color: #FFFFFF;
|
|
82
|
-
background-color: #364141;
|
|
83
|
-
}
|
|
84
|
-
|
|
85
|
-
.c6 .Icon-svg {
|
|
86
|
-
color: #FFFFFF;
|
|
87
|
-
}
|
|
88
|
-
|
|
89
|
-
.c6:focus,
|
|
90
|
-
.c6:hover {
|
|
91
|
-
color: #364141;
|
|
92
|
-
background-color: #f3f4f4;
|
|
93
|
-
}
|
|
94
|
-
|
|
95
|
-
.c6:focus .Icon-svg,
|
|
96
|
-
.c6:hover .Icon-svg {
|
|
97
|
-
color: unset;
|
|
98
|
-
}
|
|
99
|
-
|
|
100
|
-
.c6:hover {
|
|
101
|
-
cursor: pointer;
|
|
102
|
-
}
|
|
103
|
-
|
|
104
|
-
.c1 {
|
|
105
|
-
list-style-type: none;
|
|
106
|
-
outline: 0;
|
|
107
|
-
}
|
|
108
|
-
|
|
109
|
-
.c3 {
|
|
110
|
-
margin: 0;
|
|
111
|
-
padding-left: 0;
|
|
112
|
-
padding-right: 0;
|
|
113
|
-
font-family: system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI","Roboto","Oxygen","Ubuntu","Cantarell","Fira Sans","Droid Sans","Helvetica Neue",sans-serif;
|
|
114
|
-
margin-top: 12px;
|
|
115
|
-
color: #273333;
|
|
116
|
-
font-size: 13px;
|
|
117
|
-
line-height: 21.333333333333332px;
|
|
118
|
-
font-weight: 600;
|
|
119
|
-
}
|
|
120
|
-
|
|
121
|
-
<body>
|
|
122
|
-
<div>
|
|
123
|
-
<ul
|
|
124
|
-
aria-activedescendant="MenuItem-1"
|
|
125
|
-
class="c0 c1"
|
|
126
|
-
overflow="hidden"
|
|
127
|
-
role="menu"
|
|
128
|
-
tabindex="0"
|
|
129
|
-
width="200px"
|
|
130
|
-
>
|
|
131
|
-
<div
|
|
132
|
-
class="c2"
|
|
133
|
-
>
|
|
134
|
-
<div
|
|
135
|
-
class="c3 "
|
|
136
|
-
color="text.headline"
|
|
137
|
-
data-qa-text="Fruit"
|
|
138
|
-
font-weight="600"
|
|
139
|
-
>
|
|
140
|
-
Fruit
|
|
141
|
-
</div>
|
|
142
|
-
</div>
|
|
143
|
-
<div
|
|
144
|
-
class="c4"
|
|
145
|
-
role="group"
|
|
146
|
-
>
|
|
147
|
-
<li
|
|
148
|
-
class="c5 c6"
|
|
149
|
-
data-qa-menu-item="Apple"
|
|
150
|
-
id="MenuItem-1"
|
|
151
|
-
role="menuitem"
|
|
152
|
-
tabindex="-1"
|
|
153
|
-
>
|
|
154
|
-
<div
|
|
155
|
-
style="display: flex; align-items: center; justify-content: space-between;"
|
|
156
|
-
>
|
|
157
|
-
<div
|
|
158
|
-
style="flex-grow: 1; word-break: break-word; min-width: 0;"
|
|
159
|
-
>
|
|
160
|
-
Apple
|
|
161
|
-
</div>
|
|
162
|
-
</div>
|
|
163
|
-
</li>
|
|
164
|
-
<li
|
|
165
|
-
class="c5 c7"
|
|
166
|
-
data-qa-menu-item="Banana"
|
|
167
|
-
id="MenuItem-2"
|
|
168
|
-
role="menuitem"
|
|
169
|
-
tabindex="-1"
|
|
170
|
-
>
|
|
171
|
-
<div
|
|
172
|
-
style="display: flex; align-items: center; justify-content: space-between;"
|
|
173
|
-
>
|
|
174
|
-
<div
|
|
175
|
-
style="flex-grow: 1; word-break: break-word; min-width: 0;"
|
|
176
|
-
>
|
|
177
|
-
Banana
|
|
178
|
-
</div>
|
|
179
|
-
</div>
|
|
180
|
-
</li>
|
|
181
|
-
<li
|
|
182
|
-
class="c5 c7"
|
|
183
|
-
data-qa-menu-item="Orange"
|
|
184
|
-
id="MenuItem-3"
|
|
185
|
-
role="menuitem"
|
|
186
|
-
tabindex="-1"
|
|
187
|
-
>
|
|
188
|
-
<div
|
|
189
|
-
style="display: flex; align-items: center; justify-content: space-between;"
|
|
190
|
-
>
|
|
191
|
-
<div
|
|
192
|
-
style="flex-grow: 1; word-break: break-word; min-width: 0;"
|
|
193
|
-
>
|
|
194
|
-
Orange
|
|
195
|
-
</div>
|
|
196
|
-
</div>
|
|
197
|
-
</li>
|
|
198
|
-
</div>
|
|
199
|
-
<div
|
|
200
|
-
class="c2"
|
|
201
|
-
>
|
|
202
|
-
<div
|
|
203
|
-
class="c3 "
|
|
204
|
-
color="text.headline"
|
|
205
|
-
data-qa-text="Maybe Fruit"
|
|
206
|
-
font-weight="600"
|
|
207
|
-
>
|
|
208
|
-
Maybe Fruit
|
|
209
|
-
</div>
|
|
210
|
-
</div>
|
|
211
|
-
<div
|
|
212
|
-
class="c4"
|
|
213
|
-
role="group"
|
|
214
|
-
>
|
|
215
|
-
<li
|
|
216
|
-
class="c5 c7"
|
|
217
|
-
data-qa-menu-item="Tomato"
|
|
218
|
-
id="MenuItem-4"
|
|
219
|
-
role="menuitem"
|
|
220
|
-
tabindex="-1"
|
|
221
|
-
>
|
|
222
|
-
<div
|
|
223
|
-
style="display: flex; align-items: center; justify-content: space-between;"
|
|
224
|
-
>
|
|
225
|
-
<div
|
|
226
|
-
style="flex-grow: 1; word-break: break-word; min-width: 0;"
|
|
227
|
-
>
|
|
228
|
-
Tomato
|
|
229
|
-
</div>
|
|
230
|
-
</div>
|
|
231
|
-
</li>
|
|
232
|
-
<li
|
|
233
|
-
class="c5 c7"
|
|
234
|
-
data-qa-menu-item="Cucumber"
|
|
235
|
-
id="MenuItem-5"
|
|
236
|
-
role="menuitem"
|
|
237
|
-
tabindex="-1"
|
|
238
|
-
>
|
|
239
|
-
<div
|
|
240
|
-
style="display: flex; align-items: center; justify-content: space-between;"
|
|
241
|
-
>
|
|
242
|
-
<div
|
|
243
|
-
style="flex-grow: 1; word-break: break-word; min-width: 0;"
|
|
244
|
-
>
|
|
245
|
-
Cucumber
|
|
246
|
-
</div>
|
|
247
|
-
</div>
|
|
248
|
-
</li>
|
|
249
|
-
<li
|
|
250
|
-
class="c5 c7"
|
|
251
|
-
data-qa-menu-item="Squash"
|
|
252
|
-
id="MenuItem-6"
|
|
253
|
-
role="menuitem"
|
|
254
|
-
tabindex="-1"
|
|
255
|
-
>
|
|
256
|
-
<div
|
|
257
|
-
style="display: flex; align-items: center; justify-content: space-between;"
|
|
258
|
-
>
|
|
259
|
-
<div
|
|
260
|
-
style="flex-grow: 1; word-break: break-word; min-width: 0;"
|
|
261
|
-
>
|
|
262
|
-
Squash
|
|
263
|
-
</div>
|
|
264
|
-
</div>
|
|
265
|
-
</li>
|
|
266
|
-
</div>
|
|
267
|
-
</ul>
|
|
268
|
-
</div>
|
|
269
|
-
</body>
|
|
270
|
-
`;
|
|
271
|
-
|
|
272
3
|
exports[`Menu AsMenuButton should match snapshot 1`] = `
|
|
273
4
|
.c3 {
|
|
274
5
|
display: inline-block;
|
|
@@ -283,12 +14,12 @@ exports[`Menu AsMenuButton should match snapshot 1`] = `
|
|
|
283
14
|
fill: currentColor;
|
|
284
15
|
}
|
|
285
16
|
|
|
286
|
-
_:-ms-fullscreen .
|
|
17
|
+
_:-ms-fullscreen .c3,
|
|
287
18
|
html .c3 {
|
|
288
19
|
width: 16px;
|
|
289
20
|
}
|
|
290
21
|
|
|
291
|
-
.pdf-page .
|
|
22
|
+
.pdf-page .c3 {
|
|
292
23
|
width: 16px;
|
|
293
24
|
}
|
|
294
25
|
|
|
@@ -368,7 +99,7 @@ html .c3 {
|
|
|
368
99
|
class="c1"
|
|
369
100
|
data-qa-button=""
|
|
370
101
|
data-qa-button-isdisabled="false"
|
|
371
|
-
id="MenuButton-
|
|
102
|
+
id="MenuButton-7"
|
|
372
103
|
type="button"
|
|
373
104
|
>
|
|
374
105
|
<span
|
|
@@ -54,10 +54,6 @@ describe("Menu", () => {
|
|
|
54
54
|
});
|
|
55
55
|
|
|
56
56
|
describe("AsMenu", () => {
|
|
57
|
-
it("should match snapshot", () => {
|
|
58
|
-
expect(render(<AsMenu />).baseElement).toMatchSnapshot();
|
|
59
|
-
});
|
|
60
|
-
|
|
61
57
|
it("should render items with menuitem role", () => {
|
|
62
58
|
const { queryByRole, queryByDataQaLabel } = render(<AsMenu />);
|
|
63
59
|
const firstItem = queryByRole(MENU_ITEM_ROLES.MENUITEM, {
|
package/__flow__/Menu/styles.js
CHANGED
|
@@ -3,7 +3,7 @@ import styled, { css } from "styled-components";
|
|
|
3
3
|
import Box from "../Box";
|
|
4
4
|
import type { TypeMenuItemProps } from "./index.flow";
|
|
5
5
|
import type { TypeTheme } from "../types/theme.flow";
|
|
6
|
-
import { disabled } from "../utils/mixins";
|
|
6
|
+
import { disabled, focusRing } from "../utils/mixins";
|
|
7
7
|
|
|
8
8
|
export const MenuItemContainer = styled<
|
|
9
9
|
typeof Box,
|
|
@@ -86,5 +86,13 @@ export const MenuItemContainer = styled<
|
|
|
86
86
|
|
|
87
87
|
export const MenuItemsContainer = styled<typeof Box, TypeTheme>(Box)`
|
|
88
88
|
list-style-type: none;
|
|
89
|
-
|
|
89
|
+
&:focus {
|
|
90
|
+
${focusRing}
|
|
91
|
+
}
|
|
92
|
+
&:not(:focus) {
|
|
93
|
+
& li:not(:hover) {
|
|
94
|
+
color: #364141;
|
|
95
|
+
background-color: transparent;
|
|
96
|
+
}
|
|
97
|
+
}
|
|
90
98
|
`;
|
|
@@ -7,6 +7,25 @@ import { COLOR_PURPLE_300 } from "@sproutsocial/seeds-color";
|
|
|
7
7
|
afterEach(() => cleanup());
|
|
8
8
|
|
|
9
9
|
describe("Modal", () => {
|
|
10
|
+
it("renders a custom background color", () => {
|
|
11
|
+
// Use baseElement since it renders in a Portal
|
|
12
|
+
const { baseElement } = render(
|
|
13
|
+
<Modal
|
|
14
|
+
isOpen={true}
|
|
15
|
+
label="Label"
|
|
16
|
+
bg={COLOR_PURPLE_300}
|
|
17
|
+
onClose={() => {}}
|
|
18
|
+
closeButtonLabel="Close this dialog"
|
|
19
|
+
>
|
|
20
|
+
ajdsfljasdlfjlasdjf
|
|
21
|
+
</Modal>
|
|
22
|
+
);
|
|
23
|
+
expect(baseElement.querySelector(".ReactModal__Content")).toHaveStyleRule(
|
|
24
|
+
"background-color",
|
|
25
|
+
COLOR_PURPLE_300
|
|
26
|
+
);
|
|
27
|
+
});
|
|
28
|
+
|
|
10
29
|
it("should close on overlay click and esc", () => {
|
|
11
30
|
const onClose = jest.fn();
|
|
12
31
|
const { baseElement, getByText, getByLabelText } = render(
|
|
@@ -4,10 +4,49 @@ import "jest-styled-components";
|
|
|
4
4
|
import Text from "./";
|
|
5
5
|
|
|
6
6
|
describe("Text", () => {
|
|
7
|
+
it("does not set word break or truncated styles by default", () => {
|
|
8
|
+
const { getByDataQaLabel } = render(<Text children="Default" />);
|
|
9
|
+
const component = getByDataQaLabel({ text: "Default" });
|
|
10
|
+
expect(component).not.toHaveStyleRule("word-break", "break-word");
|
|
11
|
+
expect(component).not.toHaveStyleRule("text-overflow", "ellipsis");
|
|
12
|
+
});
|
|
13
|
+
|
|
14
|
+
it("sets word break styles when breakWord is true", () => {
|
|
15
|
+
const { getByDataQaLabel } = render(
|
|
16
|
+
<Text breakWord children="Word Break" />
|
|
17
|
+
);
|
|
18
|
+
const component = getByDataQaLabel({ text: "Word Break" });
|
|
19
|
+
expect(component).toHaveStyleRule("word-break", "break-word");
|
|
20
|
+
});
|
|
21
|
+
|
|
22
|
+
it("sets truncated styles when truncated is true", () => {
|
|
23
|
+
const { getByDataQaLabel } = render(
|
|
24
|
+
<Text truncated children="Truncated" />
|
|
25
|
+
);
|
|
26
|
+
const component = getByDataQaLabel({ text: "Truncated" });
|
|
27
|
+
expect(component).toHaveStyleRule("text-overflow", "ellipsis");
|
|
28
|
+
});
|
|
29
|
+
|
|
30
|
+
it("is italic when isItalicized is true", () => {
|
|
31
|
+
const { getByDataQaLabel } = render(
|
|
32
|
+
<Text isItalicized children="Italicized" />
|
|
33
|
+
);
|
|
34
|
+
const component = getByDataQaLabel({ text: "Italicized" });
|
|
35
|
+
expect(component).toHaveStyleRule("font-style", "italic");
|
|
36
|
+
});
|
|
37
|
+
|
|
7
38
|
it("outputs the correct string/content", () => {
|
|
8
39
|
const { getByText } = render(
|
|
9
40
|
<Text children="Supercalifragilisticexpialidocious" />
|
|
10
41
|
);
|
|
11
42
|
expect(getByText("Supercalifragilisticexpialidocious")).toBeTruthy();
|
|
12
43
|
});
|
|
44
|
+
|
|
45
|
+
it("displays a custom size if using fontSize", () => {
|
|
46
|
+
const { getByText } = render(
|
|
47
|
+
<Text children="Custom sized text!" fontSize={1000} />
|
|
48
|
+
);
|
|
49
|
+
const component = getByText("Custom sized text!");
|
|
50
|
+
expect(component).toHaveStyleRule("font-size", "76px");
|
|
51
|
+
});
|
|
13
52
|
});
|
package/commonjs/Menu/styles.js
CHANGED
|
@@ -59,5 +59,5 @@ exports.MenuItemContainer = MenuItemContainer;
|
|
|
59
59
|
var MenuItemsContainer = (0, _styledComponents.default)(_Box.default).withConfig({
|
|
60
60
|
displayName: "styles__MenuItemsContainer",
|
|
61
61
|
componentId: "fjvae4-1"
|
|
62
|
-
})(["list-style-type:none;
|
|
62
|
+
})(["list-style-type:none;&:focus{", "}&:not(:focus){& li:not(:hover){color:#364141;background-color:transparent;}}"], _mixins.focusRing);
|
|
63
63
|
exports.MenuItemsContainer = MenuItemsContainer;
|
package/lib/Menu/styles.js
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
import styled, { css } from "styled-components";
|
|
2
2
|
import Box from "../Box";
|
|
3
|
-
import { disabled } from "../utils/mixins";
|
|
3
|
+
import { disabled, focusRing } from "../utils/mixins";
|
|
4
4
|
export var MenuItemContainer = styled(Box).withConfig({
|
|
5
5
|
displayName: "styles__MenuItemContainer",
|
|
6
6
|
componentId: "fjvae4-0"
|
|
@@ -44,4 +44,4 @@ export var MenuItemContainer = styled(Box).withConfig({
|
|
|
44
44
|
export var MenuItemsContainer = styled(Box).withConfig({
|
|
45
45
|
displayName: "styles__MenuItemsContainer",
|
|
46
46
|
componentId: "fjvae4-1"
|
|
47
|
-
})(["list-style-type:none;
|
|
47
|
+
})(["list-style-type:none;&:focus{", "}&:not(:focus){& li:not(:hover){color:#364141;background-color:transparent;}}"], focusRing);
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@sproutsocial/racine",
|
|
3
|
-
"version": "10.0.
|
|
3
|
+
"version": "10.0.2-menuCSS.0",
|
|
4
4
|
"license": "MIT",
|
|
5
5
|
"files": [
|
|
6
6
|
"__flow__",
|
|
@@ -62,7 +62,6 @@
|
|
|
62
62
|
]
|
|
63
63
|
},
|
|
64
64
|
"dependencies": {
|
|
65
|
-
"@storybook/addon-controls": "^6.4.19",
|
|
66
65
|
"@styled-system/theme-get": "^5.1.2",
|
|
67
66
|
"classnames": "^2.2.6",
|
|
68
67
|
"lodash.curry": "^4.1.1",
|
|
@@ -76,14 +75,14 @@
|
|
|
76
75
|
"react-popper": "^1.3.3",
|
|
77
76
|
"react-spring": "^8.0.25",
|
|
78
77
|
"react-toastify": "^6.0.5",
|
|
79
|
-
"react-virtualized": "9.
|
|
78
|
+
"react-virtualized": "9.18.5",
|
|
80
79
|
"scroll-into-view-if-needed": "1.1.0",
|
|
81
80
|
"styled-system": "^5.1.5",
|
|
82
81
|
"use-measure": "^0.2.2"
|
|
83
82
|
},
|
|
84
83
|
"devDependencies": {
|
|
85
84
|
"@babel/cli": "^7.5.5",
|
|
86
|
-
"@babel/core": "^7.
|
|
85
|
+
"@babel/core": "^7.4.5",
|
|
87
86
|
"@babel/plugin-proposal-class-properties": "^7.4.4",
|
|
88
87
|
"@babel/plugin-syntax-dynamic-import": "^7.0.0",
|
|
89
88
|
"@babel/preset-env": "^7.8.0",
|
|
@@ -98,21 +97,20 @@
|
|
|
98
97
|
"@sproutsocial/seeds-networkcolor": "^2.9.0",
|
|
99
98
|
"@sproutsocial/seeds-space": "^0.4.7",
|
|
100
99
|
"@sproutsocial/seeds-typography": "^3.0.1",
|
|
101
|
-
"@storybook/addon-a11y": "^6.
|
|
102
|
-
"@storybook/addon-actions": "^6.
|
|
103
|
-
"@storybook/addon-
|
|
104
|
-
"@storybook/addon-
|
|
105
|
-
"@storybook/addon-
|
|
106
|
-
"@storybook/
|
|
107
|
-
"@storybook/addons": "^6.4.19",
|
|
100
|
+
"@storybook/addon-a11y": "^6.1.11",
|
|
101
|
+
"@storybook/addon-actions": "^6.3.8",
|
|
102
|
+
"@storybook/addon-knobs": "^6.1.11",
|
|
103
|
+
"@storybook/addon-storysource": "^6.1.11",
|
|
104
|
+
"@storybook/addon-viewport": "^6.1.11",
|
|
105
|
+
"@storybook/addons": "^6.1.11",
|
|
108
106
|
"@storybook/react": "^6.4.19",
|
|
109
|
-
"@storybook/theming": "^6.
|
|
107
|
+
"@storybook/theming": "^6.1.11",
|
|
110
108
|
"@testing-library/react": "^11.2.2",
|
|
111
109
|
"@testing-library/user-event": "^13.0.0",
|
|
112
110
|
"babel-core": "^7.0.0-bridge",
|
|
113
111
|
"babel-eslint": "10.1.0",
|
|
114
112
|
"babel-jest": "26.1.0",
|
|
115
|
-
"babel-loader": "8.
|
|
113
|
+
"babel-loader": "8.0.6",
|
|
116
114
|
"babel-plugin-inline-import": "^3.0.0",
|
|
117
115
|
"babel-plugin-polished": "^1.1.0",
|
|
118
116
|
"babel-plugin-styled-components": "^1.10.0",
|
|
@@ -140,7 +138,7 @@
|
|
|
140
138
|
"jest": "26.1.0",
|
|
141
139
|
"jest-axe": "3.4.0",
|
|
142
140
|
"jest-dom": "^3.5.0",
|
|
143
|
-
"jest-styled-components": "7.0.
|
|
141
|
+
"jest-styled-components": "7.0.0-beta.1",
|
|
144
142
|
"jscodeshift": "^0.6.4",
|
|
145
143
|
"json-to-scss": "^1.6.2",
|
|
146
144
|
"lint-staged": "^10.2.11",
|
|
@@ -148,15 +146,15 @@
|
|
|
148
146
|
"npm-run-all": "^4.1.2",
|
|
149
147
|
"outdent": "^0.7.0",
|
|
150
148
|
"pify": "^4.0.1",
|
|
151
|
-
"playroom": "^0.
|
|
149
|
+
"playroom": "^0.22.2",
|
|
152
150
|
"prettier": "^2.0.5",
|
|
153
151
|
"prop-types": "^15.6.1",
|
|
154
152
|
"react": "16.12.0",
|
|
155
153
|
"react-dates": "^21.8.0",
|
|
156
154
|
"react-dom": "16.12.0",
|
|
157
155
|
"rimraf": "^2.6.3",
|
|
158
|
-
"storybook-dark-mode": "^1.0.
|
|
159
|
-
"styled-components": "5.
|
|
156
|
+
"storybook-dark-mode": "^1.0.7",
|
|
157
|
+
"styled-components": "5.0.0-rc.2",
|
|
160
158
|
"stylelint": "^13.8.0",
|
|
161
159
|
"stylelint-config-recommended": "^2.2.0",
|
|
162
160
|
"stylelint-config-styled-components": "^0.1.1",
|
|
@@ -181,7 +179,6 @@
|
|
|
181
179
|
"styled-components": "^5.0.0-rc.2"
|
|
182
180
|
},
|
|
183
181
|
"resolutions": {
|
|
184
|
-
"**/eslint-import-resolver-node": "0.3.4",
|
|
185
182
|
"lodash": "^4.17.21",
|
|
186
183
|
"react-popper/create-react-context": "^0.3.0"
|
|
187
184
|
},
|