diff --git a/spiffworkflow-frontend/package-lock.json b/spiffworkflow-frontend/package-lock.json
index fae995ecf..c5c82559a 100644
--- a/spiffworkflow-frontend/package-lock.json
+++ b/spiffworkflow-frontend/package-lock.json
@@ -12,7 +12,7 @@
"@babel/plugin-transform-react-jsx": "^7.18.6",
"@babel/preset-react": "^7.18.6",
"@carbon/icons-react": "^11.10.0",
- "@carbon/react": "^1.27.0",
+ "@carbon/react": "^1.33.0",
"@carbon/styles": "^1.16.0",
"@casl/ability": "^6.3.2",
"@casl/react": "^3.1.0",
@@ -2133,35 +2133,35 @@
"integrity": "sha512-umeLoy8erTiFCG92Z29kJ8VH6fHfFE+75HwQH/WwIRqa2AvNYrkSCNpXtTGwW/EjnyvGA6VcfqirZhibuuHMaA=="
},
"node_modules/@carbon/colors": {
- "version": "11.14.0",
- "resolved": "https://registry.npmjs.org/@carbon/colors/-/colors-11.14.0.tgz",
- "integrity": "sha512-SkjAmmUwdLEvu/JKPOcslbx+mrvqp+ZSvBvFP/7tjv0HYC0Khs3ltjYeSiusg/KpCoSyFM+fzEJm2qdURxC1+w=="
+ "version": "11.17.1",
+ "resolved": "https://registry.npmjs.org/@carbon/colors/-/colors-11.17.1.tgz",
+ "integrity": "sha512-Q2VlMaZcl3U9Qc1RQbhuf4M4SVuJIeE+NIIDExPCRFaWeuN/5EIUYxEkPgDqvkLU91QTu6lH8TqxFPZORlRvDA=="
},
"node_modules/@carbon/feature-flags": {
- "version": "0.13.0",
- "resolved": "https://registry.npmjs.org/@carbon/feature-flags/-/feature-flags-0.13.0.tgz",
- "integrity": "sha512-nca4aTE8Ss5NzjjK6fxR+mM63e0hDmH3nT3zDZ2pRQ23QoJzcmhZmaWQoLGd6ONa52vAuPWcVPPg/bynN07Q9w=="
+ "version": "0.15.0",
+ "resolved": "https://registry.npmjs.org/@carbon/feature-flags/-/feature-flags-0.15.0.tgz",
+ "integrity": "sha512-pUuJ+iQ+jkrfP4+nFgsBqM3qNsgKY59y0dZX1y2amjROFOo6fn5s/L1ZqAXkLWvmtssOiR1VWbYg1zk4IMTv+g=="
},
"node_modules/@carbon/grid": {
- "version": "11.13.0",
- "resolved": "https://registry.npmjs.org/@carbon/grid/-/grid-11.13.0.tgz",
- "integrity": "sha512-Jb2QaG22BXd1zvnXwkQMYxyF3Us1cY46pWzRYAy0dKQCJYaW3ii2kD1Z2aE8Ea3UYmg5CR13D7+shB/idtZG5g==",
+ "version": "11.16.1",
+ "resolved": "https://registry.npmjs.org/@carbon/grid/-/grid-11.16.1.tgz",
+ "integrity": "sha512-xrnySc/9jRebcVyATn6ArO9kQsgUcUDwrUrWPH5yt4AU7lDvzfpsxbO5NehRekURxPJjplr0DOhPAwC4qbuaaw==",
"dependencies": {
- "@carbon/layout": "^11.13.0"
+ "@carbon/layout": "^11.16.1"
}
},
"node_modules/@carbon/icon-helpers": {
- "version": "10.39.0",
- "resolved": "https://registry.npmjs.org/@carbon/icon-helpers/-/icon-helpers-10.39.0.tgz",
- "integrity": "sha512-iFWIfjKABjusb+gUz6s0FdEBHe8Ms63CKDxozhtiSZ9LfF9X5QQztO8df3szqcNsmw30pYhSnm+zJwifO9tdRw=="
+ "version": "10.42.1",
+ "resolved": "https://registry.npmjs.org/@carbon/icon-helpers/-/icon-helpers-10.42.1.tgz",
+ "integrity": "sha512-LsXHvoi/RAxYQz1GC7Ae7WOwJE4HKOXYmSOWuDEtSEW94Adz/1w968pje/7Gfr7nsJ/GcP6lNcQoSpYq9iDSpQ=="
},
"node_modules/@carbon/icons-react": {
- "version": "11.18.0",
- "resolved": "https://registry.npmjs.org/@carbon/icons-react/-/icons-react-11.18.0.tgz",
- "integrity": "sha512-gmlepMoPX1rGW8v4q/c0sD76rIWdxq3KyJ+NMtqqNsT93PjoKUxX/ROxQ4E7HMksRdU4GEJoLD29mAi73gUTUA==",
+ "version": "11.22.1",
+ "resolved": "https://registry.npmjs.org/@carbon/icons-react/-/icons-react-11.22.1.tgz",
+ "integrity": "sha512-yBbx6pAzo78V/6Z004KXNoC1w6kW/ttm/FF02s9LnOwTDYcOP7tn97YlgO+hyeMsk4Xld5GrjJ5lZI/ss8qaug==",
"hasInstallScript": true,
"dependencies": {
- "@carbon/icon-helpers": "^10.39.0",
+ "@carbon/icon-helpers": "^10.42.1",
"@carbon/telemetry": "0.1.0",
"prop-types": "^15.7.2"
},
@@ -2170,26 +2170,26 @@
}
},
"node_modules/@carbon/layout": {
- "version": "11.13.0",
- "resolved": "https://registry.npmjs.org/@carbon/layout/-/layout-11.13.0.tgz",
- "integrity": "sha512-MWVyk9NdWEpvfMSqEy1aBS9QA0Km3ADyEWW7D5c8r8+ZMrhPpJnmuCRMbBOkJYtZDfs4+7EuuKcacJ/kY51x7w=="
+ "version": "11.16.1",
+ "resolved": "https://registry.npmjs.org/@carbon/layout/-/layout-11.16.1.tgz",
+ "integrity": "sha512-uUJmNrB7GKJzR/ZEzVxqGNb7US8UB1jL0X3lia3pnyqQ8Rcxq3y1RNmj/bfuI6LWC9GA0lLrsKRdKOpdLyqJMQ=="
},
"node_modules/@carbon/motion": {
- "version": "11.10.0",
- "resolved": "https://registry.npmjs.org/@carbon/motion/-/motion-11.10.0.tgz",
- "integrity": "sha512-eKQTBvfgTI+txk4BjRTjObOnQ9/uWSRurzIQK4qXsRJZuxvyJTChw+0pKMjohfpzOOnv5E1XxyfM3MWURaGe6Q=="
+ "version": "11.13.1",
+ "resolved": "https://registry.npmjs.org/@carbon/motion/-/motion-11.13.1.tgz",
+ "integrity": "sha512-ohpfl9qVCEZzvr6cqDDEskqeTS797FSCLqADwZufbLjOBcUlRr2mq1rftTJcizLdNXutODvmFt0LJOGDOENHZg=="
},
"node_modules/@carbon/react": {
- "version": "1.27.0",
- "resolved": "https://registry.npmjs.org/@carbon/react/-/react-1.27.0.tgz",
- "integrity": "sha512-kzXmBsbiDexOzq7ljeBKjW0ym6u1uAkU5EMOs08kF/qCVo4hx3GELmmm2F4AsKG/ltdt4JQo9VlVrnr+aobFBQ==",
+ "version": "1.33.2",
+ "resolved": "https://registry.npmjs.org/@carbon/react/-/react-1.33.2.tgz",
+ "integrity": "sha512-WHJ+zv32gEerpXgPXmsdyDCOXWHTQu4Yff8VA96CNjEw7kVwDlvWVpbxm6GDnj1xdxB1bTZyXGPy//mxcj6psw==",
"hasInstallScript": true,
"dependencies": {
"@babel/runtime": "^7.18.3",
- "@carbon/feature-flags": "^0.13.0",
- "@carbon/icons-react": "^11.18.0",
- "@carbon/layout": "^11.13.0",
- "@carbon/styles": "^1.27.0",
+ "@carbon/feature-flags": "^0.15.0",
+ "@carbon/icons-react": "^11.22.1",
+ "@carbon/layout": "^11.16.1",
+ "@carbon/styles": "^1.33.1",
"@carbon/telemetry": "0.1.0",
"classnames": "2.3.2",
"copy-to-clipboard": "^3.3.1",
@@ -2214,21 +2214,26 @@
}
},
"node_modules/@carbon/styles": {
- "version": "1.27.0",
- "resolved": "https://registry.npmjs.org/@carbon/styles/-/styles-1.27.0.tgz",
- "integrity": "sha512-a+4lclMjL5Ipo7yCmkymdh3opqRmbeYeiUNfeFZOjPjvjEn3PgMsKWn1FNZszaiT/6eySJThvUtJcSXwFac1jg==",
+ "version": "1.33.1",
+ "resolved": "https://registry.npmjs.org/@carbon/styles/-/styles-1.33.1.tgz",
+ "integrity": "sha512-KnccrmaFTVLVvtvietjGD1UcelMur5JHpVAcWt1Qsk+XsgLgJ3tPU4Rf13sTz9wo0B7fP7AGlpVstWV/W+6r9Q==",
"dependencies": {
- "@carbon/colors": "^11.14.0",
- "@carbon/feature-flags": "^0.13.0",
- "@carbon/grid": "^11.13.0",
- "@carbon/layout": "^11.13.0",
- "@carbon/motion": "^11.10.0",
- "@carbon/themes": "^11.18.0",
- "@carbon/type": "^11.17.0",
+ "@carbon/colors": "^11.17.1",
+ "@carbon/feature-flags": "^0.15.0",
+ "@carbon/grid": "^11.16.1",
+ "@carbon/layout": "^11.16.1",
+ "@carbon/motion": "^11.13.1",
+ "@carbon/themes": "^11.21.1",
+ "@carbon/type": "^11.20.1",
"@ibm/plex": "6.0.0-next.6"
},
"peerDependencies": {
"sass": "^1.33.0"
+ },
+ "peerDependenciesMeta": {
+ "sass": {
+ "optional": true
+ }
}
},
"node_modules/@carbon/telemetry": {
@@ -2240,23 +2245,23 @@
}
},
"node_modules/@carbon/themes": {
- "version": "11.18.0",
- "resolved": "https://registry.npmjs.org/@carbon/themes/-/themes-11.18.0.tgz",
- "integrity": "sha512-PuMb7F9fooLYCS+8zALN656x8rv2NgjMw53Q4W8PoEh9RwDKpEihh9AwaKzNV432Ie8mOqwTZTvpAg6ZaWc4+w==",
+ "version": "11.21.1",
+ "resolved": "https://registry.npmjs.org/@carbon/themes/-/themes-11.21.1.tgz",
+ "integrity": "sha512-WMcx+RSXTSGxuqSG+6WHCCTeZ8mSaDWDOJsdp6p+bandc6OsvmrqbJDDgjE6YRucDThQYspLxRQF8i8/5mJ0sg==",
"dependencies": {
- "@carbon/colors": "^11.14.0",
- "@carbon/layout": "^11.13.0",
- "@carbon/type": "^11.17.0",
+ "@carbon/colors": "^11.17.1",
+ "@carbon/layout": "^11.16.1",
+ "@carbon/type": "^11.20.1",
"color": "^4.0.0"
}
},
"node_modules/@carbon/type": {
- "version": "11.17.0",
- "resolved": "https://registry.npmjs.org/@carbon/type/-/type-11.17.0.tgz",
- "integrity": "sha512-zQMaR1PHUY8HBlo0zRPcwEli+rD0ndejKKXGXSVVkCBX9qOr6Rp55J723Z3Fl+QNFxamhy/d0jVqRoKTUttnRQ==",
+ "version": "11.20.1",
+ "resolved": "https://registry.npmjs.org/@carbon/type/-/type-11.20.1.tgz",
+ "integrity": "sha512-CZSDN//3M7DhiMEzwNjDXpJ3Iqcaetu/hiFghxSACOuz88jni36Qj/qOg0ELZNrsswGk5GwnJx/IN1u40TAieA==",
"dependencies": {
- "@carbon/grid": "^11.13.0",
- "@carbon/layout": "^11.13.0"
+ "@carbon/grid": "^11.16.1",
+ "@carbon/layout": "^11.16.1"
}
},
"node_modules/@casl/ability": {
@@ -33666,58 +33671,58 @@
"integrity": "sha512-umeLoy8erTiFCG92Z29kJ8VH6fHfFE+75HwQH/WwIRqa2AvNYrkSCNpXtTGwW/EjnyvGA6VcfqirZhibuuHMaA=="
},
"@carbon/colors": {
- "version": "11.14.0",
- "resolved": "https://registry.npmjs.org/@carbon/colors/-/colors-11.14.0.tgz",
- "integrity": "sha512-SkjAmmUwdLEvu/JKPOcslbx+mrvqp+ZSvBvFP/7tjv0HYC0Khs3ltjYeSiusg/KpCoSyFM+fzEJm2qdURxC1+w=="
+ "version": "11.17.1",
+ "resolved": "https://registry.npmjs.org/@carbon/colors/-/colors-11.17.1.tgz",
+ "integrity": "sha512-Q2VlMaZcl3U9Qc1RQbhuf4M4SVuJIeE+NIIDExPCRFaWeuN/5EIUYxEkPgDqvkLU91QTu6lH8TqxFPZORlRvDA=="
},
"@carbon/feature-flags": {
- "version": "0.13.0",
- "resolved": "https://registry.npmjs.org/@carbon/feature-flags/-/feature-flags-0.13.0.tgz",
- "integrity": "sha512-nca4aTE8Ss5NzjjK6fxR+mM63e0hDmH3nT3zDZ2pRQ23QoJzcmhZmaWQoLGd6ONa52vAuPWcVPPg/bynN07Q9w=="
+ "version": "0.15.0",
+ "resolved": "https://registry.npmjs.org/@carbon/feature-flags/-/feature-flags-0.15.0.tgz",
+ "integrity": "sha512-pUuJ+iQ+jkrfP4+nFgsBqM3qNsgKY59y0dZX1y2amjROFOo6fn5s/L1ZqAXkLWvmtssOiR1VWbYg1zk4IMTv+g=="
},
"@carbon/grid": {
- "version": "11.13.0",
- "resolved": "https://registry.npmjs.org/@carbon/grid/-/grid-11.13.0.tgz",
- "integrity": "sha512-Jb2QaG22BXd1zvnXwkQMYxyF3Us1cY46pWzRYAy0dKQCJYaW3ii2kD1Z2aE8Ea3UYmg5CR13D7+shB/idtZG5g==",
+ "version": "11.16.1",
+ "resolved": "https://registry.npmjs.org/@carbon/grid/-/grid-11.16.1.tgz",
+ "integrity": "sha512-xrnySc/9jRebcVyATn6ArO9kQsgUcUDwrUrWPH5yt4AU7lDvzfpsxbO5NehRekURxPJjplr0DOhPAwC4qbuaaw==",
"requires": {
- "@carbon/layout": "^11.13.0"
+ "@carbon/layout": "^11.16.1"
}
},
"@carbon/icon-helpers": {
- "version": "10.39.0",
- "resolved": "https://registry.npmjs.org/@carbon/icon-helpers/-/icon-helpers-10.39.0.tgz",
- "integrity": "sha512-iFWIfjKABjusb+gUz6s0FdEBHe8Ms63CKDxozhtiSZ9LfF9X5QQztO8df3szqcNsmw30pYhSnm+zJwifO9tdRw=="
+ "version": "10.42.1",
+ "resolved": "https://registry.npmjs.org/@carbon/icon-helpers/-/icon-helpers-10.42.1.tgz",
+ "integrity": "sha512-LsXHvoi/RAxYQz1GC7Ae7WOwJE4HKOXYmSOWuDEtSEW94Adz/1w968pje/7Gfr7nsJ/GcP6lNcQoSpYq9iDSpQ=="
},
"@carbon/icons-react": {
- "version": "11.18.0",
- "resolved": "https://registry.npmjs.org/@carbon/icons-react/-/icons-react-11.18.0.tgz",
- "integrity": "sha512-gmlepMoPX1rGW8v4q/c0sD76rIWdxq3KyJ+NMtqqNsT93PjoKUxX/ROxQ4E7HMksRdU4GEJoLD29mAi73gUTUA==",
+ "version": "11.22.1",
+ "resolved": "https://registry.npmjs.org/@carbon/icons-react/-/icons-react-11.22.1.tgz",
+ "integrity": "sha512-yBbx6pAzo78V/6Z004KXNoC1w6kW/ttm/FF02s9LnOwTDYcOP7tn97YlgO+hyeMsk4Xld5GrjJ5lZI/ss8qaug==",
"requires": {
- "@carbon/icon-helpers": "^10.39.0",
+ "@carbon/icon-helpers": "^10.42.1",
"@carbon/telemetry": "0.1.0",
"prop-types": "^15.7.2"
}
},
"@carbon/layout": {
- "version": "11.13.0",
- "resolved": "https://registry.npmjs.org/@carbon/layout/-/layout-11.13.0.tgz",
- "integrity": "sha512-MWVyk9NdWEpvfMSqEy1aBS9QA0Km3ADyEWW7D5c8r8+ZMrhPpJnmuCRMbBOkJYtZDfs4+7EuuKcacJ/kY51x7w=="
+ "version": "11.16.1",
+ "resolved": "https://registry.npmjs.org/@carbon/layout/-/layout-11.16.1.tgz",
+ "integrity": "sha512-uUJmNrB7GKJzR/ZEzVxqGNb7US8UB1jL0X3lia3pnyqQ8Rcxq3y1RNmj/bfuI6LWC9GA0lLrsKRdKOpdLyqJMQ=="
},
"@carbon/motion": {
- "version": "11.10.0",
- "resolved": "https://registry.npmjs.org/@carbon/motion/-/motion-11.10.0.tgz",
- "integrity": "sha512-eKQTBvfgTI+txk4BjRTjObOnQ9/uWSRurzIQK4qXsRJZuxvyJTChw+0pKMjohfpzOOnv5E1XxyfM3MWURaGe6Q=="
+ "version": "11.13.1",
+ "resolved": "https://registry.npmjs.org/@carbon/motion/-/motion-11.13.1.tgz",
+ "integrity": "sha512-ohpfl9qVCEZzvr6cqDDEskqeTS797FSCLqADwZufbLjOBcUlRr2mq1rftTJcizLdNXutODvmFt0LJOGDOENHZg=="
},
"@carbon/react": {
- "version": "1.27.0",
- "resolved": "https://registry.npmjs.org/@carbon/react/-/react-1.27.0.tgz",
- "integrity": "sha512-kzXmBsbiDexOzq7ljeBKjW0ym6u1uAkU5EMOs08kF/qCVo4hx3GELmmm2F4AsKG/ltdt4JQo9VlVrnr+aobFBQ==",
+ "version": "1.33.2",
+ "resolved": "https://registry.npmjs.org/@carbon/react/-/react-1.33.2.tgz",
+ "integrity": "sha512-WHJ+zv32gEerpXgPXmsdyDCOXWHTQu4Yff8VA96CNjEw7kVwDlvWVpbxm6GDnj1xdxB1bTZyXGPy//mxcj6psw==",
"requires": {
"@babel/runtime": "^7.18.3",
- "@carbon/feature-flags": "^0.13.0",
- "@carbon/icons-react": "^11.18.0",
- "@carbon/layout": "^11.13.0",
- "@carbon/styles": "^1.27.0",
+ "@carbon/feature-flags": "^0.15.0",
+ "@carbon/icons-react": "^11.22.1",
+ "@carbon/layout": "^11.16.1",
+ "@carbon/styles": "^1.33.1",
"@carbon/telemetry": "0.1.0",
"classnames": "2.3.2",
"copy-to-clipboard": "^3.3.1",
@@ -33737,17 +33742,17 @@
}
},
"@carbon/styles": {
- "version": "1.27.0",
- "resolved": "https://registry.npmjs.org/@carbon/styles/-/styles-1.27.0.tgz",
- "integrity": "sha512-a+4lclMjL5Ipo7yCmkymdh3opqRmbeYeiUNfeFZOjPjvjEn3PgMsKWn1FNZszaiT/6eySJThvUtJcSXwFac1jg==",
+ "version": "1.33.1",
+ "resolved": "https://registry.npmjs.org/@carbon/styles/-/styles-1.33.1.tgz",
+ "integrity": "sha512-KnccrmaFTVLVvtvietjGD1UcelMur5JHpVAcWt1Qsk+XsgLgJ3tPU4Rf13sTz9wo0B7fP7AGlpVstWV/W+6r9Q==",
"requires": {
- "@carbon/colors": "^11.14.0",
- "@carbon/feature-flags": "^0.13.0",
- "@carbon/grid": "^11.13.0",
- "@carbon/layout": "^11.13.0",
- "@carbon/motion": "^11.10.0",
- "@carbon/themes": "^11.18.0",
- "@carbon/type": "^11.17.0",
+ "@carbon/colors": "^11.17.1",
+ "@carbon/feature-flags": "^0.15.0",
+ "@carbon/grid": "^11.16.1",
+ "@carbon/layout": "^11.16.1",
+ "@carbon/motion": "^11.13.1",
+ "@carbon/themes": "^11.21.1",
+ "@carbon/type": "^11.20.1",
"@ibm/plex": "6.0.0-next.6"
}
},
@@ -33757,23 +33762,23 @@
"integrity": "sha512-kNWt0bkgPwGW0i5h7HFuljbKRXPvIhsKbB+1tEURAYLXoJg9iJLF1eGvWN5iVoFCS2zje4GR3OGOsvvKVe7Hlg=="
},
"@carbon/themes": {
- "version": "11.18.0",
- "resolved": "https://registry.npmjs.org/@carbon/themes/-/themes-11.18.0.tgz",
- "integrity": "sha512-PuMb7F9fooLYCS+8zALN656x8rv2NgjMw53Q4W8PoEh9RwDKpEihh9AwaKzNV432Ie8mOqwTZTvpAg6ZaWc4+w==",
+ "version": "11.21.1",
+ "resolved": "https://registry.npmjs.org/@carbon/themes/-/themes-11.21.1.tgz",
+ "integrity": "sha512-WMcx+RSXTSGxuqSG+6WHCCTeZ8mSaDWDOJsdp6p+bandc6OsvmrqbJDDgjE6YRucDThQYspLxRQF8i8/5mJ0sg==",
"requires": {
- "@carbon/colors": "^11.14.0",
- "@carbon/layout": "^11.13.0",
- "@carbon/type": "^11.17.0",
+ "@carbon/colors": "^11.17.1",
+ "@carbon/layout": "^11.16.1",
+ "@carbon/type": "^11.20.1",
"color": "^4.0.0"
}
},
"@carbon/type": {
- "version": "11.17.0",
- "resolved": "https://registry.npmjs.org/@carbon/type/-/type-11.17.0.tgz",
- "integrity": "sha512-zQMaR1PHUY8HBlo0zRPcwEli+rD0ndejKKXGXSVVkCBX9qOr6Rp55J723Z3Fl+QNFxamhy/d0jVqRoKTUttnRQ==",
+ "version": "11.20.1",
+ "resolved": "https://registry.npmjs.org/@carbon/type/-/type-11.20.1.tgz",
+ "integrity": "sha512-CZSDN//3M7DhiMEzwNjDXpJ3Iqcaetu/hiFghxSACOuz88jni36Qj/qOg0ELZNrsswGk5GwnJx/IN1u40TAieA==",
"requires": {
- "@carbon/grid": "^11.13.0",
- "@carbon/layout": "^11.13.0"
+ "@carbon/grid": "^11.16.1",
+ "@carbon/layout": "^11.16.1"
}
},
"@casl/ability": {
diff --git a/spiffworkflow-frontend/package.json b/spiffworkflow-frontend/package.json
index da06a92d0..f80feaf20 100644
--- a/spiffworkflow-frontend/package.json
+++ b/spiffworkflow-frontend/package.json
@@ -7,7 +7,7 @@
"@babel/plugin-transform-react-jsx": "^7.18.6",
"@babel/preset-react": "^7.18.6",
"@carbon/icons-react": "^11.10.0",
- "@carbon/react": "^1.27.0",
+ "@carbon/react": "^1.33.0",
"@carbon/styles": "^1.16.0",
"@casl/ability": "^6.3.2",
"@casl/react": "^3.1.0",
diff --git a/spiffworkflow-frontend/src/config.tsx b/spiffworkflow-frontend/src/config.tsx
index 8edba04f4..0fbb10445 100644
--- a/spiffworkflow-frontend/src/config.tsx
+++ b/spiffworkflow-frontend/src/config.tsx
@@ -105,5 +105,6 @@ export const TIME_FORMAT_HOURS_MINUTES = 'HH:mm';
export const DATE_FORMAT = generalDateFormat;
export const DATE_FORMAT_CARBON = carbonDateFormat;
export const DATE_FORMAT_FOR_DISPLAY = generalDateFormat.toLowerCase();
+export const DATE_RANGE_DELIMITER = ':::';
export const SPIFF_ENVIRONMENT = spiffEnvironment;
diff --git a/spiffworkflow-frontend/src/rjsf/custom_widgets/DateRangePicker/DateRangePickerWidget.tsx b/spiffworkflow-frontend/src/rjsf/custom_widgets/DateRangePicker/DateRangePickerWidget.tsx
new file mode 100644
index 000000000..eb77e68bc
--- /dev/null
+++ b/spiffworkflow-frontend/src/rjsf/custom_widgets/DateRangePicker/DateRangePickerWidget.tsx
@@ -0,0 +1,136 @@
+import React, { useCallback } from 'react';
+import { DatePickerInput, DatePicker } from '@carbon/react';
+import {
+ DATE_FORMAT_CARBON,
+ DATE_FORMAT_FOR_DISPLAY,
+ DATE_RANGE_DELIMITER,
+} from '../../../config';
+import {
+ convertDateObjectToFormattedString,
+ convertStringToDate,
+} from '../../../helpers';
+
+interface widgetArgs {
+ id: string;
+ value: any;
+ schema?: any;
+ uiSchema?: any;
+ disabled?: boolean;
+ readonly?: boolean;
+ rawErrors?: any;
+ onChange?: any;
+ autofocus?: any;
+ label?: string;
+}
+
+// NOTE: To properly validate that both start and end dates are specified
+// use this pattern in schemaJson for that field:
+// "pattern": "\\d{4}-\\d{2}-\\d{2}:::\\d{4}-\\d{2}-\\d{2}"
+
+// eslint-disable-next-line sonarjs/cognitive-complexity
+export default function DateRangePickerWidget({
+ id,
+ value,
+ schema,
+ uiSchema,
+ disabled,
+ readonly,
+ onChange,
+ autofocus,
+ label,
+ rawErrors = [],
+}: widgetArgs) {
+ let invalid = false;
+ let errorMessageForField = null;
+
+ let labelToUse = label;
+ if (uiSchema && uiSchema['ui:title']) {
+ labelToUse = uiSchema['ui:title'];
+ } else if (schema && schema.title) {
+ labelToUse = schema.title;
+ }
+
+ const onChangeLocal = useCallback(
+ (dateRange: Date[]) => {
+ let dateRangeString;
+ const startDate = convertDateObjectToFormattedString(dateRange[0]);
+ if (startDate) {
+ const endDate = convertDateObjectToFormattedString(dateRange[1]);
+ dateRangeString = startDate;
+ if (endDate) {
+ dateRangeString = `${dateRangeString}${DATE_RANGE_DELIMITER}${endDate}`;
+ }
+ }
+ onChange(dateRangeString);
+ },
+ [onChange]
+ );
+
+ let helperText = null;
+ if (uiSchema && uiSchema['ui:help']) {
+ helperText = uiSchema['ui:help'];
+ }
+
+ if (!invalid && rawErrors && rawErrors.length > 0) {
+ invalid = true;
+ if ('validationErrorMessage' in schema) {
+ errorMessageForField = (schema as any).validationErrorMessage;
+ } else {
+ errorMessageForField = `${(labelToUse || '').replace(/\*$/, '')} ${
+ rawErrors[0]
+ }`;
+ }
+ }
+
+ let dateValue: (Date | null)[] | null = value;
+ const dateRegex = new RegExp(DATE_RANGE_DELIMITER);
+ if (value && dateRegex.test(value)) {
+ const [startDateString, endDateString] = value.split(DATE_RANGE_DELIMITER);
+ let startDate = null;
+ let endDate = null;
+ try {
+ startDate = convertStringToDate(startDateString);
+ // eslint-disable-next-line no-empty
+ } catch (RangeError) {}
+ try {
+ endDate = convertStringToDate(endDateString);
+ // eslint-disable-next-line no-empty
+ } catch (RangeError) {}
+
+ dateValue = [startDate, endDate];
+ }
+
+ return (
+
+
+ );
+}
diff --git a/spiffworkflow-frontend/src/routes/SecretList.tsx b/spiffworkflow-frontend/src/routes/SecretList.tsx
index be3141b95..0fb1507e6 100644
--- a/spiffworkflow-frontend/src/routes/SecretList.tsx
+++ b/spiffworkflow-frontend/src/routes/SecretList.tsx
@@ -1,7 +1,7 @@
import { useEffect, useState } from 'react';
import { Link, useSearchParams } from 'react-router-dom';
// @ts-ignore
-import { Button, Table } from '@carbon/react';
+import { Button, Table, DatePicker, DatePickerInput } from '@carbon/react';
import { MdDelete } from 'react-icons/md';
import PaginationForTable from '../components/PaginationForTable';
import HttpService from '../services/HttpService';
@@ -10,6 +10,8 @@ import { getPageInfoFromSearchParams } from '../helpers';
export default function SecretList() {
const [searchParams] = useSearchParams();
+ const [dateRange, setDateRange] = useState([]);
+
const [secrets, setSecrets] = useState([]);
const [pagination, setPagination] = useState(null);
@@ -95,6 +97,21 @@ export default function SecretList() {
return (
Secrets
+ {
+ setDateRange(selectedDates);
+ }}
+ value={dateRange}
+ dateFormat="Y-m-d"
+ datePickerType="range"
+ >
+
{SecretsDisplayArea()}
Add a secret
diff --git a/spiffworkflow-frontend/src/routes/TaskShow.tsx b/spiffworkflow-frontend/src/routes/TaskShow.tsx
index 05b83cae0..341eb9d85 100644
--- a/spiffworkflow-frontend/src/routes/TaskShow.tsx
+++ b/spiffworkflow-frontend/src/routes/TaskShow.tsx
@@ -25,6 +25,8 @@ import { ErrorForDisplay, EventDefinition, Task } from '../interfaces';
import ProcessBreadcrumb from '../components/ProcessBreadcrumb';
import InstructionsForEndUser from '../components/InstructionsForEndUser';
import TypeaheadWidget from '../rjsf/custom_widgets/TypeaheadWidget/TypeaheadWidget';
+import DateRangePickerWidget from '../rjsf/custom_widgets/DateRangePicker/DateRangePickerWidget';
+import { DATE_RANGE_DELIMITER } from '../config';
export default function TaskShow() {
const [task, setTask] = useState(null);
@@ -39,6 +41,11 @@ export default function TaskShow() {
const { addError, removeError } = useAPIError();
+ const rjsfWidgets = {
+ typeahead: TypeaheadWidget,
+ 'date-range': DateRangePickerWidget,
+ };
+
// if a user can complete a task then the for-me page should
// always work for them so use that since it will work in all cases
const navigateToInterstitial = (myTask: Task) => {
@@ -308,8 +315,12 @@ export default function TaskShow() {
errors: any,
jsonSchema: any
) => {
- const dateString = formData[propertyKey];
+ let dateString = formData[propertyKey];
if (dateString) {
+ if (typeof dateString === 'string') {
+ // in the case of date ranges, just take the start date and check that
+ [dateString] = dateString.split(DATE_RANGE_DELIMITER);
+ }
const formattedDateString = formatDateString(dateString);
const minimumDateChecks = propertyMetadata.minimumDate.split(',');
minimumDateChecks.forEach((mdc: string) => {
@@ -469,8 +480,6 @@ export default function TaskShow() {
return getFieldsWithDateValidations(jsonSchema, formData, errors);
};
- const widgets = { typeahead: TypeaheadWidget };
-
// we are using two forms here so we can have one that validates data and one that does not.
// this allows us to autosave form data without extra attributes and without validations
// but still requires validations when the user submits the form that they can edit.
@@ -488,7 +497,7 @@ export default function TaskShow() {
onSubmit={handleFormSubmit}
schema={jsonSchema}
uiSchema={formUiSchema}
- widgets={widgets}
+ widgets={rjsfWidgets}
validator={validator}
customValidate={customValidate}
omitExtraData
@@ -501,7 +510,7 @@ export default function TaskShow() {
onSubmit={handleAutosaveFormSubmit}
schema={jsonSchema}
uiSchema={formUiSchema}
- widgets={widgets}
+ widgets={rjsfWidgets}
validator={validator}
noValidate
omitExtraData