@nys-cui/cui-formpill 0.2.7 → 0.2.8

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 (2) hide show
  1. package/package.json +1 -1
  2. package/src/cui-formpill.js +117 -8
package/package.json CHANGED
@@ -6,7 +6,7 @@
6
6
  },
7
7
  "main": "./dist/js/cui-formpill.js",
8
8
  "type": "module",
9
- "version": "0.2.7",
9
+ "version": "0.2.8",
10
10
  "scripts": {
11
11
  "clean": "rm -rf ./dist",
12
12
  "build": "npm run clean && cui --dep",
@@ -481,9 +481,26 @@ class CUI_FORMPILL extends HTMLElement {
481
481
  this.dispatchEvent(customEvent);
482
482
  this._state.adPills[i].addEventListener('pill_removed', (e) => {
483
483
  let removedValue = e.detail.state.sValue1;
484
+ // Find the index of the item in _initialState
485
+ const initialIndex = this._initialState.configData.filterCriteria.items.findIndex(item => item.value === removedValue);
486
+
487
+
488
+ // Check if the item is already in criteriaList
484
489
  if (!this._state.criteriaList.some(item => item.value === removedValue)) {
485
- this._state.criteriaList.unshift(this._state.configData.filterCriteria.items.find(item => item.value === removedValue));
490
+ // Find the item in configData.filterCriteria.items
491
+ const itemToAdd = this._state.configData.filterCriteria.items.find(item => item.value === removedValue);
492
+ if (itemToAdd) {
493
+ // Insert the item at the same position as in _initialState
494
+ if (initialIndex !== -1) {
495
+ this._state.criteriaList.splice(initialIndex, 0, itemToAdd);
496
+ } else {
497
+ // If the item is not found in _initialState, default to adding at the end
498
+ this._state.criteriaList.push(itemToAdd);
499
+ }
500
+ }
486
501
  }
502
+
503
+
487
504
  const myEvent = new CustomEvent("pill-removed", {
488
505
  detail: { pill: e.detail }
489
506
  });
@@ -891,7 +908,7 @@ class CUI_FORMPILL extends HTMLElement {
891
908
  if (controls.value.control[i].validation) {
892
909
  this.field.setAttribute('validation', controls.value.control[i].validation)
893
910
  }
894
-
911
+
895
912
  this.field.setAttribute('componentKey', controls.value.control[i].componentKey);
896
913
  dPopoverBody.insertBefore(this.field, dPopoverFooter);
897
914
  this.adFields.push(this.field);
@@ -1030,9 +1047,31 @@ class CUI_FORMPILL extends HTMLElement {
1030
1047
 
1031
1048
  formPill.addEventListener('pill_removed', (e) => {
1032
1049
  let removedValue = e.detail.state.sValue1;
1050
+ // Find the index of the item in _initialState
1051
+ const initialIndex = this._initialState.configData.filterCriteria.items.findIndex(item => item.value === removedValue);
1052
+
1053
+
1054
+ // Check if the item is already in criteriaList
1033
1055
  if (!this._state.criteriaList.some(item => item.value === removedValue)) {
1034
- this._state.criteriaList.unshift(this._state.configData.filterCriteria.items.find(item => item.value === removedValue));
1056
+ // Find the item in configData.filterCriteria.items
1057
+ const itemToAdd = this._state.configData.filterCriteria.items.find(item => item.value === removedValue);
1058
+ if (itemToAdd) {
1059
+ // Insert the item at the same position as in _initialState
1060
+ if (initialIndex !== -1) {
1061
+ this._state.criteriaList.splice(initialIndex, 0, itemToAdd);
1062
+ } else {
1063
+ // If the item is not found in _initialState, default to adding at the end
1064
+ this._state.criteriaList.push(itemToAdd);
1065
+ }
1066
+ }
1035
1067
  }
1068
+
1069
+
1070
+
1071
+
1072
+
1073
+
1074
+
1036
1075
  const myEvent = new CustomEvent("pill-removed", {
1037
1076
  detail: { pill: e.detail }
1038
1077
  });
@@ -1104,8 +1143,23 @@ class CUI_FORMPILL extends HTMLElement {
1104
1143
 
1105
1144
  formPill.addEventListener('pill_removed', (e) => {
1106
1145
  let removedValue = e.detail.state.sValue1;
1146
+ // Find the index of the item in _initialState
1147
+ const initialIndex = this._initialState.configData.filterCriteria.items.findIndex(item => item.value === removedValue);
1148
+
1149
+
1150
+ // Check if the item is already in criteriaList
1107
1151
  if (!this._state.criteriaList.some(item => item.value === removedValue)) {
1108
- this._state.criteriaList.unshift(this._state.configData.filterCriteria.items.find(item => item.value === removedValue));
1152
+ // Find the item in configData.filterCriteria.items
1153
+ const itemToAdd = this._state.configData.filterCriteria.items.find(item => item.value === removedValue);
1154
+ if (itemToAdd) {
1155
+ // Insert the item at the same position as in _initialState
1156
+ if (initialIndex !== -1) {
1157
+ this._state.criteriaList.splice(initialIndex, 0, itemToAdd);
1158
+ } else {
1159
+ // If the item is not found in _initialState, default to adding at the end
1160
+ this._state.criteriaList.push(itemToAdd);
1161
+ }
1162
+ }
1109
1163
  }
1110
1164
 
1111
1165
 
@@ -1166,8 +1220,22 @@ class CUI_FORMPILL extends HTMLElement {
1166
1220
 
1167
1221
  formPill.addEventListener('pill_removed', (e) => {
1168
1222
  let removedValue = e.detail.state.sValue1;
1223
+ // Find the index of the item in _initialState
1224
+ const initialIndex = this._initialState.configData.filterCriteria.items.findIndex(item => item.value === removedValue);
1225
+
1226
+ // Check if the item is already in criteriaList
1169
1227
  if (!this._state.criteriaList.some(item => item.value === removedValue)) {
1170
- this._state.criteriaList.unshift(this._state.configData.filterCriteria.items.find(item => item.value === removedValue));
1228
+ // Find the item in configData.filterCriteria.items
1229
+ const itemToAdd = this._state.configData.filterCriteria.items.find(item => item.value === removedValue);
1230
+ if (itemToAdd) {
1231
+ // Insert the item at the same position as in _initialState
1232
+ if (initialIndex !== -1) {
1233
+ this._state.criteriaList.splice(initialIndex, 0, itemToAdd);
1234
+ } else {
1235
+ // If the item is not found in _initialState, default to adding at the end
1236
+ this._state.criteriaList.push(itemToAdd);
1237
+ }
1238
+ }
1171
1239
  }
1172
1240
 
1173
1241
 
@@ -1225,16 +1293,57 @@ class CUI_FORMPILL extends HTMLElement {
1225
1293
  for (const [k, v] of Object.entries(pill)) {
1226
1294
  formPill.setAttribute(k, v);
1227
1295
  }
1228
-
1296
+ // 'text': `${this.criteria._state.aItems.find(item => item.value === this.criteria.value)?.label}: ${this.dValueField.value}`
1229
1297
  let pillText;
1230
1298
 
1231
1299
  if (pill.value2 != null && pill.value3 != null) {
1232
1300
  pillText = `${this._state.configData.filterCriteria.items.find(item => item.value === pill.value1)?.label}: ${pill.value3}`
1233
1301
  } else if (pill.values != null) {
1234
- pillText = `${this._state.configData.filterCriteria.items.find(item => item.value === pill.value1)?.label}: ${pill.values}`
1302
+ const foundItem = this._state.configData.filterCriteria.items.find(item => item.value === pill.value1);
1303
+ if (foundItem) {
1304
+ const labelsArray = [];
1305
+
1306
+ // Loop through each value in pill.values
1307
+ for (const val of pill.values) {
1308
+ const option = foundItem.controls.value.options.find(opt => opt.value === val);
1309
+ if (option) {
1310
+ labelsArray.push(option.label);
1311
+ } else {
1312
+ // If label not found, use the original value
1313
+ labelsArray.push(val);
1314
+ }
1315
+ }
1316
+
1317
+ // Join the labels with commas
1318
+ const labelsString = labelsArray.join(', ');
1319
+
1320
+ // Assign the label string to pillText
1321
+ pillText = `${foundItem.label}: ${labelsString}`;
1322
+ }
1235
1323
  } else if (pill.value2 != null) {
1236
- pillText = `${this._state.configData.filterCriteria.items.find(item => item.value === pill.value1)?.label}: ${pill.value2}`
1324
+ const foundItem = this._state.configData.filterCriteria.items.find(item => item.value === pill.value1);
1325
+ if (foundItem) {
1326
+ // Split value2 by commas and trim whitespace
1327
+ const values = pill.value2.split(',').map(v => v.trim());
1328
+ const labelsArray = [];
1329
+
1330
+ // Loop through each value and find its label in options
1331
+ for (const val of values) {
1332
+ const option = foundItem.controls.value.options.find(opt => opt.value === val);
1333
+ if (option) {
1334
+ labelsArray.push(option.label);
1335
+ } else {
1336
+ // If label not found, use the original value
1337
+ labelsArray.push(val);
1338
+ }
1339
+ }
1340
+
1341
+ // Join the found labels with commas
1342
+ const labelsString = labelsArray.join(', ');
1237
1343
 
1344
+ // Assign the label string to pillText
1345
+ pillText = `${foundItem.label}: ${labelsString}`;
1346
+ }
1238
1347
  }
1239
1348
 
1240
1349
  formPill.setAttribute('text', pillText.slice(0, 30) + (pillText.length > 30 ? "..." : ""))