@nano-app/frontend 0.3.1 → 0.3.3

package/dist/auto-register.ts

@@ -0,0 +1,336 @@
+// Auto-generado por @nano-app
+// No editar manualmente.
+export default [
+  {
+    "name": "api",
+    "type": "api",
+    "path": "/api",
+    "data": {
+      "busy": true,
+      "refresh": false,
+      "DefaultItems": [],
+      "UserStatusItems": [
+        {
+          "key": "SUSPENDED",
+          "text": "Suspendido"
+        },
+        {
+          "key": "PENDING",
+          "text": "Pendiente"
+        },
+        {
+          "key": "ACTIVE",
+          "text": "Activo"
+        }
+      ]
+    }
+  },
+  {
+    "name": "app",
+    "type": "app",
+    "data": {
+      "isRegister": false,
+      "navbar": {
+        "tabs": [],
+        "selectedTabKey": "home",
+        "selectedTab": {},
+        "isMenuOpen": false
+      },
+      "form": {
+        "data": {},
+        "validate": []
+      },
+      "drawer": {
+        "isOpen": false,
+        "formType": "",
+        "title": ""
+      },
+      "totales": {},
+      "config": {
+        "theme": "dark"
+      }
+    }
+  },
+  {
+    "name": "const",
+    "type": "app",
+    "data": {
+      "alias": "42974117.prex",
+      "stepSkipTop": 20,
+      "tabs": [
+        {
+          "key": "home",
+          "href": "/",
+          "label": "Home",
+          "minRole": 1
+        },
+        {
+          "key": "resumen",
+          "href": "/resumen",
+          "label": "Resumen",
+          "minRole": 2
+        },
+        {
+          "key": "admin",
+          "href": "/admin",
+          "label": "Administración",
+          "minRole": 3
+        },
+        {
+          "key": "uli",
+          "href": "/",
+          "label": "Uli :v",
+          "minRole": 1
+        },
+        {
+          "key": "luka",
+          "href": "/",
+          "label": "Lucas :v",
+          "minRole": 1
+        }
+      ],
+      "initialForms": {
+        "User": {
+          "rolId": 1,
+          "status": "PENDING"
+        },
+        "Collection": {
+          "total_months": 1,
+          "start_date": "2026-03-01T00:00:00.000Z"
+        }
+      },
+      "tableColumns": {
+        "Users": [
+          "name",
+          "phone",
+          "mail",
+          "pending",
+          "favor",
+          "rol.name",
+          "status"
+        ],
+        "Collections": [
+          "user.name",
+          "price",
+          "description",
+          "start_date",
+          "total_months",
+          "subscription.description"
+        ],
+        "Subscriptions": [
+          "description",
+          "price"
+        ]
+      },
+      "formField": {
+        "pay": [
+          {
+            "fieldName": "total",
+            "valueType": "price",
+            "isRequired": true
+          }
+        ],
+        "login": [
+          {
+            "fieldName": "mail",
+            "inputType": "email",
+            "isRequired": true
+          },
+          {
+            "fieldName": "password",
+            "inputType": "password",
+            "isRequired": true
+          }
+        ],
+        "register": [
+          {
+            "fieldName": "name",
+            "isRequired": true
+          },
+          {
+            "fieldName": "phone",
+            "isRequired": true
+          },
+          {
+            "fieldName": "mail",
+            "inputType": "email",
+            "isRequired": true
+          },
+          {
+            "fieldName": "password",
+            "inputType": "password",
+            "isRequired": true
+          },
+          {
+            "fieldName": "confirmPassword",
+            "inputType": "password",
+            "isRequired": true
+          }
+        ],
+        "Users": [
+          {
+            "fieldName": "name",
+            "isRequired": true
+          },
+          {
+            "fieldName": "mail",
+            "inputType": "email",
+            "isRequired": true
+          },
+          {
+            "fieldName": "rolId",
+            "valueType": "number",
+            "isRequired": true,
+            "inputType": "select",
+            "select": {
+              "items": "/Roles",
+              "itemKey": "id",
+              "showValues": [
+                "name"
+              ]
+            }
+          },
+          {
+            "fieldName": "status",
+            "inputType": "select",
+            "isRequired": true,
+            "select": {
+              "items": "/UserStatusItems",
+              "itemKey": "key",
+              "showValues": [
+                "text"
+              ]
+            }
+          },
+          {
+            "fieldName": "pending",
+            "valueType": "price"
+          },
+          {
+            "fieldName": "favor",
+            "valueType": "price"
+          }
+        ],
+        "Collections": [
+          {
+            "fieldName": "userId",
+            "valueType": "number",
+            "inputType": "select",
+            "isRequired": true,
+            "select": {
+              "items": "Users",
+              "itemKey": "id",
+              "showValues": [
+                "name"
+              ]
+            }
+          },
+          {
+            "fieldName": "price",
+            "valueType": "price",
+            "isRequired": true
+          },
+          {
+            "fieldName": "description",
+            "isRequired": true
+          },
+          {
+            "fieldName": "total_months",
+            "valueType": "number",
+            "isRequired": true
+          },
+          {
+            "fieldName": "start_date",
+            "valueType": "date",
+            "inputType": "date",
+            "isRequired": true
+          },
+          {
+            "fieldName": "subscriptionId",
+            "valueType": "number",
+            "inputType": "select",
+            "select": {
+              "items": "Subscriptions",
+              "itemKey": "id",
+              "showValues": [
+                "description"
+              ]
+            }
+          }
+        ],
+        "Subscriptions": [
+          {
+            "fieldName": "description",
+            "isRequired": true
+          },
+          {
+            "fieldName": "price",
+            "valueType": "price",
+            "isRequired": true
+          }
+        ]
+      },
+      "expandFields": {
+        "Users": "rol",
+        "Collections": "user,subscription"
+      }
+    }
+  },
+  {
+    "name": "i18n",
+    "type": "app",
+    "data": {
+      "login": {
+        "header": (isRegister) => isRegister ? "REGISTRARSE" : "INICIAR SESIÓN",
+        "footer": (isRegister) => isRegister ? "o iniciar sesión" : "o registrarse",
+        "buttonText": (isRegister) => isRegister ? "Crear" : "Ingresar"
+      },
+      "create": (entity) => `Crear ${entity}`,
+      "edit": (entity) => `Editar ${entity}`,
+      "mapping": {
+        "name": "Nombre",
+        "phone": "Teléfono",
+        "mail": "Mail",
+        "pending": "Pendiente",
+        "favor": "A favor",
+        "rolId": "Rol",
+        "rol.name": "Rol",
+        "status": "Estado",
+        "password": "Contraseña",
+        "confirmPassword": "Repetir contraseña",
+        "user.name": "Usuario",
+        "userId": "Usuario",
+        "price": "Precio",
+        "description": "Descripción",
+        "start_date": "Fecha de inicio",
+        "total_months": "Meses totales",
+        "subscription.description": "Subscripción",
+        "subscriptionId": "Subscripción",
+        "last_pay": "Último pago",
+        "first_month": "Mes de inicio",
+        "current_month": "Último mes pagado",
+        "payed_months": "Meses pagados",
+        "actions": "Acciones",
+        "created_at": "Creado",
+        "Users": "Usuarios",
+        "Collections": "Cuotas",
+        "Subscriptions": "Subscripciones",
+        "total": "TOTAL"
+      },
+      "months": {
+        "1": "Enero",
+        "2": "Febrero",
+        "3": "Marzo",
+        "4": "Abril",
+        "5": "Mayo",
+        "6": "Junio",
+        "7": "Julio",
+        "8": "Agosto",
+        "9": "Septiembre",
+        "10": "Octubre",
+        "11": "Noviembre",
+        "12": "Diciembre"
+      }
+    }
+  }
+];

package/dist/index.d.ts

@@ -1,6 +1,7 @@
-export * from "./store/ApiClient";
-export * from "./store/StoreClient";
+export * from "./store/ApiStore";
+export * from "./store/AppStore";
 export * from "./store/StoreManager";
+export * from "./store/RenderManager";
 export * from "./ui/Controller";
 export * from "./ui/createComponent";
 export * from "./utils/QueryBuilder";

package/dist/index.js

@@ -13,12 +13,22 @@ var __createBinding = (this && this.__createBinding) || (Object.create ? (functi
 var __exportStar = (this && this.__exportStar) || function(m, exports) {
     for (var p in m) if (p !== "default" && !Object.prototype.hasOwnProperty.call(exports, p)) __createBinding(exports, m, p);
 };
+var __importDefault = (this && this.__importDefault) || function (mod) {
+    return (mod && mod.__esModule) ? mod : { "default": mod };
+};
 Object.defineProperty(exports, "__esModule", { value: true });
-__exportStar(require("./store/ApiClient"), exports);
-__exportStar(require("./store/StoreClient"), exports);
+const StoreManager_1 = __importDefault(require("./store/StoreManager"));
+__exportStar(require("./store/ApiStore"), exports);
+__exportStar(require("./store/AppStore"), exports);
 __exportStar(require("./store/StoreManager"), exports);
+__exportStar(require("./store/RenderManager"), exports);
 __exportStar(require("./ui/Controller"), exports);
 __exportStar(require("./ui/createComponent"), exports);
 __exportStar(require("./utils/QueryBuilder"), exports);
 __exportStar(require("./utils/Toast"), exports);
 __exportStar(require("./utils/TokenHelper"), exports);
+// Inicializa los stores si existen
+try {
+    StoreManager_1.default.init(require('./auto-register.mjs').default);
+}
+catch (e) { }

package/dist/state/RenderManager.d.ts

@@ -0,0 +1,47 @@
+type ComponentId = symbol;
+/**
+{
+  store1: {
+    path1: {
+      component1: true,
+      component2: true,
+    },
+    path2: {
+      component1: true,
+    },
+    path3: {
+      component1: true,
+    },
+  }
+}
+ */
+export declare class RenderManager {
+    private dependenciesMap;
+    private hooksMap;
+    /**
+     * Registra un hook de re-render para un componente
+     * @param componentId - El id del componente
+     * @param hook - El hook de re-render
+     */
+    register(componentId: ComponentId, hook: () => void): void;
+    /**
+     * Agrega una dependencia de path a un componente
+     * @param componentId - El id del componente
+     * @param path - El path del estado
+     * @param storeName - El nombre del store
+     */
+    dependsOn(componentId: ComponentId, path: string, storeName: string): void;
+    /**
+     * Actualiza los componentes que dependen de este path
+     * @param path - El path del estado
+     * @param storeName - El nombre del store
+     */
+    refresh(path: string, storeName: string): void;
+    /**
+     * Elimina un componente del manager
+     * @param componentId - El id del componente
+     */
+    unregister(componentId: ComponentId): void;
+}
+declare const _default: RenderManager;
+export default _default;

package/dist/state/RenderManager.js

@@ -0,0 +1,78 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.RenderManager = void 0;
+/**
+{
+  store1: {
+    path1: {
+      component1: true,
+      component2: true,
+    },
+    path2: {
+      component1: true,
+    },
+    path3: {
+      component1: true,
+    },
+  }
+}
+ */
+class RenderManager {
+    dependenciesMap = new Map();
+    hooksMap = new Map();
+    /**
+     * Registra un hook de re-render para un componente
+     * @param componentId - El id del componente
+     * @param hook - El hook de re-render
+     */
+    register(componentId, hook) {
+        this.hooksMap.set(componentId, hook);
+    }
+    /**
+     * Agrega una dependencia de path a un componente
+     * @param componentId - El id del componente
+     * @param path - El path del estado
+     * @param storeName - El nombre del store
+     */
+    dependsOn(componentId, path, storeName) {
+        // Si no existe el store, crea un nuevo mapa
+        if (!this.dependenciesMap.has(storeName)) {
+            this.dependenciesMap.set(storeName, new Map());
+        }
+        // Si no existe el path, crea un nuevo conjunto
+        if (!this.dependenciesMap.get(storeName)?.has(path)) {
+            this.dependenciesMap.get(storeName)?.set(path, new Set());
+        }
+        // Agrega el componente al conjunto de dependencias
+        this.dependenciesMap.get(storeName)?.get(path)?.add(componentId);
+    }
+    /**
+     * Actualiza los componentes que dependen de este path
+     * @param path - El path del estado
+     * @param storeName - El nombre del store
+     */
+    refresh(path, storeName) {
+        // Obtiene los componentes que dependen de este path
+        const components = this.dependenciesMap.get(storeName)?.get(path);
+        // Si hay componentes que dependen de este path, actualiza cada uno
+        if (components) {
+            components.forEach((componentId) => {
+                this.hooksMap.get(componentId)?.();
+            });
+        }
+    }
+    /**
+     * Elimina un componente del manager
+     * @param componentId - El id del componente
+     */
+    unregister(componentId) {
+        this.hooksMap.delete(componentId);
+        this.dependenciesMap.forEach((store) => {
+            store.forEach((path) => {
+                path.delete(componentId);
+            });
+        });
+    }
+}
+exports.RenderManager = RenderManager;
+exports.default = new RenderManager();

package/dist/store/{ApiClient.d.ts → ApiStore.d.ts}

@@ -1,9 +1,10 @@
 import type { ApiResponse } from "@nano-app/backend";
-import { StoreClient } from "./StoreClient";
+import { AppStore, StoreData } from "./AppStore";
 export type ApiRequest = (query: string, body?: unknown) => Promise<ApiResponse>;
-export declare class ApiClient extends StoreClient {
+export declare class ApiStore extends AppStore {
     private baseUrl;
-    constructor(baseUrl?: string);
+    private busyCount;
+    constructor(initialData?: StoreData, storeName?: string, baseUrl?: string);
     create: ApiRequest;
     read: ApiRequest;
     update: ApiRequest;

package/dist/store/{ApiClient.js → ApiStore.js}

@@ -1,14 +1,15 @@
 "use strict";
 Object.defineProperty(exports, "__esModule", { value: true });
-exports.ApiClient = void 0;
-const StoreClient_1 = require("./StoreClient");
+exports.ApiStore = void 0;
+const AppStore_1 = require("./AppStore");
 const QueryBuilder_1 = require("../utils/QueryBuilder");
 const TokenHelper_1 = require("../utils/TokenHelper");
 const Toast_1 = require("../utils/Toast");
-class ApiClient extends StoreClient_1.StoreClient {
+class ApiStore extends AppStore_1.AppStore {
     baseUrl;
-    constructor(baseUrl = "/api") {
-        super();
+    busyCount = 0;
+    constructor(initialData = {}, storeName = "", baseUrl = "/api") {
+        super({}, storeName);
         this.baseUrl = baseUrl;
     }
     create = (entity, body) => this.request("POST", entity, body);
@@ -22,7 +23,7 @@ class ApiClient extends StoreClient_1.StoreClient {
     delete = (entity, id) => this.request("DELETE", entity, id);
     async request(method, path, body) {
         let oResponse = { result: null, success: false, message: "", warning: false };
-        this.set("/busyCount", (this.get("/busyCount") || 0) + 1);
+        this.busyCount++;
         this.set("/busy", true);
         try {
             oResponse = await fetch(`${this.baseUrl}${path}`, {
@@ -40,12 +41,11 @@ class ApiClient extends StoreClient_1.StoreClient {
             console.error(error);
         }
         finally {
-            const remaining = this.get("/busyCount") - 1;
-            this.set("/busyCount", remaining);
-            if (remaining < 1)
+            this.busyCount--;
+            if (this.busyCount < 1)
                 this.set("/busy", false);
         }
         return oResponse;
     }
 }
-exports.ApiClient = ApiClient;
+exports.ApiStore = ApiStore;

package/dist/store/AppStore.d.ts

@@ -0,0 +1,25 @@
+export type StoreData = Record<string, any>;
+export declare class AppStore {
+    protected name: string;
+    private state;
+    constructor(initialData?: StoreData, name?: string);
+    /**
+     * Gestiona el estado de la store
+     * @param path - El path del estado
+     * @param value - El valor a asignar
+     * @returns El valor del estado
+     */
+    private manageState;
+    /**
+     * Obtiene el valor del estado
+     * @param path - El path del estado
+     * @returns El valor del estado
+     */
+    get(path: string): any;
+    /**
+     * Asigna un valor al estado
+     * @param path - El path del estado
+     * @param value - El valor a asignar
+     */
+    set(path: string, value: any): void;
+}

package/dist/store/AppStore.js

@@ -0,0 +1,59 @@
+"use strict";
+var __importDefault = (this && this.__importDefault) || function (mod) {
+    return (mod && mod.__esModule) ? mod : { "default": mod };
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.AppStore = void 0;
+const RenderManager_1 = __importDefault(require("./RenderManager"));
+class AppStore {
+    name;
+    state;
+    constructor(initialData = {}, name = "app") {
+        this.name = name;
+        this.state = initialData;
+    }
+    /**
+     * Gestiona el estado de la store
+     * @param path - El path del estado
+     * @param value - El valor a asignar
+     * @returns El valor del estado
+     */
+    manageState(path, value) {
+        // Divide el path en segmentos y obtiene el ultimo segmento
+        const segments = path.split("/").filter(Boolean);
+        if (segments.length === 0)
+            return this.state;
+        const last = segments.pop();
+        // Recorre los segmentos y crea el objeto si no existe
+        let current = this.state;
+        for (const seg of segments) {
+            if (current[seg] == null)
+                current[seg] = {};
+            current = current[seg];
+        }
+        // Si se proporciona un valor, lo asigna al ultimo segmento
+        if (arguments.length >= 2) {
+            current[last] = value;
+        }
+        // Retorna el valor del ultimo segmento
+        return current[last];
+    }
+    /**
+     * Obtiene el valor del estado
+     * @param path - El path del estado
+     * @returns El valor del estado
+     */
+    get(path) {
+        return this.manageState(path);
+    }
+    /**
+     * Asigna un valor al estado
+     * @param path - El path del estado
+     * @param value - El valor a asignar
+     */
+    set(path, value) {
+        RenderManager_1.default.refresh(path, this.name);
+        this.manageState(path, value);
+    }
+}
+exports.AppStore = AppStore;

package/dist/store/RenderManager.d.ts

@@ -0,0 +1,47 @@
+type ComponentId = symbol;
+/**
+{
+  store1: {
+    path1: {
+      component1: true,
+      component2: true,
+    },
+    path2: {
+      component1: true,
+    },
+    path3: {
+      component1: true,
+    },
+  }
+}
+ */
+export declare class RenderManager {
+    private dependenciesMap;
+    private hooksMap;
+    /**
+     * Registra un hook de re-render para un componente
+     * @param componentId - El id del componente
+     * @param hook - El hook de re-render
+     */
+    register(componentId: ComponentId, hook: () => void): void;
+    /**
+     * Agrega una dependencia de path a un componente
+     * @param componentId - El id del componente
+     * @param path - El path del estado
+     * @param storeName - El nombre del store
+     */
+    dependsOn(componentId: ComponentId, path: string, storeName: string): void;
+    /**
+     * Actualiza los componentes que dependen de este path
+     * @param path - El path del estado
+     * @param storeName - El nombre del store
+     */
+    refresh(path: string, storeName: string): void;
+    /**
+     * Elimina un componente del manager
+     * @param componentId - El id del componente
+     */
+    unregister(componentId: ComponentId): void;
+}
+declare const _default: RenderManager;
+export default _default;