CSV load in embed mode

[nicola-attico]

Hi,
I'm using Drawio in embed mode on my page, but I cannot load data from CSV format.
The code is at the end of the post.
Everything seems to work ok. The editor is loaded, but when I try to pass the CSV, I get the popup:

Error
Not a diagram file (error on line 1 at column 1: Start tag expected, '<' not found)

It looks like it is interpreting it like XML, but I've tried any possible way to pass the data.

The doc says:
Alternatively, you can add a descriptor object to the load message that imports specific data formats, e.g. {action: 'load', descriptor: {format: 'csv', data: ...}} where data is the string from the CSV import dialog.
That doesn't work, either.

I've tried to see how the Drawio UI does that, and I found the code for Arrange > Insert > Advanced > CSV...

But then the following function is called:
editorUi.showImportCsvDialog()
which I'm not able to find in EditorUi.js...

Thanks for any help,
Nicola

api.controller = function($scope, $sce, $window) {

    var csv = `...`

    /* widget controller */
    var c = this;
    var iframe = document.getElementById('iframe');
    console.log(iframe)

    $window.addEventListener('message', receiveMessage, false);

    function receiveMessage(event) {
        if (event.origin !== "https://embed.diagrams.net") return;

        if (event.data === "ready") {
            content = {
                action: 'load',
                autosave: 0,
				data: 'csv;base64,' + btoa(unescape(encodeURIComponent(csv)))
            }
			console.log(content)

            iframe.contentWindow.postMessage(JSON.stringify(content), '*');

        }
    }

};

I'm using the CSV in the load window:

Example CSV import. Use ## for comments and # for configuration. Paste CSV below.

The following names are reserved and should not be used (or ignored):

id, tooltip, placeholder(s), link and label (see below)

Node label with placeholders and HTML.

Default is '%name_of_first_column%'.

label: %name%
%position%
Email

Node style (placeholders are replaced once).

Default is the current style for nodes.

style: label;image=%image%;whiteSpace=wrap;html=1;rounded=1;fillColor=%fill%;strokeColor=%stroke%;

Parent style for nodes with child nodes (placeholders are replaced once).

parentstyle: swimlane;whiteSpace=wrap;html=1;childLayout=stackLayout;horizontal=1;horizontalStack=0;resizeParent=1;resizeLast=0;collapsible=1;

Style to be used for objects not in the CSV. If this is - then such objects are ignored,

else they are created using this as their style, eg. whiteSpace=wrap;html=1;

unknownStyle: -

Optional column name that contains a reference to a named style in styles.

Default is the current style for nodes.

stylename: -

JSON for named styles of the form {"name": "style", "name": "style"} where style is a cell style with

placeholders that are replaced once.

styles: -

JSON for variables in styles of the form {"name": "value", "name": "value"} where name is a string

that will replace a placeholder in a style.

vars: -

Optional column name that contains a reference to a named label in labels.

Default is the current label.

labelname: -

JSON for named labels of the form {"name": "label", "name": "label"} where label is a cell label with

placeholders.

labels: -

Uses the given column name as the identity for cells (updates existing cells).

Default is no identity (empty value or -).

identity: -

Uses the given column name as the parent reference for cells. Default is no parent (empty or -).

The identity above is used for resolving the reference so it must be specified.

parent: -

Adds a prefix to the identity of cells to make sure they do not collide with existing cells (whose

IDs are numbers from 0..n, sometimes with a GUID prefix in the context of realtime collaboration).

Default is csvimport-.

namespace: csvimport-

Connections between rows ("from": source colum, "to": target column).

Label, style and invert are optional. Defaults are '', current style and false.

If placeholders are used in the style, they are replaced with data from the source.

An optional placeholders can be set to target to use data from the target instead.

In addition to label, an optional fromlabel and tolabel can be used to name the column

that contains the text for the label in the edges source or target (invert ignored).

In addition to those, an optional source and targetlabel can be used to specify a label

that contains placeholders referencing the respective columns in the source or target row.

The label is created in the form fromlabel + sourcelabel + label + tolabel + targetlabel.

Additional labels can be added by using an optional labels array with entries of the

form {"label": string, "x": number, "y": number, "dx": number, "dy": number} where

x is from -1 to 1 along the edge, y is orthogonal, and dx/dy are offsets in pixels.

An optional placeholders with the string value "source" or "target" can be specified

to replace placeholders in the additional label with data from the source or target.

An optional data object can be specified to define the metadata for the connector.

The target column may contain a comma-separated list of values.

Multiple connect entries are allowed.

connect: {"from": "manager", "to": "name", "invert": true, "label": "manages", \

"style": "curved=1;endArrow=blockThin;endFill=1;fontSize=11;"}

connect: {"from": "refs", "to": "id", "style": "curved=1;fontSize=11;"}

Node x-coordinate. Possible value is a column name. Default is empty. Layouts will

override this value.

left:

Node y-coordinate. Possible value is a column name. Default is empty. Layouts will

override this value.

top:

Node width. Possible value is a number (in px), auto or an @ sign followed by a column

name that contains the value for the width. Default is auto.

width: auto

Node height. Possible value is a number (in px), auto, width or an @ sign followed by a column

name that contains the value for the height. Default is auto.

height: auto

Collapsed state for vertices. Possible values are true or false. Default is false.

collapsed: false

Padding for autosize. Default is 0.

padding: -12

Comma-separated list of ignored columns for metadata. (These can be

used for connections and styles but will not be added as metadata.)

ignore: id,image,fill,stroke,refs,manager

Column to be renamed to link attribute (used as link).

link: url

Spacing between nodes. Default is 40.

nodespacing: 40

Spacing between levels of hierarchical layouts. Default is 100.

levelspacing: 100

Spacing between parallel edges. Default is 40. Use 0 to disable.

edgespacing: 40

Name or JSON of layout. Possible values are auto, none, verticaltree, horizontaltree,

verticalflow, horizontalflow, organic, circle, orgchart or a JSON string as used in

Layout, Apply. Default is auto.

layout: auto

---- CSV below this line. First line are column names. ----

name,position,id,location,manager,email,fill,stroke,refs,url,image
Tessa Miller,CFO,emi,Office 1,,[email protected],default,#6c8ebf,,https://www.draw.io,https://cdn3.iconfinder.com/data/icons/user-avatars-1/512/users-3-128.png
Edward Morrison,Brand Manager,emo,Office 2,Tessa Miller,[email protected],default,#82b366,,https://www.draw.io,https://cdn3.iconfinder.com/data/icons/user-avatars-1/512/users-10-3-128.png
Alison Donovan,System Admin,rdo,Office 3,Tessa Miller,[email protected],default,#82b366,"emo,tva",https://www.draw.io,https://cdn3.iconfinder.com/data/icons/user-avatars-1/512/users-2-128.png
Evan Valet,HR Director,tva,Office 4,Tessa Miller,[email protected],default,#82b366,,https://www.draw.io,https://cdn3.iconfinder.com/data/icons/user-avatars-1/512/users-9-2-128.png