@es-joy/jsoe 0.31.0 → 0.32.0

package/src/search/fundamentalTypes/blobSearchType.js

@@ -1,5 +1,7 @@
-import {buildPathLabel, buildLiteralRegexControls, readLiteralRegexQuery} from '../searchUtils.js';
-import {getQueryViaElement} from '../searchElementUtils.js';
+import {
+  buildPathLabel, buildLiteralRegexControls, readLiteralRegexQuery, applyLiteralRegexQuery
+} from '../searchUtils.js';
+import {getQueryViaElement, applyQueryViaElement} from '../searchElementUtils.js';
 import regexpType from '../../fundamentalTypes/regexpType.js';
 
 /**
@@ -29,6 +31,21 @@ const blobSearchType = {
         /** @this {HTMLElement} */
         getQuery () {
           return readLiteralRegexQuery(this, this.dataset.searchPath ?? '');
+        },
+        /**
+         * @this {HTMLElement}
+         * @param {import('../queryTree.js').QueryNode|undefined} queryNode
+         * @returns {void}
+         */
+        applyQuery (queryNode) {
+          const leaf = queryNode && '$and' in queryNode ? queryNode.$and[0] : queryNode;
+          applyLiteralRegexQuery(
+            this,
+            /**
+             * @type {import('../queryTree.js').QueryLiteralSetLeaf|
+             *import('../queryTree.js').QueryRegexLeaf|
+              import('../queryTree.js').QueryNotContainsLeaf|undefined} */ (leaf)
+          );
         }
       }
     }, [
@@ -36,7 +53,8 @@ const blobSearchType = {
       buildLiteralRegexControls({name, flagOptions: regexpType.allowedFlags})
     ]];
   },
-  getQuery: getQueryViaElement
+  getQuery: getQueryViaElement,
+  applyQuery: applyQueryViaElement
 };
 
 export default blobSearchType;

package/src/search/fundamentalTypes/booleanSearchType.js

@@ -1,6 +1,8 @@
-import {buildPathLabel, buildTriStateSelect, readTriStateSelect} from '../searchUtils.js';
+import {
+  buildPathLabel, buildTriStateSelect, readTriStateSelect, applyTriState, extractLeafOfKind
+} from '../searchUtils.js';
 import {makeBooleanEqualsLeaf} from '../queryTreeBuilders.js';
-import {getQueryViaElement} from '../searchElementUtils.js';
+import {getQueryViaElement, applyQueryViaElement} from '../searchElementUtils.js';
 
 /**
  * @typedef {import('../searchDispatch.js').SearchTypeObject} SearchTypeObject
@@ -24,6 +26,15 @@ const booleanSearchType = {
           return value === undefined
             ? undefined
             : makeBooleanEqualsLeaf(this.dataset.searchPath ?? '', value);
+        },
+        /**
+         * @this {HTMLElement}
+         * @param {import('../queryTree.js').QueryNode|undefined} queryNode
+         * @returns {void}
+         */
+        applyQuery (queryNode) {
+          const {matched} = extractLeafOfKind(queryNode, 'booleanEquals');
+          applyTriState(this, matched?.value);
         }
       }
     }, [
@@ -34,7 +45,8 @@ const booleanSearchType = {
       ]]
     ]];
   },
-  getQuery: getQueryViaElement
+  getQuery: getQueryViaElement,
+  applyQuery: applyQueryViaElement
 };
 
 export default booleanSearchType;

package/src/search/fundamentalTypes/catchSearchType.js

@@ -1,6 +1,9 @@
-import {buildPathLabel} from '../searchUtils.js';
+import {buildPathLabel, extractLeafOfKind} from '../searchUtils.js';
 import {makePassThroughLeaf} from '../queryTreeBuilders.js';
-import {findSearchElement, getQueryViaElement, hasGetQuery} from '../searchElementUtils.js';
+import {
+  findSearchElement, getQueryViaElement, hasGetQuery,
+  applyQueryViaElement, hasApplyQuery
+} from '../searchElementUtils.js';
 import {buildSearchWidget} from '../searchDispatch.js';
 
 /**
@@ -46,6 +49,19 @@ const catchSearchType = {
           return childQuery === undefined
             ? undefined
             : makePassThroughLeaf(searchPath, childQuery);
+        },
+        /**
+         * @this {HTMLElement}
+         * @param {import('../queryTree.js').QueryNode|undefined} queryNode
+         * @returns {void}
+         */
+        applyQuery (queryNode) {
+          const {matched} = extractLeafOfKind(queryNode, 'passThrough');
+          const searchPath = this.dataset.searchPath ?? '';
+          const childEl = findSearchElement(this, searchPath);
+          if (childEl && hasApplyQuery(childEl)) {
+            childEl.applyQuery(matched?.query);
+          }
         }
       }
     }, [
@@ -53,7 +69,8 @@ const catchSearchType = {
       childArr
     ]];
   },
-  getQuery: getQueryViaElement
+  getQuery: getQueryViaElement,
+  applyQuery: applyQueryViaElement
 };
 
 export default catchSearchType;

package/src/search/fundamentalTypes/dateSearchType.js

@@ -1,9 +1,10 @@
 import {buildDateInputControl} from '../../fundamentalTypes/dateType.js';
 import {
-  buildPathLabel, buildTriStateSelect, readTriStateSelect, isExemptedByAncestorHasProperty
+  buildPathLabel, buildTriStateSelect, readTriStateSelect, isExemptedByAncestorHasProperty,
+  applyTriState, extractLeafOfKind
 } from '../searchUtils.js';
 import {makeRangeLeaf, makeValidDateCheckLeaf, combineAnd} from '../queryTreeBuilders.js';
-import {getQueryViaElement} from '../searchElementUtils.js';
+import {getQueryViaElement, applyQueryViaElement} from '../searchElementUtils.js';
 
 /**
  * @typedef {import('../searchDispatch.js').SearchTypeObject} SearchTypeObject
@@ -80,6 +81,25 @@ function validateRange () {
   lteInput.setCustomValidity(lteMessage);
 }
 
+/**
+ * The inverse of `readInputs` - `undefined` clears a bound, mirroring
+ * `dateType.js`'s own ISO-slicing convention (`toISOString().slice(0, -8)`)
+ * used to seed a `datetime-local` input's value from a real `Date`.
+ * @param {Element} el
+ * @param {string|undefined} gte
+ * @param {string|undefined} lte
+ * @returns {void}
+ */
+function applyInputs (el, gte, lte) {
+  const [gteInput, lteInput] = /** @type {HTMLInputElement[]} */ (
+    [...el.querySelectorAll('input[type="datetime-local"]')]
+  );
+  gteInput.value = gte === undefined ? '' : new Date(gte).toISOString().slice(0, -8);
+  lteInput.value = lte === undefined ? '' : new Date(lte).toISOString().slice(0, -8);
+  gteInput.dispatchEvent(new Event('input'));
+  lteInput.dispatchEvent(new Event('input'));
+}
+
 /**
  * OR date range/Is Not Range, Is/Is not a valid date (README) -
  * `dateType.js`'s own `buildDateInputControl` is reused twice (range start/
@@ -121,6 +141,24 @@ const dateSearchType = {
               ...(lte ? {$lte: new Date(lte).toISOString()} : {})
             });
           return combineAnd([validLeaf, rangeLeaf]);
+        },
+        /**
+         * @this {HTMLElement}
+         * @param {import('../queryTree.js').QueryNode|undefined} queryNode
+         * @returns {void}
+         */
+        applyQuery (queryNode) {
+          const {matched: validLeaf} = extractLeafOfKind(queryNode, 'validDateCheck');
+          // Dispatches `change`, which runs the tri-state's own `onChange`
+          // (toggling the range fieldset's `disabled` state and re-running
+          // `validateRange`) before the range inputs below are set.
+          applyTriState(this, validLeaf?.isValid, 'valid');
+          const {matched: rangeLeaf} = extractLeafOfKind(queryNode, 'range');
+          applyInputs(
+            this,
+            /** @type {string|undefined} */ (rangeLeaf?.$gte),
+            /** @type {string|undefined} */ (rangeLeaf?.$lte)
+          );
         }
       }
     }, [
@@ -160,7 +198,8 @@ const dateSearchType = {
       ]]
     ]];
   },
-  getQuery: getQueryViaElement
+  getQuery: getQueryViaElement,
+  applyQuery: applyQueryViaElement
 };
 
 export default dateSearchType;

package/src/search/fundamentalTypes/domexceptionSearchType.js

@@ -1,11 +1,12 @@
 import {domExceptionNames} from '../../fundamentalTypes/domexceptionType.js';
 import {
-  buildPathLabel, buildMultiSelect, readMultiSelect, buildLiteralRegexControls,
+  buildPathLabel, buildMultiSelect, readMultiSelect, applyMultiSelect,
+  buildLiteralRegexControls,
   readLiteralRegexQuery, buildOptInFieldset, readOptInChecked, wireOptInFieldset,
-  buildAtLeastOneSentinel, syncAtLeastOneCheck
+  buildAtLeastOneSentinel, syncAtLeastOneCheck, extractLeafOfKind, applyOptInLiteralRegexFacet
 } from '../searchUtils.js';
 import {makeMultiSelectLeaf, combineAnd} from '../queryTreeBuilders.js';
-import {getQueryViaElement} from '../searchElementUtils.js';
+import {getQueryViaElement, applyQueryViaElement} from '../searchElementUtils.js';
 import regexpType from '../../fundamentalTypes/regexpType.js';
 
 /**
@@ -61,6 +62,18 @@ const domexceptionSearchType = {
             ? readLiteralRegexQuery(this, `${searchPath}/message`, 'message')
             : undefined;
           return combineAnd([nameLeaf, messageLeaf]);
+        },
+        /**
+         * @this {HTMLElement}
+         * @param {import('../queryTree.js').QueryNode|undefined} queryNode
+         * @returns {void}
+         */
+        applyQuery (queryNode) {
+          const searchPath = this.dataset.searchPath ?? '';
+          const {matched: nameLeaf} = extractLeafOfKind(queryNode, 'multiSelect');
+          applyMultiSelect(this, nameLeaf?.$in ?? []);
+          applyOptInLiteralRegexFacet(this, queryNode, `${searchPath}/message`, 'message');
+          syncDomexceptionValidity(this);
         }
       }
     }, [
@@ -78,7 +91,8 @@ const domexceptionSearchType = {
       buildAtLeastOneSentinel()
     ]];
   },
-  getQuery: getQueryViaElement
+  getQuery: getQueryViaElement,
+  applyQuery: applyQueryViaElement
 };
 
 export default domexceptionSearchType;

package/src/search/fundamentalTypes/enumSearchType.js

@@ -1,6 +1,8 @@
-import {buildPathLabel, buildMultiSelect, readMultiSelect} from '../searchUtils.js';
+import {
+  buildPathLabel, buildMultiSelect, readMultiSelect, applyMultiSelect, extractLeafOfKind
+} from '../searchUtils.js';
 import {makeMultiSelectLeaf} from '../queryTreeBuilders.js';
-import {getQueryViaElement} from '../searchElementUtils.js';
+import {getQueryViaElement, applyQueryViaElement} from '../searchElementUtils.js';
 
 /**
  * @typedef {import('../searchDispatch.js').SearchTypeObject} SearchTypeObject
@@ -49,6 +51,15 @@ const enumSearchType = {
           return selected.length
             ? makeMultiSelectLeaf(this.dataset.searchPath ?? '', {$in: selected})
             : undefined;
+        },
+        /**
+         * @this {HTMLElement}
+         * @param {import('../queryTree.js').QueryNode|undefined} queryNode
+         * @returns {void}
+         */
+        applyQuery (queryNode) {
+          const {matched} = extractLeafOfKind(queryNode, 'multiSelect');
+          applyMultiSelect(this, matched?.$in ?? []);
         }
       }
     }, [
@@ -56,7 +67,8 @@ const enumSearchType = {
       buildMultiSelect({name, options, required: true})
     ]];
   },
-  getQuery: getQueryViaElement
+  getQuery: getQueryViaElement,
+  applyQuery: applyQueryViaElement
 };
 
 export default enumSearchType;

package/src/search/fundamentalTypes/fileSearchType.js

@@ -1,10 +1,10 @@
 import {
   buildPathLabel, buildLiteralRegexControls, readLiteralRegexQuery,
   buildOptInFieldset, readOptInChecked, wireOptInFieldset,
-  buildAtLeastOneSentinel, syncAtLeastOneCheck
+  buildAtLeastOneSentinel, syncAtLeastOneCheck, applyOptInLiteralRegexFacet
 } from '../searchUtils.js';
 import {combineAnd} from '../queryTreeBuilders.js';
-import {getQueryViaElement} from '../searchElementUtils.js';
+import {getQueryViaElement, applyQueryViaElement} from '../searchElementUtils.js';
 import regexpType from '../../fundamentalTypes/regexpType.js';
 
 /**
@@ -69,6 +69,17 @@ const fileSearchType = {
             ? readLiteralRegexQuery(this, `${searchPath}/type`, 'type')
             : undefined;
           return combineAnd([nameLeaf, typeLeaf]);
+        },
+        /**
+         * @this {HTMLElement}
+         * @param {import('../queryTree.js').QueryNode|undefined} queryNode
+         * @returns {void}
+         */
+        applyQuery (queryNode) {
+          const searchPath = this.dataset.searchPath ?? '';
+          applyOptInLiteralRegexFacet(this, queryNode, `${searchPath}/name`, 'name');
+          applyOptInLiteralRegexFacet(this, queryNode, `${searchPath}/type`, 'type');
+          syncFileValidity(this);
         }
       }
     }, [
@@ -88,7 +99,8 @@ const fileSearchType = {
       buildAtLeastOneSentinel()
     ]];
   },
-  getQuery: getQueryViaElement
+  getQuery: getQueryViaElement,
+  applyQuery: applyQueryViaElement
 };
 
 export default fileSearchType;

package/src/search/fundamentalTypes/filelistSearchType.js

@@ -1,10 +1,13 @@
 import {
-  buildPathLabel, buildLengthSizeControls, readLengthSizeQuery,
-  buildOptInFieldset, readOptInChecked, wireOptInFieldset,
-  buildAtLeastOneSentinel, syncAtLeastOneCheck
+  buildPathLabel, buildLengthSizeControls, readLengthSizeQuery, applyLengthSizeQuery,
+  buildOptInFieldset, readOptInChecked, wireOptInFieldset, applyOptIn,
+  buildAtLeastOneSentinel, syncAtLeastOneCheck, extractLeafOfKind
 } from '../searchUtils.js';
 import {combineAnd} from '../queryTreeBuilders.js';
-import {findSearchElement, getQueryViaElement, hasGetQuery} from '../searchElementUtils.js';
+import {
+  findSearchElement, getQueryViaElement, hasGetQuery,
+  applyQueryViaElement, hasApplyQuery
+} from '../searchElementUtils.js';
 import {buildSearchWidget} from '../searchDispatch.js';
 
 /**
@@ -81,6 +84,22 @@ const filelistSearchType = {
             ? elementEl.getQuery()
             : undefined;
           return combineAnd([lengthLeaf, elementLeaf]);
+        },
+        /**
+         * @this {HTMLElement}
+         * @param {import('../queryTree.js').QueryNode|undefined} queryNode
+         * @returns {void}
+         */
+        applyQuery (queryNode) {
+          const searchPath = this.dataset.searchPath ?? '';
+          const {matched: lengthLeaf, rest} = extractLeafOfKind(queryNode, 'lengthSize');
+          applyLengthSizeQuery(this, lengthLeaf);
+          applyOptIn(this, rest !== undefined, '');
+          const elementEl = findSearchElement(this, `${searchPath}/*`);
+          if (elementEl && hasApplyQuery(elementEl)) {
+            elementEl.applyQuery(rest);
+          }
+          syncFilelistValidity(this);
         }
       }
     }, [
@@ -97,7 +116,8 @@ const filelistSearchType = {
       buildAtLeastOneSentinel()
     ]];
   },
-  getQuery: getQueryViaElement
+  getQuery: getQueryViaElement,
+  applyQuery: applyQueryViaElement
 };
 
 export default filelistSearchType;

package/src/search/fundamentalTypes/functionSearchType.js

@@ -1,9 +1,12 @@
 import {
-  buildPathLabel, buildOptInFieldset, readOptInChecked, wireOptInFieldset,
-  buildAtLeastOneSentinel, syncAtLeastOneCheck
+  buildPathLabel, buildOptInFieldset, readOptInChecked, wireOptInFieldset, applyOptIn,
+  buildAtLeastOneSentinel, syncAtLeastOneCheck, extractClauseForPath
 } from '../searchUtils.js';
 import {combineAnd} from '../queryTreeBuilders.js';
-import {findSearchElement, getQueryViaElement, hasGetQuery} from '../searchElementUtils.js';
+import {
+  findSearchElement, getQueryViaElement, hasGetQuery,
+  applyQueryViaElement, hasApplyQuery
+} from '../searchElementUtils.js';
 import {buildSearchWidget} from '../searchDispatch.js';
 
 /**
@@ -82,6 +85,29 @@ const functionSearchType = {
             ? outputEl.getQuery()
             : undefined;
           return combineAnd([argsQuery, outputQuery]);
+        },
+        /**
+         * @this {HTMLElement}
+         * @param {import('../queryTree.js').QueryNode|undefined} queryNode
+         * @returns {void}
+         */
+        applyQuery (queryNode) {
+          const searchPath = this.dataset.searchPath ?? '';
+          const argsPath = `${searchPath}/*args`;
+          const outputPath = `${searchPath}/*output`;
+          const {matched: argsMatched, rest} = extractClauseForPath(queryNode, argsPath);
+          const {matched: outputMatched} = extractClauseForPath(rest, outputPath);
+          applyOptIn(this, argsMatched !== undefined, 'args');
+          applyOptIn(this, outputMatched !== undefined, 'output');
+          const argsEl = findSearchElement(this, argsPath);
+          if (argsEl && hasApplyQuery(argsEl)) {
+            argsEl.applyQuery(argsMatched);
+          }
+          const outputEl = findSearchElement(this, outputPath);
+          if (outputEl && hasApplyQuery(outputEl)) {
+            outputEl.applyQuery(outputMatched);
+          }
+          syncFunctionValidity(this);
         }
       }
     }, [
@@ -96,7 +122,8 @@ const functionSearchType = {
       buildAtLeastOneSentinel()
     ]];
   },
-  getQuery: getQueryViaElement
+  getQuery: getQueryViaElement,
+  applyQuery: applyQueryViaElement
 };
 
 export default functionSearchType;

package/src/search/fundamentalTypes/mapSearchType.js

@@ -1,10 +1,14 @@
 import {
-  buildPathLabel, buildCheckbox, readCheckbox, buildLengthSizeControls,
-  readLengthSizeQuery, buildOptInFieldset, readOptInChecked, wireOptInFieldset,
-  buildAtLeastOneSentinel, syncAtLeastOneCheck
+  buildPathLabel, buildCheckbox, readCheckbox, applyCheckbox, buildLengthSizeControls,
+  readLengthSizeQuery, applyLengthSizeQuery,
+  buildOptInFieldset, readOptInChecked, wireOptInFieldset, applyOptIn,
+  buildAtLeastOneSentinel, syncAtLeastOneCheck, extractLeafOfKind
 } from '../searchUtils.js';
 import {makeMapRecordJointLeaf, combineAnd} from '../queryTreeBuilders.js';
-import {findSearchElement, getQueryViaElement, hasGetQuery} from '../searchElementUtils.js';
+import {
+  findSearchElement, getQueryViaElement, hasGetQuery,
+  applyQueryViaElement, hasApplyQuery
+} from '../searchElementUtils.js';
 import {buildSearchWidget} from '../searchDispatch.js';
 
 /**
@@ -94,6 +98,29 @@ const mapSearchType = {
             ? makeMapRecordJointLeaf(searchPath, readCheckbox(this), keyQuery, valueQuery)
             : undefined;
           return combineAnd([lengthLeaf, jointLeaf]);
+        },
+        /**
+         * @this {HTMLElement}
+         * @param {import('../queryTree.js').QueryNode|undefined} queryNode
+         * @returns {void}
+         */
+        applyQuery (queryNode) {
+          const searchPath = this.dataset.searchPath ?? '';
+          const {matched: lengthLeaf, rest} = extractLeafOfKind(queryNode, 'lengthSize');
+          applyLengthSizeQuery(this, lengthLeaf);
+          const {matched: jointLeaf} = extractLeafOfKind(rest, 'mapRecordJoint');
+          applyCheckbox(this, Boolean(jointLeaf?.joint));
+          applyOptIn(this, jointLeaf?.keyQuery !== undefined, 'key');
+          applyOptIn(this, jointLeaf?.valueQuery !== undefined, 'value');
+          const keyEl = findSearchElement(this, `${searchPath}/*key`);
+          if (keyEl && hasApplyQuery(keyEl)) {
+            keyEl.applyQuery(jointLeaf?.keyQuery);
+          }
+          const valueEl = findSearchElement(this, `${searchPath}/*value`);
+          if (valueEl && hasApplyQuery(valueEl)) {
+            valueEl.applyQuery(jointLeaf?.valueQuery);
+          }
+          syncMapValidity(this);
         }
       }
     }, [
@@ -111,7 +138,8 @@ const mapSearchType = {
       buildAtLeastOneSentinel()
     ]];
   },
-  getQuery: getQueryViaElement
+  getQuery: getQueryViaElement,
+  applyQuery: applyQueryViaElement
 };
 
 export default mapSearchType;

package/src/search/fundamentalTypes/numberSearchType.js

@@ -1,9 +1,9 @@
 import {
   buildPathLabel, buildRangeInputsPair, readRangeInputsPair, buildTriStateSelect,
-  readTriStateSelect, syncRangeValidity
+  readTriStateSelect, syncRangeValidity, applyRangeQuery, applyTriState, extractLeafOfKind
 } from '../searchUtils.js';
 import {makeRangeLeaf, makeIntegerCheckLeaf, combineAnd} from '../queryTreeBuilders.js';
-import {getQueryViaElement} from '../searchElementUtils.js';
+import {getQueryViaElement, applyQueryViaElement} from '../searchElementUtils.js';
 
 /**
  * @typedef {import('../searchDispatch.js').SearchTypeObject} SearchTypeObject
@@ -40,6 +40,17 @@ const numberSearchType = {
             ? undefined
             : makeIntegerCheckLeaf(searchPath, isInteger);
           return combineAnd([rangeLeaf, integerLeaf]);
+        },
+        /**
+         * @this {HTMLElement}
+         * @param {import('../queryTree.js').QueryNode|undefined} queryNode
+         * @returns {void}
+         */
+        applyQuery (queryNode) {
+          const {matched: rangeLeaf} = extractLeafOfKind(queryNode, 'range');
+          applyRangeQuery(this, rangeLeaf);
+          const {matched: integerLeaf} = extractLeafOfKind(queryNode, 'integerCheck');
+          applyTriState(this, integerLeaf?.isInteger);
         }
       }
     }, [
@@ -53,7 +64,8 @@ const numberSearchType = {
       ]]
     ]];
   },
-  getQuery: getQueryViaElement
+  getQuery: getQueryViaElement,
+  applyQuery: applyQueryViaElement
 };
 
 export default numberSearchType;

package/src/search/fundamentalTypes/objectSearchType.js

@@ -1,13 +1,15 @@
 import {jml} from '../../vendor-imports.js';
 import {escapeJSONPointer} from '../../utils/jsonPointer.js';
 import {
-  buildPathLabel, buildHasPropertyToggle, readTriStateSelect, findOwnControl,
-  buildCheckbox, readCheckbox, buildAtLeastOneSentinel, syncAtLeastOneCheck,
-  setDescendantsRequired, revalidateDescendants, resyncAtLeastOne
+  buildPathLabel, buildHasPropertyToggle, readTriStateSelect, applyTriState, findOwnControl,
+  buildCheckbox, readCheckbox, applyCheckbox, buildAtLeastOneSentinel, syncAtLeastOneCheck,
+  setDescendantsRequired, revalidateDescendants, resyncAtLeastOne,
+  extractLeafOfKind, extractClauseForPath
 } from '../searchUtils.js';
 import {combineAnd, makeHasPropertyLeaf} from '../queryTreeBuilders.js';
 import {
-  findSearchElement, getQueryViaElement, hasGetQuery
+  findSearchElement, getQueryViaElement, hasGetQuery,
+  applyQueryViaElement, hasApplyQuery
 } from '../searchElementUtils.js';
 import {buildSearchWidget} from '../searchDispatch.js';
 
@@ -307,6 +309,91 @@ const objectSearchType = {
         getQuery () {
           const rows = [...this.children].filter(hasGetQuery);
           return combineAnd(rows.map((row) => row.getQuery()));
+        },
+        /**
+         * `$define` methods are shared once per tag (this file's other
+         * docs), so - like `getQuery` - this reads every per-instance fact
+         * (which properties exist, their names) off `this`'s own live DOM
+         * rather than closing over `objectSchemaObject`/`propertyEntries`.
+         * A property the query doesn't reference is reset to "no
+         * constraint" (its tri-state back to "(any)"/checkbox unchecked,
+         * its own child cleared) rather than removed outright - cheaper and
+         * just as correct a way to reach the same resulting query, and
+         * non-destructive (the row, and any of the user's other in-progress
+         * edits to it, stay put to remove by hand if truly unwanted).
+         * @this {HTMLElement}
+         * @param {import('../queryTree.js').QueryNode|undefined} queryNode
+         * @returns {void}
+         */
+        applyQuery (queryNode) {
+          const searchPath = this.dataset.searchPath ?? '';
+          let remaining = queryNode;
+
+          [...this.querySelectorAll(':scope > jsoe-search-has-property')].forEach((row) => {
+            const propertyName = /** @type {HTMLElement} */ (row).dataset.propertyName ?? '';
+            const childPath = `${searchPath}/${escapeJSONPointer(propertyName)}`;
+            const {matched, rest} = extractClauseForPath(remaining, childPath);
+            remaining = rest;
+            const {matched: existsLeaf, rest: childQuery} = extractLeafOfKind(matched, 'hasProperty');
+            applyTriState(row, existsLeaf?.$exists);
+            const childEl = findSearchElement(row, childPath);
+            if (childEl && hasApplyQuery(childEl)) {
+              childEl.applyQuery(childQuery);
+            }
+          });
+
+          [...this.querySelectorAll(':scope > jsoe-search-required-property')].forEach((row) => {
+            const propertyName = /** @type {HTMLElement} */ (row).dataset.propertyName ?? '';
+            const childPath = `${searchPath}/${escapeJSONPointer(propertyName)}`;
+            const {matched, rest} = extractClauseForPath(remaining, childPath);
+            remaining = rest;
+            applyCheckbox(row, matched !== undefined);
+            const childEl = findSearchElement(row, childPath);
+            if (childEl && hasApplyQuery(childEl)) {
+              childEl.applyQuery(matched);
+            }
+          });
+
+          // Optional properties the query references but that aren't added
+          // yet: pick each in turn from the pull-down and click "Add" (that
+          // click handler is wired per-instance, so - unlike this method -
+          // it's safe for it to close over this widget's own schema/path),
+          // then apply the same way an already-added row above would.
+          const addPropertySelect = /** @type {HTMLSelectElement|undefined} */ (
+            findOwnControl(this, 'select.addPropertySelect')
+          );
+          const addButton = /** @type {HTMLButtonElement|undefined} */ (
+            findOwnControl(this, 'button.addPropertyButton')
+          );
+          [...(addPropertySelect?.options ?? [])].
+            filter((opt) => opt.value && !opt.disabled).
+            map((opt) => opt.value).
+            forEach((propertyName) => {
+              const childPath = `${searchPath}/${escapeJSONPointer(propertyName)}`;
+              const {matched, rest} = extractClauseForPath(remaining, childPath);
+              if (matched === undefined) {
+                return;
+              }
+              remaining = rest;
+              if (addPropertySelect) {
+                addPropertySelect.value = propertyName;
+              }
+              addButton?.click();
+              const row = [
+                ...this.querySelectorAll(':scope > jsoe-search-has-property')
+              ].find((r) => /** @type {HTMLElement} */ (r).dataset.propertyName === propertyName);
+              if (!row) {
+                return;
+              }
+              const {matched: existsLeaf, rest: childQuery} = extractLeafOfKind(matched, 'hasProperty');
+              applyTriState(row, existsLeaf?.$exists);
+              const childEl = findSearchElement(row, childPath);
+              if (childEl && hasApplyQuery(childEl)) {
+                childEl.applyQuery(childQuery);
+              }
+            });
+
+          syncObjectValidity(this);
         }
       }
     }, [
@@ -325,6 +412,7 @@ const objectSearchType = {
           : ['span', ['(no optional properties to search on)']],
         ['button', {
           type: 'button',
+          class: 'addPropertyButton',
           $on: {
             click () {
               const container = this.closest('jsoe-search-object');
@@ -361,7 +449,8 @@ const objectSearchType = {
       ...(propertyEntries.length > 0 ? [buildAtLeastOneSentinel()] : [])
     ]];
   },
-  getQuery: getQueryViaElement
+  getQuery: getQueryViaElement,
+  applyQuery: applyQueryViaElement
 };
 
 export default objectSearchType;