-
Notifications
You must be signed in to change notification settings - Fork 0
/
index.js
93 lines (86 loc) · 2.3 KB
/
index.js
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
/**
*
* @param {Object} objectToFlatten a multi-level deep object
*
// tslint:disable-next-line:max-line-length
* Source: <https://stackoverflow.com/questions/33036487/one-liner-to-flatten-nested-object>
*
*/
const flattenObject = (objectToFlatten) =>
Object.assign(
{},
...(function _flatten(o) {
return [].concat(
...Object.keys(o).map((k) =>
typeof o[k] === 'object' ? _flatten(o[k]) : { [k]: o[k] },
),
);
})(objectToFlatten),
);
/**
*
* @param {*} array the array to be converted into a dictionary
* @param {*} key_field the field to use as they 'key'
* for each object in the dictionary
*/
const arrayToDictionary = (array, keyField = 'id') => {
const obj = {};
array.forEach((item) => (obj[item[keyField]] = item));
return obj;
};
/**
*
* @param {Object} conditions
* @param {Object} styles
*
* @description matches keys of the provided `conditions` object
* to the keys of the provided `styles` object
* @returns {Object} an empty object, or a flattened object of styles
*
* @example
*
* ```
* const styles = {
* disabled: { activeOpacity: 0.5, },
* bgGreen: { backgroundColor: 'green', },
* }
*
* const combined = combineStyles({ disabled: true, bgGreen: false }, styles)
*
* // => { activeOpacity: 0.5 }
*
* props.isGreen = true
* const combined =
* combineStyles({ disabled: true, bgGreen: props.isGreen }, styles)
*
* // => { activeOpacity: 0.5, backgroundColor: 'green' }
* ```
*/
export const clsx = (conditions, styles) => {
if (!conditions || !styles) {
return {};
}
let results = {};
let normalizedConditions = conditions;
if (Array.isArray(conditions)) {
normalizedConditions = arrayToDictionary(conditions);
normalizedConditions = flattenObject(conditions);
}
Object.keys(normalizedConditions).map((key) => {
if (
normalizedConditions[key] &&
Object.keys(normalizedConditions[key]).length < 1
) {
results = { ...results, ...styles[key] };
return flattenObject(results);
}
if (Object.keys(normalizedConditions[key]).length > 0) {
Object.keys(normalizedConditions[key]).map((secondKey) => {
if (normalizedConditions[key][secondKey]) {
results = { ...results, ...styles[key][secondKey] };
}
});
}
});
return results;
};