linear-react-components-ui 1.0.18-beta.2 → 1.0.18-beta.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/lib/assets/styles/checkbox.scss +8 -0
- package/lib/assets/styles/file.scss +1 -9
- package/lib/checkbox/index.d.ts +1 -1
- package/lib/checkbox/index.js +27 -25
- package/lib/checkbox/types.d.ts +1 -0
- package/lib/inputs/base/types.d.ts +1 -1
- package/lib/inputs/file/DefaultFile.js +36 -29
- package/lib/inputs/file/File.d.ts +1 -1
- package/lib/inputs/file/File.js +1 -3
- package/lib/inputs/file/FileButtonSettings.js +1 -0
- package/lib/inputs/select/simple/index.js +1 -0
- package/package.json +1 -1
- package/lib/tabs/DropdownTabs.js +0 -75
- package/lib/tabs/MenuTabs.js +0 -89
- package/lib/tabs/context.js +0 -161
- package/lib/tabs/useTabs.js +0 -11
|
@@ -164,14 +164,6 @@
|
|
|
164
164
|
}
|
|
165
165
|
|
|
166
166
|
.input-simple-file-container {
|
|
167
|
-
.file-content {
|
|
168
|
-
flex: 1;
|
|
169
|
-
}
|
|
170
|
-
|
|
171
|
-
.file-wrapper {
|
|
172
|
-
align-items: center;
|
|
173
|
-
}
|
|
174
|
-
|
|
175
167
|
.-disabledVisualApply {
|
|
176
168
|
background: #fff5e5 !important;
|
|
177
169
|
> .size-position-icon {
|
|
@@ -229,4 +221,4 @@
|
|
|
229
221
|
box-shadow: none;
|
|
230
222
|
border-color: transparent !important;
|
|
231
223
|
transition: none;
|
|
232
|
-
}
|
|
224
|
+
}
|
package/lib/checkbox/index.d.ts
CHANGED
|
@@ -8,6 +8,6 @@ import '../@types/Position.js';
|
|
|
8
8
|
* o componente Field dentro do componente Form, pois o mesmo leva em consideração o tipo do
|
|
9
9
|
* componente para gerar propriedades customizadas.
|
|
10
10
|
*/
|
|
11
|
-
declare const CheckBox: (
|
|
11
|
+
declare const CheckBox: (props: ICheckBoxProps) => JSX.Element | null;
|
|
12
12
|
|
|
13
13
|
export { CheckBox as default };
|
package/lib/checkbox/index.js
CHANGED
|
@@ -8,9 +8,10 @@ exports.default = void 0;
|
|
|
8
8
|
var _react = _interopRequireWildcard(require("react"));
|
|
9
9
|
var _gridlayout = _interopRequireDefault(require("../gridlayout"));
|
|
10
10
|
var _Label = _interopRequireDefault(require("./Label"));
|
|
11
|
-
require("../assets/styles/checkbox.scss");
|
|
12
|
-
var _permissionValidations = require("../permissionValidations");
|
|
13
11
|
var _hint = _interopRequireDefault(require("../hint"));
|
|
12
|
+
var helpers = _interopRequireWildcard(require("../inputs/base/helpers"));
|
|
13
|
+
var _permissionValidations = require("../permissionValidations");
|
|
14
|
+
require("../assets/styles/checkbox.scss");
|
|
14
15
|
function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
|
|
15
16
|
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); }
|
|
16
17
|
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; }
|
|
@@ -27,28 +28,29 @@ function _arrayWithHoles(arr) { if (Array.isArray(arr)) return arr; }
|
|
|
27
28
|
* componente para gerar propriedades customizadas.
|
|
28
29
|
*/
|
|
29
30
|
|
|
30
|
-
var CheckBox = function CheckBox(
|
|
31
|
-
var name =
|
|
32
|
-
required =
|
|
33
|
-
value =
|
|
34
|
-
label =
|
|
35
|
-
onChange =
|
|
36
|
-
autofocus =
|
|
37
|
-
hint =
|
|
38
|
-
|
|
39
|
-
id =
|
|
40
|
-
gridLayout =
|
|
41
|
-
|
|
42
|
-
checked =
|
|
43
|
-
disabled =
|
|
44
|
-
permissionAttr =
|
|
45
|
-
tooltip =
|
|
46
|
-
|
|
47
|
-
tooltipPosition =
|
|
48
|
-
|
|
49
|
-
tooltipWidth =
|
|
50
|
-
skeletonize =
|
|
51
|
-
targetRef =
|
|
31
|
+
var CheckBox = function CheckBox(props) {
|
|
32
|
+
var name = props.name,
|
|
33
|
+
required = props.required,
|
|
34
|
+
value = props.value,
|
|
35
|
+
label = props.label,
|
|
36
|
+
onChange = props.onChange,
|
|
37
|
+
autofocus = props.autofocus,
|
|
38
|
+
hint = props.hint,
|
|
39
|
+
_props$id = props.id,
|
|
40
|
+
id = _props$id === void 0 ? '' : _props$id,
|
|
41
|
+
gridLayout = props.gridLayout,
|
|
42
|
+
_props$checked = props.checked,
|
|
43
|
+
checked = _props$checked === void 0 ? false : _props$checked,
|
|
44
|
+
disabled = props.disabled,
|
|
45
|
+
permissionAttr = props.permissionAttr,
|
|
46
|
+
tooltip = props.tooltip,
|
|
47
|
+
_props$tooltipPositio = props.tooltipPosition,
|
|
48
|
+
tooltipPosition = _props$tooltipPositio === void 0 ? 'top' : _props$tooltipPositio,
|
|
49
|
+
_props$tooltipWidth = props.tooltipWidth,
|
|
50
|
+
tooltipWidth = _props$tooltipWidth === void 0 ? 'auto' : _props$tooltipWidth,
|
|
51
|
+
skeletonize = props.skeletonize,
|
|
52
|
+
targetRef = props.targetRef,
|
|
53
|
+
errorMessages = props.errorMessages;
|
|
52
54
|
var _useState = (0, _react.useState)(checked),
|
|
53
55
|
_useState2 = _slicedToArray(_useState, 2),
|
|
54
56
|
isChecked = _useState2[0],
|
|
@@ -120,7 +122,7 @@ var CheckBox = function CheckBox(_ref) {
|
|
|
120
122
|
visible: !!hint,
|
|
121
123
|
description: hint,
|
|
122
124
|
customClass: "hint"
|
|
123
|
-
}));
|
|
125
|
+
}), errorMessages && helpers.getErrorMessages(errorMessages));
|
|
124
126
|
};
|
|
125
127
|
if (onDenied.unvisible) return null;
|
|
126
128
|
return gridLayout ? /*#__PURE__*/_react.default.createElement(_gridlayout.default, {
|
package/lib/checkbox/types.d.ts
CHANGED
|
@@ -48,7 +48,7 @@ interface IBaseProps {
|
|
|
48
48
|
onDragLeave?: (e: DragEvent) => void;
|
|
49
49
|
leftElements?: JSX.Element | JSX.Element[];
|
|
50
50
|
rightElements?: JSX.Element | JSX.Element[];
|
|
51
|
-
children?:
|
|
51
|
+
children?: JSX.Element | JSX.Element[];
|
|
52
52
|
customClass?: string;
|
|
53
53
|
customClassForWrapper?: string;
|
|
54
54
|
customClassForInputContent?: string;
|
|
@@ -13,6 +13,7 @@ require("../../assets/styles/file.scss");
|
|
|
13
13
|
var _buttons = _interopRequireDefault(require("../../buttons"));
|
|
14
14
|
var _icons = _interopRequireDefault(require("../../icons"));
|
|
15
15
|
var _popover = _interopRequireWildcard(require("../../popover"));
|
|
16
|
+
var helperBase = _interopRequireWildcard(require("../base/helpers"));
|
|
16
17
|
function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
|
|
17
18
|
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); }
|
|
18
19
|
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; }
|
|
@@ -34,8 +35,9 @@ var DefaultFile = function DefaultFile(props) {
|
|
|
34
35
|
defaultFiles = props.defaultFiles,
|
|
35
36
|
_props$hint = props.hint,
|
|
36
37
|
hint = _props$hint === void 0 ? [] : _props$hint,
|
|
37
|
-
|
|
38
|
-
|
|
38
|
+
_props$errorMessages = props.errorMessages,
|
|
39
|
+
errorMessages = _props$errorMessages === void 0 ? [] : _props$errorMessages,
|
|
40
|
+
onChange = props.onChange;
|
|
39
41
|
var getFilesList = function getFilesList(files) {
|
|
40
42
|
return !(files !== null && files !== void 0 && files.length) ? [] : _lodash.default.map(files, function (file) {
|
|
41
43
|
return file;
|
|
@@ -46,6 +48,36 @@ var DefaultFile = function DefaultFile(props) {
|
|
|
46
48
|
fileList = _useState2[0],
|
|
47
49
|
setFileList = _useState2[1];
|
|
48
50
|
var ifExistFiles = fileList instanceof Array && fileList.length > 0;
|
|
51
|
+
var popUpDescription = function popUpDescription() {
|
|
52
|
+
return /*#__PURE__*/_react.default.createElement("div", {
|
|
53
|
+
className: "size-position-icon ".concat(!ifExistFiles ? '-disabled-popover' : '')
|
|
54
|
+
}, /*#__PURE__*/_react.default.createElement(_popover.default, {
|
|
55
|
+
iconSize: 16
|
|
56
|
+
}, /*#__PURE__*/_react.default.createElement(_popover.PopoverText, null, /*#__PURE__*/_react.default.createElement("strong", null, "Arquivos"), /*#__PURE__*/_react.default.createElement("br", null), ifExistFiles && fileList.map(function (file) {
|
|
57
|
+
return /*#__PURE__*/_react.default.createElement("div", {
|
|
58
|
+
className: "list-simple-file",
|
|
59
|
+
key: "".concat(file.name).concat(file.size)
|
|
60
|
+
}, /*#__PURE__*/_react.default.createElement("div", {
|
|
61
|
+
className: "file-name"
|
|
62
|
+
}, /*#__PURE__*/_react.default.createElement("span", null, file.name)));
|
|
63
|
+
}))));
|
|
64
|
+
};
|
|
65
|
+
var buttonRemoveFile = function buttonRemoveFile() {
|
|
66
|
+
return /*#__PURE__*/_react.default.createElement(_buttons.default, {
|
|
67
|
+
disabled: !ifExistFiles,
|
|
68
|
+
className: "-pointerEventsRemove",
|
|
69
|
+
transparent: true,
|
|
70
|
+
boxShadow: false,
|
|
71
|
+
onClick: function onClick() {
|
|
72
|
+
onBtnClickRemove();
|
|
73
|
+
setFileList([]);
|
|
74
|
+
},
|
|
75
|
+
icon: /*#__PURE__*/_react.default.createElement(_icons.default, {
|
|
76
|
+
customClass: "colorIconUpload",
|
|
77
|
+
name: "close"
|
|
78
|
+
})
|
|
79
|
+
});
|
|
80
|
+
};
|
|
49
81
|
var handleChange = function handleChange(e) {
|
|
50
82
|
var _e$preventDefault;
|
|
51
83
|
(_e$preventDefault = e.preventDefault) === null || _e$preventDefault === void 0 ? void 0 : _e$preventDefault.call(e);
|
|
@@ -58,8 +90,7 @@ var DefaultFile = function DefaultFile(props) {
|
|
|
58
90
|
}, /*#__PURE__*/_react.default.createElement(_InputTextBase.default, _extends({}, props, {
|
|
59
91
|
hint: hint,
|
|
60
92
|
readOnlyClass: "-disabledVisualApply",
|
|
61
|
-
|
|
62
|
-
customClassForInputContent: "file-content -absolute -pointEventDisabled -disabledVisualApply",
|
|
93
|
+
customClassForInputContent: "-absolute -pointEventDisabled -disabledVisualApply",
|
|
63
94
|
type: "file",
|
|
64
95
|
id: id,
|
|
65
96
|
accept: accept,
|
|
@@ -71,31 +102,7 @@ var DefaultFile = function DefaultFile(props) {
|
|
|
71
102
|
return _onBtnClickInsert();
|
|
72
103
|
}
|
|
73
104
|
})
|
|
74
|
-
}),
|
|
75
|
-
className: "size-position-icon ".concat(!ifExistFiles ? '-disabled-popover' : '')
|
|
76
|
-
}, /*#__PURE__*/_react.default.createElement(_popover.default, {
|
|
77
|
-
iconSize: 16
|
|
78
|
-
}, /*#__PURE__*/_react.default.createElement(_popover.PopoverText, null, /*#__PURE__*/_react.default.createElement("strong", null, "Arquivos"), /*#__PURE__*/_react.default.createElement("br", null), ifExistFiles && fileList.map(function (file) {
|
|
79
|
-
return /*#__PURE__*/_react.default.createElement("div", {
|
|
80
|
-
className: "list-simple-file",
|
|
81
|
-
key: "".concat(file.name).concat(file.size)
|
|
82
|
-
}, /*#__PURE__*/_react.default.createElement("div", {
|
|
83
|
-
className: "file-name"
|
|
84
|
-
}, /*#__PURE__*/_react.default.createElement("span", null, file.name)));
|
|
85
|
-
})))), /*#__PURE__*/_react.default.createElement(_buttons.default, {
|
|
86
|
-
disabled: !ifExistFiles,
|
|
87
|
-
className: "-pointerEventsRemove",
|
|
88
|
-
transparent: true,
|
|
89
|
-
boxShadow: false,
|
|
90
|
-
onClick: function onClick() {
|
|
91
|
-
onBtnClickRemove();
|
|
92
|
-
setFileList([]);
|
|
93
|
-
},
|
|
94
|
-
icon: /*#__PURE__*/_react.default.createElement(_icons.default, {
|
|
95
|
-
customClass: "colorIconUpload",
|
|
96
|
-
name: "close"
|
|
97
|
-
})
|
|
98
|
-
})));
|
|
105
|
+
}), popUpDescription(), buttonRemoveFile()), errorMessages && helperBase.getErrorMessages(errorMessages));
|
|
99
106
|
};
|
|
100
107
|
var _default = DefaultFile;
|
|
101
108
|
exports.default = _default;
|
|
@@ -6,6 +6,6 @@ import '../../@types/Align.js';
|
|
|
6
6
|
import '../../@types/Period.js';
|
|
7
7
|
import '../../@types/PermissionAttr.js';
|
|
8
8
|
|
|
9
|
-
declare const File: ({ applyDragDrop, defaultFiles, gridLayout,
|
|
9
|
+
declare const File: ({ applyDragDrop, defaultFiles, gridLayout, ...rest }: IFileProps) => JSX.Element;
|
|
10
10
|
|
|
11
11
|
export { File as default };
|
package/lib/inputs/file/File.js
CHANGED
|
@@ -10,7 +10,7 @@ var _DefaultFile = _interopRequireDefault(require("./DefaultFile"));
|
|
|
10
10
|
var _DragDropFile = _interopRequireDefault(require("./DragDropFile"));
|
|
11
11
|
var _gridlayout = _interopRequireDefault(require("../../gridlayout"));
|
|
12
12
|
var _helpers = require("./helpers");
|
|
13
|
-
var _excluded = ["applyDragDrop", "defaultFiles", "gridLayout"
|
|
13
|
+
var _excluded = ["applyDragDrop", "defaultFiles", "gridLayout"];
|
|
14
14
|
function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
|
|
15
15
|
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); }
|
|
16
16
|
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; }
|
|
@@ -22,7 +22,6 @@ var File = function File(_ref) {
|
|
|
22
22
|
applyDragDrop = _ref$applyDragDrop === void 0 ? false : _ref$applyDragDrop,
|
|
23
23
|
defaultFiles = _ref.defaultFiles,
|
|
24
24
|
gridLayout = _ref.gridLayout,
|
|
25
|
-
onBtnClickRemoveProp = _ref.onBtnClickRemove,
|
|
26
25
|
rest = _objectWithoutProperties(_ref, _excluded);
|
|
27
26
|
var inputFileRef = (0, _react.useRef)(null);
|
|
28
27
|
var _onBtnClickInsert = function onBtnClickInsert() {
|
|
@@ -33,7 +32,6 @@ var File = function File(_ref) {
|
|
|
33
32
|
var _onBtnClickRemove = function onBtnClickRemove() {
|
|
34
33
|
if (inputFileRef.current) {
|
|
35
34
|
inputFileRef.current.value = '';
|
|
36
|
-
if (onBtnClickRemoveProp) onBtnClickRemoveProp();
|
|
37
35
|
}
|
|
38
36
|
};
|
|
39
37
|
(0, _react.useEffect)(function () {
|
|
@@ -16,6 +16,7 @@ var FileButtonSettings = function FileButtonSettings(props) {
|
|
|
16
16
|
id = props.id,
|
|
17
17
|
onBtnClickInsert = props.onBtnClickInsert;
|
|
18
18
|
return /*#__PURE__*/_react.default.createElement("label", {
|
|
19
|
+
id: "",
|
|
19
20
|
htmlFor: id
|
|
20
21
|
}, /*#__PURE__*/_react.default.createElement(_buttons.default, {
|
|
21
22
|
className: "uploadButton simple-search-file-button -shadowsdisabled -transparent",
|
package/package.json
CHANGED
package/lib/tabs/DropdownTabs.js
DELETED
|
@@ -1,75 +0,0 @@
|
|
|
1
|
-
"use strict";
|
|
2
|
-
|
|
3
|
-
function _typeof(o) { "@babel/helpers - typeof"; return _typeof = "function" == typeof Symbol && "symbol" == typeof Symbol.iterator ? function (o) { return typeof o; } : function (o) { return o && "function" == typeof Symbol && o.constructor === Symbol && o !== Symbol.prototype ? "symbol" : typeof o; }, _typeof(o); }
|
|
4
|
-
Object.defineProperty(exports, "__esModule", {
|
|
5
|
-
value: true
|
|
6
|
-
});
|
|
7
|
-
exports["default"] = void 0;
|
|
8
|
-
var _react = _interopRequireDefault(require("react"));
|
|
9
|
-
var _buttons = _interopRequireDefault(require("../buttons"));
|
|
10
|
-
var _list = _interopRequireWildcard(require("../list"));
|
|
11
|
-
var _useTabs2 = require("./useTabs");
|
|
12
|
-
function _getRequireWildcardCache(e) { if ("function" != typeof WeakMap) return null; var r = new WeakMap(), t = new WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(e) { return e ? t : r; })(e); }
|
|
13
|
-
function _interopRequireWildcard(e, r) { if (!r && e && e.__esModule) return e; if (null === e || "object" != _typeof(e) && "function" != typeof e) return { "default": e }; var t = _getRequireWildcardCache(r); if (t && t.has(e)) return t.get(e); var n = { __proto__: null }, a = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var u in e) if ("default" !== u && Object.prototype.hasOwnProperty.call(e, u)) { var i = a ? Object.getOwnPropertyDescriptor(e, u) : null; i && (i.get || i.set) ? Object.defineProperty(n, u, i) : n[u] = e[u]; } return n["default"] = e, t && t.set(e, n), n; }
|
|
14
|
-
function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { "default": obj }; }
|
|
15
|
-
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); }
|
|
16
|
-
var DropdownTab = function DropdownTab(_ref) {
|
|
17
|
-
var id = _ref.id,
|
|
18
|
-
title = _ref.title,
|
|
19
|
-
closeable = _ref.closeable,
|
|
20
|
-
iconAlign = _ref.iconAlign,
|
|
21
|
-
icon = _ref.icon,
|
|
22
|
-
iconName = _ref.iconName,
|
|
23
|
-
disabled = _ref.disabled,
|
|
24
|
-
tabMenuSize = _ref.tabMenuSize;
|
|
25
|
-
var _useTabs = (0, _useTabs2.useTabs)(),
|
|
26
|
-
selectTab = _useTabs.selectTab,
|
|
27
|
-
removeTab = _useTabs.removeTab;
|
|
28
|
-
return /*#__PURE__*/_react["default"].createElement(_list.ListItem, {
|
|
29
|
-
key: id
|
|
30
|
-
}, /*#__PURE__*/_react["default"].createElement("div", {
|
|
31
|
-
className: "menuitem"
|
|
32
|
-
}, /*#__PURE__*/_react["default"].createElement(_buttons["default"], {
|
|
33
|
-
className: "btn menubutton",
|
|
34
|
-
boxShadow: false,
|
|
35
|
-
onClick: function onClick() {
|
|
36
|
-
return selectTab(id);
|
|
37
|
-
},
|
|
38
|
-
iconAlign: iconAlign,
|
|
39
|
-
iconName: iconName,
|
|
40
|
-
icon: icon,
|
|
41
|
-
disabled: disabled,
|
|
42
|
-
label: title,
|
|
43
|
-
size: tabMenuSize,
|
|
44
|
-
transparent: true
|
|
45
|
-
}), closeable && /*#__PURE__*/_react["default"].createElement("button", {
|
|
46
|
-
className: "closepanel",
|
|
47
|
-
onClick: function onClick() {
|
|
48
|
-
return removeTab(id);
|
|
49
|
-
}
|
|
50
|
-
})));
|
|
51
|
-
};
|
|
52
|
-
var DropdownTabs = function DropdownTabs(_ref2) {
|
|
53
|
-
var _ref2$tabs = _ref2.tabs,
|
|
54
|
-
tabs = _ref2$tabs === void 0 ? [] : _ref2$tabs,
|
|
55
|
-
_ref2$tabMenuSize = _ref2.tabMenuSize,
|
|
56
|
-
tabMenuSize = _ref2$tabMenuSize === void 0 ? 'medium' : _ref2$tabMenuSize;
|
|
57
|
-
var hasTabs = tabs.length > 0;
|
|
58
|
-
if (tabs.length === 0) return null;
|
|
59
|
-
return /*#__PURE__*/_react["default"].createElement(_buttons["default"], {
|
|
60
|
-
dropdown: true,
|
|
61
|
-
dropdownAlign: "right",
|
|
62
|
-
transparent: true,
|
|
63
|
-
boxShadow: false,
|
|
64
|
-
size: "large",
|
|
65
|
-
customClass: "dropdownbutton ".concat(hasTabs ? 'show' : '')
|
|
66
|
-
}, /*#__PURE__*/_react["default"].createElement(_list["default"], {
|
|
67
|
-
customClass: "dropdown-hide-tabs"
|
|
68
|
-
}, tabs.map(function (tab) {
|
|
69
|
-
return /*#__PURE__*/_react["default"].createElement(DropdownTab, _extends({
|
|
70
|
-
key: tab.id,
|
|
71
|
-
tabMenuSize: tabMenuSize
|
|
72
|
-
}, tab));
|
|
73
|
-
})));
|
|
74
|
-
};
|
|
75
|
-
var _default = exports["default"] = DropdownTabs;
|
package/lib/tabs/MenuTabs.js
DELETED
|
@@ -1,89 +0,0 @@
|
|
|
1
|
-
"use strict";
|
|
2
|
-
|
|
3
|
-
function _typeof(o) { "@babel/helpers - typeof"; return _typeof = "function" == typeof Symbol && "symbol" == typeof Symbol.iterator ? function (o) { return typeof o; } : function (o) { return o && "function" == typeof Symbol && o.constructor === Symbol && o !== Symbol.prototype ? "symbol" : typeof o; }, _typeof(o); }
|
|
4
|
-
Object.defineProperty(exports, "__esModule", {
|
|
5
|
-
value: true
|
|
6
|
-
});
|
|
7
|
-
exports["default"] = void 0;
|
|
8
|
-
var _react = _interopRequireDefault(require("react"));
|
|
9
|
-
var _buttons = _interopRequireDefault(require("../buttons"));
|
|
10
|
-
var helpers = _interopRequireWildcard(require("./tabHelpers"));
|
|
11
|
-
var _permissionValidations = require("../permissionValidations");
|
|
12
|
-
var _useTabs2 = require("./useTabs");
|
|
13
|
-
function _getRequireWildcardCache(e) { if ("function" != typeof WeakMap) return null; var r = new WeakMap(), t = new WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(e) { return e ? t : r; })(e); }
|
|
14
|
-
function _interopRequireWildcard(e, r) { if (!r && e && e.__esModule) return e; if (null === e || "object" != _typeof(e) && "function" != typeof e) return { "default": e }; var t = _getRequireWildcardCache(r); if (t && t.has(e)) return t.get(e); var n = { __proto__: null }, a = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var u in e) if ("default" !== u && Object.prototype.hasOwnProperty.call(e, u)) { var i = a ? Object.getOwnPropertyDescriptor(e, u) : null; i && (i.get || i.set) ? Object.defineProperty(n, u, i) : n[u] = e[u]; } return n["default"] = e, t && t.set(e, n), n; }
|
|
15
|
-
function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { "default": obj }; }
|
|
16
|
-
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); }
|
|
17
|
-
var MenuTab = function MenuTab(_ref) {
|
|
18
|
-
var id = _ref.id,
|
|
19
|
-
title = _ref.title,
|
|
20
|
-
tabWidth = _ref.tabWidth,
|
|
21
|
-
iconAlign = _ref.iconAlign,
|
|
22
|
-
iconName = _ref.iconName,
|
|
23
|
-
icon = _ref.icon,
|
|
24
|
-
disabled = _ref.disabled,
|
|
25
|
-
permissionAttr = _ref.permissionAttr,
|
|
26
|
-
tabMenuSize = _ref.tabMenuSize,
|
|
27
|
-
tooltip = _ref.tooltip,
|
|
28
|
-
tooltipPosition = _ref.tooltipPosition,
|
|
29
|
-
tooltipWidth = _ref.tooltipWidth,
|
|
30
|
-
closeable = _ref.closeable;
|
|
31
|
-
var _useTabs = (0, _useTabs2.useTabs)(),
|
|
32
|
-
selectedTabId = _useTabs.selectedTabId,
|
|
33
|
-
selectTab = _useTabs.selectTab,
|
|
34
|
-
removeTab = _useTabs.removeTab,
|
|
35
|
-
tabsCount = _useTabs.tabsCount;
|
|
36
|
-
var onDenied = (0, _permissionValidations.actionsOnPermissionDenied)(helpers.onDeniedOptions, permissionAttr);
|
|
37
|
-
return onDenied.unvisible ? null : /*#__PURE__*/_react["default"].createElement("li", {
|
|
38
|
-
key: id,
|
|
39
|
-
style: {
|
|
40
|
-
width: tabWidth
|
|
41
|
-
},
|
|
42
|
-
className: "menuitem ".concat(selectedTabId === id && 'selected')
|
|
43
|
-
}, /*#__PURE__*/_react["default"].createElement(_buttons["default"], {
|
|
44
|
-
className: "btn menubutton",
|
|
45
|
-
boxShadow: false,
|
|
46
|
-
onClick: function onClick() {
|
|
47
|
-
return selectTab(id);
|
|
48
|
-
},
|
|
49
|
-
iconAlign: iconAlign,
|
|
50
|
-
iconName: iconName,
|
|
51
|
-
icon: icon,
|
|
52
|
-
disabled: disabled || !!onDenied.disabled,
|
|
53
|
-
label: title,
|
|
54
|
-
size: tabMenuSize,
|
|
55
|
-
tooltip: tooltip || title,
|
|
56
|
-
tooltipPosition: tooltipPosition,
|
|
57
|
-
tooltipWidth: tooltipWidth
|
|
58
|
-
}), closeable && tabsCount > 1 && /*#__PURE__*/_react["default"].createElement("button", {
|
|
59
|
-
className: "closepanel",
|
|
60
|
-
onClick: function onClick() {
|
|
61
|
-
return removeTab(id);
|
|
62
|
-
}
|
|
63
|
-
}));
|
|
64
|
-
};
|
|
65
|
-
var MenuTabs = /*#__PURE__*/_react["default"].forwardRef(function (_ref2, ref) {
|
|
66
|
-
var _ref2$tabs = _ref2.tabs,
|
|
67
|
-
tabs = _ref2$tabs === void 0 ? [] : _ref2$tabs,
|
|
68
|
-
_ref2$tabWidth = _ref2.tabWidth,
|
|
69
|
-
tabWidth = _ref2$tabWidth === void 0 ? 'auto' : _ref2$tabWidth,
|
|
70
|
-
_ref2$tabMenuSize = _ref2.tabMenuSize,
|
|
71
|
-
tabMenuSize = _ref2$tabMenuSize === void 0 ? 'medium' : _ref2$tabMenuSize,
|
|
72
|
-
_ref2$tabMenuAlign = _ref2.tabMenuAlign,
|
|
73
|
-
tabMenuAlign = _ref2$tabMenuAlign === void 0 ? 'left' : _ref2$tabMenuAlign,
|
|
74
|
-
_ref2$firstTabIdent = _ref2.firstTabIdent,
|
|
75
|
-
firstTabIdent = _ref2$firstTabIdent === void 0 ? false : _ref2$firstTabIdent;
|
|
76
|
-
return /*#__PURE__*/_react["default"].createElement("ul", {
|
|
77
|
-
className: "menu ".concat(firstTabIdent && '-firsttabident'),
|
|
78
|
-
style: helpers.menuStyles(tabMenuAlign),
|
|
79
|
-
ref: ref
|
|
80
|
-
}, tabs.map(function (tab) {
|
|
81
|
-
return /*#__PURE__*/_react["default"].createElement(MenuTab, _extends({
|
|
82
|
-
key: tab.id,
|
|
83
|
-
tabMenuSize: tabMenuSize,
|
|
84
|
-
tabWidth: tabWidth
|
|
85
|
-
}, tab));
|
|
86
|
-
}));
|
|
87
|
-
});
|
|
88
|
-
MenuTabs.displayName = 'MenuTabs';
|
|
89
|
-
var _default = exports["default"] = MenuTabs;
|
package/lib/tabs/context.js
DELETED
|
@@ -1,161 +0,0 @@
|
|
|
1
|
-
"use strict";
|
|
2
|
-
|
|
3
|
-
function _typeof(o) { "@babel/helpers - typeof"; return _typeof = "function" == typeof Symbol && "symbol" == typeof Symbol.iterator ? function (o) { return typeof o; } : function (o) { return o && "function" == typeof Symbol && o.constructor === Symbol && o !== Symbol.prototype ? "symbol" : typeof o; }, _typeof(o); }
|
|
4
|
-
Object.defineProperty(exports, "__esModule", {
|
|
5
|
-
value: true
|
|
6
|
-
});
|
|
7
|
-
exports.TabsContext = void 0;
|
|
8
|
-
exports.TabsProvider = TabsProvider;
|
|
9
|
-
var _react = _interopRequireWildcard(require("react"));
|
|
10
|
-
var _lodash = _interopRequireDefault(require("lodash"));
|
|
11
|
-
var _tabHelpers = require("./tabHelpers");
|
|
12
|
-
function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { "default": obj }; }
|
|
13
|
-
function _getRequireWildcardCache(e) { if ("function" != typeof WeakMap) return null; var r = new WeakMap(), t = new WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(e) { return e ? t : r; })(e); }
|
|
14
|
-
function _interopRequireWildcard(e, r) { if (!r && e && e.__esModule) return e; if (null === e || "object" != _typeof(e) && "function" != typeof e) return { "default": e }; var t = _getRequireWildcardCache(r); if (t && t.has(e)) return t.get(e); var n = { __proto__: null }, a = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var u in e) if ("default" !== u && Object.prototype.hasOwnProperty.call(e, u)) { var i = a ? Object.getOwnPropertyDescriptor(e, u) : null; i && (i.get || i.set) ? Object.defineProperty(n, u, i) : n[u] = e[u]; } return n["default"] = e, t && t.set(e, n), n; }
|
|
15
|
-
function _toConsumableArray(arr) { return _arrayWithoutHoles(arr) || _iterableToArray(arr) || _unsupportedIterableToArray(arr) || _nonIterableSpread(); }
|
|
16
|
-
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."); }
|
|
17
|
-
function _iterableToArray(iter) { if (typeof Symbol !== "undefined" && iter[Symbol.iterator] != null || iter["@@iterator"] != null) return Array.from(iter); }
|
|
18
|
-
function _arrayWithoutHoles(arr) { if (Array.isArray(arr)) return _arrayLikeToArray(arr); }
|
|
19
|
-
function _slicedToArray(arr, i) { return _arrayWithHoles(arr) || _iterableToArrayLimit(arr, i) || _unsupportedIterableToArray(arr, i) || _nonIterableRest(); }
|
|
20
|
-
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."); }
|
|
21
|
-
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); }
|
|
22
|
-
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; }
|
|
23
|
-
function _iterableToArrayLimit(r, l) { var t = null == r ? null : "undefined" != typeof Symbol && r[Symbol.iterator] || r["@@iterator"]; if (null != t) { var e, n, i, u, a = [], f = !0, o = !1; try { if (i = (t = t.call(r)).next, 0 === l) { if (Object(t) !== t) return; f = !1; } else for (; !(f = (e = i.call(t)).done) && (a.push(e.value), a.length !== l); f = !0); } catch (r) { o = !0, n = r; } finally { try { if (!f && null != t["return"] && (u = t["return"](), Object(u) !== u)) return; } finally { if (o) throw n; } } return a; } }
|
|
24
|
-
function _arrayWithHoles(arr) { if (Array.isArray(arr)) return arr; }
|
|
25
|
-
var TabsContext = exports.TabsContext = /*#__PURE__*/(0, _react.createContext)({});
|
|
26
|
-
function TabsProvider(_ref) {
|
|
27
|
-
var _menuRef$current$clie, _menuRef$current;
|
|
28
|
-
var children = _ref.children,
|
|
29
|
-
tabsProp = _ref.tabs,
|
|
30
|
-
container = _ref.container,
|
|
31
|
-
_ref$selectedTab = _ref.selectedTab,
|
|
32
|
-
selectedTab = _ref$selectedTab === void 0 ? null : _ref$selectedTab,
|
|
33
|
-
onTabChange = _ref.onTabChange,
|
|
34
|
-
onTabClose = _ref.onTabClose,
|
|
35
|
-
tabsWidthProp = _ref.tabsWidth,
|
|
36
|
-
_ref$firstTabIdent = _ref.firstTabIdent,
|
|
37
|
-
firstTabIdent = _ref$firstTabIdent === void 0 ? false : _ref$firstTabIdent;
|
|
38
|
-
var _React$useState = _react["default"].useState(selectedTab),
|
|
39
|
-
_React$useState2 = _slicedToArray(_React$useState, 2),
|
|
40
|
-
selectedTabId = _React$useState2[0],
|
|
41
|
-
setSelectedTabId = _React$useState2[1];
|
|
42
|
-
var _useState = (0, _react.useState)(function () {
|
|
43
|
-
var _container$current$cl, _container$current;
|
|
44
|
-
return (_container$current$cl = (_container$current = container.current) === null || _container$current === void 0 ? void 0 : _container$current.clientWidth) !== null && _container$current$cl !== void 0 ? _container$current$cl : 0;
|
|
45
|
-
}),
|
|
46
|
-
_useState2 = _slicedToArray(_useState, 2),
|
|
47
|
-
containerWidth = _useState2[0],
|
|
48
|
-
setContainerWidth = _useState2[1];
|
|
49
|
-
var _useState3 = (0, _react.useState)((0, _tabHelpers.getTabs)(tabsProp)),
|
|
50
|
-
_useState4 = _slicedToArray(_useState3, 2),
|
|
51
|
-
tabs = _useState4[0],
|
|
52
|
-
setTabs = _useState4[1];
|
|
53
|
-
var menuRef = (0, _react.useRef)(null);
|
|
54
|
-
var menuSize = ((_menuRef$current$clie = (_menuRef$current = menuRef.current) === null || _menuRef$current === void 0 ? void 0 : _menuRef$current.clientWidth) !== null && _menuRef$current$clie !== void 0 ? _menuRef$current$clie : 0) - 38 - (firstTabIdent ? 15 : 0);
|
|
55
|
-
var tabsWidth = (0, _react.useMemo)(function () {
|
|
56
|
-
if (typeof tabsWidthProp === 'string') return tabsWidthProp === 'auto' ? 100 : parseInt(tabsWidthProp) || 100;
|
|
57
|
-
return tabsWidthProp;
|
|
58
|
-
}, [tabsWidthProp]);
|
|
59
|
-
var maxTabs = Math.round(menuSize / tabsWidth);
|
|
60
|
-
if (selectedTab && selectedTab !== selectedTabId) {
|
|
61
|
-
setSelectedTabId(selectedTab);
|
|
62
|
-
}
|
|
63
|
-
if (tabs.length > 0 && selectedTabId === null) {
|
|
64
|
-
var _tabs$;
|
|
65
|
-
setSelectedTabId((_tabs$ = tabs[0]) === null || _tabs$ === void 0 ? void 0 : _tabs$.id);
|
|
66
|
-
}
|
|
67
|
-
var dropdownTabs = (0, _react.useMemo)(function () {
|
|
68
|
-
if (menuSize === 0) return [];
|
|
69
|
-
return tabs.slice(maxTabs);
|
|
70
|
-
}, [tabs, maxTabs, containerWidth]);
|
|
71
|
-
var menuTabs = (0, _react.useMemo)(function () {
|
|
72
|
-
return tabs.slice(0, maxTabs);
|
|
73
|
-
}, [tabs, maxTabs, containerWidth]);
|
|
74
|
-
var tabsCount = tabs.length;
|
|
75
|
-
var updateTabs = (0, _react.useCallback)(function (tabId) {
|
|
76
|
-
var tabInDropdownIndex = dropdownTabs.findIndex(function (tab) {
|
|
77
|
-
return tab.id === tabId;
|
|
78
|
-
});
|
|
79
|
-
if (tabInDropdownIndex !== -1) {
|
|
80
|
-
var tabIndex = tabs.findIndex(function (tab) {
|
|
81
|
-
return tab.id === tabId;
|
|
82
|
-
});
|
|
83
|
-
var tabInDropdown = dropdownTabs[tabInDropdownIndex];
|
|
84
|
-
setTabs(function (prevState) {
|
|
85
|
-
prevState.splice(tabIndex, 1);
|
|
86
|
-
return [tabInDropdown].concat(_toConsumableArray(prevState));
|
|
87
|
-
});
|
|
88
|
-
}
|
|
89
|
-
}, [setTabs, menuTabs, tabs, dropdownTabs]);
|
|
90
|
-
var selectTab = (0, _react.useCallback)(function (tabId) {
|
|
91
|
-
updateTabs(tabId);
|
|
92
|
-
setSelectedTabId(tabId);
|
|
93
|
-
if (onTabChange) {
|
|
94
|
-
onTabChange(String(tabId));
|
|
95
|
-
}
|
|
96
|
-
}, [onTabChange, setSelectedTabId, updateTabs]);
|
|
97
|
-
var removeTab = (0, _react.useCallback)(function (tabId) {
|
|
98
|
-
var tabIndex = tabs.findIndex(function (tab) {
|
|
99
|
-
return tab.id === tabId;
|
|
100
|
-
});
|
|
101
|
-
var newSelectedTab = tabIndex === 0 ? tabs[tabIndex + 1] : tabs[tabIndex - 1];
|
|
102
|
-
if (selectedTabId === tabId) {
|
|
103
|
-
selectTab(newSelectedTab.id);
|
|
104
|
-
}
|
|
105
|
-
if (tabIndex !== -1) {
|
|
106
|
-
setTabs(function (prevState) {
|
|
107
|
-
prevState.splice(tabIndex, 1);
|
|
108
|
-
return prevState;
|
|
109
|
-
});
|
|
110
|
-
}
|
|
111
|
-
if (onTabClose) {
|
|
112
|
-
onTabClose(String(tabId));
|
|
113
|
-
}
|
|
114
|
-
}, [onTabClose, tabs, dropdownTabs, selectedTabId]);
|
|
115
|
-
var onResizeContainer = (0, _react.useCallback)(function (contentRect) {
|
|
116
|
-
setContainerWidth(contentRect.width);
|
|
117
|
-
}, [setContainerWidth]);
|
|
118
|
-
(0, _react.useEffect)(function () {
|
|
119
|
-
var newTabs = (0, _tabHelpers.getTabs)(tabsProp);
|
|
120
|
-
if (newTabs !== tabs) {
|
|
121
|
-
var includedTabs = _lodash["default"].differenceBy(newTabs, tabs, 'id');
|
|
122
|
-
var excludedTabsIds = _lodash["default"].differenceBy(tabs, newTabs, 'id').map(function (tab) {
|
|
123
|
-
return tab.id;
|
|
124
|
-
});
|
|
125
|
-
setTabs(function (prevState) {
|
|
126
|
-
var currentTabs = prevState;
|
|
127
|
-
if (excludedTabsIds) {
|
|
128
|
-
currentTabs = currentTabs.filter(function (tab) {
|
|
129
|
-
return !excludedTabsIds.includes(tab.id);
|
|
130
|
-
});
|
|
131
|
-
}
|
|
132
|
-
return [].concat(_toConsumableArray(currentTabs), _toConsumableArray(includedTabs));
|
|
133
|
-
});
|
|
134
|
-
}
|
|
135
|
-
}, [tabsProp]);
|
|
136
|
-
(0, _react.useEffect)(function () {
|
|
137
|
-
var resizeObserver = new ResizeObserver(function (_ref2) {
|
|
138
|
-
var _ref3 = _slicedToArray(_ref2, 1),
|
|
139
|
-
entry = _ref3[0];
|
|
140
|
-
onResizeContainer(entry.contentRect);
|
|
141
|
-
});
|
|
142
|
-
if (container.current) resizeObserver.observe(container.current);
|
|
143
|
-
return function () {
|
|
144
|
-
resizeObserver.disconnect();
|
|
145
|
-
};
|
|
146
|
-
}, [container.current, onResizeContainer]);
|
|
147
|
-
return /*#__PURE__*/_react["default"].createElement(TabsContext.Provider, {
|
|
148
|
-
value: {
|
|
149
|
-
tabs: tabs,
|
|
150
|
-
menuTabs: menuTabs,
|
|
151
|
-
dropdownTabs: dropdownTabs,
|
|
152
|
-
containerWidth: containerWidth,
|
|
153
|
-
tabsCount: tabsCount,
|
|
154
|
-
updateTabs: updateTabs,
|
|
155
|
-
selectTab: selectTab,
|
|
156
|
-
selectedTabId: selectedTabId,
|
|
157
|
-
removeTab: removeTab,
|
|
158
|
-
menuRef: menuRef
|
|
159
|
-
}
|
|
160
|
-
}, children);
|
|
161
|
-
}
|
package/lib/tabs/useTabs.js
DELETED
|
@@ -1,11 +0,0 @@
|
|
|
1
|
-
"use strict";
|
|
2
|
-
|
|
3
|
-
Object.defineProperty(exports, "__esModule", {
|
|
4
|
-
value: true
|
|
5
|
-
});
|
|
6
|
-
exports.useTabs = useTabs;
|
|
7
|
-
var _react = require("react");
|
|
8
|
-
var _context = require("./context");
|
|
9
|
-
function useTabs() {
|
|
10
|
-
return (0, _react.useContext)(_context.TabsContext);
|
|
11
|
-
}
|