chem-generic-ui 0.1.23 → 0.1.26

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.
@@ -0,0 +1,489 @@
1
+ $color-editable: #fff;
2
+ $color-readonly: #ddd;
3
+ $color-required: lightyellow;
4
+ $color-invalid: lightcoral;
5
+ $color-can-drop: lightgray;
6
+ $color-is-over: #31708f;
7
+ $colo-bs-primary: #337ab7;
8
+ $color-bs-warning: #f0ad4e;
9
+ $colo-selected-border: #0dcaf0;
10
+ $color-default: #777;
11
+ $color-bs-info: #5bc0de;
12
+
13
+ .bg-bs-primary {
14
+ background-color: $colo-bs-primary !important;
15
+ }
16
+
17
+ .bg-bs-warning {
18
+ background-color: $color-bs-warning !important;
19
+ }
20
+
21
+ .icon_generic_nav {
22
+ font-family: FontAwesome, Helvetica, Arial, sans-serif !important;
23
+ }
24
+
25
+ .field_required {
26
+ background-color: $color-required;
27
+ }
28
+
29
+ .template_panel_heading {
30
+ display: flex;
31
+ justify-content: space-between;
32
+ align-items: center;
33
+ padding: 5px 10px 5px 10px !important;
34
+ }
35
+
36
+ .panel_generic_properties {
37
+ border-left: unset !important;
38
+ border-right: unset !important;
39
+ border-bottom: unset !important;
40
+ line-height: 26px !important;
41
+ box-shadow: unset !important;
42
+ margin-bottom: unset !important;
43
+ .panel-title {
44
+ font-weight: bold;
45
+ }
46
+ .default_style {
47
+ font-size: 14px;
48
+ line-height: normal;
49
+ }
50
+ }
51
+
52
+ .panel_generic_properties_body {
53
+ padding-left: unset !important;
54
+ padding-right: unset !important;
55
+ }
56
+
57
+ @mixin generic_panel_header {
58
+ font-weight: bold;
59
+ padding: 10px 0px !important;
60
+ }
61
+
62
+ .panel_generic_heading_slim {
63
+ padding: 5px 0px !important;
64
+ }
65
+
66
+ .panel_generic_heading {
67
+ @include generic_panel_header;
68
+ }
69
+
70
+ .panel_generic_heading_bu {
71
+ @include generic_panel_header;
72
+ text-decoration: underline;
73
+ }
74
+
75
+ .panel_generic_heading_bui {
76
+ @include generic_panel_header;
77
+ text-decoration: underline;
78
+ font-style: italic;
79
+ }
80
+
81
+ .text_generic_properties {
82
+ .dummy {
83
+ background-color: unset !important;
84
+ border: unset !important;
85
+ box-shadow: unset !important;
86
+ }
87
+ .editable {
88
+ background-color: $color-editable;
89
+ }
90
+ .readonly {
91
+ background-color: $color-readonly;
92
+ }
93
+ .required {
94
+ background-color: $color-required;
95
+ }
96
+ input:invalid {
97
+ border: 1px solid $color-invalid;
98
+ }
99
+ }
100
+
101
+ .select_generic_properties_editable {
102
+ .Select-control {
103
+ background-color: $color-editable;
104
+ }
105
+ }
106
+
107
+ .select_generic_properties_readonly {
108
+ .Select-control {
109
+ background-color: $color-readonly;
110
+ }
111
+ }
112
+
113
+ .select_generic_properties_required {
114
+ .Select-control {
115
+ background-color: $color-required;
116
+ }
117
+ }
118
+
119
+ .drop_generic_properties {
120
+ display: flex;
121
+ align-items: center;
122
+ .target {
123
+ height: 100%;
124
+ width: 100%;
125
+ margin: 0px 10px 0px 10px;
126
+ display: inline-block;
127
+ .indicator {
128
+ font-size: x-large;
129
+ }
130
+ .s-img {
131
+ display: flex;
132
+ img {
133
+ height: 4vh;
134
+ width: 4vw;
135
+ }
136
+ }
137
+ .data {
138
+ font-size: medium;
139
+ line-height: normal !important;
140
+ text-overflow: ellipsis;
141
+ overflow: hidden;
142
+ white-space: nowrap;
143
+ align-self: center;
144
+ width: 100%;
145
+ }
146
+ &.can-drop {
147
+ .indicator {
148
+ border: 2px dashed $color-can-drop;
149
+ color: $color-can-drop;
150
+ }
151
+ .data {
152
+ border: 2px dashed $color-can-drop;
153
+ color: $color-can-drop;
154
+ }
155
+ }
156
+ &.is-over {
157
+ .indicator {
158
+ border: 2px dashed $color-is-over;
159
+ color: $color-is-over;
160
+ }
161
+ .data {
162
+ border: 2px dashed $color-is-over;
163
+ color: $color-is-over;
164
+ }
165
+ }
166
+ }
167
+ .btn_del {
168
+ float: right;
169
+ align-self: center;
170
+ }
171
+ .sample_radios {
172
+ font-size: xx-small;
173
+ line-height: 2;
174
+ display: inline-flex;
175
+ padding-right: 5px;
176
+ }
177
+ }
178
+
179
+ .generic_criteria_modal {
180
+ display: block;
181
+ padding-left: 0px;
182
+ top: 45% !important;
183
+ width: 75vw !important;
184
+ }
185
+
186
+ .search_criteria_mof {
187
+ .modal_body {
188
+ max-height: 70vh;
189
+ height: 70vh;
190
+ overflow: auto;
191
+ }
192
+ .btn_footer {
193
+ margin-top: 10px;
194
+ }
195
+ }
196
+
197
+ .input-form {
198
+ .input-group-addon {
199
+ font-weight: bold;
200
+ }
201
+ .help {
202
+ font-size: 80%;
203
+ margin: 6px;
204
+ font-style: italic;
205
+ }
206
+ }
207
+
208
+ .g-ds-note {
209
+ color: black !important;
210
+ float: left !important;
211
+ text-align: left !important;
212
+ font-weight: lighter !important;
213
+ .g-ds-title { text-decoration: underline; font-weight: 700; line-height: 1.5; }
214
+ }
215
+
216
+ .g_input_group {
217
+ padding: 6px 6px !important;
218
+ }
219
+
220
+ .g_input_group_label {
221
+ background-color: lightgray !important;
222
+ width: unset !important;
223
+ white-space: nowrap !important;
224
+ padding: 6px 6px !important;
225
+ }
226
+
227
+ .g_col_w {
228
+ width: 20% !important;
229
+ }
230
+
231
+ .generic_grid {
232
+ display: block;
233
+ > div {
234
+ display: flex;
235
+ flex-wrap: nowrap;
236
+ }
237
+ }
238
+
239
+ @mixin generic_grid_cell {
240
+ width: 100%;
241
+ margin: 6px 0px 6px 6px;
242
+ text-align: center;
243
+ line-height: 15px;
244
+ align-self: center;
245
+ }
246
+
247
+ .generic_grid_header {
248
+ @include generic_grid_cell;
249
+ font-weight: bolder;
250
+ font-family: 'Franklin Gothic Medium', 'Arial Narrow', Arial, sans-serif;
251
+ }
252
+
253
+ .generic_grid_row {
254
+ @include generic_grid_cell;
255
+ }
256
+
257
+ @mixin generic_version_badge {
258
+ background-color: #777;
259
+ display: inline-block;
260
+ padding: 0.35em 0.65em;
261
+ font-size: 0.75em;
262
+ text-align: center;
263
+ vertical-align: baseline;
264
+ white-space: nowrap;
265
+ border-radius: 0.5rem;
266
+ color: white;
267
+ }
268
+
269
+ .generic_version {
270
+ @include generic_version_badge;
271
+ background-color: unset;
272
+ color: blue;
273
+ }
274
+
275
+ .generic_version_draft {
276
+ @include generic_version_badge;
277
+ background-color: unset;
278
+ color: black;
279
+ }
280
+
281
+ .generic_version_block {
282
+ display: block;
283
+ padding: 6px 10px;
284
+ margin: 10px;
285
+ border-radius: 10px;
286
+ border: thin solid lightgray;
287
+ font-size: 1.2em;
288
+ > div {
289
+ display: flex;
290
+ flex-wrap: nowrap;
291
+ }
292
+ }
293
+
294
+ .generic_block_select {
295
+ // border-color: $colo-selected-border;
296
+ border-width: medium;
297
+ border-style: groove;
298
+ }
299
+
300
+ .generic_panel_none {
301
+ border-color: #ddd !important;
302
+ > .panel-heading {
303
+ background-color: white !important;
304
+ }
305
+ }
306
+
307
+ .generic_tbl_chks {
308
+ line-height: 1em;
309
+ margin: 0px -10px !important;
310
+ > label {
311
+ display: inline-flex;
312
+ align-content: center;
313
+ align-items: center;
314
+ > input {
315
+ margin-top: 0px;
316
+ }
317
+ }
318
+ }
319
+
320
+ .generic_btn_default {
321
+ background-color: $color-default !important;
322
+ color: $color-editable !important;
323
+ }
324
+
325
+ .drop_generic_table_wrap {
326
+ .target {
327
+ .s-img {
328
+ position: relative;
329
+ border: 1px solid transparent;
330
+ img {
331
+ height: 4vw;
332
+ width: 4vw;
333
+ }
334
+ .del_btn {
335
+ position: absolute;
336
+ top: 0%;
337
+ left: 0%;
338
+ }
339
+ .link_btn {
340
+ position: absolute;
341
+ bottom: 0%;
342
+ left: 0%;
343
+ }
344
+ }
345
+ .s-img:hover {
346
+ border: 1px solid $colo-selected-border;
347
+ }
348
+ .data {
349
+ font-size: unset;
350
+ white-space: unset;
351
+ text-align: left;
352
+ }
353
+ &.can-drop {
354
+ .s-img {
355
+ border: 2px dashed $color-can-drop;
356
+ color: $color-can-drop;
357
+ }
358
+ }
359
+ &.is-over {
360
+ .s-img {
361
+ border: 2px dashed $color-is-over;
362
+ color: $color-is-over;
363
+ }
364
+ }
365
+ }
366
+ }
367
+
368
+ .generic_grid_img {
369
+ border: $color-readonly solid thin;
370
+ }
371
+
372
+ .generic_sam_options {
373
+ display: flex;
374
+ flex-direction: column;
375
+ text-align: left;
376
+ font-size: x-small;
377
+ .radio {
378
+ margin-top: unset;
379
+ margin-bottom: unset;
380
+ }
381
+ }
382
+
383
+ .generic_files {
384
+ padding: 0px 5px !important;
385
+ > div > div > div {
386
+ text-align: left;
387
+ align-self: center;
388
+ .form-group {
389
+ margin-bottom: 0px;
390
+ }
391
+ }
392
+ }
393
+
394
+ .grid-btn-none {
395
+ font-size: large;
396
+ color: white;
397
+ }
398
+
399
+ .generic_grid_dnd {
400
+ .dnd {
401
+ cursor: move;
402
+ }
403
+ .dnd-btn {
404
+ font-size: large;
405
+ span {
406
+ cursor: move;
407
+ }
408
+ }
409
+ &.can-drop {
410
+ border: 2px dashed $color-can-drop;
411
+ color: $color-can-drop;
412
+ }
413
+ &.is-over {
414
+ border: 2px dashed $color-is-over;
415
+ color: $color-is-over;
416
+ }
417
+ &.is-dragging {
418
+ opacity: 0.2;
419
+ }
420
+ }
421
+
422
+ .generic_layer_modal {
423
+ > .layer_header {
424
+ background-color: white;
425
+ color: $colo-bs-primary;
426
+ font-size: 20px;
427
+ }
428
+ > .panel-body {
429
+ background-color: #d9edf7;
430
+ }
431
+ }
432
+
433
+ .generic_layer_column {
434
+ @include generic_grid_cell;
435
+ border: 1px solid $colo-bs-primary;
436
+ background-color: white;
437
+ margin: 5px;
438
+ padding: 10px;
439
+ color: $colo-bs-primary;
440
+ border-radius: 4px;
441
+ }
442
+
443
+ .generic_layer_column > div:first-child {
444
+ display: flex;
445
+ }
446
+
447
+ .generic_layer_column > div:first-child > button {
448
+ float: right;
449
+ border-radius: 50%;
450
+ }
451
+
452
+ .generic_layer_column > div:first-child > div {
453
+ width: 100%;
454
+ }
455
+
456
+ .generic_wf_modal {
457
+ max-height: 100%;
458
+ overflow: auto;
459
+ }
460
+
461
+ .generic_wf_modal > div:first-child {
462
+ height: 85vh;
463
+ width: 100%;
464
+ }
465
+
466
+ .flow_view_draggable {
467
+ z-index: 100;
468
+ position: absolute;
469
+ top: 12%;
470
+ left: 10%;
471
+ .panel-body {
472
+ padding: 5px;
473
+ > .body_bg {
474
+ max-height: 100%;
475
+ overflow: auto;
476
+ background-color: #d9edf7;
477
+ > .body_canvas {
478
+ resize: both;
479
+ overflow: auto;
480
+ height: 70vh;
481
+ width: 40vw;
482
+ min-height: 250px;
483
+ min-width: 300px;
484
+ max-width: 1600px;
485
+ max-height: 840px;
486
+ }
487
+ }
488
+ }
489
+ }
@@ -13,10 +13,6 @@ var _lodash = require("lodash");
13
13
 
14
14
  var _reactBootstrap = require("react-bootstrap");
15
15
 
16
- var _reactDnd = require("react-dnd");
17
-
18
- var _reactDndHtml5Backend = _interopRequireDefault(require("react-dnd-html5-backend"));
19
-
20
16
  var _LayersLayout = _interopRequireDefault(require("../layers/LayersLayout"));
21
17
 
22
18
  var _utils = require("../tools/utils");
@@ -271,8 +267,7 @@ GenericDSDetails.defaultProps = {
271
267
  kind: '',
272
268
  genericDS: {},
273
269
  klass: {}
274
- };
275
-
276
- var _default = (0, _reactDnd.DragDropContext)(_reactDndHtml5Backend.default)(GenericDSDetails);
270
+ }; // export default DragDropContext(HTML5Backend)(GenericDSDetails);
277
271
 
272
+ var _default = GenericDSDetails;
278
273
  exports.default = _default;
@@ -13,10 +13,6 @@ var _lodash = require("lodash");
13
13
 
14
14
  var _reactBootstrap = require("react-bootstrap");
15
15
 
16
- var _reactDnd = require("react-dnd");
17
-
18
- var _reactDndHtml5Backend = _interopRequireDefault(require("react-dnd-html5-backend"));
19
-
20
16
  var _LayersLayout = _interopRequireDefault(require("../layers/LayersLayout"));
21
17
 
22
18
  var _utils = require("../tools/utils");
@@ -564,8 +560,7 @@ SegmentDetails.propTypes = {
564
560
  SegmentDetails.defaultProps = {
565
561
  segment: {},
566
562
  klass: {}
567
- };
568
-
569
- var _default = (0, _reactDnd.DragDropContext)(_reactDndHtml5Backend.default)(SegmentDetails);
563
+ }; // export default DragDropContext(HTML5Backend)(SegmentDetails);
570
564
 
565
+ var _default = SegmentDetails;
571
566
  exports.default = _default;
@@ -11,13 +11,13 @@ var _propTypes = _interopRequireDefault(require("prop-types"));
11
11
 
12
12
  var _reactBootstrap = require("react-bootstrap");
13
13
 
14
- var _uuid = _interopRequireDefault(require("uuid"));
14
+ var _uuid = require("uuid");
15
15
 
16
16
  function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
17
17
 
18
18
  var ButtonTooltip = function ButtonTooltip(props) {
19
19
  var tip = /*#__PURE__*/_react.default.createElement(_reactBootstrap.Tooltip, {
20
- id: _uuid.default.v4()
20
+ id: (0, _uuid.v4)()
21
21
  }, props.tip);
22
22
 
23
23
  var size = props.size,
@@ -197,7 +197,7 @@ var GenPropertiesDrop = function GenPropertiesDrop(opt) {
197
197
  }, dragTarget, createOpt, /*#__PURE__*/_react.default.createElement("div", null, /*#__PURE__*/_react.default.createElement(_reactBootstrap.OverlayTrigger, {
198
198
  placement: "top",
199
199
  overlay: /*#__PURE__*/_react.default.createElement(_reactBootstrap.Tooltip, {
200
- id: _uuid.v4.v4()
200
+ id: (0, _uuid.v4)()
201
201
  }, "remove")
202
202
  }, /*#__PURE__*/_react.default.createElement(_reactBootstrap.Button, {
203
203
  className: "btn_del",
@@ -234,7 +234,7 @@ var GenPropertiesInputGroup = function GenPropertiesInputGroup(opt) {
234
234
 
235
235
  var fLab = function fLab(e) {
236
236
  return /*#__PURE__*/_react.default.createElement("div", {
237
- key: _uuid.v4.v4(),
237
+ key: (0, _uuid.v4)(),
238
238
  className: "form-control g_input_group_label"
239
239
  }, e.value);
240
240
  };
@@ -23,9 +23,7 @@ var SamOption = function SamOption(props) {
23
23
  var data = node.data;
24
24
  var fValue = data[sField.id] && data[sField.id].value || {};
25
25
  if (!fValue.is_new) return /*#__PURE__*/_react.default.createElement("div", null);
26
-
27
- var rUUID = _uuid.v4.v4();
28
-
26
+ var rUUID = (0, _uuid.v4)();
29
27
  return /*#__PURE__*/_react.default.createElement("div", {
30
28
  className: "generic_sam_options"
31
29
  }, /*#__PURE__*/_react.default.createElement(_reactBootstrap.OverlayTrigger, {
@@ -47,8 +47,7 @@ var uploadFiles = function uploadFiles(properties, event, field, layer) {
47
47
  case 'f':
48
48
  {
49
49
  (event.val || []).forEach(function (file) {
50
- var uid = _uuid.v4.v4();
51
-
50
+ var uid = (0, _uuid.v4)();
52
51
  if (typeof value.files === 'undefined' || value.files === null) value.files = [];
53
52
  value.files.push({
54
53
  uid: uid,