@abgov/jsonforms-components 2.48.0 → 2.48.2

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/index.esm.js CHANGED
@@ -1,21 +1,21 @@
1
1
  import * as runtime from 'react/jsx-runtime';
2
2
  import { jsx, Fragment, jsxs } from 'react/jsx-runtime';
3
3
  import React, { createContext, useContext, useReducer, useMemo, useEffect, useCallback, useRef, useState, useLayoutEffect } from 'react';
4
- import { GoabFormItem, GoabInput, GoabTextArea, GoabCallout, GoabRadioGroup, GoabRadioItem, GoabCheckbox, GoabIcon, GoabButton, GoabGrid, GoabIconButton, GoabModal, GoabButtonGroup, GoabTable, GoabContainer, GoabDropdown, GoabDropdownItem, GoabDetails, GoabFormStepper, GoabFormStep, GoabPages, GoabBadge, GoabText, GoabFileUploadInput, GoabCircularProgress, GoabSpinner } from '@abgov/react-components';
4
+ import { GoabFormItem, GoabInput, GoabTextArea, GoabCallout, GoabRadioGroup, GoabRadioItem, GoabCheckbox, GoabIcon, GoabButton, GoabGrid, GoabIconButton, GoabTable, GoabModal, GoabButtonGroup, GoabContainer, GoabDropdown, GoabDropdownItem, GoabDetails, GoabFormStepper, GoabFormStep, GoabPages, GoabBadge, GoabText, GoabFileUploadInput, GoabCircularProgress, GoabSpinner } from '@abgov/react-components';
5
5
  import styled from 'styled-components';
6
6
  import axios from 'axios';
7
7
  import get$1 from 'lodash/get';
8
- import { isVisible, isEnabled, deriveLabelForUISchemaElement, rankWith, isStringControl, and, optionIs, isDateControl, isNumberControl, isIntegerControl, isDateTimeControl, isTimeControl, uiTypeIs, isControl as isControl$1, isEnumControl, isBooleanControl, createDefaultValue, Paths, toDataPath, Resolve, schemaMatches, getAjv, or, isObjectArrayControl, isPrimitiveArrayControl, composePaths, schemaTypeIs, formatIs, hasType, isCategorization, isLayout } from '@jsonforms/core';
8
+ import { isVisible, isEnabled, deriveLabelForUISchemaElement, rankWith, isStringControl, and, optionIs, isDateControl, isNumberControl, isIntegerControl, isDateTimeControl, isTimeControl, uiTypeIs, isControl as isControl$1, isEnumControl, isBooleanControl, createDefaultValue, Paths, Resolve, toDataPath, schemaMatches, getAjv, or, isObjectArrayControl, isPrimitiveArrayControl, composePaths, schemaTypeIs, formatIs, hasType, isCategorization, isLayout } from '@jsonforms/core';
9
9
  import * as _$c from 'lodash';
10
10
  import ___default, { isEqual, isObject as isObject$i, isEmpty as isEmpty$1 } from 'lodash';
11
11
  import { useJsonForms, withJsonFormsControlProps, withJsonFormsEnumProps, withTranslateProps, JsonFormsDispatch, withJsonFormsAllOfProps, withJsonFormsArrayLayoutProps, withJsonFormsLayoutProps, withJsonFormsCellProps } from '@jsonforms/react';
12
12
  import Ajv from 'ajv';
13
+ import dompurify from 'dompurify';
14
+ import * as xss from 'xss';
13
15
  import merge from 'lodash/merge';
14
16
  import isEmpty from 'lodash/isEmpty';
15
17
  import range from 'lodash/range';
16
18
  import pluralize from 'pluralize';
17
- import dompurify from 'dompurify';
18
- import * as xss from 'xss';
19
19
  import { evaluateSync, compileSync } from '@mdx-js/mdx';
20
20
  import { Parser } from 'expr-eval-fork';
21
21
  import addErrors from 'ajv-errors';
@@ -8004,6 +8004,81 @@ const GoATimeControl = props => jsx(GoAInputBaseControl, Object.assign({}, props
8004
8004
  const GoATimeControlTester = rankWith(4, isTimeControl);
8005
8005
  const GoAInputTimeControl = withJsonFormsControlProps(GoATimeControl);
8006
8006
 
8007
+ const options = {
8008
+ whiteList: {
8009
+ html: ['lang'],
8010
+ meta: ['name', 'content', 'charset'],
8011
+ div: ['style', 'class'],
8012
+ style: [],
8013
+ a: ['href', 'title', 'target', 'style', 'class'],
8014
+ em: [],
8015
+ main: [],
8016
+ footer: ['style'],
8017
+ header: ['style'],
8018
+ head: [],
8019
+ abbr: ['title', 'style'],
8020
+ title: [],
8021
+ address: ['style'],
8022
+ area: ['shape', 'coords', 'href', 'alt', 'style'],
8023
+ article: [],
8024
+ blockquote: [],
8025
+ aside: [],
8026
+ details: [],
8027
+ h1: [],
8028
+ h2: [],
8029
+ h3: [],
8030
+ h4: [],
8031
+ h5: [],
8032
+ h6: [],
8033
+ hr: [],
8034
+ i: [],
8035
+ img: ['src', 'alt', 'title', 'width', 'height'],
8036
+ ins: ['datetime'],
8037
+ li: [],
8038
+ mark: [],
8039
+ nav: [],
8040
+ ol: [],
8041
+ p: [],
8042
+ pre: [],
8043
+ s: [],
8044
+ section: [],
8045
+ small: [],
8046
+ span: ['class', 'style'],
8047
+ sub: [],
8048
+ summary: [],
8049
+ sup: [],
8050
+ select: [],
8051
+ optgroup: [],
8052
+ form: [],
8053
+ strong: [],
8054
+ label: [],
8055
+ strike: [],
8056
+ table: ['width', 'border', 'align', 'valign', 'class', 'style'],
8057
+ tbody: ['align', 'valign', 'class', 'style'],
8058
+ body: ['class', 'style'],
8059
+ td: ['width', 'rowspan', 'colspan', 'align', 'valign', 'class', 'style'],
8060
+ tfoot: ['align', 'valign', 'class', 'style'],
8061
+ th: ['width', 'rowspan', 'colspan', 'align', 'valign', 'class', 'style'],
8062
+ thead: ['align', 'valign'],
8063
+ tr: ['rowspan', 'align', 'valign'],
8064
+ tt: [],
8065
+ u: [],
8066
+ ul: [],
8067
+ br: [],
8068
+ b: [],
8069
+ option: []
8070
+ }
8071
+ }; // Custom rules
8072
+ new xss.FilterXSS(options);
8073
+ const sanitizeHtml = dompurify.sanitize;
8074
+ dompurify.addHook('afterSanitizeAttributes', function (node) {
8075
+ // set all elements owning target to target=_blank
8076
+ if ('target' in node) {
8077
+ node.setAttribute('target', '_blank');
8078
+ node.setAttribute('rel', 'noopener noreferrer');
8079
+ }
8080
+ });
8081
+
8007
8082
  // Used locally for callout presentation
8008
8083
  const callout = props => {
8009
8084
  var _componentProps$messa;
@@ -8013,9 +8088,14 @@ const callout = props => {
8013
8088
  message: 'unknown'
8014
8089
  }, props);
8015
8090
  const testid = (_componentProps$messa = componentProps.message) == null ? void 0 : _componentProps$messa.replace(/\s/g, '');
8091
+ const sanitizedHtml = sanitizeHtml(componentProps.message || '');
8016
8092
  return jsx(GoabCallout, Object.assign({}, componentProps, {
8017
8093
  "data-testid": testid,
8018
- children: componentProps == null ? void 0 : componentProps.message
8094
+ children: jsx("div", {
8095
+ dangerouslySetInnerHTML: {
8096
+ __html: sanitizedHtml
8097
+ }
8098
+ })
8019
8099
  }));
8020
8100
  };
8021
8101
  const GoACalloutController = props => {
@@ -8698,7 +8778,9 @@ let _$7 = t => t,
8698
8778
  _t23$1,
8699
8779
  _t24$1,
8700
8780
  _t25$1,
8701
- _t26$1;
8781
+ _t26$1,
8782
+ _t27$1,
8783
+ _t28$1;
8702
8784
  const DeleteDialogContent = styled.div(_t$8 || (_t$8 = _$7`
8703
8785
  margin-bottom: var(--goa-space-m);
8704
8786
  `));
@@ -8730,9 +8812,7 @@ const TextCenter = styled.div(_t7$1 || (_t7$1 = _$7`
8730
8812
  text-align: center;
8731
8813
  `));
8732
8814
  const SideMenuItem = styled.div(_t8$1 || (_t8$1 = _$7`
8733
- &:hover {
8734
- background: #f1f1f1;
8735
- }
8815
+ margin-top: 1rem;
8736
8816
  `));
8737
8817
  const RowFlex = styled.div(_t9$1 || (_t9$1 = _$7`
8738
8818
  display: flex;
@@ -8741,9 +8821,20 @@ const RowFlex = styled.div(_t9$1 || (_t9$1 = _$7`
8741
8821
  `));
8742
8822
  const RowFlexMenu = styled.div(_t0$1 || (_t0$1 = _$7`
8743
8823
  display: flex;
8744
- flex-direction: row;
8745
- border: 1px solid #dcdcdc;
8746
- margin-top: 1rem;
8824
+ flex-direction: column;
8825
+ align-items: stretch;
8826
+ border: 1px solid var(--goa-color-greyscale-300);
8827
+ border-radius: var(--goa-border-radius-m);
8828
+ margin-top: var(--goa-space-xs);
8829
+ background-color: var(--goa-color-greyscale-white);
8830
+ padding: 0;
8831
+ gap: 0;
8832
+ position: relative;
8833
+ overflow: visible;
8834
+
8835
+ &:hover {
8836
+ border-color: var(--goa-color-greyscale-400);
8837
+ }
8747
8838
  `));
8748
8839
  const FlexTabs = styled.div(_t1$1 || (_t1$1 = _$7`
8749
8840
  flex-direction: column;
@@ -8782,44 +8873,41 @@ const ListContainer = styled.div(_t14$1 || (_t14$1 = _$7`
8782
8873
  styled.div(_t15$1 || (_t15$1 = _$7`
8783
8874
  padding: 0 0 var(--goa-space-l) 0;
8784
8875
  `));
8785
- const IconPadding = styled.div(_t16$1 || (_t16$1 = _$7`
8786
- padding: 0.9rem 0.5rem 0 0;
8787
- `));
8788
- const UpdateListContainer = styled.div(_t17$1 || (_t17$1 = _$7`
8876
+ const UpdateListContainer = styled.div(_t16$1 || (_t16$1 = _$7`
8789
8877
  width: 100%;
8790
8878
  border: 1px solid #dcdcdc;
8791
8879
  padding: var(--goa-space-xl);
8792
8880
  `));
8793
- styled.div(_t18$1 || (_t18$1 = _$7`
8881
+ styled.div(_t17$1 || (_t17$1 = _$7`
8794
8882
  padding: 0 1.5rem 0 0;
8795
8883
  border: 1px solid #dcdcdc;
8796
8884
  `));
8797
- const TableTHHeader = styled.th(_t19$1 || (_t19$1 = _$7`
8885
+ const TableTHHeader = styled.th(_t18$1 || (_t18$1 = _$7`
8798
8886
  background-color: var(--goa-color-greyscale-100) !important;
8799
8887
  vertical-align: top;
8800
8888
  `));
8801
- const ObjectArrayWarningIconDiv = styled.div(_t20$1 || (_t20$1 = _$7`
8889
+ const ObjectArrayWarningIconDiv = styled.div(_t19$1 || (_t19$1 = _$7`
8802
8890
  display: inline-flex;
8803
8891
  align-items: flex-start;
8804
8892
  gap: 0.25rem;
8805
8893
  font-size: var(--goa-font-size-2);
8806
8894
  color: var(--goa-color-interactive-error);
8807
8895
  `));
8808
- const ListWithDetailWarningIconDiv = styled.div(_t21$1 || (_t21$1 = _$7`
8896
+ const ListWithDetailWarningIconDiv = styled.div(_t20$1 || (_t20$1 = _$7`
8809
8897
  display: inline-flex;
8810
8898
  align-items: flex-start;
8811
8899
  gap: 0.25rem;
8812
8900
  font-size: var(--goa-font-size-3);
8813
8901
  color: var(--goa-color-interactive-error);
8814
8902
  `));
8815
- styled.label(_t22$1 || (_t22$1 = _$7`
8903
+ styled.label(_t21$1 || (_t21$1 = _$7`
8816
8904
  color: var(--goa-color-interactive-error);
8817
8905
  font-weight: var(--goa-font-weight-regular);
8818
8906
  font-size: var(--goa-font-size-3);
8819
8907
  line-height: var(--goa-line-height-1);
8820
8908
  font-style: normal;
8821
8909
  `));
8822
- styled.div(_t23$1 || (_t23$1 = _$7`
8910
+ styled.div(_t22$1 || (_t22$1 = _$7`
8823
8911
  margin-top: var(--goa-space-m);
8824
8912
  color: var(--goa-color-interactive-error);
8825
8913
  font-weight: var(--goa-font-weight-regular);
@@ -8827,10 +8915,10 @@ styled.div(_t23$1 || (_t23$1 = _$7`
8827
8915
  line-height: var(--goa-line-height-1);
8828
8916
  font-style: normal;
8829
8917
  `));
8830
- const HilightCellWarning = styled.div(_t24$1 || (_t24$1 = _$7`
8918
+ const HilightCellWarning = styled.div(_t23$1 || (_t23$1 = _$7`
8831
8919
  background-color: var(--goa-color-warning-default);
8832
8920
  `));
8833
- const FixTableHeaderAlignment = styled.div(_t25$1 || (_t25$1 = _$7`
8921
+ const FixTableHeaderAlignment = styled.div(_t24$1 || (_t24$1 = _$7`
8834
8922
  table thead th:nth-child(3) {
8835
8923
  text-align: center;
8836
8924
  }
@@ -8839,11 +8927,31 @@ const FixTableHeaderAlignment = styled.div(_t25$1 || (_t25$1 = _$7`
8839
8927
  text-align: center;
8840
8928
  }
8841
8929
  `));
8842
- const ListWithDetailsReviewCellDiv = styled.div(_t26$1 || (_t26$1 = _$7`
8930
+ const ListWithDetailsReviewCellDiv = styled.div(_t25$1 || (_t25$1 = _$7`
8843
8931
  display: 'flex';
8844
8932
  flex-direction: 'column';
8845
8933
  text-align: 'start';
8846
8934
  `));
8935
+ const IconsContainer = styled.div(_t26$1 || (_t26$1 = _$7`
8936
+ display: flex;
8937
+ align-items: center;
8938
+ justify-content: flex-end;
8939
+ gap: var(--goa-space-xs);
8940
+ padding-bottom: var(--goa-space-xs);
8941
+ `));
8942
+ const TableContentContainer = styled.div(_t27$1 || (_t27$1 = _$7`
8943
+ padding: var(--goa-space-l);
8944
+ `));
8945
+ const NoDataMessage = styled.div(_t28$1 || (_t28$1 = _$7`
8946
+ padding: var(--goa-space-xl) var(--goa-space-l);
8947
+ color: var(--goa-color-greyscale-700);
8948
+ font: var(--goa-typography-body-m);
8949
+ text-align: center;
8950
+ display: flex;
8951
+ align-items: center;
8952
+ justify-content: center;
8953
+ min-height: 100px;
8954
+ `));
8847
8955
 
8848
8956
  const ObjectArrayToolBar = /*#__PURE__*/React.memo(function TableToolbar({
8849
8957
  data,
@@ -9125,6 +9233,134 @@ const NonEmptyRowComponent$1 = ({
9125
9233
  }) : null
9126
9234
  }, childPath);
9127
9235
  };
9236
+ function isControlElement(element) {
9237
+ return element.type === 'Control';
9238
+ }
9239
+ function isLayoutElement(element) {
9240
+ return 'elements' in element;
9241
+ }
9242
+ function extractPaths(uiSchema) {
9243
+ if (!uiSchema) {
9244
+ return [];
9245
+ }
9246
+ if (isControlElement(uiSchema)) {
9247
+ return uiSchema.scope ? [toDataPath(uiSchema.scope)] : [];
9248
+ }
9249
+ if (isLayoutElement(uiSchema)) {
9250
+ return uiSchema.elements.flatMap(extractPaths);
9251
+ }
9252
+ return [];
9253
+ }
9254
+ function getValue(obj, path) {
9255
+ return path.replace(/^\./, '').split('.').reduce((acc, part) => {
9256
+ if (acc && typeof acc === 'object' && part in acc) {
9257
+ return acc[part];
9258
+ }
9259
+ return undefined;
9260
+ }, obj);
9261
+ }
9262
+ function findLabelForPath(path, uiSchema, schema) {
9263
+ if (!uiSchema) {
9264
+ return path;
9265
+ }
9266
+ if (isControlElement(uiSchema)) {
9267
+ const controlPath = uiSchema.scope ? toDataPath(uiSchema.scope) : '';
9268
+ if (controlPath === path) {
9269
+ const label = uiSchema.label;
9270
+ if (typeof label === 'string') {
9271
+ return label;
9272
+ } else if (typeof label === 'object' && label !== null && 'text' in label) {
9273
+ return label.text || path;
9274
+ }
9275
+ return path;
9276
+ }
9277
+ }
9278
+ if (isLayoutElement(uiSchema)) {
9279
+ for (const element of uiSchema.elements) {
9280
+ const label = findLabelForPath(path, element, schema);
9281
+ if (label !== path) {
9282
+ return label;
9283
+ }
9284
+ }
9285
+ }
9286
+ if (schema != null && schema.properties) {
9287
+ const propertyKey = path.split('.').pop();
9288
+ if (propertyKey && schema.properties[propertyKey]) {
9289
+ const property = schema.properties[propertyKey];
9290
+ if (typeof property === 'object' && 'title' in property) {
9291
+ return String(property.title) || path;
9292
+ }
9293
+ }
9294
+ }
9295
+ return path;
9296
+ }
9297
+ function generateSummaryPairs(rowData, detailUiSchema, schema) {
9298
+ const paths = extractPaths(detailUiSchema);
9299
+ if (paths.length === 0) {
9300
+ return Object.entries(rowData).filter(([, value]) => value !== undefined && value !== null && value !== '').map(([key, value]) => ({
9301
+ label: findLabelForPath(key, detailUiSchema, schema),
9302
+ value
9303
+ }));
9304
+ }
9305
+ return paths.map(path => {
9306
+ const value = getValue(rowData, path);
9307
+ const label = findLabelForPath(path, detailUiSchema, schema);
9308
+ return {
9309
+ label,
9310
+ value
9311
+ };
9312
+ }).filter(({
9313
+ value
9314
+ }) => value !== undefined && value !== null && value !== '');
9315
+ }
9316
+ const SummaryDisplay = ({
9317
+ rowData,
9318
+ uischema,
9319
+ schema
9320
+ }) => {
9321
+ var _uischema$options10;
9322
+ if (!rowData || Object.keys(rowData).length === 0) {
9323
+ return jsx(NoDataMessage, {
9324
+ children: "No data"
9325
+ });
9326
+ }
9327
+ const pairs = generateSummaryPairs(rowData, uischema == null || (_uischema$options10 = uischema.options) == null ? void 0 : _uischema$options10.detail, schema);
9328
+ if (pairs.length === 0) {
9329
+ return jsx(NoDataMessage, {
9330
+ children: "No data"
9331
+ });
9332
+ }
9333
+ return jsx(GoabTable, {
9334
+ width: "100%",
9335
+ mb: "none",
9336
+ variant: "relaxed",
9337
+ children: jsx("tbody", {
9338
+ children: pairs.map((pair, index) => jsxs("tr", {
9339
+ style: {
9340
+ borderBottom: 'none'
9341
+ },
9342
+ children: [jsx("td", {
9343
+ style: {
9344
+ width: '50%',
9345
+ fontWeight: '600',
9346
+ border: 'none',
9347
+ paddingTop: 'var(--goa-space-xs)',
9348
+ paddingBottom: 'var(--goa-space-xs)'
9349
+ },
9350
+ children: pair.label
9351
+ }), jsx("td", {
9352
+ style: {
9353
+ width: '50%',
9354
+ border: 'none',
9355
+ paddingTop: 'var(--goa-space-xs)',
9356
+ paddingBottom: 'var(--goa-space-xs)'
9357
+ },
9358
+ children: String(pair.value)
9359
+ })]
9360
+ }, `${pair.label}-${index}`))
9361
+ })
9362
+ });
9363
+ };
9128
9364
  const MainItemComponent = ({
9129
9365
  childPath,
9130
9366
  rowIndex,
@@ -9134,10 +9370,12 @@ const MainItemComponent = ({
9134
9370
  currentTab,
9135
9371
  current,
9136
9372
  setCurrentListPage,
9137
- rowData
9373
+ rowData,
9374
+ uischema,
9375
+ schema
9138
9376
  }) => {
9139
9377
  const displayName = Object.keys(rowData != null ? rowData : {}).length === 0 ? 'No data' : Object.values(rowData || {}).join(', ');
9140
- return jsx(SideMenuItem, {
9378
+ return jsxs(SideMenuItem, {
9141
9379
  onClick: () => selectCurrentTab(rowIndex),
9142
9380
  onKeyDown: e => {
9143
9381
  if (e.key === 'ArrowRight') {
@@ -9152,62 +9390,32 @@ const MainItemComponent = ({
9152
9390
  }
9153
9391
  }
9154
9392
  },
9155
- children: jsxs(RowFlexMenu, {
9393
+ children: [jsxs(IconsContainer, {
9394
+ children: [jsx(GoabIconButton, {
9395
+ disabled: !enabled,
9396
+ icon: "create",
9397
+ title: 'Edit',
9398
+ testId: "edit button",
9399
+ onClick: () => setCurrentListPage(currentTab + 1)
9400
+ }), enabled ? jsx(GoabIconButton, {
9401
+ disabled: !enabled,
9402
+ icon: "trash",
9403
+ title: 'Delete',
9404
+ testId: "delete button",
9405
+ onClick: () => openDeleteDialog(childPath, rowIndex, displayName)
9406
+ }) : null]
9407
+ }), jsx(RowFlexMenu, {
9156
9408
  tabIndex: 0,
9157
- children: [jsx(TabName, {
9158
- children: displayName
9159
- }), enabled ? jsx(Trash, {
9160
- children: jsx(GoabIconButton, {
9161
- disabled: !enabled,
9162
- icon: "trash",
9163
- title: 'remove',
9164
- testId: "remove the details",
9165
- onClick: () => openDeleteDialog(childPath, rowIndex, displayName)
9166
- })
9167
- }) : null, jsx(IconPadding, {
9168
- children: jsx(GoabIconButton, {
9169
- disabled: !enabled,
9170
- icon: "create",
9171
- title: 'edit',
9172
- testId: "edit button",
9173
- onClick: () => setCurrentListPage(currentTab + 1)
9409
+ children: jsx(TableContentContainer, {
9410
+ children: jsx(SummaryDisplay, {
9411
+ rowData: rowData,
9412
+ uischema: uischema,
9413
+ schema: schema
9174
9414
  })
9175
- })]
9176
- })
9415
+ })
9416
+ })]
9177
9417
  });
9178
9418
  };
9179
- function isControlElement(element) {
9180
- return element.type === 'Control';
9181
- }
9182
- function isLayoutElement(element) {
9183
- return 'elements' in element;
9184
- }
9185
- function extractPaths(uiSchema) {
9186
- if (!uiSchema) {
9187
- return [];
9188
- }
9189
- if (isControlElement(uiSchema)) {
9190
- return uiSchema.scope ? [toDataPath(uiSchema.scope)] : [];
9191
- }
9192
- if (isLayoutElement(uiSchema)) {
9193
- return uiSchema.elements.flatMap(extractPaths);
9194
- }
9195
- return [];
9196
- }
9197
- function getValue(obj, path) {
9198
- return path.split('.').reduce((acc, key) => acc && typeof acc === 'object' ? acc[key] : undefined, obj);
9199
- }
9200
- function orderRowData(rowData, detailUiSchema) {
9201
- const orderedPaths = extractPaths(detailUiSchema);
9202
- const ordered = {};
9203
- for (const path of orderedPaths) {
9204
- const value = getValue(rowData, path);
9205
- if (value !== undefined) {
9206
- ordered[path] = value;
9207
- }
9208
- }
9209
- return ordered;
9210
- }
9211
9419
  function getEffectiveInstancePath(error) {
9212
9420
  var _error$params;
9213
9421
  if (error.keyword === 'required' && (_error$params = error.params) != null && _error$params.missingProperty) {
@@ -9350,16 +9558,16 @@ const MainTab = ({
9350
9558
  currentTab,
9351
9559
  current,
9352
9560
  setCurrentListPage,
9353
- uischema
9561
+ uischema,
9562
+ schema
9354
9563
  }) => {
9355
- var _uischema$options10, _core$errors;
9564
+ var _core$errors;
9356
9565
  /* eslint-disable @typescript-eslint/no-explicit-any */
9357
9566
  const getDataAtPath = (data, path) => path.replace(/\[(\d+)\]/g, '.$1').split('.').reduce((acc, key) => acc ? acc[key] : undefined, data);
9358
9567
  const {
9359
9568
  core
9360
9569
  } = useJsonForms();
9361
9570
  const rowData = getDataAtPath(core == null ? void 0 : core.data, childPath);
9362
- const orderedRowData = orderRowData(rowData, uischema == null || (_uischema$options10 = uischema.options) == null ? void 0 : _uischema$options10.detail);
9363
9571
  function resolveField(e) {
9364
9572
  var _e$params;
9365
9573
  if (e.keyword === 'required') {
@@ -9436,7 +9644,7 @@ const MainTab = ({
9436
9644
  children: errorText ? jsx(GoabFormItem, {
9437
9645
  error: errorText,
9438
9646
  children: jsx(MainItemComponent, {
9439
- rowData: orderedRowData,
9647
+ rowData: rowData,
9440
9648
  childPath: childPath,
9441
9649
  rowIndex: rowIndex,
9442
9650
  openDeleteDialog: openDeleteDialog,
@@ -9444,10 +9652,12 @@ const MainTab = ({
9444
9652
  enabled: enabled,
9445
9653
  currentTab: currentTab,
9446
9654
  current: current,
9447
- setCurrentListPage: setCurrentListPage
9655
+ setCurrentListPage: setCurrentListPage,
9656
+ uischema: uischema,
9657
+ schema: schema
9448
9658
  })
9449
9659
  }) : jsx(MainItemComponent, {
9450
- rowData: orderedRowData,
9660
+ rowData: rowData,
9451
9661
  childPath: childPath,
9452
9662
  rowIndex: rowIndex,
9453
9663
  openDeleteDialog: openDeleteDialog,
@@ -9455,7 +9665,9 @@ const MainTab = ({
9455
9665
  enabled: enabled,
9456
9666
  currentTab: currentTab,
9457
9667
  current: current,
9458
- setCurrentListPage: setCurrentListPage
9668
+ setCurrentListPage: setCurrentListPage,
9669
+ uischema: uischema,
9670
+ schema: schema
9459
9671
  })
9460
9672
  }, childPath);
9461
9673
  };
@@ -13322,81 +13534,6 @@ const SummaryRow = ({
13322
13534
  });
13323
13535
  };
13324
13536
 
13325
- const options = {
13326
- whiteList: {
13327
- html: ['lang'],
13328
- meta: ['name', 'content', 'charset'],
13329
- div: ['style', 'class'],
13330
- style: [],
13331
- a: ['href', 'title', 'target', 'style', 'class'],
13332
- em: [],
13333
- main: [],
13334
- footer: ['style'],
13335
- header: ['style'],
13336
- head: [],
13337
- abbr: ['title', 'style'],
13338
- title: [],
13339
- address: ['style'],
13340
- area: ['shape', 'coords', 'href', 'alt', 'style'],
13341
- article: [],
13342
- blockquote: [],
13343
- aside: [],
13344
- details: [],
13345
- h1: [],
13346
- h2: [],
13347
- h3: [],
13348
- h4: [],
13349
- h5: [],
13350
- h6: [],
13351
- hr: [],
13352
- i: [],
13353
- img: ['src', 'alt', 'title', 'width', 'height'],
13354
- ins: ['datetime'],
13355
- li: [],
13356
- mark: [],
13357
- nav: [],
13358
- ol: [],
13359
- p: [],
13360
- pre: [],
13361
- s: [],
13362
- section: [],
13363
- small: [],
13364
- span: ['class', 'style'],
13365
- sub: [],
13366
- summary: [],
13367
- sup: [],
13368
- select: [],
13369
- optgroup: [],
13370
- form: [],
13371
- strong: [],
13372
- label: [],
13373
- strike: [],
13374
- table: ['width', 'border', 'align', 'valign', 'class', 'style'],
13375
- tbody: ['align', 'valign', 'class', 'style'],
13376
- body: ['class', 'style'],
13377
- td: ['width', 'rowspan', 'colspan', 'align', 'valign', 'class', 'style'],
13378
- tfoot: ['align', 'valign', 'class', 'style'],
13379
- th: ['width', 'rowspan', 'colspan', 'align', 'valign', 'class', 'style'],
13380
- thead: ['align', 'valign'],
13381
- tr: ['rowspan', 'align', 'valign'],
13382
- tt: [],
13383
- u: [],
13384
- ul: [],
13385
- br: [],
13386
- b: [],
13387
- option: []
13388
- }
13389
- }; // Custom rules
13390
- new xss.FilterXSS(options);
13391
- const sanitizeHtml = dompurify.sanitize;
13392
- dompurify.addHook('afterSanitizeAttributes', function (node) {
13393
- // set all elements owning target to target=_blank
13394
- if ('target' in node) {
13395
- node.setAttribute('target', '_blank');
13396
- node.setAttribute('rel', 'noopener noreferrer');
13397
- }
13398
- });
13399
-
13400
13537
  const _excluded$1 = ["type"];
13401
13538
  const AdditionalInstructionsRow = ({
13402
13539
  additionalInstructions,
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@abgov/jsonforms-components",
3
- "version": "2.48.0",
3
+ "version": "2.48.2",
4
4
  "license": "Apache-2.0",
5
5
  "description": "Government of Alberta - React renderers for JSON Forms based on the design system.",
6
6
  "repository": "https://github.com/GovAlta/adsp-monorepo",
@@ -15,7 +15,6 @@ export declare const TabName: import("styled-components/dist/types").IStyledComp
15
15
  export declare const Trash: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components").FastOmit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, never>> & string;
16
16
  export declare const ListContainer: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components").FastOmit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, never>> & string;
17
17
  export declare const DetailMargin: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components").FastOmit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, never>> & string;
18
- export declare const IconPadding: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components").FastOmit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, never>> & string;
19
18
  export declare const UpdateListContainer: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components").FastOmit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, never>> & string;
20
19
  export declare const CompleteContainer: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components").FastOmit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, never>> & string;
21
20
  export declare const TableTHHeader: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components").FastOmit<import("react").DetailedHTMLProps<import("react").ThHTMLAttributes<HTMLTableHeaderCellElement>, HTMLTableHeaderCellElement>, never>> & string;
@@ -26,3 +25,6 @@ export declare const HasErrorLabel: import("styled-components/dist/types").IStyl
26
25
  export declare const HilightCellWarning: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components").FastOmit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, never>> & string;
27
26
  export declare const FixTableHeaderAlignment: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components").FastOmit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, never>> & string;
28
27
  export declare const ListWithDetailsReviewCellDiv: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components").FastOmit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, never>> & string;
28
+ export declare const IconsContainer: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components").FastOmit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, never>> & string;
29
+ export declare const TableContentContainer: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components").FastOmit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, never>> & string;
30
+ export declare const NoDataMessage: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components").FastOmit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, never>> & string;