pict-section-recordset 1.3.0 → 1.4.0

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "pict-section-recordset",
-  "version": "1.3.0",
+  "version": "1.4.0",
   "description": "Pict dynamic record set management views",
   "main": "source/Pict-Section-RecordSet.js",
   "files": [

package/source/views/Filter-PersistenceView.js

@@ -24,11 +24,15 @@ const _DEFAULT_CONFIGURATION_FilterPersistenceView = (
 	CSS: /*css*/`
 .prsp-exp { display: flex; flex-direction: column; gap: 0.4rem; }
 .prsp-exp-label { font-size: 0.72rem; font-weight: 700; text-transform: uppercase; letter-spacing: 0.05em; color: var(--theme-color-text-muted, #6b7686); }
-.prsp-exp-row { display: flex; align-items: center; gap: 0.5rem; }
+.prsp-exp-row { display: flex; align-items: center; flex-wrap: wrap; gap: 0.5rem; }
 .prsp-exp-row > span:empty { display: none; }
 .prsp-exp-select, .prsp-exp-name { font: inherit; font-size: 0.9rem; padding: 0.42rem 0.6rem; border-radius: 8px;
 	border: 1px solid var(--theme-color-border-default, #d7dce3); background: var(--theme-color-background-primary, #fff); color: var(--theme-color-text-primary, #1f2733); }
 .prsp-exp-select { flex: 0 0 auto; width: 230px; min-width: 0; max-width: 100%; }
+/* When a host layers select2 (or a similar widget) on the stored-filter <select>, its container
+   defaults to display:block at the row's full width, pushing Save/Delete onto a second line. Pin it to
+   a fixed-width inline flex item so the controls stay on one row. */
+.prsp-exp-row .select2-container { flex: 0 0 auto !important; display: inline-block !important; width: 230px !important; max-width: 100%; vertical-align: middle; }
 .prsp-exp-select:focus, .prsp-exp-name:focus { outline: none; border-color: var(--theme-color-brand-primary, #156dd1);
 	box-shadow: 0 0 0 3px color-mix(in srgb, var(--theme-color-brand-primary, #156dd1) 16%, transparent); }
 .prsp-exp-btn { flex: 0 0 auto; white-space: nowrap; }

package/source/views/RecordSet-Filters.js

@@ -67,14 +67,19 @@ const _DEFAULT_CONFIGURATION_SUBSET_Filter =
 .prsp-filters-actions { flex: 0 0 auto; display: flex; align-items: center; gap: 0.5rem; }
 
 /* Module-owned "Add filter" popover (replaces the old native <select> pickers). */
-.prsp-addfilter-pop { position: absolute; z-index: 30; top: calc(100% + 0.35rem); left: 0; min-width: 250px; max-width: 340px; display: none; }
+/* Fixed (viewport-anchored) + JS-positioned on open, so no ancestor overflow:hidden — the filter card,
+   the slide-out drawer — can clip it, whatever the host's layout. */
+.prsp-addfilter-pop { position: fixed; z-index: 30; min-width: 280px; max-width: 360px; display: none; }
 .prsp-addfilter-pop.open { display: block; }
-.prsp-addfilter-panel { background: var(--theme-color-background-panel, #fff); border: 1px solid var(--theme-color-border-default, #d7dce3);
+/* Transparent full-viewport backdrop: catches outside clicks to close (no document listener). */
+.prsp-addfilter-backdrop { position: fixed; inset: 0; z-index: 0; }
+.prsp-addfilter-panel { position: relative; z-index: 1; display: flex; flex-direction: column; max-height: min(70vh, 460px);
+	background: var(--theme-color-background-panel, #fff); border: 1px solid var(--theme-color-border-default, #d7dce3);
 	border-radius: 10px; box-shadow: 0 10px 28px rgba(17, 24, 39, 0.14); overflow: hidden; }
-.prsp-addfilter-search { display: flex; align-items: center; gap: 0.4rem; padding: 0.5rem 0.7rem; border-bottom: 1px solid var(--theme-color-border-light, #e8ebf0); }
+.prsp-addfilter-search { flex: 0 0 auto; display: flex; align-items: center; gap: 0.4rem; padding: 0.5rem 0.7rem; border-bottom: 1px solid var(--theme-color-border-light, #e8ebf0); }
 .prsp-addfilter-search-ic { display: inline-flex; color: var(--theme-color-text-muted, #6b7686); font-size: 0.9rem; }
 .prsp-addfilter-search input { flex: 1 1 auto; min-width: 0; font: inherit; font-size: 0.9rem; border: none; outline: none; background: transparent; color: var(--theme-color-text-primary, #1f2733); }
-.prsp-addfilter-list { max-height: 280px; overflow-y: auto; }
+.prsp-addfilter-list { flex: 1 1 auto; overflow-y: auto; }
 .prsp-addfilter-empty { padding: 0.7rem 0.8rem; color: var(--theme-color-text-muted, #6b7686); font-size: 0.86rem; }
 .prsp-addfilter-field { border-bottom: 1px solid var(--theme-color-border-light, #eef1f5); }
 .prsp-addfilter-field:last-child { border-bottom: none; }
@@ -109,7 +114,7 @@ const _DEFAULT_CONFIGURATION_SUBSET_Filter =
 		</form>
 		<div class="prsp-filters-drawer" id="PRSP_Filter_Drawer">
 			<div class="prsp-filters-drawer-inner">
-				<div id="PRSP_Filter_Instances" class="prsp-filters-clauses">
+				<div id="PRSP_Filter_Instances" class="prsp-filters-clauses" onkeydown="if (event.key === 'Enter' &amp;&amp; !event.target.closest('.pps')) { event.preventDefault(); _Pict.views['PRSP-Filters'].handleSearch(event, '{~D:Record.RecordSet~}', '{~D:Record.ViewContext~}'); }">
 					{~FIV:Record~}
 				</div>
 				{~T:PRSP-SUBSET-Filters-Template-AddFilter-Fieldset~}
@@ -183,6 +188,7 @@ const _DEFAULT_CONFIGURATION_SUBSET_Filter =
 			Hash: 'PRSP-AddFilter-Popover',
 			Template: /*html*/`
 	<!-- DefaultPackage pict view template: [PRSP-AddFilter-Popover] -->
+	<div class="prsp-addfilter-backdrop" onclick="_Pict.views['PRSP-Filters'].closeAddFilterPopover()"></div>
 	<div class="prsp-addfilter-panel">
 		<div class="prsp-addfilter-search">
 			<span class="prsp-addfilter-search-ic">{~I:Search~}</span>
@@ -747,7 +753,46 @@ class ViewRecordSetSUBSETFilters extends libPictView
 	_paintAddFilterOpenState()
 	{
 		const tmpPopover = document.getElementById('PRSP_AddFilter_Popover');
-		if (tmpPopover) { tmpPopover.classList.toggle('open', !!this._addFilterOpen); }
+		if (!tmpPopover) { return; }
+		tmpPopover.classList.toggle('open', !!this._addFilterOpen);
+		if (this._addFilterOpen) { this._positionAddFilterPopover(tmpPopover); }
+	}
+
+	/**
+	 * Position the (fixed) add-filter popover against its trigger button, flipping above when there's
+	 * more room there. Fixed positioning means no ancestor overflow:hidden (the host's filter card, the
+	 * slide-out drawer) can clip it — the price is we set its top/left from the trigger's rect here.
+	 *
+	 * @param {HTMLElement} pPopover - the #PRSP_AddFilter_Popover element (already display:block).
+	 */
+	_positionAddFilterPopover(pPopover)
+	{
+		const tmpTrigger = document.getElementById('PRSP_Filter_Button_Add');
+		if (!tmpTrigger) { return; }
+		const tmpPanel = /** @type {HTMLElement} */ (pPopover.querySelector('.prsp-addfilter-panel'));
+		const tmpRect = tmpTrigger.getBoundingClientRect();
+		const tmpGap = 6;
+		const tmpMargin = 8;
+		const tmpVH = window.innerHeight;
+		const tmpVW = window.innerWidth;
+		const tmpWidth = pPopover.offsetWidth || 300;
+		pPopover.style.left = `${Math.round(Math.max(tmpMargin, Math.min(tmpRect.left, tmpVW - tmpWidth - tmpMargin)))}px`;
+		pPopover.style.right = 'auto';
+		const tmpSpaceBelow = tmpVH - tmpRect.bottom - tmpGap - tmpMargin;
+		const tmpSpaceAbove = tmpRect.top - tmpGap - tmpMargin;
+		// Prefer the natural downward direction; only flip above when the room below is genuinely cramped.
+		if (tmpSpaceBelow >= 220 || tmpSpaceBelow >= tmpSpaceAbove)
+		{
+			pPopover.style.top = `${Math.round(tmpRect.bottom + tmpGap)}px`;
+			pPopover.style.bottom = 'auto';
+			if (tmpPanel) { tmpPanel.style.maxHeight = `${Math.max(160, Math.min(tmpSpaceBelow, 460))}px`; }
+		}
+		else
+		{
+			pPopover.style.top = 'auto';
+			pPopover.style.bottom = `${Math.round(tmpVH - tmpRect.top + tmpGap)}px`;
+			if (tmpPanel) { tmpPanel.style.maxHeight = `${Math.max(160, Math.min(tmpSpaceAbove, 460))}px`; }
+		}
 	}
 
 	/**

package/source/views/filters/RecordSet-Filter-EntityReference-Base.js

@@ -0,0 +1,291 @@
+const ViewRecordSetSUBSETFilterBase = require('./RecordSet-Filter-Base');
+
+/**
+ * Shared base for the four entity-reference filter types — Internal/External join × single/list.
+ *
+ * These were ~95% duplicate views, each with the same bespoke "search results | selection" table UI
+ * and identical search/add/remove logic. This base consolidates all of it. Subclasses supply only the
+ * two seams that actually differ:
+ *   - `getSearchEntity(pClause)` — internal join searches `RemoteTable`, external `ExternalFilterByTable`.
+ *   - `isMultiSelect()` — the `…List` variants append; the plain `…SelectedValue` variants replace.
+ *
+ * Rendering uses the same mechanism as before (the input template is emitted during the clause's
+ * template parse, via `getFilterFormTemplate()`), so the consolidation is behavior-preserving. The
+ * input template is itself a seam (`getEntityInputTemplate()`) so a host can swap the table UI for a
+ * picker-backed input (a pict-section-form `Picker` InputType) without the module changing.
+ *
+ * Host-injected contextual scoping rides through `getContextScopeFilter(pClause)` — extra FoxHound
+ * stanzas AND-applied to the entity search (project / spec-year / …). The module never learns what
+ * those contexts mean; the host overrides the hook to read its own app state.
+ */
+const _DEFAULT_CONFIGURATION_EntityReference =
+{
+	ViewIdentifier: 'PRSP-FilterType-EntityReference-Base',
+
+	// When set (by a host), entity clauses delegate their input to this pict-section-form InputType
+	// (rendered via {~IWVDA:PSRSFilterProxyView:Record.ClauseDescriptor~}) instead of the built-in
+	// table UI — e.g. 'Picker' to use pict-section-picker. Default false → the table UI.
+	EntityInputType: false,
+
+	Templates:
+	[
+		{
+			// Table UI (default). Two cells: live search results | current selection.
+			Hash: 'PRSP-Filter-EntityRef-Table',
+			Template: /*html*/`
+	<table><tbody><tr>
+		<td valign="top">{~T:PRSP-Filter-EntityRef-SearchResults~}</td>
+		<td valign="top">{~T:PRSP-Filter-EntityRef-SelectedValues~}</td>
+	</tr></tbody></table>
+`
+		},
+		{
+			// Picker / form-input delegation (opt-in via EntityInputType). Renders one dynamic input
+			// on the shared PSRSFilterProxyView from the clause's ClauseDescriptor (whose PictForm
+			// InputType is stamped in prepareRecord). Bound to the clause's Values address.
+			Hash: 'PRSP-Filter-EntityRef-Input',
+			Template: /*html*/`
+	{~IWVDA:PSRSFilterProxyView:Record.ClauseDescriptor~}
+`
+		},
+		{
+			Hash: 'PRSP-Filter-EntityRef-SearchResults',
+			Template: /*html*/`
+	<form id="PRSP_Filter_{~D:Record.Hash~}_Search_Form" onsubmit="_Pict.views['{~D:Context[0].Hash~}'].performSearch(event, '{~D:Record.ClauseAddress~}', '{~D:Record.Hash~}'); return false;">
+		<input id="PRSP_Filter_{~D:Record.Hash~}_Search_Value" type="text" placeholder="Search..." value="{~D:Record.SearchInputValue~}" />
+		<button type="submit" id="PRSP_Filter_{~D:Record.Hash~}_Button_Search" onclick="_Pict.views['{~D:Context[0].Hash~}'].performSearch(event, '{~D:Record.ClauseAddress~}', '{~D:Record.Hash~}')">Search</button>
+	</form>
+	<table>
+		<thead><tr><th colspan="2">{~D:Record.Label~}</th></tr></thead>
+		<tbody>{~TSWP:PRSP-Filter-EntityRef-SearchResults-Entry:Record.SearchResults:Record~}</tbody>
+	</table>
+	<button type="button" id="PRSP_Filter_{~D:Record.Hash~}_Button_LoadMore" class="is-hidden" onclick="_Pict.views['{~D:Context[0].Hash~}'].loadMore(event, '{~D:Record.ClauseAddress~}', '{~D:Record.Hash~}', {~D:Record.SearchResultsOffset:0~})">Load More</button>
+`
+		},
+		{
+			Hash: 'PRSP-Filter-EntityRef-SelectedValues',
+			Template: /*html*/`
+	<table>
+		<thead><tr><th colspan="2">Selection</th></tr></thead>
+		<tbody>{~TSWP:PRSP-Filter-EntityRef-SelectedValues-Entry:Record.SelectedValues:Record~}</tbody>
+	</table>
+`
+		},
+		{
+			Hash: 'PRSP-Filter-EntityRef-SearchResults-Entry',
+			Template: /*html*/`
+	<tr><td><button onclick="_Pict.views['{~D:Context[0].Hash~}'].handleAdd(event, {~DVBK:Record.Data:Record.Payload.ExternalFilterTableLookupColumn~}, '{~D:Record.Payload.ClauseAddress~}', '{~D:Record.Payload.Hash~}')">Select</button></td><td>{~TFA:Record.Payload.ExternalRecordDisplayTemplate:Record~}</td></tr>
+`
+		},
+		{
+			Hash: 'PRSP-Filter-EntityRef-SelectedValues-Entry',
+			Template: /*html*/`
+	<tr><td><button onclick="_Pict.views['{~D:Context[0].Hash~}'].handleRemove(event, {~DVBK:Record.Data:Record.Payload.ExternalFilterTableLookupColumn~}, '{~D:Record.Payload.ClauseAddress~}', '{~D:Record.Payload.Hash~}')">Remove</button></td><td>{~TFA:Record.Payload.ExternalRecordDisplayTemplate:Record~}</td></tr>
+`
+		},
+	],
+};
+
+class ViewRecordSetSUBSETFilterEntityReferenceBase extends ViewRecordSetSUBSETFilterBase
+{
+	constructor(pFable, pOptions, pServiceHash)
+	{
+		if (!pOptions.PageSize)
+		{
+			pOptions.PageSize = 15;
+		}
+		super(pFable, pOptions, pServiceHash);
+	}
+
+	// --- Seams the subclasses override (the only real differences between the 4 types) ---
+
+	/** @param {Record<string, any>} pClause @return {string} The entity to search (RemoteTable / ExternalFilterByTable). */
+	getSearchEntity(pClause)
+	{
+		return pClause.RemoteTable || pClause.ExternalFilterByTable;
+	}
+
+	/** @param {Record<string, any>} pClause @return {string} The value/ID column on the searched entity. */
+	getLookupColumn(pClause)
+	{
+		return pClause.ExternalFilterTableLookupColumn || `ID${this.getSearchEntity(pClause)}`;
+	}
+
+	/** @return {boolean} True for the `…List` (multi-select) variants. */
+	isMultiSelect()
+	{
+		return true;
+	}
+
+	/**
+	 * Host-injectable contextual search scope. Returns extra FoxHound filter stanza(s) AND-applied to
+	 * the entity search (e.g. "only this project's line items"). Default: the clause's static
+	 * `ContextScopeFilter` if any, else none. Hosts override this to read app state — the module never
+	 * learns what a "project" or "spec year" is.
+	 *
+	 * @param {Record<string, any>} pClause @return {string|Array<string>}
+	 */
+	getContextScopeFilter(pClause)
+	{
+		return pClause.ContextScopeFilter || '';
+	}
+
+	/** @return {string} The template hash for the clause's value input (table UI, or the opt-in delegated input). */
+	getFilterFormTemplate()
+	{
+		return this.options.EntityInputType ? 'PRSP-Filter-EntityRef-Input' : 'PRSP-Filter-EntityRef-Table';
+	}
+
+	/** @param {Record<string, any>} pRecord */
+	prepareRecord(pRecord)
+	{
+		super.prepareRecord(pRecord);
+
+		pRecord.ClauseDescriptor.PictForm = Object.assign({}, pRecord.PictForm);
+		if (this.options.EntityInputType)
+		{
+			// Delegated input: a csv string round-trips through the informary at `.StringArrayValue`,
+			// while the picker adapter writes the real ARRAY to `.Values` (what Filter.js reads) via
+			// ValueArrayAddress. Keeping the informary off `.Values` avoids a Number field defaulting it
+			// to "0". The descriptor also carries everything the picker needs + the contextual scope hook.
+			pRecord.ClauseDescriptor.Address = pRecord.ClauseAddress + '.StringArrayValue';
+			pRecord.ClauseDescriptor.DataType = 'String';
+			pRecord.ClauseDescriptor.PictForm.InputType = pRecord.ClauseDescriptor.PictForm.InputType || this.options.EntityInputType;
+			pRecord.ClauseDescriptor.PictForm.Entity = pRecord.ClauseDescriptor.PictForm.Entity || this.getSearchEntity(pRecord);
+			pRecord.ClauseDescriptor.PictForm.ValueField = pRecord.ClauseDescriptor.PictForm.ValueField || this.getLookupColumn(pRecord);
+			pRecord.ClauseDescriptor.PictForm.Multiple = this.isMultiSelect();
+			pRecord.ClauseDescriptor.PictForm.SearchFields = pRecord.ClauseDescriptor.PictForm.SearchFields
+				|| pRecord.ExternalFilterByColumns || (pRecord.ExternalFilterByColumn ? [ pRecord.ExternalFilterByColumn ] : [ 'Name' ]);
+			pRecord.ClauseDescriptor.PictForm.ValueArrayAddress = pRecord.ClauseValuesAddress;
+			pRecord.ClauseDescriptor.PictForm.GetContextScopeFilter = () => this.getContextScopeFilter(this.getInformaryScopedValue(pRecord.ClauseAddress) || pRecord);
+			// Saved-filter seeding: mirror the live clause's Values array into the csv `.StringArrayValue`
+			// the input reads, so a reloaded/persisted filter shows its current selections on render.
+			const tmpLiveClause = this.getInformaryScopedValue(pRecord.ClauseAddress);
+			if (tmpLiveClause && Array.isArray(tmpLiveClause.Values))
+			{
+				tmpLiveClause.StringArrayValue = tmpLiveClause.Values.join(',');
+			}
+		}
+		else
+		{
+			pRecord.ClauseDescriptor.DataType = pRecord.DataType || 'Number';
+		}
+		if (!pRecord.ExternalFilterTableLookupColumn)
+		{
+			pRecord.ExternalFilterTableLookupColumn = this.getLookupColumn(pRecord);
+		}
+		if (!pRecord.SearchResults) { pRecord.SearchResults = []; }
+		if (!pRecord.SelectedValues) { pRecord.SelectedValues = []; }
+	}
+
+	// --- Table UI search/select methods (consolidated from the 4 legacy views) ---
+
+	loadMore(pEvent, pClauseInformaryAddress, pClauseHash, pCurrentOffset = 0)
+	{
+		this.performSearch(pEvent, pClauseInformaryAddress, pClauseHash, pCurrentOffset + this.options.PageSize);
+	}
+
+	performSearch(pEvent, pClauseInformaryAddress, pClauseHash, pOffset = 0)
+	{
+		if (pEvent) { pEvent.preventDefault(); }
+		const tmpClause = this.getInformaryScopedValue(pClauseInformaryAddress);
+		if (!tmpClause)
+		{
+			this.pict.log.error(`[Filter-EntityReference] No clause found for address: ${pClauseInformaryAddress}`);
+			return;
+		}
+		tmpClause.SearchResultsOffset = pOffset;
+		const tmpSearchInputValue = pOffset > 0 ? tmpClause.SearchInputValue : this.pict.ContentAssignment.readContent(`#PRSP_Filter_${tmpClause.Hash}_Search_Value`);
+		tmpClause.SearchInputValue = tmpSearchInputValue;
+		if (!tmpSearchInputValue)
+		{
+			tmpClause.SearchResults = [];
+			tmpClause.LoadMoreEnabled = false;
+			this._reRenderClause(tmpClause, pClauseInformaryAddress, pClauseHash);
+			return;
+		}
+		const tmpFilterByColumns = tmpClause.ExternalFilterByColumns || (tmpClause.ExternalFilterByColumn ? [ tmpClause.ExternalFilterByColumn ] : [ 'Name' ]);
+		const tmpSearchStanza = tmpFilterByColumns.map((pColumn) => `FBVOR~${pColumn}~LK~${encodeURIComponent(`%${tmpSearchInputValue}%`)}`).join('~');
+		const tmpScope = this.getContextScopeFilter(tmpClause);
+		const tmpScopeStanza = Array.isArray(tmpScope) ? tmpScope.filter(Boolean).join('~') : tmpScope;
+		const tmpMeadowFilter = [ tmpScopeStanza, tmpSearchStanza ].filter(Boolean).join('~');
+		this.pict.EntityProvider.gatherDataFromServer(
+			[
+				{
+					Entity: this.getSearchEntity(tmpClause),
+					Filter: tmpMeadowFilter,
+					Destination: pOffset > 0 ? `${this.getInformaryAddressPrefix()}${pClauseInformaryAddress}.SearchResultsAppend` : `${this.getInformaryAddressPrefix()}${pClauseInformaryAddress}.SearchResults`,
+					RecordStartCursor: pOffset,
+					PageSize: this.options.PageSize,
+				}
+			],
+			() =>
+			{
+				if (pOffset > 0 && tmpClause.SearchResultsAppend?.length > 0)
+				{
+					tmpClause.SearchResults = tmpClause.SearchResults.concat(tmpClause.SearchResultsAppend);
+				}
+				const tmpLoadedRecords = pOffset > 0 ? tmpClause.SearchResultsAppend : tmpClause.SearchResults;
+				delete tmpClause.SearchResultsAppend;
+				tmpClause.SearchResultsOffset = pOffset;
+				tmpClause.LoadMoreEnabled = tmpLoadedRecords && tmpLoadedRecords.length >= this.options.PageSize;
+				this._reRenderClause(tmpClause, pClauseInformaryAddress, pClauseHash);
+				if (tmpClause.LoadMoreEnabled)
+				{
+					this.pict.ContentAssignment.removeClass(`#PRSP_Filter_${tmpClause.Hash}_Button_LoadMore`, 'is-hidden');
+				}
+			});
+	}
+
+	handleAdd(pEvent, pRecordLookupValue, pClauseInformaryAddress, pClauseHash)
+	{
+		if (pEvent) { pEvent.preventDefault(); }
+		const tmpClause = this.getInformaryScopedValue(pClauseInformaryAddress);
+		if (!tmpClause) { return; }
+		const tmpRecordLookupColumn = this.getLookupColumn(tmpClause);
+		const tmpRecordToAdd = (tmpClause.SearchResults || []).find((pRow) => pRow[tmpRecordLookupColumn] == pRecordLookupValue);
+		if (!tmpRecordToAdd) { return; }
+		const tmpValue = tmpRecordToAdd[tmpRecordLookupColumn];
+		if (tmpValue == null) { return; }
+		if (!tmpClause.SelectedValues) { tmpClause.SelectedValues = []; }
+		if (!tmpClause.Values) { tmpClause.Values = []; }
+		if (this.isMultiSelect())
+		{
+			if (tmpClause.SelectedValues.some((pSV) => pSV[tmpRecordLookupColumn] == pRecordLookupValue)) { return; }
+			tmpClause.SelectedValues.push(tmpRecordToAdd);
+			if (!tmpClause.Values.some((pV) => pV == tmpValue)) { tmpClause.Values.push(tmpValue); }
+		}
+		else
+		{
+			tmpClause.SelectedValues = [ tmpRecordToAdd ];
+			tmpClause.Values = [ tmpValue ];
+		}
+		this._reRenderClause(tmpClause, pClauseInformaryAddress, pClauseHash);
+	}
+
+	handleRemove(pEvent, pRecordLookupValue, pClauseInformaryAddress, pClauseHash)
+	{
+		if (pEvent) { pEvent.preventDefault(); }
+		const tmpClause = this.getInformaryScopedValue(pClauseInformaryAddress);
+		if (!tmpClause) { return; }
+		const tmpRecordLookupColumn = this.getLookupColumn(tmpClause);
+		const tmpIndex = (tmpClause.SelectedValues || []).findIndex((pRow) => pRow[tmpRecordLookupColumn] == pRecordLookupValue);
+		if (tmpIndex < 0) { return; }
+		const tmpRemoved = tmpClause.SelectedValues.splice(tmpIndex, 1)[0];
+		const tmpValue = tmpRemoved[tmpRecordLookupColumn];
+		tmpClause.Values = (tmpClause.Values || []).filter((pV) => pV !== tmpValue);
+		this._reRenderClause(tmpClause, pClauseInformaryAddress, pClauseHash);
+	}
+
+	/** Re-render a clause's container (the table UI re-paints on every search / add / remove). */
+	_reRenderClause(pClause, pClauseInformaryAddress, pClauseHash)
+	{
+		const tmpRecord = Object.assign({ ClauseAddress: pClauseInformaryAddress }, pClause);
+		this.prepareRecord(tmpRecord);
+		this.render(null, `#PRSP_Filter_Container_${pClauseHash}`, tmpRecord);
+	}
+}
+
+module.exports = ViewRecordSetSUBSETFilterEntityReferenceBase;
+
+module.exports.default_configuration = Object.assign({}, ViewRecordSetSUBSETFilterBase.default_configuration, _DEFAULT_CONFIGURATION_EntityReference);