@pie-lib/config-ui 11.2.0 → 11.2.1-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/lib/layout/layout-contents.js +12 -8
- package/lib/layout/layout-contents.js.map +1 -1
- package/lib/layout/settings-box.js +1 -1
- package/lib/layout/settings-box.js.map +1 -1
- package/lib/settings/panel.js +1 -1
- package/lib/settings/panel.js.map +1 -1
- package/lib/tabs/index.js.map +1 -1
- package/package.json +2 -2
- package/src/layout/layout-contents.jsx +10 -8
- package/src/layout/settings-box.jsx +6 -1
- package/src/settings/panel.jsx +4 -1
- package/src/tabs/index.jsx +4 -9
|
@@ -106,16 +106,18 @@ var RawLayoutContents = /*#__PURE__*/function (_React$Component) {
|
|
|
106
106
|
|
|
107
107
|
if (!hasSettingsPanel) {
|
|
108
108
|
try {
|
|
109
|
-
|
|
109
|
+
var _JSON$stringify, _JSON$stringify$match;
|
|
110
|
+
|
|
111
|
+
hasSettingsPanel = (_JSON$stringify = JSON.stringify(configuration)) === null || _JSON$stringify === void 0 ? void 0 : (_JSON$stringify$match = _JSON$stringify.match(/settings":true/)) === null || _JSON$stringify$match === void 0 ? void 0 : _JSON$stringify$match.length;
|
|
110
112
|
} catch (e) {
|
|
111
113
|
console.log(e.toString());
|
|
112
114
|
}
|
|
113
115
|
}
|
|
114
116
|
|
|
115
117
|
return /*#__PURE__*/_react["default"].createElement("div", {
|
|
116
|
-
className:
|
|
118
|
+
className: classes.container
|
|
117
119
|
}, mode === 'inline' && /*#__PURE__*/_react["default"].createElement("div", {
|
|
118
|
-
className: classes.flow
|
|
120
|
+
className: (0, _classnames["default"])(classes.flow, classes.contentContainer)
|
|
119
121
|
}, /*#__PURE__*/_react["default"].createElement("div", {
|
|
120
122
|
className: classes.configContainer
|
|
121
123
|
}, children), hasSettingsPanel && /*#__PURE__*/_react["default"].createElement("div", null, secondary)), mode === 'tabbed' && hasSettingsPanel && /*#__PURE__*/_react["default"].createElement(_tabs["default"], {
|
|
@@ -125,8 +127,10 @@ var RawLayoutContents = /*#__PURE__*/function (_React$Component) {
|
|
|
125
127
|
}, /*#__PURE__*/_react["default"].createElement("div", {
|
|
126
128
|
title: "Design"
|
|
127
129
|
}, children), /*#__PURE__*/_react["default"].createElement("div", {
|
|
128
|
-
title: "
|
|
129
|
-
}, secondary)), mode === 'tabbed' && !hasSettingsPanel && /*#__PURE__*/_react["default"].createElement("div",
|
|
130
|
+
title: "Settings"
|
|
131
|
+
}, secondary)), mode === 'tabbed' && !hasSettingsPanel && /*#__PURE__*/_react["default"].createElement("div", {
|
|
132
|
+
className: classes.contentContainer
|
|
133
|
+
}, children));
|
|
130
134
|
}
|
|
131
135
|
}]);
|
|
132
136
|
return RawLayoutContents;
|
|
@@ -139,7 +143,7 @@ var RawLayoutContents = /*#__PURE__*/function (_React$Component) {
|
|
|
139
143
|
classes: _propTypes["default"].object
|
|
140
144
|
});
|
|
141
145
|
|
|
142
|
-
var styles = function styles() {
|
|
146
|
+
var styles = function styles(theme) {
|
|
143
147
|
return {
|
|
144
148
|
flow: {
|
|
145
149
|
display: 'flex',
|
|
@@ -151,11 +155,11 @@ var styles = function styles() {
|
|
|
151
155
|
position: 'relative'
|
|
152
156
|
},
|
|
153
157
|
contentContainer: {
|
|
154
|
-
padding:
|
|
158
|
+
padding: "".concat(theme.spacing.unit * 2, "px 0")
|
|
155
159
|
},
|
|
156
160
|
configContainer: {
|
|
157
161
|
flex: '1',
|
|
158
|
-
marginRight:
|
|
162
|
+
marginRight: theme.spacing.unit * 2
|
|
159
163
|
}
|
|
160
164
|
};
|
|
161
165
|
};
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["../../src/layout/layout-contents.jsx"],"names":["RawLayoutContents","secondary","props","configuration","children","undefined","mode","classes","getConfiguration","hasSettingsPanel","Object","entries","some","propName","obj","settings","JSON","stringify","match","length","e","console","log","toString","container","flow","
|
|
1
|
+
{"version":3,"sources":["../../src/layout/layout-contents.jsx"],"names":["RawLayoutContents","secondary","props","configuration","children","undefined","mode","classes","getConfiguration","hasSettingsPanel","Object","entries","some","propName","obj","settings","JSON","stringify","match","length","e","console","log","toString","container","flow","contentContainer","configContainer","onTabsChange","React","Component","PropTypes","oneOf","oneOfType","arrayOf","node","object","styles","theme","display","justifyContent","flexDirection","position","padding","spacing","unit","flex","marginRight"],"mappings":"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","sourcesContent":["import React from 'react';\nimport { withStyles } from '@material-ui/core';\nimport Tabs from '../tabs';\nimport classnames from 'classnames';\nimport PropTypes from 'prop-types';\n\nclass RawLayoutContents extends React.Component {\n static propTypes = {\n mode: PropTypes.oneOf(['tabbed', 'inline']),\n secondary: PropTypes.oneOfType([PropTypes.arrayOf(PropTypes.node), PropTypes.node]),\n children: PropTypes.oneOfType([PropTypes.arrayOf(PropTypes.node), PropTypes.node]),\n classes: PropTypes.object,\n };\n\n getConfiguration = () => {\n const { secondary } = this.props;\n // in config-layout, secondary can be: <SettingsBox>{settings}</SettingsBox>, settings, null\n\n return secondary?.props?.configuration || secondary?.props?.children?.props?.configuration || undefined;\n };\n\n // // eslint-disable-next-line no-unused-vars\n // componentDidUpdate(prevProps, prevState, snapshot) {\n // const configuration = this.getConfiguration();\n // const { mode } = this.props;\n //\n // // promptHolder class is used to wrap up inputs:\n // // we don't want inputs to fill the entire scrollable container,\n // // but instead we want inputs to fit in the first view,\n // // so we calculate the maximum space inputs need\n // try {\n // if (\n // configuration?.maxWidth &&\n // getComputedStyle(document.documentElement).getPropertyValue('--pie-prompt-holder-max-width') !==\n // configuration?.maxWidth\n // ) {\n // document.documentElement.style.setProperty(\n // '--pie-prompt-holder-max-width',\n // mode === 'inline' ? `calc(${configuration.maxWidth} - 340px)` : configuration.maxWidth,\n // );\n // }\n // } catch (e) {\n // console.log(e.toString());\n // }\n // }\n\n render() {\n const { mode, secondary, children, classes } = this.props;\n const configuration = this.getConfiguration();\n\n let hasSettingsPanel = Object.entries(configuration || {}).some(([propName, obj]) => !!obj?.settings);\n // ebsr has configuration.partA and configuration.partB\n // because we might have nested configuration for other item types as well, let's add this simple regex to check values for settings\n\n if (!hasSettingsPanel) {\n try {\n hasSettingsPanel = JSON.stringify(configuration)?.match(/settings\":true/)?.length;\n } catch (e) {\n console.log(e.toString());\n }\n }\n\n return (\n <div className={classes.container}>\n {mode === 'inline' && (\n <div className={classnames(classes.flow, classes.contentContainer)}>\n <div className={classes.configContainer}>{children}</div>\n {hasSettingsPanel && <div>{secondary}</div>}\n </div>\n )}\n\n {mode === 'tabbed' && hasSettingsPanel && (\n <Tabs onChange={this.onTabsChange} contentClassName={classes.contentContainer} indicatorColor=\"primary\">\n <div title=\"Design\">{children}</div>\n <div title=\"Settings\">{secondary}</div>\n </Tabs>\n )}\n\n {mode === 'tabbed' && !hasSettingsPanel && <div className={classes.contentContainer}>{children}</div>}\n </div>\n );\n }\n}\n\nconst styles = (theme) => ({\n flow: {\n display: 'flex',\n justifyContent: 'space-between',\n },\n container: {\n display: 'flex',\n flexDirection: 'column',\n position: 'relative',\n },\n contentContainer: {\n padding: `${theme.spacing.unit * 2}px 0`,\n },\n configContainer: {\n flex: '1',\n marginRight: theme.spacing.unit * 2,\n },\n});\n\nexport default withStyles(styles)(RawLayoutContents);\n"],"file":"layout-contents.js"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["../../src/layout/settings-box.jsx"],"names":["SettingsBox","props","classes","className","children","settingsBox","React","Component","PropTypes","object","isRequired","string","oneOfType","arrayOf","node","styles","backgroundColor","border","display","flexDirection","justifyContent","minWidth","maxWidth","padding","width","zIndex"],"mappings":";;;;;;;;;;;;;;;;;;;;;AAAA;;AACA;;AACA;;AACA;;;;;;
|
|
1
|
+
{"version":3,"sources":["../../src/layout/settings-box.jsx"],"names":["SettingsBox","props","classes","className","children","settingsBox","React","Component","PropTypes","object","isRequired","string","oneOfType","arrayOf","node","styles","backgroundColor","border","display","flexDirection","justifyContent","minWidth","maxWidth","padding","width","zIndex"],"mappings":";;;;;;;;;;;;;;;;;;;;;AAAA;;AACA;;AACA;;AACA;;;;;;IAEaA,W;;;;;;;;;;;;WASX,kBAAS;AACP,wBAAyC,KAAKC,KAA9C;AAAA,UAAQC,OAAR,eAAQA,OAAR;AAAA,UAAiBC,SAAjB,eAAiBA,SAAjB;AAAA,UAA4BC,QAA5B,eAA4BA,QAA5B;AAEA,0BAAO;AAAK,QAAA,SAAS,EAAE,4BAAWF,OAAO,CAACG,WAAnB,EAAgCF,SAAhC;AAAhB,SAA6DC,QAA7D,CAAP;AACD;;;EAb8BE,kBAAMC,S;;;iCAA1BP,W,eACQ;AACjBE,EAAAA,OAAO,EAAEM,sBAAUC,MAAV,CAAiBC,UADT;AAEjBP,EAAAA,SAAS,EAAEK,sBAAUG,MAFJ;AAGjBP,EAAAA,QAAQ,EAAEI,sBAAUI,SAAV,CAAoB,CAACJ,sBAAUK,OAAV,CAAkBL,sBAAUM,IAA5B,CAAD,EAAoCN,sBAAUM,IAA9C,CAApB,EAAyEJ;AAHlE,C;iCADRV,W,kBAOW,E;;AAQxB,IAAMe,MAAM,GAAG,SAATA,MAAS;AAAA,SAAO;AACpBV,IAAAA,WAAW,EAAE;AACXW,MAAAA,eAAe,EAAE,MADN;AAEXC,MAAAA,MAAM,EAAE,gBAFG;AAGXC,MAAAA,OAAO,EAAE,MAHE;AAIXC,MAAAA,aAAa,EAAE,QAJJ;AAKXC,MAAAA,cAAc,EAAE,YALL;AAMXC,MAAAA,QAAQ,EAAE,OANC;AAOXC,MAAAA,QAAQ,EAAE,OAPC;AAQXC,MAAAA,OAAO,EAAE,mBARE;AASXC,MAAAA,KAAK,EAAE,KATI;AAUXC,MAAAA,MAAM,EAAE;AAVG;AADO,GAAP;AAAA,CAAf;;eAee,wBAAWV,MAAX,EAAmBf,WAAnB,C","sourcesContent":["import React from 'react';\nimport PropTypes from 'prop-types';\nimport { withStyles } from '@material-ui/core/styles';\nimport classNames from 'classnames';\n\nexport class SettingsBox extends React.Component {\n static propTypes = {\n classes: PropTypes.object.isRequired,\n className: PropTypes.string,\n children: PropTypes.oneOfType([PropTypes.arrayOf(PropTypes.node), PropTypes.node]).isRequired,\n };\n\n static defaultProps = {};\n\n render() {\n const { classes, className, children } = this.props;\n\n return <div className={classNames(classes.settingsBox, className)}>{children}</div>;\n }\n}\nconst styles = () => ({\n settingsBox: {\n backgroundColor: '#FFF',\n border: '2px solid #EEE',\n display: 'flex',\n flexDirection: 'column',\n justifyContent: 'flex-start',\n minWidth: '275px',\n maxWidth: '300px',\n padding: '20px 4px 4px 20px',\n width: '80%',\n zIndex: 99,\n },\n});\n\nexport default withStyles(styles)(SettingsBox);\n"],"file":"settings-box.js"}
|
package/lib/settings/panel.js
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["../../src/settings/panel.jsx"],"names":["log","labelValue","label","PropTypes","string","value","baseTypes","onChange","func","CheckboxChoice","event","target","checked","propTypes","bool","Radio","classes","choices","radioSettings","SettingsRadioLabel","arrayOf","shape","StyledRadio","marginTop","paddingBottom","width","color","transform","fontSize","display","Dropdown","margin","wrapper","border","borderRadius","padding","map","l","index","NumberField","field","marginRight","suffix","min","max","ev","object","number","ToggleWrapper","tagMap","toggle","radio","dropdown","numberField","checkbox","Group","group","groupHeader","fontWeight","marginBottom","numberFields","props","model","configuration","getTag","key","innerKey","isConfigProperty","properties","tagProps","Tag","type","v","content","currentGroup","fields","Object","keys","fieldKey","choiceKey","Panel","onChangeModel","onChangeConfiguration","groups","renderedGroups","showGroup","entries","some","propName","propVal","change","React","Component"],"mappings":"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","sourcesContent":["import React from 'react';\nimport PropTypes from 'prop-types';\nimport { withStyles } from '@material-ui/core/styles';\nimport get from 'lodash/get';\nimport set from 'lodash/set';\nimport Select from '@material-ui/core/Select';\nimport Input from '@material-ui/core/Input';\nimport MenuItem from '@material-ui/core/MenuItem';\nimport debug from 'debug';\n\nimport Toggle from './toggle';\nimport { NChoice } from '../two-choice';\nimport SettingsRadioLabel from './settings-radio-label';\nimport { NumberTextField } from '../index';\nimport Checkbox from '../checkbox';\n\nconst log = debug('pie-lib:config-ui:settings:panel');\n\nconst labelValue = {\n label: PropTypes.string,\n value: PropTypes.string,\n};\n\nconst baseTypes = {\n label: PropTypes.string,\n value: PropTypes.string,\n onChange: PropTypes.func,\n};\n\nconst CheckboxChoice = ({ label, value, onChange }) => {\n return (\n <Checkbox\n checked={value}\n label={label}\n onChange={(event) => {\n onChange(event.target.checked);\n }}\n />\n );\n};\n\nCheckboxChoice.propTypes = {\n label: PropTypes.string,\n value: PropTypes.bool,\n onChange: PropTypes.func,\n};\n\nconst Radio = ({ classes, label, value, onChange, choices }) => {\n return (\n <NChoice\n className={classes.radioSettings}\n direction=\"horizontal\"\n customLabel={SettingsRadioLabel}\n value={value}\n header={label}\n opts={choices}\n onChange={onChange}\n />\n );\n};\n\nRadio.propTypes = { ...baseTypes, choices: PropTypes.arrayOf(PropTypes.shape(labelValue)) };\n\nconst StyledRadio = withStyles({\n radioSettings: {\n marginTop: '4px',\n paddingBottom: '4px',\n width: '100%',\n '& > label': {\n color: 'rgba(0, 0, 0, 0.89)',\n transform: 'translate(0, 10px) scale(1)',\n fontSize: '14px',\n },\n '& > div': {\n marginTop: '20px',\n },\n },\n label: {\n display: 'none',\n },\n})(Radio);\n\nconst Dropdown = withStyles({\n label: {\n margin: 0,\n fontSize: '14px',\n },\n wrapper: {\n marginTop: '4px',\n border: '2px solid lightgrey',\n borderRadius: '4px',\n padding: '0 8px',\n },\n})(({ classes, label, value, onChange, choices = [] }) => {\n return (\n <div>\n {label && <p className={classes.label}>{label}</p>}\n <Select\n className={classes.wrapper}\n value={value || (choices && choices[0])}\n onChange={({ target }) => onChange(target.value)}\n input={<Input id={`dropdown-${label}`} />}\n disableUnderline\n >\n {choices.map((l, index) => (\n <MenuItem key={index} value={l}>\n {l}\n </MenuItem>\n ))}\n </Select>\n </div>\n );\n});\n\nDropdown.propTypes = { ...baseTypes, choices: PropTypes.arrayOf(PropTypes.string) };\n\nconst NumberField = withStyles({\n field: {\n width: '35%',\n marginRight: '24px',\n marginTop: '8px',\n },\n wrapper: {\n marginTop: '4px',\n border: '2px solid lightgrey',\n borderRadius: '4px',\n padding: '0 8px',\n },\n})(({ classes, label, value, onChange = () => {}, suffix, min, max }) => {\n return (\n <NumberTextField\n label={label || 'Label'}\n value={value}\n max={max}\n min={min}\n onChange={(ev, value) => onChange(value)}\n suffix={suffix}\n className={classes.field}\n showErrorWhenOutsideRange\n inputClassName={classes.wrapper}\n disableUnderline\n />\n );\n});\n\nNumberField.propTypes = {\n ...baseTypes,\n classes: PropTypes.object,\n suffix: PropTypes.string,\n min: PropTypes.number,\n max: PropTypes.number,\n value: PropTypes.number,\n};\n\nconst ToggleWrapper = ({ label, value, onChange }) => <Toggle label={label} checked={!!value} toggle={onChange} />;\n\nToggleWrapper.propTypes = { ...baseTypes, value: PropTypes.bool };\n\nconst tagMap = {\n toggle: ToggleWrapper,\n radio: StyledRadio,\n dropdown: Dropdown,\n numberField: NumberField,\n checkbox: CheckboxChoice,\n};\n\nconst Group = withStyles(() => ({\n group: {\n margin: '0 0 25px 0',\n },\n groupHeader: {\n color: '#495B8F',\n fontSize: '16px',\n fontWeight: 600,\n marginBottom: '8px',\n },\n numberFields: {\n fontSize: '0.85rem',\n marginBottom: 0,\n },\n}))((props) => {\n const { classes, model, label, group, configuration, onChange } = props;\n\n /**\n * @param group - the group of settings\n * @param key - the key(or path) to be used to set or get from model or configuration\n * @param innerKey - the key(or path) to be used to get from the group (used only for numberField type)\n * @returns tag that corresponds to element type */\n const getTag = (group, key, innerKey) => {\n const { isConfigProperty, ...properties } = get(group, innerKey || key);\n const value = isConfigProperty ? get(configuration, key) : get(model, key);\n const tagProps = { ...properties, key, value };\n const Tag = tagMap[tagProps.type];\n\n return <Tag key={key} {...tagProps} onChange={(v) => onChange(key, v, isConfigProperty)} />;\n };\n\n const content = (group, key) => {\n const currentGroup = group[key];\n\n if (!currentGroup) {\n return null;\n }\n\n const { type, label, fields, choices } = currentGroup;\n\n if (type === 'numberFields') {\n return (\n <div key={`numberField-${label}`}>\n <p className={classes.numberFields}>{label}</p>\n {Object.keys(fields).map((fieldKey) => {\n return getTag(group, `${key}.${fieldKey}`, `${key}.fields.${fieldKey}`);\n })}\n </div>\n );\n }\n\n if (type === 'checkboxes') {\n return (\n <div key={`checkbox-${label}`}>\n <p>{label}</p>\n {Object.keys(choices).map((choiceKey) => {\n return getTag(group, `${key}.${choiceKey}`, `${key}.choices.${choiceKey}`);\n })}\n </div>\n );\n }\n\n // if type is toggle, radio, dropdown or numberField\n return getTag(group, key);\n };\n\n return (\n <div className={classes.group}>\n <div className={classes.groupHeader}>{label}</div>\n\n {Object.keys(group).map((key) => {\n return content(group, key);\n })}\n </div>\n );\n});\n\nexport class Panel extends React.Component {\n static propTypes = {\n model: PropTypes.object,\n configuration: PropTypes.object,\n groups: PropTypes.object,\n onChangeModel: PropTypes.func,\n onChangeConfiguration: PropTypes.func,\n };\n\n static defaultProps = {\n onChangeModel: () => {},\n onChangeConfiguration: () => {},\n };\n\n change = (key, value, isConfigProperty = false) => {\n log('[changeModel]', key, value);\n const { onChangeModel, onChangeConfiguration } = this.props;\n const model = { ...this.props.model };\n const configuration = { ...this.props.configuration };\n\n if (isConfigProperty) {\n set(configuration, key, value);\n onChangeConfiguration(configuration, key);\n } else {\n set(model, key, value);\n onChangeModel(model, key);\n }\n };\n\n render() {\n const { groups, model, configuration } = this.props;\n log('render:', model);\n\n const renderedGroups = Object.keys(groups || {}).map((group) => {\n const showGroup = Object.entries(groups[group]).some(([propName, propVal]) => !!propVal);\n if (showGroup) {\n return (\n <Group\n label={group}\n key={group}\n model={model}\n configuration={configuration}\n group={groups[group]}\n onChange={this.change}\n />\n );\n }\n return null;\n });\n\n return <div>{renderedGroups}</div>;\n }\n}\n\nexport default Panel;\n"],"file":"panel.js"}
|
|
1
|
+
{"version":3,"sources":["../../src/settings/panel.jsx"],"names":["log","labelValue","label","PropTypes","string","value","baseTypes","onChange","func","CheckboxChoice","event","target","checked","propTypes","bool","Radio","classes","choices","radioSettings","SettingsRadioLabel","arrayOf","shape","StyledRadio","marginTop","paddingBottom","width","color","transform","fontSize","display","Dropdown","margin","wrapper","border","borderRadius","padding","map","l","index","NumberField","field","marginRight","suffix","min","max","ev","object","number","ToggleWrapper","tagMap","toggle","radio","dropdown","numberField","checkbox","Group","group","groupHeader","fontWeight","marginBottom","numberFields","props","model","configuration","getTag","key","innerKey","isConfigProperty","properties","tagProps","Tag","type","v","content","currentGroup","fields","Object","keys","fieldKey","choiceKey","Panel","onChangeModel","onChangeConfiguration","groups","renderedGroups","showGroup","entries","some","propName","propVal","change","React","Component"],"mappings":"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","sourcesContent":["import React from 'react';\nimport PropTypes from 'prop-types';\nimport { withStyles } from '@material-ui/core/styles';\nimport get from 'lodash/get';\nimport set from 'lodash/set';\nimport Select from '@material-ui/core/Select';\nimport Input from '@material-ui/core/Input';\nimport MenuItem from '@material-ui/core/MenuItem';\nimport debug from 'debug';\n\nimport Toggle from './toggle';\nimport { NChoice } from '../two-choice';\nimport SettingsRadioLabel from './settings-radio-label';\nimport { NumberTextField } from '../index';\nimport Checkbox from '../checkbox';\n\nconst log = debug('pie-lib:config-ui:settings:panel');\n\nconst labelValue = {\n label: PropTypes.string,\n value: PropTypes.string,\n};\n\nconst baseTypes = {\n label: PropTypes.string,\n value: PropTypes.string,\n onChange: PropTypes.func,\n};\n\nconst CheckboxChoice = ({ label, value, onChange }) => {\n return (\n <Checkbox\n checked={value}\n label={label}\n onChange={(event) => {\n onChange(event.target.checked);\n }}\n />\n );\n};\n\nCheckboxChoice.propTypes = {\n label: PropTypes.string,\n value: PropTypes.bool,\n onChange: PropTypes.func,\n};\n\nconst Radio = ({ classes, label, value, onChange, choices }) => {\n return (\n <NChoice\n className={classes.radioSettings}\n direction=\"horizontal\"\n customLabel={SettingsRadioLabel}\n value={value}\n header={label}\n opts={choices}\n onChange={onChange}\n />\n );\n};\n\nRadio.propTypes = { ...baseTypes, choices: PropTypes.arrayOf(PropTypes.shape(labelValue)) };\n\nconst StyledRadio = withStyles({\n radioSettings: {\n marginTop: '4px',\n paddingBottom: '4px',\n width: '100%',\n '& > label': {\n color: 'rgba(0, 0, 0, 0.89)',\n transform: 'translate(0, 10px) scale(1)',\n fontSize: '14px',\n },\n '& > div': {\n marginTop: '20px',\n },\n },\n label: {\n display: 'none',\n },\n})(Radio);\n\nconst Dropdown = withStyles({\n label: {\n margin: 0,\n fontSize: '14px',\n },\n wrapper: {\n marginTop: '4px',\n border: '2px solid lightgrey',\n borderRadius: '4px',\n padding: '0 8px',\n },\n})(({ classes, label, value, onChange, choices = [] }) => {\n return (\n <div>\n {label && <p className={classes.label}>{label}</p>}\n <Select\n className={classes.wrapper}\n value={value || (choices && choices[0])}\n onChange={({ target }) => onChange(target.value)}\n input={<Input id={`dropdown-${label}`} />}\n disableUnderline\n >\n {choices.map((l, index) => (\n <MenuItem key={index} value={l}>\n {l}\n </MenuItem>\n ))}\n </Select>\n </div>\n );\n});\n\nDropdown.propTypes = { ...baseTypes, choices: PropTypes.arrayOf(PropTypes.string) };\n\nconst NumberField = withStyles({\n field: {\n width: '35%',\n marginRight: '24px',\n marginTop: '8px',\n },\n wrapper: {\n marginTop: '4px',\n border: '2px solid lightgrey',\n borderRadius: '4px',\n padding: '0 8px',\n },\n})(({ classes, label, value, onChange = () => {}, suffix, min, max }) => {\n return (\n <NumberTextField\n label={label || 'Label'}\n value={value}\n max={max}\n min={min}\n onChange={(ev, value) => onChange(value)}\n suffix={suffix}\n className={classes.field}\n showErrorWhenOutsideRange\n inputClassName={classes.wrapper}\n disableUnderline\n />\n );\n});\n\nNumberField.propTypes = {\n ...baseTypes,\n classes: PropTypes.object,\n suffix: PropTypes.string,\n min: PropTypes.number,\n max: PropTypes.number,\n value: PropTypes.number,\n};\n\nconst ToggleWrapper = ({ label, value, onChange }) => <Toggle label={label} checked={!!value} toggle={onChange} />;\n\nToggleWrapper.propTypes = { ...baseTypes, value: PropTypes.bool };\n\nconst tagMap = {\n toggle: ToggleWrapper,\n radio: StyledRadio,\n dropdown: Dropdown,\n numberField: NumberField,\n checkbox: CheckboxChoice,\n};\n\nconst Group = withStyles(() => ({\n group: {\n margin: '0 0 16px 0',\n },\n groupHeader: {\n color: '#495B8F',\n fontSize: '16px',\n fontWeight: 600,\n marginBottom: '8px',\n },\n numberFields: {\n fontSize: '0.85rem',\n marginBottom: 0,\n },\n}))((props) => {\n const { classes, model, label, group, configuration, onChange } = props;\n\n /**\n * @param group - the group of settings\n * @param key - the key(or path) to be used to set or get from model or configuration\n * @param innerKey - the key(or path) to be used to get from the group (used only for numberField type)\n * @returns tag that corresponds to element type */\n const getTag = (group, key, innerKey) => {\n const { isConfigProperty, ...properties } = get(group, innerKey || key);\n const value = isConfigProperty ? get(configuration, key) : get(model, key);\n const tagProps = { ...properties, key, value };\n const Tag = tagMap[tagProps.type];\n\n return <Tag key={key} {...tagProps} onChange={(v) => onChange(key, v, isConfigProperty)} />;\n };\n\n const content = (group, key) => {\n const currentGroup = group[key];\n\n if (!currentGroup) {\n return null;\n }\n\n const { type, label, fields, choices } = currentGroup;\n\n if (type === 'numberFields') {\n return (\n <div key={`numberField-${label}`}>\n <p className={classes.numberFields}>{label}</p>\n {Object.keys(fields).map((fieldKey) => {\n return getTag(group, `${key}.${fieldKey}`, `${key}.fields.${fieldKey}`);\n })}\n </div>\n );\n }\n\n if (type === 'checkboxes') {\n return (\n <div key={`checkbox-${label}`}>\n <p>{label}</p>\n {Object.keys(choices).map((choiceKey) => {\n return getTag(group, `${key}.${choiceKey}`, `${key}.choices.${choiceKey}`);\n })}\n </div>\n );\n }\n\n // if type is toggle, radio, dropdown or numberField\n return getTag(group, key);\n };\n\n return (\n <div className={classes.group}>\n <div className={classes.groupHeader}>{label}</div>\n\n {Object.keys(group).map((key) => {\n return content(group, key);\n })}\n </div>\n );\n});\n\nexport class Panel extends React.Component {\n static propTypes = {\n model: PropTypes.object,\n configuration: PropTypes.object,\n groups: PropTypes.object,\n onChangeModel: PropTypes.func,\n onChangeConfiguration: PropTypes.func,\n };\n\n static defaultProps = {\n onChangeModel: () => {},\n onChangeConfiguration: () => {},\n };\n\n change = (key, value, isConfigProperty = false) => {\n log('[changeModel]', key, value);\n\n const { onChangeModel, onChangeConfiguration } = this.props;\n const model = { ...this.props.model };\n const configuration = { ...this.props.configuration };\n\n if (isConfigProperty) {\n set(configuration, key, value);\n onChangeConfiguration(configuration, key);\n } else {\n set(model, key, value);\n onChangeModel(model, key);\n }\n };\n\n render() {\n const { groups, model, configuration } = this.props;\n log('render:', model);\n\n const renderedGroups = Object.keys(groups || {}).map((group) => {\n const showGroup = Object.entries(groups[group]).some(([propName, propVal]) => !!propVal);\n\n if (showGroup) {\n return (\n <Group\n label={group}\n key={group}\n model={model}\n configuration={configuration}\n group={groups[group]}\n onChange={this.change}\n />\n );\n }\n\n return null;\n });\n\n return <div>{renderedGroups}</div>;\n }\n}\n\nexport default Panel;\n"],"file":"panel.js"}
|
package/lib/tabs/index.js.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["../../src/tabs/index.jsx"],"names":["Tabs","props","event","value","setState","state","children","className","contentClassName","contentStyle","classes","tabClasses","root","tabRoot","handleChange","React","Children","map","c","index","title","Component","PropTypes","object","string","oneOfType","arrayOf","node","isRequired"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;AAAA;;AAEA;;AACA;;AACA;;AACA;;;;;;IAEaA,I;;;;;AASX,gBAAYC,KAAZ,EAAmB;AAAA;;AAAA;AACjB,8BAAMA,KAAN;AADiB,
|
|
1
|
+
{"version":3,"sources":["../../src/tabs/index.jsx"],"names":["Tabs","props","event","value","setState","state","children","className","contentClassName","contentStyle","classes","tabClasses","root","tabRoot","handleChange","React","Children","map","c","index","title","Component","PropTypes","object","string","oneOfType","arrayOf","node","isRequired"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;AAAA;;AAEA;;AACA;;AACA;;AACA;;;;;;IAEaA,I;;;;;AASX,gBAAYC,KAAZ,EAAmB;AAAA;;AAAA;AACjB,8BAAMA,KAAN;AADiB,qGAKJ,UAACC,KAAD,EAAQC,KAAR,EAAkB;AAC/B,YAAKC,QAAL,CAAc;AAAED,QAAAA,KAAK,EAALA;AAAF,OAAd;AACD,KAPkB;AAEjB,UAAKE,KAAL,GAAa;AAAEF,MAAAA,KAAK,EAAE;AAAT,KAAb;AAFiB;AAGlB;;;;WAMD,kBAAS;AACP,UAAQA,KAAR,GAAkB,KAAKE,KAAvB,CAAQF,KAAR;AACA,wBAA8E,KAAKF,KAAnF;AAAA,UAAQK,QAAR,eAAQA,QAAR;AAAA,UAAkBC,SAAlB,eAAkBA,SAAlB;AAAA,UAA6BC,gBAA7B,eAA6BA,gBAA7B;AAAA,8CAA+CC,YAA/C;AAAA,UAA+CA,YAA/C,sCAA8D,EAA9D;AAAA,UAAkEC,OAAlE,eAAkEA,OAAlE;AACA,UAAMC,UAAU,GAAG;AAAEC,QAAAA,IAAI,EAAEF,OAAO,CAACG;AAAhB,OAAnB;AAEA,0BACE;AAAK,QAAA,SAAS,EAAEN;AAAhB,sBACE,gCAAC,gBAAD;AAAS,QAAA,cAAc,EAAC,SAAxB;AAAkC,QAAA,KAAK,EAAEJ,KAAzC;AAAgD,QAAA,QAAQ,EAAE,KAAKW;AAA/D,SACGC,kBAAMC,QAAN,CAAeC,GAAf,CAAmBX,QAAnB,EAA6B,UAACY,CAAD,EAAIC,KAAJ;AAAA,eAC5BD,CAAC,IAAIA,CAAC,CAACjB,KAAF,CAAQmB,KAAb,gBAAqB,gCAAC,eAAD;AAAQ,UAAA,OAAO,EAAET,UAAjB;AAA6B,UAAA,GAAG,EAAEQ,KAAlC;AAAyC,UAAA,KAAK,EAAED,CAAC,CAACjB,KAAF,CAAQmB;AAAxD,UAArB,GAAyF,IAD7D;AAAA,OAA7B,CADH,CADF,eAOE;AAAK,QAAA,SAAS,EAAEZ,gBAAhB;AAAkC,QAAA,KAAK,EAAEC;AAAzC,SACGH,QAAQ,CAACH,KAAD,CADX,CAPF,CADF;AAaD;;;EApCuBY,kBAAMM,S;;;iCAAnBrB,I,eACQ;AACjBU,EAAAA,OAAO,EAAEY,sBAAUC,MADF;AAEjBhB,EAAAA,SAAS,EAAEe,sBAAUE,MAFJ;AAGjBhB,EAAAA,gBAAgB,EAAEc,sBAAUE,MAHX;AAIjBf,EAAAA,YAAY,EAAEa,sBAAUC,MAJP;AAKjBjB,EAAAA,QAAQ,EAAEgB,sBAAUG,SAAV,CAAoB,CAACH,sBAAUI,OAAV,CAAkBJ,sBAAUK,IAA5B,CAAD,EAAoCL,sBAAUK,IAA9C,CAApB,EAAyEC;AALlE,C;;eAsCN,sBAAW;AAAA,SAAO;AAAEf,IAAAA,OAAO,EAAE;AAAX,GAAP;AAAA,CAAX,EAAoCb,IAApC,C","sourcesContent":["import React from 'react';\n\nimport MuiTabs from '@material-ui/core/Tabs';\nimport MuiTab from '@material-ui/core/Tab';\nimport PropTypes from 'prop-types';\nimport { withStyles } from '@material-ui/core';\n\nexport class Tabs extends React.Component {\n static propTypes = {\n classes: PropTypes.object,\n className: PropTypes.string,\n contentClassName: PropTypes.string,\n contentStyle: PropTypes.object,\n children: PropTypes.oneOfType([PropTypes.arrayOf(PropTypes.node), PropTypes.node]).isRequired,\n };\n\n constructor(props) {\n super(props);\n this.state = { value: 0 };\n }\n\n handleChange = (event, value) => {\n this.setState({ value });\n };\n\n render() {\n const { value } = this.state;\n const { children, className, contentClassName, contentStyle = {}, classes } = this.props;\n const tabClasses = { root: classes.tabRoot };\n\n return (\n <div className={className}>\n <MuiTabs indicatorColor=\"primary\" value={value} onChange={this.handleChange}>\n {React.Children.map(children, (c, index) =>\n c && c.props.title ? <MuiTab classes={tabClasses} key={index} label={c.props.title} /> : null,\n )}\n </MuiTabs>\n\n <div className={contentClassName} style={contentStyle}>\n {children[value]}\n </div>\n </div>\n );\n }\n}\n\nexport default withStyles(() => ({ tabRoot: {} }))(Tabs);\n"],"file":"index.js"}
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@pie-lib/config-ui",
|
|
3
|
-
"version": "11.2.
|
|
3
|
+
"version": "11.2.1-next.3+2ee9450d",
|
|
4
4
|
"main": "lib/index.js",
|
|
5
5
|
"module": "src/index.js",
|
|
6
6
|
"publishConfig": {
|
|
@@ -26,5 +26,5 @@
|
|
|
26
26
|
"peerDependencies": {
|
|
27
27
|
"react": "^16.8.1"
|
|
28
28
|
},
|
|
29
|
-
"gitHead": "
|
|
29
|
+
"gitHead": "2ee9450d67eb7c3080220d8c414fd33bde9c5bb3"
|
|
30
30
|
}
|
|
@@ -54,33 +54,35 @@ class RawLayoutContents extends React.Component {
|
|
|
54
54
|
|
|
55
55
|
if (!hasSettingsPanel) {
|
|
56
56
|
try {
|
|
57
|
-
hasSettingsPanel = JSON.stringify(configuration)
|
|
57
|
+
hasSettingsPanel = JSON.stringify(configuration)?.match(/settings":true/)?.length;
|
|
58
58
|
} catch (e) {
|
|
59
59
|
console.log(e.toString());
|
|
60
60
|
}
|
|
61
61
|
}
|
|
62
62
|
|
|
63
63
|
return (
|
|
64
|
-
<div className={
|
|
64
|
+
<div className={classes.container}>
|
|
65
65
|
{mode === 'inline' && (
|
|
66
|
-
<div className={classes.flow}>
|
|
66
|
+
<div className={classnames(classes.flow, classes.contentContainer)}>
|
|
67
67
|
<div className={classes.configContainer}>{children}</div>
|
|
68
68
|
{hasSettingsPanel && <div>{secondary}</div>}
|
|
69
69
|
</div>
|
|
70
70
|
)}
|
|
71
|
+
|
|
71
72
|
{mode === 'tabbed' && hasSettingsPanel && (
|
|
72
73
|
<Tabs onChange={this.onTabsChange} contentClassName={classes.contentContainer} indicatorColor="primary">
|
|
73
74
|
<div title="Design">{children}</div>
|
|
74
|
-
<div title="
|
|
75
|
+
<div title="Settings">{secondary}</div>
|
|
75
76
|
</Tabs>
|
|
76
77
|
)}
|
|
77
|
-
|
|
78
|
+
|
|
79
|
+
{mode === 'tabbed' && !hasSettingsPanel && <div className={classes.contentContainer}>{children}</div>}
|
|
78
80
|
</div>
|
|
79
81
|
);
|
|
80
82
|
}
|
|
81
83
|
}
|
|
82
84
|
|
|
83
|
-
const styles = () => ({
|
|
85
|
+
const styles = (theme) => ({
|
|
84
86
|
flow: {
|
|
85
87
|
display: 'flex',
|
|
86
88
|
justifyContent: 'space-between',
|
|
@@ -91,11 +93,11 @@ const styles = () => ({
|
|
|
91
93
|
position: 'relative',
|
|
92
94
|
},
|
|
93
95
|
contentContainer: {
|
|
94
|
-
padding:
|
|
96
|
+
padding: `${theme.spacing.unit * 2}px 0`,
|
|
95
97
|
},
|
|
96
98
|
configContainer: {
|
|
97
99
|
flex: '1',
|
|
98
|
-
marginRight:
|
|
100
|
+
marginRight: theme.spacing.unit * 2,
|
|
99
101
|
},
|
|
100
102
|
});
|
|
101
103
|
|
|
@@ -2,15 +2,19 @@ import React from 'react';
|
|
|
2
2
|
import PropTypes from 'prop-types';
|
|
3
3
|
import { withStyles } from '@material-ui/core/styles';
|
|
4
4
|
import classNames from 'classnames';
|
|
5
|
+
|
|
5
6
|
export class SettingsBox extends React.Component {
|
|
6
7
|
static propTypes = {
|
|
7
8
|
classes: PropTypes.object.isRequired,
|
|
8
9
|
className: PropTypes.string,
|
|
9
10
|
children: PropTypes.oneOfType([PropTypes.arrayOf(PropTypes.node), PropTypes.node]).isRequired,
|
|
10
11
|
};
|
|
12
|
+
|
|
11
13
|
static defaultProps = {};
|
|
14
|
+
|
|
12
15
|
render() {
|
|
13
16
|
const { classes, className, children } = this.props;
|
|
17
|
+
|
|
14
18
|
return <div className={classNames(classes.settingsBox, className)}>{children}</div>;
|
|
15
19
|
}
|
|
16
20
|
}
|
|
@@ -23,9 +27,10 @@ const styles = () => ({
|
|
|
23
27
|
justifyContent: 'flex-start',
|
|
24
28
|
minWidth: '275px',
|
|
25
29
|
maxWidth: '300px',
|
|
26
|
-
padding: '
|
|
30
|
+
padding: '20px 4px 4px 20px',
|
|
27
31
|
width: '80%',
|
|
28
32
|
zIndex: 99,
|
|
29
33
|
},
|
|
30
34
|
});
|
|
35
|
+
|
|
31
36
|
export default withStyles(styles)(SettingsBox);
|
package/src/settings/panel.jsx
CHANGED
|
@@ -166,7 +166,7 @@ const tagMap = {
|
|
|
166
166
|
|
|
167
167
|
const Group = withStyles(() => ({
|
|
168
168
|
group: {
|
|
169
|
-
margin: '0 0
|
|
169
|
+
margin: '0 0 16px 0',
|
|
170
170
|
},
|
|
171
171
|
groupHeader: {
|
|
172
172
|
color: '#495B8F',
|
|
@@ -257,6 +257,7 @@ export class Panel extends React.Component {
|
|
|
257
257
|
|
|
258
258
|
change = (key, value, isConfigProperty = false) => {
|
|
259
259
|
log('[changeModel]', key, value);
|
|
260
|
+
|
|
260
261
|
const { onChangeModel, onChangeConfiguration } = this.props;
|
|
261
262
|
const model = { ...this.props.model };
|
|
262
263
|
const configuration = { ...this.props.configuration };
|
|
@@ -276,6 +277,7 @@ export class Panel extends React.Component {
|
|
|
276
277
|
|
|
277
278
|
const renderedGroups = Object.keys(groups || {}).map((group) => {
|
|
278
279
|
const showGroup = Object.entries(groups[group]).some(([propName, propVal]) => !!propVal);
|
|
280
|
+
|
|
279
281
|
if (showGroup) {
|
|
280
282
|
return (
|
|
281
283
|
<Group
|
|
@@ -288,6 +290,7 @@ export class Panel extends React.Component {
|
|
|
288
290
|
/>
|
|
289
291
|
);
|
|
290
292
|
}
|
|
293
|
+
|
|
291
294
|
return null;
|
|
292
295
|
});
|
|
293
296
|
|
package/src/tabs/index.jsx
CHANGED
|
@@ -16,9 +16,7 @@ export class Tabs extends React.Component {
|
|
|
16
16
|
|
|
17
17
|
constructor(props) {
|
|
18
18
|
super(props);
|
|
19
|
-
this.state = {
|
|
20
|
-
value: 0,
|
|
21
|
-
};
|
|
19
|
+
this.state = { value: 0 };
|
|
22
20
|
}
|
|
23
21
|
|
|
24
22
|
handleChange = (event, value) => {
|
|
@@ -28,10 +26,8 @@ export class Tabs extends React.Component {
|
|
|
28
26
|
render() {
|
|
29
27
|
const { value } = this.state;
|
|
30
28
|
const { children, className, contentClassName, contentStyle = {}, classes } = this.props;
|
|
29
|
+
const tabClasses = { root: classes.tabRoot };
|
|
31
30
|
|
|
32
|
-
const tabClasses = {
|
|
33
|
-
root: classes.tabRoot,
|
|
34
|
-
};
|
|
35
31
|
return (
|
|
36
32
|
<div className={className}>
|
|
37
33
|
<MuiTabs indicatorColor="primary" value={value} onChange={this.handleChange}>
|
|
@@ -39,6 +35,7 @@ export class Tabs extends React.Component {
|
|
|
39
35
|
c && c.props.title ? <MuiTab classes={tabClasses} key={index} label={c.props.title} /> : null,
|
|
40
36
|
)}
|
|
41
37
|
</MuiTabs>
|
|
38
|
+
|
|
42
39
|
<div className={contentClassName} style={contentStyle}>
|
|
43
40
|
{children[value]}
|
|
44
41
|
</div>
|
|
@@ -47,6 +44,4 @@ export class Tabs extends React.Component {
|
|
|
47
44
|
}
|
|
48
45
|
}
|
|
49
46
|
|
|
50
|
-
export default withStyles(() => ({
|
|
51
|
-
tabRoot: {},
|
|
52
|
-
}))(Tabs);
|
|
47
|
+
export default withStyles(() => ({ tabRoot: {} }))(Tabs);
|