const textarea = document.getElementById("svg_textarea")
const output = document.getElementById("output")
const outputImage = document.getElementById("output_image")
const dimensionInput = document.getElementById("dimension_input")

function resize(event) {
  event.preventDefault()

  try {
    // parse svg markup
    const template = document.createElement("template")
    template.innerHTML = textarea.value
    const svg = template.content.querySelector("svg")

    // get viewbox
    const { x, y, width, height } = svg.viewBox.baseVal
    const viewBox = `${x} ${y} ${width} ${height}`

    // get path
    const paths = template.content.querySelectorAll("path")
    
    let markupPaths = []
    
   const dim = dimensionInput.valueAsNumber

    for (let x = 0; x < paths.length; x++) {
        let path = paths[x]
      let d = path.getAttribute("d")
      
      const pathfitter = new Pathfit(
        {
          viewBox,
        },
        undefined,
        d,
      )
      d = pathfitter.scale_with_aspect_ratio(dim, dim)
      markupPaths.push(`<path d="${d}" />`)
    }

    // scale

    // output
    const markup = `<svg  xmlns="http://www.w3.org/2000/svg" viewbox="0 0 ${dim} ${dim}">${markupPaths.join('')}
</svg>`
    output.textContent = markup
    outputImage.src = `data:image/svg+xml;charset=utf-8,${encodeURI(markup)}`
    outputImage.hidden = false
  } catch (err) {
    output.textContent = String(err?.stack ?? err)
  }
}

document.querySelector("form").addEventListener("submit", resize)

textarea.value = `<svg width="13" height="15" viewBox="0 0 13 15" fill="none" xmlns="http://www.w3.org/2000/svg">
<path d="M11 14C11 14.5523 10.5523 15 10 15H1C0.447715 15 0 14.5523 0 14V1C0 0.447715 0.447715 0 1 0H8.08579C8.351 0 8.60536 0.105357 8.79289 0.292893L10 1.5L10.7071 2.20711C10.8946 2.39464 11 2.649 11 2.91421V14ZM1 13C1 13.5523 1.44772 14 2 14H9C9.55228 14 10 13.5523 10 13V3.41421C10 3.149 9.89464 2.89464 9.70711 2.70711L9 2L8.29289 1.29289C8.10536 1.10536 7.851 1 7.58579 1H7H2C1.44772 1 1 1.44772 1 2V13Z" fill="#979797"/>
<path d="M8.5 6H2.5C2.22386 6 2 6.22386 2 6.5C2 6.77614 2.22386 7 2.5 7H8.5C8.77614 7 9 6.77614 9 6.5C9 6.22386 8.77614 6 8.5 6Z" fill="#979797"/>
<path d="M8.5 8H2.5C2.22386 8 2 8.22386 2 8.5C2 8.77614 2.22386 9 2.5 9H8.5C8.77614 9 9 8.77614 9 8.5C9 8.22386 8.77614 8 8.5 8Z" fill="#979797"/>
<path d="M8.5 10H2.5C2.22386 10 2 10.2239 2 10.5C2 10.7761 2.22386 11 2.5 11H8.5C8.77614 11 9 10.7761 9 10.5C9 10.2239 8.77614 10 8.5 10Z" fill="#979797"/>
<path d="M8.5 12H2.5C2.22386 12 2 12.2239 2 12.5C2 12.7761 2.22386 13 2.5 13H8.5C8.77614 13 9 12.7761 9 12.5C9 12.2239 8.77614 12 8.5 12Z" fill="#979797"/>
<path fill-rule="evenodd" clip-rule="evenodd" d="M2 3C2 2.44772 2.44772 2 3 2H6C6.55228 2 7 2.44772 7 3V4C7 4.55228 6.55228 5 6 5H3C2.44772 5 2 4.55228 2 4V3ZM3.5 3C3.22386 3 3 3.22386 3 3.5V3.5C3 3.77614 3.22386 4 3.5 4H5.5C5.77614 4 6 3.77614 6 3.5V3.5C6 3.22386 5.77614 3 5.5 3H3.5Z" fill="#979797"/>
<path fill-rule="evenodd" clip-rule="evenodd" d="M8.5 0.5C8.5 0.223858 8.72386 0 9 0H10.2929C10.5581 0 10.8125 0.105357 11 0.292894L12.2071 1.5C12.3946 1.68754 12.5 1.94189 12.5 2.20711V12.5C12.5 13.0523 12.0523 13.5 11.5 13.5H11C10.7239 13.5 10.5 13.2761 10.5 13V13C10.5 12.7239 10.7239 12.5 11 12.5V12.5C11.2761 12.5 11.5 12.2761 11.5 12V2.62132C11.5 2.3561 11.3946 2.10175 11.2071 1.91421L10.5858 1.29289C10.3982 1.10536 10.1439 1 9.87868 1H9C8.72386 1 8.5 0.776142 8.5 0.5V0.5Z" fill="#979797"/>
</svg>`

form {
  display: flex;
  flex-direction: column;
  gap: 8px;
}

label {
  font-weight: bold;
}

textarea {
  padding: 8px;
}

output {
  border: 1px solid gray;
  border-radius: 2px;
  padding: 8px;
  white-space: pre;
  font-family: monospace;
  overflow: auto;
}

<script src="https://cdn.jsdelivr.net/npm/[email protected]/pathfit.js"></script>

<form>
  <label for="svg_textarea">SVG Text</label>
  <textarea id="svg_textarea" rows="5"></textarea>

  <label for="dimension_input">Target viewbox width/height</label>
  <input id="dimension_input" type="number" min="1" step="1" value="16" />

  <button type="submit">Resize</button>

  <label for="output">Result</label>
  <output id="output"></output>

  <img id="output_image" alt="Output image" hidden />
</form>