@solid-labs/fab-one-widget 0.1.0 → 0.1.2

package/dist/girth-manager-web-widget/src/web-component.d.ts

@@ -0,0 +1,34 @@
+import type { WidgetRequest, WidgetResponse } from "./types";
+/**
+ * Custom Element wrapper for Angular integration.
+ *
+ * Usage in Angular:
+ *   // In the component class:
+ *   async ngAfterViewInit() {
+ *     const wasm = await import('galileo-core-geo');
+ *     await wasm.default();
+ *     this.widgetEl.nativeElement.wasmModule = wasm;
+ *     this.widgetEl.nativeElement.request = { spacing_type: 'BK', scan_url: '...' };
+ *   }
+ *
+ *   // In the template:
+ *   <girth-manager-widget #widgetEl (widgetComplete)="onComplete($event)"></girth-manager-widget>
+ */
+declare class GirthManagerWidgetElement extends HTMLElement {
+    private _root;
+    private _request;
+    private _wasmModule;
+    static get observedAttributes(): string[];
+    get request(): WidgetRequest | null;
+    set request(value: WidgetRequest | string | null);
+    /** Set the pre-loaded WASM module (galileo-core-geo). Must be set before or alongside request. */
+    get wasmModule(): unknown;
+    set wasmModule(value: unknown);
+    connectedCallback(): void;
+    disconnectedCallback(): void;
+    attributeChangedCallback(name: string, _oldValue: string, newValue: string): void;
+    private _handleComplete;
+    private _render;
+}
+export { GirthManagerWidgetElement };
+export type { WidgetRequest, WidgetResponse };

package/dist/index.js

@@ -0,0 +1,7 @@
+import { G as a, a as c, c as i, g as s } from "./GirthManagerWidget-DizbUvPi.js";
+export {
+  a as GirthManagerWidget,
+  c as arrayToCircumference,
+  i as circumferenceToArray,
+  s as getCircumferenceKeys
+};

package/dist/index.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.js","sources":[],"sourcesContent":[],"names":[],"mappings":";"}

package/dist/web-component.js

@@ -0,0 +1,78 @@
+import { createElement as s } from "react";
+import { createRoot as i } from "react-dom/client";
+import { G as o } from "./GirthManagerWidget-DizbUvPi.js";
+class n extends HTMLElement {
+  constructor() {
+    super(...arguments), this._root = null, this._request = null, this._wasmModule = void 0, this._handleComplete = (e) => {
+      this.dispatchEvent(
+        new CustomEvent("widgetComplete", {
+          detail: e,
+          bubbles: true,
+          composed: true
+        })
+      );
+    };
+  }
+  static get observedAttributes() {
+    return ["request"];
+  }
+  get request() {
+    return this._request;
+  }
+  set request(e) {
+    if (typeof e == "string")
+      try {
+        this._request = JSON.parse(e);
+      } catch {
+        console.error("[GirthManagerWidget] Invalid JSON for request attribute:", e);
+        return;
+      }
+    else
+      this._request = e;
+    this._render();
+  }
+  /** Set the pre-loaded WASM module (galileo-core-geo). Must be set before or alongside request. */
+  get wasmModule() {
+    return this._wasmModule;
+  }
+  set wasmModule(e) {
+    this._wasmModule = e, this._render();
+  }
+  connectedCallback() {
+    const e = this.attachShadow({ mode: "open" }), t = document.createElement("div");
+    t.style.width = "100%", t.style.height = "100%", e.appendChild(t), this._root = i(t);
+    const r = this.getAttribute("request");
+    if (r && !this._request)
+      try {
+        this._request = JSON.parse(r);
+      } catch {
+        console.error("[GirthManagerWidget] Invalid JSON in request attribute");
+      }
+    this._render();
+  }
+  disconnectedCallback() {
+    var _a;
+    (_a = this._root) == null ? void 0 : _a.unmount(), this._root = null;
+  }
+  attributeChangedCallback(e, t, r) {
+    if (e === "request" && r)
+      try {
+        this._request = JSON.parse(r), this._render();
+      } catch {
+        console.error("[GirthManagerWidget] Invalid JSON in request attribute");
+      }
+  }
+  _render() {
+    !this._root || !this._request || this._root.render(
+      s(o, {
+        request: this._request,
+        onComplete: this._handleComplete,
+        wasmModule: this._wasmModule
+      })
+    );
+  }
+}
+customElements.get("girth-manager-widget") || customElements.define("girth-manager-widget", n);
+export {
+  n as GirthManagerWidgetElement
+};

package/dist/web-component.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"web-component.js","sources":["../src/web-component.ts"],"sourcesContent":["import { createElement } from \"react\"\nimport { createRoot, type Root } from \"react-dom/client\"\nimport { GirthManagerWidget } from \"./GirthManagerWidget\"\nimport type { WidgetRequest, WidgetResponse } from \"./types\"\n\n/**\n * Custom Element wrapper for Angular integration.\n *\n * Usage in Angular:\n *   // In the component class:\n *   async ngAfterViewInit() {\n *     const wasm = await import('galileo-core-geo');\n *     await wasm.default();\n *     this.widgetEl.nativeElement.wasmModule = wasm;\n *     this.widgetEl.nativeElement.request = { spacing_type: 'BK', scan_url: '...' };\n *   }\n *\n *   // In the template:\n *   <girth-manager-widget #widgetEl (widgetComplete)=\"onComplete($event)\"></girth-manager-widget>\n */\nclass GirthManagerWidgetElement extends HTMLElement {\n    private _root: Root | null = null\n    private _request: WidgetRequest | null = null\n    // eslint-disable-next-line @typescript-eslint/no-explicit-any\n    private _wasmModule: any = undefined\n\n    static get observedAttributes() {\n        return [\"request\"]\n    }\n\n    get request(): WidgetRequest | null {\n        return this._request\n    }\n\n    set request(value: WidgetRequest | string | null) {\n        if (typeof value === \"string\") {\n            try {\n                this._request = JSON.parse(value)\n            } catch {\n                console.error(\"[GirthManagerWidget] Invalid JSON for request attribute:\", value)\n                return\n            }\n        } else {\n            this._request = value\n        }\n        this._render()\n    }\n\n    /** Set the pre-loaded WASM module (galileo-core-geo). Must be set before or alongside request. */\n    get wasmModule() {\n        return this._wasmModule\n    }\n\n    set wasmModule(value: unknown) {\n        this._wasmModule = value\n        this._render()\n    }\n\n    connectedCallback() {\n        const shadow = this.attachShadow({ mode: \"open\" })\n        const container = document.createElement(\"div\")\n        container.style.width = \"100%\"\n        container.style.height = \"100%\"\n        shadow.appendChild(container)\n        this._root = createRoot(container)\n\n        // Parse request from attribute if set before connection\n        const attrValue = this.getAttribute(\"request\")\n        if (attrValue && !this._request) {\n            try {\n                this._request = JSON.parse(attrValue)\n            } catch {\n                console.error(\"[GirthManagerWidget] Invalid JSON in request attribute\")\n            }\n        }\n\n        this._render()\n    }\n\n    disconnectedCallback() {\n        this._root?.unmount()\n        this._root = null\n    }\n\n    attributeChangedCallback(name: string, _oldValue: string, newValue: string) {\n        if (name === \"request\" && newValue) {\n            try {\n                this._request = JSON.parse(newValue)\n                this._render()\n            } catch {\n                console.error(\"[GirthManagerWidget] Invalid JSON in request attribute\")\n            }\n        }\n    }\n\n    private _handleComplete = (response: WidgetResponse) => {\n        this.dispatchEvent(\n            new CustomEvent(\"widgetComplete\", {\n                detail: response,\n                bubbles: true,\n                composed: true,\n            })\n        )\n    }\n\n    private _render() {\n        if (!this._root || !this._request) return\n\n        this._root.render(\n            createElement(GirthManagerWidget, {\n                request: this._request,\n                onComplete: this._handleComplete,\n                wasmModule: this._wasmModule,\n            })\n        )\n    }\n}\n\n// Register the custom element\nif (!customElements.get(\"girth-manager-widget\")) {\n    customElements.define(\"girth-manager-widget\", GirthManagerWidgetElement)\n}\n\nexport { GirthManagerWidgetElement }\nexport type { WidgetRequest, WidgetResponse }\n"],"names":["GirthManagerWidgetElement","response","value","shadow","container","createRoot","attrValue","name","_oldValue","newValue","createElement","GirthManagerWidget"],"mappings":";;;AAoBA,MAAMA,UAAkC,YAAY;AAAA,EAApD,cAAA;AAAA,UAAA,GAAA,SAAA,GACI,KAAQ,QAAqB,MAC7B,KAAQ,WAAiC,MAEzC,KAAQ,cAAmB,QAuE3B,KAAQ,kBAAkB,CAACC,MAA6B;AACpD,WAAK;AAAA,QACD,IAAI,YAAY,kBAAkB;AAAA,UAC9B,QAAQA;AAAA,UACR,SAAS;AAAA,UACT,UAAU;AAAA,QAAA,CACb;AAAA,MAAA;AAAA,IAET;AAAA,EAAA;AAAA,EA7EA,WAAW,qBAAqB;AAC5B,WAAO,CAAC,SAAS;AAAA,EACrB;AAAA,EAEA,IAAI,UAAgC;AAChC,WAAO,KAAK;AAAA,EAChB;AAAA,EAEA,IAAI,QAAQC,GAAsC;AAC9C,QAAI,OAAOA,KAAU;AACjB,UAAI;AACA,aAAK,WAAW,KAAK,MAAMA,CAAK;AAAA,MACpC,QAAQ;AACJ,gBAAQ,MAAM,4DAA4DA,CAAK;AAC/E;AAAA,MACJ;AAAA;AAEA,WAAK,WAAWA;AAEpB,SAAK,QAAA;AAAA,EACT;AAAA;AAAA,EAGA,IAAI,aAAa;AACb,WAAO,KAAK;AAAA,EAChB;AAAA,EAEA,IAAI,WAAWA,GAAgB;AAC3B,SAAK,cAAcA,GACnB,KAAK,QAAA;AAAA,EACT;AAAA,EAEA,oBAAoB;AAChB,UAAMC,IAAS,KAAK,aAAa,EAAE,MAAM,QAAQ,GAC3CC,IAAY,SAAS,cAAc,KAAK;AAC9C,IAAAA,EAAU,MAAM,QAAQ,QACxBA,EAAU,MAAM,SAAS,QACzBD,EAAO,YAAYC,CAAS,GAC5B,KAAK,QAAQC,EAAWD,CAAS;AAGjC,UAAME,IAAY,KAAK,aAAa,SAAS;AAC7C,QAAIA,KAAa,CAAC,KAAK;AACnB,UAAI;AACA,aAAK,WAAW,KAAK,MAAMA,CAAS;AAAA,MACxC,QAAQ;AACJ,gBAAQ,MAAM,wDAAwD;AAAA,MAC1E;AAGJ,SAAK,QAAA;AAAA,EACT;AAAA,EAEA,uBAAuB;AACnB,SAAK,OAAO,QAAA,GACZ,KAAK,QAAQ;AAAA,EACjB;AAAA,EAEA,yBAAyBC,GAAcC,GAAmBC,GAAkB;AACxE,QAAIF,MAAS,aAAaE;AACtB,UAAI;AACA,aAAK,WAAW,KAAK,MAAMA,CAAQ,GACnC,KAAK,QAAA;AAAA,MACT,QAAQ;AACJ,gBAAQ,MAAM,wDAAwD;AAAA,MAC1E;AAAA,EAER;AAAA,EAYQ,UAAU;AACd,IAAI,CAAC,KAAK,SAAS,CAAC,KAAK,YAEzB,KAAK,MAAM;AAAA,MACPC,EAAcC,GAAoB;AAAA,QAC9B,SAAS,KAAK;AAAA,QACd,YAAY,KAAK;AAAA,QACjB,YAAY,KAAK;AAAA,MAAA,CACpB;AAAA,IAAA;AAAA,EAET;AACJ;AAGK,eAAe,IAAI,sBAAsB,KAC1C,eAAe,OAAO,wBAAwBX,CAAyB;"}

package/package.json

@@ -1,40 +1,50 @@
 {
   "name": "@solid-labs/fab-one-widget",
-  "version": "0.1.0",
+  "version": "0.1.2",
   "type": "module",
-  "description": "Web Component widget for 3D prosthetic measurement visualization",
-  "main": "dist/fab-one-widget.js",
-  "module": "dist/fab-one-widget.js",
-  "types": "dist/index.d.ts",
+  "main": "./dist/index.js",
+  "types": "./dist/girth-manager-web-widget/src/index.d.ts",
+  "exports": {
+    ".": {
+      "import": "./dist/index.js",
+      "types": "./dist/girth-manager-web-widget/src/index.d.ts"
+    },
+    "./web-component": {
+      "import": "./dist/web-component.js",
+      "types": "./dist/girth-manager-web-widget/src/web-component.d.ts"
+    }
+  },
   "files": [
     "dist"
   ],
   "scripts": {
-    "build": "vite build && tsc",
-    "dev": "vite build --watch"
+    "dev": "vite",
+    "build": "vite build && tsc --emitDeclarationOnly",
+    "preview": "vite preview",
+    "typecheck": "tsc --noEmit"
   },
   "dependencies": {
-    "@r2wc/react-to-web-component": "^2.0.3",
-    "@react-three/drei": "^10.7.6",
-    "@react-three/fiber": "^9.3.0",
-    "protosthetics-geo": "file:../wasm/protosthetics-geo/pkg",
-    "react": "^19.2.0",
-    "react-dom": "^19.2.0",
-    "three": "^0.180.0",
-    "three-mesh-bvh": "^0.9.1",
-    "zustand": "^5.0.8"
+    "@galileo/girth-manager-ui": "file:../girth-manager-ui"
   },
   "devDependencies": {
-    "@types/react": "^19.2.5",
-    "@types/react-dom": "^19.2.3",
-    "@types/three": "^0.180.0",
-    "@vitejs/plugin-react": "^5.1.1",
-    "typescript": "~5.9.3",
-    "vite": "^7.2.4",
-    "vite-plugin-top-level-await": "^1.6.0",
-    "vite-plugin-wasm": "^3.5.0"
+    "@react-three/drei": "^10.0.3",
+    "@react-three/fiber": "^9.1.2",
+    "@types/react": "^19.0.10",
+    "@types/react-dom": "^19.0.4",
+    "@types/three": "^0.172.0",
+    "@vitejs/plugin-react": "^5.1.4",
+    "react": "^19.0.0",
+    "react-dom": "^19.0.0",
+    "three": "^0.172.0",
+    "three-mesh-bvh": "^0.8.3",
+    "zustand": "^5.0.3",
+    "typescript": "~5.7.0",
+    "vite": "^6.1.0",
+    "vite-plugin-wasm": "^3.4.1",
+    "vite-plugin-top-level-await": "^1.5.0"
   },
-  "publishConfig": {
-    "access": "restricted"
+  "peerDependencies": {
+    "react": ">=18",
+    "react-dom": ">=18"
   }
 }

package/dist/FabOneWidget.d.ts

@@ -1,19 +0,0 @@
-/**
- * FabOneWidget — Self-contained 3D prosthetic measurement widget.
- *
- * Synced with FabOneViewer2.  Accepts `objUrl` and `amputationType` props.
- * Fetches OBJ, processes with WASM, renders 3D canvas with landmark selection
- * and circumference measurement.  Dispatches `measurements` CustomEvent when
- * data changes.
- */
-export interface MeasurementData {
-    yPosition: number;
-    originalValue: number;
-    modifiedValue: number | null;
-}
-export interface FabOneWidgetProps {
-    objUrl?: string;
-    spacingType?: "AK" | "BK";
-}
-declare const FabOneWidget: ({ objUrl, spacingType }: FabOneWidgetProps) => import("react/jsx-runtime").JSX.Element;
-export default FabOneWidget;