1 | import postcss from 'postcss'
|
2 | import isPlainObject from './isPlainObject'
|
3 |
|
4 | export default function transformThemeValue(themeSection) {
|
5 | if (['fontSize', 'outline'].includes(themeSection)) {
|
6 | return (value) => {
|
7 | if (typeof value === 'function') value = value({})
|
8 | if (Array.isArray(value)) value = value[0]
|
9 |
|
10 | return value
|
11 | }
|
12 | }
|
13 |
|
14 | if (themeSection === 'fontFamily') {
|
15 | return (value) => {
|
16 | if (typeof value === 'function') value = value({})
|
17 | let families = Array.isArray(value) && isPlainObject(value[1]) ? value[0] : value
|
18 | return Array.isArray(families) ? families.join(', ') : families
|
19 | }
|
20 | }
|
21 |
|
22 | if (
|
23 | [
|
24 | 'boxShadow',
|
25 | 'transitionProperty',
|
26 | 'transitionDuration',
|
27 | 'transitionDelay',
|
28 | 'transitionTimingFunction',
|
29 | 'backgroundImage',
|
30 | 'backgroundSize',
|
31 | 'backgroundColor',
|
32 | 'cursor',
|
33 | 'animation',
|
34 | ].includes(themeSection)
|
35 | ) {
|
36 | return (value) => {
|
37 | if (typeof value === 'function') value = value({})
|
38 | if (Array.isArray(value)) value = value.join(', ')
|
39 |
|
40 | return value
|
41 | }
|
42 | }
|
43 |
|
44 |
|
45 |
|
46 | if (['gridTemplateColumns', 'gridTemplateRows', 'objectPosition'].includes(themeSection)) {
|
47 | return (value) => {
|
48 | if (typeof value === 'function') value = value({})
|
49 | if (typeof value === 'string') value = postcss.list.comma(value).join(' ')
|
50 |
|
51 | return value
|
52 | }
|
53 | }
|
54 |
|
55 | return (value, opts = {}) => {
|
56 | if (typeof value === 'function') {
|
57 | value = value(opts)
|
58 | }
|
59 |
|
60 | return value
|
61 | }
|
62 | }
|