@yorab/react-paint 0.4.0 → 0.5.0

package/dist/components/settings/LayoutButton.js

@@ -17,7 +17,7 @@ var _Button = _interopRequireDefault(require("../common/Button"));
 
 var StyleToggleLayoutButton = /*#__PURE__*/(0, _react2.styled)(_Button["default"])({
   name: "StyleToggleLayoutButton",
-  "class": "sj7hhjx"
+  "class": "sb1jkk3"
 });
 
 var LayoutButton = function LayoutButton(_ref) {

package/dist/components/settings/Layouts.js

@@ -33,39 +33,39 @@ function _interopRequireWildcard(obj, nodeInterop) { if (!nodeInterop && obj &&
 
 var StyledLayouts = /*#__PURE__*/(0, _react2.styled)("div")({
   name: "StyledLayouts",
-  "class": "su3a8bs"
+  "class": "sw61axo"
 });
 var StyledLayout = /*#__PURE__*/(0, _react2.styled)("div")({
   name: "StyledLayout",
-  "class": "szboplp"
+  "class": "s1shoasi"
 });
 var StyledVisibleButton = /*#__PURE__*/(0, _react2.styled)(_Button["default"])({
   name: "StyledVisibleButton",
-  "class": "sff5xt"
+  "class": "s1adt0vs"
 });
 var StyledLockedButton = /*#__PURE__*/(0, _react2.styled)(_Button["default"])({
   name: "StyledLockedButton",
-  "class": "sj3bift"
+  "class": "svyjq0t"
 });
 var StyledGridButton = /*#__PURE__*/(0, _react2.styled)(_Button["default"])({
   name: "StyledGridButton",
-  "class": "s10ip0a4"
+  "class": "s1vztggb"
 });
 var StyledSeparator = /*#__PURE__*/(0, _react2.styled)("div")({
   name: "StyledSeparator",
-  "class": "s1j9uq9o"
+  "class": "s1fgf9tg"
 });
 var StyledPanelLayouts = /*#__PURE__*/(0, _react2.styled)(_Panel["default"])({
   name: "StyledPanelLayouts",
-  "class": "s156ddbb"
+  "class": "s1rl6big"
 });
 var StyledScrollingContent = /*#__PURE__*/(0, _react2.styled)("div")({
   name: "StyledScrollingContent",
-  "class": "s11gt4hl"
+  "class": "sbpkotp"
 });
 var StyledPlaceholder = /*#__PURE__*/(0, _react2.styled)("div")({
   name: "StyledPlaceholder",
-  "class": "s13cxqhq"
+  "class": "s12cgrwn"
 });
 
 var Layout = function Layout(_ref) {

package/dist/components/settings/LineArrowField.js

@@ -11,21 +11,21 @@ var _react = _interopRequireDefault(require("react"));
 
 var _SelectField = _interopRequireDefault(require("./SelectField"));
 
-var _style = require("../../constants/style");
-
 var _react2 = require("@linaria/react");
 
+var _fp = _interopRequireDefault(require("lodash/fp"));
+
 var StyledLeftTriangle = /*#__PURE__*/(0, _react2.styled)("span")({
   name: "StyledLeftTriangle",
-  "class": "s1xxj4yl"
+  "class": "s1bq28wy"
 });
 var StyledRightTriangle = /*#__PURE__*/(0, _react2.styled)("span")({
   name: "StyledRightTriangle",
-  "class": "sbd6jc8"
+  "class": "sej9ve5"
 });
 var StyledOption = /*#__PURE__*/(0, _react2.styled)("span")({
   name: "StyledOption",
-  "class": "scawaat"
+  "class": "s5asd7a"
 });
 
 var LineArrowOption = function LineArrowOption(_ref) {
@@ -40,8 +40,10 @@ var LineArrowField = function LineArrowField(_ref2) {
       setSelectedSettings = _ref2.setSelectedSettings,
       _ref2$disabled = _ref2.disabled,
       disabled = _ref2$disabled === void 0 ? false : _ref2$disabled,
+      values = _ref2.values,
       defaultValue = _ref2.defaultValue,
       valueChanged = _ref2.valueChanged;
+  if (_fp["default"].isEmpty(values)) return null;
   return /*#__PURE__*/_react["default"].createElement(_SelectField["default"], {
     selectedSettings: selectedSettings,
     setSelectedSettings: setSelectedSettings,
@@ -49,7 +51,7 @@ var LineArrowField = function LineArrowField(_ref2) {
     title: "Fl\xE8ches",
     disabled: disabled,
     field: "style.lineArrow",
-    values: _style.STYLE_LINE_WITH_ARROW,
+    values: values,
     defaultValue: defaultValue,
     valueChanged: valueChanged
   });

package/dist/components/settings/LineTypeField.js

@@ -11,17 +11,17 @@ var _react = _interopRequireDefault(require("react"));
 
 var _SelectField = _interopRequireDefault(require("./SelectField"));
 
-var _style = require("../../constants/style");
-
 var _react2 = require("@linaria/react");
 
+var _fp = _interopRequireDefault(require("lodash/fp"));
+
 var StyledLine = /*#__PURE__*/(0, _react2.styled)("span")({
   name: "StyledLine",
-  "class": "s1qssg4n"
+  "class": "s1yz5lc1"
 });
 var StyledOption = /*#__PURE__*/(0, _react2.styled)("span")({
   name: "StyledOption",
-  "class": "se26iq6"
+  "class": "s1k64iv7"
 });
 
 var LineTypeOption = function LineTypeOption(_ref) {
@@ -38,8 +38,10 @@ var LineTypeField = function LineTypeField(_ref2) {
       setSelectedSettings = _ref2.setSelectedSettings,
       _ref2$disabled = _ref2.disabled,
       disabled = _ref2$disabled === void 0 ? false : _ref2$disabled,
+      values = _ref2.values,
       defaultValue = _ref2.defaultValue,
       valueChanged = _ref2.valueChanged;
+  if (_fp["default"].isEmpty(values)) return null;
   return /*#__PURE__*/_react["default"].createElement(_SelectField["default"], {
     selectedSettings: selectedSettings,
     setSelectedSettings: setSelectedSettings,
@@ -47,7 +49,7 @@ var LineTypeField = function LineTypeField(_ref2) {
     title: "Type de traits",
     disabled: disabled,
     field: "style.lineDash",
-    values: _style.STYLE_LINE_DASH,
+    values: values,
     defaultValue: defaultValue,
     valueChanged: valueChanged
   });

package/dist/components/settings/PointsNumberField.js

@@ -9,40 +9,30 @@ exports["default"] = void 0;
 
 var _react = _interopRequireDefault(require("react"));
 
-var _SelectField = _interopRequireDefault(require("./SelectField"));
-
-var _style = require("../../constants/style");
-
-var _react2 = require("@linaria/react");
-
-var StyledOption = /*#__PURE__*/(0, _react2.styled)("span")({
-  name: "StyledOption",
-  "class": "skv6910"
-});
-
-var PointsNumberOption = function PointsNumberOption(_ref) {
-  var children = _ref.children;
-  return /*#__PURE__*/_react["default"].createElement(StyledOption, null, children);
-};
-
-var PointsNumberField = function PointsNumberField(_ref2) {
-  var selectedSettings = _ref2.selectedSettings,
-      setSelectedSettings = _ref2.setSelectedSettings,
-      _ref2$disabled = _ref2.disabled,
-      disabled = _ref2$disabled === void 0 ? false : _ref2$disabled,
-      defaultValue = _ref2.defaultValue,
-      _ref2$values = _ref2.values,
-      values = _ref2$values === void 0 ? _style.POLYGON_POINTS_VALUES : _ref2$values,
-      valueChanged = _ref2.valueChanged;
-  return /*#__PURE__*/_react["default"].createElement(_SelectField["default"], {
+var _RangeField = _interopRequireDefault(require("./RangeField"));
+
+var PointsNumberField = function PointsNumberField(_ref) {
+  var selectedSettings = _ref.selectedSettings,
+      setSelectedSettings = _ref.setSelectedSettings,
+      _ref$disabled = _ref.disabled,
+      disabled = _ref$disabled === void 0 ? false : _ref$disabled,
+      min = _ref.min,
+      max = _ref.max,
+      step = _ref.step,
+      value = _ref.value,
+      valueChanged = _ref.valueChanged;
+  if (min === max) return null;
+  return /*#__PURE__*/_react["default"].createElement(_RangeField["default"], {
     selectedSettings: selectedSettings,
     setSelectedSettings: setSelectedSettings,
-    CustomOption: PointsNumberOption,
     title: "Nombre de points",
     disabled: disabled,
     field: "style.pointsCount",
-    values: values,
-    defaultValue: defaultValue,
+    min: min,
+    max: max,
+    step: step,
+    unity: "",
+    value: value,
     valueChanged: valueChanged
   });
 };

package/dist/components/settings/RangeField.js

@@ -27,7 +27,7 @@ function _interopRequireWildcard(obj, nodeInterop) { if (!nodeInterop && obj &&
 
 var StyledLabel = /*#__PURE__*/(0, _react2.styled)("label")({
   name: "StyledLabel",
-  "class": "s9mugpt"
+  "class": "s4h1871"
 });
 
 var RangeField = function RangeField(_ref) {
@@ -68,6 +68,7 @@ var RangeField = function RangeField(_ref) {
   };
 
   var isPanelVisible = selectedSettings === customKey;
+  if (min === max) return null;
   return /*#__PURE__*/_react["default"].createElement(_react["default"].Fragment, null, /*#__PURE__*/_react["default"].createElement(_Button["default"], {
     selected: isPanelVisible,
     title: title,

package/dist/components/settings/SelectField.js

@@ -27,7 +27,7 @@ function _interopRequireWildcard(obj, nodeInterop) { if (!nodeInterop && obj &&
 
 var StyledButton = /*#__PURE__*/(0, _react2.styled)(_Button["default"])({
   name: "StyledButton",
-  "class": "s1ktxhkr"
+  "class": "sfr849o"
 });
 
 var SelectField = function SelectField(_ref) {
@@ -58,6 +58,7 @@ var SelectField = function SelectField(_ref) {
   };
 
   var isPanelVisible = selectedSettings === customKey;
+  if (_fp["default"].isEmpty(values)) return null;
   return /*#__PURE__*/_react["default"].createElement(_react["default"].Fragment, null, /*#__PURE__*/_react["default"].createElement(_Button["default"], {
     selected: isPanelVisible,
     title: title,

package/dist/components/settings/SettingsBar.js

@@ -19,8 +19,6 @@ var _react = _interopRequireWildcard(require("react"));
 
 var _react2 = require("@linaria/react");
 
-var _Shapes = require("../../types/Shapes");
-
 var _transform = require("../../utils/transform");
 
 var _ColorField = _interopRequireDefault(require("./ColorField"));
@@ -39,8 +37,6 @@ var _LineTypeField = _interopRequireDefault(require("./LineTypeField"));
 
 var _LineArrowField = _interopRequireDefault(require("./LineArrowField"));
 
-var _style = require("../../constants/style");
-
 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; }
@@ -51,29 +47,38 @@ function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { va
 
 var StyledSettingsBar = /*#__PURE__*/(0, _react2.styled)("div")({
   name: "StyledSettingsBar",
-  "class": "s16z54di"
+  "class": "s17kh6p4"
 });
 var StyledSeparator = /*#__PURE__*/(0, _react2.styled)("div")({
   name: "StyledSeparator",
-  "class": "sa7lzh9"
+  "class": "s1fluhcn"
 });
 
 var SettingsBar = function SettingsBar(_ref) {
-  var _selectedShape$style, _selectedShape$style2, _selectedShape$style3, _selectedShape$style4, _selectedShape$style5, _selectedShape$style6, _selectedShape$style$, _selectedShape$style7, _defaultConf$style, _defaultConf$style2, _defaultConf$style3, _defaultConf$style4, _defaultConf$style5, _defaultConf$style6, _defaultConf$style7;
+  var _selectedShape$style, _selectedShape$style2, _selectedShape$style3, _selectedShape$style4, _selectedShape$style5, _selectedShape$style6, _selectedShape$style7, _selectedShape$style$, _selectedShape$style8;
 
   var _ref$disabled = _ref.disabled,
       disabled = _ref$disabled === void 0 ? false : _ref$disabled,
+      availableTools = _ref.availableTools,
       layersManipulation = _ref.layersManipulation,
       toggleLayoutPanel = _ref.toggleLayoutPanel,
       activeTool = _ref.activeTool,
       selectedShape = _ref.selectedShape,
       canvas = _ref.canvas,
       updateShape = _ref.updateShape,
-      removeShape = _ref.removeShape,
-      defaultConf = _ref.defaultConf,
-      setDefaultConf = _ref.setDefaultConf;
-  var shapes = [_Shapes.ShapeEnum.brush, _Shapes.ShapeEnum.ellipse, _Shapes.ShapeEnum.circle, _Shapes.ShapeEnum.rect, _Shapes.ShapeEnum.square, _Shapes.ShapeEnum.line, _Shapes.ShapeEnum.polygon, _Shapes.ShapeEnum.curve, _Shapes.ShapeEnum.text];
-
+      removeShape = _ref.removeShape;
+
+  // const shapes = [
+  //   ShapeEnum.brush,
+  //   ShapeEnum.ellipse,
+  //   ShapeEnum.circle,
+  //   ShapeEnum.rect,
+  //   ShapeEnum.square,
+  //   ShapeEnum.line,
+  //   ShapeEnum.polygon,
+  //   ShapeEnum.curve,
+  //   ShapeEnum.text
+  // ]
   var _useState = (0, _react.useState)(undefined),
       _useState2 = (0, _slicedToArray2["default"])(_useState, 2),
       selectedSettings = _useState2[0],
@@ -82,11 +87,10 @@ var SettingsBar = function SettingsBar(_ref) {
   var handleShapeStyleChange = function handleShapeStyleChange(field, value) {
     if (selectedShape) {
       updateShape(_fp["default"].set(field, value, selectedShape), true);
-    } else {
-      setDefaultConf(function (prevDefaultConf) {
-        return _fp["default"].set(field, value, prevDefaultConf);
-      });
-    }
+    } // } else {
+    //   setDefaultConf(prevDefaultConf => _.set(field, value, prevDefaultConf))
+    // }
+
   };
 
   var handleShapeFontFamilyChange = function handleShapeFontFamilyChange(field, value) {
@@ -106,150 +110,173 @@ var SettingsBar = function SettingsBar(_ref) {
       });
 
       updateShape(resizedShape, true);
-    } else {
-      setDefaultConf(function (prevDefaultConf) {
-        return _fp["default"].set(field, value, prevDefaultConf);
-      });
-    }
+    } // else {
+    //   setDefaultConf(prevDefaultConf => _.set(field, value, prevDefaultConf))
+    // }
+
   };
 
   var handlePolygonLinesCount = function handlePolygonLinesCount(field, value) {
     if (selectedShape) {
       updateShape((0, _transform.updatePolygonLinesCount)(selectedShape, value), true);
-    } else {
-      setDefaultConf(function (prevDefaultConf) {
-        return _fp["default"].set(field, value, prevDefaultConf);
-      });
-    }
+    } // else {
+    //   setDefaultConf(prevDefaultConf => _.set(field, value, prevDefaultConf))
+    // }
+
   };
 
-  return /*#__PURE__*/_react["default"].createElement(StyledSettingsBar, null, selectedShape ? /*#__PURE__*/_react["default"].createElement(_react["default"].Fragment, null, shapes.includes(selectedShape === null || selectedShape === void 0 ? void 0 : selectedShape.type) && /*#__PURE__*/_react["default"].createElement(_react["default"].Fragment, null, (selectedShape.type === _Shapes.ShapeEnum.polygon || selectedShape.type === _Shapes.ShapeEnum.curve) && /*#__PURE__*/_react["default"].createElement(_PointsNumberField["default"], {
+  var selectedShapeTool = selectedShape ? _fp["default"].find({
+    id: selectedShape.toolId
+  }, availableTools) || _fp["default"].find({
+    type: selectedShape.type
+  }, availableTools) : undefined;
+  return /*#__PURE__*/_react["default"].createElement(StyledSettingsBar, null, selectedShape ? /*#__PURE__*/_react["default"].createElement(_react["default"].Fragment, null, selectedShapeTool && /*#__PURE__*/_react["default"].createElement(_react["default"].Fragment, null, 'pointsCount' in selectedShapeTool.settings && /*#__PURE__*/_react["default"].createElement(_PointsNumberField["default"], {
     selectedSettings: selectedSettings,
     setSelectedSettings: setSelectedSettings,
     disabled: disabled,
-    defaultValue: selectedShape.points.length,
     valueChanged: handlePolygonLinesCount,
-    values: selectedShape.type === _Shapes.ShapeEnum.curve ? _style.CURVE_POINTS_VALUES : _style.POLYGON_POINTS_VALUES
-  }), selectedShape.type === _Shapes.ShapeEnum.text ? /*#__PURE__*/_react["default"].createElement(_FontFamilyField["default"], {
+    min: selectedShapeTool.settings.pointsCount.min,
+    max: selectedShapeTool.settings.pointsCount.max,
+    step: selectedShapeTool.settings.pointsCount.step,
+    value: (_selectedShape$style = selectedShape.style) === null || _selectedShape$style === void 0 ? void 0 : _selectedShape$style.pointsCount
+  }), 'fontFamily' in selectedShapeTool.settings && /*#__PURE__*/_react["default"].createElement(_FontFamilyField["default"], {
     selectedSettings: selectedSettings,
     setSelectedSettings: setSelectedSettings,
     disabled: disabled,
-    defaultValue: (_selectedShape$style = selectedShape.style) === null || _selectedShape$style === void 0 ? void 0 : _selectedShape$style.fontFamily,
-    valueChanged: handleShapeFontFamilyChange
-  }) : /*#__PURE__*/_react["default"].createElement(_react["default"].Fragment, null, /*#__PURE__*/_react["default"].createElement(_RangeField["default"], {
+    valueChanged: handleShapeFontFamilyChange,
+    values: selectedShapeTool.settings.fontFamily.values,
+    defaultValue: (_selectedShape$style2 = selectedShape.style) === null || _selectedShape$style2 === void 0 ? void 0 : _selectedShape$style2.fontFamily
+  }), 'lineWidth' in selectedShapeTool.settings && /*#__PURE__*/_react["default"].createElement(_RangeField["default"], {
     selectedSettings: selectedSettings,
     setSelectedSettings: setSelectedSettings,
     title: "Epaisseur du trait",
     disabled: disabled,
     field: "style.lineWidth",
-    value: (_selectedShape$style2 = selectedShape.style) === null || _selectedShape$style2 === void 0 ? void 0 : _selectedShape$style2.lineWidth,
+    value: (_selectedShape$style3 = selectedShape.style) === null || _selectedShape$style3 === void 0 ? void 0 : _selectedShape$style3.lineWidth,
     valueChanged: handleShapeStyleChange,
-    unity: "px"
-  }), /*#__PURE__*/_react["default"].createElement(_LineTypeField["default"], {
+    unity: "px",
+    min: selectedShapeTool.settings.lineWidth.min,
+    max: selectedShapeTool.settings.lineWidth.max,
+    step: selectedShapeTool.settings.lineWidth.step
+  }), 'lineDash' in selectedShapeTool.settings && /*#__PURE__*/_react["default"].createElement(_LineTypeField["default"], {
     selectedSettings: selectedSettings,
     setSelectedSettings: setSelectedSettings,
     disabled: disabled,
-    defaultValue: (_selectedShape$style3 = selectedShape.style) === null || _selectedShape$style3 === void 0 ? void 0 : _selectedShape$style3.lineDash,
-    valueChanged: handleShapeStyleChange
-  })), selectedShape.type === _Shapes.ShapeEnum.line && /*#__PURE__*/_react["default"].createElement(_LineArrowField["default"], {
+    defaultValue: (_selectedShape$style4 = selectedShape.style) === null || _selectedShape$style4 === void 0 ? void 0 : _selectedShape$style4.lineDash,
+    valueChanged: handleShapeStyleChange,
+    values: selectedShapeTool.settings.lineDash.values
+  }), 'lineArrow' in selectedShapeTool.settings && /*#__PURE__*/_react["default"].createElement(_LineArrowField["default"], {
     selectedSettings: selectedSettings,
     setSelectedSettings: setSelectedSettings,
     disabled: disabled,
-    defaultValue: (_selectedShape$style4 = selectedShape.style) === null || _selectedShape$style4 === void 0 ? void 0 : _selectedShape$style4.lineArrow,
-    valueChanged: handleShapeStyleChange
-  }), /*#__PURE__*/_react["default"].createElement(_ColorField["default"], {
+    defaultValue: (_selectedShape$style5 = selectedShape.style) === null || _selectedShape$style5 === void 0 ? void 0 : _selectedShape$style5.lineArrow,
+    valueChanged: handleShapeStyleChange,
+    values: selectedShapeTool.settings.lineArrow.values
+  }), 'strokeColor' in selectedShapeTool.settings && /*#__PURE__*/_react["default"].createElement(_ColorField["default"], {
     selectedSettings: selectedSettings,
     setSelectedSettings: setSelectedSettings,
     title: "Couleur du trait",
     disabled: disabled,
     field: "style.strokeColor",
-    value: (_selectedShape$style5 = selectedShape.style) === null || _selectedShape$style5 === void 0 ? void 0 : _selectedShape$style5.strokeColor,
-    valueChanged: handleShapeStyleChange
-  }), selectedShape.type !== _Shapes.ShapeEnum.text && selectedShape.type !== _Shapes.ShapeEnum.brush && selectedShape.type !== _Shapes.ShapeEnum.line && /*#__PURE__*/_react["default"].createElement(_ColorField["default"], {
+    value: (_selectedShape$style6 = selectedShape.style) === null || _selectedShape$style6 === void 0 ? void 0 : _selectedShape$style6.strokeColor,
+    valueChanged: handleShapeStyleChange,
+    values: selectedShapeTool.settings.strokeColor.values
+  }), 'fillColor' in selectedShapeTool.settings && /*#__PURE__*/_react["default"].createElement(_ColorField["default"], {
     selectedSettings: selectedSettings,
     setSelectedSettings: setSelectedSettings,
     title: "Couleur de fond",
     disabled: disabled,
     field: "style.fillColor",
-    value: (_selectedShape$style6 = selectedShape.style) === null || _selectedShape$style6 === void 0 ? void 0 : _selectedShape$style6.fillColor,
-    valueChanged: handleShapeStyleChange
-  })), /*#__PURE__*/_react["default"].createElement(_RangeField["default"], {
+    value: (_selectedShape$style7 = selectedShape.style) === null || _selectedShape$style7 === void 0 ? void 0 : _selectedShape$style7.fillColor,
+    valueChanged: handleShapeStyleChange,
+    values: selectedShapeTool.settings.fillColor.values
+  }), 'opacity' in selectedShapeTool.settings && /*#__PURE__*/_react["default"].createElement(_RangeField["default"], {
     selectedSettings: selectedSettings,
     setSelectedSettings: setSelectedSettings,
     title: "Opacit\xE9",
-    min: 0,
-    max: 100,
-    step: 1,
+    min: selectedShapeTool.settings.opacity.min,
+    max: selectedShapeTool.settings.opacity.max,
+    step: selectedShapeTool.settings.opacity.step,
     unity: "%",
     disabled: disabled,
     field: "style.globalAlpha",
-    value: (_selectedShape$style$ = (_selectedShape$style7 = selectedShape.style) === null || _selectedShape$style7 === void 0 ? void 0 : _selectedShape$style7.globalAlpha) !== null && _selectedShape$style$ !== void 0 ? _selectedShape$style$ : 100,
+    value: (_selectedShape$style$ = (_selectedShape$style8 = selectedShape.style) === null || _selectedShape$style8 === void 0 ? void 0 : _selectedShape$style8.globalAlpha) !== null && _selectedShape$style$ !== void 0 ? _selectedShape$style$ : 100,
     valueChanged: handleShapeStyleChange
-  }), /*#__PURE__*/_react["default"].createElement(_DeleteButton["default"], {
+  })), /*#__PURE__*/_react["default"].createElement(_DeleteButton["default"], {
     disabled: disabled,
     selectedShape: selectedShape,
     removeShape: removeShape
-  })) : _fp["default"].includes(activeTool, shapes) && /*#__PURE__*/_react["default"].createElement(_react["default"].Fragment, null, (activeTool === _Shapes.ShapeEnum.polygon || activeTool === _Shapes.ShapeEnum.curve) && /*#__PURE__*/_react["default"].createElement(_PointsNumberField["default"], {
+  })) : 'settings' in activeTool && /*#__PURE__*/_react["default"].createElement(_react["default"].Fragment, null, 'pointsCount' in activeTool.settings && /*#__PURE__*/_react["default"].createElement(_PointsNumberField["default"], {
     selectedSettings: selectedSettings,
     setSelectedSettings: setSelectedSettings,
     disabled: disabled,
-    defaultValue: 3,
     valueChanged: handlePolygonLinesCount,
-    values: activeTool === _Shapes.ShapeEnum.curve ? _style.CURVE_POINTS_VALUES : _style.POLYGON_POINTS_VALUES
-  }), activeTool === _Shapes.ShapeEnum.text ? /*#__PURE__*/_react["default"].createElement(_FontFamilyField["default"], {
+    min: activeTool.settings.pointsCount.min,
+    max: activeTool.settings.pointsCount.max,
+    step: activeTool.settings.pointsCount.step,
+    value: activeTool.settings.pointsCount["default"]
+  }), 'fontFamily' in activeTool.settings && /*#__PURE__*/_react["default"].createElement(_FontFamilyField["default"], {
     selectedSettings: selectedSettings,
     setSelectedSettings: setSelectedSettings,
     disabled: disabled,
-    defaultValue: (_defaultConf$style = defaultConf.style) === null || _defaultConf$style === void 0 ? void 0 : _defaultConf$style.fontFamily,
-    valueChanged: handleShapeStyleChange
-  }) : /*#__PURE__*/_react["default"].createElement(_react["default"].Fragment, null, /*#__PURE__*/_react["default"].createElement(_RangeField["default"], {
+    valueChanged: handleShapeFontFamilyChange,
+    values: activeTool.settings.fontFamily.values,
+    defaultValue: activeTool.settings.fontFamily["default"]
+  }), 'lineWidth' in activeTool.settings && /*#__PURE__*/_react["default"].createElement(_RangeField["default"], {
     selectedSettings: selectedSettings,
     setSelectedSettings: setSelectedSettings,
     title: "Epaisseur du trait",
     disabled: disabled,
     field: "style.lineWidth",
-    value: (_defaultConf$style2 = defaultConf.style) === null || _defaultConf$style2 === void 0 ? void 0 : _defaultConf$style2.lineWidth,
+    value: activeTool.settings.lineWidth["default"],
     valueChanged: handleShapeStyleChange,
-    unity: "px"
-  }), /*#__PURE__*/_react["default"].createElement(_LineTypeField["default"], {
+    unity: "px",
+    min: activeTool.settings.lineWidth.min,
+    max: activeTool.settings.lineWidth.max,
+    step: activeTool.settings.lineWidth.step
+  }), 'lineDash' in activeTool.settings && /*#__PURE__*/_react["default"].createElement(_LineTypeField["default"], {
     selectedSettings: selectedSettings,
     setSelectedSettings: setSelectedSettings,
     disabled: disabled,
-    defaultValue: (_defaultConf$style3 = defaultConf.style) === null || _defaultConf$style3 === void 0 ? void 0 : _defaultConf$style3.lineDash,
-    valueChanged: handleShapeStyleChange
-  })), activeTool === _Shapes.ShapeEnum.line && /*#__PURE__*/_react["default"].createElement(_LineArrowField["default"], {
+    defaultValue: activeTool.settings.lineDash["default"],
+    valueChanged: handleShapeStyleChange,
+    values: activeTool.settings.lineDash.values
+  }), 'lineArrow' in activeTool.settings && /*#__PURE__*/_react["default"].createElement(_LineArrowField["default"], {
     selectedSettings: selectedSettings,
     setSelectedSettings: setSelectedSettings,
     disabled: disabled,
-    defaultValue: (_defaultConf$style4 = defaultConf.style) === null || _defaultConf$style4 === void 0 ? void 0 : _defaultConf$style4.lineArrow,
-    valueChanged: handleShapeStyleChange
-  }), /*#__PURE__*/_react["default"].createElement(_ColorField["default"], {
+    defaultValue: activeTool.settings.lineArrow["default"],
+    valueChanged: handleShapeStyleChange,
+    values: activeTool.settings.lineArrow.values
+  }), 'strokeColor' in activeTool.settings && /*#__PURE__*/_react["default"].createElement(_ColorField["default"], {
     selectedSettings: selectedSettings,
     setSelectedSettings: setSelectedSettings,
     title: "Couleur du trait",
     disabled: disabled,
     field: "style.strokeColor",
-    value: (_defaultConf$style5 = defaultConf.style) === null || _defaultConf$style5 === void 0 ? void 0 : _defaultConf$style5.strokeColor,
-    valueChanged: handleShapeStyleChange
-  }), activeTool !== _Shapes.ShapeEnum.text && activeTool !== _Shapes.ShapeEnum.brush && activeTool !== _Shapes.ShapeEnum.line && /*#__PURE__*/_react["default"].createElement(_ColorField["default"], {
+    value: activeTool.settings.strokeColor["default"],
+    valueChanged: handleShapeStyleChange,
+    values: activeTool.settings.strokeColor.values
+  }), 'fillColor' in activeTool.settings && /*#__PURE__*/_react["default"].createElement(_ColorField["default"], {
     selectedSettings: selectedSettings,
     setSelectedSettings: setSelectedSettings,
     title: "Couleur de fond",
     disabled: disabled,
     field: "style.fillColor",
-    value: (_defaultConf$style6 = defaultConf.style) === null || _defaultConf$style6 === void 0 ? void 0 : _defaultConf$style6.fillColor,
-    valueChanged: handleShapeStyleChange
-  }), /*#__PURE__*/_react["default"].createElement(_RangeField["default"], {
+    value: activeTool.settings.fillColor["default"],
+    valueChanged: handleShapeStyleChange,
+    values: activeTool.settings.fillColor.values
+  }), 'opacity' in activeTool.settings && /*#__PURE__*/_react["default"].createElement(_RangeField["default"], {
     selectedSettings: selectedSettings,
     setSelectedSettings: setSelectedSettings,
     title: "Opacit\xE9",
-    min: 0,
-    max: 100,
-    step: 1,
+    min: activeTool.settings.opacity.min,
+    max: activeTool.settings.opacity.max,
+    step: activeTool.settings.opacity.step,
     unity: "%",
     disabled: disabled,
     field: "style.globalAlpha",
-    value: (_defaultConf$style7 = defaultConf.style) === null || _defaultConf$style7 === void 0 ? void 0 : _defaultConf$style7.globalAlpha,
+    value: activeTool.settings.opacity["default"],
     valueChanged: handleShapeStyleChange
   })), /*#__PURE__*/_react["default"].createElement(StyledSeparator, null), layersManipulation && /*#__PURE__*/_react["default"].createElement(_LayoutButton["default"], {
     layersManipulation: layersManipulation,

package/dist/components/toolbox/EditTextBox.js

@@ -27,25 +27,25 @@ function _interopRequireWildcard(obj, nodeInterop) { if (!nodeInterop && obj &&
 
 var StyledEditBox = /*#__PURE__*/(0, _react2.styled)("div")({
   name: "StyledEditBox",
-  "class": "s1unz6yq",
+  "class": "se8ufj4",
   vars: {
-    "s1unz6yq-0": [function (_ref) {
+    "se8ufj4-0": [function (_ref) {
       var transform = _ref.transform;
       return transform;
     }],
-    "s1unz6yq-1": [function (_ref2) {
+    "se8ufj4-1": [function (_ref2) {
       var color = _ref2.color;
       return color;
     }],
-    "s1unz6yq-2": [function (_ref3) {
+    "se8ufj4-2": [function (_ref3) {
       var padding = _ref3.padding;
       return padding;
     }, "px"],
-    "s1unz6yq-3": [function (_ref4) {
+    "se8ufj4-3": [function (_ref4) {
       var fontsize = _ref4.fontsize;
       return fontsize;
     }, "px"],
-    "s1unz6yq-5": [function (_ref5) {
+    "se8ufj4-5": [function (_ref5) {
       var fontfamily = _ref5.fontfamily;
       return fontfamily;
     }]

package/dist/components/toolbox/LoadFileTool.js

@@ -18,12 +18,14 @@ function _getRequireWildcardCache(nodeInterop) { if (typeof WeakMap !== "functio
 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; }
 
 var LoadFileTool = function LoadFileTool(_ref) {
+  var _type$lib;
+
   var _ref$disabled = _ref.disabled,
       disabled = _ref$disabled === void 0 ? false : _ref$disabled,
       _ref$withText = _ref.withText,
       withText = _ref$withText === void 0 ? false : _ref$withText,
       loadFile = _ref.loadFile,
-      lib = _ref.lib,
+      type = _ref.type,
       img = _ref.img,
       accept = _ref.accept;
   var inputRef = (0, _react.useRef)(null);
@@ -47,9 +49,9 @@ var LoadFileTool = function LoadFileTool(_ref) {
     onClick: handleClick,
     onChange: handleChange,
     accept: accept,
-    title: lib,
+    title: (_type$lib = type.lib) !== null && _type$lib !== void 0 ? _type$lib : type.type,
     icon: img,
-    children: withText ? lib : undefined,
+    children: withText ? type.lib : undefined,
     disabled: disabled
   });
 };