Comparison table does not work in web embed

[psobolewski1992]

In web embed, comparison table does not render due to the following line:

{fields[0].value.map((val: string, idx: number) => {
              const field = {
                type: 'Text',
                config: {
                  text: val,
                  displayMode: 'DISPLAY_ONLY'
                }
              };
              return (
                <th scope='col' key={`${tableId}-col-${idx}`} id={`${tableId}-col-${idx}`}>
                  {getPConnect().createComponent(field)}
                </th>
              );

This syntax works perfectly fine in normal portal but does not render in web embed, due to the following error:
TypeError: Failed to construct 'Text': Please use the 'new' operator, this DOM object constructor cannot be called as a function.
Since we do not know what are necessary attributes of text field we changed field object to:

 const field = {
                type: 'TextInput',
                config: {
                  text: `${val}`,
                  value: `${val}`,
                  label: '',
                  displayMode: 'DISPLAY_ONLY'
                }
              };

After performing this change, table renders correctly.