tauri-kargo-tools 0.1.6 → 0.1.8

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "tauri-kargo-tools",
-  "version": "0.1.6",
+  "version": "0.1.8",
   "description": "",
    "files": ["src"],
  "exports": { "./*": "./src/*" },

package/src/builder/space.ts

@@ -0,0 +1,13 @@
+import { Space } from "../model/space";
+import { applySize, Builder, Ctx } from "../vue-builder";
+
+/* ----------- Flow ----------- */
+    export function buildSpace<T extends object>(builder:Builder,node: Space, ctx: Ctx<T>) {
+        const div = document.createElement('div');
+ 
+        div.style.visibility ="hidden"
+        applySize(div, node.width, node.height);
+        ctx.add(div);
+
+    }
+

package/src/model/space.ts

@@ -0,0 +1,5 @@
+export interface Space {
+    kind:"space"
+    width?:number | string;
+    height?:number | string;
+}

package/src/test/test-model.ts

@@ -448,7 +448,7 @@ export class Panel {
         bp.idx = 2
         this.buttons.push(bp)
         bp = new ButtonPanel()
-        bp.elementPanel = new BaseAvecLog()
+        bp.elementPanel = new BaseAvecMenu()
         bp.name = "Compute"
         bp.idx = 3
         this.buttons.push(bp)

package/src/test/test-polymorphe.ts

@@ -4,7 +4,7 @@ import { ElementPanel } from "./test-model-panel"
 
 
 
-export  class Base extends ElementPanel {
+export class Base extends ElementPanel {
     op!: string
     a!: number
     b!: number
@@ -105,6 +105,10 @@ defineVue(MenuOp, {
             action: "mul",
             width: "100%"
         },
+        {
+            kind: 'space',
+            height: 10
+        },
         {
             kind: 'staticButton',
             label: '/',

package/src/test/test-vue-boot.ts

@@ -88,4 +88,6 @@ defineVue(Main, (ui) => {
 
 },{ init:"initVue"})
 
-boot(new Main(), "#app")
+boot(new Main())
+
+

package/src/test/test-vue-panel.ts

@@ -158,5 +158,5 @@ defineVue(Panel, (ui) => {
     })
 })
 
-boot(new Panel(), "#app")
+boot(new Panel())
 

package/src/vue-builder.ts

@@ -15,6 +15,7 @@ import { buildLabel, buildStaticLabel } from "./builder/label";
 import { buildListOfVue } from "./builder/list-of-vue";
 import { buildMenu } from "./builder/menu";
 import { buildSelect } from "./builder/select";
+import { buildSpace } from "./builder/space";
 import { buildSingleVue } from "./builder/vue";
 import { Listener, Unlisten } from "./listener";
 import { getListener } from "./listener-factory";
@@ -29,6 +30,7 @@ import { LabelNode, StaticLabelNode } from "./model/label";
 import { ListVueNode } from "./model/list-of-vue";
 import { MenuNode } from "./model/menu";
 import { SelectNode } from "./model/select";
+import { Space } from "./model/space";
 import { SingleVueNode } from "./model/vue";
 import {
     Vue, UINode
@@ -124,8 +126,21 @@ export class Builder {
     }
 
     /** Monte `ui` dans `selector`. */
-    boot<T extends object>(a: T, selector: string): VueRuntime<T> {
-        this.container = document.querySelector(selector) as HTMLElement | null;
+    boot<T extends object>(a: T, selector?: string): VueRuntime<T> {
+        if (!selector) {
+            document.body.className = "app"
+            this.container = document.createElement("div")
+            document.body.appendChild(this.container)    
+            const link = document.createElement("link")
+            link.rel ="stylesheet"
+            const scriptUrl = import.meta.url;
+            const scriptDir = scriptUrl.substring(0, scriptUrl.lastIndexOf('/') + 1);
+            const cssLink= `${scriptDir}css/vue-darkmode.css`
+            link.href = cssLink
+            document.body.appendChild(link)
+        } else {
+            this.container = document.querySelector(selector) as HTMLElement | null;
+        }
         if (!this.container) throw new Error('Conteneur introuvable : ' + selector);
         this.container.replaceChildren()
         return this.bootInto(this.findVueFor(a)!, a, this.container);
@@ -204,6 +219,7 @@ export class Builder {
                 case 'custom': buildCustom(this, node as CustomNode<T, any, any>, ctx); break;
                 case "bootVue": buildBootVue(this, node as BootVueNode<T, any>, ctx); break;
                 case 'staticBootVue': buildStaticBootVue(this, node as StaticBootVueNode<T>, ctx); break;
+                case "space": buildSpace(this, node as Space, ctx);
             }
         }
     }

package/src/vue-model.ts

@@ -14,6 +14,7 @@ import { LabelNode, StaticLabelNode } from "./model/label";
 import { ListVueNode } from "./model/list-of-vue";
 import { MenuNode } from "./model/menu";
 import { SelectNode } from "./model/select";
+import { Space } from "./model/space";
 import { SingleVueNode } from "./model/vue";
 
 /* ===================== Types utils et exports ===================== */
@@ -83,6 +84,7 @@ export type UINode<T extends object> =
     | CustomNode<T>
     | StaticLabelNode<T>
     | BootVueNode<T>
+    | Space
     | StaticBootVueNode<T>;
 
 /* ===================== UI (déclaratif uniquement) ===================== */
@@ -167,6 +169,12 @@ export class Vue<T extends object> {
         this.cursor.push(node as unknown as UINode<T>);
         return this;
     }
+    space(width: string, height: string) {
+        const space: Space = { kind: "space", width: width, height: height }
+        this.cursor.push(space);
+        return this;
+
+    }
 
     /* ------------ Img ------------ */
     img<NK extends KeysOfType<T, string>>(opts: {
@@ -366,7 +374,7 @@ export class Vue<T extends object> {
         width?: number | string; height?: number | string;
         closeOnBackdrop?: boolean; closeOnEsc?: boolean; modal?: boolean;
         visible?: KeysOfType<T, boolean>; enable?: KeysOfType<T, boolean>;
-          useVisibility?: boolean;
+        useVisibility?: boolean;
         action?: KeysOfType<T, () => void>;
         /** Nouveau : rendu du bouton trigger */
         type?: ButtonContentType;
@@ -390,7 +398,7 @@ export class Vue<T extends object> {
         width?: number | string; height?: number | string;
         closeOnBackdrop?: boolean; closeOnEsc?: boolean; modal?: boolean;
         visible?: KeysOfType<T, boolean>; enable?: KeysOfType<T, boolean>;
-          useVisibility?: boolean;
+        useVisibility?: boolean;
         action?: KeysOfType<T, () => void>;
         /** Nouveau : rendu du bouton trigger */
         type?: ButtonContentType;
@@ -409,7 +417,7 @@ export class Vue<T extends object> {
         id?: string; class?: string | string[];
         width?: number | string; height?: number | string;
         visible?: KeysOfType<T, boolean>; enable?: KeysOfType<T, boolean>;
-         useVisibility?: boolean;
+        useVisibility?: boolean;
         /** Nom de la méthode de T: () => HTMLElement */
         factory: FK;
         /** Nom de la méthode d'init: () => void (optionnelle) */