oolib 2.67.9 → 2.68.0

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.
@@ -79,7 +79,6 @@ var ActionMenu = function (_a) {
79
79
  var _k = (0, usePopOutOfOverflowHiddenParent_1.usePopOutOfOverflowHiddenParent)(popOutOfOverflowHiddenParent), fixPos = _k.fixPos, applyFixedPos = _k.applyFixedPos, removeFixedPos = _k.removeFixedPos, trackerRef = _k.trackerRef;
80
80
  return (react_1.default.createElement(styled_1.StyledActionMenu, { ref: actionMenuRef },
81
81
  react_1.default.createElement(ButtonComp, __assign({}, buttonSize, { icon: icon, iconSize: iconSize, invert: invert, stopPropagation: true, preventDefault: true, onClick: function (e) {
82
- console.log('detected');
83
82
  setShowActions(!showActions);
84
83
  }, active: showActions })),
85
84
  popOutOfOverflowHiddenParent &&
@@ -1,2 +1,8 @@
1
- export function ColActionsMenu({}: {}): React.JSX.Element;
1
+ export function ColActionsMenu({ value, colIdx, onChange, id, defaultColWidth }: {
2
+ value: any;
3
+ colIdx: any;
4
+ onChange: any;
5
+ id: any;
6
+ defaultColWidth: any;
7
+ }): React.JSX.Element;
2
8
  import React from "react";
@@ -6,12 +6,27 @@ Object.defineProperty(exports, "__esModule", { value: true });
6
6
  exports.ColActionsMenu = void 0;
7
7
  var react_1 = __importDefault(require("react"));
8
8
  var ActionMenu_1 = require("../../../ActionMenu");
9
+ var handleColActions_1 = require("../../handlers/handleColActions");
10
+ var UIContent_1 = require("../../../../UIContent");
9
11
  var ColActionsMenu = function (_a) {
10
- return (react_1.default.createElement("div", { style: { position: 'absolute', top: 0, left: '50%', transform: 'translate(-50%, -100%)' } },
12
+ var value = _a.value, colIdx = _a.colIdx, onChange = _a.onChange, id = _a.id, defaultColWidth = _a.defaultColWidth;
13
+ return (react_1.default.createElement("div", { style: { zIndex: 2, position: 'absolute', top: 0, left: '50%', transform: 'translate(-50%, -100%)' } },
11
14
  react_1.default.createElement(ActionMenu_1.ActionMenu, { actions: [
12
15
  {
13
- display: 'Dummy',
14
- onClick: function () { return console.log('dummy'); },
16
+ display: UIContent_1.UIContent.SimpleTable.delete,
17
+ onClick: function () { return (0, handleColActions_1.handleDeleteCol)({ value: value, colIdx: colIdx, onChange: onChange, id: id }); },
18
+ },
19
+ {
20
+ display: UIContent_1.UIContent.SimpleTable.duplicate,
21
+ onClick: function () { return (0, handleColActions_1.handleDuplicateCol)({ value: value, colIdx: colIdx, onChange: onChange, id: id }); },
22
+ },
23
+ {
24
+ display: UIContent_1.UIContent.SimpleTable.insertColAfter,
25
+ onClick: function () { return (0, handleColActions_1.handleInsertColAfter)({ value: value, colIdx: colIdx, onChange: onChange, id: id, defaultColWidth: defaultColWidth }); },
26
+ },
27
+ {
28
+ display: UIContent_1.UIContent.SimpleTable.insertColBefore,
29
+ onClick: function () { return (0, handleColActions_1.handleInsertColBefore)({ value: value, colIdx: colIdx, onChange: onChange, id: id, defaultColWidth: defaultColWidth }); },
15
30
  }
16
31
  ] })));
17
32
  };
@@ -11,7 +11,7 @@ var UIContent_1 = require("../../../../UIContent");
11
11
  var RowActionsMenu = function (_a) {
12
12
  var value = _a.value, rowIdx = _a.rowIdx, onChange = _a.onChange, id = _a.id;
13
13
  return (react_1.default.createElement("div", { style: {
14
- zIndex: 100,
14
+ zIndex: 1,
15
15
  position: "absolute",
16
16
  top: "50%",
17
17
  left: 0,
@@ -1 +1,32 @@
1
- export function handleAddCol(value: any, props: any): void;
1
+ export function handleAddCol({ value, onChange, id, defaultColWidth }: {
2
+ value: any;
3
+ onChange: any;
4
+ id: any;
5
+ defaultColWidth: any;
6
+ }): void;
7
+ export function handleDeleteCol({ value, colIdx, onChange, id }: {
8
+ value: any;
9
+ colIdx: any;
10
+ onChange: any;
11
+ id: any;
12
+ }): void;
13
+ export function handleDuplicateCol({ value, colIdx, onChange, id }: {
14
+ value: any;
15
+ colIdx: any;
16
+ onChange: any;
17
+ id: any;
18
+ }): void;
19
+ export function handleInsertColAfter({ value, colIdx, onChange, id, defaultColWidth }: {
20
+ value: any;
21
+ colIdx: any;
22
+ onChange: any;
23
+ id: any;
24
+ defaultColWidth: any;
25
+ }): void;
26
+ export function handleInsertColBefore({ value, colIdx, onChange, id, defaultColWidth }: {
27
+ value: any;
28
+ colIdx: any;
29
+ onChange: any;
30
+ id: any;
31
+ defaultColWidth: any;
32
+ }): void;
@@ -1,4 +1,15 @@
1
1
  "use strict";
2
+ var __assign = (this && this.__assign) || function () {
3
+ __assign = Object.assign || function(t) {
4
+ for (var s, i = 1, n = arguments.length; i < n; i++) {
5
+ s = arguments[i];
6
+ for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p))
7
+ t[p] = s[p];
8
+ }
9
+ return t;
10
+ };
11
+ return __assign.apply(this, arguments);
12
+ };
2
13
  var __spreadArray = (this && this.__spreadArray) || function (to, from, pack) {
3
14
  if (pack || arguments.length === 2) for (var i = 0, l = from.length, ar; i < l; i++) {
4
15
  if (ar || !(i in from)) {
@@ -9,17 +20,110 @@ var __spreadArray = (this && this.__spreadArray) || function (to, from, pack) {
9
20
  return to.concat(ar || Array.prototype.slice.call(from));
10
21
  };
11
22
  Object.defineProperty(exports, "__esModule", { value: true });
12
- exports.handleAddCol = void 0;
23
+ exports.handleInsertColBefore = exports.handleInsertColAfter = exports.handleDuplicateCol = exports.handleDeleteCol = exports.handleAddCol = void 0;
13
24
  var genHash_1 = require("../utils/genHash");
14
- var handleAddCol = function (value, props) {
15
- var onChange = props.onChange, id = props.id;
25
+ var handleAddColAtIdx = function (_a) {
26
+ var value = _a.value, onChange = _a.onChange, id = _a.id, defaultColWidth = _a.defaultColWidth, colIdx = _a.colIdx;
16
27
  var data = value.data, colWidthConfig = value.colWidthConfig;
17
28
  var newData = __spreadArray([], data, true);
18
- newData.map(function (row) {
19
- row.cellData.push({
20
- id: "row_".concat((0, genHash_1.genHash)(8)),
21
- });
29
+ newData = newData.map(function (row) {
30
+ var newCellData = __spreadArray([], row.cellData, true);
31
+ newCellData.splice(colIdx, 0, { id: "cell_".concat((0, genHash_1.genHash)(8)) });
32
+ return __assign(__assign({}, row), { cellData: newCellData });
33
+ });
34
+ var newColWidthValue = defaultColWidth + "px";
35
+ var newColWidthConfigAsArray = Object.values(colWidthConfig);
36
+ newColWidthConfigAsArray.splice(colIdx, 0, newColWidthValue);
37
+ var newColWidthConfig = newColWidthConfigAsArray
38
+ .map(function (width, i) { return ({
39
+ colId: "col_".concat(i),
40
+ width: width,
41
+ }); })
42
+ .reduce(function (a, b) {
43
+ var _a;
44
+ return (__assign(__assign({}, a), (_a = {}, _a[b.colId] = b.width, _a)));
45
+ }, {});
46
+ onChange &&
47
+ onChange(id, { data: newData, colWidthConfig: newColWidthConfig });
48
+ };
49
+ var handleAddCol = function (_a) {
50
+ var value = _a.value, onChange = _a.onChange, id = _a.id, defaultColWidth = _a.defaultColWidth;
51
+ handleAddColAtIdx({
52
+ value: value,
53
+ onChange: onChange,
54
+ id: id,
55
+ defaultColWidth: defaultColWidth,
56
+ colIdx: value.data[0].cellData.length,
22
57
  });
23
- onChange && onChange(id, { data: newData, colWidthConfig: colWidthConfig });
24
58
  };
25
59
  exports.handleAddCol = handleAddCol;
60
+ var handleDeleteCol = function (_a) {
61
+ var value = _a.value, colIdx = _a.colIdx, onChange = _a.onChange, id = _a.id;
62
+ var data = value.data, colWidthConfig = value.colWidthConfig;
63
+ var newData = data.map(function (row) {
64
+ var newCellData = row.cellData.filter(function (cell, cellIdx) { return colIdx !== cellIdx; });
65
+ return __assign(__assign({}, row), { cellData: newCellData });
66
+ });
67
+ var newColWidthConfig = __assign({}, colWidthConfig);
68
+ delete newColWidthConfig["col_".concat(colIdx)];
69
+ // now that we deleted this colIdx from widthconfig. we need to reset all the keys from col_0 to col_<length-1>
70
+ newColWidthConfig = Object.values(newColWidthConfig)
71
+ .map(function (width, i) { return ({
72
+ colId: "col_".concat(i),
73
+ width: width,
74
+ }); })
75
+ .reduce(function (a, b) {
76
+ var _a;
77
+ return (__assign(__assign({}, a), (_a = {}, _a[b.colId] = b.width, _a)));
78
+ }, {});
79
+ onChange &&
80
+ onChange(id, { data: newData, colWidthConfig: newColWidthConfig });
81
+ };
82
+ exports.handleDeleteCol = handleDeleteCol;
83
+ var handleDuplicateCol = function (_a) {
84
+ var value = _a.value, colIdx = _a.colIdx, onChange = _a.onChange, id = _a.id;
85
+ var data = value.data, colWidthConfig = value.colWidthConfig;
86
+ var newData = data.map(function (row) {
87
+ var newCellData = __spreadArray([], row.cellData, true);
88
+ var dataToDuplicate = __assign(__assign({}, newCellData[colIdx]), { id: "cell_".concat((0, genHash_1.genHash)(8)) });
89
+ newCellData.splice(colIdx + 1, 0, dataToDuplicate);
90
+ return __assign(__assign({}, row), { cellData: newCellData });
91
+ });
92
+ var newColWidthValue = colWidthConfig["col_".concat(colIdx)];
93
+ var newColWidthConfigAsArray = Object.values(colWidthConfig);
94
+ newColWidthConfigAsArray.splice(colIdx + 1, 0, newColWidthValue);
95
+ var newColWidthConfig = newColWidthConfigAsArray
96
+ .map(function (width, i) { return ({
97
+ colId: "col_".concat(i),
98
+ width: width,
99
+ }); })
100
+ .reduce(function (a, b) {
101
+ var _a;
102
+ return (__assign(__assign({}, a), (_a = {}, _a[b.colId] = b.width, _a)));
103
+ }, {});
104
+ onChange &&
105
+ onChange(id, { data: newData, colWidthConfig: newColWidthConfig });
106
+ };
107
+ exports.handleDuplicateCol = handleDuplicateCol;
108
+ var handleInsertColAfter = function (_a) {
109
+ var value = _a.value, colIdx = _a.colIdx, onChange = _a.onChange, id = _a.id, defaultColWidth = _a.defaultColWidth;
110
+ handleAddColAtIdx({
111
+ value: value,
112
+ onChange: onChange,
113
+ id: id,
114
+ defaultColWidth: defaultColWidth,
115
+ colIdx: colIdx + 1,
116
+ });
117
+ };
118
+ exports.handleInsertColAfter = handleInsertColAfter;
119
+ var handleInsertColBefore = function (_a) {
120
+ var value = _a.value, colIdx = _a.colIdx, onChange = _a.onChange, id = _a.id, defaultColWidth = _a.defaultColWidth;
121
+ handleAddColAtIdx({
122
+ value: value,
123
+ onChange: onChange,
124
+ id: id,
125
+ defaultColWidth: defaultColWidth,
126
+ colIdx: colIdx,
127
+ });
128
+ };
129
+ exports.handleInsertColBefore = handleInsertColBefore;
@@ -1,4 +1,15 @@
1
1
  "use strict";
2
+ var __assign = (this && this.__assign) || function () {
3
+ __assign = Object.assign || function(t) {
4
+ for (var s, i = 1, n = arguments.length; i < n; i++) {
5
+ s = arguments[i];
6
+ for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p))
7
+ t[p] = s[p];
8
+ }
9
+ return t;
10
+ };
11
+ return __assign.apply(this, arguments);
12
+ };
2
13
  var __spreadArray = (this && this.__spreadArray) || function (to, from, pack) {
3
14
  if (pack || arguments.length === 2) for (var i = 0, l = from.length, ar; i < l; i++) {
4
15
  if (ar || !(i in from)) {
@@ -44,7 +55,7 @@ var handleDuplicateRow = function (_a) {
44
55
  var value = _a.value, rowIdx = _a.rowIdx, onChange = _a.onChange, id = _a.id;
45
56
  var data = value.data, colWidthConfig = value.colWidthConfig;
46
57
  var newData = __spreadArray([], data, true);
47
- var dataToDuplicate = newData[rowIdx];
58
+ var dataToDuplicate = __assign(__assign({}, newData[rowIdx]), { id: "row_".concat((0, genHash_1.genHash)(8)), cellData: newData[rowIdx].cellData.map(function (cell) { return (__assign(__assign({}, cell), { id: "cell_".concat((0, genHash_1.genHash)(8)) })); }) });
48
59
  newData.splice(rowIdx + 1, 0, dataToDuplicate);
49
60
  onChange && onChange(id, { data: newData, colWidthConfig: colWidthConfig });
50
61
  };
@@ -175,10 +175,18 @@ function SimpleTable(_a) {
175
175
  onMouseDown: function (e) {
176
176
  initColResizeState(e, { colId: "col_".concat(cellIdx) });
177
177
  }, onMouseOut: resetDragZoneIndicator, onMouseMove: hideShowDragZoneIndicator, tabIndex: 0 },
178
- !readOnly && enableColActions &&
178
+ !readOnly &&
179
+ enableColActions &&
179
180
  rowIdx === 0 &&
180
- hoveredRowAndCol.colIdx === cellIdx && react_1.default.createElement(ColActionsMenu_1.ColActionsMenu, null),
181
- !readOnly && enableRowActions &&
181
+ hoveredRowAndCol.colIdx === cellIdx && (react_1.default.createElement(ColActionsMenu_1.ColActionsMenu, __assign({}, {
182
+ value: value,
183
+ colIdx: cellIdx,
184
+ onChange: onChange,
185
+ id: id,
186
+ defaultColWidth: defaultColWidth,
187
+ }))),
188
+ !readOnly &&
189
+ enableRowActions &&
182
190
  cellIdx === 0 &&
183
191
  rowIdx !== undefined && //cuz for fixed col headers, rowIdx is undefined
184
192
  hoveredRowAndCol.rowIdx === rowIdx && (react_1.default.createElement(RowActionsMenu_1.RowActionsMenu, __assign({}, { value: value, rowIdx: rowIdx, onChange: onChange, id: id }))),
@@ -206,6 +214,8 @@ function SimpleTable(_a) {
206
214
  }),
207
215
  value.data.map(function (row, rowIdx) { return genRow({ row: row, rowIdx: rowIdx }); })),
208
216
  !readOnly && enableRowActions && (react_1.default.createElement(AddRowColButtons_1.AddRowButton, { onClick: function () { return (0, handleRowActions_1.handleAddRow)(value, props); } }))),
209
- !readOnly && enableColActions && (react_1.default.createElement(AddRowColButtons_1.AddColButton, { onClick: function () { return (0, handleColActions_1.handleAddCol)(value, props); } })))));
217
+ !readOnly && enableColActions && (react_1.default.createElement(AddRowColButtons_1.AddColButton, { onClick: function () {
218
+ return (0, handleColActions_1.handleAddCol)({ value: value, onChange: onChange, id: id, defaultColWidth: defaultColWidth });
219
+ } })))));
210
220
  }
211
221
  exports.SimpleTable = SimpleTable;
@@ -32,14 +32,15 @@ var themes_1 = require("../../themes");
32
32
  var transitions_1 = require("../../themes/mixins/transitions");
33
33
  var styled_components_1 = __importStar(require("styled-components"));
34
34
  var utilsOolib_1 = require("../../utilsOolib");
35
- exports.StyledSimpleTable = styled_components_1.default.div(templateObject_1 || (templateObject_1 = __makeTemplateObject(["\n border-top: 1px solid ", ";\n border-bottom: 1px solid ", ";\n border-left: 1px solid ", ";\n"], ["\n border-top: 1px solid ", ";\n border-bottom: 1px solid ", ";\n border-left: 1px solid ", ";\n"])), themes_1.colors.greyColor10, themes_1.colors.greyColor10, themes_1.colors.greyColor10);
36
- exports.StyledSimpleTableRow = styled_components_1.default.div(templateObject_2 || (templateObject_2 = __makeTemplateObject(["\n display: flex;\n ", ";\n background-color: ", ";\n"], ["\n display: flex;\n ", ";\n background-color: ", ";\n"])), (0, transitions_1.transition)("background-color"), function (_a) {
35
+ var globalVariables_1 = require("../../globalStyles/globalVariables");
36
+ exports.StyledSimpleTable = styled_components_1.default.div(templateObject_1 || (templateObject_1 = __makeTemplateObject(["\n border-top: 1px solid ", ";\n \n border-left: 1px solid ", ";\n"], ["\n border-top: 1px solid ", ";\n \n border-left: 1px solid ", ";\n"])), themes_1.colors.greyColor10, themes_1.colors.greyColor10);
37
+ exports.StyledSimpleTableRow = styled_components_1.default.div(templateObject_2 || (templateObject_2 = __makeTemplateObject(["\n display: flex;\n ", ";\n /* background-color: ", "; */\n"], ["\n display: flex;\n ", ";\n /* background-color: ", "; */\n"])), (0, transitions_1.transition)("background-color"), function (_a) {
37
38
  var rowIdx = _a.rowIdx;
38
39
  return rowIdx % 2 === 1 ? themes_1.colors.white : themes_1.colors.greyColor3;
39
40
  });
40
- exports.StyledSimpleTableCell = styled_components_1.default.div(templateObject_4 || (templateObject_4 = __makeTemplateObject(["\n position: relative;\n border-right: 1px solid ", ";\n ", ";\n ", "\n"], ["\n position: relative;\n border-right: 1px solid ", ";\n ", ";\n ", "\n"])), themes_1.colors.greyColor10, (0, transitions_1.transition)("background-color"), function (_a) {
41
+ exports.StyledSimpleTableCell = styled_components_1.default.div(templateObject_4 || (templateObject_4 = __makeTemplateObject(["\n position: relative;\n border-right: 1px solid ", ";\n border-bottom: 1px solid ", ";\n ", ";\n ", "\n"], ["\n position: relative;\n border-right: 1px solid ", ";\n border-bottom: 1px solid ", ";\n ", ";\n ", "\n"])), themes_1.colors.greyColor10, themes_1.colors.greyColor10, (0, transitions_1.transition)("background-color"), function (_a) {
41
42
  var readOnly = _a.readOnly, theme = _a.theme;
42
- return !readOnly && (0, styled_components_1.css)(templateObject_3 || (templateObject_3 = __makeTemplateObject(["\n :hover{\n background-color: ", ";\n }\n :focus-within{\n outline: 1px solid ", ";\n background-color: ", ";\n } \n "], ["\n :hover{\n background-color: ", ";\n }\n :focus-within{\n outline: 1px solid ", ";\n background-color: ", ";\n } \n "])), (0, utilsOolib_1.getPrimaryColor10)(theme === null || theme === void 0 ? void 0 : theme.colors), (0, utilsOolib_1.getPrimaryColor100)(theme === null || theme === void 0 ? void 0 : theme.colors), themes_1.colors.none);
43
+ return !readOnly && (0, styled_components_1.css)(templateObject_3 || (templateObject_3 = __makeTemplateObject(["\n ", ";\n /* :hover{\n background-color: ", ";\n } */\n :focus-within{\n outline: 1px solid ", ";\n background-color: ", ";\n } \n "], ["\n ", ";\n /* :hover{\n background-color: ", ";\n } */\n :focus-within{\n outline: 1px solid ", ";\n background-color: ", ";\n } \n "])), globalVariables_1.globalHoverOnWhiteBG, (0, utilsOolib_1.getPrimaryColor10)(theme === null || theme === void 0 ? void 0 : theme.colors), (0, utilsOolib_1.getPrimaryColor100)(theme === null || theme === void 0 ? void 0 : theme.colors), themes_1.colors.none);
43
44
  });
44
45
  exports.StyledSimpleTableHeader = styled_components_1.default.div(templateObject_5 || (templateObject_5 = __makeTemplateObject(["\n .public-DraftEditor-content {\n font-weight: 600;\n }\n background-color: ", ";\n border-bottom: 2px solid ", ";\n"], ["\n .public-DraftEditor-content {\n font-weight: 600;\n }\n background-color: ", ";\n border-bottom: 2px solid ", ";\n"])), themes_1.colors.greyColor, themes_1.colors.greyColor10);
45
46
  var templateObject_1, templateObject_2, templateObject_3, templateObject_4, templateObject_5;
@@ -34,6 +34,6 @@ exports.globalHoverOnWhiteBG = (0, styled_components_1.css)(templateObject_5 ||
34
34
  return invert ? themes_1.colors.white : themes_1.colors.greyColor100;
35
35
  }, function (_a) {
36
36
  var invert = _a.invert;
37
- return invert ? themes_1.colors.greyColor70 : themes_1.colors.greyColor10;
37
+ return invert ? themes_1.colors.greyColor80 : themes_1.colors.greyColor5;
38
38
  });
39
39
  var templateObject_1, templateObject_2, templateObject_3, templateObject_4, templateObject_5;
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "oolib",
3
- "version": "2.67.9",
3
+ "version": "2.68.0",
4
4
  "description": " OKE Component Library",
5
5
  "main": "dist/index.js",
6
6
  "types": "dist/index.d.ts",
@@ -60,6 +60,7 @@
60
60
  "chromatic": "^6.1.0",
61
61
  "copyfiles": "^2.4.1",
62
62
  "cz-conventional-changelog": "^3.3.0",
63
+ "localtunnel": "^2.0.2",
63
64
  "mdx-embed": "^1.0.0",
64
65
  "react": "^17.0.2",
65
66
  "react-dom": "^17.0.2",
@@ -92,7 +93,6 @@
92
93
  "draft-js": "^0.11.7",
93
94
  "draftjs-conductor": "^2.2.0",
94
95
  "immutable": "^3.7.6",
95
- "localtunnel": "^2.0.2",
96
96
  "lodash": "^4.17.21",
97
97
  "modularscale-js": "^3.0.1",
98
98
  "moment": "^2.24.0",