mathuo / dockview

Zero dependency Docking Layout Manager. Supports Vanilla TypeScript, React and Vue.
https://dockview.dev
MIT License
395 stars 32 forks source link

Dockview Framework Wrappers (Vue.js, Angular, JavaScript etc.) #562

Open mathuo opened 3 months ago

mathuo commented 3 months ago

All feedback is welcome.

Vue.js A Vue.js wrapper is currently being developed which will support Vue 3+ (see attached PR)

Angular Work is intended to start after Vue.js is completed

JavaScript/TypeScript Since dockview is mostly written in plain Typescript under dockview-core whilst the framework packages are being developed the apis in dockview-core are being cleaned up for offical support

skyracer2012 commented 2 months ago

I just wanted to comment that the javascript example breaks with v1.13.0 due to this.accessor.options.createComponent is not a function at dockview.addPanel. Working example at 1.12: https://codesandbox.io/p/sandbox/priceless-hellman-7ppjpx?file=%2Fpackage.json

This may have been intentional but I didn't find anything in the docs about pure js. Also great work on this project!

mathuo commented 2 months ago

I just wanted to comment that the javascript example breaks with v1.13.0 due to this.accessor.options.createComponent is not a function at dockview.addPanel. Working example at 1.12: https://codesandbox.io/p/sandbox/priceless-hellman-7ppjpx?file=%2Fpackage.json

This may have been intentional but I didn't find anything in the docs about pure js. Also great work on this project!

Ah yes - the plain JavaScript/TypeScript implementation has required some breaking changes to make it better compatible with supporting multiple framework implementations built on top of it.

I will get some examples and docs built for this before it's offically all released but it will look something like the below:

const dockview = new DockviewComponent({
    parentElement: document.getElementById('app'),
    createComponent: (options) => {
        switch (options.name) {
            case 'default':
                return new Panel();
        }
    },
});

https://github.com/mathuo/dockview/blob/5d6055c4d21d317a0478dca1d605be8a810f3aed/packages/docs/templates/dockview/basic/typescript/src/index.ts