@visns-studio/visns-components 4.2.11 → 4.2.13

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.
@@ -1145,8 +1145,6 @@ function Field({
1145
1145
  }
1146
1146
  }
1147
1147
 
1148
- console.info(inputValue);
1149
-
1150
1148
  return (
1151
1149
  <table className={styles.contentTable}>
1152
1150
  <thead>
@@ -1250,18 +1248,34 @@ function Field({
1250
1248
  <td
1251
1249
  key={`${settings.id}}-${cellKey}-input`}
1252
1250
  >
1253
- <input
1254
- type="text"
1255
- value={cell || ''}
1256
- data-id={settings.id}
1257
- onChange={(e) =>
1258
- onChangeTableText(
1259
- e,
1260
- rowKey,
1261
- cellKey
1262
- )
1263
- }
1264
- />
1251
+ {tableTextColumns[cellKey]
1252
+ .type === 'checkbox' ? (
1253
+ <input
1254
+ type={'checkbox'}
1255
+ checked={cell || false}
1256
+ data-id={settings.id}
1257
+ onChange={(e) =>
1258
+ onChangeTableText(
1259
+ e,
1260
+ rowKey,
1261
+ cellKey
1262
+ )
1263
+ }
1264
+ />
1265
+ ) : (
1266
+ <input
1267
+ type={'text'}
1268
+ value={cell || ''}
1269
+ data-id={settings.id}
1270
+ onChange={(e) =>
1271
+ onChangeTableText(
1272
+ e,
1273
+ rowKey,
1274
+ cellKey
1275
+ )
1276
+ }
1277
+ />
1278
+ )}
1265
1279
  </td>
1266
1280
  ))}
1267
1281
  </tr>
@@ -285,7 +285,7 @@ const GenericDynamic = ({
285
285
  };
286
286
 
287
287
  const handleChangeTableText = (e, rowIndex, columnIndex) => {
288
- const { value } = e.target;
288
+ const { value, checked, type } = e.target;
289
289
  const { id } = e.target.dataset;
290
290
 
291
291
  setActiveForm((prevActiveForm) => {
@@ -299,7 +299,11 @@ const GenericDynamic = ({
299
299
  (row, index) =>
300
300
  index === rowIndex
301
301
  ? row.map((cell, colIndex) =>
302
- colIndex === columnIndex ? value : cell
302
+ colIndex === columnIndex
303
+ ? type === 'checkbox'
304
+ ? checked
305
+ : value
306
+ : cell
303
307
  )
304
308
  : row
305
309
  );
@@ -352,7 +356,6 @@ const GenericDynamic = ({
352
356
  });
353
357
  }
354
358
  } catch (err) {
355
- console.error(err);
356
359
  toast.update(toastId, {
357
360
  render: 'Error downloading form',
358
361
  type: 'error',
@@ -42,6 +42,7 @@ function GenericFormBuilder({ setting, urlParam, userProfile }) {
42
42
  const [dataOption, setDataOption] = useState({
43
43
  id: '',
44
44
  label: '',
45
+ type: '',
45
46
  });
46
47
  const [rowOption, setRowOption] = useState({
47
48
  id: '',
@@ -83,6 +84,7 @@ function GenericFormBuilder({ setting, urlParam, userProfile }) {
83
84
  setDataOption(() => ({
84
85
  id: '',
85
86
  label: '',
87
+ type: '',
86
88
  }));
87
89
  } else {
88
90
  toast.warn('Option label must be unique.');
@@ -1034,28 +1036,18 @@ function GenericFormBuilder({ setting, urlParam, userProfile }) {
1034
1036
  value={dataField.size}
1035
1037
  onChange={handleChangeForm}
1036
1038
  >
1037
- {dataField.type ===
1038
- 'section' ? (
1039
- <option value="full">
1040
- Full
1041
- </option>
1042
- ) : (
1043
- <>
1044
- <option>
1045
- Please Select an
1046
- Option
1047
- </option>
1048
- <option value="quarter">
1049
- Quarter
1050
- </option>
1051
- <option value="half">
1052
- Half
1053
- </option>
1054
- <option value="full">
1055
- Full
1056
- </option>
1057
- </>
1058
- )}
1039
+ <option>
1040
+ Please Select an Option
1041
+ </option>
1042
+ <option value="quarter">
1043
+ Quarter
1044
+ </option>
1045
+ <option value="half">
1046
+ Half
1047
+ </option>
1048
+ <option value="full">
1049
+ Full
1050
+ </option>
1059
1051
  </select>
1060
1052
  <span className={styles.fi__span}>
1061
1053
  Size *
@@ -1192,7 +1184,6 @@ function GenericFormBuilder({ setting, urlParam, userProfile }) {
1192
1184
  'checkbox',
1193
1185
  'dropdown',
1194
1186
  'table_radio',
1195
- 'table_text',
1196
1187
  ].includes(dataField.type) ? (
1197
1188
  <div
1198
1189
  className={`${styles.formItem} ${styles.fwItem}`}
@@ -1338,6 +1329,175 @@ function GenericFormBuilder({ setting, urlParam, userProfile }) {
1338
1329
  </div>
1339
1330
  ) : null}
1340
1331
 
1332
+ {['table_text'].includes(dataField.type) ? (
1333
+ <div
1334
+ className={`${styles.formItem} ${styles.fwItem}`}
1335
+ >
1336
+ <table
1337
+ className={styles.contentTable}
1338
+ >
1339
+ <thead
1340
+ className={
1341
+ styles.gridHeaders
1342
+ }
1343
+ >
1344
+ <tr>
1345
+ <th
1346
+ style={{
1347
+ width: '450px',
1348
+ }}
1349
+ >
1350
+ Column Header
1351
+ </th>
1352
+ <th>Column Type</th>
1353
+ <th></th>
1354
+ </tr>
1355
+ </thead>
1356
+ <tbody>
1357
+ {dataField.options.length >
1358
+ 0 ? (
1359
+ dataField.options.map(
1360
+ (
1361
+ option,
1362
+ optionKey
1363
+ ) => (
1364
+ <tr
1365
+ key={`option-${optionKey}`}
1366
+ >
1367
+ <td>
1368
+ {
1369
+ option.label
1370
+ }
1371
+ </td>
1372
+ <td>
1373
+ {
1374
+ option.type
1375
+ }
1376
+ </td>
1377
+ <td
1378
+ style={{
1379
+ textAlign:
1380
+ 'center',
1381
+ }}
1382
+ >
1383
+ <button
1384
+ className={
1385
+ styles.btn
1386
+ }
1387
+ style={{
1388
+ padding:
1389
+ '5px 20px',
1390
+ }}
1391
+ onClick={
1392
+ handleDeleteOption
1393
+ }
1394
+ data-counter={
1395
+ optionKey
1396
+ }
1397
+ data-tooltip-id="system-tooltip"
1398
+ data-tooltip-content={
1399
+ 'Delete Option'
1400
+ }
1401
+ >
1402
+ <TrashCan
1403
+ strokeWidth={
1404
+ 2
1405
+ }
1406
+ size={
1407
+ 12
1408
+ }
1409
+ />
1410
+ </button>
1411
+ </td>
1412
+ </tr>
1413
+ )
1414
+ )
1415
+ ) : (
1416
+ <tr>
1417
+ <td colSpan="2">
1418
+ No entry have
1419
+ been added.
1420
+ </td>
1421
+ </tr>
1422
+ )}
1423
+ </tbody>
1424
+ <tfoot>
1425
+ <tr>
1426
+ <td>
1427
+ <input
1428
+ type="text"
1429
+ style={{
1430
+ padding:
1431
+ '5px',
1432
+ }}
1433
+ name="label"
1434
+ onChange={
1435
+ handleDataOption
1436
+ }
1437
+ value={
1438
+ dataOption.label
1439
+ }
1440
+ />
1441
+ </td>
1442
+ <td>
1443
+ <select
1444
+ name="type"
1445
+ value={
1446
+ dataOption.type
1447
+ }
1448
+ onChange={
1449
+ handleDataOption
1450
+ }
1451
+ >
1452
+ <option>
1453
+ Please
1454
+ Select an
1455
+ Option
1456
+ </option>
1457
+ <option value="text">
1458
+ Text
1459
+ </option>
1460
+ <option value="checkbox">
1461
+ Checkbox
1462
+ </option>
1463
+ </select>
1464
+ </td>
1465
+ <td
1466
+ style={{
1467
+ textAlign:
1468
+ 'center',
1469
+ }}
1470
+ >
1471
+ <button
1472
+ className={
1473
+ styles.btn
1474
+ }
1475
+ style={{
1476
+ padding:
1477
+ '5px 20px',
1478
+ }}
1479
+ onClick={
1480
+ handleAddOption
1481
+ }
1482
+ data-tooltip-id="system-tooltip"
1483
+ data-tooltip-content={
1484
+ 'Add Option'
1485
+ }
1486
+ >
1487
+ <CirclePlus
1488
+ strokeWidth={
1489
+ 2
1490
+ }
1491
+ size={12}
1492
+ />
1493
+ </button>
1494
+ </td>
1495
+ </tr>
1496
+ </tfoot>
1497
+ </table>
1498
+ </div>
1499
+ ) : null}
1500
+
1341
1501
  {['signature'].includes(dataField.type) ? (
1342
1502
  <div className={styles.formItem}>
1343
1503
  <label className={styles.fi__label}>
@@ -1395,7 +1555,7 @@ function GenericFormBuilder({ setting, urlParam, userProfile }) {
1395
1555
  </tr>
1396
1556
  </thead>
1397
1557
  <tbody>
1398
- {dataField.rows.length >
1558
+ {dataField.rows?.length >
1399
1559
  0 ? (
1400
1560
  dataField.rows.map(
1401
1561
  (row, rowKey) => (
package/package.json CHANGED
@@ -57,7 +57,7 @@
57
57
  "react-dom": "^17.0.1"
58
58
  },
59
59
  "name": "@visns-studio/visns-components",
60
- "version": "4.2.11",
60
+ "version": "4.2.13",
61
61
  "description": "Various packages to assist in the development of our Custom Applications.",
62
62
  "main": "index.js",
63
63
  "scripts": {