@pisapp/reactive-dom 7.0.0-dev.20260916-153034

package/LICENSE

@@ -0,0 +1,28 @@
+PRODUCT INFORMATION SERVICES (PIS) PROPRIETARY SOFTWARE LICENSE
+
+Copyright (c) 2026 ABB Asea Brown Boveri Ltd. All rights reserved.
+
+The Product Information Services (PIS) software package and its documentation
+(the "Software") are proprietary to ABB Asea Brown Boveri Ltd and its
+licensors.
+
+Subject to a valid written agreement between ABB and you or the organization
+you represent that authorizes use of PIS (the "Applicable Agreement"), ABB
+grants you a non-exclusive, non-transferable, non-sublicensable, limited
+license to install and use the Software solely to develop, test, and run
+applications that access PIS services as authorized by the Applicable
+Agreement.
+
+Except to the extent that mandatory law does not allow a restriction, you may
+not copy, modify, distribute, publish, sublicense, rent, lease, sell, or
+otherwise make the Software available to a third party. You may not remove or
+alter proprietary notices or reverse engineer the Software except as expressly
+permitted by mandatory law.
+
+If no Applicable Agreement authorizes your use of PIS, no license to use the
+Software is granted. Your right to use the Software ends when the Applicable
+Agreement ends or your authorization under it is withdrawn.
+
+The Applicable Agreement controls if it conflicts with this notice. The
+Software is provided subject to the warranties, limitations of liability, and
+other terms in the Applicable Agreement.

package/README.md

@@ -0,0 +1,68 @@
+# @pisapp/reactive-dom
+
+The reactive engine behind PIS v7 template render functions (decisions
+D-JsLock / D-JsReactivity / D-N2). `reactiveMount(render)` wraps a plain-DOM
+render function in Vue's `effect()` so that every reactive `ctx.*` field it
+reads is tracked and the render re-runs when those fields change — on the same
+reactivity core the PIS `ctx` is already built on.
+
+## Install
+
+```bash
+pnpm add @pisapp/core @pisapp/reactive-dom vue
+# npm install @pisapp/core @pisapp/reactive-dom vue
+```
+
+### Peer dependencies
+
+| Package        | Range      | Notes                                                    |
+| -------------- | ---------- | -------------------------------------------------------- |
+| `@pisapp/core` | `^7.0.0`   | The component runtime; types the render pairs slot into. |
+| `vue`          | `>=3.5.17` | Provides `effect` / `effectScope`.                       |
+
+## When you need this package
+
+Usually **never**: assigning a bare render function `(container, ctx) =>
+cleanup | void` directly to a `*Template` option wraps it in `reactiveMount`
+automatically (core's `MountPoint` does it for you), with contextual typing at
+the option site.
+
+Import `reactiveMount` directly only when you build the render function as a
+**standalone value reused across several slots** and want one explicit wrapper
+around it.
+
+## Usage
+
+```ts
+import { reactiveMount } from '@pisapp/reactive-dom';
+
+const stockCell = reactiveMount((container, ctx) => {
+  const btn = document.createElement('button');
+  btn.disabled = ctx.item.stock < 1; // reactive — re-runs when stock changes
+  btn.addEventListener('click', () => ctx.emit('app:AddToCart', ctx.item));
+  container.replaceChildren(btn);
+  return () => btn.replaceWith(); // useEffect-style cleanup
+});
+
+columns.push({ dataField: 'ProductId', cellTemplate: stockCell });
+```
+
+`reactiveMount(render)` returns a `{ mount, unmount }` pair assignable to any
+`*Template` slot:
+
+- `render(container, ctx)` runs inside a Vue `effect`; tracked `ctx.*` reads
+  re-run the render body in place (the cell is not restarted, preserving any
+  component state — auto re-mount stays rejected, D-N2).
+- A returned cleanup function runs before each re-render and on unmount
+  (useEffect semantics).
+- `unmount(container)` stops the effect scope deterministically — no leaked
+  effects or listeners.
+
+CSP-safe: `effect` tracking relies on Proxies, not `eval`/`Function`, so this
+works under strict Content-Security-Policy.
+
+The package also re-exports `effect`, `effectScope`, and `onScopeDispose` from
+`vue` for advanced standalone use.
+
+See the [JavaScript template guide](../../PisNextGenDocs/src/migration/web-components/javascript.md)
+for the full render-function authoring model.

package/THIRD-PARTY-NOTICES.txt

@@ -0,0 +1,43 @@
+THIRD-PARTY NOTICES
+
+Product Information Services (PIS) packages may include or depend on the
+third-party software listed below. The applicable third-party license terms
+apply to that software.
+
+Bootstrap 5.3.2
+Copyright (c) 2011-2023 The Bootstrap Authors
+
+vue-virtual-scroller 2.0.1
+Copyright (c) 2020 guillaume.b.chau@gmail.com
+
+Vue 3.5.40
+Copyright (c) 2018-present, Yuxi (Evan) You
+
+vue3-runtime-template 1.0.2
+Copyright (c) 2018 Alex Jover
+
+The components listed above are licensed under the MIT License:
+
+MIT License
+
+Permission is hereby granted, free of charge, to any person obtaining a copy
+of this software and associated documentation files (the "Software"), to deal
+in the Software without restriction, including without limitation the rights
+to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
+copies of the Software, and to permit persons to whom the Software is
+furnished to do so, subject to the following conditions:
+
+The above copyright notice and this permission notice shall be included in all
+copies or substantial portions of the Software.
+
+THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
+IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
+FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
+AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
+LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
+OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
+SOFTWARE.
+
+ABBvoice font assets are proprietary ABB assets. They are not redistributed in
+these npm packages. PIS CSS references the ABB-hosted font service at:
+https://external.productinformation.abb.com/PisApp/current/fonts/

package/dist/index.d.ts

@@ -0,0 +1,30 @@
+/** A render function: mutates the container; may return a cleanup (useEffect-style). */
+export type RenderFn<C> = (container: HTMLElement, ctx: C) => (() => void) | void;
+/** The pair returned by `reactiveMount`. Assign to a `*Template` slot value. */
+export interface ReactiveMountPair<C> {
+    mount: (container: HTMLElement, ctx: C) => void;
+    unmount: (container: HTMLElement) => void;
+}
+/**
+ * Wrap a render function into a reactive template pair (D-JsLock).
+ *
+ * - `render(container, ctx)` runs inside a Vue `effect`: any reactive `ctx.*`
+ *   field it reads is tracked, and the render re-runs when those fields change.
+ * - The render body may return a cleanup function (useEffect-style); it runs
+ *   before each re-render and on unmount.
+ * - The effect is owned by an `effectScope` so `unmount` tears down everything
+ *   deterministically (no leaked effect, no leaked listeners if cleanup removed them).
+ *
+ * @example
+ * import { reactiveMount } from '@pisapp/reactive-dom';
+ * columns.push({
+ *   cellTemplate: reactiveMount((container, ctx) => {
+ *     const btn = document.createElement('button');
+ *     btn.disabled = ctx.item.stock < 1;          // reactive ✅
+ *     btn.addEventListener('click', onClick);
+ *     container.replaceChildren(btn);
+ *     return () => btn.removeEventListener('click', onClick);  // cleanup
+ *   })
+ * });
+ */
+export declare function reactiveMount<C>(render: RenderFn<C>): ReactiveMountPair<C>;

package/dist/index.js

@@ -0,0 +1,25 @@
+import { effect as e, effectScope as t, onScopeDispose as n } from "vue";
+//#region src/index.ts
+function r(r) {
+	let i = /* @__PURE__ */ new WeakMap();
+	return {
+		mount: (a, o) => {
+			if (i.has(a)) return;
+			let s = t(), c = { scope: s };
+			i.set(a, c), s.run(() => {
+				let t;
+				c.runner = e(() => {
+					t?.();
+					let e = r(a, o);
+					t = typeof e == "function" ? e : void 0;
+				}), n(() => t?.());
+			});
+		},
+		unmount: (e) => {
+			let t = i.get(e);
+			t && (t.scope.stop(), i.delete(e));
+		}
+	};
+}
+//#endregion
+export { r as reactiveMount };

package/package.json

@@ -0,0 +1,45 @@
+{
+  "name": "@pisapp/reactive-dom",
+  "version": "7.0.0-dev.20260916-153034",
+  "license": "SEE LICENSE IN LICENSE",
+  "author": "ABB Asea Brown Boveri Ltd",
+  "description": "PIS v7 reactive template engine — reactiveMount wraps a render function in @vue/reactivity's effect() so cells built from a reactive ctx re-render on change. MountPoint wraps every plain-DOM render function in it (decisions D-JsReactivity / D-JsLock).",
+  "type": "module",
+  "main": "./dist/index.js",
+  "types": "./dist/index.d.ts",
+  "exports": {
+    ".": {
+      "types": "./dist/index.d.ts",
+      "import": "./dist/index.js"
+    }
+  },
+  "files": [
+    "dist",
+    "LICENSE",
+    "THIRD-PARTY-NOTICES.txt"
+  ],
+  "peerDependencies": {
+    "vue": ">=3.5.17 <4"
+  },
+  "devDependencies": {
+    "typescript": "~6.0.3",
+    "vue": ">=3.5.17 <4",
+    "vitest": "^4.1.10",
+    "jsdom": "^25.0.1"
+  },
+  "publishConfig": {
+    "access": "public"
+  },
+  "pisRelease": {
+    "version": "7.0.0-dev.20260916-153034",
+    "channel": "dev",
+    "commit": "3cfd54cc87975b643036674bfb2d000d81973ac5"
+  },
+  "scripts": {
+    "build": "node ../../scripts/build-library.mjs --package @pisapp/reactive-dom",
+    "lint": "eslint . --max-warnings 0",
+    "lint:fix": "eslint . --fix",
+    "typecheck": "tsc --noEmit -p tsconfig.json",
+    "test": "vitest run"
+  }
+}