Page 1 of 1

[ANGULAR] Using mixins & TS error

Posted: Fri Aug 05, 2022 12:34 pm
by TeemuL

Hi,

I want to add a Button to my Grid toolbar. The button has to be responsive based on some certain limits, so I tried one of your code examples that uses mixins so I could achieve what I need. Link: https://www.bryntum.com/docs/grid/guide/Grid/upgrades/5.1.0

class ResponsiveButton extends Button.mixin(Responsive) {}

const button = new ResponsiveButton({
    responsive : {
        // When width drops to 50 or below, hide text and show icon
        small : {
            when : 50,
            text : null,
            icon : 'b-fa b-fa-plus'
        },

    // When width is above 50, hide icon and show text
    '*' : {
        text : 'Add',
        icon : null
    }
}
});

});

After I am trying to implement this in my Angular project's typescript file, I am getting Typescript error because of the mixin:

import { Button, Grid, Responsive} from '@bryntum/grid';

class ResponsiveButton extends Button.mixin(Responsive) {}

Error says: "Type 'Function' is not a constructor function type" and it points to "Button.mixin(Responsive)" -part.

The button seems to work on your Grid example test page. It works also on my project after disabling Typescript checking for that line.

My project uses Bryntum 5.1.1, Typescript version 4.4.4 and Angular 13. I tried to upgrade typescript to 4.6, but the error persisted.

Any idea why I'm getting this error, I can't seem to figure it out? Thanks

-Teemu


Re: [ANGULAR] Using mixins & TS error

Posted: Fri Aug 05, 2022 1:28 pm
by alex.l

Thank you for the report, we will fix this. Ticket is here https://github.com/bryntum/support/issues/5009
Meanwhile please use @ts-ignore as a temp workaround.