add getter setter for style and className

src/utils.ts

@@ -148,7 +148,7 @@ export function ensureDirectory(path?: string) {
 
 export function execAsync(cmd: string | string[]): Promise<string> {
     const proc = Gio.Subprocess.new(
-        typeof cmd === 'string' ? cmd.split(' ') : cmd,
+        typeof cmd === 'string' ? cmd.split(/\s+/) : cmd,
         Gio.SubprocessFlags.STDOUT_PIPE |
         Gio.SubprocessFlags.STDERR_PIPE,
     );
@@ -202,7 +202,7 @@ export function subprocess(
         };
 
         const proc = Gio.Subprocess.new(
-            typeof cmd === 'string' ? cmd.split(' ') : cmd,
+            typeof cmd === 'string' ? cmd.split(/\s+/) : cmd,
             Gio.SubprocessFlags.STDOUT_PIPE |
             Gio.SubprocessFlags.STDERR_PIPE,
         );

src/widgets/shared.ts

@@ -27,20 +27,6 @@ interface CommonParams {
     setup?: (widget: Gtk.Widget) => void
 }
 
-const widgetProviders: Map<Gtk.Widget, Gtk.CssProvider> = new Map();
-function setStyle(widget: Gtk.Widget, css: string) {
-    const previous = widgetProviders.get(widget);
-    if (previous)
-        widget.get_style_context().remove_provider(previous);
-
-    const provider = new Gtk.CssProvider();
-    const style = `* { ${css} }`;
-    provider.load_from_data(style);
-    widget.get_style_context()
-        .add_provider(provider, Gtk.STYLE_PROVIDER_PRIORITY_USER);
-    widgetProviders.set(widget, provider);
-}
-
 function toggleClassName(
     widget: Gtk.Widget,
     className: string,
@@ -51,6 +37,67 @@ function toggleClassName(
         : widget.get_style_context().remove_class(className);
 }
 
+Object.defineProperty(Gtk.Widget.prototype, 'className', {
+    get: function() {
+        return this._className || [];
+    },
+    set: function(names) {
+        if (!Array.isArray(names) && typeof names !== 'string') {
+            console.error('className has to be a string or array');
+            return;
+        }
+
+        this._className = [];
+        if (typeof names === 'string')
+            names = names.split(/\s+/);
+
+        for (const cn of names) {
+            toggleClassName(this, cn);
+            this._className.push(cn);
+        }
+    },
+});
+
+const widgetProviders: Map<Gtk.Widget, Gtk.CssProvider> = new Map();
+function setStyle(widget: Gtk.Widget, css: string) {
+    if (typeof css !== 'string') {
+        console.error('style has to be a string');
+        return false;
+    }
+
+    const previous = widgetProviders.get(widget);
+    if (previous)
+        widget.get_style_context().remove_provider(previous);
+
+    const provider = new Gtk.CssProvider();
+    widgetProviders.set(widget, provider);
+    provider.load_from_data(`* { ${css} }`);
+    widget.get_style_context()
+        .add_provider(provider, Gtk.STYLE_PROVIDER_PRIORITY_USER);
+}
+
+Object.defineProperty(Gtk.Widget.prototype, 'style', {
+    get: function() {
+        return this._style || '';
+    },
+    set: function(css) {
+        if (!setStyle(this, css))
+            return;
+
+        this._style = css;
+    },
+});
+
+// @ts-ignore
+Gtk.Widget.prototype.setStyle = function(css: string) {
+    setStyle(this, css);
+};
+
+// @ts-ignore
+Gtk.Widget.prototype.toggleClassName = function(cn: string, condition = true) {
+    toggleClassName(this, cn, condition);
+};
+
 function separateCommon({
     className, style, halign, valign, connections, properties, setup,
     ...rest
@@ -66,24 +113,14 @@ function parseCommon(widget: Gtk.Widget, {
     halign, valign,
     connections, properties, setup,
 }: CommonParams) {
-    // @ts-ignore
-    widget.setStyle = (css: string) => setStyle(widget, css);
+    if (className !== undefined)
+        // @ts-ignore
+        widget.className = className;
 
-    // @ts-ignore
-    widget.toggleClassName = (className: string, condition = true) =>
-        toggleClassName(widget, className, condition);
+    if (style !== undefined)
+        // @ts-ignore
+        widget.style = style;
 
-    if (typeof className === 'string') {
-        className.split(' ').forEach(cn => {
-            widget.get_style_context().add_class(cn);
-        });
-    }
-
-    if (Array.isArray(className)) {
-        className.forEach(cn => {
-            widget.get_style_context().add_class(cn);
-        });
-    }
 
     if (typeof halign === 'string') {
         // @ts-ignore
@@ -109,9 +146,6 @@ function parseCommon(widget: Gtk.Widget, {
     if (typeof valign === 'number')
         widget.valign = valign;
 
-    if (typeof style === 'string')
-        setStyle(widget, style);
-
     if (properties) {
         properties.forEach(([key, value]) => {
             // @ts-ignore

src/widgets/window.ts

@@ -87,7 +87,7 @@ export default class AgsWindow extends Gtk.Window {
         );
 
         if (typeof anchor === 'string')
-            anchor = anchor.split(' ');
+            anchor = anchor.split(/\s+/);
 
         if (Array.isArray(anchor)) {
             anchor.forEach(side => {
@@ -101,7 +101,8 @@ export default class AgsWindow extends Gtk.Window {
         }
     }
 
-    _margins: number[] | number = 0;
+    _margins: number[] | number = [0];
+    get margins() { return this._margins; }
     set margins(margin: number[] | number) {
         let margins: [side: string, index: number][] = [];
         if (typeof margin === 'number')