sigpro 1.0.14 → 1.2.40

package/package.json

@@ -1,31 +1,112 @@
 {
   "name": "sigpro",
-  "version": "1.0.14",
+  "version": "1.2.40",
   "type": "module",
   "license": "MIT",
-  "homepage": "https://natxocc.github.io/sigpro/",
+  "author": {
+    "name": "NatxoCC",
+    "email": "sigpro@natxocc.com",
+    "url": "https://sigpro.natxocc.com"
+  },
+  "main": "./dist/sigpro.js",
+  "module": "./dist/sigpro.js",
+  "unpkg": "./dist/sigpro.js",
+  "jsdelivr": "./dist/sigpro.js",
+  "types": "./sigpro.d.ts",
+  "exports": {
+    ".": {
+      "types": "./sigpro.d.ts",
+      "import": "./dist/sigpro.js",
+      "default": "./dist/sigpro.js"
+    },
+    "./db": {
+      "types": "./sigpro.d.ts",
+      "import": "./dist/sigpro.db.js",
+      "default": "./dist/sigpro.db.js"
+    },
+    "./router": {
+      "types": "./sigpro.d.ts",
+      "import": "./dist/sigpro.router.js",
+      "default": "./dist/sigpro.router.js"
+    },
+    "./locale": {
+      "types": "./sigpro.d.ts",
+      "import": "./dist/sigpro.locale.js",
+      "default": "./dist/sigpro.locale.js"
+    },
+    "./grid": {
+      "import": "./dist/sigpro.grid.js",
+      "default": "./dist/sigpro.grid.js"
+    },
+    "./editor": {
+      "import": "./dist/sigpro.editor.js",
+      "default": "./dist/sigpro.editor.js"
+    },
+    "./vite": {
+      "import": "./dist/sigpro.vite.js",
+      "default": "./dist/sigpro.vite.js"
+    },
+    "./css": "./dist/sigpro.ui.css",
+    "./ui": {
+      "types": "./sigpro.ui.d.ts",
+      "import": "./dist/sigpro.ui.js",
+      "default": "./dist/sigpro.ui.js"
+    }
+  },
+  "files": [
+    "dist/",
+    "README.md",
+    "LICENSE",
+    "sigpro.d.ts",
+    "sigpro.ui.d.ts"
+  ],
+  "homepage": "https://sigpro.natxocc.com/#/",
   "repository": {
     "type": "git",
-    "url": "git+https://github.com/natxocc/sigpro.git"
+    "url": "https://github.com/natxocc/sigpro"
   },
   "bugs": {
-    "url": "https://github.com/natxocc/sigpro/issues"
+    "url": "https://github.com/natxocc/sigpro/issues",
+    "email": "sigpro@natxocc.com"
   },
   "scripts": {
-    "docs:dev": "vitepress dev packages/docs",
-    "docs:build": "vitepress build packages/docs",
-    "docs:preview": "vitepress preview packages/docs"
+    "del": "bun pm cache rm && rm -f bun.lockb && rm -f bun.lock",
+    "clean": "rm -rf dist",
+    "prebuild": "npm run clean",
+    "build:core": "bun build ./src/sigpro.js --bundle --outfile=./dist/sigpro.js --format=esm --minify",
+    "build:db": "bun build ./src/sigpro.db.js --bundle --outfile=./dist/sigpro.db.js --format=esm --minify",
+    "build:router": "bun build ./src/sigpro.router.js --bundle --outfile=./dist/sigpro.router.js --format=esm --external ./src/sigpro.js --minify",
+    "build:locale": "bun build ./src/sigpro.locale.js --bundle --outfile=./dist/sigpro.locale.js --format=esm --external ./src/sigpro.js --minify",
+    "build:ui": "bun build ./src/sigpro.ui.js --bundle --outfile=./dist/sigpro.ui.js --format=esm --external ./src/sigpro.js --minify",
+    "build:grid": "bun build ./src/sigpro.grid.js --bundle --external sigpro --outfile=./dist/sigpro.grid.js --format=esm --minify",
+    "build:editor": "bun build ./src/sigpro.editor.js --bundle --external sigpro --outfile=./dist/sigpro.editor.js --format=esm --minify",
+    "build:vite": "bun build ./src/sigpro.vite.js --bundle --outfile=./dist/sigpro.vite.js --format=esm --external fs --external path --minify",
+    "build:css": "tailwindcss -i ./src/sigpro.ui.css -o ./dist/sigpro.ui.css --minify --content './src/tailwind' && du -h ./dist/sigpro.ui.css",
+    "build:convert": "bun build ./src/sigpro.convert.js --bundle --outfile=./docs/sigpro.convert.js --format=esm --external ./src/sigpro.js --minify",
+    "build": "bun run build:core && bun run build:db && bun run build:router && bun run build:locale && bun run build:ui && bun run build:grid && bun run build:editor && bun run build:vite && bun run build:css && bun run build:convert && cp ./dist/* ./docs",
+    "docs": "bun x serve docs"
   },
   "devDependencies": {
-    "vitepress": "^1.6.4"
+    "@iconify/json": "^2.2.473",
+    "@iconify/tailwind4": "^1.2.3",
+    "@tailwindcss/cli": "^4.3.0",
+    "daisyui": "^5.5.19",
+    "tailwindcss": "^4.3.0",
+    "ag-grid-community": "^35.3.0"
   },
   "keywords": [
     "signals",
+    "reactivity",
     "reactive",
-    "web-components",
-    "vanilla-js",
-    "reactive-programming",
-    "signals-library",
-    "fine-grained-reactivity"
+    "pure",
+    "vanilla",
+    "js",
+    "ui",
+    "dom",
+    "state",
+    "frontend",
+    "spa",
+    "lightweight",
+    "sigpro"
   ]
 }

package/sigpro.d.ts

@@ -0,0 +1,395 @@
+/**
+ * SigPro
+ * A minimalistic reactive library with fine-grained reactivity,
+ * direct DOM updates, and built-in component helpers.
+ */
+
+// ============================================================================
+// Core Reactivity
+// ============================================================================
+
+/**
+ * Creates a reactive signal. When a function is passed, it becomes a computed signal.
+ * If a `localStorageKey` is provided, the value persists.
+ *
+ * @param value - Initial value or computation function
+ * @param localStorageKey - Optional key for persistence
+ * @returns A getter/setter function
+ */
+export function $<T>(value: T, localStorageKey?: string): Signal<T>;
+export function $<T>(computation: () => T): Signal<T>;
+
+export interface Signal<T> {
+  (): T;
+  (value: T | ((prev: T) => T)): void;
+}
+
+/**
+ * Creates a deep reactive proxy for objects and arrays.
+ * Tracks property access and mutations automatically.
+ *
+ * @param target - Object or array to make reactive
+ * @returns A reactive proxy
+ */
+export function $$<T extends object>(target: T): DeepReactive<T>;
+
+export type DeepReactive<T> = T extends object
+  ? {
+      [K in keyof T]: T[K] extends object ? DeepReactive<T[K]> : T[K];
+    }
+  : T;
+
+/**
+ * Watches reactive sources and runs a callback.
+ *
+ * @example
+ * // Auto-track mode
+ * watch(() => {
+ *   console.log(count());
+ * });
+ *
+ * @example
+ * // Explicit sources
+ * watch([count, name], ([c, n]) => {
+ *   console.log(c, n);
+ * });
+ *
+ * @returns A function to stop the watcher.
+ */
+export function watch(fn: () => void): () => void;
+export function watch<T>(
+  sources: Array<Signal<any>> | (() => T),
+  callback: (values: T | any[]) => void
+): () => void;
+
+/**
+ * Batches multiple reactive updates into a single flush.
+ */
+export function batch<T>(fn: () => T): T;
+
+// ============================================================================
+// DOM Creation
+// ============================================================================
+
+/**
+ * Hyperscript function to create DOM elements or components.
+ *
+ * @param tag - HTML/SVG tag name or component function
+ * @param props - Optional properties/attributes
+ * @param children - Child nodes or reactive functions
+ * @returns DOM node or array of nodes
+ */
+export function h(
+  tag: string | ((props: any, ctx: ComponentContext) => any),
+  props?: any,
+  children?: any
+): Node;
+
+export interface ComponentContext {
+  children: any;
+  emit: (event: string, ...args: any[]) => void;
+}
+
+/**
+ * Conditionally renders content.
+ *
+ * @param condition - Boolean, signal, or function returning boolean
+ * @param thenBranch - Content when truthy (Node or function)
+ * @param elseBranch - Optional content when falsy
+ * @returns A placeholder element that updates reactively
+ */
+export function when(
+  condition: boolean | (() => boolean) | Signal<boolean>,
+  thenBranch: any | (() => any),
+  elseBranch?: any | (() => any)
+): HTMLElement;
+
+/**
+ * Keyed list renderer. Uses `item?.id` by default or a custom key field.
+ *
+ * @param src - Array, signal, or function returning array
+ * @param itemFn - Render function (item, index) => Node
+ * @param keyField - Optional property name for unique key (e.g., "id")
+ * @returns A container element with reactive list
+ */
+export function each<T>(
+  src: T[] | (() => T[]) | Signal<T[]>,
+  itemFn: (item: T, index: number) => any,
+  keyField?: keyof T
+): HTMLElement;
+
+
+// ============================================================================
+// Router
+// ============================================================================
+
+/**
+ * Hash-based router.
+ *
+ * @param routes - Array of route definitions
+ * @returns A container that renders the current route
+ */
+export function router(routes: RouteDefinition[]): HTMLElement;
+
+export interface RouteDefinition {
+  path: string; // e.g., "/", "/user/:id", "*"
+  component: any | ((params: Record<string, string>) => any);
+}
+
+export namespace router {
+  /** Reactive params signal */
+  export const params: Signal<Record<string, string>>;
+
+  /** Navigate to path */
+  export function to(path: string): void;
+
+  /** Go back in history */
+  export function back(): void;
+
+  /** Current path without hash */
+  export function path(): string;
+}
+
+// ============================================================================
+// Mount API
+// ============================================================================
+
+export interface RuntimeInstance {
+  _isRuntime: true;
+  container: HTMLElement;
+  destroy: () => void;
+}
+
+/**
+ * Mounts a component to a DOM target.
+ *
+ * @param component - Component function or node
+ * @param target - CSS selector or DOM element
+ * @returns Runtime instance
+ */
+export function mount(
+  component: (() => any) | Node,
+  target: string | HTMLElement
+): RuntimeInstance | undefined;
+
+// ============================================================================
+// Tag Helpers (globally available, lowercase)
+// ============================================================================
+
+// All standard HTML tags are available as global functions.
+// They follow the same signature as `h` but with predefined tag names.
+// Examples:
+export const a: TagHelper;
+export const abbr: TagHelper;
+export const article: TagHelper;
+export const aside: TagHelper;
+export const audio: TagHelper;
+export const b: TagHelper;
+export const blockquote: TagHelper;
+export const br: TagHelper;
+export const button: TagHelper;
+export const canvas: TagHelper;
+export const caption: TagHelper;
+export const cite: TagHelper;
+export const code: TagHelper;
+export const col: TagHelper;
+export const colgroup: TagHelper;
+export const datalist: TagHelper;
+export const dd: TagHelper;
+export const del: TagHelper;
+export const details: TagHelper;
+export const dfn: TagHelper;
+export const dialog: TagHelper;
+export const div: TagHelper;
+export const dl: TagHelper;
+export const dt: TagHelper;
+export const em: TagHelper;
+export const embed: TagHelper;
+export const fieldset: TagHelper;
+export const figcaption: TagHelper;
+export const figure: TagHelper;
+export const footer: TagHelper;
+export const form: TagHelper;
+export const h1: TagHelper;
+export const h2: TagHelper;
+export const h3: TagHelper;
+export const h4: TagHelper;
+export const h5: TagHelper;
+export const h6: TagHelper;
+export const header: TagHelper;
+export const hr: TagHelper;
+export const i: TagHelper;
+export const iframe: TagHelper;
+export const img: TagHelper;
+export const input: TagHelper;
+export const ins: TagHelper;
+export const kbd: TagHelper;
+export const label: TagHelper;
+export const legend: TagHelper;
+export const li: TagHelper;
+export const main: TagHelper;
+export const mark: TagHelper;
+export const meter: TagHelper;
+export const nav: TagHelper;
+export const object: TagHelper;
+export const ol: TagHelper;
+export const optgroup: TagHelper;
+export const option: TagHelper;
+export const output: TagHelper;
+export const p: TagHelper;
+export const picture: TagHelper;
+export const pre: TagHelper;
+export const progress: TagHelper;
+export const section: TagHelper;
+export const select: TagHelper;
+export const slot: TagHelper;
+export const small: TagHelper;
+export const source: TagHelper;
+export const span: TagHelper;
+export const strong: TagHelper;
+export const sub: TagHelper;
+export const summary: TagHelper;
+export const sup: TagHelper;
+export const svg: TagHelper;
+export const table: TagHelper;
+export const tbody: TagHelper;
+export const td: TagHelper;
+export const template: TagHelper;
+export const textarea: TagHelper;
+export const tfoot: TagHelper;
+export const th: TagHelper;
+export const thead: TagHelper;
+export const time: TagHelper;
+export const tr: TagHelper;
+export const u: TagHelper;
+export const ul: TagHelper;
+export const video: TagHelper;
+
+export type TagHelper = (
+  props?: any,
+  children?: any
+) => HTMLElement | SVGElement | Text;
+
+// ============================================================================
+// Default Export
+// ============================================================================
+
+declare const SigPro: {
+  $: typeof $;
+  $$: typeof $$;
+  watch: typeof watch;
+  h: typeof h;
+  when: typeof when;
+  each: typeof each;
+  router: typeof router;
+  mount: typeof mount;
+  batch: typeof batch;
+};
+
+export default SigPro;
+
+// ============================================================================
+// Global augmentation for browser environments
+// ============================================================================
+
+declare global {
+  interface Window {
+    $: typeof $;
+    $$: typeof $$;
+    watch: typeof watch;
+    h: typeof h;
+    when: typeof when;
+    each: typeof each;
+    router: typeof router;
+    mount: typeof mount;
+    batch: typeof batch;
+    SigPro: typeof SigPro;
+
+    // Tag helpers (lowercase)
+    a: TagHelper;
+    abbr: TagHelper;
+    article: TagHelper;
+    aside: TagHelper;
+    audio: TagHelper;
+    b: TagHelper;
+    blockquote: TagHelper;
+    br: TagHelper;
+    button: TagHelper;
+    canvas: TagHelper;
+    caption: TagHelper;
+    cite: TagHelper;
+    code: TagHelper;
+    col: TagHelper;
+    colgroup: TagHelper;
+    datalist: TagHelper;
+    dd: TagHelper;
+    del: TagHelper;
+    details: TagHelper;
+    dfn: TagHelper;
+    dialog: TagHelper;
+    div: TagHelper;
+    dl: TagHelper;
+    dt: TagHelper;
+    em: TagHelper;
+    embed: TagHelper;
+    fieldset: TagHelper;
+    figcaption: TagHelper;
+    figure: TagHelper;
+    footer: TagHelper;
+    form: TagHelper;
+    h1: TagHelper;
+    h2: TagHelper;
+    h3: TagHelper;
+    h4: TagHelper;
+    h5: TagHelper;
+    h6: TagHelper;
+    header: TagHelper;
+    hr: TagHelper;
+    i: TagHelper;
+    iframe: TagHelper;
+    img: TagHelper;
+    input: TagHelper;
+    ins: TagHelper;
+    kbd: TagHelper;
+    label: TagHelper;
+    legend: TagHelper;
+    li: TagHelper;
+    main: TagHelper;
+    mark: TagHelper;
+    meter: TagHelper;
+    nav: TagHelper;
+    object: TagHelper;
+    ol: TagHelper;
+    optgroup: TagHelper;
+    option: TagHelper;
+    output: TagHelper;
+    p: TagHelper;
+    picture: TagHelper;
+    pre: TagHelper;
+    progress: TagHelper;
+    section: TagHelper;
+    select: TagHelper;
+    slot: TagHelper;
+    small: TagHelper;
+    source: TagHelper;
+    span: TagHelper;
+    strong: TagHelper;
+    sub: TagHelper;
+    summary: TagHelper;
+    sup: TagHelper;
+    svg: TagHelper;
+    table: TagHelper;
+    tbody: TagHelper;
+    td: TagHelper;
+    template: TagHelper;
+    textarea: TagHelper;
+    tfoot: TagHelper;
+    th: TagHelper;
+    thead: TagHelper;
+    time: TagHelper;
+    tr: TagHelper;
+    u: TagHelper;
+    ul: TagHelper;
+    video: TagHelper;
+  }
+}