@pie-lib/render-ui 4.31.1-next.7 → 4.31.2-next.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 +8 -0
- package/lib/feedback.js +0 -1
- package/lib/feedback.js.map +1 -1
- package/lib/preview-layout.js +1 -45
- package/lib/preview-layout.js.map +1 -1
- package/lib/ui-layout.js +53 -2
- package/lib/ui-layout.js.map +1 -1
- package/package.json +2 -2
- package/src/feedback.jsx +0 -1
- package/src/preview-layout.jsx +2 -49
- package/src/ui-layout.jsx +53 -4
package/CHANGELOG.md
CHANGED
|
@@ -3,6 +3,14 @@
|
|
|
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
|
+
## [4.31.1](https://github.com/pie-framework/pie-lib/compare/@pie-lib/render-ui@4.31.0...@pie-lib/render-ui@4.31.1) (2025-10-09)
|
|
7
|
+
|
|
8
|
+
**Note:** Version bump only for package @pie-lib/render-ui
|
|
9
|
+
|
|
10
|
+
|
|
11
|
+
|
|
12
|
+
|
|
13
|
+
|
|
6
14
|
# [4.31.0](https://github.com/pie-framework/pie-lib/compare/@pie-lib/render-ui@4.15.9...@pie-lib/render-ui@4.31.0) (2025-09-25)
|
|
7
15
|
|
|
8
16
|
|
package/lib/feedback.js
CHANGED
|
@@ -55,7 +55,6 @@ var styleSheet = {
|
|
|
55
55
|
'-webkit-font-smoothing': 'antialiased',
|
|
56
56
|
backgroundColor: "var(--feedback-bg-color, ".concat(color.disabled(), ")"),
|
|
57
57
|
borderRadius: '4px',
|
|
58
|
-
fontFamily: '"Roboto", "Noto", sans-serif',
|
|
59
58
|
lineHeight: '25px',
|
|
60
59
|
margin: '0px',
|
|
61
60
|
padding: '10px',
|
package/lib/feedback.js.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["../src/feedback.jsx"],"names":["styleSheet","corespringFeedback","transformOrigin","width","display","overflow","color","content","backgroundColor","disabled","borderRadius","
|
|
1
|
+
{"version":3,"sources":["../src/feedback.jsx"],"names":["styleSheet","corespringFeedback","transformOrigin","width","display","overflow","color","content","backgroundColor","disabled","borderRadius","lineHeight","margin","padding","verticalAlign","correct","incorrect","feedbackEnter","height","feedbackEnterActive","transition","feedbackLeave","feedbackLeaveActive","Feedback","props","correctness","feedback","classes","chooseFeedback","enter","enterActive","leave","leaveActive","exit","__html","React","Component","PropTypes","string","object","isRequired","name"],"mappings":"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","sourcesContent":["/**\n * Lifted from multiple-choice - TODO: create a shared package for it.\n */\nimport { withStyles } from '@material-ui/core/styles';\n\nimport React from 'react';\nimport { TransitionGroup, CSSTransition } from 'react-transition-group';\nimport classNames from 'classnames';\nimport PropTypes from 'prop-types';\nimport * as color from './color';\n\nconst styleSheet = {\n corespringFeedback: {\n transformOrigin: '0% 0px 0px',\n width: '100%',\n display: 'block',\n overflow: 'hidden',\n '&:.incorrect': {\n color: '#946202',\n },\n },\n content: {\n '-webkit-font-smoothing': 'antialiased',\n backgroundColor: `var(--feedback-bg-color, ${color.disabled()})`,\n borderRadius: '4px',\n lineHeight: '25px',\n margin: '0px',\n padding: '10px',\n verticalAlign: 'middle',\n color: 'var(--feedback-color, white)',\n },\n correct: {\n backgroundColor: `var(--feedback-correct-bg-color, ${color.correct()})`,\n },\n incorrect: {\n backgroundColor: `var(--feedback-incorrect-bg-color, ${color.incorrect()})`,\n },\n feedbackEnter: {\n height: '1px',\n },\n feedbackEnterActive: {\n height: '45px',\n transition: 'height 500ms',\n },\n feedbackLeave: {\n height: '45px',\n },\n feedbackLeaveActive: {\n height: '1px',\n transition: 'height 200ms',\n },\n};\n\nexport class Feedback extends React.Component {\n static propTypes = {\n correctness: PropTypes.string,\n feedback: PropTypes.string,\n classes: PropTypes.object.isRequired,\n };\n\n render() {\n const { correctness, feedback, classes } = this.props;\n\n function chooseFeedback(correctness) {\n if (correctness && feedback) {\n return (\n <CSSTransition\n classNames={{\n enter: classes.feedbackEnter,\n enterActive: classes.feedbackEnterActive,\n leave: classes.feedbackLeave,\n leaveActive: classes.feedbackLeaveActive,\n }}\n key=\"hasFeedback\"\n timeout={{ enter: 500, exit: 300 }}\n >\n <div className={classes.corespringFeedback}>\n <div\n className={classNames(classes.content, classes[correctness])}\n dangerouslySetInnerHTML={{ __html: feedback }}\n />\n </div>\n </CSSTransition>\n );\n } else {\n return null;\n }\n }\n\n return (\n <div>\n <TransitionGroup>{chooseFeedback(correctness)}</TransitionGroup>\n </div>\n );\n }\n}\n\nexport default withStyles(styleSheet, { name: 'Feedback' })(Feedback);\n"],"file":"feedback.js"}
|
package/lib/preview-layout.js
CHANGED
|
@@ -90,54 +90,10 @@ var styles = function styles() {
|
|
|
90
90
|
};
|
|
91
91
|
};
|
|
92
92
|
|
|
93
|
-
var theme = (0, _styles.createMuiTheme)({
|
|
94
|
-
typography: {
|
|
95
|
-
useNextVariants: true
|
|
96
|
-
},
|
|
97
|
-
palette: {
|
|
98
|
-
action: {
|
|
99
|
-
disabled: 'rgba(0, 0, 0, 0.54);'
|
|
100
|
-
}
|
|
101
|
-
},
|
|
102
|
-
overrides: {
|
|
103
|
-
MuiRadio: {
|
|
104
|
-
root: {
|
|
105
|
-
'&$checked': {
|
|
106
|
-
color: '#3f51b5 !important'
|
|
107
|
-
}
|
|
108
|
-
}
|
|
109
|
-
},
|
|
110
|
-
MuiCheckbox: {
|
|
111
|
-
root: {
|
|
112
|
-
'&$checked': {
|
|
113
|
-
color: '#3f51b5 !important'
|
|
114
|
-
}
|
|
115
|
-
}
|
|
116
|
-
},
|
|
117
|
-
MuiTabs: {
|
|
118
|
-
root: {
|
|
119
|
-
borderBottom: '1px solid #eee'
|
|
120
|
-
}
|
|
121
|
-
},
|
|
122
|
-
MuiSwitch: {
|
|
123
|
-
root: {
|
|
124
|
-
'&$checked': {
|
|
125
|
-
color: '#3f51b5 !important',
|
|
126
|
-
'& + $bar': {
|
|
127
|
-
backgroundColor: '#3f51b5 !important',
|
|
128
|
-
opacity: 0.5
|
|
129
|
-
}
|
|
130
|
-
}
|
|
131
|
-
}
|
|
132
|
-
}
|
|
133
|
-
}
|
|
134
|
-
});
|
|
135
93
|
var Styled = (0, _styles.withStyles)(styles)(PreviewLayout);
|
|
136
94
|
|
|
137
95
|
var RootElem = function RootElem(props) {
|
|
138
|
-
return /*#__PURE__*/_react["default"].createElement(
|
|
139
|
-
theme: theme
|
|
140
|
-
}, /*#__PURE__*/_react["default"].createElement(Styled, props));
|
|
96
|
+
return /*#__PURE__*/_react["default"].createElement(Styled, props);
|
|
141
97
|
};
|
|
142
98
|
|
|
143
99
|
var _default = RootElem;
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["../src/preview-layout.jsx"],"names":["PreviewLayout","props","children","classes","ariaLabel","role","extraCSSRules","fontSizeFactor","accessibility","container","React","Component","PropTypes","string","oneOfType","arrayOf","node","isRequired","object","shape","names","rules","number","styles","display","flexDirection","position","
|
|
1
|
+
{"version":3,"sources":["../src/preview-layout.jsx"],"names":["PreviewLayout","props","children","classes","ariaLabel","role","extraCSSRules","fontSizeFactor","accessibility","container","React","Component","PropTypes","string","oneOfType","arrayOf","node","isRequired","object","shape","names","rules","number","styles","display","flexDirection","position","Styled","RootElem"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;AAAA;;AACA;;AACA;;AACA;;;;;;IAEMA,a;;;;;;;;;;;;WAaJ,kBAAS;AACP,wBAA8E,KAAKC,KAAnF;AAAA,UAAQC,QAAR,eAAQA,QAAR;AAAA,UAAkBC,OAAlB,eAAkBA,OAAlB;AAAA,UAA2BC,SAA3B,eAA2BA,SAA3B;AAAA,UAAsCC,IAAtC,eAAsCA,IAAtC;AAAA,UAA4CC,aAA5C,eAA4CA,aAA5C;AAAA,UAA2DC,cAA3D,eAA2DA,cAA3D;AACA,UAAMC,aAAa,GAAGJ,SAAS,GAAG;AAAE,sBAAcA,SAAhB;AAA2BC,QAAAA,IAAI,EAAJA;AAA3B,OAAH,GAAuC,EAAtE;AAEA,0BACE,gCAAC,oBAAD;AACE,QAAA,SAAS,EAAEF,OAAO,CAACM;AADrB,SAEMD,aAFN;AAGE,QAAA,aAAa,EAAEF,aAHjB;AAIE,QAAA,cAAc,EAAEC;AAJlB,UAMGL,QANH,CADF;AAUD;;;EA3ByBQ,kBAAMC,S;;iCAA5BX,a,eACe;AACjBI,EAAAA,SAAS,EAAEQ,sBAAUC,MADJ;AAEjBX,EAAAA,QAAQ,EAAEU,sBAAUE,SAAV,CAAoB,CAACF,sBAAUG,OAAV,CAAkBH,sBAAUI,IAA5B,CAAD,EAAoCJ,sBAAUI,IAA9C,CAApB,EAAyEC,UAFlE;AAGjBd,EAAAA,OAAO,EAAES,sBAAUM,MAHF;AAIjBb,EAAAA,IAAI,EAAEO,sBAAUC,MAJC;AAKjBP,EAAAA,aAAa,EAAEM,sBAAUO,KAAV,CAAgB;AAC7BC,IAAAA,KAAK,EAAER,sBAAUG,OAAV,CAAkBH,sBAAUC,MAA5B,CADsB;AAE7BQ,IAAAA,KAAK,EAAET,sBAAUC;AAFY,GAAhB,CALE;AASjBN,EAAAA,cAAc,EAAEK,sBAAUU;AATT,C;;AA6BrB,IAAMC,MAAM,GAAG,SAATA,MAAS;AAAA,SAAO;AACpBd,IAAAA,SAAS,EAAE;AACTe,MAAAA,OAAO,EAAE,MADA;AAETC,MAAAA,aAAa,EAAE,QAFN;AAGTC,MAAAA,QAAQ,EAAE;AAHD;AADS,GAAP;AAAA,CAAf;;AAQA,IAAMC,MAAM,GAAG,wBAAWJ,MAAX,EAAmBvB,aAAnB,CAAf;;AAEA,IAAM4B,QAAQ,GAAG,SAAXA,QAAW,CAAC3B,KAAD;AAAA,sBAAW,gCAAC,MAAD,EAAYA,KAAZ,CAAX;AAAA,CAAjB;;eAEe2B,Q","sourcesContent":["import React from 'react';\nimport { withStyles } from '@material-ui/core/styles';\nimport PropTypes from 'prop-types';\nimport UiLayout from './ui-layout';\n\nclass PreviewLayout extends React.Component {\n static propTypes = {\n ariaLabel: PropTypes.string,\n children: PropTypes.oneOfType([PropTypes.arrayOf(PropTypes.node), PropTypes.node]).isRequired,\n classes: PropTypes.object,\n role: PropTypes.string,\n extraCSSRules: PropTypes.shape({\n names: PropTypes.arrayOf(PropTypes.string),\n rules: PropTypes.string,\n }),\n fontSizeFactor: PropTypes.number,\n };\n\n render() {\n const { children, classes, ariaLabel, role, extraCSSRules, fontSizeFactor } = this.props;\n const accessibility = ariaLabel ? { 'aria-label': ariaLabel, role } : {};\n\n return (\n <UiLayout\n className={classes.container}\n {...accessibility}\n extraCSSRules={extraCSSRules}\n fontSizeFactor={fontSizeFactor}\n >\n {children}\n </UiLayout>\n );\n }\n}\n\nconst styles = () => ({\n container: {\n display: 'flex',\n flexDirection: 'column',\n position: 'relative',\n },\n});\n\nconst Styled = withStyles(styles)(PreviewLayout);\n\nconst RootElem = (props) => <Styled {...props} />;\n\nexport default RootElem;\n"],"file":"preview-layout.js"}
|
package/lib/ui-layout.js
CHANGED
|
@@ -40,6 +40,55 @@ function _createSuper(Derived) { var hasNativeReflectConstruct = _isNativeReflec
|
|
|
40
40
|
|
|
41
41
|
function _isNativeReflectConstruct() { if (typeof Reflect === "undefined" || !Reflect.construct) return false; if (Reflect.construct.sham) return false; if (typeof Proxy === "function") return true; try { Boolean.prototype.valueOf.call(Reflect.construct(Boolean, [], function () {})); return true; } catch (e) { return false; } }
|
|
42
42
|
|
|
43
|
+
var theme = (0, _styles.createMuiTheme)({
|
|
44
|
+
typography: {
|
|
45
|
+
useNextVariants: true,
|
|
46
|
+
fontFamily: 'inherit'
|
|
47
|
+
},
|
|
48
|
+
palette: {
|
|
49
|
+
action: {
|
|
50
|
+
disabled: 'rgba(0, 0, 0, 0.54);'
|
|
51
|
+
}
|
|
52
|
+
},
|
|
53
|
+
overrides: {
|
|
54
|
+
MuiTypography: {
|
|
55
|
+
root: {
|
|
56
|
+
fontFamily: 'inherit'
|
|
57
|
+
}
|
|
58
|
+
},
|
|
59
|
+
MuiRadio: {
|
|
60
|
+
root: {
|
|
61
|
+
'&$checked': {
|
|
62
|
+
color: '#3f51b5 !important'
|
|
63
|
+
}
|
|
64
|
+
}
|
|
65
|
+
},
|
|
66
|
+
MuiCheckbox: {
|
|
67
|
+
root: {
|
|
68
|
+
'&$checked': {
|
|
69
|
+
color: '#3f51b5 !important'
|
|
70
|
+
}
|
|
71
|
+
}
|
|
72
|
+
},
|
|
73
|
+
MuiTabs: {
|
|
74
|
+
root: {
|
|
75
|
+
borderBottom: '1px solid #eee'
|
|
76
|
+
}
|
|
77
|
+
},
|
|
78
|
+
MuiSwitch: {
|
|
79
|
+
root: {
|
|
80
|
+
'&$checked': {
|
|
81
|
+
color: '#3f51b5 !important',
|
|
82
|
+
'& + $bar': {
|
|
83
|
+
backgroundColor: '#3f51b5 !important',
|
|
84
|
+
opacity: 0.5
|
|
85
|
+
}
|
|
86
|
+
}
|
|
87
|
+
}
|
|
88
|
+
}
|
|
89
|
+
}
|
|
90
|
+
});
|
|
91
|
+
|
|
43
92
|
var UiLayout = /*#__PURE__*/function (_AppendCSSRules) {
|
|
44
93
|
(0, _inherits2["default"])(UiLayout, _AppendCSSRules);
|
|
45
94
|
|
|
@@ -81,11 +130,13 @@ var UiLayout = /*#__PURE__*/function (_AppendCSSRules) {
|
|
|
81
130
|
var extraCSSRules = rest.extraCSSRules,
|
|
82
131
|
restProps = (0, _objectWithoutProperties2["default"])(rest, _excluded2);
|
|
83
132
|
var style = this.computeStyle(fontSizeFactor);
|
|
84
|
-
return /*#__PURE__*/_react["default"].createElement(
|
|
133
|
+
return /*#__PURE__*/_react["default"].createElement(_styles.MuiThemeProvider, {
|
|
134
|
+
theme: theme
|
|
135
|
+
}, /*#__PURE__*/_react["default"].createElement("div", (0, _extends2["default"])({
|
|
85
136
|
className: finalClass
|
|
86
137
|
}, restProps, style && {
|
|
87
138
|
style: style
|
|
88
|
-
}), children);
|
|
139
|
+
}), children));
|
|
89
140
|
}
|
|
90
141
|
}]);
|
|
91
142
|
return UiLayout;
|
package/lib/ui-layout.js.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["../src/ui-layout.jsx"],"names":["UiLayout","props","classesSheet","document","createElement","fontSizeFactor","getFontSize","element","parseFloat","getComputedStyle","fontSize","rootFontSize","documentElement","bodyFontSize","body","effectiveFontSize","Math","max","children","className","classes","rest","finalClass","extraCSSRules","uiLayoutContainer","restProps","style","computeStyle","AppendCSSRules","PropTypes","object","string","array","shape","names","arrayOf","rules","number","styles","Styled"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;AAAA;;AACA;;AACA;;AACA;;AACA;;;;;;;;;
|
|
1
|
+
{"version":3,"sources":["../src/ui-layout.jsx"],"names":["theme","typography","useNextVariants","fontFamily","palette","action","disabled","overrides","MuiTypography","root","MuiRadio","color","MuiCheckbox","MuiTabs","borderBottom","MuiSwitch","backgroundColor","opacity","UiLayout","props","classesSheet","document","createElement","fontSizeFactor","getFontSize","element","parseFloat","getComputedStyle","fontSize","rootFontSize","documentElement","bodyFontSize","body","effectiveFontSize","Math","max","children","className","classes","rest","finalClass","extraCSSRules","uiLayoutContainer","restProps","style","computeStyle","AppendCSSRules","PropTypes","object","string","array","shape","names","arrayOf","rules","number","styles","Styled"],"mappings":"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","sourcesContent":["import React from 'react';\nimport { createMuiTheme, MuiThemeProvider, withStyles } from '@material-ui/core/styles';\nimport PropTypes from 'prop-types';\nimport classNames from 'classnames';\nimport AppendCSSRules from './append-css-rules';\n\nconst theme = createMuiTheme({\n typography: {\n useNextVariants: true,\n fontFamily: 'inherit',\n },\n palette: {\n action: {\n disabled: 'rgba(0, 0, 0, 0.54);',\n },\n },\n overrides: {\n MuiTypography: {\n root: { fontFamily: 'inherit' },\n },\n MuiRadio: {\n root: {\n '&$checked': {\n color: '#3f51b5 !important',\n },\n },\n },\n MuiCheckbox: {\n root: {\n '&$checked': {\n color: '#3f51b5 !important',\n },\n },\n },\n MuiTabs: {\n root: {\n borderBottom: '1px solid #eee',\n },\n },\n MuiSwitch: {\n root: {\n '&$checked': {\n color: '#3f51b5 !important',\n '& + $bar': {\n backgroundColor: '#3f51b5 !important',\n opacity: 0.5,\n },\n },\n },\n },\n },\n});\n\nclass UiLayout extends AppendCSSRules {\n static propTypes = {\n classes: PropTypes.object,\n className: PropTypes.string,\n children: PropTypes.array,\n extraCSSRules: PropTypes.shape({\n names: PropTypes.arrayOf(PropTypes.string),\n rules: PropTypes.string,\n }),\n fontSizeFactor: PropTypes.number,\n };\n\n static defaultProps = {\n extraCSSRules: {},\n fontSizeFactor: 1,\n };\n\n constructor(props) {\n super(props);\n this.classesSheet = document.createElement('style');\n }\n\n computeStyle(fontSizeFactor) {\n const getFontSize = (element) => parseFloat(getComputedStyle(element).fontSize);\n\n const rootFontSize = getFontSize(document.documentElement);\n const bodyFontSize = getFontSize(document.body);\n const effectiveFontSize = Math.max(rootFontSize, bodyFontSize);\n\n return fontSizeFactor !== 1 ? { fontSize: `${effectiveFontSize * fontSizeFactor}px` } : null;\n }\n\n render() {\n const { children, className, classes, fontSizeFactor, ...rest } = this.props;\n\n const finalClass = classNames(className, classes.extraCSSRules, classes.uiLayoutContainer);\n const { extraCSSRules, ...restProps } = rest;\n const style = this.computeStyle(fontSizeFactor);\n\n return (\n <MuiThemeProvider theme={theme}>\n <div className={finalClass} {...restProps} {...(style && { style })}>\n {children}\n </div>\n </MuiThemeProvider>\n );\n }\n}\n\nconst styles = {\n extraCSSRules: {},\n // need this because some browsers set their own style on table\n uiLayoutContainer: {\n '& table, th, td': {\n fontSize: 'inherit' /* Ensure table elements inherit font size */,\n },\n },\n};\n\nconst Styled = withStyles(styles)(UiLayout);\n\nexport default Styled;\n"],"file":"ui-layout.js"}
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@pie-lib/render-ui",
|
|
3
|
-
"version": "4.31.
|
|
3
|
+
"version": "4.31.2-next.3+d1d6f529",
|
|
4
4
|
"description": "Some shared ui elements when rendering - but not worthy of their own package yet.",
|
|
5
5
|
"module": "src/index.js",
|
|
6
6
|
"main": "lib/index.js",
|
|
@@ -29,5 +29,5 @@
|
|
|
29
29
|
"react": "^16.8.1",
|
|
30
30
|
"react-dom": "^16.8.1"
|
|
31
31
|
},
|
|
32
|
-
"gitHead": "
|
|
32
|
+
"gitHead": "d1d6f529b4ace972200a4b456c327acbd89ee5fb"
|
|
33
33
|
}
|
package/src/feedback.jsx
CHANGED
|
@@ -23,7 +23,6 @@ const styleSheet = {
|
|
|
23
23
|
'-webkit-font-smoothing': 'antialiased',
|
|
24
24
|
backgroundColor: `var(--feedback-bg-color, ${color.disabled()})`,
|
|
25
25
|
borderRadius: '4px',
|
|
26
|
-
fontFamily: '"Roboto", "Noto", sans-serif',
|
|
27
26
|
lineHeight: '25px',
|
|
28
27
|
margin: '0px',
|
|
29
28
|
padding: '10px',
|
package/src/preview-layout.jsx
CHANGED
|
@@ -1,5 +1,5 @@
|
|
|
1
1
|
import React from 'react';
|
|
2
|
-
import { withStyles
|
|
2
|
+
import { withStyles } from '@material-ui/core/styles';
|
|
3
3
|
import PropTypes from 'prop-types';
|
|
4
4
|
import UiLayout from './ui-layout';
|
|
5
5
|
|
|
@@ -41,55 +41,8 @@ const styles = () => ({
|
|
|
41
41
|
},
|
|
42
42
|
});
|
|
43
43
|
|
|
44
|
-
const theme = createMuiTheme({
|
|
45
|
-
typography: {
|
|
46
|
-
useNextVariants: true,
|
|
47
|
-
},
|
|
48
|
-
palette: {
|
|
49
|
-
action: {
|
|
50
|
-
disabled: 'rgba(0, 0, 0, 0.54);',
|
|
51
|
-
},
|
|
52
|
-
},
|
|
53
|
-
overrides: {
|
|
54
|
-
MuiRadio: {
|
|
55
|
-
root: {
|
|
56
|
-
'&$checked': {
|
|
57
|
-
color: '#3f51b5 !important',
|
|
58
|
-
},
|
|
59
|
-
},
|
|
60
|
-
},
|
|
61
|
-
MuiCheckbox: {
|
|
62
|
-
root: {
|
|
63
|
-
'&$checked': {
|
|
64
|
-
color: '#3f51b5 !important',
|
|
65
|
-
},
|
|
66
|
-
},
|
|
67
|
-
},
|
|
68
|
-
MuiTabs: {
|
|
69
|
-
root: {
|
|
70
|
-
borderBottom: '1px solid #eee',
|
|
71
|
-
},
|
|
72
|
-
},
|
|
73
|
-
MuiSwitch: {
|
|
74
|
-
root: {
|
|
75
|
-
'&$checked': {
|
|
76
|
-
color: '#3f51b5 !important',
|
|
77
|
-
'& + $bar': {
|
|
78
|
-
backgroundColor: '#3f51b5 !important',
|
|
79
|
-
opacity: 0.5,
|
|
80
|
-
},
|
|
81
|
-
},
|
|
82
|
-
},
|
|
83
|
-
},
|
|
84
|
-
},
|
|
85
|
-
});
|
|
86
|
-
|
|
87
44
|
const Styled = withStyles(styles)(PreviewLayout);
|
|
88
45
|
|
|
89
|
-
const RootElem = (props) =>
|
|
90
|
-
<MuiThemeProvider theme={theme}>
|
|
91
|
-
<Styled {...props} />
|
|
92
|
-
</MuiThemeProvider>
|
|
93
|
-
);
|
|
46
|
+
const RootElem = (props) => <Styled {...props} />;
|
|
94
47
|
|
|
95
48
|
export default RootElem;
|
package/src/ui-layout.jsx
CHANGED
|
@@ -1,9 +1,56 @@
|
|
|
1
1
|
import React from 'react';
|
|
2
|
-
import { withStyles } from '@material-ui/core/styles';
|
|
2
|
+
import { createMuiTheme, MuiThemeProvider, withStyles } from '@material-ui/core/styles';
|
|
3
3
|
import PropTypes from 'prop-types';
|
|
4
4
|
import classNames from 'classnames';
|
|
5
5
|
import AppendCSSRules from './append-css-rules';
|
|
6
6
|
|
|
7
|
+
const theme = createMuiTheme({
|
|
8
|
+
typography: {
|
|
9
|
+
useNextVariants: true,
|
|
10
|
+
fontFamily: 'inherit',
|
|
11
|
+
},
|
|
12
|
+
palette: {
|
|
13
|
+
action: {
|
|
14
|
+
disabled: 'rgba(0, 0, 0, 0.54);',
|
|
15
|
+
},
|
|
16
|
+
},
|
|
17
|
+
overrides: {
|
|
18
|
+
MuiTypography: {
|
|
19
|
+
root: { fontFamily: 'inherit' },
|
|
20
|
+
},
|
|
21
|
+
MuiRadio: {
|
|
22
|
+
root: {
|
|
23
|
+
'&$checked': {
|
|
24
|
+
color: '#3f51b5 !important',
|
|
25
|
+
},
|
|
26
|
+
},
|
|
27
|
+
},
|
|
28
|
+
MuiCheckbox: {
|
|
29
|
+
root: {
|
|
30
|
+
'&$checked': {
|
|
31
|
+
color: '#3f51b5 !important',
|
|
32
|
+
},
|
|
33
|
+
},
|
|
34
|
+
},
|
|
35
|
+
MuiTabs: {
|
|
36
|
+
root: {
|
|
37
|
+
borderBottom: '1px solid #eee',
|
|
38
|
+
},
|
|
39
|
+
},
|
|
40
|
+
MuiSwitch: {
|
|
41
|
+
root: {
|
|
42
|
+
'&$checked': {
|
|
43
|
+
color: '#3f51b5 !important',
|
|
44
|
+
'& + $bar': {
|
|
45
|
+
backgroundColor: '#3f51b5 !important',
|
|
46
|
+
opacity: 0.5,
|
|
47
|
+
},
|
|
48
|
+
},
|
|
49
|
+
},
|
|
50
|
+
},
|
|
51
|
+
},
|
|
52
|
+
});
|
|
53
|
+
|
|
7
54
|
class UiLayout extends AppendCSSRules {
|
|
8
55
|
static propTypes = {
|
|
9
56
|
classes: PropTypes.object,
|
|
@@ -44,9 +91,11 @@ class UiLayout extends AppendCSSRules {
|
|
|
44
91
|
const style = this.computeStyle(fontSizeFactor);
|
|
45
92
|
|
|
46
93
|
return (
|
|
47
|
-
<
|
|
48
|
-
{
|
|
49
|
-
|
|
94
|
+
<MuiThemeProvider theme={theme}>
|
|
95
|
+
<div className={finalClass} {...restProps} {...(style && { style })}>
|
|
96
|
+
{children}
|
|
97
|
+
</div>
|
|
98
|
+
</MuiThemeProvider>
|
|
50
99
|
);
|
|
51
100
|
}
|
|
52
101
|
}
|