Create Palettes dynamically

[foretj]

I have this JS function for creating a new palette and possibly replacing the one previously created with a fresh new set of items:

// Function to load the library into the current diagram
  function loadLibrary(ui, paletteName , libraryXml) {
    try {
      const xmlDoc = mxUtils.parseXml(libraryXml);
      const libraryNode = xmlDoc.documentElement;

      // Remove existing palette if it exists
      if (ui.sidebar.palettes[paletteName]) {
        console.log(`Palette '${paletteName}' found.`);

        // Get the palette node from the DOM
        const paletteNode = ui.sidebar.palettes[paletteName].content;
        if (paletteNode && paletteNode.parentNode) {
          ui.sidebar.removePalette(paletteName);
          console.log(`Palette '${paletteName}' removed successfully.`);
        } else {
          console.warn(`Palette '${paletteName}' exists in sidebar but not in the DOM.`);
          delete ui.sidebar.palettes[paletteName]; // Clean up reference
        }
      }

      // Add a new palette
      console.log(`Creating a new palette '${paletteName}'.`);
      ui.sidebar.addPalette(paletteName, paletteName, true, (content) => {
        addShapesToPalette(ui, content, libraryNode);
      });

      console.log("Library shapes successfully added or updated in the Custom Library palette.");
    } catch (e) {
      console.error("Failed to load library XML into a palette:", e);
    }
  }

When I call this function with the same palette names but different XML it keeps adding new palettes to the sidebar.
And the console message: "Palette 'My Palette' exists in sidebar but not in the DOM." keeps coming up every time I call the function.

Any suggestions ?

BTW a documented API would be very very much appreciated !