@visns-studio/visns-components 4.2.12 → 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.');
@@ -1182,7 +1184,6 @@ function GenericFormBuilder({ setting, urlParam, userProfile }) {
1182
1184
  'checkbox',
1183
1185
  'dropdown',
1184
1186
  'table_radio',
1185
- 'table_text',
1186
1187
  ].includes(dataField.type) ? (
1187
1188
  <div
1188
1189
  className={`${styles.formItem} ${styles.fwItem}`}
@@ -1328,6 +1329,175 @@ function GenericFormBuilder({ setting, urlParam, userProfile }) {
1328
1329
  </div>
1329
1330
  ) : null}
1330
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
+
1331
1501
  {['signature'].includes(dataField.type) ? (
1332
1502
  <div className={styles.formItem}>
1333
1503
  <label className={styles.fi__label}>
@@ -1385,7 +1555,7 @@ function GenericFormBuilder({ setting, urlParam, userProfile }) {
1385
1555
  </tr>
1386
1556
  </thead>
1387
1557
  <tbody>
1388
- {dataField.rows.length >
1558
+ {dataField.rows?.length >
1389
1559
  0 ? (
1390
1560
  dataField.rows.map(
1391
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.12",
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": {