-
Notifications
You must be signed in to change notification settings - Fork 0
Commit
This commit does not belong to any branch on this repository, and may belong to a fork outside of the repository.
- Loading branch information
1 parent
f3861c2
commit d466588
Showing
99 changed files
with
14,953 additions
and
452 deletions.
There are no files selected for viewing
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -0,0 +1,21 @@ | ||
| .uncovered { | ||
| background: rgba(235, 26, 26, 0.3); | ||
| } | ||
| .CodeMirror { | ||
| border: 1px solid #ccc; | ||
| border-radius: 3px; | ||
| height: auto; | ||
| } | ||
| .TS-lineuncovered { | ||
| background: rgba(255, 255, 255, 0.3); | ||
| width: 24px; | ||
| } | ||
| /* NOTE: I have to increase the specificity because of semantic-ui */ | ||
| p.footer-text { | ||
| text-align: center; | ||
| margin: 3em 0; | ||
| } | ||
| .gutter-marker { | ||
| text-align: center; | ||
| font-size: 0.6em; | ||
| } |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -0,0 +1,38 @@ | ||
| const CodeMirror = require('codemirror'); | ||
|
|
||
| document.addEventListener('DOMContentLoaded', () => { | ||
| const myTextArea = document.getElementById('editor'); | ||
| const codeMirrorInstance = CodeMirror.fromTextArea(myTextArea, { | ||
| readOnly: true, | ||
| lineNumbers: true, | ||
| lineWrapping: false, | ||
| mode: 'text/typescript', | ||
| gutters: ['TS-lineuncovered', 'CodeMirror-linenumbers'] | ||
| }); | ||
| const annotations = JSON.parse(document.getElementById('annotations').textContent); | ||
| const gutters = {}; | ||
|
|
||
| annotations.forEach((annotation) => { | ||
| gutters[annotation.line] = (gutters[annotation.line] || 0) + 1; | ||
| codeMirrorInstance.markText( | ||
| { line: annotation.line, ch: annotation.character }, | ||
| { | ||
| line: annotation.line, | ||
| ch: annotation.character + annotation.text.length | ||
| }, | ||
| { | ||
| className: 'uncovered' | ||
| } | ||
| ); | ||
| }); | ||
|
|
||
| Object.entries(gutters).forEach(([line, count]) => { | ||
| const gutterMarker = document.createElement('div'); | ||
|
|
||
| gutterMarker.textContent = count + 'x'; | ||
| gutterMarker.classList.add('gutter-marker'); | ||
| gutterMarker.style.background = 'rgba(255,0,0,' + count * 0.2 + ')'; | ||
|
|
||
| codeMirrorInstance.setGutterMarker(+line, 'TS-lineuncovered', gutterMarker); | ||
| }); | ||
| }); |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -0,0 +1,87 @@ | ||
|
|
||
| <!DOCTYPE html> | ||
| <html> | ||
| <head> | ||
| <title>Button.tsx</title> | ||
| <link href="https://cdn.jsdelivr.net/npm/[email protected]/dist/semantic.min.css" type="text/css" rel="stylesheet"> | ||
| <script src="https://cdnjs.cloudflare.com/ajax/libs/codemirror/5.58.2/codemirror.min.js" type="text/javascript" charset="utf-8"></script> | ||
| <script src="https://cdnjs.cloudflare.com/ajax/libs/codemirror/5.58.2/mode/javascript/javascript.min.js" type="text/javascript" charset="utf-8"></script> | ||
| <link href="https://cdnjs.cloudflare.com/ajax/libs/codemirror/5.58.2/codemirror.min.css" type="text/css" rel="stylesheet"> | ||
| <script src="../../../assets/source-file.js" type="text/javascript" charset="utf-8"></script> | ||
| <link href="../../../assets/source-file.css" type="text/css" rel="stylesheet"> | ||
| </head> | ||
| <body> | ||
| <div style="margin-top:3em" class="ui container"><h1 class="ui header"><a href="../../../index.html">TypeScript coverage report</a></h1><table style="margin-top:2em" class="ui celled table"><thead class=""><tr class=""><th class="">Filename</th><th class="">Percent</th><th class="">Threshold</th><th class="">Total</th><th class="">Covered</th><th class="">Uncovered</th></tr></thead><tbody class=""><tr class="positive"><td class="">components/button/Button.tsx</td><td class="">100.00%</td><td class="">80%</td><td class="">66</td><td class="">66</td><td class="">0</td></tr></tbody></table><textarea id="editor" readonly="" style="margin-top:3em">import React from 'react'; | ||
| import { Box, BoxProps, styles } from '@sparkpost/matchbox'; | ||
| import styled from 'styled-components'; | ||
| import css from '@styled-system/css'; | ||
|
|
||
| const StyledButton = styled(Box)<BoxProps>` | ||
| ${styles.buttonReset} | ||
| ${css({ | ||
| border: 'thick', | ||
| px: '400', | ||
| py: '200' | ||
| })} | ||
|
|
||
| cursor: pointer; | ||
| &:hover { | ||
| ${css({ | ||
| bg: 'scheme.lightAccent', | ||
| color: 'scheme.fg' | ||
| })} | ||
| } | ||
|
|
||
| ${({ isActive }) => { | ||
| if (isActive) { | ||
| return css({ | ||
| bg: 'scheme.lightAccent', | ||
| color: 'scheme.heavyAccent', | ||
| pointerEvents: 'none' | ||
| }); | ||
| } | ||
| }} | ||
| `; | ||
|
|
||
| interface ButtonProps extends React.ButtonHTMLAttributes<HTMLButtonElement> { | ||
| /** | ||
| * Disables pointer events and highlights the button | ||
| */ | ||
| active?: boolean; | ||
| children: React.ReactNode; | ||
| } | ||
|
|
||
| function Button(props: ButtonProps): JSX.Element { | ||
| const { children, active, ...rest } = props; | ||
| return ( | ||
| <StyledButton as="button" type="button" {...rest} isActive={active}> | ||
| {children} | ||
| </StyledButton> | ||
| ); | ||
| } | ||
|
|
||
| const StyledGroup = styled.div` | ||
| button:not(:first-child) { | ||
| margin-left: -2px !important; | ||
| } | ||
| `; | ||
|
|
||
| type GroupProps = { | ||
| children: React.ReactNode; | ||
| }; | ||
|
|
||
| /** | ||
| * Collapses borders between child Buttons | ||
| */ | ||
| function Group(props: GroupProps): JSX.Element { | ||
| const { children } = props; | ||
| return <StyledGroup>{children}</StyledGroup>; | ||
| } | ||
|
|
||
| Button.Group = Group; | ||
| export default Button; | ||
| </textarea><pre id="annotations" style="display:none">[]</pre></div> | ||
| <p class="footer-text">TypeScript Coverage Report generated by <a href="https://github.com/plantain-00/type-coverage">type-coverage</a> and <a href="https://github.com/alexcanessa/typescript-coverage-report">typescript-coverage-report</a> at Thu, 11 Aug 2022 15:27:29 GMT</p> | ||
| </body> | ||
| </html> | ||
|
|
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -0,0 +1,19 @@ | ||
|
|
||
| <!DOCTYPE html> | ||
| <html> | ||
| <head> | ||
| <title>index.tsx</title> | ||
| <link href="https://cdn.jsdelivr.net/npm/[email protected]/dist/semantic.min.css" type="text/css" rel="stylesheet"> | ||
| <script src="https://cdnjs.cloudflare.com/ajax/libs/codemirror/5.58.2/codemirror.min.js" type="text/javascript" charset="utf-8"></script> | ||
| <script src="https://cdnjs.cloudflare.com/ajax/libs/codemirror/5.58.2/mode/javascript/javascript.min.js" type="text/javascript" charset="utf-8"></script> | ||
| <link href="https://cdnjs.cloudflare.com/ajax/libs/codemirror/5.58.2/codemirror.min.css" type="text/css" rel="stylesheet"> | ||
| <script src="../../../assets/source-file.js" type="text/javascript" charset="utf-8"></script> | ||
| <link href="../../../assets/source-file.css" type="text/css" rel="stylesheet"> | ||
| </head> | ||
| <body> | ||
| <div style="margin-top:3em" class="ui container"><h1 class="ui header"><a href="../../../index.html">TypeScript coverage report</a></h1><table style="margin-top:2em" class="ui celled table"><thead class=""><tr class=""><th class="">Filename</th><th class="">Percent</th><th class="">Threshold</th><th class="">Total</th><th class="">Covered</th><th class="">Uncovered</th></tr></thead><tbody class=""><tr class="positive"><td class="">components/button/index.tsx</td><td class="">100.00%</td><td class="">80%</td><td class="">2</td><td class="">2</td><td class="">0</td></tr></tbody></table><textarea id="editor" readonly="" style="margin-top:3em">export { default as Button } from './Button'; | ||
| </textarea><pre id="annotations" style="display:none">[]</pre></div> | ||
| <p class="footer-text">TypeScript Coverage Report generated by <a href="https://github.com/plantain-00/type-coverage">type-coverage</a> and <a href="https://github.com/alexcanessa/typescript-coverage-report">typescript-coverage-report</a> at Thu, 11 Aug 2022 15:27:29 GMT</p> | ||
| </body> | ||
| </html> | ||
|
|
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -0,0 +1,218 @@ | ||
|
|
||
| <!DOCTYPE html> | ||
| <html> | ||
| <head> | ||
| <title>card.tsx</title> | ||
| <link href="https://cdn.jsdelivr.net/npm/[email protected]/dist/semantic.min.css" type="text/css" rel="stylesheet"> | ||
| <script src="https://cdnjs.cloudflare.com/ajax/libs/codemirror/5.58.2/codemirror.min.js" type="text/javascript" charset="utf-8"></script> | ||
| <script src="https://cdnjs.cloudflare.com/ajax/libs/codemirror/5.58.2/mode/javascript/javascript.min.js" type="text/javascript" charset="utf-8"></script> | ||
| <link href="https://cdnjs.cloudflare.com/ajax/libs/codemirror/5.58.2/codemirror.min.css" type="text/css" rel="stylesheet"> | ||
| <script src="../../../assets/source-file.js" type="text/javascript" charset="utf-8"></script> | ||
| <link href="../../../assets/source-file.css" type="text/css" rel="stylesheet"> | ||
| </head> | ||
| <body> | ||
| <div style="margin-top:3em" class="ui container"><h1 class="ui header"><a href="../../../index.html">TypeScript coverage report</a></h1><table style="margin-top:2em" class="ui celled table"><thead class=""><tr class=""><th class="">Filename</th><th class="">Percent</th><th class="">Threshold</th><th class="">Total</th><th class="">Covered</th><th class="">Uncovered</th></tr></thead><tbody class=""><tr class="positive"><td class="">components/card/card.tsx</td><td class="">91.19%</td><td class="">80%</td><td class="">193</td><td class="">176</td><td class="">17</td></tr></tbody></table><textarea id="editor" readonly="" style="margin-top:3em">import React from 'react'; | ||
| import Link from 'next/link'; | ||
| import { Box, BoxProps } from '@sparkpost/matchbox'; | ||
| import { SimplePortableText } from '@lib/sanity'; | ||
| import { ArrowForward } from '@sparkpost/matchbox-icons'; | ||
| import styled from 'styled-components'; | ||
| import css from '@styled-system/css'; | ||
| import { formatDate } from '@utils/date'; | ||
| import { Category, categoryColors } from '@components/category'; | ||
|
|
||
| // Turns block content into plain text | ||
| function toPlainText(blocks = []) { | ||
| return ( | ||
| blocks | ||
| // loop through each block | ||
| .map((block) => { | ||
| // if it's not a text block with children or if it is a header, | ||
| // return nothing | ||
| if (block._type !== 'block' || !block.children || /^h\d/.test(block.style)) { | ||
| return ''; | ||
| } | ||
| // loop through the children spans, and join the | ||
| // text strings | ||
| return block.children.map((child) => child.text).join(''); | ||
| }) | ||
| // join the paragraphs leaving split by two linebreaks | ||
| .join('\n\n') | ||
| ); | ||
| } | ||
|
|
||
| // TODO: this is temporary, need to find a better way to scale cards | ||
| function getRatio(span) { | ||
| if (span > 5) { | ||
| return '25%'; | ||
| } | ||
|
|
||
| return ['40%', null, '82%', '60%', '44%']; | ||
| } | ||
|
|
||
| const HoverBox = styled.div<BoxProps & { $index: number; $span: number; $url: string }>` | ||
| position: absolute; | ||
| width: 100%; | ||
| height: 100%; | ||
| top: 0; | ||
| left: 0; | ||
| transform: translate3d(0, 0, 0); | ||
| transition: transform 200ms ease-in-out, z-index 200ms linear; | ||
| z-index: 0; | ||
|
|
||
| ${({ $url, $index }) => { | ||
| return ` | ||
| cursor: ${$url ? 'pointer' : ''}; | ||
| &:hover { | ||
| transition: transform 200ms ease-in-out, z-index 200ms linear; | ||
| z-index: ${$url ? ($index === 0 ? 2 : 1) : 0}; | ||
| } | ||
| `; | ||
| }}; | ||
|
|
||
| ${({ $index, $span, $url }) => | ||
| css({ | ||
| bg: 'scheme.bg', | ||
| p: ['300', null, null, '400', '600'], | ||
| border: 'thick', | ||
| 'user-select': ['none', null, 'inherit'], | ||
| '&:hover, &:active': { | ||
| transform: [ | ||
| `translate3d(0, 0, 0)`, | ||
| null, | ||
| $url | ||
| ? `translate3d(${($index * $span) % 12 === 0 ? '12px' : '-12px'}, -12px, 0)` | ||
| : 'translate3d(0, 0, 0)' | ||
| ] | ||
| } | ||
| })} | ||
| `; | ||
|
|
||
| const BorderBox = styled(Box)<BoxProps>` | ||
| margin-top: -1px; | ||
| margin-left: -1px; | ||
| margin-bottom: -1px; | ||
| margin-right: -1px; | ||
| text-decoration: none; | ||
| display: block; | ||
|
|
||
| &, | ||
| &:visited, | ||
| &:hover { | ||
| ${css({ color: 'scheme.fg' })} | ||
| } | ||
| &:focus { | ||
| outline: none; | ||
| } | ||
| `; | ||
|
|
||
| const NegateMargins = styled.div` | ||
| * { | ||
| margin-bottom: 0; | ||
| padding-top: 0; | ||
| } | ||
| `; | ||
|
|
||
| type CardProps = { | ||
| content?: Array<any>; | ||
| date?: string; | ||
| enableCategory?: boolean; | ||
| excerpt?: object[]; | ||
| index?: number; // Used to animate to the right instead of left | ||
| span: number; | ||
| mobileSpan?: number; | ||
| subtitle?: string; | ||
| title?: string; | ||
| url: string; | ||
| }; | ||
|
|
||
| const Card: React.FC<CardProps> = (props: CardProps) => { | ||
| const { url, span, mobileSpan, index, content, title, subtitle, enableCategory, date, excerpt } = | ||
| props; | ||
|
|
||
| const category = React.useMemo(() => { | ||
| if (!url) { | ||
| return ''; | ||
| } | ||
| return url.split('/')?.[1]; | ||
| }, [url]); | ||
|
|
||
| const accentColor = React.useMemo(() => { | ||
| if (!url) { | ||
| return 'scheme.heavyAccent'; | ||
| } | ||
|
|
||
| return categoryColors[category]?.bg || 'scheme.heavyAccent'; | ||
| }, [category, url]); | ||
|
|
||
| const smallSpan = mobileSpan || '6'; | ||
|
|
||
| const card = ( | ||
| <BorderBox | ||
| gridColumn={[`span ${smallSpan}`, null, `span ${span}`]} | ||
| pb={getRatio(span)} | ||
| minHeight="12rem" | ||
| position="relative" | ||
| as={url ? 'a' : 'div'} | ||
| > | ||
| <Box | ||
| position="absolute" | ||
| width="100%" | ||
| height="100%" | ||
| top="0" | ||
| left="0" | ||
| bg={accentColor} | ||
| border="thick" | ||
| /> | ||
| <HoverBox $url={url} p={['200', null, '600']} $index={index} $span={span}> | ||
| {enableCategory && url && <Category category={category} />} | ||
| {date && ( | ||
| <Box fontSize="100" mb="0" lineHeight="100"> | ||
| {formatDate(date)} | ||
| </Box> | ||
| )} | ||
| {title && ( | ||
| <Box fontSize="300" fontWeight="500" mb="200"> | ||
| {title} | ||
| </Box> | ||
| )} | ||
| {subtitle && ( | ||
| <Box fontSize="200" lineHeight="200" mb="200"> | ||
| {subtitle} | ||
| </Box> | ||
| )} | ||
| {excerpt && ( | ||
| <Box fontSize="200" lineHeight="200" mb="200"> | ||
| {toPlainText(excerpt).substring(0, 180)} | ||
| {toPlainText(excerpt).substring(0, 180).length > 179 ? '...' : ''} | ||
| </Box> | ||
| )} | ||
| {content && ( | ||
| <NegateMargins> | ||
| <SimplePortableText blocks={content} /> | ||
| </NegateMargins> | ||
| )} | ||
| {url && ( | ||
| <Box mt="100"> | ||
| <ArrowForward /> | ||
| </Box> | ||
| )} | ||
| </HoverBox> | ||
| </BorderBox> | ||
| ); | ||
|
|
||
| return url ? ( | ||
| <Link href={url} passHref> | ||
| {card} | ||
| </Link> | ||
| ) : ( | ||
| <>{card}</> | ||
| ); | ||
| }; | ||
|
|
||
| export default Card; | ||
| </textarea><pre id="annotations" style="display:none">[{"file":"components/card/card.tsx","line":15,"character":12,"text":"block","kind":1},{"file":"components/card/card.tsx","line":18,"character":12,"text":"block","kind":1},{"file":"components/card/card.tsx","line":18,"character":18,"text":"_type","kind":1},{"file":"components/card/card.tsx","line":18,"character":40,"text":"block","kind":1},{"file":"components/card/card.tsx","line":18,"character":46,"text":"children","kind":1},{"file":"components/card/card.tsx","line":18,"character":70,"text":"block","kind":1},{"file":"components/card/card.tsx","line":18,"character":76,"text":"style","kind":1},{"file":"components/card/card.tsx","line":23,"character":15,"text":"block","kind":1},{"file":"components/card/card.tsx","line":23,"character":21,"text":"children","kind":1},{"file":"components/card/card.tsx","line":23,"character":30,"text":"map","kind":1},{"file":"components/card/card.tsx","line":23,"character":35,"text":"child","kind":1},{"file":"components/card/card.tsx","line":23,"character":45,"text":"child","kind":1},{"file":"components/card/card.tsx","line":23,"character":51,"text":"text","kind":1},{"file":"components/card/card.tsx","line":23,"character":57,"text":"join","kind":1},{"file":"components/card/card.tsx","line":31,"character":18,"text":"span","kind":1},{"file":"components/card/card.tsx","line":32,"character":6,"text":"span","kind":1},{"file":"components/card/card.tsx","line":126,"character":8,"text":"accentColor","kind":1}]</pre></div> | ||
| <p class="footer-text">TypeScript Coverage Report generated by <a href="https://github.com/plantain-00/type-coverage">type-coverage</a> and <a href="https://github.com/alexcanessa/typescript-coverage-report">typescript-coverage-report</a> at Thu, 11 Aug 2022 15:27:29 GMT</p> | ||
| </body> | ||
| </html> | ||
|
|
Oops, something went wrong.