@agilemotion/oui-react-js 1.8.15 → 1.8.16
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/dist/BasicApp.js +2 -1
- package/dist/components/DataGrid.js +1 -1
- package/dist/components/ProgressTracker.js +1 -1
- package/dist/components/form/LookupField.js +1 -0
- package/dist/components/layout/CollapsiblePanel.css +9 -9
- package/dist/components/layout/View.css +68 -68
- package/dist/components/layout/View.js +1 -1
- package/dist/components/loader.css +36 -36
- package/dist/components/media/Video.css +4 -4
- package/dist/components/signatures/ResponsiveTable.css +91 -91
- package/dist/components/signatures/widgets.css +126 -126
- package/dist/js/Validators.js +10 -24
- package/dist/view/Dashboard.bck.js +562 -0
- package/dist/view/Dashboard.js +132 -84
- package/package.json +1 -1
package/dist/BasicApp.js
CHANGED
|
@@ -17,6 +17,7 @@ function _interopRequireDefault(e) { return e && e.__esModule ? e : { default: e
|
|
|
17
17
|
const location = window.location.protocol + "//" + window.location.hostname;
|
|
18
18
|
const BasicApp = props => {
|
|
19
19
|
const navigate = (0, _reactRouterDom.useNavigate)();
|
|
20
|
+
const reloadKey = _react.default.useRef(0);
|
|
20
21
|
_react.default.useEffect(() => {
|
|
21
22
|
console.log('PATH : ' + window.location.pathname);
|
|
22
23
|
if (window.location.pathname !== '/reset-password' && window.location.pathname !== '/login' && window.location.pathname !== '/forgot-password' && window.location.pathname !== '/change-password') {
|
|
@@ -31,7 +32,7 @@ const BasicApp = props => {
|
|
|
31
32
|
path: "view/:id",
|
|
32
33
|
element: /*#__PURE__*/_react.default.createElement(_ViewContainer.default, {
|
|
33
34
|
dashboard: /*#__PURE__*/_react.default.createElement(_Dashboard.default, {
|
|
34
|
-
|
|
35
|
+
key: 'dashboard-' + reloadKey.current++
|
|
35
36
|
})
|
|
36
37
|
})
|
|
37
38
|
})), /*#__PURE__*/_react.default.createElement(_reactRouterDom.Route, {
|
|
@@ -119,7 +119,7 @@ const DataGrid = exports.DataGrid = /*#__PURE__*/_react.default.memo(/*#__PURE__
|
|
|
119
119
|
const [deletedRows, setDeletedRows] = _react.default.useState([]);
|
|
120
120
|
const [editable, setEditable] = _react.default.useState(false);
|
|
121
121
|
const [scrollWidth, setScrollWidth] = _react.default.useState(0);
|
|
122
|
-
const [rowsPerPageOptions] = _react.default.useState([15, 30, 45, 60, 75]);
|
|
122
|
+
const [rowsPerPageOptions] = _react.default.useState([15, 30, 45, 60, 75, 150, 300]);
|
|
123
123
|
const [rowsPerPageLoading, setRowsPerPageLoading] = _react.default.useState(true);
|
|
124
124
|
const [rowsPerPage, setRowsPerPage] = _react.default.useState(props.config.pageSize);
|
|
125
125
|
const highlightRowSelection = _react.default.useRef(!_Utils.default.isNull(props.config.highlightRowSelection) ? props.config.highlightRowSelection : !_Utils.default.isNull(props.config.disableRowSelection) ? !props.config.disableRowSelection : true);
|
|
@@ -95,7 +95,7 @@ const HtmlPanel = /*#__PURE__*/_react.default.memo(/*#__PURE__*/_react.default.f
|
|
|
95
95
|
};
|
|
96
96
|
return visible && /*#__PURE__*/_react.default.createElement("div", {
|
|
97
97
|
style: _Utils.default.mergeStyles({}, props.config)
|
|
98
|
-
}, data && /*#__PURE__*/_react.default.createElement(
|
|
98
|
+
}, data && /*#__PURE__*/_react.default.createElement("div", null, data.steps.map((step, index) => {
|
|
99
99
|
return /*#__PURE__*/_react.default.createElement(_react.default.Fragment, null, /*#__PURE__*/_react.default.createElement("div", {
|
|
100
100
|
style: {
|
|
101
101
|
margin: "4px"
|
|
@@ -125,6 +125,7 @@ const LookupFieldComponent = exports.LookupFieldComponent = /*#__PURE__*/_react.
|
|
|
125
125
|
id: props.id,
|
|
126
126
|
required: base.required,
|
|
127
127
|
readonly: true,
|
|
128
|
+
disabled: base.disabled,
|
|
128
129
|
label: !_Utils.default.isNull(props.config.attributes) && !_Utils.default.isNull(props.config.attributes['label']) ? props.config.attributes['label'] : null,
|
|
129
130
|
value: base.value?.__oui_label || base.value?.dataRecordDescription || defaultValue,
|
|
130
131
|
className: props.className || 'lookup-field-input',
|
|
@@ -1,9 +1,9 @@
|
|
|
1
|
-
.coll-panel-container {
|
|
2
|
-
font-family: sans-serif;
|
|
3
|
-
text-align: center;
|
|
4
|
-
}
|
|
5
|
-
|
|
6
|
-
.coll-panel-btn:focus {
|
|
7
|
-
outline: 0;
|
|
8
|
-
box-shadow: none;
|
|
9
|
-
}
|
|
1
|
+
.coll-panel-container {
|
|
2
|
+
font-family: sans-serif;
|
|
3
|
+
text-align: center;
|
|
4
|
+
}
|
|
5
|
+
|
|
6
|
+
.coll-panel-btn:focus {
|
|
7
|
+
outline: 0;
|
|
8
|
+
box-shadow: none;
|
|
9
|
+
}
|
|
@@ -1,68 +1,68 @@
|
|
|
1
|
-
.view {
|
|
2
|
-
padding: 0 32px;
|
|
3
|
-
background-color: #ffffff;
|
|
4
|
-
border-radius: 4px;
|
|
5
|
-
}
|
|
6
|
-
|
|
7
|
-
.window-unpinned .view {
|
|
8
|
-
width: 0 !important;;
|
|
9
|
-
}
|
|
10
|
-
|
|
11
|
-
.window-pinned .view {
|
|
12
|
-
padding: 0 8px;
|
|
13
|
-
}
|
|
14
|
-
|
|
15
|
-
.no-margin {
|
|
16
|
-
margin-left: 0 !important;
|
|
17
|
-
margin-right: 0 !important;
|
|
18
|
-
}
|
|
19
|
-
|
|
20
|
-
.no-padding {
|
|
21
|
-
padding-left: 0 !important;
|
|
22
|
-
padding-right: 0 !important;
|
|
23
|
-
}
|
|
24
|
-
|
|
25
|
-
.centered-flex-box {
|
|
26
|
-
display: flex;
|
|
27
|
-
align-Items: center;
|
|
28
|
-
justify-content: center
|
|
29
|
-
}
|
|
30
|
-
|
|
31
|
-
/* Smartphones (landscape); */
|
|
32
|
-
@media only screen and (min-device-width : 361px) and (max-device-width : 480px) {
|
|
33
|
-
.view {
|
|
34
|
-
padding: 0 16px;
|
|
35
|
-
}
|
|
36
|
-
}
|
|
37
|
-
|
|
38
|
-
/* Smartphones (portrait); */
|
|
39
|
-
@media only screen and (min-device-width : 280px) and (max-device-width : 360px) {
|
|
40
|
-
.view {
|
|
41
|
-
padding: 0 16px;
|
|
42
|
-
}
|
|
43
|
-
}
|
|
44
|
-
|
|
45
|
-
/* iPads (portrait and landscape); */
|
|
46
|
-
@media only screen and (min-device-width : 768px) and (max-device-width : 1024px) {
|
|
47
|
-
.view {
|
|
48
|
-
padding: 0 24px;
|
|
49
|
-
}
|
|
50
|
-
}
|
|
51
|
-
|
|
52
|
-
/* iPad 3 */
|
|
53
|
-
@media only screen and (min-device-width : 768px) and (max-device-width : 1024px) and (orientation : landscape) and (-webkit-min-device-pixel-ratio : 2) {
|
|
54
|
-
.view {
|
|
55
|
-
padding: 0 24px;
|
|
56
|
-
}
|
|
57
|
-
}
|
|
58
|
-
|
|
59
|
-
/* small desktop screens */
|
|
60
|
-
@media only screen and (max-width : 600px) {
|
|
61
|
-
}
|
|
62
|
-
|
|
63
|
-
/* low resolution desktop */
|
|
64
|
-
@media only screen and (max-width : 1200px) {
|
|
65
|
-
.view {
|
|
66
|
-
|
|
67
|
-
}
|
|
68
|
-
}
|
|
1
|
+
.view {
|
|
2
|
+
padding: 0 32px;
|
|
3
|
+
background-color: #ffffff;
|
|
4
|
+
border-radius: 4px;
|
|
5
|
+
}
|
|
6
|
+
|
|
7
|
+
.window-unpinned .view {
|
|
8
|
+
width: 0 !important;;
|
|
9
|
+
}
|
|
10
|
+
|
|
11
|
+
.window-pinned .view {
|
|
12
|
+
padding: 0 8px;
|
|
13
|
+
}
|
|
14
|
+
|
|
15
|
+
.no-margin {
|
|
16
|
+
margin-left: 0 !important;
|
|
17
|
+
margin-right: 0 !important;
|
|
18
|
+
}
|
|
19
|
+
|
|
20
|
+
.no-padding {
|
|
21
|
+
padding-left: 0 !important;
|
|
22
|
+
padding-right: 0 !important;
|
|
23
|
+
}
|
|
24
|
+
|
|
25
|
+
.centered-flex-box {
|
|
26
|
+
display: flex;
|
|
27
|
+
align-Items: center;
|
|
28
|
+
justify-content: center
|
|
29
|
+
}
|
|
30
|
+
|
|
31
|
+
/* Smartphones (landscape); */
|
|
32
|
+
@media only screen and (min-device-width : 361px) and (max-device-width : 480px) {
|
|
33
|
+
.view {
|
|
34
|
+
padding: 0 16px;
|
|
35
|
+
}
|
|
36
|
+
}
|
|
37
|
+
|
|
38
|
+
/* Smartphones (portrait); */
|
|
39
|
+
@media only screen and (min-device-width : 280px) and (max-device-width : 360px) {
|
|
40
|
+
.view {
|
|
41
|
+
padding: 0 16px;
|
|
42
|
+
}
|
|
43
|
+
}
|
|
44
|
+
|
|
45
|
+
/* iPads (portrait and landscape); */
|
|
46
|
+
@media only screen and (min-device-width : 768px) and (max-device-width : 1024px) {
|
|
47
|
+
.view {
|
|
48
|
+
padding: 0 24px;
|
|
49
|
+
}
|
|
50
|
+
}
|
|
51
|
+
|
|
52
|
+
/* iPad 3 */
|
|
53
|
+
@media only screen and (min-device-width : 768px) and (max-device-width : 1024px) and (orientation : landscape) and (-webkit-min-device-pixel-ratio : 2) {
|
|
54
|
+
.view {
|
|
55
|
+
padding: 0 24px;
|
|
56
|
+
}
|
|
57
|
+
}
|
|
58
|
+
|
|
59
|
+
/* small desktop screens */
|
|
60
|
+
@media only screen and (max-width : 600px) {
|
|
61
|
+
}
|
|
62
|
+
|
|
63
|
+
/* low resolution desktop */
|
|
64
|
+
@media only screen and (max-width : 1200px) {
|
|
65
|
+
.view {
|
|
66
|
+
|
|
67
|
+
}
|
|
68
|
+
}
|
|
@@ -61,6 +61,7 @@ const View = props => {
|
|
|
61
61
|
}
|
|
62
62
|
}
|
|
63
63
|
_react.default.useLayoutEffect(() => {
|
|
64
|
+
props.handle.api = api();
|
|
64
65
|
if (!props.handle.api.loaded()) {
|
|
65
66
|
if (props.handle.api.model) {
|
|
66
67
|
let ownPropertyNames = Object.getOwnPropertyNames(props.handle.api.model);
|
|
@@ -69,7 +70,6 @@ const View = props => {
|
|
|
69
70
|
}
|
|
70
71
|
}
|
|
71
72
|
}
|
|
72
|
-
props.handle.api = api();
|
|
73
73
|
}, []);
|
|
74
74
|
_react.default.useEffect(() => {
|
|
75
75
|
props.handle.api = api();
|
|
@@ -1,36 +1,36 @@
|
|
|
1
|
-
.loaderModal {
|
|
2
|
-
display: block; /* Hidden by default */
|
|
3
|
-
position: fixed; /* Stay in place */
|
|
4
|
-
z-index: 3000; /* Sit on top */
|
|
5
|
-
left: 0;
|
|
6
|
-
top: 0;
|
|
7
|
-
width: 100vw; /* Full width */
|
|
8
|
-
height: 100vh; /* Full height */
|
|
9
|
-
overflow: hidden; /* Enable scroll if needed */
|
|
10
|
-
background-color: rgb(0,0,0); /* Fallback color */
|
|
11
|
-
background-color: rgba(0,0,0,0.1); /* Black w/ opacity */
|
|
12
|
-
}
|
|
13
|
-
|
|
14
|
-
/* Modal Content/Box */
|
|
15
|
-
.modal-content {
|
|
16
|
-
background-color: transparent;
|
|
17
|
-
margin: 30% auto; /* 15% from the top and centered */
|
|
18
|
-
padding: 20px;
|
|
19
|
-
border: 1px solid #888;
|
|
20
|
-
width: 10%; /* Could be more or less, depending on screen size */
|
|
21
|
-
}
|
|
22
|
-
|
|
23
|
-
/* The Close Button */
|
|
24
|
-
.close {
|
|
25
|
-
color: #aaa;
|
|
26
|
-
float: right;
|
|
27
|
-
font-size: 28px;
|
|
28
|
-
font-weight: bold;
|
|
29
|
-
}
|
|
30
|
-
|
|
31
|
-
.close:hover,
|
|
32
|
-
.close:focus {
|
|
33
|
-
color: black;
|
|
34
|
-
text-decoration: none;
|
|
35
|
-
cursor: pointer;
|
|
36
|
-
}
|
|
1
|
+
.loaderModal {
|
|
2
|
+
display: block; /* Hidden by default */
|
|
3
|
+
position: fixed; /* Stay in place */
|
|
4
|
+
z-index: 3000; /* Sit on top */
|
|
5
|
+
left: 0;
|
|
6
|
+
top: 0;
|
|
7
|
+
width: 100vw; /* Full width */
|
|
8
|
+
height: 100vh; /* Full height */
|
|
9
|
+
overflow: hidden; /* Enable scroll if needed */
|
|
10
|
+
background-color: rgb(0,0,0); /* Fallback color */
|
|
11
|
+
background-color: rgba(0,0,0,0.1); /* Black w/ opacity */
|
|
12
|
+
}
|
|
13
|
+
|
|
14
|
+
/* Modal Content/Box */
|
|
15
|
+
.modal-content {
|
|
16
|
+
background-color: transparent;
|
|
17
|
+
margin: 30% auto; /* 15% from the top and centered */
|
|
18
|
+
padding: 20px;
|
|
19
|
+
border: 1px solid #888;
|
|
20
|
+
width: 10%; /* Could be more or less, depending on screen size */
|
|
21
|
+
}
|
|
22
|
+
|
|
23
|
+
/* The Close Button */
|
|
24
|
+
.close {
|
|
25
|
+
color: #aaa;
|
|
26
|
+
float: right;
|
|
27
|
+
font-size: 28px;
|
|
28
|
+
font-weight: bold;
|
|
29
|
+
}
|
|
30
|
+
|
|
31
|
+
.close:hover,
|
|
32
|
+
.close:focus {
|
|
33
|
+
color: black;
|
|
34
|
+
text-decoration: none;
|
|
35
|
+
cursor: pointer;
|
|
36
|
+
}
|
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
.user-video {
|
|
2
|
-
min-width: 280px;
|
|
3
|
-
height: 280px;
|
|
4
|
-
}
|
|
1
|
+
.user-video {
|
|
2
|
+
min-width: 280px;
|
|
3
|
+
height: 280px;
|
|
4
|
+
}
|
|
@@ -1,91 +1,91 @@
|
|
|
1
|
-
.table thead th {
|
|
2
|
-
}
|
|
3
|
-
|
|
4
|
-
table.responsive-table {
|
|
5
|
-
display: table;
|
|
6
|
-
/* required for table-layout to be used (not normally necessary; included for completeness) */
|
|
7
|
-
table-layout: fixed;
|
|
8
|
-
/* this keeps your columns with fixed with exactly the right width */
|
|
9
|
-
width: 100% !important;
|
|
10
|
-
/* table must have width set for fixed layout to work as expected */
|
|
11
|
-
height: 100%;
|
|
12
|
-
}
|
|
13
|
-
|
|
14
|
-
table.responsive-table thead {
|
|
15
|
-
position: fixed;
|
|
16
|
-
top: 50px;
|
|
17
|
-
left: 0;
|
|
18
|
-
right: 0;
|
|
19
|
-
width: 100%;
|
|
20
|
-
min-height: 50px;
|
|
21
|
-
line-height: 3em;
|
|
22
|
-
background: #eee;
|
|
23
|
-
table-layout: fixed;
|
|
24
|
-
display: table;
|
|
25
|
-
}
|
|
26
|
-
|
|
27
|
-
table.responsive-table th {
|
|
28
|
-
background: #eee;
|
|
29
|
-
}
|
|
30
|
-
|
|
31
|
-
table.responsive-table td {
|
|
32
|
-
line-height: 2em;
|
|
33
|
-
}
|
|
34
|
-
|
|
35
|
-
table.responsive-table tr > td,
|
|
36
|
-
table.responsive-table th {
|
|
37
|
-
text-align: left;
|
|
38
|
-
}
|
|
39
|
-
|
|
40
|
-
.table td, .table th {
|
|
41
|
-
white-space: nowrap;
|
|
42
|
-
overflow: hidden !important;
|
|
43
|
-
text-overflow: ellipsis;
|
|
44
|
-
min-width: 0 !important;
|
|
45
|
-
border-bottom: 1px solid rgba(224, 224, 224, 1) !important;
|
|
46
|
-
border-top: none !important;
|
|
47
|
-
}
|
|
48
|
-
|
|
49
|
-
.selectCell {
|
|
50
|
-
white-space: normal !important;
|
|
51
|
-
text-overflow: unset !important;
|
|
52
|
-
}
|
|
53
|
-
|
|
54
|
-
.selectCell span{
|
|
55
|
-
padding: 0 !important;
|
|
56
|
-
}
|
|
57
|
-
|
|
58
|
-
.table td {
|
|
59
|
-
padding: 6px 24px 6px 16px;
|
|
60
|
-
border-top: none !important;
|
|
61
|
-
display: table-cell;
|
|
62
|
-
font-size: 0.875rem;
|
|
63
|
-
text-align: left;
|
|
64
|
-
font-family: "Roboto", "Helvetica", "Arial", sans-serif;
|
|
65
|
-
font-weight: 400;
|
|
66
|
-
line-height: 1.43;
|
|
67
|
-
border-bottom: 1px solid rgba(224, 224, 224, 1);
|
|
68
|
-
letter-spacing: 0.01071em;
|
|
69
|
-
vertical-align: inherit
|
|
70
|
-
}
|
|
71
|
-
|
|
72
|
-
.table th {
|
|
73
|
-
color: rgba(0, 0, 0, 0.54);
|
|
74
|
-
font-size: 0.75rem;
|
|
75
|
-
font-weight: 500;
|
|
76
|
-
line-height: 1.3125rem;
|
|
77
|
-
}
|
|
78
|
-
|
|
79
|
-
.table {
|
|
80
|
-
table-layout: fixed;
|
|
81
|
-
}
|
|
82
|
-
|
|
83
|
-
.table-scrollbar {
|
|
84
|
-
position: relative;
|
|
85
|
-
overflow: auto;
|
|
86
|
-
}
|
|
87
|
-
|
|
88
|
-
@media screen and (max-width: 40em) {
|
|
89
|
-
|
|
90
|
-
|
|
91
|
-
}
|
|
1
|
+
.table thead th {
|
|
2
|
+
}
|
|
3
|
+
|
|
4
|
+
table.responsive-table {
|
|
5
|
+
display: table;
|
|
6
|
+
/* required for table-layout to be used (not normally necessary; included for completeness) */
|
|
7
|
+
table-layout: fixed;
|
|
8
|
+
/* this keeps your columns with fixed with exactly the right width */
|
|
9
|
+
width: 100% !important;
|
|
10
|
+
/* table must have width set for fixed layout to work as expected */
|
|
11
|
+
height: 100%;
|
|
12
|
+
}
|
|
13
|
+
|
|
14
|
+
table.responsive-table thead {
|
|
15
|
+
position: fixed;
|
|
16
|
+
top: 50px;
|
|
17
|
+
left: 0;
|
|
18
|
+
right: 0;
|
|
19
|
+
width: 100%;
|
|
20
|
+
min-height: 50px;
|
|
21
|
+
line-height: 3em;
|
|
22
|
+
background: #eee;
|
|
23
|
+
table-layout: fixed;
|
|
24
|
+
display: table;
|
|
25
|
+
}
|
|
26
|
+
|
|
27
|
+
table.responsive-table th {
|
|
28
|
+
background: #eee;
|
|
29
|
+
}
|
|
30
|
+
|
|
31
|
+
table.responsive-table td {
|
|
32
|
+
line-height: 2em;
|
|
33
|
+
}
|
|
34
|
+
|
|
35
|
+
table.responsive-table tr > td,
|
|
36
|
+
table.responsive-table th {
|
|
37
|
+
text-align: left;
|
|
38
|
+
}
|
|
39
|
+
|
|
40
|
+
.table td, .table th {
|
|
41
|
+
white-space: nowrap;
|
|
42
|
+
overflow: hidden !important;
|
|
43
|
+
text-overflow: ellipsis;
|
|
44
|
+
min-width: 0 !important;
|
|
45
|
+
border-bottom: 1px solid rgba(224, 224, 224, 1) !important;
|
|
46
|
+
border-top: none !important;
|
|
47
|
+
}
|
|
48
|
+
|
|
49
|
+
.selectCell {
|
|
50
|
+
white-space: normal !important;
|
|
51
|
+
text-overflow: unset !important;
|
|
52
|
+
}
|
|
53
|
+
|
|
54
|
+
.selectCell span{
|
|
55
|
+
padding: 0 !important;
|
|
56
|
+
}
|
|
57
|
+
|
|
58
|
+
.table td {
|
|
59
|
+
padding: 6px 24px 6px 16px;
|
|
60
|
+
border-top: none !important;
|
|
61
|
+
display: table-cell;
|
|
62
|
+
font-size: 0.875rem;
|
|
63
|
+
text-align: left;
|
|
64
|
+
font-family: "Roboto", "Helvetica", "Arial", sans-serif;
|
|
65
|
+
font-weight: 400;
|
|
66
|
+
line-height: 1.43;
|
|
67
|
+
border-bottom: 1px solid rgba(224, 224, 224, 1);
|
|
68
|
+
letter-spacing: 0.01071em;
|
|
69
|
+
vertical-align: inherit
|
|
70
|
+
}
|
|
71
|
+
|
|
72
|
+
.table th {
|
|
73
|
+
color: rgba(0, 0, 0, 0.54);
|
|
74
|
+
font-size: 0.75rem;
|
|
75
|
+
font-weight: 500;
|
|
76
|
+
line-height: 1.3125rem;
|
|
77
|
+
}
|
|
78
|
+
|
|
79
|
+
.table {
|
|
80
|
+
table-layout: fixed;
|
|
81
|
+
}
|
|
82
|
+
|
|
83
|
+
.table-scrollbar {
|
|
84
|
+
position: relative;
|
|
85
|
+
overflow: auto;
|
|
86
|
+
}
|
|
87
|
+
|
|
88
|
+
@media screen and (max-width: 40em) {
|
|
89
|
+
|
|
90
|
+
|
|
91
|
+
}
|