30:T529,viewof options = (({format}) => Inputs.form({ showValues: Inputs.toggle({label: format('showValues'), value: true}), showText: Inputs.toggle({label: format('showText'), value: true}), guide: Inputs.text({label: format('guide'), value: '·'}), indentation: Inputs.range([0, 8], {label: format('indentation'), step: 1, value: 2}), maxDepth: Inputs.range([0, 10], {label: format('maxDepth'), step: 1, value: 10}), textLength: Inputs.range([0, 50], {label: format('textLength'), step: 1, value: 20}), height: Inputs.range([0, 600], {label: format('height'), step: 50, value: 600}), }, { template: descriptionsTemplate({ showValues: 'Render attribute values. Renders only attribute names if disabled.', showText: 'Render text nodes. Empty / whitespace text nodes are always skipped.', guide: 'Characters for the left-hand indentation guides.', indentation: 'Indendation level. The guide string is either cropped or filled up with whitespace to fit the length.', maxDepth: 'Maximum nesting level to which elements get expanded. Set to `null` for any.', textLength: 'Largest visible string length. Strings exceeding this size are collapsed by default.', height: 'Scrollable container height. Set to 0 to disable.', }) }))({ format: d => html`

${d}`,
})31:T1c14,function inspectDOM(element, options = {}) {
  const {
    textLength = 20,
    indentation = 2,
    maxDepth = null,
    height = 0,
    guide: guideString = '·',
    fontSize = '12px',
    showValues = true,
    showText = true,
    expand = (el, open) => open,
    invalidation: invalidated = invalidation,
    live = false,
    scope = DOM.uid().id,
    renderString = renderStringDefault(scope, textLength),
  } = options;
  if(typeof element === 'string') element = toDOM(element);

  const nodeMap = new WeakMap();
  const onAttributeMutation = live ? createAttributeObserver() : () => {};
  const onChildListMutation = live ? createChildListObserver() : () => {};
  const onCharacterDataMutation = live ? createCharacterDataObserver() : () => {};
  
  const guide = (() => {
    const chunk = guideString.padEnd(indentation).slice(0, indentation);
    return depth => ({'data-guide': chunk.repeat(depth)});
  })();

  const $root = html`${html`