@pie-lib/graphing 2.13.3-next.0 → 2.13.4-next.1

package/CHANGELOG.md

@@ -3,6 +3,18 @@
 All notable changes to this project will be documented in this file.
 See [Conventional Commits](https://conventionalcommits.org) for commit guidelines.
 
+## [2.13.3](https://github.com/pie-framework/pie-lib/compare/@pie-lib/graphing@2.13.2...@pie-lib/graphing@2.13.3) (2023-06-07)
+
+
+### Bug Fixes
+
+* prettier ([7ab7f22](https://github.com/pie-framework/pie-lib/commit/7ab7f22ac1cd0e5511036421d832ea2fbe5dd4f6))
+* switching tool not working because it was using the button's text content, which doesn't work with translations ([0006efb](https://github.com/pie-framework/pie-lib/commit/0006efb12632b016d01ee327cc36a45b91cfff4b))
+
+
+
+
+
 ## [2.13.2](https://github.com/pie-framework/pie-lib/compare/@pie-lib/graphing@2.13.1...@pie-lib/graphing@2.13.2) (2023-06-06)
 
 

package/lib/toggle-bar.js

@@ -43,6 +43,10 @@ function _createSuper(Derived) { var hasNativeReflectConstruct = _isNativeReflec
 
 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; } }
 
+function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); enumerableOnly && (symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; })), keys.push.apply(keys, symbols); } return keys; }
+
+function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = null != arguments[i] ? arguments[i] : {}; i % 2 ? ownKeys(Object(source), !0).forEach(function (key) { (0, _defineProperty2["default"])(target, key, source[key]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)) : ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } return target; }
+
 var translator = _translator["default"].translator;
 
 var buttonStyles = function buttonStyles() {
@@ -78,7 +82,7 @@ var MiniButton = (0, _styles.withStyles)(buttonStyles)(function (props) {
       className = props.className,
       selected = props.selected,
       value = props.value,
-      onClick = props.onClick,
+      _onClick = props.onClick,
       language = props.language;
   var translatorKey = value.toLowerCase();
   return /*#__PURE__*/_react["default"].createElement(_Button["default"], {
@@ -91,7 +95,11 @@ var MiniButton = (0, _styles.withStyles)(buttonStyles)(function (props) {
     value: value,
     key: value,
     variant: "outlined",
-    onClick: onClick
+    onClick: function onClick(e) {
+      return _onClick(_objectSpread(_objectSpread({}, e), {}, {
+        buttonValue: value
+      }));
+    }
   }, translator.t("graphing.".concat(translatorKey), {
     lng: language
   }));
@@ -123,7 +131,7 @@ var ToggleBar = /*#__PURE__*/function (_React$Component) {
 
     _this = _super.call.apply(_super, [this].concat(args));
     (0, _defineProperty2["default"])((0, _assertThisInitialized2["default"])(_this), "select", function (e) {
-      return _this.props.onChange(e.target.textContent);
+      return _this.props.onChange(e.buttonValue || e.target.textContent);
     });
     (0, _defineProperty2["default"])((0, _assertThisInitialized2["default"])(_this), "moveTool", function (dragIndex, hoverIndex) {
       var _this$props = _this.props,

package/lib/toggle-bar.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../src/toggle-bar.jsx"],"names":["translator","Translator","buttonStyles","root","color","text","backgroundColor","primary","selected","background","border","secondary","notSelected","disabled","MiniButton","props","classes","className","value","onClick","language","translatorKey","toLowerCase","t","lng","propTypes","PropTypes","bool","object","string","disabledClassName","func","ToggleBar","e","onChange","target","textContent","dragIndex","hoverIndex","options","onChangeToolsOrder","dragged","splice","selectedToolType","draggableTools","toolsContainer","map","option","index","allTools","includes","isSelected","toolRef","React","createRef","moveTool","button","select","Component","isRequired","arrayOf","styles","theme","display","flexWrap","marginRight","spacing","unit","marginBottom","under","position","top","left","zIndex","pointerEvents","wrapper","hidden","opacity","DRAG_TYPE","Item","children","connectDragSource","connectDropTarget","connectDragPreview","isDragging","oneOfType","node","any","itemSource","canDrag","draggable","beginDrag","itemTarget","hover","monitor","getItem","current","hoverBoundingRect","getBoundingClientRect","hoverMiddleX","right","clientOffset","getClientOffset","hoverClientX","x","collectTarget","connect","dropTarget","collectSource","dragSource","dragPreview","DragTool"],"mappings":"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","sourcesContent":["import React from 'react';\nimport PropTypes from 'prop-types';\nimport { withStyles } from '@material-ui/core/styles';\nimport cn from 'classnames';\nimport Button from '@material-ui/core/Button';\nimport { color } from '@pie-lib/render-ui';\nimport { allTools } from './tools/index';\nimport { withDragContext, DragSource, DropTarget } from '@pie-lib/drag';\nimport Translator from \"@pie-lib/translator\";\n\nconst { translator } = Translator;\n\nconst buttonStyles = () => ({\n  root: {\n    color: color.text(),\n    '&:hover': {\n      backgroundColor: color.primary(),\n    },\n  },\n  selected: {\n    backgroundColor: color.background(),\n    border: `1px solid ${color.secondary()}`,\n  },\n  notSelected: {\n    '& span': {\n      color: color.primary(),\n    },\n    backgroundColor: color.background(),\n  },\n  disabled: {\n    '& span': {\n      color: color.primary(),\n    },\n    backgroundColor: color.disabled(),\n  },\n});\n\nexport const MiniButton = withStyles(buttonStyles)((props) => {\n  const { disabled, classes, className, selected, value, onClick, language } = props;\n  const translatorKey = value.toLowerCase();\n\n  return (\n    <Button\n      size=\"small\"\n      disabled={disabled}\n      className={cn(classes.root, selected && classes.selected, className)}\n      classes={{ disabled: cn(disabled && classes.disabled) }}\n      value={value}\n      key={value}\n      variant=\"outlined\"\n      onClick={onClick}\n    >\n      {translator.t(`graphing.${translatorKey}`, { lng: language })}\n    </Button>\n  );\n});\n\nMiniButton.propTypes = {\n  disabled: PropTypes.bool,\n  classes: PropTypes.object,\n  className: PropTypes.string,\n  disabledClassName: PropTypes.string,\n  selected: PropTypes.bool,\n  value: PropTypes.string,\n  onClick: PropTypes.func,\n};\n\nexport class ToggleBar extends React.Component {\n  static propTypes = {\n    classes: PropTypes.object.isRequired,\n    className: PropTypes.string,\n    options: PropTypes.arrayOf(PropTypes.string),\n    selectedToolType: PropTypes.string,\n    disabled: PropTypes.bool,\n    draggableTools: PropTypes.bool,\n    onChange: PropTypes.func,\n    onChangeToolsOrder: PropTypes.func,\n    language: PropTypes.string,\n  };\n\n  static defaultProps = {};\n\n  select = (e) => this.props.onChange(e.target.textContent);\n\n  moveTool = (dragIndex, hoverIndex) => {\n    const { options, onChangeToolsOrder } = this.props;\n    const dragged = options[dragIndex];\n\n    options.splice(dragIndex, 1);\n    options.splice(hoverIndex, 0, dragged);\n\n    onChangeToolsOrder(options);\n  };\n\n  render() {\n    const { classes, className, disabled, options, selectedToolType, draggableTools, language } = this.props;\n\n    return (\n      <div className={cn(className, classes.toolsContainer)}>\n        {(options || []).map((option, index) => {\n          if ((allTools || []).includes(option)) {\n            const isSelected = option === selectedToolType;\n            const toolRef = React.createRef();\n\n            return (\n              <DragTool\n                key={option}\n                index={index}\n                draggable={draggableTools}\n                moveTool={this.moveTool}\n                classes={classes}\n                toolRef={toolRef}\n              >\n                <MiniButton\n                  className={cn(classes.button, isSelected && classes.selected)}\n                  disabled={disabled}\n                  disableRipple={true}\n                  onClick={this.select}\n                  value={option}\n                  selected={isSelected}\n                  language={language}\n                />\n              </DragTool>\n            );\n          }\n        })}\n      </div>\n    );\n  }\n}\n\nconst styles = (theme) => ({\n  toolsContainer: {\n    display: 'flex',\n    flexWrap: 'wrap',\n  },\n  button: {\n    marginRight: theme.spacing.unit / 2,\n    marginBottom: theme.spacing.unit / 2,\n    color: color.text(),\n    backgroundColor: color.background(),\n  },\n  under: {\n    position: 'absolute',\n    top: 0,\n    left: 0,\n    zIndex: -1,\n    pointerEvents: 'none',\n  },\n  wrapper: {\n    position: 'relative',\n  },\n  hidden: {\n    opacity: 0,\n  },\n});\n\nexport default withDragContext(withStyles(styles)(ToggleBar));\n\nconst DRAG_TYPE = 'tool';\n\nexport class Item 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]),\n    connectDragSource: PropTypes.func.isRequired,\n    connectDragPreview: PropTypes.func.isRequired,\n    connectDropTarget: PropTypes.func.isRequired,\n    isDragging: PropTypes.bool,\n    toolRef: PropTypes.any,\n  };\n\n  static defaultProps = {};\n\n  render() {\n    const {\n      classes,\n      children,\n      connectDragSource,\n      connectDropTarget,\n      connectDragPreview,\n      isDragging,\n      toolRef,\n    } = this.props;\n\n    return (\n      <div className={classes.wrapper} ref={toolRef}>\n        {connectDragSource(connectDropTarget(<div className={isDragging && classes.hidden}>{children}</div>))}\n        {connectDragPreview(<div className={classes.under}>{children}</div>)}\n      </div>\n    );\n  }\n}\n\nconst itemSource = {\n  canDrag(props) {\n    return props.draggable;\n  },\n  beginDrag(props) {\n    return {\n      index: props.index,\n    };\n  },\n};\n\nconst itemTarget = {\n  hover(props, monitor) {\n    const dragIndex = monitor.getItem().index;\n    const { toolRef, index: hoverIndex } = props;\n\n    if (dragIndex === hoverIndex || !toolRef.current) {\n      return;\n    }\n\n    const hoverBoundingRect = toolRef.current?.getBoundingClientRect();\n    const hoverMiddleX = (hoverBoundingRect.right - hoverBoundingRect.left) / 2;\n    const clientOffset = monitor.getClientOffset();\n    const hoverClientX = clientOffset.x - hoverBoundingRect.left;\n\n    if (dragIndex < hoverIndex && hoverClientX < hoverMiddleX) {\n      return;\n    }\n\n    if (dragIndex > hoverIndex && hoverClientX > hoverMiddleX) {\n      return;\n    }\n\n    props.moveTool(dragIndex, hoverIndex);\n    monitor.getItem().index = hoverIndex;\n  },\n};\n\nconst collectTarget = (connect) => ({ connectDropTarget: connect.dropTarget() });\n\nconst collectSource = (connect, monitor) => ({\n  connectDragSource: connect.dragSource(),\n  connectDragPreview: connect.dragPreview(),\n  isDragging: monitor.isDragging(),\n});\n\nconst DragTool = DropTarget(\n  DRAG_TYPE,\n  itemTarget,\n  collectTarget,\n)(DragSource(DRAG_TYPE, itemSource, collectSource)(Item));\n"],"file":"toggle-bar.js"}
+{"version":3,"sources":["../src/toggle-bar.jsx"],"names":["translator","Translator","buttonStyles","root","color","text","backgroundColor","primary","selected","background","border","secondary","notSelected","disabled","MiniButton","props","classes","className","value","onClick","language","translatorKey","toLowerCase","e","buttonValue","t","lng","propTypes","PropTypes","bool","object","string","disabledClassName","func","ToggleBar","onChange","target","textContent","dragIndex","hoverIndex","options","onChangeToolsOrder","dragged","splice","selectedToolType","draggableTools","toolsContainer","map","option","index","allTools","includes","isSelected","toolRef","React","createRef","moveTool","button","select","Component","isRequired","arrayOf","styles","theme","display","flexWrap","marginRight","spacing","unit","marginBottom","under","position","top","left","zIndex","pointerEvents","wrapper","hidden","opacity","DRAG_TYPE","Item","children","connectDragSource","connectDropTarget","connectDragPreview","isDragging","oneOfType","node","any","itemSource","canDrag","draggable","beginDrag","itemTarget","hover","monitor","getItem","current","hoverBoundingRect","getBoundingClientRect","hoverMiddleX","right","clientOffset","getClientOffset","hoverClientX","x","collectTarget","connect","dropTarget","collectSource","dragSource","dragPreview","DragTool"],"mappings":"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","sourcesContent":["import React from 'react';\nimport PropTypes from 'prop-types';\nimport { withStyles } from '@material-ui/core/styles';\nimport cn from 'classnames';\nimport Button from '@material-ui/core/Button';\nimport { color } from '@pie-lib/render-ui';\nimport { allTools } from './tools/index';\nimport { withDragContext, DragSource, DropTarget } from '@pie-lib/drag';\nimport Translator from '@pie-lib/translator';\n\nconst { translator } = Translator;\n\nconst buttonStyles = () => ({\n  root: {\n    color: color.text(),\n    '&:hover': {\n      backgroundColor: color.primary(),\n    },\n  },\n  selected: {\n    backgroundColor: color.background(),\n    border: `1px solid ${color.secondary()}`,\n  },\n  notSelected: {\n    '& span': {\n      color: color.primary(),\n    },\n    backgroundColor: color.background(),\n  },\n  disabled: {\n    '& span': {\n      color: color.primary(),\n    },\n    backgroundColor: color.disabled(),\n  },\n});\n\nexport const MiniButton = withStyles(buttonStyles)((props) => {\n  const { disabled, classes, className, selected, value, onClick, language } = props;\n  const translatorKey = value.toLowerCase();\n\n  return (\n    <Button\n      size=\"small\"\n      disabled={disabled}\n      className={cn(classes.root, selected && classes.selected, className)}\n      classes={{ disabled: cn(disabled && classes.disabled) }}\n      value={value}\n      key={value}\n      variant=\"outlined\"\n      onClick={(e) => onClick({ ...e, buttonValue: value })}\n    >\n      {translator.t(`graphing.${translatorKey}`, { lng: language })}\n    </Button>\n  );\n});\n\nMiniButton.propTypes = {\n  disabled: PropTypes.bool,\n  classes: PropTypes.object,\n  className: PropTypes.string,\n  disabledClassName: PropTypes.string,\n  selected: PropTypes.bool,\n  value: PropTypes.string,\n  onClick: PropTypes.func,\n};\n\nexport class ToggleBar extends React.Component {\n  static propTypes = {\n    classes: PropTypes.object.isRequired,\n    className: PropTypes.string,\n    options: PropTypes.arrayOf(PropTypes.string),\n    selectedToolType: PropTypes.string,\n    disabled: PropTypes.bool,\n    draggableTools: PropTypes.bool,\n    onChange: PropTypes.func,\n    onChangeToolsOrder: PropTypes.func,\n    language: PropTypes.string,\n  };\n\n  static defaultProps = {};\n\n  select = (e) => this.props.onChange(e.buttonValue || e.target.textContent);\n\n  moveTool = (dragIndex, hoverIndex) => {\n    const { options, onChangeToolsOrder } = this.props;\n    const dragged = options[dragIndex];\n\n    options.splice(dragIndex, 1);\n    options.splice(hoverIndex, 0, dragged);\n\n    onChangeToolsOrder(options);\n  };\n\n  render() {\n    const { classes, className, disabled, options, selectedToolType, draggableTools, language } = this.props;\n\n    return (\n      <div className={cn(className, classes.toolsContainer)}>\n        {(options || []).map((option, index) => {\n          if ((allTools || []).includes(option)) {\n            const isSelected = option === selectedToolType;\n            const toolRef = React.createRef();\n\n            return (\n              <DragTool\n                key={option}\n                index={index}\n                draggable={draggableTools}\n                moveTool={this.moveTool}\n                classes={classes}\n                toolRef={toolRef}\n              >\n                <MiniButton\n                  className={cn(classes.button, isSelected && classes.selected)}\n                  disabled={disabled}\n                  disableRipple={true}\n                  onClick={this.select}\n                  value={option}\n                  selected={isSelected}\n                  language={language}\n                />\n              </DragTool>\n            );\n          }\n        })}\n      </div>\n    );\n  }\n}\n\nconst styles = (theme) => ({\n  toolsContainer: {\n    display: 'flex',\n    flexWrap: 'wrap',\n  },\n  button: {\n    marginRight: theme.spacing.unit / 2,\n    marginBottom: theme.spacing.unit / 2,\n    color: color.text(),\n    backgroundColor: color.background(),\n  },\n  under: {\n    position: 'absolute',\n    top: 0,\n    left: 0,\n    zIndex: -1,\n    pointerEvents: 'none',\n  },\n  wrapper: {\n    position: 'relative',\n  },\n  hidden: {\n    opacity: 0,\n  },\n});\n\nexport default withDragContext(withStyles(styles)(ToggleBar));\n\nconst DRAG_TYPE = 'tool';\n\nexport class Item 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]),\n    connectDragSource: PropTypes.func.isRequired,\n    connectDragPreview: PropTypes.func.isRequired,\n    connectDropTarget: PropTypes.func.isRequired,\n    isDragging: PropTypes.bool,\n    toolRef: PropTypes.any,\n  };\n\n  static defaultProps = {};\n\n  render() {\n    const {\n      classes,\n      children,\n      connectDragSource,\n      connectDropTarget,\n      connectDragPreview,\n      isDragging,\n      toolRef,\n    } = this.props;\n\n    return (\n      <div className={classes.wrapper} ref={toolRef}>\n        {connectDragSource(connectDropTarget(<div className={isDragging && classes.hidden}>{children}</div>))}\n        {connectDragPreview(<div className={classes.under}>{children}</div>)}\n      </div>\n    );\n  }\n}\n\nconst itemSource = {\n  canDrag(props) {\n    return props.draggable;\n  },\n  beginDrag(props) {\n    return {\n      index: props.index,\n    };\n  },\n};\n\nconst itemTarget = {\n  hover(props, monitor) {\n    const dragIndex = monitor.getItem().index;\n    const { toolRef, index: hoverIndex } = props;\n\n    if (dragIndex === hoverIndex || !toolRef.current) {\n      return;\n    }\n\n    const hoverBoundingRect = toolRef.current?.getBoundingClientRect();\n    const hoverMiddleX = (hoverBoundingRect.right - hoverBoundingRect.left) / 2;\n    const clientOffset = monitor.getClientOffset();\n    const hoverClientX = clientOffset.x - hoverBoundingRect.left;\n\n    if (dragIndex < hoverIndex && hoverClientX < hoverMiddleX) {\n      return;\n    }\n\n    if (dragIndex > hoverIndex && hoverClientX > hoverMiddleX) {\n      return;\n    }\n\n    props.moveTool(dragIndex, hoverIndex);\n    monitor.getItem().index = hoverIndex;\n  },\n};\n\nconst collectTarget = (connect) => ({ connectDropTarget: connect.dropTarget() });\n\nconst collectSource = (connect, monitor) => ({\n  connectDragSource: connect.dragSource(),\n  connectDragPreview: connect.dragPreview(),\n  isDragging: monitor.isDragging(),\n});\n\nconst DragTool = DropTarget(\n  DRAG_TYPE,\n  itemTarget,\n  collectTarget,\n)(DragSource(DRAG_TYPE, itemSource, collectSource)(Item));\n"],"file":"toggle-bar.js"}

package/package.json

@@ -3,7 +3,7 @@
   "publishConfig": {
     "access": "public"
   },
-  "version": "2.13.3-next.0+b2f593d6",
+  "version": "2.13.4-next.1+1048c78e",
   "description": "Graphing components",
   "keywords": [
     "react",
@@ -45,6 +45,6 @@
   "peerDependencies": {
     "react": "^16.8.1"
   },
-  "gitHead": "b2f593d64b211cc12c9b33e6abcfc586823ecf33",
+  "gitHead": "1048c78e5805e5a636818cfcc037dcd67d04b934",
   "scripts": {}
 }

package/src/toggle-bar.jsx

@@ -6,7 +6,7 @@ import Button from '@material-ui/core/Button';
 import { color } from '@pie-lib/render-ui';
 import { allTools } from './tools/index';
 import { withDragContext, DragSource, DropTarget } from '@pie-lib/drag';
-import Translator from "@pie-lib/translator";
+import Translator from '@pie-lib/translator';
 
 const { translator } = Translator;
 
@@ -48,7 +48,7 @@ export const MiniButton = withStyles(buttonStyles)((props) => {
       value={value}
       key={value}
       variant="outlined"
-      onClick={onClick}
+      onClick={(e) => onClick({ ...e, buttonValue: value })}
     >
       {translator.t(`graphing.${translatorKey}`, { lng: language })}
     </Button>
@@ -80,7 +80,7 @@ export class ToggleBar extends React.Component {
 
   static defaultProps = {};
 
-  select = (e) => this.props.onChange(e.target.textContent);
+  select = (e) => this.props.onChange(e.buttonValue || e.target.textContent);
 
   moveTool = (dragIndex, hoverIndex) => {
     const { options, onChangeToolsOrder } = this.props;