${output}`; }; const _renderRow = (key, content, path, context) => { return withKey(key, html`

${formatKey(key, path, context)}

${content}`); }; const format = (root, filter, refPath) => { const pathVisits = new WeakMap(); return walk(root, _expand, _format); function _expand(value, path, context) { let visits = pathVisits.get(context.path); if(visits?.has(value)) return; const keys = expand(value, path, context); if(!keys) return; visits = new Set(visits); visits.add(value); pathVisits.set(path, visits); const _context = {value, path}; return keys.filter((key) => { // Capture security errors. Todo: Make this optional. try { return filter(value[key], [...path, key], _context) } catch(e) { } }); } function _format(valueOrKeys, path, context, isLeaf) { if(isLeaf) { return _renderValue(valueOrKeys, path, { ...context, isRecursion: pathVisits.get(context.path)?.has(valueOrKeys), isLeaf, }); } // Handle objects without expandable properties. if(!valueOrKeys.length) { // While a path filter is active, skip partially matching paths. if(path.length < refPath?.length) return; // Retrieve the actual value from the context. const key = path[path.length - 1]; const value = context?.value?.[key] ?? context.value; return _renderValue(value, path, {...context, isEmpty: true}); } const rows = []; for(const [key, content] of valueOrKeys) { if(content) rows.push(_renderRow(key, content, path, context)); } return rows.length ? html`${rows}` : undefined; } }; const wrapper = htl.html`

${format(obj, filter)}