Renaming confilicting properties in order to have types without hacky solutions

[Aylur]

I've had some time on my hands, so I iterated over a few solutions on how the widget subclasses should be implemented.
I have come to the conclusion that properties that are already a Gtk property will have to be renamed in order for typescript to infer everything automatically, to have a better dx, and keep the source code clean
The culprits are

• Widget.style
• Widget.halign
• Widget.valign
• Window.margin

What should they be renamed to?
halign and valign could be halignment or hadjust.
halign will still work but it will take the original Gtk.Align enum

margin could be layer-margin or margins

For style I am not sure. How about just removing style and sticking to the already existing css? The only difference between the two is just *{ } three characters anyway

[magicmn]

I feel like for methods that originally accept an enum, but could be given a string instead for convenience I'd not rename them. I'm not very experinced with type script, but the setters should accept union of type string and the enum. The getters should always return the enum type. This way we have only one method for one function instead of halign and haligment which just do the same thing and complicating things with multiple methods.

For margin, I think this only effects window right now or? Other widgets do not override gtk margin if I remember correctly? Since you added classNames it would make sense to give margins the same treatment.

style could just be named inlineCss or inlineStyle.

[end-4]

How about hpack? it's short and "pack" makes sense since box.pack_start() exists

[Aylur]

box pack functions are somewhat different to alignment, but I like the shortness of hpack

[Aylur]

I feel like for methods that originally accept an enum, but could be given a string instead for convenience I'd not rename them. I'm not very experinced with type script, but the setters should accept union of type string and the enum. The getters should always return the enum type. This way we have only one method for one function instead of halign and haligment which just do the same thing and complicating things with multiple methods.

Subclass property setters and getters have to follow the parent's signatures

These two are incompatible

get halign(): Gtk.Align {}
set halign(align: Gtk.Align) {}

get halign(): string {}
set halign(align: string) {}

currently the error is just ignored and its overridden anyway, but this leads to this inconsistency

const widget = Widget({
  halign: 'center' // correctly typed
  connections: [
    ['signal', self => {
      self.halign = 'center'; // will warn, because here it expects Gtk.Align
    }],
  ]
});

widget.halign = 'center'; // same warning, it expects Gtk.Align

this happens for all 4 properties I listed, and so a rename is needed

[magicmn]

Just for me too understand. If you'd just change the current method definition to something like this, it would still causes warnings?

// @ts-expect-error prop override
set halign(align: Gtk.Align | Align) {
    if (!align)
        return;

    if (typeof align === 'string' ) {
        if (!aligns.includes(align)) {
            console.error(new Error(`halign has to be on of ${aligns}`));
            return;
        }
        align = aligns.findIndex(a => a === align);
    }
    super.halign = align;
}

[Aylur]

tried it, it still wouldn't work, these are still incompatible

set halign(align: Gtk.Align) {}
set halign(align: Gtk.Align | Align) {}

[Aylur]

style could just be named inlineCss or inlineStyle.

I like both.
How about making css accept both formats? if the passed value doesn't contain curly braces, it will pass "*{ ${css} }" instead

[magicmn]

Accepting both formats is probably the better solution. css is most likely not used much right now.