@zendeskgarden/react-typography 9.0.0-next.24 → 9.0.0-next.25
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/dist/esm/styled/StyledBlockquote.js +2 -5
- package/dist/esm/styled/StyledCode.js +1 -1
- package/dist/esm/styled/StyledCodeBlock.js +2 -5
- package/dist/esm/styled/StyledCodeBlockContainer.js +2 -5
- package/dist/esm/styled/StyledCodeBlockLine.js +2 -5
- package/dist/esm/styled/StyledCodeBlockToken.js +2 -5
- package/dist/esm/styled/StyledEllipsis.js +2 -5
- package/dist/esm/styled/StyledFont.js +1 -1
- package/dist/esm/styled/StyledIcon.js +2 -5
- package/dist/esm/styled/StyledList.js +3 -9
- package/dist/esm/styled/StyledListItem.js +2 -2
- package/dist/esm/styled/StyledParagraph.js +2 -5
- package/dist/index.cjs.js +14 -44
- package/package.json +3 -3
|
@@ -5,13 +5,13 @@
|
|
|
5
5
|
* found at http://www.apache.org/licenses/LICENSE-2.0.
|
|
6
6
|
*/
|
|
7
7
|
import styled from 'styled-components';
|
|
8
|
-
import { getColor, retrieveComponentStyles
|
|
8
|
+
import { getColor, retrieveComponentStyles } from '@zendeskgarden/react-theming';
|
|
9
9
|
import { THEME_SIZES } from './StyledFont.js';
|
|
10
10
|
|
|
11
11
|
const COMPONENT_ID = 'typography.blockquote';
|
|
12
12
|
const StyledBlockquote = styled.blockquote.attrs({
|
|
13
13
|
'data-garden-id': COMPONENT_ID,
|
|
14
|
-
'data-garden-version': '9.0.0-next.
|
|
14
|
+
'data-garden-version': '9.0.0-next.25'
|
|
15
15
|
}).withConfig({
|
|
16
16
|
displayName: "StyledBlockquote",
|
|
17
17
|
componentId: "sc-1tt3ye0-0"
|
|
@@ -19,8 +19,5 @@ const StyledBlockquote = styled.blockquote.attrs({
|
|
|
19
19
|
theme: props.theme,
|
|
20
20
|
variable: 'border.default'
|
|
21
21
|
}), props => props.theme.rtl ? 'right' : 'left', props => props.theme.space.base * 4, props => props.theme.rtl ? 'rtl' : 'ltr', props => props.theme.lineHeights[THEME_SIZES[props.size]], props => retrieveComponentStyles(COMPONENT_ID, props));
|
|
22
|
-
StyledBlockquote.defaultProps = {
|
|
23
|
-
theme: DEFAULT_THEME
|
|
24
|
-
};
|
|
25
22
|
|
|
26
23
|
export { StyledBlockquote };
|
|
@@ -50,7 +50,7 @@ const colorStyles = _ref => {
|
|
|
50
50
|
};
|
|
51
51
|
const StyledCode = styled(StyledFont).attrs({
|
|
52
52
|
'data-garden-id': COMPONENT_ID,
|
|
53
|
-
'data-garden-version': '9.0.0-next.
|
|
53
|
+
'data-garden-version': '9.0.0-next.25',
|
|
54
54
|
as: 'code',
|
|
55
55
|
isMonospace: true
|
|
56
56
|
}).withConfig({
|
|
@@ -5,7 +5,7 @@
|
|
|
5
5
|
* found at http://www.apache.org/licenses/LICENSE-2.0.
|
|
6
6
|
*/
|
|
7
7
|
import styled, { css } from 'styled-components';
|
|
8
|
-
import { retrieveComponentStyles,
|
|
8
|
+
import { retrieveComponentStyles, getColor } from '@zendeskgarden/react-theming';
|
|
9
9
|
|
|
10
10
|
const COMPONENT_ID = 'typography.codeblock';
|
|
11
11
|
const colorStyles = _ref => {
|
|
@@ -24,13 +24,10 @@ const colorStyles = _ref => {
|
|
|
24
24
|
};
|
|
25
25
|
const StyledCodeBlock = styled.pre.attrs({
|
|
26
26
|
'data-garden-id': COMPONENT_ID,
|
|
27
|
-
'data-garden-version': '9.0.0-next.
|
|
27
|
+
'data-garden-version': '9.0.0-next.25'
|
|
28
28
|
}).withConfig({
|
|
29
29
|
displayName: "StyledCodeBlock",
|
|
30
30
|
componentId: "sc-5wky57-0"
|
|
31
31
|
})(["display:table;margin:0;padding:", "px;box-sizing:border-box;width:100%;direction:ltr;white-space:pre;counter-reset:linenumber;", ";", ";"], props => props.theme.space.base * 3, colorStyles, props => retrieveComponentStyles(COMPONENT_ID, props));
|
|
32
|
-
StyledCodeBlock.defaultProps = {
|
|
33
|
-
theme: DEFAULT_THEME
|
|
34
|
-
};
|
|
35
32
|
|
|
36
33
|
export { StyledCodeBlock };
|
|
@@ -5,20 +5,17 @@
|
|
|
5
5
|
* found at http://www.apache.org/licenses/LICENSE-2.0.
|
|
6
6
|
*/
|
|
7
7
|
import styled from 'styled-components';
|
|
8
|
-
import { focusStyles, retrieveComponentStyles
|
|
8
|
+
import { focusStyles, retrieveComponentStyles } from '@zendeskgarden/react-theming';
|
|
9
9
|
|
|
10
10
|
const COMPONENT_ID = 'typography.codeblock_container';
|
|
11
11
|
const StyledCodeBlockContainer = styled.div.attrs({
|
|
12
12
|
'data-garden-id': COMPONENT_ID,
|
|
13
|
-
'data-garden-version': '9.0.0-next.
|
|
13
|
+
'data-garden-version': '9.0.0-next.25'
|
|
14
14
|
}).withConfig({
|
|
15
15
|
displayName: "StyledCodeBlockContainer",
|
|
16
16
|
componentId: "sc-14zgbfw-0"
|
|
17
17
|
})(["transition:box-shadow 0.1s ease-in-out;overflow:auto;", " ", ";"], props => focusStyles({
|
|
18
18
|
theme: props.theme
|
|
19
19
|
}), props => retrieveComponentStyles(COMPONENT_ID, props));
|
|
20
|
-
StyledCodeBlockContainer.defaultProps = {
|
|
21
|
-
theme: DEFAULT_THEME
|
|
22
|
-
};
|
|
23
20
|
|
|
24
21
|
export { StyledCodeBlockContainer };
|
|
@@ -5,7 +5,7 @@
|
|
|
5
5
|
* found at http://www.apache.org/licenses/LICENSE-2.0.
|
|
6
6
|
*/
|
|
7
7
|
import styled, { css } from 'styled-components';
|
|
8
|
-
import { retrieveComponentStyles,
|
|
8
|
+
import { retrieveComponentStyles, getColor } from '@zendeskgarden/react-theming';
|
|
9
9
|
import { StyledFont, THEME_SIZES } from './StyledFont.js';
|
|
10
10
|
|
|
11
11
|
const COMPONENT_ID = 'typography.codeblock_code';
|
|
@@ -86,15 +86,12 @@ const lineNumberStyles = _ref2 => {
|
|
|
86
86
|
};
|
|
87
87
|
const StyledCodeBlockLine = styled(StyledFont).attrs({
|
|
88
88
|
'data-garden-id': COMPONENT_ID,
|
|
89
|
-
'data-garden-version': '9.0.0-next.
|
|
89
|
+
'data-garden-version': '9.0.0-next.25',
|
|
90
90
|
as: 'code',
|
|
91
91
|
isMonospace: true
|
|
92
92
|
}).withConfig({
|
|
93
93
|
displayName: "StyledCodeBlockLine",
|
|
94
94
|
componentId: "sc-1goay17-0"
|
|
95
95
|
})(["display:table-row;height:", ";direction:ltr;", ";", ";&::after{display:inline-block;width:", "px;content:'';}", ";"], props => props.theme.lineHeights[THEME_SIZES[props.size]], colorStyles, props => props.isNumbered && lineNumberStyles(props), props => props.theme.space.base * 3, props => retrieveComponentStyles(COMPONENT_ID, props));
|
|
96
|
-
StyledCodeBlockLine.defaultProps = {
|
|
97
|
-
theme: DEFAULT_THEME
|
|
98
|
-
};
|
|
99
96
|
|
|
100
97
|
export { StyledCodeBlockLine };
|
|
@@ -5,7 +5,7 @@
|
|
|
5
5
|
* found at http://www.apache.org/licenses/LICENSE-2.0.
|
|
6
6
|
*/
|
|
7
7
|
import styled, { css } from 'styled-components';
|
|
8
|
-
import { retrieveComponentStyles,
|
|
8
|
+
import { retrieveComponentStyles, getColor } from '@zendeskgarden/react-theming';
|
|
9
9
|
import { StyledCodeBlock } from './StyledCodeBlock.js';
|
|
10
10
|
|
|
11
11
|
const COMPONENT_ID = 'typography.codeblock_token';
|
|
@@ -171,13 +171,10 @@ const colorStyles = _ref => {
|
|
|
171
171
|
};
|
|
172
172
|
const StyledCodeBlockToken = styled.span.attrs({
|
|
173
173
|
'data-garden-id': COMPONENT_ID,
|
|
174
|
-
'data-garden-version': '9.0.0-next.
|
|
174
|
+
'data-garden-version': '9.0.0-next.25'
|
|
175
175
|
}).withConfig({
|
|
176
176
|
displayName: "StyledCodeBlockToken",
|
|
177
177
|
componentId: "sc-1hkshdq-0"
|
|
178
178
|
})(["display:inline-block;&.bold:not(.diff){font-weight:", ";}&.coord{padding-left:0.75em;}&.italic{font-style:italic;}&.prefix{width:2em;text-align:center;}", ";", ";"], props => props.theme.fontWeights.semibold, colorStyles, props => retrieveComponentStyles(COMPONENT_ID, props));
|
|
179
|
-
StyledCodeBlockToken.defaultProps = {
|
|
180
|
-
theme: DEFAULT_THEME
|
|
181
|
-
};
|
|
182
179
|
|
|
183
180
|
export { StyledCodeBlockToken };
|
|
@@ -5,18 +5,15 @@
|
|
|
5
5
|
* found at http://www.apache.org/licenses/LICENSE-2.0.
|
|
6
6
|
*/
|
|
7
7
|
import styled from 'styled-components';
|
|
8
|
-
import { retrieveComponentStyles
|
|
8
|
+
import { retrieveComponentStyles } from '@zendeskgarden/react-theming';
|
|
9
9
|
|
|
10
10
|
const COMPONENT_ID = 'typography.ellipsis';
|
|
11
11
|
const StyledEllipsis = styled.div.attrs({
|
|
12
12
|
'data-garden-id': COMPONENT_ID,
|
|
13
|
-
'data-garden-version': '9.0.0-next.
|
|
13
|
+
'data-garden-version': '9.0.0-next.25'
|
|
14
14
|
}).withConfig({
|
|
15
15
|
displayName: "StyledEllipsis",
|
|
16
16
|
componentId: "sc-1u4uqmy-0"
|
|
17
17
|
})(["overflow:hidden;text-overflow:ellipsis;white-space:nowrap;direction:", ";", ";"], props => props.theme.rtl ? 'rtl' : 'ltr', props => retrieveComponentStyles(COMPONENT_ID, props));
|
|
18
|
-
StyledEllipsis.defaultProps = {
|
|
19
|
-
theme: DEFAULT_THEME
|
|
20
|
-
};
|
|
21
18
|
|
|
22
19
|
export { StyledEllipsis };
|
|
@@ -67,7 +67,7 @@ const fontStyles = _ref => {
|
|
|
67
67
|
};
|
|
68
68
|
const StyledFont = styled.div.attrs({
|
|
69
69
|
'data-garden-id': COMPONENT_ID,
|
|
70
|
-
'data-garden-version': '9.0.0-next.
|
|
70
|
+
'data-garden-version': '9.0.0-next.25'
|
|
71
71
|
}).withConfig({
|
|
72
72
|
displayName: "StyledFont",
|
|
73
73
|
componentId: "sc-1iildbo-0"
|
|
@@ -5,7 +5,7 @@
|
|
|
5
5
|
* found at http://www.apache.org/licenses/LICENSE-2.0.
|
|
6
6
|
*/
|
|
7
7
|
import styled, { css } from 'styled-components';
|
|
8
|
-
import { StyledBaseIcon, retrieveComponentStyles
|
|
8
|
+
import { StyledBaseIcon, retrieveComponentStyles } from '@zendeskgarden/react-theming';
|
|
9
9
|
|
|
10
10
|
const COMPONENT_ID = 'typography.icon';
|
|
11
11
|
const sizeStyles = props => {
|
|
@@ -15,13 +15,10 @@ const sizeStyles = props => {
|
|
|
15
15
|
};
|
|
16
16
|
const StyledIcon = styled(StyledBaseIcon).attrs({
|
|
17
17
|
'data-garden-id': COMPONENT_ID,
|
|
18
|
-
'data-garden-version': '9.0.0-next.
|
|
18
|
+
'data-garden-version': '9.0.0-next.25'
|
|
19
19
|
}).withConfig({
|
|
20
20
|
displayName: "StyledIcon",
|
|
21
21
|
componentId: "sc-10rfb5b-0"
|
|
22
22
|
})(["position:relative;top:-1px;vertical-align:middle;", ";", ";"], props => sizeStyles(props), props => retrieveComponentStyles(COMPONENT_ID, props));
|
|
23
|
-
StyledIcon.defaultProps = {
|
|
24
|
-
theme: DEFAULT_THEME
|
|
25
|
-
};
|
|
26
23
|
|
|
27
24
|
export { StyledIcon };
|
|
@@ -5,7 +5,7 @@
|
|
|
5
5
|
* found at http://www.apache.org/licenses/LICENSE-2.0.
|
|
6
6
|
*/
|
|
7
7
|
import styled, { css } from 'styled-components';
|
|
8
|
-
import { retrieveComponentStyles
|
|
8
|
+
import { retrieveComponentStyles } from '@zendeskgarden/react-theming';
|
|
9
9
|
|
|
10
10
|
const listStyles = props => {
|
|
11
11
|
const rtl = props.theme.rtl;
|
|
@@ -14,24 +14,18 @@ const listStyles = props => {
|
|
|
14
14
|
const ORDERED_ID = 'typography.ordered_list';
|
|
15
15
|
const StyledOrderedList = styled.ol.attrs({
|
|
16
16
|
'data-garden-id': ORDERED_ID,
|
|
17
|
-
'data-garden-version': '9.0.0-next.
|
|
17
|
+
'data-garden-version': '9.0.0-next.25'
|
|
18
18
|
}).withConfig({
|
|
19
19
|
displayName: "StyledList__StyledOrderedList",
|
|
20
20
|
componentId: "sc-jdbsfi-0"
|
|
21
21
|
})(["", ";", ";"], props => listStyles(props), props => retrieveComponentStyles(ORDERED_ID, props));
|
|
22
|
-
StyledOrderedList.defaultProps = {
|
|
23
|
-
theme: DEFAULT_THEME
|
|
24
|
-
};
|
|
25
22
|
const UNORDERED_ID = 'typography.unordered_list';
|
|
26
23
|
const StyledUnorderedList = styled.ul.attrs({
|
|
27
24
|
'data-garden-id': UNORDERED_ID,
|
|
28
|
-
'data-garden-version': '9.0.0-next.
|
|
25
|
+
'data-garden-version': '9.0.0-next.25'
|
|
29
26
|
}).withConfig({
|
|
30
27
|
displayName: "StyledList__StyledUnorderedList",
|
|
31
28
|
componentId: "sc-jdbsfi-1"
|
|
32
29
|
})(["", ";", ";"], props => listStyles(props), props => retrieveComponentStyles(UNORDERED_ID, props));
|
|
33
|
-
StyledUnorderedList.defaultProps = {
|
|
34
|
-
theme: DEFAULT_THEME
|
|
35
|
-
};
|
|
36
30
|
|
|
37
31
|
export { StyledOrderedList, StyledUnorderedList };
|
|
@@ -21,7 +21,7 @@ const listItemStyles = props => {
|
|
|
21
21
|
const ORDERED_ID = 'typography.ordered_list_item';
|
|
22
22
|
const StyledOrderedListItem = styled(StyledFont).attrs({
|
|
23
23
|
'data-garden-id': ORDERED_ID,
|
|
24
|
-
'data-garden-version': '9.0.0-next.
|
|
24
|
+
'data-garden-version': '9.0.0-next.25',
|
|
25
25
|
as: 'li'
|
|
26
26
|
}).withConfig({
|
|
27
27
|
displayName: "StyledListItem__StyledOrderedListItem",
|
|
@@ -34,7 +34,7 @@ StyledOrderedListItem.defaultProps = {
|
|
|
34
34
|
const UNORDERED_ID = 'typography.unordered_list_item';
|
|
35
35
|
const StyledUnorderedListItem = styled(StyledFont).attrs({
|
|
36
36
|
'data-garden-id': UNORDERED_ID,
|
|
37
|
-
'data-garden-version': '9.0.0-next.
|
|
37
|
+
'data-garden-version': '9.0.0-next.25',
|
|
38
38
|
as: 'li'
|
|
39
39
|
}).withConfig({
|
|
40
40
|
displayName: "StyledListItem__StyledUnorderedListItem",
|
|
@@ -5,19 +5,16 @@
|
|
|
5
5
|
* found at http://www.apache.org/licenses/LICENSE-2.0.
|
|
6
6
|
*/
|
|
7
7
|
import styled from 'styled-components';
|
|
8
|
-
import { retrieveComponentStyles
|
|
8
|
+
import { retrieveComponentStyles } from '@zendeskgarden/react-theming';
|
|
9
9
|
import { THEME_SIZES } from './StyledFont.js';
|
|
10
10
|
|
|
11
11
|
const COMPONENT_ID = 'typography.paragraph';
|
|
12
12
|
const StyledParagraph = styled.p.attrs({
|
|
13
13
|
'data-garden-id': COMPONENT_ID,
|
|
14
|
-
'data-garden-version': '9.0.0-next.
|
|
14
|
+
'data-garden-version': '9.0.0-next.25'
|
|
15
15
|
}).withConfig({
|
|
16
16
|
displayName: "StyledParagraph",
|
|
17
17
|
componentId: "sc-zkuftz-0"
|
|
18
18
|
})(["margin:0;padding:0;direction:", ";& + &,blockquote + &{margin-top:", ";}", ";"], props => props.theme.rtl ? 'rtl' : 'ltr', props => props.theme.lineHeights[THEME_SIZES[props.size]], props => retrieveComponentStyles(COMPONENT_ID, props));
|
|
19
|
-
StyledParagraph.defaultProps = {
|
|
20
|
-
theme: DEFAULT_THEME
|
|
21
|
-
};
|
|
22
19
|
|
|
23
20
|
export { StyledParagraph };
|
package/dist/index.cjs.js
CHANGED
|
@@ -85,7 +85,7 @@ const fontStyles = _ref => {
|
|
|
85
85
|
};
|
|
86
86
|
const StyledFont = styled__default.default.div.attrs({
|
|
87
87
|
'data-garden-id': COMPONENT_ID$9,
|
|
88
|
-
'data-garden-version': '9.0.0-next.
|
|
88
|
+
'data-garden-version': '9.0.0-next.25'
|
|
89
89
|
}).withConfig({
|
|
90
90
|
displayName: "StyledFont",
|
|
91
91
|
componentId: "sc-1iildbo-0"
|
|
@@ -98,7 +98,7 @@ StyledFont.defaultProps = {
|
|
|
98
98
|
const COMPONENT_ID$8 = 'typography.blockquote';
|
|
99
99
|
const StyledBlockquote = styled__default.default.blockquote.attrs({
|
|
100
100
|
'data-garden-id': COMPONENT_ID$8,
|
|
101
|
-
'data-garden-version': '9.0.0-next.
|
|
101
|
+
'data-garden-version': '9.0.0-next.25'
|
|
102
102
|
}).withConfig({
|
|
103
103
|
displayName: "StyledBlockquote",
|
|
104
104
|
componentId: "sc-1tt3ye0-0"
|
|
@@ -106,9 +106,6 @@ const StyledBlockquote = styled__default.default.blockquote.attrs({
|
|
|
106
106
|
theme: props.theme,
|
|
107
107
|
variable: 'border.default'
|
|
108
108
|
}), props => props.theme.rtl ? 'right' : 'left', props => props.theme.space.base * 4, props => props.theme.rtl ? 'rtl' : 'ltr', props => props.theme.lineHeights[THEME_SIZES[props.size]], props => reactTheming.retrieveComponentStyles(COMPONENT_ID$8, props));
|
|
109
|
-
StyledBlockquote.defaultProps = {
|
|
110
|
-
theme: reactTheming.DEFAULT_THEME
|
|
111
|
-
};
|
|
112
109
|
|
|
113
110
|
const COMPONENT_ID$7 = 'typography.code';
|
|
114
111
|
const colorStyles$3 = _ref => {
|
|
@@ -152,7 +149,7 @@ const colorStyles$3 = _ref => {
|
|
|
152
149
|
};
|
|
153
150
|
const StyledCode = styled__default.default(StyledFont).attrs({
|
|
154
151
|
'data-garden-id': COMPONENT_ID$7,
|
|
155
|
-
'data-garden-version': '9.0.0-next.
|
|
152
|
+
'data-garden-version': '9.0.0-next.25',
|
|
156
153
|
as: 'code',
|
|
157
154
|
isMonospace: true
|
|
158
155
|
}).withConfig({
|
|
@@ -182,28 +179,22 @@ const colorStyles$2 = _ref => {
|
|
|
182
179
|
};
|
|
183
180
|
const StyledCodeBlock = styled__default.default.pre.attrs({
|
|
184
181
|
'data-garden-id': COMPONENT_ID$6,
|
|
185
|
-
'data-garden-version': '9.0.0-next.
|
|
182
|
+
'data-garden-version': '9.0.0-next.25'
|
|
186
183
|
}).withConfig({
|
|
187
184
|
displayName: "StyledCodeBlock",
|
|
188
185
|
componentId: "sc-5wky57-0"
|
|
189
186
|
})(["display:table;margin:0;padding:", "px;box-sizing:border-box;width:100%;direction:ltr;white-space:pre;counter-reset:linenumber;", ";", ";"], props => props.theme.space.base * 3, colorStyles$2, props => reactTheming.retrieveComponentStyles(COMPONENT_ID$6, props));
|
|
190
|
-
StyledCodeBlock.defaultProps = {
|
|
191
|
-
theme: reactTheming.DEFAULT_THEME
|
|
192
|
-
};
|
|
193
187
|
|
|
194
188
|
const COMPONENT_ID$5 = 'typography.codeblock_container';
|
|
195
189
|
const StyledCodeBlockContainer = styled__default.default.div.attrs({
|
|
196
190
|
'data-garden-id': COMPONENT_ID$5,
|
|
197
|
-
'data-garden-version': '9.0.0-next.
|
|
191
|
+
'data-garden-version': '9.0.0-next.25'
|
|
198
192
|
}).withConfig({
|
|
199
193
|
displayName: "StyledCodeBlockContainer",
|
|
200
194
|
componentId: "sc-14zgbfw-0"
|
|
201
195
|
})(["transition:box-shadow 0.1s ease-in-out;overflow:auto;", " ", ";"], props => reactTheming.focusStyles({
|
|
202
196
|
theme: props.theme
|
|
203
197
|
}), props => reactTheming.retrieveComponentStyles(COMPONENT_ID$5, props));
|
|
204
|
-
StyledCodeBlockContainer.defaultProps = {
|
|
205
|
-
theme: reactTheming.DEFAULT_THEME
|
|
206
|
-
};
|
|
207
198
|
|
|
208
199
|
const COMPONENT_ID$4 = 'typography.codeblock_code';
|
|
209
200
|
const colorStyles$1 = _ref => {
|
|
@@ -283,16 +274,13 @@ const lineNumberStyles = _ref2 => {
|
|
|
283
274
|
};
|
|
284
275
|
const StyledCodeBlockLine = styled__default.default(StyledFont).attrs({
|
|
285
276
|
'data-garden-id': COMPONENT_ID$4,
|
|
286
|
-
'data-garden-version': '9.0.0-next.
|
|
277
|
+
'data-garden-version': '9.0.0-next.25',
|
|
287
278
|
as: 'code',
|
|
288
279
|
isMonospace: true
|
|
289
280
|
}).withConfig({
|
|
290
281
|
displayName: "StyledCodeBlockLine",
|
|
291
282
|
componentId: "sc-1goay17-0"
|
|
292
283
|
})(["display:table-row;height:", ";direction:ltr;", ";", ";&::after{display:inline-block;width:", "px;content:'';}", ";"], props => props.theme.lineHeights[THEME_SIZES[props.size]], colorStyles$1, props => props.isNumbered && lineNumberStyles(props), props => props.theme.space.base * 3, props => reactTheming.retrieveComponentStyles(COMPONENT_ID$4, props));
|
|
293
|
-
StyledCodeBlockLine.defaultProps = {
|
|
294
|
-
theme: reactTheming.DEFAULT_THEME
|
|
295
|
-
};
|
|
296
284
|
|
|
297
285
|
const COMPONENT_ID$3 = 'typography.codeblock_token';
|
|
298
286
|
const colorStyles = _ref => {
|
|
@@ -457,26 +445,20 @@ const colorStyles = _ref => {
|
|
|
457
445
|
};
|
|
458
446
|
const StyledCodeBlockToken = styled__default.default.span.attrs({
|
|
459
447
|
'data-garden-id': COMPONENT_ID$3,
|
|
460
|
-
'data-garden-version': '9.0.0-next.
|
|
448
|
+
'data-garden-version': '9.0.0-next.25'
|
|
461
449
|
}).withConfig({
|
|
462
450
|
displayName: "StyledCodeBlockToken",
|
|
463
451
|
componentId: "sc-1hkshdq-0"
|
|
464
452
|
})(["display:inline-block;&.bold:not(.diff){font-weight:", ";}&.coord{padding-left:0.75em;}&.italic{font-style:italic;}&.prefix{width:2em;text-align:center;}", ";", ";"], props => props.theme.fontWeights.semibold, colorStyles, props => reactTheming.retrieveComponentStyles(COMPONENT_ID$3, props));
|
|
465
|
-
StyledCodeBlockToken.defaultProps = {
|
|
466
|
-
theme: reactTheming.DEFAULT_THEME
|
|
467
|
-
};
|
|
468
453
|
|
|
469
454
|
const COMPONENT_ID$2 = 'typography.ellipsis';
|
|
470
455
|
const StyledEllipsis = styled__default.default.div.attrs({
|
|
471
456
|
'data-garden-id': COMPONENT_ID$2,
|
|
472
|
-
'data-garden-version': '9.0.0-next.
|
|
457
|
+
'data-garden-version': '9.0.0-next.25'
|
|
473
458
|
}).withConfig({
|
|
474
459
|
displayName: "StyledEllipsis",
|
|
475
460
|
componentId: "sc-1u4uqmy-0"
|
|
476
461
|
})(["overflow:hidden;text-overflow:ellipsis;white-space:nowrap;direction:", ";", ";"], props => props.theme.rtl ? 'rtl' : 'ltr', props => reactTheming.retrieveComponentStyles(COMPONENT_ID$2, props));
|
|
477
|
-
StyledEllipsis.defaultProps = {
|
|
478
|
-
theme: reactTheming.DEFAULT_THEME
|
|
479
|
-
};
|
|
480
462
|
|
|
481
463
|
const COMPONENT_ID$1 = 'typography.icon';
|
|
482
464
|
const sizeStyles = props => {
|
|
@@ -486,14 +468,11 @@ const sizeStyles = props => {
|
|
|
486
468
|
};
|
|
487
469
|
const StyledIcon = styled__default.default(reactTheming.StyledBaseIcon).attrs({
|
|
488
470
|
'data-garden-id': COMPONENT_ID$1,
|
|
489
|
-
'data-garden-version': '9.0.0-next.
|
|
471
|
+
'data-garden-version': '9.0.0-next.25'
|
|
490
472
|
}).withConfig({
|
|
491
473
|
displayName: "StyledIcon",
|
|
492
474
|
componentId: "sc-10rfb5b-0"
|
|
493
475
|
})(["position:relative;top:-1px;vertical-align:middle;", ";", ";"], props => sizeStyles(props), props => reactTheming.retrieveComponentStyles(COMPONENT_ID$1, props));
|
|
494
|
-
StyledIcon.defaultProps = {
|
|
495
|
-
theme: reactTheming.DEFAULT_THEME
|
|
496
|
-
};
|
|
497
476
|
|
|
498
477
|
const listStyles = props => {
|
|
499
478
|
const rtl = props.theme.rtl;
|
|
@@ -502,25 +481,19 @@ const listStyles = props => {
|
|
|
502
481
|
const ORDERED_ID$1 = 'typography.ordered_list';
|
|
503
482
|
const StyledOrderedList = styled__default.default.ol.attrs({
|
|
504
483
|
'data-garden-id': ORDERED_ID$1,
|
|
505
|
-
'data-garden-version': '9.0.0-next.
|
|
484
|
+
'data-garden-version': '9.0.0-next.25'
|
|
506
485
|
}).withConfig({
|
|
507
486
|
displayName: "StyledList__StyledOrderedList",
|
|
508
487
|
componentId: "sc-jdbsfi-0"
|
|
509
488
|
})(["", ";", ";"], props => listStyles(props), props => reactTheming.retrieveComponentStyles(ORDERED_ID$1, props));
|
|
510
|
-
StyledOrderedList.defaultProps = {
|
|
511
|
-
theme: reactTheming.DEFAULT_THEME
|
|
512
|
-
};
|
|
513
489
|
const UNORDERED_ID$1 = 'typography.unordered_list';
|
|
514
490
|
const StyledUnorderedList = styled__default.default.ul.attrs({
|
|
515
491
|
'data-garden-id': UNORDERED_ID$1,
|
|
516
|
-
'data-garden-version': '9.0.0-next.
|
|
492
|
+
'data-garden-version': '9.0.0-next.25'
|
|
517
493
|
}).withConfig({
|
|
518
494
|
displayName: "StyledList__StyledUnorderedList",
|
|
519
495
|
componentId: "sc-jdbsfi-1"
|
|
520
496
|
})(["", ";", ";"], props => listStyles(props), props => reactTheming.retrieveComponentStyles(UNORDERED_ID$1, props));
|
|
521
|
-
StyledUnorderedList.defaultProps = {
|
|
522
|
-
theme: reactTheming.DEFAULT_THEME
|
|
523
|
-
};
|
|
524
497
|
|
|
525
498
|
const listItemPaddingStyles = props => {
|
|
526
499
|
const base = props.theme.space.base;
|
|
@@ -533,7 +506,7 @@ const listItemStyles = props => {
|
|
|
533
506
|
const ORDERED_ID = 'typography.ordered_list_item';
|
|
534
507
|
const StyledOrderedListItem = styled__default.default(StyledFont).attrs({
|
|
535
508
|
'data-garden-id': ORDERED_ID,
|
|
536
|
-
'data-garden-version': '9.0.0-next.
|
|
509
|
+
'data-garden-version': '9.0.0-next.25',
|
|
537
510
|
as: 'li'
|
|
538
511
|
}).withConfig({
|
|
539
512
|
displayName: "StyledListItem__StyledOrderedListItem",
|
|
@@ -546,7 +519,7 @@ StyledOrderedListItem.defaultProps = {
|
|
|
546
519
|
const UNORDERED_ID = 'typography.unordered_list_item';
|
|
547
520
|
const StyledUnorderedListItem = styled__default.default(StyledFont).attrs({
|
|
548
521
|
'data-garden-id': UNORDERED_ID,
|
|
549
|
-
'data-garden-version': '9.0.0-next.
|
|
522
|
+
'data-garden-version': '9.0.0-next.25',
|
|
550
523
|
as: 'li'
|
|
551
524
|
}).withConfig({
|
|
552
525
|
displayName: "StyledListItem__StyledUnorderedListItem",
|
|
@@ -560,14 +533,11 @@ StyledUnorderedListItem.defaultProps = {
|
|
|
560
533
|
const COMPONENT_ID = 'typography.paragraph';
|
|
561
534
|
const StyledParagraph = styled__default.default.p.attrs({
|
|
562
535
|
'data-garden-id': COMPONENT_ID,
|
|
563
|
-
'data-garden-version': '9.0.0-next.
|
|
536
|
+
'data-garden-version': '9.0.0-next.25'
|
|
564
537
|
}).withConfig({
|
|
565
538
|
displayName: "StyledParagraph",
|
|
566
539
|
componentId: "sc-zkuftz-0"
|
|
567
540
|
})(["margin:0;padding:0;direction:", ";& + &,blockquote + &{margin-top:", ";}", ";"], props => props.theme.rtl ? 'rtl' : 'ltr', props => props.theme.lineHeights[THEME_SIZES[props.size]], props => reactTheming.retrieveComponentStyles(COMPONENT_ID, props));
|
|
568
|
-
StyledParagraph.defaultProps = {
|
|
569
|
-
theme: reactTheming.DEFAULT_THEME
|
|
570
|
-
};
|
|
571
541
|
|
|
572
542
|
const SM = React.forwardRef((_ref, ref) => {
|
|
573
543
|
let {
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@zendeskgarden/react-typography",
|
|
3
|
-
"version": "9.0.0-next.
|
|
3
|
+
"version": "9.0.0-next.25",
|
|
4
4
|
"description": "Components relating to typography in the Garden Design System",
|
|
5
5
|
"license": "Apache-2.0",
|
|
6
6
|
"author": "Zendesk Garden <garden@zendesk.com>",
|
|
@@ -34,7 +34,7 @@
|
|
|
34
34
|
"styled-components": "^5.3.1"
|
|
35
35
|
},
|
|
36
36
|
"devDependencies": {
|
|
37
|
-
"@zendeskgarden/react-theming": "^9.0.0-next.
|
|
37
|
+
"@zendeskgarden/react-theming": "^9.0.0-next.25"
|
|
38
38
|
},
|
|
39
39
|
"keywords": [
|
|
40
40
|
"components",
|
|
@@ -46,5 +46,5 @@
|
|
|
46
46
|
"access": "public"
|
|
47
47
|
},
|
|
48
48
|
"zendeskgarden:src": "src/index.ts",
|
|
49
|
-
"gitHead": "
|
|
49
|
+
"gitHead": "460751d630ab1c46e11810d60e4d7701b9d30b8f"
|
|
50
50
|
}
|