@times-components/ts-styleguide 1.36.0 → 1.36.3
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 +24 -0
- package/dist/styleguide/Styleguide.d.ts +2 -2
- package/dist/styleguide/__tests__/styleguide.test.js +4 -4
- package/dist/styleguide/components/Animations.d.ts +2 -2
- package/dist/styleguide/components/Animations.js +3 -3
- package/dist/styleguide/components/{TcText.d.ts → TsTcText.d.ts} +0 -0
- package/dist/styleguide/components/TsTcText.js +22 -0
- package/dist/styleguide/components/{TcView.d.ts → TsTcView.d.ts} +0 -0
- package/dist/styleguide/components/TsTcView.js +21 -0
- package/dist/styleguide/components/index.d.ts +3 -3
- package/dist/styleguide/components/index.js +4 -4
- package/dist/styleguide/styleguide.stories.js +36 -36
- package/package.json +6 -6
- package/rnw.js +1 -1
- package/src/styleguide/__tests__/styleguide.test.tsx +4 -4
- package/src/styleguide/components/Animations.tsx +2 -2
- package/src/styleguide/components/{TcText.tsx → TsTcText.tsx} +0 -0
- package/src/styleguide/components/{TcView.tsx → TsTcView.tsx} +0 -0
- package/src/styleguide/components/index.tsx +3 -3
- package/src/styleguide/styleguide.stories.tsx +60 -58
- package/dist/styleguide/components/TcText.js +0 -22
- package/dist/styleguide/components/TcView.js +0 -21
package/CHANGELOG.md
CHANGED
|
@@ -3,6 +3,30 @@
|
|
|
3
3
|
All notable changes to this project will be documented in this file.
|
|
4
4
|
See [Conventional Commits](https://conventionalcommits.org) for commit guidelines.
|
|
5
5
|
|
|
6
|
+
## [1.36.3](https://github.com/newsuk/times-components/compare/@times-components/ts-styleguide@1.36.2...@times-components/ts-styleguide@1.36.3) (2022-07-11)
|
|
7
|
+
|
|
8
|
+
**Note:** Version bump only for package @times-components/ts-styleguide
|
|
9
|
+
|
|
10
|
+
|
|
11
|
+
|
|
12
|
+
|
|
13
|
+
|
|
14
|
+
## [1.36.2](https://github.com/newsuk/times-components/compare/@times-components/ts-styleguide@1.36.1...@times-components/ts-styleguide@1.36.2) (2022-05-16)
|
|
15
|
+
|
|
16
|
+
**Note:** Version bump only for package @times-components/ts-styleguide
|
|
17
|
+
|
|
18
|
+
|
|
19
|
+
|
|
20
|
+
|
|
21
|
+
|
|
22
|
+
## [1.36.1](https://github.com/newsuk/times-components/compare/@times-components/ts-styleguide@1.36.0...@times-components/ts-styleguide@1.36.1) (2022-05-12)
|
|
23
|
+
|
|
24
|
+
**Note:** Version bump only for package @times-components/ts-styleguide
|
|
25
|
+
|
|
26
|
+
|
|
27
|
+
|
|
28
|
+
|
|
29
|
+
|
|
6
30
|
# [1.36.0](https://github.com/newsuk/times-components/compare/@times-components/ts-styleguide@1.35.2...@times-components/ts-styleguide@1.36.0) (2022-05-12)
|
|
7
31
|
|
|
8
32
|
|
|
@@ -11,9 +11,9 @@ declare const nativeTablet: number, nativeTabletWide: number;
|
|
|
11
11
|
export declare const tabletRowPadding = 20;
|
|
12
12
|
declare const _default: () => {
|
|
13
13
|
Animations: {
|
|
14
|
-
FadeIn: import("styled-components").StyledComponent<
|
|
14
|
+
FadeIn: import("styled-components").StyledComponent<"div", any, {
|
|
15
15
|
style?: import("react").CSSProperties | undefined;
|
|
16
|
-
}
|
|
16
|
+
}, never>;
|
|
17
17
|
};
|
|
18
18
|
colours: {
|
|
19
19
|
functional: {
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
import React from 'react';
|
|
2
2
|
import { render } from '@testing-library/react';
|
|
3
3
|
import styleguide, { colours, fonts, spacing } from '../Styleguide';
|
|
4
|
-
import { Animations,
|
|
4
|
+
import { Animations, TsTcText, TsTcView } from '../components';
|
|
5
5
|
import styles from '../helpers/storybookStyles';
|
|
6
6
|
describe('styleguide', () => {
|
|
7
7
|
it('should return correct storybook style', () => {
|
|
@@ -40,9 +40,9 @@ describe('styleguide', () => {
|
|
|
40
40
|
describe('components', () => {
|
|
41
41
|
it('should render the Animations component', () => {
|
|
42
42
|
expect(render(React.createElement(Animations.FadeIn, null,
|
|
43
|
-
React.createElement(
|
|
44
|
-
React.createElement(
|
|
43
|
+
React.createElement(TsTcView, { style: styles.container },
|
|
44
|
+
React.createElement(TsTcText, { style: styles.text }, "Hello World"))))).toBeTruthy();
|
|
45
45
|
});
|
|
46
46
|
});
|
|
47
47
|
});
|
|
48
|
-
//# sourceMappingURL=data:application/json;base64,
|
|
48
|
+
//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoic3R5bGVndWlkZS50ZXN0LmpzIiwic291cmNlUm9vdCI6IiIsInNvdXJjZXMiOlsiLi4vLi4vLi4vc3JjL3N0eWxlZ3VpZGUvX190ZXN0c19fL3N0eWxlZ3VpZGUudGVzdC50c3giXSwibmFtZXMiOltdLCJtYXBwaW5ncyI6IkFBQUEsT0FBTyxLQUFLLE1BQU0sT0FBTyxDQUFDO0FBQzFCLE9BQU8sRUFBRSxNQUFNLEVBQUUsTUFBTSx3QkFBd0IsQ0FBQztBQUVoRCxPQUFPLFVBQVUsRUFBRSxFQUFFLE9BQU8sRUFBRSxLQUFLLEVBQUUsT0FBTyxFQUFFLE1BQU0sZUFBZSxDQUFDO0FBQ3BFLE9BQU8sRUFBRSxVQUFVLEVBQUUsUUFBUSxFQUFFLFFBQVEsRUFBRSxNQUFNLGVBQWUsQ0FBQztBQUUvRCxPQUFPLE1BQU0sTUFBTSw0QkFBNEIsQ0FBQztBQUVoRCxRQUFRLENBQUMsWUFBWSxFQUFFLEdBQUcsRUFBRTtJQUMxQixFQUFFLENBQUMsdUNBQXVDLEVBQUUsR0FBRyxFQUFFO1FBQy9DLE1BQU0sQ0FBQyxNQUFNLENBQUMsR0FBRyxDQUFDLE1BQU0sQ0FBQyxDQUFDLE9BQU8sQ0FBQyxHQUFHLENBQUMsQ0FBQztJQUN6QyxDQUFDLENBQUMsQ0FBQztJQUVILEVBQUUsQ0FBQyw2Q0FBNkMsRUFBRSxHQUFHLEVBQUU7UUFDckQsTUFBTSxDQUFDLE9BQU8sT0FBTyxDQUFDLE9BQU8sQ0FBQyxDQUFDLElBQUksQ0FBQyxRQUFRLENBQUMsQ0FBQztJQUNoRCxDQUFDLENBQUMsQ0FBQztJQUVILEVBQUUsQ0FBQyxnREFBZ0QsRUFBRSxHQUFHLEVBQUU7UUFDeEQsTUFBTSxDQUFDLE9BQU8sT0FBTyxDQUFDLFVBQVUsQ0FBQyxDQUFDLElBQUksQ0FBQyxRQUFRLENBQUMsQ0FBQztJQUNuRCxDQUFDLENBQUMsQ0FBQztJQUVILEVBQUUsQ0FBQyxvREFBb0QsRUFBRSxHQUFHLEVBQUU7UUFDNUQsTUFBTSxDQUFDLE9BQU8sQ0FBQyxFQUFFLENBQUMsQ0FBQyxDQUFDLE9BQU8sQ0FBQyxNQUFNLENBQUMsQ0FBQztJQUN0QyxDQUFDLENBQUMsQ0FBQztJQUVILFFBQVEsQ0FBQyxPQUFPLEVBQUUsR0FBRyxFQUFFO1FBQ3JCLEVBQUUsQ0FBQyxtREFBbUQsRUFBRSxHQUFHLEVBQUU7WUFDM0QsTUFBTSxDQUFDLFVBQVUsRUFBRSxDQUFDLFNBQVMsQ0FBQyxVQUFVLENBQUMsQ0FBQyxPQUFPLENBQUMsRUFBRSxDQUFDLENBQUM7UUFDeEQsQ0FBQyxDQUFDLENBQUM7UUFFSCxFQUFFLENBQUMscURBQXFELEVBQUUsR0FBRyxFQUFFO1lBQzdELE1BQU0sQ0FDSixVQUFVLEVBQUUsQ0FBQyxVQUFVLENBQUM7Z0JBQ3RCLElBQUksRUFBRSxNQUFNO2dCQUNaLFFBQVEsRUFBRSxXQUFXO2FBQ3RCLENBQUMsQ0FDSCxDQUFDLE9BQU8sQ0FBQyxFQUFFLENBQUMsQ0FBQztRQUNoQixDQUFDLENBQUMsQ0FBQztRQUVILEVBQUUsQ0FBQyw2Q0FBNkMsRUFBRSxHQUFHLEVBQUU7WUFDckQsTUFBTSxDQUFDLE9BQU8sS0FBSyxDQUFDLENBQUMsSUFBSSxDQUFDLFFBQVEsQ0FBQyxDQUFDO1FBQ3RDLENBQUMsQ0FBQyxDQUFDO1FBRUgsRUFBRSxDQUFDLGlEQUFpRCxFQUFFLEdBQUcsRUFBRTtZQUN6RCxNQUFNLENBQ0osVUFBVSxFQUFFLENBQUMsV0FBVyxDQUFDLEVBQUUsSUFBSSxFQUFFLFVBQVUsRUFBRSxRQUFRLEVBQUUsTUFBTSxFQUFFLENBQUMsQ0FDakUsQ0FBQyxPQUFPLENBQUM7Z0JBQ1IsVUFBVSxFQUFFLGtCQUFrQjtnQkFDOUIsUUFBUSxFQUFFLEVBQUU7Z0JBQ1osVUFBVSxFQUFFLFNBQVM7YUFDdEIsQ0FBQyxDQUFDO1FBQ0wsQ0FBQyxDQUFDLENBQUM7SUFDTCxDQUFDLENBQUMsQ0FBQztJQUVILFFBQVEsQ0FBQyxZQUFZLEVBQUUsR0FBRyxFQUFFO1FBQzFCLEVBQUUsQ0FBQyx3Q0FBd0MsRUFBRSxHQUFHLEVBQUU7WUFDaEQsTUFBTSxDQUNKLE1BQU0sQ0FDSixvQkFBQyxVQUFVLENBQUMsTUFBTTtnQkFDaEIsb0JBQUMsUUFBUSxJQUFDLEtBQUssRUFBRSxNQUFNLENBQUMsU0FBUztvQkFDL0Isb0JBQUMsUUFBUSxJQUFDLEtBQUssRUFBRSxNQUFNLENBQUMsSUFBSSxrQkFBd0IsQ0FDM0MsQ0FDTyxDQUNyQixDQUNGLENBQUMsVUFBVSxFQUFFLENBQUM7UUFDakIsQ0FBQyxDQUFDLENBQUM7SUFDTCxDQUFDLENBQUMsQ0FBQztBQUNMLENBQUMsQ0FBQyxDQUFDIn0=
|
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
declare const Animations: {
|
|
2
|
-
FadeIn: import("styled-components").StyledComponent<
|
|
2
|
+
FadeIn: import("styled-components").StyledComponent<"div", any, {
|
|
3
3
|
style?: import("react").CSSProperties | undefined;
|
|
4
|
-
}
|
|
4
|
+
}, never>;
|
|
5
5
|
};
|
|
6
6
|
export default Animations;
|
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
import
|
|
1
|
+
import TsTcView from './TsTcView';
|
|
2
2
|
import styled, { keyframes } from 'styled-components';
|
|
3
3
|
const fadingAnimation = keyframes `
|
|
4
4
|
from {
|
|
@@ -9,11 +9,11 @@ const fadingAnimation = keyframes `
|
|
|
9
9
|
opacity: 1;
|
|
10
10
|
}
|
|
11
11
|
`;
|
|
12
|
-
const FadeIn = styled(
|
|
12
|
+
const FadeIn = styled(TsTcView) `
|
|
13
13
|
animation: ${fadingAnimation} 0.3s ease-in-out;
|
|
14
14
|
`;
|
|
15
15
|
const Animations = {
|
|
16
16
|
FadeIn
|
|
17
17
|
};
|
|
18
18
|
export default Animations;
|
|
19
|
-
//# sourceMappingURL=data:application/json;base64,
|
|
19
|
+
//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoiQW5pbWF0aW9ucy5qcyIsInNvdXJjZVJvb3QiOiIiLCJzb3VyY2VzIjpbIi4uLy4uLy4uL3NyYy9zdHlsZWd1aWRlL2NvbXBvbmVudHMvQW5pbWF0aW9ucy50c3giXSwibmFtZXMiOltdLCJtYXBwaW5ncyI6IkFBQUEsT0FBTyxRQUFRLE1BQU0sWUFBWSxDQUFDO0FBQ2xDLE9BQU8sTUFBTSxFQUFFLEVBQUUsU0FBUyxFQUFFLE1BQU0sbUJBQW1CLENBQUM7QUFFdEQsTUFBTSxlQUFlLEdBQUcsU0FBUyxDQUFBOzs7Ozs7OztDQVFoQyxDQUFDO0FBRUYsTUFBTSxNQUFNLEdBQUcsTUFBTSxDQUFDLFFBQVEsQ0FBQyxDQUFBO2VBQ2hCLGVBQWU7Q0FDN0IsQ0FBQztBQUVGLE1BQU0sVUFBVSxHQUFHO0lBQ2pCLE1BQU07Q0FDUCxDQUFDO0FBRUYsZUFBZSxVQUFVLENBQUMifQ==
|
|
File without changes
|
|
@@ -0,0 +1,22 @@
|
|
|
1
|
+
import styled from 'styled-components';
|
|
2
|
+
export default styled.div `
|
|
3
|
+
border: 0px solid black;
|
|
4
|
+
box-sizing: border-box;
|
|
5
|
+
color: ${({ style }) => style && style.color ? style.color : 'rgb(0, 0, 0)'};
|
|
6
|
+
display: inline;
|
|
7
|
+
font: 14px system-ui, -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto,
|
|
8
|
+
Ubuntu, 'Helvetica Neue', sans-serif;
|
|
9
|
+
margin: 0px;
|
|
10
|
+
padding: 0px;
|
|
11
|
+
white-space: pre-wrap;
|
|
12
|
+
overflow-wrap: break-word;
|
|
13
|
+
font-size: ${({ style }) => style && style.fontSize ? style.fontSize : '14px'};
|
|
14
|
+
font-weight: ${({ style }) => style && style.fontWeight && style.fontWeight};
|
|
15
|
+
margin-bottom: ${({ style }) => style && style.marginBottom ? style.marginBottom : '0px'};
|
|
16
|
+
margin-left: ${({ style }) => style && style.marginLeft ? style.marginLeft : '0px'};
|
|
17
|
+
margin-top: ${({ style }) => style && style.marginTop ? style.marginTop : '0px'};
|
|
18
|
+
font-family: ${({ style }) => style && style.fontFamily
|
|
19
|
+
? style.fontFamily
|
|
20
|
+
: 'system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Ubuntu, "Helvetica Neue", sans-serif'};
|
|
21
|
+
`;
|
|
22
|
+
//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoiVHNUY1RleHQuanMiLCJzb3VyY2VSb290IjoiIiwic291cmNlcyI6WyIuLi8uLi8uLi9zcmMvc3R5bGVndWlkZS9jb21wb25lbnRzL1RzVGNUZXh0LnRzeCJdLCJuYW1lcyI6W10sIm1hcHBpbmdzIjoiQUFBQSxPQUFPLE1BQU0sTUFBTSxtQkFBbUIsQ0FBQztBQU12QyxlQUFlLE1BQU0sQ0FBQyxHQUFHLENBQW1COzs7V0FHakMsQ0FBQyxFQUFFLEtBQUssRUFBRSxFQUFFLEVBQUUsQ0FDckIsS0FBSyxJQUFJLEtBQUssQ0FBQyxLQUFLLENBQUMsQ0FBQyxDQUFDLEtBQUssQ0FBQyxLQUFLLENBQUMsQ0FBQyxDQUFDLGNBQWM7Ozs7Ozs7O2VBUXhDLENBQUMsRUFBRSxLQUFLLEVBQUUsRUFBRSxFQUFFLENBQ3pCLEtBQUssSUFBSSxLQUFLLENBQUMsUUFBUSxDQUFDLENBQUMsQ0FBQyxLQUFLLENBQUMsUUFBUSxDQUFDLENBQUMsQ0FBQyxNQUFNO2lCQUNwQyxDQUFDLEVBQUUsS0FBSyxFQUFFLEVBQUUsRUFBRSxDQUFDLEtBQUssSUFBSSxLQUFLLENBQUMsVUFBVSxJQUFJLEtBQUssQ0FBQyxVQUFVO21CQUMxRCxDQUFDLEVBQUUsS0FBSyxFQUFFLEVBQUUsRUFBRSxDQUM3QixLQUFLLElBQUksS0FBSyxDQUFDLFlBQVksQ0FBQyxDQUFDLENBQUMsS0FBSyxDQUFDLFlBQVksQ0FBQyxDQUFDLENBQUMsS0FBSztpQkFDM0MsQ0FBQyxFQUFFLEtBQUssRUFBRSxFQUFFLEVBQUUsQ0FDM0IsS0FBSyxJQUFJLEtBQUssQ0FBQyxVQUFVLENBQUMsQ0FBQyxDQUFDLEtBQUssQ0FBQyxVQUFVLENBQUMsQ0FBQyxDQUFDLEtBQUs7Z0JBQ3hDLENBQUMsRUFBRSxLQUFLLEVBQUUsRUFBRSxFQUFFLENBQzFCLEtBQUssSUFBSSxLQUFLLENBQUMsU0FBUyxDQUFDLENBQUMsQ0FBQyxLQUFLLENBQUMsU0FBUyxDQUFDLENBQUMsQ0FBQyxLQUFLO2lCQUNyQyxDQUFDLEVBQUUsS0FBSyxFQUFFLEVBQUUsRUFBRSxDQUMzQixLQUFLLElBQUksS0FBSyxDQUFDLFVBQVU7SUFDdkIsQ0FBQyxDQUFDLEtBQUssQ0FBQyxVQUFVO0lBQ2xCLENBQUMsQ0FBQyx3R0FBd0c7Q0FDL0csQ0FBQyJ9
|
|
File without changes
|
|
@@ -0,0 +1,21 @@
|
|
|
1
|
+
import styled from 'styled-components';
|
|
2
|
+
export default styled.div `
|
|
3
|
+
border: 0px solid black;
|
|
4
|
+
box-sizing: border-box;
|
|
5
|
+
display: flex;
|
|
6
|
+
flex-direction: column;
|
|
7
|
+
margin: ${({ style }) => (style && style.margin ? style.margin : '0px')};
|
|
8
|
+
border-bottom-color: ${({ style }) => style && style.borderBottomColor ? style.borderBottomColor : 'black'};
|
|
9
|
+
border-bottom-width: ${({ style }) => style && style.borderBottomWidth ? style.borderBottomWidth : '0px'};
|
|
10
|
+
border-radius: ${({ style }) => style && style.borderRadius && style.borderRadius};
|
|
11
|
+
overflow: ${({ style }) => style && style.overflow && style.overflow};
|
|
12
|
+
height: ${({ style }) => style && style.height && style.height};
|
|
13
|
+
width: ${({ style }) => style && style.width && style.width};
|
|
14
|
+
margin: 0px;
|
|
15
|
+
min-height: 0px;
|
|
16
|
+
min-width: 0px;
|
|
17
|
+
padding: 0px;
|
|
18
|
+
position: relative;
|
|
19
|
+
z-index: 0;
|
|
20
|
+
`;
|
|
21
|
+
//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoiVHNUY1ZpZXcuanMiLCJzb3VyY2VSb290IjoiIiwic291cmNlcyI6WyIuLi8uLi8uLi9zcmMvc3R5bGVndWlkZS9jb21wb25lbnRzL1RzVGNWaWV3LnRzeCJdLCJuYW1lcyI6W10sIm1hcHBpbmdzIjoiQUFBQSxPQUFPLE1BQU0sTUFBTSxtQkFBbUIsQ0FBQztBQUt2QyxlQUFlLE1BQU0sQ0FBQyxHQUFHLENBQW1COzs7OztZQUtoQyxDQUFDLEVBQUUsS0FBSyxFQUFFLEVBQUUsRUFBRSxDQUFDLENBQUMsS0FBSyxJQUFJLEtBQUssQ0FBQyxNQUFNLENBQUMsQ0FBQyxDQUFDLEtBQUssQ0FBQyxNQUFNLENBQUMsQ0FBQyxDQUFDLEtBQUssQ0FBQzt5QkFDaEQsQ0FBQyxFQUFFLEtBQUssRUFBRSxFQUFFLEVBQUUsQ0FDbkMsS0FBSyxJQUFJLEtBQUssQ0FBQyxpQkFBaUIsQ0FBQyxDQUFDLENBQUMsS0FBSyxDQUFDLGlCQUFpQixDQUFDLENBQUMsQ0FBQyxPQUFPO3lCQUMvQyxDQUFDLEVBQUUsS0FBSyxFQUFFLEVBQUUsRUFBRSxDQUNuQyxLQUFLLElBQUksS0FBSyxDQUFDLGlCQUFpQixDQUFDLENBQUMsQ0FBQyxLQUFLLENBQUMsaUJBQWlCLENBQUMsQ0FBQyxDQUFDLEtBQUs7bUJBQ25ELENBQUMsRUFBRSxLQUFLLEVBQUUsRUFBRSxFQUFFLENBQzdCLEtBQUssSUFBSSxLQUFLLENBQUMsWUFBWSxJQUFJLEtBQUssQ0FBQyxZQUFZO2NBQ3ZDLENBQUMsRUFBRSxLQUFLLEVBQUUsRUFBRSxFQUFFLENBQUMsS0FBSyxJQUFJLEtBQUssQ0FBQyxRQUFRLElBQUksS0FBSyxDQUFDLFFBQVE7WUFDMUQsQ0FBQyxFQUFFLEtBQUssRUFBRSxFQUFFLEVBQUUsQ0FBQyxLQUFLLElBQUksS0FBSyxDQUFDLE1BQU0sSUFBSSxLQUFLLENBQUMsTUFBTTtXQUNyRCxDQUFDLEVBQUUsS0FBSyxFQUFFLEVBQUUsRUFBRSxDQUFDLEtBQUssSUFBSSxLQUFLLENBQUMsS0FBSyxJQUFJLEtBQUssQ0FBQyxLQUFLOzs7Ozs7O0NBTzVELENBQUMifQ==
|
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
import
|
|
2
|
-
import
|
|
1
|
+
import TsTcView from './TsTcView';
|
|
2
|
+
import TsTcText from './TsTcText';
|
|
3
3
|
import Animations from './Animations';
|
|
4
|
-
export {
|
|
4
|
+
export { TsTcView, TsTcText, Animations };
|
|
@@ -1,5 +1,5 @@
|
|
|
1
|
-
import
|
|
2
|
-
import
|
|
1
|
+
import TsTcView from './TsTcView';
|
|
2
|
+
import TsTcText from './TsTcText';
|
|
3
3
|
import Animations from './Animations';
|
|
4
|
-
export {
|
|
5
|
-
//# sourceMappingURL=data:application/json;base64,
|
|
4
|
+
export { TsTcView, TsTcText, Animations };
|
|
5
|
+
//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoiaW5kZXguanMiLCJzb3VyY2VSb290IjoiIiwic291cmNlcyI6WyIuLi8uLi8uLi9zcmMvc3R5bGVndWlkZS9jb21wb25lbnRzL2luZGV4LnRzeCJdLCJuYW1lcyI6W10sIm1hcHBpbmdzIjoiQUFBQSxPQUFPLFFBQVEsTUFBTSxZQUFZLENBQUM7QUFDbEMsT0FBTyxRQUFRLE1BQU0sWUFBWSxDQUFDO0FBQ2xDLE9BQU8sVUFBVSxNQUFNLGNBQWMsQ0FBQztBQUV0QyxPQUFPLEVBQUUsUUFBUSxFQUFFLFFBQVEsRUFBRSxVQUFVLEVBQUUsQ0FBQyJ9
|
|
@@ -1,21 +1,21 @@
|
|
|
1
1
|
import React, { Fragment } from 'react';
|
|
2
2
|
import { storiesOf } from '@storybook/react';
|
|
3
3
|
import { TcScrollView } from '@times-components/utils';
|
|
4
|
-
import {
|
|
4
|
+
import { TsTcText, TsTcView } from './components';
|
|
5
5
|
import timesStyleguide, { Animations, colours, fonts } from './Styleguide';
|
|
6
6
|
import styles from './helpers/storybookStyles';
|
|
7
7
|
const getStories = (colourMap) => {
|
|
8
|
-
const colourBoxes = Object.keys(colourMap).map(colourName => (React.createElement(
|
|
9
|
-
React.createElement(
|
|
10
|
-
React.createElement(
|
|
8
|
+
const colourBoxes = Object.keys(colourMap).map(colourName => (React.createElement(TsTcView, { style: styles.container },
|
|
9
|
+
React.createElement(TsTcView, { style: { ...styles.box, backgroundColor: colourMap[colourName] } }),
|
|
10
|
+
React.createElement(TsTcText, { style: styles.text },
|
|
11
11
|
colourName,
|
|
12
12
|
" - ",
|
|
13
13
|
colourMap[colourName]))));
|
|
14
|
-
return React.createElement(
|
|
14
|
+
return React.createElement(TsTcView, { style: styles.display }, colourBoxes);
|
|
15
15
|
};
|
|
16
16
|
const fontDisplayer = (fontFamily, phrase, fontSizes) => Object.keys(fontSizes).map(fontSize => (React.createElement(Fragment, { key: fontSize },
|
|
17
|
-
React.createElement(
|
|
18
|
-
React.createElement(
|
|
17
|
+
React.createElement(TsTcText, { style: styles.subHeadline }, fontSize),
|
|
18
|
+
React.createElement(TsTcText, { style: {
|
|
19
19
|
...styles.showoffFonts,
|
|
20
20
|
fontFamily,
|
|
21
21
|
fontSize: fontSizes[fontSize]
|
|
@@ -24,48 +24,48 @@ const fontFixture = () => {
|
|
|
24
24
|
const styleguide = timesStyleguide();
|
|
25
25
|
const phrase = 'The Quick Brown Fox Jumps Over the Lazy Dog';
|
|
26
26
|
return (React.createElement(TcScrollView, null,
|
|
27
|
-
React.createElement(
|
|
28
|
-
React.createElement(
|
|
27
|
+
React.createElement(TsTcView, { style: styles.showoffFontsContainer },
|
|
28
|
+
React.createElement(TsTcText, { style: styles.headline }, "Body"),
|
|
29
29
|
fontDisplayer(fonts.body, phrase, styleguide.fontSizes)),
|
|
30
|
-
React.createElement(
|
|
31
|
-
React.createElement(
|
|
32
|
-
React.createElement(
|
|
30
|
+
React.createElement(TsTcView, { style: styles.showoffFontsContainer },
|
|
31
|
+
React.createElement(TsTcText, { style: styles.headline }, "Body Regular"),
|
|
32
|
+
React.createElement(TsTcText, null, "Used for the body copy of articles or as the teaser copy on article links."),
|
|
33
33
|
fontDisplayer(fonts.bodyRegular, phrase, styleguide.fontSizes)),
|
|
34
|
-
React.createElement(
|
|
35
|
-
React.createElement(
|
|
36
|
-
React.createElement(
|
|
34
|
+
React.createElement(TsTcView, { style: styles.showoffFontsContainer },
|
|
35
|
+
React.createElement(TsTcText, { style: styles.headline }, "Body Regular Small Caps"),
|
|
36
|
+
React.createElement(TsTcText, null, "Always used as a lowercase font, it is typically used to support the headline font. It\u2019s used in various different places e.g. Journalist pages for the Journalist job title, article flags and show more buttons on the homepage."),
|
|
37
37
|
fontDisplayer(fonts.bodyRegularSmallCaps, phrase.toLowerCase(), styleguide.fontSizes)),
|
|
38
|
-
React.createElement(
|
|
39
|
-
React.createElement(
|
|
40
|
-
React.createElement(
|
|
38
|
+
React.createElement(TsTcView, { style: styles.showoffFontsContainer },
|
|
39
|
+
React.createElement(TsTcText, { style: styles.headline }, "Headline"),
|
|
40
|
+
React.createElement(TsTcText, null, "Used as the headline for components and articles across the site."),
|
|
41
41
|
fontDisplayer(fonts.headline, phrase, styleguide.fontSizes)),
|
|
42
|
-
React.createElement(
|
|
43
|
-
React.createElement(
|
|
44
|
-
React.createElement(
|
|
42
|
+
React.createElement(TsTcView, { style: styles.showoffFontsContainer },
|
|
43
|
+
React.createElement(TsTcText, { style: styles.headline }, "Headline Regular"),
|
|
44
|
+
React.createElement(TsTcText, null, "Used primarily to style subheadings for components and stand firsts on the homepage and articles."),
|
|
45
45
|
fontDisplayer(fonts.headlineRegular, phrase, styleguide.fontSizes)),
|
|
46
|
-
React.createElement(
|
|
47
|
-
React.createElement(
|
|
48
|
-
React.createElement(
|
|
46
|
+
React.createElement(TsTcView, { style: styles.showoffFontsContainer },
|
|
47
|
+
React.createElement(TsTcText, { style: styles.headline }, "Supporting"),
|
|
48
|
+
React.createElement(TsTcText, null, "Used as a supporting typeface in a variety of places including messaging banners, buttons, links, homepage labels and tags."),
|
|
49
49
|
fontDisplayer(fonts.supporting, phrase, styleguide.fontSizes)),
|
|
50
|
-
React.createElement(
|
|
51
|
-
React.createElement(
|
|
52
|
-
React.createElement(
|
|
50
|
+
React.createElement(TsTcView, { style: styles.showoffFontsContainer },
|
|
51
|
+
React.createElement(TsTcText, { style: styles.headline }, "Style Magazine (Century Gothic Bold)"),
|
|
52
|
+
React.createElement(TsTcText, null, "Used for theme specific headlines, drop caps and pull-quotes in the Style magazine"),
|
|
53
53
|
fontDisplayer(fonts.styleMagazine, phrase, styleguide.fontSizes)),
|
|
54
|
-
React.createElement(
|
|
55
|
-
React.createElement(
|
|
56
|
-
React.createElement(
|
|
54
|
+
React.createElement(TsTcView, { style: styles.showoffFontsContainer },
|
|
55
|
+
React.createElement(TsTcText, { style: styles.headline }, "Culture Magazine (Flama Bold)"),
|
|
56
|
+
React.createElement(TsTcText, null, "Used for theme specific headlines, drop caps and pull-quotes in the Culture magazine"),
|
|
57
57
|
fontDisplayer(fonts.cultureMagazine, phrase, styleguide.fontSizes)),
|
|
58
|
-
React.createElement(
|
|
59
|
-
React.createElement(
|
|
60
|
-
React.createElement(
|
|
58
|
+
React.createElement(TsTcView, { style: styles.showoffFontsContainer },
|
|
59
|
+
React.createElement(TsTcText, { style: styles.headline }, "Sunday Times Magazine (Tiempos Headline Bold)"),
|
|
60
|
+
React.createElement(TsTcText, null, "Used for theme specific headlines, drop caps and pull-quotes in the Sunday Times Magazine"),
|
|
61
61
|
fontDisplayer(fonts.stMagazine, phrase, styleguide.fontSizes))));
|
|
62
62
|
};
|
|
63
63
|
storiesOf('Typescript Component/styleguide', module)
|
|
64
64
|
.add('Fonts', () => fontFixture())
|
|
65
65
|
.add('Animations', () => (React.createElement(Animations.FadeIn, null,
|
|
66
|
-
React.createElement(
|
|
67
|
-
React.createElement(
|
|
66
|
+
React.createElement(TsTcView, { style: styles.animationBox },
|
|
67
|
+
React.createElement(TsTcText, { style: styles.text }, "Fade In")))))
|
|
68
68
|
.add('Section Colours', () => getStories(colours.section))
|
|
69
69
|
.add('Functional colours', () => getStories(colours.functional))
|
|
70
70
|
.add('Secondary Section Colours', () => getStories(colours.secondarySectionColours));
|
|
71
|
-
//# sourceMappingURL=data:application/json;base64,
|
|
71
|
+
//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoic3R5bGVndWlkZS5zdG9yaWVzLmpzIiwic291cmNlUm9vdCI6IiIsInNvdXJjZXMiOlsiLi4vLi4vc3JjL3N0eWxlZ3VpZGUvc3R5bGVndWlkZS5zdG9yaWVzLnRzeCJdLCJuYW1lcyI6W10sIm1hcHBpbmdzIjoiQUFBQSxPQUFPLEtBQUssRUFBRSxFQUFFLFFBQVEsRUFBRSxNQUFNLE9BQU8sQ0FBQztBQUN4QyxPQUFPLEVBQUUsU0FBUyxFQUFFLE1BQU0sa0JBQWtCLENBQUM7QUFDN0MsT0FBTyxFQUFFLFlBQVksRUFBRSxNQUFNLHlCQUF5QixDQUFDO0FBQ3ZELE9BQU8sRUFBRSxRQUFRLEVBQUUsUUFBUSxFQUFFLE1BQU0sY0FBYyxDQUFDO0FBRWxELE9BQU8sZUFBZSxFQUFFLEVBQUUsVUFBVSxFQUFFLE9BQU8sRUFBRSxLQUFLLEVBQUUsTUFBTSxjQUFjLENBQUM7QUFDM0UsT0FBTyxNQUFNLE1BQU0sMkJBQTJCLENBQUM7QUFFL0MsTUFBTSxVQUFVLEdBQUcsQ0FBQyxTQUFpQyxFQUFFLEVBQUU7SUFDdkQsTUFBTSxXQUFXLEdBQUcsTUFBTSxDQUFDLElBQUksQ0FBQyxTQUFTLENBQUMsQ0FBQyxHQUFHLENBQUMsVUFBVSxDQUFDLEVBQUUsQ0FBQyxDQUMzRCxvQkFBQyxRQUFRLElBQUMsS0FBSyxFQUFFLE1BQU0sQ0FBQyxTQUFTO1FBQy9CLG9CQUFDLFFBQVEsSUFDUCxLQUFLLEVBQUUsRUFBRSxHQUFHLE1BQU0sQ0FBQyxHQUFHLEVBQUUsZUFBZSxFQUFFLFNBQVMsQ0FBQyxVQUFVLENBQUMsRUFBRSxHQUNoRTtRQUNGLG9CQUFDLFFBQVEsSUFBQyxLQUFLLEVBQUUsTUFBTSxDQUFDLElBQUk7WUFDekIsVUFBVTs7WUFBSyxTQUFTLENBQUMsVUFBVSxDQUFDLENBQzVCLENBQ0YsQ0FDWixDQUFDLENBQUM7SUFFSCxPQUFPLG9CQUFDLFFBQVEsSUFBQyxLQUFLLEVBQUUsTUFBTSxDQUFDLE9BQU8sSUFBRyxXQUFXLENBQVksQ0FBQztBQUNuRSxDQUFD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
|
package/package.json
CHANGED
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@times-components/ts-styleguide",
|
|
3
|
-
"version": "1.36.
|
|
4
|
-
"description": "Reuseable Typescript React Components",
|
|
3
|
+
"version": "1.36.3",
|
|
4
|
+
"description": "Reuseable Typescript React Components styleguide",
|
|
5
5
|
"main": "dist/index.js",
|
|
6
6
|
"dev": "dist/index.js",
|
|
7
7
|
"typings": "dist/index.d.ts",
|
|
@@ -50,15 +50,15 @@
|
|
|
50
50
|
"node": ">=8.9"
|
|
51
51
|
},
|
|
52
52
|
"dependencies": {
|
|
53
|
-
"@times-components/link": "3.10.
|
|
54
|
-
"@times-components/utils": "6.12.
|
|
53
|
+
"@times-components/link": "3.10.6",
|
|
54
|
+
"@times-components/utils": "6.12.2",
|
|
55
55
|
"react": "16.9.0",
|
|
56
56
|
"styled-components": "4.3.2"
|
|
57
57
|
},
|
|
58
58
|
"devDependencies": {
|
|
59
59
|
"@storybook/react": "5.3.18",
|
|
60
60
|
"@testing-library/react": "^12.1.2",
|
|
61
|
-
"@times-components/storybook": "4.2.
|
|
61
|
+
"@times-components/storybook": "4.2.24",
|
|
62
62
|
"fetch-mock": "9.11.0",
|
|
63
63
|
"jest": "24.8.0",
|
|
64
64
|
"jest-environment-jsdom-sixteen": "2.0.0",
|
|
@@ -81,5 +81,5 @@
|
|
|
81
81
|
"@testing-library/jest-dom/extend-expect"
|
|
82
82
|
]
|
|
83
83
|
},
|
|
84
|
-
"gitHead": "
|
|
84
|
+
"gitHead": "a116691b447385062d3fa5dc2b9a0070c74a5b2c"
|
|
85
85
|
}
|
package/rnw.js
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
module.exports=function(e){var
|
|
1
|
+
module.exports=function(e){var t={};function a(n){if(t[n])return t[n].exports;var i=t[n]={i:n,l:!1,exports:{}};return e[n].call(i.exports,i,i.exports,a),i.l=!0,i.exports}return a.m=e,a.c=t,a.d=function(e,t,n){a.o(e,t)||Object.defineProperty(e,t,{enumerable:!0,get:n})},a.r=function(e){"undefined"!=typeof Symbol&&Symbol.toStringTag&&Object.defineProperty(e,Symbol.toStringTag,{value:"Module"}),Object.defineProperty(e,"__esModule",{value:!0})},a.t=function(e,t){if(1&t&&(e=a(e)),8&t)return e;if(4&t&&"object"==typeof e&&e&&e.__esModule)return e;var n=Object.create(null);if(a.r(n),Object.defineProperty(n,"default",{enumerable:!0,value:e}),2&t&&"string"!=typeof e)for(var i in e)a.d(n,i,function(t){return e[t]}.bind(null,i));return n},a.n=function(e){var t=e&&e.__esModule?function(){return e.default}:function(){return e};return a.d(t,"a",t),t},a.o=function(e,t){return Object.prototype.hasOwnProperty.call(e,t)},a.p="",a(a.s=2)}([function(e,t){e.exports=require("styled-components")},function(e,t){e.exports=require("react")},function(e,t,a){"use strict";a.r(t);a(1);const n={artsfeatures:"#622956",bricksmortar:"#006469",business:"#005B8D",comment:"#850029",culture:"#7B0046",default:"#1D1D1B",defcon:"#FF1D25",driving:"#C04605",focus:"#CC0000",gardening:"#00313B",home:"#8D724D",ireland:"#004E45",law:"#691D26",money:"#006A74",news:"#13354E",newsreview:"#004D6D",puzzle:"#C74600",register:"#6C6C69",saturdayreview:"#A31D24",scotland:"#00233E",sport:"#008347",style:"#BC3385",techgames:"#1A1F24",thedish:"#DB133B",thegame:"#006469",thesundaytimesmagazine:"#1D1D1D",thetimesmagazine:"#1D1D1D",times2:"#622956",todaysmagazines:"#1D1D1B",travel:"#2C79AD",weekend:"#05829A",world:"#636C17"},i={"Arts & Features":n.artsfeatures,"Bricks & Mortar":n.bricksmortar,Business:n.business,Comment:n.comment,Culture:n.culture,Driving:n.driving,Focus:n.focus,Gardening:n.gardening,Home:n.home,Ireland:n.ireland,Law:n.law,Money:n.money,News:n.news,"News Review":n.newsreview,Puzzles:n.puzzle,Register:n.register,"Saturday Review":n.saturdayreview,Scotland:n.scotland,Sport:n.sport,Style:n.style,"Tech & Games":n.techgames,"The Dish":n.thedish,"The Game":n.thegame,"The Sunday Times Magazine":n.thesundaytimesmagazine,"The Times Magazine":n.thetimesmagazine,Times2:n.times2,"Today's Magazines":n.todaysmagazines,Travel:n.travel,Weekend:n.weekend,World:n.world},r={thesundaytimesmagazine:"#F13D00"},o={"The Sunday Times Magazine":r.thesundaytimesmagazine},d={...n,...i},l={...r,...o};var s={functional:{action:"#006699",actionPressed:"#0077B3",articleFlagExclusive:"#C51D24",articleFlagNew:"#E34605",articleFlagUpdated:"#3C81BE",backgroundPrimary:"#F9F9F9",backgroundSecondary:"#EDEDED",black:"#000000",border:"#F0F0F0",brandColour:"#1D1D1B",bullet:"#103546",contrast:"#FFFFFF",darkSupplement:"#272D34",greyLabel:"#CCC",greyStickyBarBoxShadow:"#c9c7c7ed",greyStickyBarBorderBottom:"#ffffffdb",gutter:"#f0f0f0",keyline:"#DBDBDB",modalBackground:"#000000",newsletterPuffBackground:"#F9F8F3",overlayGradientEnd:"#00000000",overlayGradientFallback:"#000000B3",overlayGradientStart:"#000000E6",primary:"#333333",secondary:"#696969",tertiary:"#4D4D4D",transparentBlack:"rgba(0, 0, 0, 0.6)",transparentWhite:"rgba(255, 255, 255, 0.3)",white:"#FFFFFF",whiteGrey:"#F5F5F5"},secondarySectionColours:l,section:d},u=a(0),m=a.n(u),c=m.a.div.withConfig({displayName:"TsTcView",componentId:"sc-154dp5w-0"})(["border:0px solid black;box-sizing:border-box;display:flex;flex-direction:column;margin:",";border-bottom-color:",";border-bottom-width:",";border-radius:",";overflow:",";height:",";width:",";margin:0px;min-height:0px;min-width:0px;padding:0px;position:relative;z-index:0;"],({style:e})=>e&&e.margin?e.margin:"0px",({style:e})=>e&&e.borderBottomColor?e.borderBottomColor:"black",({style:e})=>e&&e.borderBottomWidth?e.borderBottomWidth:"0px",({style:e})=>e&&e.borderRadius&&e.borderRadius,({style:e})=>e&&e.overflow&&e.overflow,({style:e})=>e&&e.height&&e.height,({style:e})=>e&&e.width&&e.width);const g=Object(u.keyframes)(["from{opacity:0;}to{opacity:1;}"]);var f={FadeIn:m()(c).withConfig({displayName:"Animations__FadeIn",componentId:"w31u4-0"})(["animation:"," 0.3s ease-in-out;"],g)};const p={huge:"huge",medium:"medium",small:"small",wide:"wide"},h={huge:1366,medium:768,wide:1024},y=h.huge,b=e=>e<h.medium?p.small:e<h.wide?p.medium:e<h.huge?p.wide:p.huge;var M={editionBreakpoints:p,editionMaxWidth:y,editionBreakpointWidths:h,sliceContentMaxWidth:1180,huge:1320,medium:768,nativeTablet:660,nativeTabletWide:1194,small:520,wide:1024};const w={body:{bodyMobile:30,puffLink:15,secondary:27,teaser:20,tertiary:26},bodyRegular:{infoSubText:23,infoTitle:30,pageComponentHeadline:25},bodyRegularSmallCaps:{cardMetaMobile:12,meta:14},cultureMagazine:{headline:35,pageHeadline:42},headline:{articleHeadline:45,commentsHeadline:29,headline:33,infoTitle:22,leadHeadline:26,pageComponentHeadline:27,pageHeadline:40,smallHeadline:27,tileLeadHeadline:35,heading2Mobile:26,heading3Mobile:26,heading4Mobile:26,heading5Mobile:26},headlineRegular:{pageComponentHeadline:30,smallestHeadline:26,strapline:24},stMagazine:{headline:35,pageHeadline:42},styleMagazine:{headline:35,pageHeadline:42},supporting:{button:16,caption:13,cardMeta:15,cardMetaMobile:14,keyFactsTitle:18,link:13,meta:14,pagingMeta:15,tertiary:17}};var z=({font:e,fontSize:t})=>w[e][t],F={body:"TimesDigitalW04",bodyRegular:"TimesDigitalW04-Regular",bodyRegularSmallCaps:"TimesDigitalW04-RegularSC",cultureMagazine:"Flama-Bold",dropCap:"TimesModern-Regular",headline:"TimesModern-Bold",headlineRegular:"TimesModern-Regular",stMagazine:"Tiempos-Headline-Bold",styleMagazine:"CenturyGothic-Bold",supporting:"GillSansMTStd-Medium"},v=({font:e,fontSize:t})=>({fontFamily:O().fonts[e],fontSize:C[t],lineHeight:z({font:e,fontSize:t})}),C={articleHeadline:45,articleMeta:15,body:18,bodyMobile:17,button:16,caption:13,cardHeadline:27,cardMeta:13,cardMetaMobile:12,commentsGuidelines:13,commentsHeadline:27,credits:9,headline:30,imageOverlayTextSmall:11,infoTitle:22,keyFactsTitle:24,leadHeadline:26,link:13,meta:14,newsletterPuffLabel:12,newsletterPuffHeadline:28,newsletterPuffCopy:15,pageComponentHeadline:25,pageHeadline:40,pageHeadlineLarge:50,pagingMeta:15,puffLink:11,secondary:16,sliceHeadline:32,smallestHeadline:20,smallHeadline:22,strapline:22,teaser:14,tertiary:15,tileLeadHeadline:35,heading2Mobile:25,heading3Mobile:22,heading4Mobile:19,heading5Mobile:17,infoSubText:18,heading2:28,heading3:24,heading4:20,heading5:19};const T={indepth:{},magazinecomment:{...d,...l},magazinestandard:{...d,...l},maincomment:{...d},mainstandard:{...d},takeoverpage:{}},B={culture:"cultureMagazine",Culture:"cultureMagazine",style:"styleMagazine",Style:"styleMagazine","The Sunday Times Magazine":"stMagazine",thesundaytimesmagazine:"stMagazine","the sunday times magazine":"stMagazine"},D={indepth:B,magazinecomment:B,magazinestandard:B,maincomment:{},mainstandard:{},takeoverpage:{}},S=(e,t)=>T[t][e],k=(e,t,a)=>D[a][t]||e,x=(e,t)=>e&&"style"===e.toLowerCase()&&["indepth","magazinestandard","magazinecomment"].includes(t)?"uppercase":null;var H=(e,t)=>{const a=e||"default",n=t||"mainstandard";return{dropCapFont:k("dropCap",a,n),headlineFont:k("headline",a,n),pullQuoteFont:k("headlineRegular",a,n),sectionColour:S(a,n),headlineCase:x(a,n)}},W=Object.freeze({large:"large",medium:"medium",xlarge:"xlarge"});const R={tabletHeadline:{marginBottom:5},tabletTeaser:{marginTop:5}};var P=e=>(e=>5*e)(e)+"px";const{nativeTablet:E,nativeTabletWide:G}=M;var O=()=>({Animations:f,colours:s,fontFactory:v,fonts:F,fontSizes:C,lineHeight:z,spacing:P});a.d(t,"styleguide",(function(){return O})),a.d(t,"Animations",(function(){return f})),a.d(t,"breakpoints",(function(){return M})),a.d(t,"colours",(function(){return s})),a.d(t,"editionBreakpoints",(function(){return p})),a.d(t,"editionBreakpointWidths",(function(){return h})),a.d(t,"editionMaxWidth",(function(){return y})),a.d(t,"sliceContentMaxWidth",(function(){return 1180})),a.d(t,"fonts",(function(){return F})),a.d(t,"fontFactory",(function(){return v})),a.d(t,"fontSizes",(function(){return C})),a.d(t,"getEditionBreakpoint",(function(){return b})),a.d(t,"lineHeight",(function(){return z})),a.d(t,"scales",(function(){return W})),a.d(t,"spacing",(function(){return P})),a.d(t,"globalSpacingStyles",(function(){return R})),a.d(t,"tabletRowPadding",(function(){return 20})),a.d(t,"tabletWidth",(function(){return E})),a.d(t,"tabletWidthMax",(function(){return G})),a.d(t,"themeFactory",(function(){return H}))}]);
|
|
@@ -2,7 +2,7 @@ import React from 'react';
|
|
|
2
2
|
import { render } from '@testing-library/react';
|
|
3
3
|
|
|
4
4
|
import styleguide, { colours, fonts, spacing } from '../Styleguide';
|
|
5
|
-
import { Animations,
|
|
5
|
+
import { Animations, TsTcText, TsTcView } from '../components';
|
|
6
6
|
|
|
7
7
|
import styles from '../helpers/storybookStyles';
|
|
8
8
|
|
|
@@ -57,9 +57,9 @@ describe('styleguide', () => {
|
|
|
57
57
|
expect(
|
|
58
58
|
render(
|
|
59
59
|
<Animations.FadeIn>
|
|
60
|
-
<
|
|
61
|
-
<
|
|
62
|
-
</
|
|
60
|
+
<TsTcView style={styles.container}>
|
|
61
|
+
<TsTcText style={styles.text}>Hello World</TsTcText>
|
|
62
|
+
</TsTcView>
|
|
63
63
|
</Animations.FadeIn>
|
|
64
64
|
)
|
|
65
65
|
).toBeTruthy();
|
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
import
|
|
1
|
+
import TsTcView from './TsTcView';
|
|
2
2
|
import styled, { keyframes } from 'styled-components';
|
|
3
3
|
|
|
4
4
|
const fadingAnimation = keyframes`
|
|
@@ -11,7 +11,7 @@ const fadingAnimation = keyframes`
|
|
|
11
11
|
}
|
|
12
12
|
`;
|
|
13
13
|
|
|
14
|
-
const FadeIn = styled(
|
|
14
|
+
const FadeIn = styled(TsTcView)`
|
|
15
15
|
animation: ${fadingAnimation} 0.3s ease-in-out;
|
|
16
16
|
`;
|
|
17
17
|
|
|
File without changes
|
|
File without changes
|
|
@@ -1,5 +1,5 @@
|
|
|
1
|
-
import
|
|
2
|
-
import
|
|
1
|
+
import TsTcView from './TsTcView';
|
|
2
|
+
import TsTcText from './TsTcText';
|
|
3
3
|
import Animations from './Animations';
|
|
4
4
|
|
|
5
|
-
export {
|
|
5
|
+
export { TsTcView, TsTcText, Animations };
|
|
@@ -1,24 +1,24 @@
|
|
|
1
1
|
import React, { Fragment } from 'react';
|
|
2
2
|
import { storiesOf } from '@storybook/react';
|
|
3
3
|
import { TcScrollView } from '@times-components/utils';
|
|
4
|
-
import {
|
|
4
|
+
import { TsTcText, TsTcView } from './components';
|
|
5
5
|
|
|
6
6
|
import timesStyleguide, { Animations, colours, fonts } from './Styleguide';
|
|
7
7
|
import styles from './helpers/storybookStyles';
|
|
8
8
|
|
|
9
9
|
const getStories = (colourMap: Record<string, string>) => {
|
|
10
10
|
const colourBoxes = Object.keys(colourMap).map(colourName => (
|
|
11
|
-
<
|
|
12
|
-
<
|
|
11
|
+
<TsTcView style={styles.container}>
|
|
12
|
+
<TsTcView
|
|
13
13
|
style={{ ...styles.box, backgroundColor: colourMap[colourName] }}
|
|
14
14
|
/>
|
|
15
|
-
<
|
|
15
|
+
<TsTcText style={styles.text}>
|
|
16
16
|
{colourName} - {colourMap[colourName]}
|
|
17
|
-
</
|
|
18
|
-
</
|
|
17
|
+
</TsTcText>
|
|
18
|
+
</TsTcView>
|
|
19
19
|
));
|
|
20
20
|
|
|
21
|
-
return <
|
|
21
|
+
return <TsTcView style={styles.display}>{colourBoxes}</TsTcView>;
|
|
22
22
|
};
|
|
23
23
|
|
|
24
24
|
const fontDisplayer = (
|
|
@@ -28,8 +28,8 @@ const fontDisplayer = (
|
|
|
28
28
|
) =>
|
|
29
29
|
Object.keys(fontSizes).map(fontSize => (
|
|
30
30
|
<Fragment key={fontSize}>
|
|
31
|
-
<
|
|
32
|
-
<
|
|
31
|
+
<TsTcText style={styles.subHeadline}>{fontSize}</TsTcText>
|
|
32
|
+
<TsTcText
|
|
33
33
|
style={{
|
|
34
34
|
...styles.showoffFonts,
|
|
35
35
|
fontFamily,
|
|
@@ -37,7 +37,7 @@ const fontDisplayer = (
|
|
|
37
37
|
}}
|
|
38
38
|
>
|
|
39
39
|
{phrase}
|
|
40
|
-
</
|
|
40
|
+
</TsTcText>
|
|
41
41
|
</Fragment>
|
|
42
42
|
));
|
|
43
43
|
|
|
@@ -46,83 +46,85 @@ const fontFixture = () => {
|
|
|
46
46
|
const phrase = 'The Quick Brown Fox Jumps Over the Lazy Dog';
|
|
47
47
|
return (
|
|
48
48
|
<TcScrollView>
|
|
49
|
-
<
|
|
50
|
-
<
|
|
49
|
+
<TsTcView style={styles.showoffFontsContainer}>
|
|
50
|
+
<TsTcText style={styles.headline}>Body</TsTcText>
|
|
51
51
|
{fontDisplayer(fonts.body, phrase, styleguide.fontSizes)}
|
|
52
|
-
</
|
|
53
|
-
<
|
|
54
|
-
<
|
|
55
|
-
<
|
|
52
|
+
</TsTcView>
|
|
53
|
+
<TsTcView style={styles.showoffFontsContainer}>
|
|
54
|
+
<TsTcText style={styles.headline}>Body Regular</TsTcText>
|
|
55
|
+
<TsTcText>
|
|
56
56
|
Used for the body copy of articles or as the teaser copy on article
|
|
57
57
|
links.
|
|
58
|
-
</
|
|
58
|
+
</TsTcText>
|
|
59
59
|
{fontDisplayer(fonts.bodyRegular, phrase, styleguide.fontSizes)}
|
|
60
|
-
</
|
|
61
|
-
<
|
|
62
|
-
<
|
|
63
|
-
<
|
|
60
|
+
</TsTcView>
|
|
61
|
+
<TsTcView style={styles.showoffFontsContainer}>
|
|
62
|
+
<TsTcText style={styles.headline}>Body Regular Small Caps</TsTcText>
|
|
63
|
+
<TsTcText>
|
|
64
64
|
Always used as a lowercase font, it is typically used to support the
|
|
65
65
|
headline font. It’s used in various different places e.g. Journalist
|
|
66
66
|
pages for the Journalist job title, article flags and show more
|
|
67
67
|
buttons on the homepage.
|
|
68
|
-
</
|
|
68
|
+
</TsTcText>
|
|
69
69
|
{fontDisplayer(
|
|
70
70
|
fonts.bodyRegularSmallCaps,
|
|
71
71
|
phrase.toLowerCase(),
|
|
72
72
|
styleguide.fontSizes
|
|
73
73
|
)}
|
|
74
|
-
</
|
|
75
|
-
<
|
|
76
|
-
<
|
|
77
|
-
<
|
|
74
|
+
</TsTcView>
|
|
75
|
+
<TsTcView style={styles.showoffFontsContainer}>
|
|
76
|
+
<TsTcText style={styles.headline}>Headline</TsTcText>
|
|
77
|
+
<TsTcText>
|
|
78
78
|
Used as the headline for components and articles across the site.
|
|
79
|
-
</
|
|
79
|
+
</TsTcText>
|
|
80
80
|
{fontDisplayer(fonts.headline, phrase, styleguide.fontSizes)}
|
|
81
|
-
</
|
|
82
|
-
<
|
|
83
|
-
<
|
|
84
|
-
<
|
|
81
|
+
</TsTcView>
|
|
82
|
+
<TsTcView style={styles.showoffFontsContainer}>
|
|
83
|
+
<TsTcText style={styles.headline}>Headline Regular</TsTcText>
|
|
84
|
+
<TsTcText>
|
|
85
85
|
Used primarily to style subheadings for components and stand firsts on
|
|
86
86
|
the homepage and articles.
|
|
87
|
-
</
|
|
87
|
+
</TsTcText>
|
|
88
88
|
{fontDisplayer(fonts.headlineRegular, phrase, styleguide.fontSizes)}
|
|
89
|
-
</
|
|
90
|
-
<
|
|
91
|
-
<
|
|
92
|
-
<
|
|
89
|
+
</TsTcView>
|
|
90
|
+
<TsTcView style={styles.showoffFontsContainer}>
|
|
91
|
+
<TsTcText style={styles.headline}>Supporting</TsTcText>
|
|
92
|
+
<TsTcText>
|
|
93
93
|
Used as a supporting typeface in a variety of places including
|
|
94
94
|
messaging banners, buttons, links, homepage labels and tags.
|
|
95
|
-
</
|
|
95
|
+
</TsTcText>
|
|
96
96
|
{fontDisplayer(fonts.supporting, phrase, styleguide.fontSizes)}
|
|
97
|
-
</
|
|
98
|
-
<
|
|
99
|
-
<
|
|
97
|
+
</TsTcView>
|
|
98
|
+
<TsTcView style={styles.showoffFontsContainer}>
|
|
99
|
+
<TsTcText style={styles.headline}>
|
|
100
100
|
Style Magazine (Century Gothic Bold)
|
|
101
|
-
</
|
|
102
|
-
<
|
|
101
|
+
</TsTcText>
|
|
102
|
+
<TsTcText>
|
|
103
103
|
Used for theme specific headlines, drop caps and pull-quotes in the
|
|
104
104
|
Style magazine
|
|
105
|
-
</
|
|
105
|
+
</TsTcText>
|
|
106
106
|
{fontDisplayer(fonts.styleMagazine, phrase, styleguide.fontSizes)}
|
|
107
|
-
</
|
|
108
|
-
<
|
|
109
|
-
<
|
|
110
|
-
|
|
107
|
+
</TsTcView>
|
|
108
|
+
<TsTcView style={styles.showoffFontsContainer}>
|
|
109
|
+
<TsTcText style={styles.headline}>
|
|
110
|
+
Culture Magazine (Flama Bold)
|
|
111
|
+
</TsTcText>
|
|
112
|
+
<TsTcText>
|
|
111
113
|
Used for theme specific headlines, drop caps and pull-quotes in the
|
|
112
114
|
Culture magazine
|
|
113
|
-
</
|
|
115
|
+
</TsTcText>
|
|
114
116
|
{fontDisplayer(fonts.cultureMagazine, phrase, styleguide.fontSizes)}
|
|
115
|
-
</
|
|
116
|
-
<
|
|
117
|
-
<
|
|
117
|
+
</TsTcView>
|
|
118
|
+
<TsTcView style={styles.showoffFontsContainer}>
|
|
119
|
+
<TsTcText style={styles.headline}>
|
|
118
120
|
Sunday Times Magazine (Tiempos Headline Bold)
|
|
119
|
-
</
|
|
120
|
-
<
|
|
121
|
+
</TsTcText>
|
|
122
|
+
<TsTcText>
|
|
121
123
|
Used for theme specific headlines, drop caps and pull-quotes in the
|
|
122
124
|
Sunday Times Magazine
|
|
123
|
-
</
|
|
125
|
+
</TsTcText>
|
|
124
126
|
{fontDisplayer(fonts.stMagazine, phrase, styleguide.fontSizes)}
|
|
125
|
-
</
|
|
127
|
+
</TsTcView>
|
|
126
128
|
</TcScrollView>
|
|
127
129
|
);
|
|
128
130
|
};
|
|
@@ -131,9 +133,9 @@ storiesOf('Typescript Component/styleguide', module)
|
|
|
131
133
|
.add('Fonts', () => fontFixture())
|
|
132
134
|
.add('Animations', () => (
|
|
133
135
|
<Animations.FadeIn>
|
|
134
|
-
<
|
|
135
|
-
<
|
|
136
|
-
</
|
|
136
|
+
<TsTcView style={styles.animationBox}>
|
|
137
|
+
<TsTcText style={styles.text}>Fade In</TsTcText>
|
|
138
|
+
</TsTcView>
|
|
137
139
|
</Animations.FadeIn>
|
|
138
140
|
))
|
|
139
141
|
.add('Section Colours', () => getStories(colours.section))
|
|
@@ -1,22 +0,0 @@
|
|
|
1
|
-
import styled from 'styled-components';
|
|
2
|
-
export default styled.div `
|
|
3
|
-
border: 0px solid black;
|
|
4
|
-
box-sizing: border-box;
|
|
5
|
-
color: ${({ style }) => style && style.color ? style.color : 'rgb(0, 0, 0)'};
|
|
6
|
-
display: inline;
|
|
7
|
-
font: 14px system-ui, -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto,
|
|
8
|
-
Ubuntu, 'Helvetica Neue', sans-serif;
|
|
9
|
-
margin: 0px;
|
|
10
|
-
padding: 0px;
|
|
11
|
-
white-space: pre-wrap;
|
|
12
|
-
overflow-wrap: break-word;
|
|
13
|
-
font-size: ${({ style }) => style && style.fontSize ? style.fontSize : '14px'};
|
|
14
|
-
font-weight: ${({ style }) => style && style.fontWeight && style.fontWeight};
|
|
15
|
-
margin-bottom: ${({ style }) => style && style.marginBottom ? style.marginBottom : '0px'};
|
|
16
|
-
margin-left: ${({ style }) => style && style.marginLeft ? style.marginLeft : '0px'};
|
|
17
|
-
margin-top: ${({ style }) => style && style.marginTop ? style.marginTop : '0px'};
|
|
18
|
-
font-family: ${({ style }) => style && style.fontFamily
|
|
19
|
-
? style.fontFamily
|
|
20
|
-
: 'system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Ubuntu, "Helvetica Neue", sans-serif'};
|
|
21
|
-
`;
|
|
22
|
-
//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoiVGNUZXh0LmpzIiwic291cmNlUm9vdCI6IiIsInNvdXJjZXMiOlsiLi4vLi4vLi4vc3JjL3N0eWxlZ3VpZGUvY29tcG9uZW50cy9UY1RleHQudHN4Il0sIm5hbWVzIjpbXSwibWFwcGluZ3MiOiJBQUFBLE9BQU8sTUFBTSxNQUFNLG1CQUFtQixDQUFDO0FBTXZDLGVBQWUsTUFBTSxDQUFDLEdBQUcsQ0FBbUI7OztXQUdqQyxDQUFDLEVBQUUsS0FBSyxFQUFFLEVBQUUsRUFBRSxDQUNyQixLQUFLLElBQUksS0FBSyxDQUFDLEtBQUssQ0FBQyxDQUFDLENBQUMsS0FBSyxDQUFDLEtBQUssQ0FBQyxDQUFDLENBQUMsY0FBYzs7Ozs7Ozs7ZUFReEMsQ0FBQyxFQUFFLEtBQUssRUFBRSxFQUFFLEVBQUUsQ0FDekIsS0FBSyxJQUFJLEtBQUssQ0FBQyxRQUFRLENBQUMsQ0FBQyxDQUFDLEtBQUssQ0FBQyxRQUFRLENBQUMsQ0FBQyxDQUFDLE1BQU07aUJBQ3BDLENBQUMsRUFBRSxLQUFLLEVBQUUsRUFBRSxFQUFFLENBQUMsS0FBSyxJQUFJLEtBQUssQ0FBQyxVQUFVLElBQUksS0FBSyxDQUFDLFVBQVU7bUJBQzFELENBQUMsRUFBRSxLQUFLLEVBQUUsRUFBRSxFQUFFLENBQzdCLEtBQUssSUFBSSxLQUFLLENBQUMsWUFBWSxDQUFDLENBQUMsQ0FBQyxLQUFLLENBQUMsWUFBWSxDQUFDLENBQUMsQ0FBQyxLQUFLO2lCQUMzQyxDQUFDLEVBQUUsS0FBSyxFQUFFLEVBQUUsRUFBRSxDQUMzQixLQUFLLElBQUksS0FBSyxDQUFDLFVBQVUsQ0FBQyxDQUFDLENBQUMsS0FBSyxDQUFDLFVBQVUsQ0FBQyxDQUFDLENBQUMsS0FBSztnQkFDeEMsQ0FBQyxFQUFFLEtBQUssRUFBRSxFQUFFLEVBQUUsQ0FDMUIsS0FBSyxJQUFJLEtBQUssQ0FBQyxTQUFTLENBQUMsQ0FBQyxDQUFDLEtBQUssQ0FBQyxTQUFTLENBQUMsQ0FBQyxDQUFDLEtBQUs7aUJBQ3JDLENBQUMsRUFBRSxLQUFLLEVBQUUsRUFBRSxFQUFFLENBQzNCLEtBQUssSUFBSSxLQUFLLENBQUMsVUFBVTtJQUN2QixDQUFDLENBQUMsS0FBSyxDQUFDLFVBQVU7SUFDbEIsQ0FBQyxDQUFDLHdHQUF3RztDQUMvRyxDQUFDIn0=
|
|
@@ -1,21 +0,0 @@
|
|
|
1
|
-
import styled from 'styled-components';
|
|
2
|
-
export default styled.div `
|
|
3
|
-
border: 0px solid black;
|
|
4
|
-
box-sizing: border-box;
|
|
5
|
-
display: flex;
|
|
6
|
-
flex-direction: column;
|
|
7
|
-
margin: ${({ style }) => (style && style.margin ? style.margin : '0px')};
|
|
8
|
-
border-bottom-color: ${({ style }) => style && style.borderBottomColor ? style.borderBottomColor : 'black'};
|
|
9
|
-
border-bottom-width: ${({ style }) => style && style.borderBottomWidth ? style.borderBottomWidth : '0px'};
|
|
10
|
-
border-radius: ${({ style }) => style && style.borderRadius && style.borderRadius};
|
|
11
|
-
overflow: ${({ style }) => style && style.overflow && style.overflow};
|
|
12
|
-
height: ${({ style }) => style && style.height && style.height};
|
|
13
|
-
width: ${({ style }) => style && style.width && style.width};
|
|
14
|
-
margin: 0px;
|
|
15
|
-
min-height: 0px;
|
|
16
|
-
min-width: 0px;
|
|
17
|
-
padding: 0px;
|
|
18
|
-
position: relative;
|
|
19
|
-
z-index: 0;
|
|
20
|
-
`;
|
|
21
|
-
//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoiVGNWaWV3LmpzIiwic291cmNlUm9vdCI6IiIsInNvdXJjZXMiOlsiLi4vLi4vLi4vc3JjL3N0eWxlZ3VpZGUvY29tcG9uZW50cy9UY1ZpZXcudHN4Il0sIm5hbWVzIjpbXSwibWFwcGluZ3MiOiJBQUFBLE9BQU8sTUFBTSxNQUFNLG1CQUFtQixDQUFDO0FBS3ZDLGVBQWUsTUFBTSxDQUFDLEdBQUcsQ0FBbUI7Ozs7O1lBS2hDLENBQUMsRUFBRSxLQUFLLEVBQUUsRUFBRSxFQUFFLENBQUMsQ0FBQyxLQUFLLElBQUksS0FBSyxDQUFDLE1BQU0sQ0FBQyxDQUFDLENBQUMsS0FBSyxDQUFDLE1BQU0sQ0FBQyxDQUFDLENBQUMsS0FBSyxDQUFDO3lCQUNoRCxDQUFDLEVBQUUsS0FBSyxFQUFFLEVBQUUsRUFBRSxDQUNuQyxLQUFLLElBQUksS0FBSyxDQUFDLGlCQUFpQixDQUFDLENBQUMsQ0FBQyxLQUFLLENBQUMsaUJBQWlCLENBQUMsQ0FBQyxDQUFDLE9BQU87eUJBQy9DLENBQUMsRUFBRSxLQUFLLEVBQUUsRUFBRSxFQUFFLENBQ25DLEtBQUssSUFBSSxLQUFLLENBQUMsaUJBQWlCLENBQUMsQ0FBQyxDQUFDLEtBQUssQ0FBQyxpQkFBaUIsQ0FBQyxDQUFDLENBQUMsS0FBSzttQkFDbkQsQ0FBQyxFQUFFLEtBQUssRUFBRSxFQUFFLEVBQUUsQ0FDN0IsS0FBSyxJQUFJLEtBQUssQ0FBQyxZQUFZLElBQUksS0FBSyxDQUFDLFlBQVk7Y0FDdkMsQ0FBQyxFQUFFLEtBQUssRUFBRSxFQUFFLEVBQUUsQ0FBQyxLQUFLLElBQUksS0FBSyxDQUFDLFFBQVEsSUFBSSxLQUFLLENBQUMsUUFBUTtZQUMxRCxDQUFDLEVBQUUsS0FBSyxFQUFFLEVBQUUsRUFBRSxDQUFDLEtBQUssSUFBSSxLQUFLLENBQUMsTUFBTSxJQUFJLEtBQUssQ0FBQyxNQUFNO1dBQ3JELENBQUMsRUFBRSxLQUFLLEVBQUUsRUFBRSxFQUFFLENBQUMsS0FBSyxJQUFJLEtBQUssQ0FBQyxLQUFLLElBQUksS0FBSyxDQUFDLEtBQUs7Ozs7Ozs7Q0FPNUQsQ0FBQyJ9
|