gic in this blog

This is more of a experiment so we can have gic code in here. Loading from the core and things like this. Draw to a canvas.

Just to remind me how this works.

We import the .gic source code as raw string here in Astro and have a component that uses the @giclang/runtime package to render the code.

In the component, we have a web component that takes care of mounting and unmounting the gic runtime. We provide a

• HTMLTextAreaElement | HTMLInputElement Where the code is editable.
• HTMLCanvasElement Where the result is rendered.
• HTMLElement for the diagnotics
• HTMLElement for the output of the print statements.

The mountPreview ({canvas, diagnostics, output, input}) in the connectedCallback function returns a cleanup function that can be called in the disconnectedCallback of the web component.

The @giclang/runtime also exports a standalone iife (remember: imidiately invoked function expression) that is used in the standalone export that the editor and the desktop app provide.

Eventually I might publish this to the npm registry but I am not there yet.