append addtext list with dynamic height and y coordinate in pptxgenjs v 3.11.0 in angular 14.2.0

Question

const pptx = new pptxgen();
slide = pptx.addSlide();
body.map((val: any) => {
slide.addText([
        {
          text: val.title,
          options: {
            fontSize: 8,
            fontFace: 'Arial',
            italic: true,
            color: '3A89A7',
            bold: true,
          },
        },
        {
          text: val.content,
          options: {
            fontSize: 8,
            fontFace: 'Arial',
            italic: true,
          },
        },
        {
          text: `Published on ${moment(val.publishedDate).format(
            'D/MM/yy'
          )} at ${moment(val.publishedDate).format('HH:mm')}`,
          options: {
            fontSize: 8,
            fontFace: 'Arial',
            italic: true,
            color: '009FDA',
            underline: { style: 'dashLong' },
          },
        },
      ], {
        x: 0.5,
        y: ? // i want this to be dynamic,
        h: ? // so as this,
        w: '100%',
        fontSize: 8,
        fontFace: 'Arial',
        italic: true,
      });
)};

here's the code:

the problem when the loop runs slide.addText() overlaps because the y coord is 0 by default with 0 heights.

As the data is coming from server so i can't assign fixed heights.

what i've tried to far:

i created a function and tried to calculate total lines, here the problem is every character is of different width and it didn't gave me correct or even a close result.

numberOflines({ text, fontSize, fontFace, width }: any) {
    const ppi = window.devicePixelRatio * 96;
    console.log('window', window.devicePixelRatio, ppi);

    const canvas = document.createElement('canvas');
    let context = canvas.getContext('2d') as CanvasRenderingContext2D;
    context.font = fontSize * ppi + 'px ' + fontFace;
    const charW = context.measureText(text).width / text.length;

    console.log('char w', charW, context.measureText(text).width, text.length);

    const charWidth = (fontSize * ppi) / charW;
    const maxCharsPerLine = ((width - 0.75) * ppi) / charWidth;
    const lines = [];
    let line = '';

    for (let i = 0; i < text.length; i++) {
      if (line.length >= maxCharsPerLine) {
        lines.push(line);
        line = '';
      }
      line += text[i];
      lines.push(line);
      return lines.length;
    }

I want y and h to be dynamic.

any suggestion? or am i missing something?