@synerise/ds-inline-edit 0.4.39 → 0.5.3

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
package/CHANGELOG.md CHANGED
@@ -3,6 +3,38 @@
3
3
  All notable changes to this project will be documented in this file.
4
4
  See [Conventional Commits](https://conventionalcommits.org) for commit guidelines.
5
5
 
6
+ ## [0.5.3](https://github.com/Synerise/synerise-design/compare/@synerise/ds-inline-edit@0.5.2...@synerise/ds-inline-edit@0.5.3) (2021-11-22)
7
+
8
+ **Note:** Version bump only for package @synerise/ds-inline-edit
9
+
10
+
11
+
12
+
13
+
14
+ ## [0.5.2](https://github.com/Synerise/synerise-design/compare/@synerise/ds-inline-edit@0.5.1...@synerise/ds-inline-edit@0.5.2) (2021-11-16)
15
+
16
+ **Note:** Version bump only for package @synerise/ds-inline-edit
17
+
18
+
19
+
20
+
21
+
22
+ ## [0.5.1](https://github.com/Synerise/synerise-design/compare/@synerise/ds-inline-edit@0.4.39...@synerise/ds-inline-edit@0.5.1) (2021-11-09)
23
+
24
+ **Note:** Version bump only for package @synerise/ds-inline-edit
25
+
26
+
27
+
28
+
29
+
30
+ # [0.5.0](https://github.com/Synerise/synerise-design/compare/@synerise/ds-inline-edit@0.4.39...@synerise/ds-inline-edit@0.5.0) (2021-11-09)
31
+
32
+ **Note:** Version bump only for package @synerise/ds-inline-edit
33
+
34
+
35
+
36
+
37
+
6
38
  ## [0.4.39](https://github.com/Synerise/synerise-design/compare/@synerise/ds-inline-edit@0.4.38...@synerise/ds-inline-edit@0.4.39) (2021-11-05)
7
39
 
8
40
  **Note:** Version bump only for package @synerise/ds-inline-edit
@@ -1,34 +1,13 @@
1
- function _slicedToArray(arr, i) { return _arrayWithHoles(arr) || _iterableToArrayLimit(arr, i) || _unsupportedIterableToArray(arr, i) || _nonIterableRest(); }
2
-
3
- function _nonIterableRest() { throw new TypeError("Invalid attempt to destructure non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method."); }
4
-
5
- function _iterableToArrayLimit(arr, i) { if (typeof Symbol === "undefined" || !(Symbol.iterator in Object(arr))) return; var _arr = []; var _n = true; var _d = false; var _e = undefined; try { for (var _i = arr[Symbol.iterator](), _s; !(_n = (_s = _i.next()).done); _n = true) { _arr.push(_s.value); if (i && _arr.length === i) break; } } catch (err) { _d = true; _e = err; } finally { try { if (!_n && _i["return"] != null) _i["return"](); } finally { if (_d) throw _e; } } return _arr; }
6
-
7
- function _arrayWithHoles(arr) { if (Array.isArray(arr)) return arr; }
8
-
9
- function _toConsumableArray(arr) { return _arrayWithoutHoles(arr) || _iterableToArray(arr) || _unsupportedIterableToArray(arr) || _nonIterableSpread(); }
10
-
11
- function _nonIterableSpread() { throw new TypeError("Invalid attempt to spread non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method."); }
12
-
13
- function _unsupportedIterableToArray(o, minLen) { if (!o) return; if (typeof o === "string") return _arrayLikeToArray(o, minLen); var n = Object.prototype.toString.call(o).slice(8, -1); if (n === "Object" && o.constructor) n = o.constructor.name; if (n === "Map" || n === "Set") return Array.from(n); if (n === "Arguments" || /^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(n)) return _arrayLikeToArray(o, minLen); }
14
-
15
- function _iterableToArray(iter) { if (typeof Symbol !== "undefined" && Symbol.iterator in Object(iter)) return Array.from(iter); }
16
-
17
- function _arrayWithoutHoles(arr) { if (Array.isArray(arr)) return _arrayLikeToArray(arr); }
18
-
19
- function _arrayLikeToArray(arr, len) { if (len == null || len > arr.length) len = arr.length; for (var i = 0, arr2 = new Array(len); i < len; i++) { arr2[i] = arr[i]; } return arr2; }
20
-
21
1
  import * as React from 'react';
22
2
  import AutosizeInput from 'react-input-autosize';
23
3
  import Tooltip from '@synerise/ds-tooltip';
24
- import Icon from '@synerise/ds-icon';
25
- import { EditS } from '@synerise/ds-icon/dist/icons';
4
+ import Icon, { EditS } from '@synerise/ds-icon';
26
5
  import { toCamelCase } from '@synerise/ds-utils';
27
6
  import * as S from './InlineEdit.styles';
28
7
  import { attachWidthWatcher } from './utils';
29
- var SAMPLE = String.fromCharCode.apply(String, _toConsumableArray(_toConsumableArray(Array(26).keys()).map(function (i) {
8
+ var SAMPLE = String.fromCharCode.apply(String, [].concat(Array(26).keys()).map(function (i) {
30
9
  return i + 65;
31
- })));
10
+ }));
32
11
 
33
12
  var InlineEdit = function InlineEdit(_ref) {
34
13
  var className = _ref.className,
@@ -49,14 +28,13 @@ var InlineEdit = function InlineEdit(_ref) {
49
28
  }, []);
50
29
 
51
30
  var _React$useState = React.useState(),
52
- _React$useState2 = _slicedToArray(_React$useState, 2),
53
- scrolled = _React$useState2[0],
54
- setScrolled = _React$useState2[1];
31
+ scrolled = _React$useState[0],
32
+ setScrolled = _React$useState[1];
55
33
 
56
34
  var handleScroll = React.useCallback(function () {
57
- if ((inputRef === null || inputRef === void 0 ? void 0 : inputRef.current) !== null) {
35
+ if ((inputRef == null ? void 0 : inputRef.current) !== null) {
58
36
  // eslint-disable-next-line @typescript-eslint/no-explicit-any
59
- var scrolledPixels = (inputRef === null || inputRef === void 0 ? void 0 : inputRef.current).input.scrollLeft;
37
+ var scrolledPixels = (inputRef == null ? void 0 : inputRef.current).input.scrollLeft;
60
38
 
61
39
  if (scrolledPixels > 0) {
62
40
  setScrolled(true);
@@ -101,14 +79,14 @@ var InlineEdit = function InlineEdit(_ref) {
101
79
  attachWidthWatcher(fontStyleWatcher.current, updateInputWidth);
102
80
  }
103
81
  }, [autoFocus, fontStyleWatcher, inputRef, updateInputWidth]);
104
- return React.createElement(S.InPlaceEditableInputContainer, {
105
- className: "ds-inline-edit ".concat(className || ''),
82
+ return /*#__PURE__*/React.createElement(S.InPlaceEditableInputContainer, {
83
+ className: "ds-inline-edit " + (className || ''),
106
84
  style: style,
107
85
  size: size,
108
86
  disabled: disabled,
109
87
  error: error,
110
88
  scrolled: scrolled
111
- }, React.createElement(AutosizeInput, {
89
+ }, /*#__PURE__*/React.createElement(AutosizeInput, {
112
90
  id: input.name ? toCamelCase(input.name) : 'id',
113
91
  className: "autosize-input",
114
92
  placeholder: input.placeholder,
@@ -125,16 +103,16 @@ var InlineEdit = function InlineEdit(_ref) {
125
103
  /* eslint-disable-next-line @typescript-eslint/no-explicit-any */
126
104
  ,
127
105
  ref: inputRef
128
- }), !hideIcon && React.createElement(Tooltip, {
106
+ }), !hideIcon && /*#__PURE__*/React.createElement(Tooltip, {
129
107
  "data-testid": "inline-edit-icon",
130
108
  title: tooltipTitle
131
- }, React.createElement(S.IconWrapper, {
109
+ }, /*#__PURE__*/React.createElement(S.IconWrapper, {
132
110
  onClick: handleFocusInput,
133
111
  size: size
134
- }, React.createElement(Icon, {
135
- component: React.createElement(EditS, null),
112
+ }, /*#__PURE__*/React.createElement(Icon, {
113
+ component: /*#__PURE__*/React.createElement(EditS, null),
136
114
  size: 24
137
- }))), React.createElement(S.FontStyleWatcher, {
115
+ }))), /*#__PURE__*/React.createElement(S.FontStyleWatcher, {
138
116
  ref: fontStyleWatcher,
139
117
  style: {
140
118
  position: 'absolute',
@@ -17,7 +17,7 @@ var applyDots = function applyDots(props) {
17
17
  };
18
18
 
19
19
  var applyDotsOnError = function applyDotsOnError(props) {
20
- if (props.error) return "background-image: linear-gradient(to right, ".concat(applyDots(props), " 20%, rgba(255, 255, 255, 0) 10%);\n background-color: transparent;\n background-position: bottom left;\n background-size: 5px 1px;\n background-repeat: repeat-x;");
20
+ if (props.error) return "background-image: linear-gradient(to right, " + applyDots(props) + " 20%, rgba(255, 255, 255, 0) 10%);\n background-color: transparent;\n background-position: bottom left;\n background-size: 5px 1px;\n background-repeat: repeat-x;";
21
21
  return '';
22
22
  };
23
23
 
@@ -0,0 +1 @@
1
+ export {};
@@ -1,23 +1,10 @@
1
1
  function _extends() { _extends = Object.assign || function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }
2
2
 
3
- function _slicedToArray(arr, i) { return _arrayWithHoles(arr) || _iterableToArrayLimit(arr, i) || _unsupportedIterableToArray(arr, i) || _nonIterableRest(); }
4
-
5
- function _nonIterableRest() { throw new TypeError("Invalid attempt to destructure non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method."); }
6
-
7
- function _unsupportedIterableToArray(o, minLen) { if (!o) return; if (typeof o === "string") return _arrayLikeToArray(o, minLen); var n = Object.prototype.toString.call(o).slice(8, -1); if (n === "Object" && o.constructor) n = o.constructor.name; if (n === "Map" || n === "Set") return Array.from(n); if (n === "Arguments" || /^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(n)) return _arrayLikeToArray(o, minLen); }
8
-
9
- function _arrayLikeToArray(arr, len) { if (len == null || len > arr.length) len = arr.length; for (var i = 0, arr2 = new Array(len); i < len; i++) { arr2[i] = arr[i]; } return arr2; }
10
-
11
- function _iterableToArrayLimit(arr, i) { if (typeof Symbol === "undefined" || !(Symbol.iterator in Object(arr))) return; var _arr = []; var _n = true; var _d = false; var _e = undefined; try { for (var _i = arr[Symbol.iterator](), _s; !(_n = (_s = _i.next()).done); _n = true) { _arr.push(_s.value); if (i && _arr.length === i) break; } } catch (err) { _d = true; _e = err; } finally { try { if (!_n && _i["return"] != null) _i["return"](); } finally { if (_d) throw _e; } } return _arr; }
12
-
13
- function _arrayWithHoles(arr) { if (Array.isArray(arr)) return arr; }
14
-
15
3
  import * as React from 'react';
16
4
  import AutosizeInput from 'react-input-autosize';
17
5
  import { toCamelCase } from '@synerise/ds-utils';
18
- import Icon from '@synerise/ds-icon';
6
+ import Icon, { AngleDownS } from '@synerise/ds-icon';
19
7
  import Dropdown from '@synerise/ds-dropdown';
20
- import { AngleDownS } from '@synerise/ds-icon/dist/icons';
21
8
  import * as S from './InlineSelect.style';
22
9
  import { attachWidthWatcher } from '../utils';
23
10
  import SelectDropdown from './SelectDropdown/SelectDropdown';
@@ -62,31 +49,28 @@ var InlineSelect = function InlineSelect(_ref) {
62
49
  }, [autoFocus, fontStyleWatcher, inputRef, updateInputWidth]);
63
50
 
64
51
  var _React$useState = React.useState(initialValue || placeholder || 'option'),
65
- _React$useState2 = _slicedToArray(_React$useState, 2),
66
- selectedValue = _React$useState2[0],
67
- setSelectedValue = _React$useState2[1];
52
+ selectedValue = _React$useState[0],
53
+ setSelectedValue = _React$useState[1];
68
54
 
69
- var _React$useState3 = React.useState(false),
70
- _React$useState4 = _slicedToArray(_React$useState3, 2),
71
- opened = _React$useState4[0],
72
- setOpened = _React$useState4[1];
55
+ var _React$useState2 = React.useState(false),
56
+ opened = _React$useState2[0],
57
+ setOpened = _React$useState2[1];
73
58
 
74
- var _React$useState5 = React.useState(false),
75
- _React$useState6 = _slicedToArray(_React$useState5, 2),
76
- pressed = _React$useState6[0],
77
- setPressed = _React$useState6[1];
59
+ var _React$useState3 = React.useState(false),
60
+ pressed = _React$useState3[0],
61
+ setPressed = _React$useState3[1];
78
62
 
79
63
  React.useEffect(function () {
80
- if ((input === null || input === void 0 ? void 0 : input.value) !== selectedValue) {
81
- setSelectedValue(input === null || input === void 0 ? void 0 : input.value);
64
+ if ((input == null ? void 0 : input.value) !== selectedValue) {
65
+ setSelectedValue(input == null ? void 0 : input.value);
82
66
  }
83
67
  }, [input, selectedValue]);
84
- return React.createElement(Dropdown, _extends({
68
+ return /*#__PURE__*/React.createElement(Dropdown, _extends({
85
69
  visible: !disabled && opened,
86
70
  onVisibleChange: setOpened,
87
71
  placement: "bottomRight",
88
72
  disabled: disabled,
89
- overlay: React.createElement(SelectDropdown, {
73
+ overlay: /*#__PURE__*/React.createElement(SelectDropdown, {
90
74
  dataSource: dataSource,
91
75
  onSelect: function onSelect(item) {
92
76
  return setSelectedValue(item.text);
@@ -97,8 +81,8 @@ var InlineSelect = function InlineSelect(_ref) {
97
81
  style: dropdownOverlayStyle
98
82
  }),
99
83
  trigger: ['click']
100
- }, dropdownProps), React.createElement(S.InPlaceEditableInputContainer, {
101
- className: "ds-inline-edit ".concat(className || ''),
84
+ }, dropdownProps), /*#__PURE__*/React.createElement(S.InPlaceEditableInputContainer, {
85
+ className: "ds-inline-edit " + (className || ''),
102
86
  style: style,
103
87
  size: size,
104
88
  disabled: disabled,
@@ -112,7 +96,7 @@ var InlineSelect = function InlineSelect(_ref) {
112
96
  },
113
97
  pressed: pressed,
114
98
  dropdownOpened: opened
115
- }, React.createElement(AutosizeInput, {
99
+ }, /*#__PURE__*/React.createElement(AutosizeInput, {
116
100
  id: input.name ? toCamelCase(input.name) : 'id',
117
101
  className: "autosize-input",
118
102
  placeholder: input.placeholder,
@@ -125,13 +109,13 @@ var InlineSelect = function InlineSelect(_ref) {
125
109
  /* eslint-disable-next-line @typescript-eslint/no-explicit-any */
126
110
  ,
127
111
  ref: inputRef
128
- }), !hideIcon && React.createElement(S.IconWrapper, {
112
+ }), !hideIcon && /*#__PURE__*/React.createElement(S.IconWrapper, {
129
113
  size: size,
130
114
  expanded: opened
131
- }, React.createElement(Icon, {
132
- component: React.createElement(AngleDownS, null),
115
+ }, /*#__PURE__*/React.createElement(Icon, {
116
+ component: /*#__PURE__*/React.createElement(AngleDownS, null),
133
117
  size: 24
134
- })), React.createElement(S.FontStyleWatcher, {
118
+ })), /*#__PURE__*/React.createElement(S.FontStyleWatcher, {
135
119
  ref: fontStyleWatcher,
136
120
  style: {
137
121
  position: 'absolute',
@@ -17,7 +17,7 @@ var applyColorActive = function applyColorActive(props) {
17
17
  };
18
18
 
19
19
  var applyDotsOnError = function applyDotsOnError(props) {
20
- if (props.error) return "background-image: linear-gradient(to right, ".concat(applyColor(props), " 20%, rgba(255, 255, 255, 0) 10%);\n background-color: transparent;\n background-position: bottom left;\n background-size: 5px 1px;\n background-repeat: repeat-x;");
20
+ if (props.error) return "background-image: linear-gradient(to right, " + applyColor(props) + " 20%, rgba(255, 255, 255, 0) 10%);\n background-color: transparent;\n background-position: bottom left;\n background-size: 5px 1px;\n background-repeat: repeat-x;";
21
21
  return '';
22
22
  };
23
23
 
@@ -0,0 +1 @@
1
+ export {};
@@ -1,17 +1,5 @@
1
1
  function _extends() { _extends = Object.assign || function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }
2
2
 
3
- function _slicedToArray(arr, i) { return _arrayWithHoles(arr) || _iterableToArrayLimit(arr, i) || _unsupportedIterableToArray(arr, i) || _nonIterableRest(); }
4
-
5
- function _nonIterableRest() { throw new TypeError("Invalid attempt to destructure non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method."); }
6
-
7
- function _unsupportedIterableToArray(o, minLen) { if (!o) return; if (typeof o === "string") return _arrayLikeToArray(o, minLen); var n = Object.prototype.toString.call(o).slice(8, -1); if (n === "Object" && o.constructor) n = o.constructor.name; if (n === "Map" || n === "Set") return Array.from(n); if (n === "Arguments" || /^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(n)) return _arrayLikeToArray(o, minLen); }
8
-
9
- function _arrayLikeToArray(arr, len) { if (len == null || len > arr.length) len = arr.length; for (var i = 0, arr2 = new Array(len); i < len; i++) { arr2[i] = arr[i]; } return arr2; }
10
-
11
- function _iterableToArrayLimit(arr, i) { if (typeof Symbol === "undefined" || !(Symbol.iterator in Object(arr))) return; var _arr = []; var _n = true; var _d = false; var _e = undefined; try { for (var _i = arr[Symbol.iterator](), _s; !(_n = (_s = _i.next()).done); _n = true) { _arr.push(_s.value); if (i && _arr.length === i) break; } } catch (err) { _d = true; _e = err; } finally { try { if (!_n && _i["return"] != null) _i["return"](); } finally { if (_d) throw _e; } } return _arr; }
12
-
13
- function _arrayWithHoles(arr) { if (Array.isArray(arr)) return arr; }
14
-
15
3
  import * as React from 'react';
16
4
  import Menu from '@synerise/ds-menu';
17
5
  import { SearchItems } from '@synerise/ds-search/dist/Elements';
@@ -30,27 +18,26 @@ var SelectDropdown = function SelectDropdown(_ref) {
30
18
  var rowHeight = dropdownRowHeight || DEFAULT_ROW_HEIGHT;
31
19
 
32
20
  var _React$useState = React.useState(0),
33
- _React$useState2 = _slicedToArray(_React$useState, 2),
34
- scrollTop = _React$useState2[0],
35
- setScrollTop = _React$useState2[1];
21
+ scrollTop = _React$useState[0],
22
+ setScrollTop = _React$useState[1];
36
23
 
37
24
  var handleChange = React.useCallback(function (item) {
38
25
  onSelect(item);
39
26
  closeDropdown();
40
27
  }, [onSelect, closeDropdown]);
41
- return React.createElement(S.DropdownWrapper, {
28
+ return /*#__PURE__*/React.createElement(S.DropdownWrapper, {
42
29
  style: style
43
- }, React.createElement(S.DSMenu, null, React.createElement(S.StyledScrollbar, {
30
+ }, /*#__PURE__*/React.createElement(S.DSMenu, null, /*#__PURE__*/React.createElement(S.StyledScrollbar, {
44
31
  maxHeight: rowCount * rowHeight,
45
32
  absolute: true,
46
33
  onScroll: function onScroll(e) {
47
34
  return setScrollTop(e.currentTarget.scrollTop);
48
35
  }
49
- }, React.createElement(SearchItems, {
36
+ }, /*#__PURE__*/React.createElement(SearchItems, {
50
37
  data: dataSource,
51
38
  itemRender: function itemRender(item) {
52
- return React.createElement(Menu.Item, _extends({
53
- key: item === null || item === void 0 ? void 0 : item.text
39
+ return /*#__PURE__*/React.createElement(Menu.Item, _extends({
40
+ key: item == null ? void 0 : item.text
54
41
  }, item));
55
42
  },
56
43
  onItemClick: function onItemClick(i) {
@@ -1,6 +1,12 @@
1
- export default (function (element, resizeCallback) {
2
- var width = arguments.length > 2 && arguments[2] !== undefined ? arguments[2] : true;
3
- var height = arguments.length > 3 && arguments[3] !== undefined ? arguments[3] : true;
1
+ export default (function (element, resizeCallback, width, height) {
2
+ if (width === void 0) {
3
+ width = true;
4
+ }
5
+
6
+ if (height === void 0) {
7
+ height = true;
8
+ }
9
+
4
10
  var customElement = element;
5
11
  if (customElement.sizeWatcher) return false;
6
12
 
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@synerise/ds-inline-edit",
3
- "version": "0.4.39",
3
+ "version": "0.5.3",
4
4
  "description": "InlineEdit UI Component for the Synerise Design System",
5
5
  "license": "ISC",
6
6
  "repository": "Synerise/synerise-design",
@@ -32,11 +32,11 @@
32
32
  ],
33
33
  "types": "dist/index.d.ts",
34
34
  "dependencies": {
35
- "@synerise/ds-dropdown": "^0.16.31",
36
- "@synerise/ds-icon": "^0.45.2",
37
- "@synerise/ds-menu": "^0.10.45",
38
- "@synerise/ds-search": "^0.5.54",
39
- "@synerise/ds-tooltip": "^0.10.56",
35
+ "@synerise/ds-dropdown": "^0.17.3",
36
+ "@synerise/ds-icon": "^0.46.2",
37
+ "@synerise/ds-menu": "^0.11.2",
38
+ "@synerise/ds-search": "^0.6.3",
39
+ "@synerise/ds-tooltip": "^0.11.2",
40
40
  "react-input-autosize": "^2.2.2"
41
41
  },
42
42
  "peerDependencies": {
@@ -47,5 +47,5 @@
47
47
  "@synerise/ds-utils": "^0.19.0",
48
48
  "@types/react-input-autosize": "2.0.2"
49
49
  },
50
- "gitHead": "bf865b6d1967c42effb68dc794f34dd18ddebe27"
50
+ "gitHead": "2468359677783819939fb9f1ef5acc36667ecd1a"
51
51
  }