@sproutsocial/racine 11.6.0 → 11.6.1-input-beta.1
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 +13 -0
- package/__flow__/Checkbox/styles.js +75 -75
- package/__flow__/Collapsible/index.js +3 -2
- package/__flow__/Image/index.js +10 -2
- package/__flow__/Input/index.js +48 -16
- package/__flow__/Input/index.stories.js +14 -0
- package/__flow__/Input/index.test.js +18 -0
- package/__flow__/Input/styles.js +2 -2
- package/__flow__/SegmentedControl/index.js +3 -2
- package/__flow__/TableCell/index.js +9 -2
- package/__flow__/ThemeProvider/index.js +1 -2
- package/__flow__/ToggleHint/index.js +9 -2
- package/__flow__/index.js +1 -2
- package/__flow__/systemProps/color.js +1 -2
- package/__flow__/themes/dark/theme.js +3 -3
- package/__flow__/themes/extendedThemes/sproutTheme/dark/theme.js +34 -15
- package/__flow__/themes/extendedThemes/sproutTheme/index.js +0 -1
- package/__flow__/themes/extendedThemes/sproutTheme/light/theme.js +34 -15
- package/__flow__/types/theme.colors.flow.js +8 -1
- package/__flow__/types/theme.flow.js +10 -13
- package/__flow__/utils/responsiveProps/index.test.js +10 -2
- package/commonjs/Input/index.js +40 -16
- package/commonjs/Input/styles.js +2 -2
- package/commonjs/themes/dark/theme.js +3 -3
- package/commonjs/themes/extendedThemes/sproutTheme/dark/theme.js +36 -15
- package/commonjs/themes/extendedThemes/sproutTheme/light/theme.js +36 -15
- package/commonjs/types/theme.flow.js +3 -1
- package/dist/themes/dark/dark.scss +0 -3
- package/lib/Input/index.js +40 -16
- package/lib/Input/styles.js +2 -2
- package/lib/themes/dark/theme.js +3 -3
- package/lib/themes/extendedThemes/sproutTheme/dark/theme.js +33 -10
- package/lib/themes/extendedThemes/sproutTheme/light/theme.js +33 -10
- package/lib/types/theme.flow.js +2 -1
- package/package.json +2 -3
- package/__flow__/themes/extendedThemes/sproutTheme/NonColorThemeValues/index.js +0 -17
- package/__flow__/themes/extendedThemes/sproutTheme/dark/getDarkThemeColors.js +0 -36
- package/__flow__/themes/extendedThemes/sproutTheme/light/getLightThemeColors.js +0 -36
- package/__flow__/themes/extendedThemes/sproutTheme/sproutThemeType.flow.js +0 -36
- package/commonjs/themes/extendedThemes/sproutTheme/NonColorThemeValues/index.js +0 -16
- package/commonjs/themes/extendedThemes/sproutTheme/dark/getDarkThemeColors.js +0 -39
- package/commonjs/themes/extendedThemes/sproutTheme/light/getLightThemeColors.js +0 -39
- package/commonjs/themes/extendedThemes/sproutTheme/sproutThemeType.flow.js +0 -1
- package/lib/themes/extendedThemes/sproutTheme/NonColorThemeValues/index.js +0 -12
- package/lib/themes/extendedThemes/sproutTheme/dark/getDarkThemeColors.js +0 -34
- package/lib/themes/extendedThemes/sproutTheme/light/getLightThemeColors.js +0 -34
- package/lib/themes/extendedThemes/sproutTheme/sproutThemeType.flow.js +0 -0
|
@@ -1,17 +0,0 @@
|
|
|
1
|
-
// @flow strict-local
|
|
2
|
-
import type {
|
|
3
|
-
TypeNonColorThemeValues,
|
|
4
|
-
TypeTheme,
|
|
5
|
-
} from "../../../../types/theme.flow.js";
|
|
6
|
-
|
|
7
|
-
export function getNonColorThemeValues(
|
|
8
|
-
theme: TypeTheme
|
|
9
|
-
): TypeNonColorThemeValues {
|
|
10
|
-
const { colors, ...otherThemeValues } = theme;
|
|
11
|
-
return {
|
|
12
|
-
...otherThemeValues,
|
|
13
|
-
/**
|
|
14
|
-
* You can add your own theme values or overrides here.
|
|
15
|
-
*/
|
|
16
|
-
};
|
|
17
|
-
}
|
|
@@ -1,36 +0,0 @@
|
|
|
1
|
-
// @flow strict-local
|
|
2
|
-
import type { TypeColors } from "../../../../types/theme.colors.flow.js";
|
|
3
|
-
|
|
4
|
-
export function getDarkThemeColors(themeColors: TypeColors) {
|
|
5
|
-
return {
|
|
6
|
-
...themeColors,
|
|
7
|
-
navigation: {
|
|
8
|
-
main: {
|
|
9
|
-
background: {
|
|
10
|
-
base: themeColors.neutral[1000],
|
|
11
|
-
gradient: themeColors.neutral[1100],
|
|
12
|
-
},
|
|
13
|
-
},
|
|
14
|
-
secondary: {
|
|
15
|
-
background: {
|
|
16
|
-
base: themeColors.neutral[900],
|
|
17
|
-
},
|
|
18
|
-
},
|
|
19
|
-
text: {
|
|
20
|
-
base: themeColors.neutral[0],
|
|
21
|
-
hover: themeColors.neutral[0],
|
|
22
|
-
},
|
|
23
|
-
icon: {
|
|
24
|
-
base: themeColors.neutral[0],
|
|
25
|
-
hover: themeColors.neutral[0],
|
|
26
|
-
},
|
|
27
|
-
listItem: {
|
|
28
|
-
background: {
|
|
29
|
-
base: themeColors.neutral[1000],
|
|
30
|
-
hover: themeColors.neutral[1100],
|
|
31
|
-
active: themeColors.neutral[700],
|
|
32
|
-
},
|
|
33
|
-
},
|
|
34
|
-
},
|
|
35
|
-
};
|
|
36
|
-
}
|
|
@@ -1,36 +0,0 @@
|
|
|
1
|
-
// @flow strict-local
|
|
2
|
-
import type { TypeColors } from "../../../../types/theme.colors.flow.js";
|
|
3
|
-
|
|
4
|
-
export function getLightThemeColors(themeColors: TypeColors) {
|
|
5
|
-
return {
|
|
6
|
-
...themeColors,
|
|
7
|
-
navigation: {
|
|
8
|
-
main: {
|
|
9
|
-
background: {
|
|
10
|
-
base: themeColors.neutral[900],
|
|
11
|
-
overflowGradient: themeColors.neutral[1000],
|
|
12
|
-
},
|
|
13
|
-
},
|
|
14
|
-
secondary: {
|
|
15
|
-
background: {
|
|
16
|
-
base: themeColors.neutral[800],
|
|
17
|
-
},
|
|
18
|
-
},
|
|
19
|
-
text: {
|
|
20
|
-
base: themeColors.neutral[0],
|
|
21
|
-
hover: themeColors.neutral[0],
|
|
22
|
-
},
|
|
23
|
-
icon: {
|
|
24
|
-
base: themeColors.neutral[0],
|
|
25
|
-
hover: themeColors.neutral[0],
|
|
26
|
-
},
|
|
27
|
-
listItem: {
|
|
28
|
-
background: {
|
|
29
|
-
base: themeColors.neutral[800],
|
|
30
|
-
hover: themeColors.neutral[1000],
|
|
31
|
-
selected: themeColors.neutral[700],
|
|
32
|
-
},
|
|
33
|
-
},
|
|
34
|
-
},
|
|
35
|
-
};
|
|
36
|
-
}
|
|
@@ -1,36 +0,0 @@
|
|
|
1
|
-
// @flow strict-local
|
|
2
|
-
import type { TypeTheme } from "../../../types/theme.flow";
|
|
3
|
-
|
|
4
|
-
export type TypeSproutTheme = {
|
|
5
|
-
...$Exact<TypeTheme>,
|
|
6
|
-
colors: {|
|
|
7
|
-
navigation: {|
|
|
8
|
-
main: {|
|
|
9
|
-
background: {|
|
|
10
|
-
base: string,
|
|
11
|
-
gradient: string,
|
|
12
|
-
|},
|
|
13
|
-
|},
|
|
14
|
-
secondary: {|
|
|
15
|
-
background: {|
|
|
16
|
-
base: string,
|
|
17
|
-
|},
|
|
18
|
-
|},
|
|
19
|
-
text: {|
|
|
20
|
-
base: string,
|
|
21
|
-
hover: string,
|
|
22
|
-
|},
|
|
23
|
-
icon: {|
|
|
24
|
-
base: string,
|
|
25
|
-
hover: string,
|
|
26
|
-
|},
|
|
27
|
-
listItem: {|
|
|
28
|
-
background: {|
|
|
29
|
-
base: string,
|
|
30
|
-
hover: string,
|
|
31
|
-
active: string,
|
|
32
|
-
|},
|
|
33
|
-
|},
|
|
34
|
-
|},
|
|
35
|
-
|},
|
|
36
|
-
};
|
|
@@ -1,16 +0,0 @@
|
|
|
1
|
-
"use strict";
|
|
2
|
-
|
|
3
|
-
exports.__esModule = true;
|
|
4
|
-
exports.getNonColorThemeValues = getNonColorThemeValues;
|
|
5
|
-
var _excluded = ["colors"];
|
|
6
|
-
|
|
7
|
-
function _extends() { _extends = Object.assign || function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }
|
|
8
|
-
|
|
9
|
-
function _objectWithoutPropertiesLoose(source, excluded) { if (source == null) return {}; var target = {}; var sourceKeys = Object.keys(source); var key, i; for (i = 0; i < sourceKeys.length; i++) { key = sourceKeys[i]; if (excluded.indexOf(key) >= 0) continue; target[key] = source[key]; } return target; }
|
|
10
|
-
|
|
11
|
-
function getNonColorThemeValues(theme) {
|
|
12
|
-
var colors = theme.colors,
|
|
13
|
-
otherThemeValues = _objectWithoutPropertiesLoose(theme, _excluded);
|
|
14
|
-
|
|
15
|
-
return _extends({}, otherThemeValues);
|
|
16
|
-
}
|
|
@@ -1,39 +0,0 @@
|
|
|
1
|
-
"use strict";
|
|
2
|
-
|
|
3
|
-
exports.__esModule = true;
|
|
4
|
-
exports.getDarkThemeColors = getDarkThemeColors;
|
|
5
|
-
|
|
6
|
-
function _extends() { _extends = Object.assign || function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }
|
|
7
|
-
|
|
8
|
-
function getDarkThemeColors(themeColors) {
|
|
9
|
-
return _extends({}, themeColors, {
|
|
10
|
-
navigation: {
|
|
11
|
-
main: {
|
|
12
|
-
background: {
|
|
13
|
-
base: themeColors.neutral[1000],
|
|
14
|
-
gradient: themeColors.neutral[1100]
|
|
15
|
-
}
|
|
16
|
-
},
|
|
17
|
-
secondary: {
|
|
18
|
-
background: {
|
|
19
|
-
base: themeColors.neutral[900]
|
|
20
|
-
}
|
|
21
|
-
},
|
|
22
|
-
text: {
|
|
23
|
-
base: themeColors.neutral[0],
|
|
24
|
-
hover: themeColors.neutral[0]
|
|
25
|
-
},
|
|
26
|
-
icon: {
|
|
27
|
-
base: themeColors.neutral[0],
|
|
28
|
-
hover: themeColors.neutral[0]
|
|
29
|
-
},
|
|
30
|
-
listItem: {
|
|
31
|
-
background: {
|
|
32
|
-
base: themeColors.neutral[1000],
|
|
33
|
-
hover: themeColors.neutral[1100],
|
|
34
|
-
active: themeColors.neutral[700]
|
|
35
|
-
}
|
|
36
|
-
}
|
|
37
|
-
}
|
|
38
|
-
});
|
|
39
|
-
}
|
|
@@ -1,39 +0,0 @@
|
|
|
1
|
-
"use strict";
|
|
2
|
-
|
|
3
|
-
exports.__esModule = true;
|
|
4
|
-
exports.getLightThemeColors = getLightThemeColors;
|
|
5
|
-
|
|
6
|
-
function _extends() { _extends = Object.assign || function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }
|
|
7
|
-
|
|
8
|
-
function getLightThemeColors(themeColors) {
|
|
9
|
-
return _extends({}, themeColors, {
|
|
10
|
-
navigation: {
|
|
11
|
-
main: {
|
|
12
|
-
background: {
|
|
13
|
-
base: themeColors.neutral[900],
|
|
14
|
-
overflowGradient: themeColors.neutral[1000]
|
|
15
|
-
}
|
|
16
|
-
},
|
|
17
|
-
secondary: {
|
|
18
|
-
background: {
|
|
19
|
-
base: themeColors.neutral[800]
|
|
20
|
-
}
|
|
21
|
-
},
|
|
22
|
-
text: {
|
|
23
|
-
base: themeColors.neutral[0],
|
|
24
|
-
hover: themeColors.neutral[0]
|
|
25
|
-
},
|
|
26
|
-
icon: {
|
|
27
|
-
base: themeColors.neutral[0],
|
|
28
|
-
hover: themeColors.neutral[0]
|
|
29
|
-
},
|
|
30
|
-
listItem: {
|
|
31
|
-
background: {
|
|
32
|
-
base: themeColors.neutral[800],
|
|
33
|
-
hover: themeColors.neutral[1000],
|
|
34
|
-
selected: themeColors.neutral[700]
|
|
35
|
-
}
|
|
36
|
-
}
|
|
37
|
-
}
|
|
38
|
-
});
|
|
39
|
-
}
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
"use strict";
|
|
@@ -1,12 +0,0 @@
|
|
|
1
|
-
var _excluded = ["colors"];
|
|
2
|
-
|
|
3
|
-
function _extends() { _extends = Object.assign || function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }
|
|
4
|
-
|
|
5
|
-
function _objectWithoutPropertiesLoose(source, excluded) { if (source == null) return {}; var target = {}; var sourceKeys = Object.keys(source); var key, i; for (i = 0; i < sourceKeys.length; i++) { key = sourceKeys[i]; if (excluded.indexOf(key) >= 0) continue; target[key] = source[key]; } return target; }
|
|
6
|
-
|
|
7
|
-
export function getNonColorThemeValues(theme) {
|
|
8
|
-
var colors = theme.colors,
|
|
9
|
-
otherThemeValues = _objectWithoutPropertiesLoose(theme, _excluded);
|
|
10
|
-
|
|
11
|
-
return _extends({}, otherThemeValues);
|
|
12
|
-
}
|
|
@@ -1,34 +0,0 @@
|
|
|
1
|
-
function _extends() { _extends = Object.assign || function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }
|
|
2
|
-
|
|
3
|
-
export function getDarkThemeColors(themeColors) {
|
|
4
|
-
return _extends({}, themeColors, {
|
|
5
|
-
navigation: {
|
|
6
|
-
main: {
|
|
7
|
-
background: {
|
|
8
|
-
base: themeColors.neutral[1000],
|
|
9
|
-
gradient: themeColors.neutral[1100]
|
|
10
|
-
}
|
|
11
|
-
},
|
|
12
|
-
secondary: {
|
|
13
|
-
background: {
|
|
14
|
-
base: themeColors.neutral[900]
|
|
15
|
-
}
|
|
16
|
-
},
|
|
17
|
-
text: {
|
|
18
|
-
base: themeColors.neutral[0],
|
|
19
|
-
hover: themeColors.neutral[0]
|
|
20
|
-
},
|
|
21
|
-
icon: {
|
|
22
|
-
base: themeColors.neutral[0],
|
|
23
|
-
hover: themeColors.neutral[0]
|
|
24
|
-
},
|
|
25
|
-
listItem: {
|
|
26
|
-
background: {
|
|
27
|
-
base: themeColors.neutral[1000],
|
|
28
|
-
hover: themeColors.neutral[1100],
|
|
29
|
-
active: themeColors.neutral[700]
|
|
30
|
-
}
|
|
31
|
-
}
|
|
32
|
-
}
|
|
33
|
-
});
|
|
34
|
-
}
|
|
@@ -1,34 +0,0 @@
|
|
|
1
|
-
function _extends() { _extends = Object.assign || function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }
|
|
2
|
-
|
|
3
|
-
export function getLightThemeColors(themeColors) {
|
|
4
|
-
return _extends({}, themeColors, {
|
|
5
|
-
navigation: {
|
|
6
|
-
main: {
|
|
7
|
-
background: {
|
|
8
|
-
base: themeColors.neutral[900],
|
|
9
|
-
overflowGradient: themeColors.neutral[1000]
|
|
10
|
-
}
|
|
11
|
-
},
|
|
12
|
-
secondary: {
|
|
13
|
-
background: {
|
|
14
|
-
base: themeColors.neutral[800]
|
|
15
|
-
}
|
|
16
|
-
},
|
|
17
|
-
text: {
|
|
18
|
-
base: themeColors.neutral[0],
|
|
19
|
-
hover: themeColors.neutral[0]
|
|
20
|
-
},
|
|
21
|
-
icon: {
|
|
22
|
-
base: themeColors.neutral[0],
|
|
23
|
-
hover: themeColors.neutral[0]
|
|
24
|
-
},
|
|
25
|
-
listItem: {
|
|
26
|
-
background: {
|
|
27
|
-
base: themeColors.neutral[800],
|
|
28
|
-
hover: themeColors.neutral[1000],
|
|
29
|
-
selected: themeColors.neutral[700]
|
|
30
|
-
}
|
|
31
|
-
}
|
|
32
|
-
}
|
|
33
|
-
});
|
|
34
|
-
}
|
|
File without changes
|