plug-code 1.2.0 → 2.0.1

package/dist/core/plcStore.js

@@ -0,0 +1,159 @@
+import { produce } from "immer";
+import { isEqual } from "./helpers/core";
+export class PlcStore {
+    storeData = new Map();
+    substoresData = new Map();
+    subscriptions = new Map();
+    isBatching = false;
+    dirtyKeys = new Set();
+    activeDependencyTracker = null;
+    // ----------------------
+    // Root store
+    // ----------------------
+    createStore(key, initial) {
+        if (this.storeData.has(key))
+            return;
+        this.storeData.set(key, initial);
+        this.markDirty(key);
+    }
+    getStore(key) {
+        const value = this.storeData.get(key);
+        this.recordDependency(key, value);
+        return value;
+    }
+    setStore(key, updater) {
+        const prev = this.storeData.get(key);
+        const next = typeof updater === 'function'
+            ? produce(prev, updater)
+            : updater;
+        if (isEqual(prev, next))
+            return;
+        this.storeData.set(key, next);
+        this.markDirty(key);
+    }
+    // ----------------------
+    // Substores
+    // ----------------------
+    createSubstore(substore, key, initial) {
+        if (!this.substoresData.has(substore))
+            this.substoresData.set(substore, new Map());
+        const fStore = this.substoresData.get(substore);
+        if (fStore.has(key))
+            return;
+        fStore.set(key, initial);
+        this.markDirty(`${substore}:${key}`);
+    }
+    getSubstore(substore, key) {
+        const fStore = this.substoresData.get(substore);
+        const value = fStore?.get(key);
+        this.recordDependency(`${substore}:${key}`, value);
+        return value;
+    }
+    setSubstore(substore, key, updater) {
+        if (!this.substoresData.has(substore))
+            this.substoresData.set(substore, new Map());
+        const fStore = this.substoresData.get(substore);
+        const prev = fStore.get(key);
+        const next = typeof updater === 'function'
+            ? produce(prev, updater)
+            : updater;
+        if (isEqual(prev, next))
+            return;
+        fStore.set(key, next);
+        this.markDirty(`${substore}:${key}`);
+    }
+    // ----------------------
+    // Dependency tracking
+    // ----------------------
+    recordDependency(key, value) {
+        if (this.activeDependencyTracker)
+            this.activeDependencyTracker.set(key, value);
+    }
+    async runWithDependencyTracker(tracker, fn) {
+        const prev = this.activeDependencyTracker;
+        this.activeDependencyTracker = tracker;
+        try {
+            return await fn();
+        }
+        finally {
+            this.activeDependencyTracker = prev;
+        }
+    }
+    // ----------------------
+    // Subscriptions & batching
+    // ----------------------
+    batch(fn) {
+        const prev = this.isBatching;
+        this.isBatching = true;
+        try {
+            fn();
+        }
+        finally {
+            this.isBatching = prev;
+            this.flush();
+        }
+    }
+    subscribe(key, listener) {
+        if (!this.subscriptions.has(key))
+            this.subscriptions.set(key, new Set());
+        this.subscriptions.get(key).add(listener);
+        return () => this.subscriptions.get(key).delete(listener);
+    }
+    markDirty(key) {
+        if (this.isBatching)
+            this.dirtyKeys.add(key);
+        else
+            this.notify(key);
+    }
+    flush() {
+        if (this.isBatching)
+            return;
+        for (const key of this.dirtyKeys)
+            this.notify(key);
+        this.dirtyKeys.clear();
+    }
+    notify(key) {
+        const listeners = this.subscriptions.get(key);
+        listeners?.forEach(fn => {
+            try {
+                fn();
+            }
+            catch (err) {
+                console.error('[PlcStore] listener threw', err);
+            }
+        });
+    }
+}
+// ----------------------
+// LRUCache
+// ----------------------
+export class LRUCache {
+    maxEntries;
+    map = new Map();
+    constructor(maxEntries = 100) {
+        this.maxEntries = maxEntries;
+    }
+    get(key) {
+        if (!this.map.has(key))
+            return undefined;
+        const val = this.map.get(key);
+        this.map.delete(key);
+        this.map.set(key, val);
+        return val;
+    }
+    set(key, value) {
+        if (this.map.has(key))
+            this.map.delete(key);
+        else if (this.map.size >= this.maxEntries) {
+            const oldest = this.map.keys().next().value;
+            this.map.delete(oldest);
+        }
+        this.map.set(key, value);
+    }
+    delete(key) {
+        this.map.delete(key);
+    }
+    clear() {
+        this.map.clear();
+    }
+}

package/dist/core/ui/plcCore.d.ts

@@ -0,0 +1,8 @@
+import { JSX } from "react";
+type virtualContainerType = {
+    content: JSX.Element[];
+    config: any;
+    contextData: any;
+};
+export declare function VirtualContainer({ content, config, contextData }: virtualContainerType): import("react/jsx-runtime").JSX.Element;
+export {};

package/dist/core/ui/plcCore.js

@@ -0,0 +1,40 @@
+import { jsx as _jsx } from "react/jsx-runtime";
+import React from "react";
+import { ScopeContext } from "./plcLayout";
+export function VirtualContainer({ content, config, contextData }) {
+    const ref = React.useRef(null);
+    const rowRefs = React.useRef([]);
+    const pipeline = React.useContext(ScopeContext)?.pipeline;
+    React.useLayoutEffect(() => {
+        if (!ref.current)
+            return;
+        config.viewport = ref.current.clientHeight;
+    }, []);
+    const rowHeight = config.itemHeight ?? config.estimatedHeight;
+    const total = content.length;
+    const start = Math.max(0, Math.floor(config.scrollTop / rowHeight) - config.overscan);
+    const end = Math.min(total, Math.ceil((config.scrollTop + config.viewport) / rowHeight) + config.overscan);
+    rowRefs.current = [];
+    const visible = content.slice(start, end);
+    React.useLayoutEffect(() => {
+        if (!config.needsMeasure || rowRefs.current.length === 0)
+            return;
+        const avg = rowRefs.current.reduce((s, el) => s + el.offsetHeight, 0) /
+            rowRefs.current.length;
+        config.estimatedHeight = avg;
+        config.measured = true;
+        config.needsMeasure = false;
+        pipeline?.scheduleJob(() => { }, 100);
+    }, [visible]);
+    return (_jsx("div", { ref: ref, onScroll: e => {
+            const top = e.currentTarget.scrollTop;
+            config.scrollTop = top;
+            pipeline?.scheduleJob(() => { }, 100);
+        }, style: { overflow: "auto", height: "100%" }, children: _jsx("div", { style: { height: total * rowHeight }, children: _jsx("div", { style: { transform: `translateY(${start * rowHeight}px)` }, children: contextData ? (_jsx(ScopeContext.Provider, { value: contextData, children: visible.map((node, i) => (_jsx("div", { ref: el => {
+                            if (el)
+                                rowRefs.current.push(el);
+                        }, children: node }, i))) })) : (visible.map((node, i) => (_jsx("div", { ref: el => {
+                        if (el)
+                            rowRefs.current.push(el);
+                    }, children: node }, i)))) }) }) }));
+}

package/dist/core/ui/plcErrorBoundary.d.ts

@@ -0,0 +1,17 @@
+import { Component, ErrorInfo } from "react";
+export declare class SlotErrorBoundary extends Component<{
+    id: string;
+    fallback?: React.ReactNode;
+    children: React.ReactNode;
+}, {
+    hasError: boolean;
+}> {
+    state: {
+        hasError: boolean;
+    };
+    static getDerivedStateFromError(_: Error): {
+        hasError: boolean;
+    };
+    componentDidCatch(error: Error, errorInfo: ErrorInfo): void;
+    render(): string | number | bigint | boolean | Iterable<import("react").ReactNode> | Promise<string | number | bigint | boolean | import("react").ReactPortal | import("react").ReactElement<unknown, string | import("react").JSXElementConstructor<any>> | Iterable<import("react").ReactNode> | null | undefined> | import("react/jsx-runtime").JSX.Element | null | undefined;
+}

package/dist/core/ui/plcErrorBoundary.js

@@ -0,0 +1,17 @@
+import { jsxs as _jsxs } from "react/jsx-runtime";
+import { Component } from "react";
+export class SlotErrorBoundary extends Component {
+    state = { hasError: false };
+    static getDerivedStateFromError(_) {
+        return { hasError: true };
+    }
+    componentDidCatch(error, errorInfo) {
+        console.error(`[PlcLayout] Error in slot item '${this.props.id}':`, error, errorInfo);
+    }
+    render() {
+        if (this.state.hasError) {
+            return this.props.fallback || (_jsxs("div", { style: { padding: 4, color: 'red', fontSize: '0.8em', border: '1px dashed red' }, children: ["Error: ", this.props.id] }));
+        }
+        return this.props.children;
+    }
+}

package/dist/core/ui/plcInspector.d.ts

@@ -0,0 +1,5 @@
+import React from "react";
+import { PlcAPI } from "../plcAPI";
+export declare const PlcInspector: React.FC<{
+    api: PlcAPI;
+}>;

package/dist/core/ui/plcInspector.js

@@ -0,0 +1,27 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { useState, useEffect } from "react";
+const styles = {
+    container: { position: 'fixed', bottom: 0, right: 0, width: '300px', height: '400px', background: '#222', color: '#fff', overflow: 'auto', zIndex: 9999, padding: '10px', borderTopLeftRadius: '8px', fontSize: '12px', fontFamily: 'monospace', boxShadow: '-2px -2px 10px rgba(0,0,0,0.5)' },
+    header: { borderBottom: '1px solid #444', paddingBottom: '5px', marginBottom: '5px', fontWeight: 'bold', display: 'flex', justifyContent: 'space-between' },
+    section: { marginBottom: '10px' },
+    label: { color: '#888', marginBottom: '2px' },
+    item: { paddingLeft: '10px', color: '#4CAF50' },
+    value: { color: '#ce9178' }
+};
+export const PlcInspector = ({ api }) => {
+    const [, setTick] = useState(0);
+    const [isOpen, setIsOpen] = useState(false);
+    useEffect(() => {
+        if (!isOpen)
+            return;
+        const interval = setInterval(() => setTick(t => t + 1), 1000);
+        return () => clearInterval(interval);
+    }, [isOpen]);
+    if (!isOpen) {
+        return (_jsx("button", { onClick: () => setIsOpen(true), style: { position: 'fixed', bottom: 10, right: 10, zIndex: 9999, background: '#333', color: '#fff', border: 'none', padding: '5px 10px', borderRadius: '4px', cursor: 'pointer' }, children: "\uD83D\uDEE0\uFE0F PLC" }));
+    }
+    const slotsMap = api.layout.slots;
+    const slots = Array.from(slotsMap.entries());
+    const storeKeys = Array.from(api.store.storeData.keys());
+    return (_jsxs("div", { style: styles.container, children: [_jsxs("div", { style: styles.header, children: [_jsx("span", { children: "PLC Framework Debugger" }), _jsx("button", { onClick: () => setIsOpen(false), style: { background: 'none', border: 'none', color: '#fff', cursor: 'pointer' }, children: "\u2715" })] }), _jsxs("div", { style: styles.section, children: [_jsxs("div", { style: styles.label, children: ["ACTIVE SLOTS (", slots.length, ")"] }), slots.map(([name, items]) => (_jsxs("div", { children: [_jsx("span", { style: { color: '#569CD6' }, children: name }), _jsxs("span", { style: { color: '#888' }, children: [" (", items.length, ")"] }), items.map((it) => (_jsxs("div", { style: styles.item, children: ["\u2514 ", it.id, " ", _jsxs("span", { style: { fontSize: '0.9em', color: '#888' }, children: ["(prio: ", it.priority, ")"] })] }, it.id)))] }, name)))] }), _jsxs("div", { style: styles.section, children: [_jsx("div", { style: styles.label, children: "ROOT STORE KEYS" }), storeKeys.map((k) => (_jsxs("div", { style: styles.item, children: ["\u2022 ", k] }, k)))] })] }));
+};

package/dist/core/ui/plcLayout.d.ts

@@ -0,0 +1,28 @@
+import React from "react";
+import { SlotWrapper } from "../../types/core/ui";
+export declare const ScopeContext: React.Context<any>;
+export type SlotItem = {
+    id: string;
+    priority: number;
+    keepAlive: boolean;
+    fn: (props?: any) => React.ReactNode;
+};
+export declare class PlcLayout {
+    private slots;
+    private virtualRegistry;
+    private wrappers;
+    private renderCache;
+    private cacheVersion;
+    markVirtual(slot: string, config?: {
+        itemHeight?: number;
+        overscan?: number;
+    }): void;
+    wrap(slot: string, wrapper: SlotWrapper, priority?: number): void;
+    register(slot: string, id: string, fn: (props?: any) => React.ReactNode, priority?: number, keepAlive?: boolean): void;
+    unregister(slot: string, id: string): void;
+    invalidate(slot?: string): void;
+    render(slot: string, props?: any): React.ReactNode;
+    private renderBase;
+    getSlotItems(slot: string): SlotItem[];
+    getPriority(slot: string, id: string): number | undefined;
+}

package/dist/core/ui/plcLayout.js

@@ -0,0 +1,125 @@
+import { jsxs as _jsxs, jsx as _jsx } from "react/jsx-runtime";
+import { createContext, Component } from "react";
+import { VirtualContainer } from "./plcCore";
+export const ScopeContext = createContext(undefined);
+// ---------------------------------------------------------
+// Error Boundary
+// ---------------------------------------------------------
+class SlotErrorBoundary extends Component {
+    state = { hasError: false };
+    static getDerivedStateFromError(_) {
+        return { hasError: true };
+    }
+    componentDidCatch(error, errorInfo) {
+        console.error(`[PlcLayout] Error in slot item '${this.props.id}':`, error, errorInfo);
+    }
+    render() {
+        if (this.state.hasError) {
+            return this.props.fallback || (_jsxs("div", { style: { padding: 4, color: 'red', fontSize: '0.8em', border: '1px dashed red' }, children: ["Error: ", this.props.id] }));
+        }
+        return this.props.children;
+    }
+}
+export class PlcLayout {
+    slots = new Map();
+    virtualRegistry = new Map();
+    wrappers = new Map();
+    renderCache = new Map();
+    cacheVersion = new Map();
+    // ---------------------------------------------------------
+    // Virtualization
+    // ---------------------------------------------------------
+    markVirtual(slot, config) {
+        this.virtualRegistry.set(slot, {
+            itemHeight: config?.itemHeight ?? 32,
+            overscan: config?.overscan ?? 6,
+            measured: !!config?.itemHeight,
+            estimatedHeight: config?.itemHeight ?? 32,
+        });
+    }
+    // ---------------------------------------------------------
+    // Middleware (WRAP)
+    // ---------------------------------------------------------
+    wrap(slot, wrapper, priority = 0) {
+        if (!this.wrappers.has(slot)) {
+            this.wrappers.set(slot, []);
+        }
+        this.wrappers.get(slot).push(wrapper);
+        this.invalidate(slot);
+    }
+    // ---------------------------------------------------------
+    // Slot Manager
+    // ---------------------------------------------------------
+    register(slot, id, fn, priority = 0, keepAlive = false) {
+        if (!this.slots.has(slot)) {
+            this.slots.set(slot, []);
+            this.cacheVersion.set(slot, 0);
+        }
+        const list = this.slots.get(slot);
+        const existingIdx = list.findIndex(x => x.id === id);
+        const item = { id, priority, fn, keepAlive };
+        if (existingIdx >= 0)
+            list[existingIdx] = item;
+        else
+            list.push(item);
+        list.sort((a, b) => b.priority - a.priority);
+        this.invalidate(slot);
+    }
+    unregister(slot, id) {
+        const list = this.slots.get(slot);
+        if (!list)
+            return;
+        const idx = list.findIndex(x => x.id === id);
+        if (idx >= 0) {
+            list.splice(idx, 1);
+            this.invalidate(slot);
+        }
+    }
+    // ---------------------------------------------------------
+    // Render
+    // ---------------------------------------------------------
+    invalidate(slot) {
+        if (slot) {
+            this.renderCache.delete(slot);
+            this.cacheVersion.set(slot, (this.cacheVersion.get(slot) || 0) + 1);
+        }
+        else {
+            this.renderCache.clear();
+            for (const k of this.cacheVersion.keys()) {
+                this.cacheVersion.set(k, (this.cacheVersion.get(k) || 0) + 1);
+            }
+        }
+    }
+    render(slot, props) {
+        let content = this.renderBase(slot, props);
+        const slotWrappers = this.wrappers.get(slot);
+        if (slotWrappers && slotWrappers.length > 0) {
+            for (const wrapFn of slotWrappers) {
+                content = wrapFn(content, props);
+            }
+        }
+        return content;
+    }
+    renderBase(slot, props) {
+        const list = this.slots.get(slot) || [];
+        const virtualConfig = this.virtualRegistry.get(slot);
+        if (virtualConfig && list.length > 0) {
+            const protectedItems = list.map(item => ({
+                ...item,
+                fn: (p) => (_jsx(SlotErrorBoundary, { id: item.id, children: item.fn(p) }))
+            }));
+            const content = protectedItems.map((item, i) => (_jsx(ScopeContext.Provider, { value: props, children: item.fn(props) }, item.id)));
+            return (_jsx(VirtualContainer, { content: content, config: virtualConfig, contextData: props }));
+        }
+        return list.map(item => {
+            const isActive = props?.activeId ? props.activeId === item.id : true;
+            if (!isActive && !item.keepAlive)
+                return null;
+            return (_jsx("div", { style: { display: isActive ? undefined : 'none' }, children: _jsx(SlotErrorBoundary, { id: item.id, children: _jsx(ScopeContext.Provider, { value: props, children: item.fn(props) }) }) }, item.id));
+        });
+    }
+    getSlotItems(slot) { return this.slots.get(slot) || []; }
+    getPriority(slot, id) {
+        return this.slots.get(slot)?.find(x => x.id === id)?.priority;
+    }
+}

package/dist/index.d.ts

@@ -0,0 +1,8 @@
+export * from "./core/plcAPI";
+export * from "./core/plcStore";
+export * from "./core/plcPipeline";
+export * from "./core/plcScheduler";
+export * from "./core/helpers/core";
+export * from "./types/core/general";
+export * from "./types/core/api";
+export * from "./types/core/registry";

package/dist/index.js

@@ -0,0 +1,8 @@
+export * from "./core/plcAPI";
+export * from "./core/plcStore";
+export * from "./core/plcPipeline";
+export * from "./core/plcScheduler";
+export * from "./core/helpers/core";
+export * from "./types/core/general";
+export * from "./types/core/api";
+export * from "./types/core/registry";

package/dist/types/core/api.d.ts

@@ -0,0 +1,7 @@
+export type CommandFn<Payload = any, Result = any> = (payload?: Payload) => Promise<Result> | Result;
+export type CommandWrapper<P = any, R = any> = (next: CommandFn<P, R>) => CommandFn<P, R>;
+export type transformerType<T = any> = {
+    id: string;
+    priority: number;
+    fn: (data: T, context: any) => T;
+};

package/dist/types/core/api.js

@@ -0,0 +1 @@
+export {};

package/dist/types/core/general.d.ts

@@ -0,0 +1,15 @@
+import { PlcAPI } from "../../core/plcAPI";
+import { CommandFn } from "./api";
+export type ObjectType = Record<string, any>;
+export type ModuleManifest = {
+    name: string;
+    state?: Record<string, any>;
+    commands?: Record<string, CommandFn>;
+    slots?: Record<string, {
+        id: string;
+        component: (props?: any) => React.ReactNode;
+        priority?: number;
+        keepAlive?: boolean;
+    }[]>;
+    onLoad?: (api: PlcAPI) => void;
+};

package/dist/types/core/general.js

@@ -0,0 +1 @@
+export {};

package/dist/types/core/registry.d.ts

@@ -0,0 +1,7 @@
+import { ObjectType } from "./general";
+export type SlotRegistry = ObjectType;
+export type ChannelRegistry = ObjectType;
+export type CommandRegistry = Record<string, {
+    payload?: any;
+    result?: any;
+}>;

package/dist/types/core/registry.js

@@ -0,0 +1 @@
+export {};

package/dist/types/core/ui.d.ts

@@ -0,0 +1,7 @@
+export type SlotWrapper = (next: React.ReactNode, props?: any) => React.ReactNode;
+export type VirtualConfig = {
+    itemHeight: number;
+    overscan: number;
+    measured: boolean;
+    estimatedHeight: number;
+};

package/dist/types/core/ui.js

@@ -0,0 +1 @@
+export {};

package/dist/types/registry.d.ts

@@ -0,0 +1,20 @@
+export interface RootStoreRegistry {
+}
+export interface CommandRegistry {
+}
+export interface SlotRegistry {
+}
+export interface FeatureRegistry {
+}
+export type StoreKey = keyof RootStoreRegistry extends never ? string : keyof RootStoreRegistry;
+export type StoreValue<K extends StoreKey> = K extends keyof RootStoreRegistry ? RootStoreRegistry[K] : any;
+export type CommandKey = keyof CommandRegistry extends never ? string : keyof CommandRegistry;
+export type SlotKey = keyof SlotRegistry extends never ? string : keyof SlotRegistry;
+export type FeatureKey = keyof FeatureRegistry extends never ? string : keyof FeatureRegistry;
+export type CmdPayload<K extends CommandKey> = K extends keyof CommandRegistry ? (CommandRegistry[K] extends {
+    payload: infer P;
+} ? P : void) : any;
+export type CmdResult<K extends CommandKey> = K extends keyof CommandRegistry ? (CommandRegistry[K] extends {
+    result: infer R;
+} ? R : void) : any;
+export type SlotProps<K extends SlotKey> = K extends keyof SlotRegistry ? SlotRegistry[K] : any;

package/dist/types/registry.js

@@ -0,0 +1 @@
+export {};

package/package.json

@@ -1,37 +1,31 @@
 {
   "name": "plug-code",
-  "version": "1.2.0",
+  "version": "2.0.1",
   "description": "",
-  "main": "src/plug-code.tsx",
-  "types": "types/plug-code.d.ts",
-  "exports": {
-    ".": {
-      "import": "./src/plug-code.tsx",
-      "require": "./src/plug-code.tsx"
-    }
-  },
+  "main": "dist/index.js",
+  "types": "dist/index.d.ts",
+  "files": [
+    "dist"
+  ],
   "scripts": {
-    "test": "echo \"Error: no test specified\" && exit 1",
-    "build:types": "tsc -p tsconfig.json"
-  },
-  "repository": {
-    "type": "git",
-    "url": "git+https://github.com/AlaunS/plug-code.git"
+    "build": "tsc",
+    "watch": "tsc --watch",
+    "test": "jest"
   },
   "keywords": [],
   "author": "",
   "license": "ISC",
   "type": "commonjs",
-  "bugs": {
-    "url": "https://github.com/AlaunS/plug-code/issues"
+  "devDependencies": {
+    "@types/jest": "^30.0.0",
+    "@types/node": "^25.0.3",
+    "@types/react": "^19.2.7",
+    "jest": "^30.2.0",
+    "ts-jest": "^29.4.6",
+    "typescript": "^5.9.3"
   },
-  "homepage": "https://github.com/AlaunS/plug-code#readme",
   "dependencies": {
     "immer": "^11.1.3",
     "react": "^19.2.3"
-  },
-  "devDependencies": {
-    "@types/react": "^19.2.7",
-    "typescript": "^5.4.2"
   }
 }

package/index.d.ts

@@ -1 +0,0 @@
-export * from "./types/plug-code";

package/src/contexts/pipeline.tsx

@@ -1,4 +0,0 @@
-import { createContext, useContext } from "react";
-
-export const ScopeContext = createContext<any>(null);
-export const useScopeData = <T,>() => useContext(ScopeContext) as T;