Skip to content

Commit ba985cb

Browse files
committed
Remove hook "useIsBrowserMS.ts" and replace with function that is called inline in styled-component. Also, now limit the regex to just test for IE (no longer need to test for Edge); "data-testid" attributes only added in test environment; bump dev dependencies.
1 parent 8bd689d commit ba985cb

File tree

55 files changed

+193
-236
lines changed

Some content is hidden

Large Commits have some content hidden by default. Use the searchbox below for content that may be hidden.

55 files changed

+193
-236
lines changed

.storybook/preview.js

Lines changed: 1 addition & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -11,9 +11,7 @@ polyfillBrowserMS();
1111
addParameters({
1212
options: {
1313
storySort: (a, b) => {
14-
return a[1].kind === b[1].kind
15-
? 0
16-
: a[1].id.localeCompare(b[1].id, undefined, { numeric: true });
14+
return a[1].kind === b[1].kind ? 0 : a[1].id.localeCompare(b[1].id, undefined, { numeric: true });
1715
},
1816
},
1917
});

__stories__/2-Styling.story.tsx

Lines changed: 10 additions & 29 deletions
Original file line numberDiff line numberDiff line change
@@ -107,8 +107,8 @@ storiesOf('React Functional Select', module).add('Styling', () => {
107107
const memoizedMarkupNode = useMemo<ReactNode>(() => (
108108
<CodeMarkup
109109
language='markup'
110+
header='Class Markup'
110111
data={CLASS_NAME_HTML}
111-
header='HTML With Classes'
112112
/>
113113
), []);
114114

@@ -168,33 +168,14 @@ storiesOf('React Functional Select', module).add('Styling', () => {
168168
</Content>
169169
<ListWrapper className='is-class-list'>
170170
<List>
171-
<ListItem>
172-
<code>{SELECT_CONTAINER_CLS}</code>
173-
</ListItem>
174-
<ListItem>
175-
<code>{CONTROL_CONTAINER_CLS}</code>
176-
</ListItem>
177-
<ListItem>
178-
<code>{MENU_CONTAINER_CLS}</code>
179-
</ListItem>
180-
<ListItem>
181-
<code>{AUTOSIZE_INPUT_CLS}</code>
182-
</ListItem>
183-
<ListItem>
184-
<code>{CARET_ICON_CLS}</code>
185-
</ListItem>
186-
<ListItem>
187-
<code>{CLEAR_ICON_CLS}</code>
188-
</ListItem>
189-
<ListItem>
190-
<code>{LOADING_DOTS_CLS}</code>
191-
</ListItem>
192-
<ListItem>
193-
<code>{OPTION_CLS}</code>{', '}
194-
<code>{OPTION_FOCUSED_CLS}</code>{', '}
195-
<code>{OPTION_SELECTED_CLS}</code>{', '}
196-
<code>{OPTION_DISABLED_CLS}</code>
197-
</ListItem>
171+
<ListItem>{SELECT_CONTAINER_CLS}</ListItem>
172+
<ListItem>{CONTROL_CONTAINER_CLS}</ListItem>
173+
<ListItem>{MENU_CONTAINER_CLS}</ListItem>
174+
<ListItem>{AUTOSIZE_INPUT_CLS}</ListItem>
175+
<ListItem>{CARET_ICON_CLS}</ListItem>
176+
<ListItem>{CLEAR_ICON_CLS}</ListItem>
177+
<ListItem>{LOADING_DOTS_CLS}</ListItem>
178+
<ListItem>{`${OPTION_CLS}, ${OPTION_FOCUSED_CLS}, ${OPTION_SELECTED_CLS}, ${OPTION_DISABLED_CLS}`}</ListItem>
198179
</List>
199180
</ListWrapper>
200181
</Column>
@@ -227,7 +208,7 @@ storiesOf('React Functional Select', module).add('Styling', () => {
227208
<CodeMarkup
228209
data={themeConfig}
229210
language='javascript'
230-
header='Theme Overrides'
211+
header='theme-config'
231212
formatFn={stringifyJavascriptObj}
232213
/>
233214
</Column>

__stories__/helpers/components/CodeMarkup.tsx

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -31,7 +31,7 @@ const CodeMarkupContainer = styled.div`
3131

3232
const Header = styled.div`
3333
line-height: 3;
34-
color: #809393;
34+
color: #94A7A7;
3535
padding: 0 .9rem;
3636
font-weight: 700;
3737
letter-spacing: 0.08em;

__stories__/helpers/styled.ts

Lines changed: 9 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -45,9 +45,11 @@ export const Container = styled.div`
4545
export const SelectContainer = styled.div`
4646
width: 60%;
4747
margin-top: 1rem;
48+
4849
${MEDIA_QUERY_IS_TABLET} {
4950
width: 75%;
5051
}
52+
5153
${MEDIA_QUERY_IS_MOBILE} {
5254
width: 100%;
5355
}
@@ -63,6 +65,7 @@ export const Hr = styled.hr`
6365

6466
export const Columns = styled.div`
6567
width: 100%;
68+
6669
${MEDIA_QUERY_IS_TABLET_OR_DESKTOP} {
6770
display: flex;
6871
}
@@ -96,10 +99,12 @@ export const ListWrapper = styled.div`
9699
}
97100
98101
&.is-class-list {
102+
font-weight: 600;
99103
max-width: 100% !important;
104+
100105
ul {
101106
li + li {
102-
margin-top: 0.75em !important;
107+
margin-top: 0.5em !important;
103108
}
104109
}
105110
}
@@ -206,13 +211,15 @@ export const Label = styled.label`
206211
display: inline-block;
207212
vertical-align: middle;
208213
margin: 0.4rem 1.15rem 0rem 0.4rem;
214+
209215
${MEDIA_QUERY_IS_MOBILE} {
210216
margin: 0 auto .25rem auto;
211217
}
212218
`;
213219

214220
export const LabelHeader = styled(Label)`
215221
margin-bottom: 0.4rem;
222+
216223
${MEDIA_QUERY_IS_MOBILE} {
217224
text-align: left;
218225
margin: 0 auto 0.4rem 0;
@@ -221,6 +228,7 @@ export const LabelHeader = styled(Label)`
221228

222229
export const LabelNote = styled(Label)`
223230
margin: 0.5rem auto 0.5rem 0;
231+
224232
${MEDIA_QUERY_IS_MOBILE} {
225233
text-align: left;
226234
margin: 0 auto 0.4rem 0;

__stories__/helpers/utils.ts

Lines changed: 0 additions & 9 deletions
Original file line numberDiff line numberDiff line change
@@ -52,13 +52,4 @@ export const hexToRgba = (hex: string, alpha: number = 1): string => {
5252
rgbaParts.push(alphaValid);
5353

5454
return `rgba(${rgbaParts.join(',')})`;
55-
};
56-
57-
export const rgbToHex = (r: number, g: number, b: number): string => {
58-
const hexParts: string[] = [r, g, b].map((x: number): string => {
59-
const hex = x.toString(16);
60-
return (hex.length === 1) ? `0${hex}` : hex;
61-
});
62-
63-
return `#${hexParts.join('')}`;
6455
};
Lines changed: 2 additions & 2 deletions
Some generated files are not rendered by default. Learn more about customizing how changed files appear on GitHub.

docs/8.58d93af12535efa3b68c.bundle.js.map

Lines changed: 1 addition & 0 deletions
Some generated files are not rendered by default. Learn more about customizing how changed files appear on GitHub.

docs/8.84f253d55c9508e7be4b.bundle.js.map

Lines changed: 0 additions & 1 deletion
This file was deleted.

docs/asset-manifest.json

Lines changed: 32 additions & 32 deletions
Original file line numberDiff line numberDiff line change
@@ -1,41 +1,41 @@
11
{
22
"files": {
3-
"main~24120820.js": "/react-functional-select/main~24120820.84f253d55c9508e7be4b.bundle.js",
4-
"main~24120820.js.map": "/react-functional-select/main~24120820.84f253d55c9508e7be4b.bundle.js.map",
5-
"runtime~main.js": "/react-functional-select/runtime~main.84f253d55c9508e7be4b.bundle.js",
6-
"runtime~main.js.map": "/react-functional-select/runtime~main.84f253d55c9508e7be4b.bundle.js.map",
7-
"vendors~main~1f20a385.js": "/react-functional-select/vendors~main~1f20a385.84f253d55c9508e7be4b.bundle.js",
8-
"vendors~main~1f20a385.js.map": "/react-functional-select/vendors~main~1f20a385.84f253d55c9508e7be4b.bundle.js.map",
9-
"vendors~main~253ae210.js": "/react-functional-select/vendors~main~253ae210.84f253d55c9508e7be4b.bundle.js",
10-
"vendors~main~253ae210.js.map": "/react-functional-select/vendors~main~253ae210.84f253d55c9508e7be4b.bundle.js.map",
11-
"vendors~main~678f84af.js": "/react-functional-select/vendors~main~678f84af.84f253d55c9508e7be4b.bundle.js",
12-
"vendors~main~678f84af.js.map": "/react-functional-select/vendors~main~678f84af.84f253d55c9508e7be4b.bundle.js.map",
13-
"vendors~main~d939e436.js": "/react-functional-select/vendors~main~d939e436.84f253d55c9508e7be4b.bundle.js",
14-
"vendors~main~d939e436.js.map": "/react-functional-select/vendors~main~d939e436.84f253d55c9508e7be4b.bundle.js.map",
15-
"vendors~main~db300d2f.js": "/react-functional-select/vendors~main~db300d2f.84f253d55c9508e7be4b.bundle.js",
16-
"vendors~main~db300d2f.js.map": "/react-functional-select/vendors~main~db300d2f.84f253d55c9508e7be4b.bundle.js.map",
17-
"vendors~main~ec8c427e.js": "/react-functional-select/vendors~main~ec8c427e.84f253d55c9508e7be4b.bundle.js",
18-
"vendors~main~ec8c427e.js.map": "/react-functional-select/vendors~main~ec8c427e.84f253d55c9508e7be4b.bundle.js.map",
19-
"8.84f253d55c9508e7be4b.bundle.js": "/react-functional-select/8.84f253d55c9508e7be4b.bundle.js",
20-
"8.84f253d55c9508e7be4b.bundle.js.map": "/react-functional-select/8.84f253d55c9508e7be4b.bundle.js.map",
3+
"main~24120820.js": "/react-functional-select/main~24120820.58d93af12535efa3b68c.bundle.js",
4+
"main~24120820.js.map": "/react-functional-select/main~24120820.58d93af12535efa3b68c.bundle.js.map",
5+
"runtime~main.js": "/react-functional-select/runtime~main.58d93af12535efa3b68c.bundle.js",
6+
"runtime~main.js.map": "/react-functional-select/runtime~main.58d93af12535efa3b68c.bundle.js.map",
7+
"vendors~main~1f20a385.js": "/react-functional-select/vendors~main~1f20a385.58d93af12535efa3b68c.bundle.js",
8+
"vendors~main~1f20a385.js.map": "/react-functional-select/vendors~main~1f20a385.58d93af12535efa3b68c.bundle.js.map",
9+
"vendors~main~253ae210.js": "/react-functional-select/vendors~main~253ae210.58d93af12535efa3b68c.bundle.js",
10+
"vendors~main~253ae210.js.map": "/react-functional-select/vendors~main~253ae210.58d93af12535efa3b68c.bundle.js.map",
11+
"vendors~main~678f84af.js": "/react-functional-select/vendors~main~678f84af.58d93af12535efa3b68c.bundle.js",
12+
"vendors~main~678f84af.js.map": "/react-functional-select/vendors~main~678f84af.58d93af12535efa3b68c.bundle.js.map",
13+
"vendors~main~d939e436.js": "/react-functional-select/vendors~main~d939e436.58d93af12535efa3b68c.bundle.js",
14+
"vendors~main~d939e436.js.map": "/react-functional-select/vendors~main~d939e436.58d93af12535efa3b68c.bundle.js.map",
15+
"vendors~main~db300d2f.js": "/react-functional-select/vendors~main~db300d2f.58d93af12535efa3b68c.bundle.js",
16+
"vendors~main~db300d2f.js.map": "/react-functional-select/vendors~main~db300d2f.58d93af12535efa3b68c.bundle.js.map",
17+
"vendors~main~ec8c427e.js": "/react-functional-select/vendors~main~ec8c427e.58d93af12535efa3b68c.bundle.js",
18+
"vendors~main~ec8c427e.js.map": "/react-functional-select/vendors~main~ec8c427e.58d93af12535efa3b68c.bundle.js.map",
19+
"8.58d93af12535efa3b68c.bundle.js": "/react-functional-select/8.58d93af12535efa3b68c.bundle.js",
20+
"8.58d93af12535efa3b68c.bundle.js.map": "/react-functional-select/8.58d93af12535efa3b68c.bundle.js.map",
2121
"iframe.html": "/react-functional-select/iframe.html",
22-
"precache-manifest.df20c3c688124848cf11ad0f1ba73754.js": "/react-functional-select/precache-manifest.df20c3c688124848cf11ad0f1ba73754.js",
22+
"precache-manifest.bf6b855ccb6c62b44b5b6247cd8d5689.js": "/react-functional-select/precache-manifest.bf6b855ccb6c62b44b5b6247cd8d5689.js",
2323
"service-worker.js": "/react-functional-select/service-worker.js",
2424
"static/media/react-logo.svg": "/react-functional-select/static/media/react-logo.9f16557d.svg",
25-
"vendors~main~1f20a385.84f253d55c9508e7be4b.bundle.js.LICENSE": "/react-functional-select/vendors~main~1f20a385.84f253d55c9508e7be4b.bundle.js.LICENSE",
26-
"vendors~main~253ae210.84f253d55c9508e7be4b.bundle.js.LICENSE": "/react-functional-select/vendors~main~253ae210.84f253d55c9508e7be4b.bundle.js.LICENSE",
27-
"vendors~main~678f84af.84f253d55c9508e7be4b.bundle.js.LICENSE": "/react-functional-select/vendors~main~678f84af.84f253d55c9508e7be4b.bundle.js.LICENSE",
28-
"vendors~main~db300d2f.84f253d55c9508e7be4b.bundle.js.LICENSE": "/react-functional-select/vendors~main~db300d2f.84f253d55c9508e7be4b.bundle.js.LICENSE",
29-
"vendors~main~ec8c427e.84f253d55c9508e7be4b.bundle.js.LICENSE": "/react-functional-select/vendors~main~ec8c427e.84f253d55c9508e7be4b.bundle.js.LICENSE"
25+
"vendors~main~1f20a385.58d93af12535efa3b68c.bundle.js.LICENSE": "/react-functional-select/vendors~main~1f20a385.58d93af12535efa3b68c.bundle.js.LICENSE",
26+
"vendors~main~253ae210.58d93af12535efa3b68c.bundle.js.LICENSE": "/react-functional-select/vendors~main~253ae210.58d93af12535efa3b68c.bundle.js.LICENSE",
27+
"vendors~main~678f84af.58d93af12535efa3b68c.bundle.js.LICENSE": "/react-functional-select/vendors~main~678f84af.58d93af12535efa3b68c.bundle.js.LICENSE",
28+
"vendors~main~db300d2f.58d93af12535efa3b68c.bundle.js.LICENSE": "/react-functional-select/vendors~main~db300d2f.58d93af12535efa3b68c.bundle.js.LICENSE",
29+
"vendors~main~ec8c427e.58d93af12535efa3b68c.bundle.js.LICENSE": "/react-functional-select/vendors~main~ec8c427e.58d93af12535efa3b68c.bundle.js.LICENSE"
3030
},
3131
"entrypoints": [
32-
"runtime~main.84f253d55c9508e7be4b.bundle.js",
33-
"vendors~main~253ae210.84f253d55c9508e7be4b.bundle.js",
34-
"vendors~main~d939e436.84f253d55c9508e7be4b.bundle.js",
35-
"vendors~main~db300d2f.84f253d55c9508e7be4b.bundle.js",
36-
"vendors~main~1f20a385.84f253d55c9508e7be4b.bundle.js",
37-
"vendors~main~678f84af.84f253d55c9508e7be4b.bundle.js",
38-
"vendors~main~ec8c427e.84f253d55c9508e7be4b.bundle.js",
39-
"main~24120820.84f253d55c9508e7be4b.bundle.js"
32+
"runtime~main.58d93af12535efa3b68c.bundle.js",
33+
"vendors~main~253ae210.58d93af12535efa3b68c.bundle.js",
34+
"vendors~main~d939e436.58d93af12535efa3b68c.bundle.js",
35+
"vendors~main~db300d2f.58d93af12535efa3b68c.bundle.js",
36+
"vendors~main~1f20a385.58d93af12535efa3b68c.bundle.js",
37+
"vendors~main~678f84af.58d93af12535efa3b68c.bundle.js",
38+
"vendors~main~ec8c427e.58d93af12535efa3b68c.bundle.js",
39+
"main~24120820.58d93af12535efa3b68c.bundle.js"
4040
]
4141
}

docs/iframe.html

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -71,4 +71,4 @@
7171
}</script><style>#root[hidden],
7272
#docs-root[hidden] {
7373
display: none !important;
74-
}</style></head><body><div class="sb-nopreview sb-wrapper"><div class="sb-nopreview_main"><h1 class="sb-nopreview_heading sb-heading">No Preview</h1><p>Sorry, but you either have no stories or none are selected somehow.</p><ul><li>Please check the Storybook config.</li><li>Try reloading the page.</li></ul><p>If the problem persists, check the browser console, or the terminal you've run Storybook from.</p></div></div><div class="sb-errordisplay sb-wrapper"><pre id="error-message" class="sb-heading"></pre><pre class="sb-errordisplay_code"><code id="error-stack"></code></pre></div><div id="root"></div><div id="docs-root"></div><script src="runtime~main.84f253d55c9508e7be4b.bundle.js"></script><script src="vendors~main~253ae210.84f253d55c9508e7be4b.bundle.js"></script><script src="vendors~main~d939e436.84f253d55c9508e7be4b.bundle.js"></script><script src="vendors~main~db300d2f.84f253d55c9508e7be4b.bundle.js"></script><script src="vendors~main~1f20a385.84f253d55c9508e7be4b.bundle.js"></script><script src="vendors~main~678f84af.84f253d55c9508e7be4b.bundle.js"></script><script src="vendors~main~ec8c427e.84f253d55c9508e7be4b.bundle.js"></script><script src="main~24120820.84f253d55c9508e7be4b.bundle.js"></script></body></html>
74+
}</style></head><body><div class="sb-nopreview sb-wrapper"><div class="sb-nopreview_main"><h1 class="sb-nopreview_heading sb-heading">No Preview</h1><p>Sorry, but you either have no stories or none are selected somehow.</p><ul><li>Please check the Storybook config.</li><li>Try reloading the page.</li></ul><p>If the problem persists, check the browser console, or the terminal you've run Storybook from.</p></div></div><div class="sb-errordisplay sb-wrapper"><pre id="error-message" class="sb-heading"></pre><pre class="sb-errordisplay_code"><code id="error-stack"></code></pre></div><div id="root"></div><div id="docs-root"></div><script src="runtime~main.58d93af12535efa3b68c.bundle.js"></script><script src="vendors~main~253ae210.58d93af12535efa3b68c.bundle.js"></script><script src="vendors~main~d939e436.58d93af12535efa3b68c.bundle.js"></script><script src="vendors~main~db300d2f.58d93af12535efa3b68c.bundle.js"></script><script src="vendors~main~1f20a385.58d93af12535efa3b68c.bundle.js"></script><script src="vendors~main~678f84af.58d93af12535efa3b68c.bundle.js"></script><script src="vendors~main~ec8c427e.58d93af12535efa3b68c.bundle.js"></script><script src="main~24120820.58d93af12535efa3b68c.bundle.js"></script></body></html>

0 commit comments

Comments
 (0)