linear-react-components-ui 1.0.10-rc.17 → 1.0.10-rc.19
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/lib/panel/Content.js +32 -31
- package/lib/table/index.d.ts +1 -1
- package/lib/table/index.js +54 -32
- package/package.json +1 -1
package/lib/panel/Content.js
CHANGED
|
@@ -11,7 +11,12 @@ var _noPermission = _interopRequireDefault(require("../noPermission"));
|
|
|
11
11
|
function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
|
|
12
12
|
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); }
|
|
13
13
|
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; }
|
|
14
|
-
|
|
14
|
+
function _slicedToArray(arr, i) { return _arrayWithHoles(arr) || _iterableToArrayLimit(arr, i) || _unsupportedIterableToArray(arr, i) || _nonIterableRest(); }
|
|
15
|
+
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."); }
|
|
16
|
+
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(o); if (n === "Arguments" || /^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(n)) return _arrayLikeToArray(o, minLen); }
|
|
17
|
+
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; }
|
|
18
|
+
function _iterableToArrayLimit(arr, i) { var _i = null == arr ? null : "undefined" != typeof Symbol && arr[Symbol.iterator] || arr["@@iterator"]; if (null != _i) { var _s, _e, _x, _r, _arr = [], _n = !0, _d = !1; try { if (_x = (_i = _i.call(arr)).next, 0 === i) { if (Object(_i) !== _i) return; _n = !1; } else for (; !(_n = (_s = _x.call(_i)).done) && (_arr.push(_s.value), _arr.length !== i); _n = !0); } catch (err) { _d = !0, _e = err; } finally { try { if (!_n && null != _i.return && (_r = _i.return(), Object(_r) !== _r)) return; } finally { if (_d) throw _e; } } return _arr; } }
|
|
19
|
+
function _arrayWithHoles(arr) { if (Array.isArray(arr)) return arr; }
|
|
15
20
|
var PanelContent = function PanelContent(_ref) {
|
|
16
21
|
var customClass = _ref.customClass,
|
|
17
22
|
children = _ref.children,
|
|
@@ -19,46 +24,42 @@ var PanelContent = function PanelContent(_ref) {
|
|
|
19
24
|
var _useContext = (0, _react.useContext)(_helpers.default),
|
|
20
25
|
opened = _useContext.opened,
|
|
21
26
|
onEndReached = _useContext.onEndReached,
|
|
22
|
-
|
|
27
|
+
_useContext$onEndReac = _useContext.onEndReachedThreshold,
|
|
28
|
+
onEndReachedThreshold = _useContext$onEndReac === void 0 ? 0.1 : _useContext$onEndReac,
|
|
23
29
|
hideContent = _useContext.hideContent;
|
|
24
30
|
var rootElementRef = (0, _react.useRef)(null);
|
|
25
31
|
var observedElement = (0, _react.useRef)(null);
|
|
26
|
-
/* usa uma referencia ao onEndReched pra evitar novas instancias do observer */
|
|
27
|
-
var onEndReachedRef = (0, _react.useRef)(onEndReached);
|
|
28
|
-
var options = {
|
|
29
|
-
root: rootElementRef.current,
|
|
30
|
-
threshold: onEndReachedThreshold || 0
|
|
31
|
-
};
|
|
32
|
-
var scrollObserver = function scrollObserver(node) {
|
|
33
|
-
// evitar criação de multiplos observers
|
|
34
|
-
if (observer) observer.unobserve(node);
|
|
35
|
-
observer = new IntersectionObserver(function (entries) {
|
|
36
|
-
entries.forEach(function (en) {
|
|
37
|
-
if (en.intersectionRatio > 0 && onEndReachedRef.current) {
|
|
38
|
-
onEndReachedRef.current();
|
|
39
|
-
}
|
|
40
|
-
}, options);
|
|
41
|
-
});
|
|
42
|
-
observer.observe(node);
|
|
43
|
-
};
|
|
44
|
-
|
|
45
|
-
/* atualiza referencia caso a função mude */
|
|
46
|
-
(0, _react.useEffect)(function () {
|
|
47
|
-
onEndReachedRef.current = onEndReached;
|
|
48
|
-
}, [onEndReached]);
|
|
49
32
|
(0, _react.useEffect)(function () {
|
|
50
|
-
if (observedElement.current &&
|
|
51
|
-
|
|
33
|
+
if (observedElement.current && rootElementRef.current) {
|
|
34
|
+
var observer = new IntersectionObserver(function (_ref2) {
|
|
35
|
+
var _ref3 = _slicedToArray(_ref2, 1),
|
|
36
|
+
entry = _ref3[0];
|
|
37
|
+
if (entry.isIntersecting && onEndReached) {
|
|
38
|
+
onEndReached();
|
|
39
|
+
}
|
|
40
|
+
}, {
|
|
41
|
+
threshold: 0.1,
|
|
42
|
+
root: rootElementRef.current,
|
|
43
|
+
rootMargin: '15px'
|
|
44
|
+
});
|
|
45
|
+
observer.observe(observedElement.current);
|
|
46
|
+
return function () {
|
|
47
|
+
observer.disconnect();
|
|
48
|
+
};
|
|
52
49
|
}
|
|
53
|
-
|
|
50
|
+
return function () {};
|
|
51
|
+
}, [onEndReached, onEndReachedThreshold, rootElementRef.current, observedElement.current]);
|
|
54
52
|
if (!opened) return null;
|
|
55
53
|
return hideContent ? /*#__PURE__*/_react.default.createElement(_noPermission.default, null) : /*#__PURE__*/_react.default.createElement("div", {
|
|
56
54
|
ref: rootElementRef,
|
|
57
55
|
className: "panel-content ".concat(customClass),
|
|
58
56
|
style: style
|
|
59
|
-
}, opened && children, onEndReached
|
|
60
|
-
ref: observedElement
|
|
61
|
-
|
|
57
|
+
}, opened && children, onEndReached && /*#__PURE__*/_react.default.createElement("div", {
|
|
58
|
+
ref: observedElement,
|
|
59
|
+
style: {
|
|
60
|
+
height: '10px'
|
|
61
|
+
}
|
|
62
|
+
}));
|
|
62
63
|
};
|
|
63
64
|
var _default = PanelContent;
|
|
64
65
|
exports.default = _default;
|
package/lib/table/index.d.ts
CHANGED
|
@@ -6,6 +6,6 @@ export { default as Td } from './RowColumn.js';
|
|
|
6
6
|
import { ITableProps } from './types.js';
|
|
7
7
|
import 'react';
|
|
8
8
|
|
|
9
|
-
declare const Table: (props: ITableProps) => JSX.Element;
|
|
9
|
+
declare const Table: ({ children, ...props }: ITableProps) => JSX.Element;
|
|
10
10
|
|
|
11
11
|
export { Table as default };
|
package/lib/table/index.js
CHANGED
|
@@ -44,20 +44,20 @@ var _HeaderColumn = _interopRequireDefault(require("./HeaderColumn"));
|
|
|
44
44
|
var _RowColumn = _interopRequireDefault(require("./RowColumn"));
|
|
45
45
|
require("../assets/styles/table.scss");
|
|
46
46
|
var _helpers = _interopRequireDefault(require("./helpers"));
|
|
47
|
+
var _excluded = ["children"],
|
|
48
|
+
_excluded2 = ["onColClick", "onRowClick", "bodyScrollable", "vertical", "skeletonize", "strict", "skeletonHeight", "skeletonInHeader", "skeletonInRows", "customClass", "bordered", "hovered", "headerColored", "condensed", "selectedRowId"];
|
|
47
49
|
function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
|
|
48
50
|
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); }
|
|
49
51
|
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; }
|
|
50
|
-
function
|
|
51
|
-
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) { _defineProperty(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; }
|
|
52
|
-
function _defineProperty(obj, key, value) { key = _toPropertyKey(key); if (key in obj) { Object.defineProperty(obj, key, { value: value, enumerable: true, configurable: true, writable: true }); } else { obj[key] = value; } return obj; }
|
|
53
|
-
function _toPropertyKey(arg) { var key = _toPrimitive(arg, "string"); return _typeof(key) === "symbol" ? key : String(key); }
|
|
54
|
-
function _toPrimitive(input, hint) { if (_typeof(input) !== "object" || input === null) return input; var prim = input[Symbol.toPrimitive]; if (prim !== undefined) { var res = prim.call(input, hint || "default"); if (_typeof(res) !== "object") return res; throw new TypeError("@@toPrimitive must return a primitive value."); } return (hint === "string" ? String : Number)(input); }
|
|
52
|
+
function _extends() { _extends = Object.assign ? Object.assign.bind() : 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); }
|
|
55
53
|
function _slicedToArray(arr, i) { return _arrayWithHoles(arr) || _iterableToArrayLimit(arr, i) || _unsupportedIterableToArray(arr, i) || _nonIterableRest(); }
|
|
56
54
|
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."); }
|
|
57
55
|
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(o); if (n === "Arguments" || /^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(n)) return _arrayLikeToArray(o, minLen); }
|
|
58
56
|
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; }
|
|
59
57
|
function _iterableToArrayLimit(arr, i) { var _i = null == arr ? null : "undefined" != typeof Symbol && arr[Symbol.iterator] || arr["@@iterator"]; if (null != _i) { var _s, _e, _x, _r, _arr = [], _n = !0, _d = !1; try { if (_x = (_i = _i.call(arr)).next, 0 === i) { if (Object(_i) !== _i) return; _n = !1; } else for (; !(_n = (_s = _x.call(_i)).done) && (_arr.push(_s.value), _arr.length !== i); _n = !0); } catch (err) { _d = !0, _e = err; } finally { try { if (!_n && null != _i.return && (_r = _i.return(), Object(_r) !== _r)) return; } finally { if (_d) throw _e; } } return _arr; } }
|
|
60
58
|
function _arrayWithHoles(arr) { if (Array.isArray(arr)) return arr; }
|
|
59
|
+
function _objectWithoutProperties(source, excluded) { if (source == null) return {}; var target = _objectWithoutPropertiesLoose(source, excluded); var key, i; if (Object.getOwnPropertySymbols) { var sourceSymbolKeys = Object.getOwnPropertySymbols(source); for (i = 0; i < sourceSymbolKeys.length; i++) { key = sourceSymbolKeys[i]; if (excluded.indexOf(key) >= 0) continue; if (!Object.prototype.propertyIsEnumerable.call(source, key)) continue; target[key] = source[key]; } } return target; }
|
|
60
|
+
function _objectWithoutPropertiesLoose(source, excluded) { if (source == null) return {}; var target = {}; var sourceKeys = Object.keys(source); var key, i; for (i = 0; i < sourceKeys.length; i++) { key = sourceKeys[i]; if (excluded.indexOf(key) >= 0) continue; target[key] = source[key]; } return target; }
|
|
61
61
|
// TODO - Precisa finalizar o scroll no corpo da tabela.
|
|
62
62
|
var getClass = function getClass(_ref) {
|
|
63
63
|
var customClass = _ref.customClass,
|
|
@@ -73,15 +73,26 @@ var getClass = function getClass(_ref) {
|
|
|
73
73
|
skeletonInRows = _ref$skeletonInRows === void 0 ? 10 : _ref$skeletonInRows;
|
|
74
74
|
return "table-component ".concat(customClass, " ").concat(striped && '-striped', " \n ").concat(bordered && '-bordered', " ").concat(hovered && '-hovered', " ").concat(headerColored && '-headercolor', "\n ").concat(condensed && '-condensed', "\n ").concat(vertical && '-vertical', "\n ").concat(skeletonize && !skeletonInRows ? '-skeletonized' : '', "\n ").concat(bodyScrollable ? '-scrollable' : '');
|
|
75
75
|
};
|
|
76
|
-
var Table = function Table(
|
|
76
|
+
var Table = function Table(_ref2) {
|
|
77
|
+
var children = _ref2.children,
|
|
78
|
+
props = _objectWithoutProperties(_ref2, _excluded);
|
|
77
79
|
var onColClick = props.onColClick,
|
|
78
80
|
onRowClick = props.onRowClick,
|
|
79
81
|
bodyScrollable = props.bodyScrollable,
|
|
80
|
-
children = props.children,
|
|
81
82
|
vertical = props.vertical,
|
|
82
83
|
skeletonize = props.skeletonize,
|
|
83
|
-
strict = props.strict
|
|
84
|
-
|
|
84
|
+
strict = props.strict,
|
|
85
|
+
skeletonHeight = props.skeletonHeight,
|
|
86
|
+
skeletonInHeader = props.skeletonInHeader,
|
|
87
|
+
skeletonInRows = props.skeletonInRows,
|
|
88
|
+
customClass = props.customClass,
|
|
89
|
+
bordered = props.bordered,
|
|
90
|
+
hovered = props.hovered,
|
|
91
|
+
headerColored = props.headerColored,
|
|
92
|
+
condensed = props.condensed,
|
|
93
|
+
selectedRowIdFromProps = props.selectedRowId,
|
|
94
|
+
rest = _objectWithoutProperties(props, _excluded2);
|
|
95
|
+
var _useState = (0, _react.useState)(selectedRowIdFromProps),
|
|
85
96
|
_useState2 = _slicedToArray(_useState, 2),
|
|
86
97
|
selectedRowId = _useState2[0],
|
|
87
98
|
setSelectedRowId = _useState2[1];
|
|
@@ -98,6 +109,38 @@ var Table = function Table(props) {
|
|
|
98
109
|
columnsCount = _useState8[0],
|
|
99
110
|
setColumnsCount = _useState8[1];
|
|
100
111
|
var bodyContainerRef = (0, _react.useRef)(null);
|
|
112
|
+
var handleSelectRow = (0, _react.useCallback)(function (selectedId) {
|
|
113
|
+
setSelectedRowId(selectedId);
|
|
114
|
+
}, []);
|
|
115
|
+
var handlerSetColumnsWidth = (0, _react.useCallback)(function (widths) {
|
|
116
|
+
if (!_lodash.default.isEmpty(widths) && _lodash.default.isEmpty(columnsWidth)) setColumnsWidth(widths);
|
|
117
|
+
}, [columnsWidth]);
|
|
118
|
+
var handlerSetColumnsCount = (0, _react.useCallback)(function (count) {
|
|
119
|
+
return setColumnsCount(count);
|
|
120
|
+
}, []);
|
|
121
|
+
var getContextValues = (0, _react.useCallback)(function () {
|
|
122
|
+
return {
|
|
123
|
+
bodyContainerRef: bodyContainerRef,
|
|
124
|
+
bodyScrollWidth: bodyScrollWidth,
|
|
125
|
+
selectedRowId: selectedRowId,
|
|
126
|
+
vertical: vertical,
|
|
127
|
+
skeletonize: skeletonize,
|
|
128
|
+
skeletonHeight: skeletonHeight,
|
|
129
|
+
skeletonInHeader: skeletonInHeader,
|
|
130
|
+
skeletonInRows: skeletonInRows,
|
|
131
|
+
strict: strict,
|
|
132
|
+
columnsCount: columnsCount,
|
|
133
|
+
handleSelectRow: handleSelectRow,
|
|
134
|
+
handleTableColClick: onColClick,
|
|
135
|
+
handleTableRowClick: onRowClick,
|
|
136
|
+
handlerSetColumnsWidth: handlerSetColumnsWidth,
|
|
137
|
+
columnsWidth: columnsWidth,
|
|
138
|
+
handlerSetColumnsCount: handlerSetColumnsCount
|
|
139
|
+
};
|
|
140
|
+
}, [bodyContainerRef, bodyScrollWidth, selectedRowId, vertical, skeletonHeight, skeletonHeight, skeletonInHeader, skeletonInRows, strict, columnsCount, handleSelectRow, onColClick, onRowClick, handlerSetColumnsWidth, columnsWidth, handlerSetColumnsCount]);
|
|
141
|
+
var contextValues = (0, _react.useMemo)(function () {
|
|
142
|
+
return getContextValues();
|
|
143
|
+
}, [getContextValues]);
|
|
101
144
|
(0, _react.useEffect)(function () {
|
|
102
145
|
if (bodyScrollable && bodyContainerRef && bodyContainerRef.current) {
|
|
103
146
|
var _bodyContainerRef$cur = bodyContainerRef.current,
|
|
@@ -110,37 +153,16 @@ var Table = function Table(props) {
|
|
|
110
153
|
(0, _react.useEffect)(function () {
|
|
111
154
|
setSelectedRowId(props.selectedRowId);
|
|
112
155
|
}, [props.selectedRowId]);
|
|
113
|
-
var contextValues = _objectSpread(_objectSpread({}, props), {}, {
|
|
114
|
-
bodyContainerRef: bodyContainerRef,
|
|
115
|
-
bodyScrollWidth: bodyScrollWidth,
|
|
116
|
-
selectedRowId: selectedRowId,
|
|
117
|
-
vertical: vertical,
|
|
118
|
-
skeletonize: skeletonize,
|
|
119
|
-
strict: strict,
|
|
120
|
-
columnsCount: columnsCount,
|
|
121
|
-
handleSelectRow: function handleSelectRow(selectedId) {
|
|
122
|
-
setSelectedRowId(selectedId);
|
|
123
|
-
},
|
|
124
|
-
handleTableColClick: onColClick,
|
|
125
|
-
handleTableRowClick: onRowClick,
|
|
126
|
-
handlerSetColumnsWidth: function handlerSetColumnsWidth(widths) {
|
|
127
|
-
if (!_lodash.default.isEmpty(widths) && _lodash.default.isEmpty(columnsWidth)) setColumnsWidth(widths);
|
|
128
|
-
},
|
|
129
|
-
columnsWidth: columnsWidth,
|
|
130
|
-
handlerSetColumnsCount: function handlerSetColumnsCount(count) {
|
|
131
|
-
return setColumnsCount(count);
|
|
132
|
-
}
|
|
133
|
-
});
|
|
134
156
|
return /*#__PURE__*/_react.default.createElement(_helpers.default.Provider, {
|
|
135
157
|
value: contextValues
|
|
136
158
|
}, bodyScrollable ? /*#__PURE__*/_react.default.createElement("div", {
|
|
137
159
|
className: getClass(props)
|
|
138
|
-
}, children) : /*#__PURE__*/_react.default.createElement("table", {
|
|
160
|
+
}, children) : /*#__PURE__*/_react.default.createElement("table", _extends({
|
|
139
161
|
style: {
|
|
140
162
|
contain: strict ? 'strict' : 'size style'
|
|
141
163
|
},
|
|
142
164
|
className: getClass(props)
|
|
143
|
-
}, children));
|
|
165
|
+
}, rest), children));
|
|
144
166
|
};
|
|
145
167
|
var _default = Table;
|
|
146
168
|
exports.default = _default;
|