@pie-lib/config-ui 10.11.0 → 10.12.1

package/CHANGELOG.md

@@ -3,6 +3,34 @@
 All notable changes to this project will be documented in this file.
 See [Conventional Commits](https://conventionalcommits.org) for commit guidelines.
 
+## [10.12.1](https://github.com/pie-framework/pie-lib/compare/@pie-lib/config-ui@10.12.0...@pie-lib/config-ui@10.12.1) (2022-05-03)
+
+**Note:** Version bump only for package @pie-lib/config-ui
+
+
+
+
+
+# [10.12.0](https://github.com/pie-framework/pie-lib/compare/@pie-lib/config-ui@10.11.1...@pie-lib/config-ui@10.12.0) (2022-05-03)
+
+
+### Features
+
+* **config-ui:** tweak form-section component for placement-ordering ui/ux PD-1744 ([2e7bc9e](https://github.com/pie-framework/pie-lib/commit/2e7bc9e2d133d90096f0651a302925b9595b1173))
+* implemented an alert dialog ([7a82e03](https://github.com/pie-framework/pie-lib/commit/7a82e0351b5f3124fb78fbfce6eee406f0b9d030))
+
+
+
+
+
+## [10.11.1](https://github.com/pie-framework/pie-lib/compare/@pie-lib/config-ui@10.11.0...@pie-lib/config-ui@10.11.1) (2022-04-28)
+
+**Note:** Version bump only for package @pie-lib/config-ui
+
+
+
+
+
 # [10.11.0](https://github.com/pie-framework/pie-lib/compare/@pie-lib/config-ui@10.10.24...@pie-lib/config-ui@10.11.0) (2022-04-12)
 
 

package/lib/alert-dialog.js

@@ -0,0 +1,44 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports["default"] = void 0;
+
+var _react = _interopRequireDefault(require("react"));
+
+var _propTypes = _interopRequireDefault(require("prop-types"));
+
+var _core = require("@material-ui/core");
+
+function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { "default": obj }; }
+
+var AlertDialog = function AlertDialog(_ref) {
+  var text = _ref.text,
+      title = _ref.title,
+      onClose = _ref.onClose,
+      onConfirm = _ref.onConfirm,
+      open = _ref.open;
+  return /*#__PURE__*/_react["default"].createElement(_core.Dialog, {
+    open: open,
+    onClose: onClose
+  }, title && /*#__PURE__*/_react["default"].createElement(_core.DialogTitle, null, title), text && /*#__PURE__*/_react["default"].createElement(_core.DialogContent, null, /*#__PURE__*/_react["default"].createElement(_core.DialogContentText, null, text)), /*#__PURE__*/_react["default"].createElement(_core.DialogActions, null, onClose && /*#__PURE__*/_react["default"].createElement(_core.Button, {
+    onClick: onClose,
+    color: "primary"
+  }, "CANCEL"), onConfirm && /*#__PURE__*/_react["default"].createElement(_core.Button, {
+    autoFocus: true,
+    onClick: onConfirm,
+    color: "primary"
+  }, "OK")));
+};
+
+AlertDialog.propTypes = {
+  text: _propTypes["default"].string,
+  title: _propTypes["default"].string,
+  onClose: _propTypes["default"].func,
+  onConfirm: _propTypes["default"].func,
+  open: _propTypes["default"].bool
+};
+var _default = AlertDialog;
+exports["default"] = _default;
+//# sourceMappingURL=alert-dialog.js.map

package/lib/alert-dialog.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../src/alert-dialog.jsx"],"names":["AlertDialog","text","title","onClose","onConfirm","open","propTypes","PropTypes","string","func","bool"],"mappings":";;;;;;;AAAA;;AACA;;AACA;;;;AASA,IAAMA,WAAW,GAAG,SAAdA,WAAc;AAAA,MAAGC,IAAH,QAAGA,IAAH;AAAA,MAASC,KAAT,QAASA,KAAT;AAAA,MAAgBC,OAAhB,QAAgBA,OAAhB;AAAA,MAAyBC,SAAzB,QAAyBA,SAAzB;AAAA,MAAoCC,IAApC,QAAoCA,IAApC;AAAA,sBAClB,gCAAC,YAAD;AAAQ,IAAA,IAAI,EAAEA,IAAd;AAAoB,IAAA,OAAO,EAAEF;AAA7B,KACGD,KAAK,iBAAI,gCAAC,iBAAD,QAAcA,KAAd,CADZ,EAEGD,IAAI,iBACH,gCAAC,mBAAD,qBACE,gCAAC,uBAAD,QAAoBA,IAApB,CADF,CAHJ,eAOE,gCAAC,mBAAD,QACGE,OAAO,iBACN,gCAAC,YAAD;AAAQ,IAAA,OAAO,EAAEA,OAAjB;AAA0B,IAAA,KAAK,EAAC;AAAhC,cAFJ,EAMGC,SAAS,iBACR,gCAAC,YAAD;AAAQ,IAAA,SAAS,MAAjB;AAAkB,IAAA,OAAO,EAAEA,SAA3B;AAAsC,IAAA,KAAK,EAAC;AAA5C,UAPJ,CAPF,CADkB;AAAA,CAApB;;AAuBAJ,WAAW,CAACM,SAAZ,GAAwB;AACtBL,EAAAA,IAAI,EAAEM,sBAAUC,MADM;AAEtBN,EAAAA,KAAK,EAAEK,sBAAUC,MAFK;AAGtBL,EAAAA,OAAO,EAAEI,sBAAUE,IAHG;AAItBL,EAAAA,SAAS,EAAEG,sBAAUE,IAJC;AAKtBJ,EAAAA,IAAI,EAAEE,sBAAUG;AALM,CAAxB;eAQeV,W","sourcesContent":["import React from 'react';\nimport PropTypes from 'prop-types';\nimport {\n  Button,\n  Dialog,\n  DialogActions,\n  DialogContent,\n  DialogContentText,\n  DialogTitle\n} from '@material-ui/core';\n\nconst AlertDialog = ({ text, title, onClose, onConfirm, open }) => (\n  <Dialog open={open} onClose={onClose}>\n    {title && <DialogTitle>{title}</DialogTitle>}\n    {text && (\n      <DialogContent>\n        <DialogContentText>{text}</DialogContentText>\n      </DialogContent>\n    )}\n    <DialogActions>\n      {onClose && (\n        <Button onClick={onClose} color=\"primary\">\n          CANCEL\n        </Button>\n      )}\n      {onConfirm && (\n        <Button autoFocus onClick={onConfirm} color=\"primary\">\n          OK\n        </Button>\n      )}\n    </DialogActions>\n  </Dialog>\n);\n\nAlertDialog.propTypes = {\n  text: PropTypes.string,\n  title: PropTypes.string,\n  onClose: PropTypes.func,\n  onConfirm: PropTypes.func,\n  open: PropTypes.bool\n};\n\nexport default AlertDialog;\n"],"file":"alert-dialog.js"}

package/lib/form-section.js

@@ -31,12 +31,14 @@ var _default = (0, _styles.withStyles)(styles)(function (_ref) {
   var className = _ref.className,
       classes = _ref.classes,
       label = _ref.label,
-      children = _ref.children;
+      children = _ref.children,
+      labelExtraStyle = _ref.labelExtraStyle;
   return /*#__PURE__*/_react["default"].createElement("div", {
     className: (0, _classnames["default"])(classes.formSection, className)
   }, /*#__PURE__*/_react["default"].createElement(_Typography["default"], {
     className: classes.label,
-    type: "subheading"
+    type: "subheading",
+    style: labelExtraStyle
   }, label), children);
 });
 

package/lib/form-section.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../src/form-section.jsx"],"names":["styles","theme","formSection","marginTop","spacing","unit","marginBottom","label","className","classes","children"],"mappings":";;;;;;;AAAA;;AACA;;AACA;;AACA;;;;AAEA,IAAMA,MAAM,GAAG,SAATA,MAAS,CAAAC,KAAK;AAAA,SAAK;AACvBC,IAAAA,WAAW,EAAE;AACXC,MAAAA,SAAS,EAAEF,KAAK,CAACG,OAAN,CAAcC,IAAd,GAAqB,CADrB;AAEXC,MAAAA,YAAY,EAAEL,KAAK,CAACG,OAAN,CAAcC,IAAd,GAAqB;AAFxB,KADU;AAKvBE,IAAAA,KAAK,EAAE;AACLD,MAAAA,YAAY,EAAEL,KAAK,CAACG,OAAN,CAAcC;AADvB;AALgB,GAAL;AAAA,CAApB;;eAUe,wBAAWL,MAAX,EAAmB;AAAA,MAAGQ,SAAH,QAAGA,SAAH;AAAA,MAAcC,OAAd,QAAcA,OAAd;AAAA,MAAuBF,KAAvB,QAAuBA,KAAvB;AAAA,MAA8BG,QAA9B,QAA8BA,QAA9B;AAAA,sBAChC;AAAK,IAAA,SAAS,EAAE,4BAAWD,OAAO,CAACP,WAAnB,EAAgCM,SAAhC;AAAhB,kBACE,gCAAC,sBAAD;AAAY,IAAA,SAAS,EAAEC,OAAO,CAACF,KAA/B;AAAsC,IAAA,IAAI,EAAC;AAA3C,KACGA,KADH,CADF,EAIGG,QAJH,CADgC;AAAA,CAAnB,C","sourcesContent":["import React from 'react';\nimport Typography from '@material-ui/core/Typography';\nimport classNames from 'classnames';\nimport { withStyles } from '@material-ui/core/styles';\n\nconst styles = theme => ({\n  formSection: {\n    marginTop: theme.spacing.unit * 2,\n    marginBottom: theme.spacing.unit * 2\n  },\n  label: {\n    marginBottom: theme.spacing.unit\n  }\n});\n\nexport default withStyles(styles)(({ className, classes, label, children }) => (\n  <div className={classNames(classes.formSection, className)}>\n    <Typography className={classes.label} type=\"subheading\">\n      {label}\n    </Typography>\n    {children}\n  </div>\n));\n"],"file":"form-section.js"}
+{"version":3,"sources":["../src/form-section.jsx"],"names":["styles","theme","formSection","marginTop","spacing","unit","marginBottom","label","className","classes","children","labelExtraStyle"],"mappings":";;;;;;;AAAA;;AACA;;AACA;;AACA;;;;AAEA,IAAMA,MAAM,GAAG,SAATA,MAAS,CAAAC,KAAK;AAAA,SAAK;AACvBC,IAAAA,WAAW,EAAE;AACXC,MAAAA,SAAS,EAAEF,KAAK,CAACG,OAAN,CAAcC,IAAd,GAAqB,CADrB;AAEXC,MAAAA,YAAY,EAAEL,KAAK,CAACG,OAAN,CAAcC,IAAd,GAAqB;AAFxB,KADU;AAKvBE,IAAAA,KAAK,EAAE;AACLD,MAAAA,YAAY,EAAEL,KAAK,CAACG,OAAN,CAAcC;AADvB;AALgB,GAAL;AAAA,CAApB;;eAUe,wBAAWL,MAAX,EAAmB;AAAA,MAAGQ,SAAH,QAAGA,SAAH;AAAA,MAAcC,OAAd,QAAcA,OAAd;AAAA,MAAuBF,KAAvB,QAAuBA,KAAvB;AAAA,MAA8BG,QAA9B,QAA8BA,QAA9B;AAAA,MAAwCC,eAAxC,QAAwCA,eAAxC;AAAA,sBAChC;AAAK,IAAA,SAAS,EAAE,4BAAWF,OAAO,CAACP,WAAnB,EAAgCM,SAAhC;AAAhB,kBACE,gCAAC,sBAAD;AAAY,IAAA,SAAS,EAAEC,OAAO,CAACF,KAA/B;AAAsC,IAAA,IAAI,EAAC,YAA3C;AAAwD,IAAA,KAAK,EAAEI;AAA/D,KACGJ,KADH,CADF,EAIGG,QAJH,CADgC;AAAA,CAAnB,C","sourcesContent":["import React from 'react';\nimport Typography from '@material-ui/core/Typography';\nimport classNames from 'classnames';\nimport { withStyles } from '@material-ui/core/styles';\n\nconst styles = theme => ({\n  formSection: {\n    marginTop: theme.spacing.unit * 2,\n    marginBottom: theme.spacing.unit * 2\n  },\n  label: {\n    marginBottom: theme.spacing.unit\n  }\n});\n\nexport default withStyles(styles)(({ className, classes, label, children, labelExtraStyle }) => (\n  <div className={classNames(classes.formSection, className)}>\n    <Typography className={classes.label} type=\"subheading\" style={labelExtraStyle}>\n      {label}\n    </Typography>\n    {children}\n  </div>\n));\n"],"file":"form-section.js"}

package/lib/index.js

@@ -5,6 +5,12 @@ function _typeof(obj) { "@babel/helpers - typeof"; return _typeof = "function" =
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
+Object.defineProperty(exports, "AlertDialog", {
+  enumerable: true,
+  get: function get() {
+    return _alertDialog["default"];
+  }
+});
 Object.defineProperty(exports, "Checkbox", {
   enumerable: true,
   get: function get() {
@@ -146,6 +152,8 @@ Object.defineProperty(exports, "withStatefulModel", {
   }
 });
 
+var _alertDialog = _interopRequireDefault(require("./alert-dialog"));
+
 var _feedbackConfig = _interopRequireWildcard(require("./feedback-config"));
 
 var _inputs = require("./inputs");
@@ -192,9 +200,9 @@ var settings = _interopRequireWildcard(require("./settings"));
 
 exports.settings = settings;
 
-function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { "default": obj }; }
-
 function _getRequireWildcardCache(nodeInterop) { if (typeof WeakMap !== "function") return null; var cacheBabelInterop = new WeakMap(); var cacheNodeInterop = new WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(nodeInterop) { return nodeInterop ? cacheNodeInterop : cacheBabelInterop; })(nodeInterop); }
 
 function _interopRequireWildcard(obj, nodeInterop) { if (!nodeInterop && obj && obj.__esModule) { return obj; } if (obj === null || _typeof(obj) !== "object" && typeof obj !== "function") { return { "default": obj }; } var cache = _getRequireWildcardCache(nodeInterop); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var key in obj) { if (key !== "default" && Object.prototype.hasOwnProperty.call(obj, key)) { var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null; if (desc && (desc.get || desc.set)) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } newObj["default"] = obj; if (cache) { cache.set(obj, newObj); } return newObj; }
+
+function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { "default": obj }; }
 //# sourceMappingURL=index.js.map

package/lib/index.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../src/index.js"],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;;AAIA;;AACA;;AACA;;AACA;;AACA;;AACA;;AACA;;AACA;;AACA;;AACA;;AACA;;AACA;;AACA;;AACA;;;;AAEA;;;;AACA;;AACA;;AACA;;AAEA","sourcesContent":["import FeedbackConfig, {\n  FeedbackSelector,\n  buildDefaults as feedbackConfigDefaults\n} from './feedback-config';\nimport { InputCheckbox, InputSwitch, InputRadio } from './inputs';\nimport Langs, { LanguageControls } from './langs';\nimport Tabs from './tabs';\nimport Checkbox from './checkbox';\nimport FormSection from './form-section';\nimport Help from './help';\nimport Input from './input';\nimport { InputContainer } from '@pie-lib/render-ui';\nimport NumberTextField from './number-text-field';\nimport TwoChoice, { NChoice } from './two-choice';\nimport TagsInput from './tags-input';\nimport MuiBox from './mui-box';\nimport ChoiceConfiguration from './choice-configuration';\nimport * as layout from './layout';\n\nimport * as choiceUtils from './choice-utils';\nimport withStatefulModel from './with-stateful-model';\nimport Toggle from './settings/toggle';\nimport DisplaySize from './settings/display-size';\n\nimport * as settings from './settings';\n\nexport {\n  FeedbackConfig,\n  FeedbackSelector,\n  feedbackConfigDefaults,\n  InputCheckbox,\n  InputSwitch,\n  InputRadio,\n  Langs,\n  LanguageControls,\n  Tabs,\n  Checkbox,\n  FormSection,\n  Help,\n  Input,\n  InputContainer,\n  NumberTextField,\n  TwoChoice,\n  NChoice,\n  TagsInput,\n  MuiBox,\n  ChoiceConfiguration,\n  layout,\n  choiceUtils,\n  withStatefulModel,\n  Toggle,\n  DisplaySize,\n  settings\n};\n"],"file":"index.js"}
+{"version":3,"sources":["../src/index.js"],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;;AACA;;AAIA;;AACA;;AACA;;AACA;;AACA;;AACA;;AACA;;AACA;;AACA;;AACA;;AACA;;AACA;;AACA;;AACA;;;;AAEA;;;;AACA;;AACA;;AACA;;AAEA","sourcesContent":["import AlertDialog from './alert-dialog';\nimport FeedbackConfig, {\n  FeedbackSelector,\n  buildDefaults as feedbackConfigDefaults\n} from './feedback-config';\nimport { InputCheckbox, InputSwitch, InputRadio } from './inputs';\nimport Langs, { LanguageControls } from './langs';\nimport Tabs from './tabs';\nimport Checkbox from './checkbox';\nimport FormSection from './form-section';\nimport Help from './help';\nimport Input from './input';\nimport { InputContainer } from '@pie-lib/render-ui';\nimport NumberTextField from './number-text-field';\nimport TwoChoice, { NChoice } from './two-choice';\nimport TagsInput from './tags-input';\nimport MuiBox from './mui-box';\nimport ChoiceConfiguration from './choice-configuration';\nimport * as layout from './layout';\n\nimport * as choiceUtils from './choice-utils';\nimport withStatefulModel from './with-stateful-model';\nimport Toggle from './settings/toggle';\nimport DisplaySize from './settings/display-size';\n\nimport * as settings from './settings';\n\nexport {\n  AlertDialog,\n  FeedbackConfig,\n  FeedbackSelector,\n  feedbackConfigDefaults,\n  InputCheckbox,\n  InputSwitch,\n  InputRadio,\n  Langs,\n  LanguageControls,\n  Tabs,\n  Checkbox,\n  FormSection,\n  Help,\n  Input,\n  InputContainer,\n  NumberTextField,\n  TwoChoice,\n  NChoice,\n  TagsInput,\n  MuiBox,\n  ChoiceConfiguration,\n  layout,\n  choiceUtils,\n  withStatefulModel,\n  Toggle,\n  DisplaySize,\n  settings\n};\n"],"file":"index.js"}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@pie-lib/config-ui",
-  "version": "10.11.0",
+  "version": "10.12.1",
   "main": "lib/index.js",
   "module": "src/index.js",
   "publishConfig": {
@@ -10,9 +10,9 @@
   "dependencies": {
     "@material-ui/core": "^3.8.3",
     "@material-ui/icons": "^3.0.2",
-    "@pie-lib/editable-html": "^7.20.0",
+    "@pie-lib/editable-html": "^7.22.1",
     "@pie-lib/icons": "^2.4.25",
-    "@pie-lib/render-ui": "^4.12.5",
+    "@pie-lib/render-ui": "^4.12.6",
     "classnames": "^2.2.6",
     "debug": "^4.1.1",
     "lodash": "^4.17.11",
@@ -26,5 +26,5 @@
   "peerDependencies": {
     "react": "^16.8.1"
   },
-  "gitHead": "c37429328de4f87b6a7095de6e671c2cc53dd7f5"
+  "gitHead": "7af4bd333e7b4ae5720a863ee443377274cc6181"
 }

package/src/alert-dialog.jsx

@@ -0,0 +1,43 @@
+import React from 'react';
+import PropTypes from 'prop-types';
+import {
+  Button,
+  Dialog,
+  DialogActions,
+  DialogContent,
+  DialogContentText,
+  DialogTitle
+} from '@material-ui/core';
+
+const AlertDialog = ({ text, title, onClose, onConfirm, open }) => (
+  <Dialog open={open} onClose={onClose}>
+    {title && <DialogTitle>{title}</DialogTitle>}
+    {text && (
+      <DialogContent>
+        <DialogContentText>{text}</DialogContentText>
+      </DialogContent>
+    )}
+    <DialogActions>
+      {onClose && (
+        <Button onClick={onClose} color="primary">
+          CANCEL
+        </Button>
+      )}
+      {onConfirm && (
+        <Button autoFocus onClick={onConfirm} color="primary">
+          OK
+        </Button>
+      )}
+    </DialogActions>
+  </Dialog>
+);
+
+AlertDialog.propTypes = {
+  text: PropTypes.string,
+  title: PropTypes.string,
+  onClose: PropTypes.func,
+  onConfirm: PropTypes.func,
+  open: PropTypes.bool
+};
+
+export default AlertDialog;

package/src/form-section.jsx

@@ -13,9 +13,9 @@ const styles = theme => ({
   }
 });
 
-export default withStyles(styles)(({ className, classes, label, children }) => (
+export default withStyles(styles)(({ className, classes, label, children, labelExtraStyle }) => (
   <div className={classNames(classes.formSection, className)}>
-    <Typography className={classes.label} type="subheading">
+    <Typography className={classes.label} type="subheading" style={labelExtraStyle}>
       {label}
     </Typography>
     {children}

package/src/index.js

@@ -1,3 +1,4 @@
+import AlertDialog from './alert-dialog';
 import FeedbackConfig, {
   FeedbackSelector,
   buildDefaults as feedbackConfigDefaults
@@ -25,6 +26,7 @@ import DisplaySize from './settings/display-size';
 import * as settings from './settings';
 
 export {
+  AlertDialog,
   FeedbackConfig,
   FeedbackSelector,
   feedbackConfigDefaults,