@aatulwork/customform-renderer 1.14.0 → 1.15.0

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.
Files changed (7) hide show
  1. package/dist/index.d.mts +1 -2
  2. package/dist/index.d.ts +1 -2
  3. package/dist/index.js +29 -17
  4. package/dist/index.js.map +1 -1
  5. package/dist/index.mjs +29 -17
  6. package/dist/index.mjs.map +1 -1
  7. package/package.json +1 -1
package/dist/index.d.mts CHANGED
@@ -30,9 +30,8 @@ interface FieldViewProps {
30
30
  field: FormField;
31
31
  value: any;
32
32
  services?: FormServices;
33
- colors?: FormColors;
34
33
  }
35
- declare const FieldView: ({ field, value, services, colors }: FieldViewProps) => react_jsx_runtime.JSX.Element;
34
+ declare const FieldView: ({ field, value, services }: FieldViewProps) => react_jsx_runtime.JSX.Element;
36
35
 
37
36
  interface SimpleSelectOption {
38
37
  value: string | number;
package/dist/index.d.ts CHANGED
@@ -30,9 +30,8 @@ interface FieldViewProps {
30
30
  field: FormField;
31
31
  value: any;
32
32
  services?: FormServices;
33
- colors?: FormColors;
34
33
  }
35
- declare const FieldView: ({ field, value, services, colors }: FieldViewProps) => react_jsx_runtime.JSX.Element;
34
+ declare const FieldView: ({ field, value, services }: FieldViewProps) => react_jsx_runtime.JSX.Element;
36
35
 
37
36
  interface SimpleSelectOption {
38
37
  value: string | number;
package/dist/index.js CHANGED
@@ -1404,8 +1404,9 @@ var getCachedOptions = (key) => {
1404
1404
  var setCachedOptions = (key, options) => {
1405
1405
  referenceOptionsCache.set(key, { options, timestamp: Date.now() });
1406
1406
  };
1407
- var FieldView = ({ field, value, services, colors }) => {
1408
- const formColors = useFormColors(colors);
1407
+ var FieldView = ({ field, value, services }) => {
1408
+ const fieldLabelColor = "rgba(0, 0, 0, 0.6)";
1409
+ const fieldValueColor = "text.secondary";
1409
1410
  const dateFormatter = services?.dateFormatter || defaultDateFormatterService;
1410
1411
  const FileDisplayComponent = services?.FileDisplayComponent;
1411
1412
  const CKEditorDisplayComponent = services?.CKEditorDisplayComponent;
@@ -1424,7 +1425,7 @@ var FieldView = ({ field, value, services, colors }) => {
1424
1425
  borderColor: "divider"
1425
1426
  },
1426
1427
  children: [
1427
- /* @__PURE__ */ jsxRuntime.jsx(material.Typography, { variant: "body2", sx: { fontWeight: 500 }, children: field.label }),
1428
+ /* @__PURE__ */ jsxRuntime.jsx(material.Typography, { variant: "body2", sx: { fontWeight: 500, color: fieldLabelColor }, children: field.label }),
1428
1429
  /* @__PURE__ */ jsxRuntime.jsx(FileDisplayComponent, { fieldValue: value })
1429
1430
  ]
1430
1431
  },
@@ -1443,15 +1444,24 @@ var FieldView = ({ field, value, services, colors }) => {
1443
1444
  borderColor: "divider"
1444
1445
  },
1445
1446
  children: [
1446
- /* @__PURE__ */ jsxRuntime.jsx(material.Typography, { variant: "body2", sx: { fontWeight: 500, color: formColors.primary }, children: field.label }),
1447
- /* @__PURE__ */ jsxRuntime.jsx(material.Typography, { variant: "body1", sx: { color: "text.secondary" }, children: value ? Array.isArray(value) ? `${value.length} file(s)` : "1 file" : "\u2014" })
1447
+ /* @__PURE__ */ jsxRuntime.jsx(material.Typography, { variant: "body2", sx: { fontWeight: 500, color: fieldLabelColor }, children: field.label }),
1448
+ /* @__PURE__ */ jsxRuntime.jsx(material.Typography, { variant: "body1", sx: { color: fieldValueColor }, children: value ? Array.isArray(value) ? `${value.length} file(s)` : "1 file" : "\u2014" })
1448
1449
  ]
1449
1450
  },
1450
1451
  field.name
1451
1452
  );
1452
1453
  }
1453
1454
  if (field.type === "formReference" || field.type === "apiReference") {
1454
- return /* @__PURE__ */ jsxRuntime.jsx(ReferenceFieldView, { field, value, services });
1455
+ return /* @__PURE__ */ jsxRuntime.jsx(
1456
+ ReferenceFieldView,
1457
+ {
1458
+ field,
1459
+ value,
1460
+ services,
1461
+ fieldLabelColor,
1462
+ fieldValueColor
1463
+ }
1464
+ );
1455
1465
  }
1456
1466
  if (field.type === "color") {
1457
1467
  const colorValue = value && typeof value === "string" ? value : "#000000";
@@ -1467,7 +1477,7 @@ var FieldView = ({ field, value, services, colors }) => {
1467
1477
  borderColor: "divider"
1468
1478
  },
1469
1479
  children: [
1470
- /* @__PURE__ */ jsxRuntime.jsx(material.Typography, { variant: "body2", sx: { fontWeight: 500 }, children: field.label }),
1480
+ /* @__PURE__ */ jsxRuntime.jsx(material.Typography, { variant: "body2", sx: { fontWeight: 500, color: fieldLabelColor }, children: field.label }),
1471
1481
  /* @__PURE__ */ jsxRuntime.jsx(material.Box, { sx: { display: "flex", alignItems: "center", gap: 1 }, children: value ? /* @__PURE__ */ jsxRuntime.jsx(
1472
1482
  material.Box,
1473
1483
  {
@@ -1480,7 +1490,7 @@ var FieldView = ({ field, value, services, colors }) => {
1480
1490
  borderRadius: 1
1481
1491
  }
1482
1492
  }
1483
- ) : /* @__PURE__ */ jsxRuntime.jsx(material.Typography, { variant: "body1", sx: { color: "text.disabled", fontStyle: "italic" }, children: "\u2014" }) })
1493
+ ) : /* @__PURE__ */ jsxRuntime.jsx(material.Typography, { variant: "body1", sx: { color: fieldValueColor, fontStyle: "italic" }, children: "\u2014" }) })
1484
1494
  ]
1485
1495
  },
1486
1496
  field.name
@@ -1500,7 +1510,7 @@ var FieldView = ({ field, value, services, colors }) => {
1500
1510
  borderColor: "divider"
1501
1511
  },
1502
1512
  children: [
1503
- /* @__PURE__ */ jsxRuntime.jsx(material.Typography, { variant: "body2", sx: { fontWeight: 500 }, children: field.label }),
1513
+ /* @__PURE__ */ jsxRuntime.jsx(material.Typography, { variant: "body2", sx: { fontWeight: 500, color: fieldLabelColor }, children: field.label }),
1504
1514
  /* @__PURE__ */ jsxRuntime.jsx(
1505
1515
  CKEditorDisplayComponent,
1506
1516
  {
@@ -1526,13 +1536,13 @@ var FieldView = ({ field, value, services, colors }) => {
1526
1536
  borderColor: "divider"
1527
1537
  },
1528
1538
  children: [
1529
- /* @__PURE__ */ jsxRuntime.jsx(material.Typography, { variant: "body2", sx: { fontWeight: 500 }, children: field.label }),
1539
+ /* @__PURE__ */ jsxRuntime.jsx(material.Typography, { variant: "body2", sx: { fontWeight: 500, color: fieldLabelColor }, children: field.label }),
1530
1540
  /* @__PURE__ */ jsxRuntime.jsx(
1531
1541
  material.Typography,
1532
1542
  {
1533
1543
  variant: "body1",
1534
1544
  sx: {
1535
- color: formattedValue === "\u2014" ? "text.disabled" : "text.primary",
1545
+ color: fieldValueColor,
1536
1546
  fontStyle: formattedValue === "\u2014" ? "italic" : "normal"
1537
1547
  },
1538
1548
  dangerouslySetInnerHTML: { __html: value || "" }
@@ -1555,13 +1565,13 @@ var FieldView = ({ field, value, services, colors }) => {
1555
1565
  borderColor: "divider"
1556
1566
  },
1557
1567
  children: [
1558
- /* @__PURE__ */ jsxRuntime.jsx(material.Typography, { variant: "body2", sx: { fontWeight: 500 }, children: field.label }),
1568
+ /* @__PURE__ */ jsxRuntime.jsx(material.Typography, { variant: "body2", sx: { fontWeight: 500, color: fieldLabelColor }, children: field.label }),
1559
1569
  /* @__PURE__ */ jsxRuntime.jsx(
1560
1570
  material.Typography,
1561
1571
  {
1562
1572
  variant: "body1",
1563
1573
  sx: {
1564
- color: formattedValue === "\u2014" ? "text.disabled" : "text.primary",
1574
+ color: fieldValueColor,
1565
1575
  fontStyle: formattedValue === "\u2014" ? "italic" : "normal",
1566
1576
  fontWeight: 400,
1567
1577
  fontSize: "0.875rem",
@@ -1578,7 +1588,9 @@ var FieldView = ({ field, value, services, colors }) => {
1578
1588
  var ReferenceFieldView = ({
1579
1589
  field,
1580
1590
  value,
1581
- services
1591
+ services,
1592
+ fieldLabelColor,
1593
+ fieldValueColor
1582
1594
  }) => {
1583
1595
  const [displayLabels, setDisplayLabels] = react.useState(null);
1584
1596
  react.useEffect(() => {
@@ -1642,13 +1654,13 @@ var ReferenceFieldView = ({
1642
1654
  borderColor: "divider"
1643
1655
  },
1644
1656
  children: [
1645
- /* @__PURE__ */ jsxRuntime.jsx(material.Typography, { variant: "body2", sx: { fontWeight: 500 }, children: field.label }),
1657
+ /* @__PURE__ */ jsxRuntime.jsx(material.Typography, { variant: "body2", sx: { fontWeight: 500, color: fieldLabelColor }, children: field.label }),
1646
1658
  /* @__PURE__ */ jsxRuntime.jsx(
1647
1659
  material.Typography,
1648
1660
  {
1649
1661
  variant: "body1",
1650
1662
  sx: {
1651
- color: displayText === "\u2014" ? "text.disabled" : "text.primary",
1663
+ color: fieldValueColor,
1652
1664
  fontStyle: displayText === "\u2014" ? "italic" : "normal",
1653
1665
  fontWeight: 400,
1654
1666
  fontSize: "0.875rem",
@@ -1750,7 +1762,7 @@ var FormViewMode = ({ formSchema, initialValues, hideTitle = false, services, co
1750
1762
  gridTemplateColumns: isMobile ? "repeat(1, 1fr)" : "repeat(2, 1fr)",
1751
1763
  gap: 1
1752
1764
  },
1753
- children: section.fields.map((field) => /* @__PURE__ */ jsxRuntime.jsx(FieldView, { field, value: initialValues?.[field.name], services, colors }, field.name))
1765
+ children: section.fields.map((field) => /* @__PURE__ */ jsxRuntime.jsx(FieldView, { field, value: initialValues?.[field.name], services }, field.name))
1754
1766
  }
1755
1767
  )
1756
1768
  ] })