@druid-ui/component 2.0.0 → 2.1.0

package/dist/index.js

@@ -7,7 +7,10 @@ var callbackMap = {};
 function emit(nodeid, event, e) {
   log(`Emit called for nodeid: ${nodeid}, event: ${event}`);
   const callbacks = callbackMap[nodeid];
-  callbacks?.[event]?.(e);
+  const result = callbacks?.[event]?.(e);
+  if (result instanceof Promise) {
+    result.then(() => rerender());
+  }
 }
 var registerHooks = (id, fnresult) => {
   switch (true) {

package/dist/jsx-runtime.js

@@ -0,0 +1,18 @@
+// src/jsx-runtime.ts
+import { d } from "./index";
+function jsx(type, props) {
+  const { children, ...rest } = props || {};
+  if (children !== void 0) {
+    return d(type, rest, children);
+  }
+  return d(type, rest);
+}
+var jsxs = jsx;
+var jsxDEV = jsx;
+var Fragment = Symbol.for("react.fragment");
+export {
+  Fragment,
+  jsx,
+  jsxDEV,
+  jsxs
+};

package/dist/types/index.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../src/index.ts"],"names":[],"mappings":"AAGA,OAAO,EAAE,KAAK,EAAE,KAAK,OAAO,EAAE,MAAM,gBAAgB,CAAC;AACrD,OAAO,EAAE,GAAG,EAAE,MAAM,aAAa,CAAC;AAElC,eAAO,MAAM,CAAC;gBAEy3B,CAAC;QAAsB,CAAC;WAA8B,CAAC,yBAA+B,CAAC;gBAAwB,CAAC;QAAsB,CAAC;;gBAAxB,CAAC;;CAFp9B,CAAC;AACpC,OAAO,EAAE,eAAe,EAAE,iBAAiB,EAAE,MAAM,SAAS,CAAC"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../src/index.ts"],"names":[],"mappings":"AAGA,OAAO,EAAE,KAAK,EAAE,KAAK,OAAO,EAAE,MAAM,gBAAgB,CAAC;AACrD,OAAO,EAAE,GAAG,EAAE,MAAM,aAAa,CAAC;AAElC,eAAO,MAAM,CAAC;gBAEmwB,CAAC;QAAsB,CAAC;WAA8B,CAAC,yBAA+B,CAAC;gBAAwB,CAAC;QAAsB,CAAC;;gBAAxB,CAAC;;CAF91B,CAAC;AACpC,OAAO,EAAE,eAAe,EAAE,iBAAiB,EAAE,MAAM,SAAS,CAAC"}

package/dist/types/interfaces/druid-ui-utils.d.ts

@@ -1,7 +1,5 @@
 declare module 'druid:ui/utils' {
-  export interface Context {
-    path: string,
-  }
+  export type Context = Array<[string, string]>;
   
   export class Event implements Disposable {
     constructor(value: string, checked: boolean)

package/dist/types/jsx-runtime.d.ts

@@ -0,0 +1,8 @@
+export declare function jsx(type: any, props: any): string | void | {
+    view: (props?: any) => string;
+    init?: () => void;
+};
+export declare const jsxs: typeof jsx;
+export declare const jsxDEV: typeof jsx;
+export declare const Fragment: unique symbol;
+//# sourceMappingURL=jsx-runtime.d.ts.map

package/dist/types/jsx-runtime.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"jsx-runtime.d.ts","sourceRoot":"","sources":["../../src/jsx-runtime.ts"],"names":[],"mappings":"AAGA,wBAAgB,GAAG,CAAC,IAAI,EAAE,GAAG,EAAE,KAAK,EAAE,GAAG;gBAgB+kB,CAAC;;EAVxnB;AAGD,eAAO,MAAM,IAAI,YAAM,CAAC;AAGxB,eAAO,MAAM,MAAM,YAAM,CAAC;AAG1B,eAAO,MAAM,QAAQ,eAA+B,CAAC"}

package/dist/types/utils.d.ts

@@ -1,7 +1,6 @@
 import { d } from "druid:ui/ui";
 import type { Event } from "@druid-ui/host";
 import type { Context } from "druid:ui/component";
-export declare function fnv1aHash(str: string): string;
 export declare const callbackMap: Record<string, Record<string, Function>>;
 export declare function emit(nodeid: string, event: string, e: Event): void;
 export declare const createDFunc: (dfunc: typeof d) => (tag: string | {

package/dist/types/utils.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"utils.d.ts","sourceRoot":"","sources":["../../src/utils.ts"],"names":[],"mappings":"AACA,OAAO,EAAiB,CAAC,EAAW,MAAM,aAAa,CAAC;AACxD,OAAO,KAAK,EAAE,KAAK,EAAE,MAAM,gBAAgB,CAAC;AAC5C,OAAO,KAAK,EAAE,OAAO,EAAE,MAAM,oBAAoB,CAAC;AAElD,wBAAgB,SAAS,CAAC,GAAG,EAAE,MAAM,UAQpC;AAED,eAAO,MAAM,WAAW,EAAE,MAAM,CAAC,MAAM,EAAE,MAAM,CAAC,MAAM,EAAE,QAAQ,CAAC,CAAM,CAAC;AAExE,wBAAgB,IAAI,CAAC,MAAM,EAAE,MAAM,EAAE,KAAK,EAAE,MAAM,EAAE,CAAC,EAAE,KAAK,QAI3D;AAoBD,eAAO,MAAM,WAAW,GAAI,OAAO,OAAO,CAAC,MAEvC,KACI,MAAM,GACN;IAAE,IAAI,EAAE,CAAC,KAAK,CAAC,EAAE,GAAG,KAAK,MAAM,CAAC;IAAC,IAAI,CAAC,EAAE,MAAM,IAAI,CAAA;CAAE,GACpD,CAAC,CAAC,KAAK,CAAC,EAAE,GAAG,KAAK,IAAI,CAAC,GACvB,CAAC,CAAC,KAAK,CAAC,EAAE,GAAG,KAAK;IAAE,IAAI,EAAE,CAAC,KAAK,CAAC,EAAE,GAAG,KAAK,MAAM,CAAC;IAAC,IAAI,CAAC,EAAE,MAAM,IAAI,CAAA;CAAE,CAAC,EAC3E,QAAQ,MAAM,CAAC,MAAM,EAAE,GAAG,CAAC,EAC3B,GAAG,UAAU,MAAM,EAAE,GAAG,KAAK,CAAC,MAAM,EAAE,CAAC;UAFT,CAAC,KAAK,CAAC,EAAE,GAAG,KAAK,MAAM;WAAS,MAAM,IAAI;CAyD3E,CAAC;AAQF,eAAO,MAAM,aAAa,GACxB,IAAI,MAAM,EACV,QAAQ;IAAE,GAAG,EAAE,IAAI,GAAG,KAAK,CAAC;IAAC,GAAG,EAAE,GAAG,CAAA;CAAE,SAaxC,CAAC;AAEF,eAAO,MAAM,iBAAiB,GAC3B,CAAC,EAAE,IAAI,CAAC,GAAG,IAAI,EAAE,GAAG,EAAE,KAAK,GAAG,MAC9B,GAAG,MAAM,GAAG,EAAE,eAKd,CAAC;AAEJ,eAAO,MAAM,eAAe,GAAI,GAAG,CAAC,GAAG,EAAE,OAAO,KAAK,MAAM,GAAG,GAAG,CAAC,OAAO;gBAC3D,OAAO;;wBA1Bf,MAAM,UACF;QAAE,GAAG,EAAE,IAAI,GAAG,KAAK,CAAC;QAAC,GAAG,EAAE,GAAG,CAAA;KAAE;CA4BvC,CAAC"}
+{"version":3,"file":"utils.d.ts","sourceRoot":"","sources":["../../src/utils.ts"],"names":[],"mappings":"AACA,OAAO,EAAiB,CAAC,EAAW,MAAM,aAAa,CAAC;AACxD,OAAO,KAAK,EAAE,KAAK,EAAE,MAAM,gBAAgB,CAAC;AAC5C,OAAO,KAAK,EAAE,OAAO,EAAE,MAAM,oBAAoB,CAAC;AAElD,eAAO,MAAM,WAAW,EAAE,MAAM,CAAC,MAAM,EAAE,MAAM,CAAC,MAAM,EAAE,QAAQ,CAAC,CAAM,CAAC;AAExE,wBAAgB,IAAI,CAAC,MAAM,EAAE,MAAM,EAAE,KAAK,EAAE,MAAM,EAAE,CAAC,EAAE,KAAK,QAQ3D;AAoBD,eAAO,MAAM,WAAW,GAAI,OAAO,OAAO,CAAC,MAEvC,KACI,MAAM,GACN;IAAE,IAAI,EAAE,CAAC,KAAK,CAAC,EAAE,GAAG,KAAK,MAAM,CAAC;IAAC,IAAI,CAAC,EAAE,MAAM,IAAI,CAAA;CAAE,GACpD,CAAC,CAAC,KAAK,CAAC,EAAE,GAAG,KAAK,IAAI,CAAC,GACvB,CAAC,CAAC,KAAK,CAAC,EAAE,GAAG,KAAK;IAAE,IAAI,EAAE,CAAC,KAAK,CAAC,EAAE,GAAG,KAAK,MAAM,CAAC;IAAC,IAAI,CAAC,EAAE,MAAM,IAAI,CAAA;CAAE,CAAC,EAC3E,QAAQ,MAAM,CAAC,MAAM,EAAE,GAAG,CAAC,EAC3B,GAAG,UAAU,MAAM,EAAE,GAAG,KAAK,CAAC,MAAM,EAAE,CAAC;UAFT,CAAC,KAAK,CAAC,EAAE,GAAG,KAAK,MAAM;WAAS,MAAM,IAAI;CAyD3E,CAAC;AAQF,eAAO,MAAM,aAAa,GACxB,IAAI,MAAM,EACV,QAAQ;IAAE,GAAG,EAAE,IAAI,GAAG,KAAK,CAAC;IAAC,GAAG,EAAE,GAAG,CAAA;CAAE,SAaxC,CAAC;AAEF,eAAO,MAAM,iBAAiB,GAC3B,CAAC,EAAE,IAAI,CAAC,GAAG,IAAI,EAAE,GAAG,EAAE,KAAK,GAAG,MAC9B,GAAG,MAAM,GAAG,EAAE,eAKd,CAAC;AAEJ,eAAO,MAAM,eAAe,GAAI,GAAG,CAAC,GAAG,EAAE,OAAO,KAAK,MAAM,GAAG,GAAG,CAAC,OAAO;gBAC3D,OAAO;;wBA1Bf,MAAM,UACF;QAAE,GAAG,EAAE,IAAI,GAAG,KAAK,CAAC;QAAC,GAAG,EAAE,GAAG,CAAA;KAAE;CA4BvC,CAAC"}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@druid-ui/component",
-  "version": "2.0.0",
+  "version": "2.1.0",
   "type": "module",
   "main": "./dist/index.js",
   "types": "./dist/types/index.d.ts",
@@ -10,14 +10,14 @@
       "import": "./dist/index.js",
       "default": "./dist/index.js"
     },
-    "./raw": {
-      "types": "./dist/types/raw.d.ts",
-      "import": "./dist/raw.js",
-      "default": "./dist/raw.js"
-    },
     "./jsx": {
       "types": "./src/jsx.d.ts"
     },
+    "./jsx-runtime": {
+      "types": "./dist/types/jsx-runtime.d.ts",
+      "import": "./dist/jsx-runtime.js",
+      "default": "./dist/jsx-runtime.js"
+    },
     "./types": {
       "types": "./dist/types/druid-ui.d.ts"
     }
@@ -27,9 +27,9 @@
     "src"
   ],
   "scripts": {
-    "build": "npm run build:types-ui && npm run build:lib && npm run build:raw && npm run build:types",
+    "build": "npm run build:types-ui && npm run build:lib && npm run build:jsx-runtime && npm run build:types",
     "build:lib": "esbuild src/index.ts --bundle --outfile=dist/index.js --format=esm --external:druid:ui/ui --external:druid:ui/utils --external:druid:ui/component --external:@druid-ui/host",
-    "build:raw": "esbuild src/raw.ts --bundle --outfile=dist/raw.js --format=esm --external:@druid-ui/host --external:druid:ui/ui --external:druid:ui/utils --external:druid:ui/component",
+    "build:jsx-runtime": "esbuild src/jsx-runtime.ts --bundle --outfile=dist/jsx-runtime.js --format=esm --external:druid:ui/ui --external:druid:ui/utils --external:druid:ui/component --external:@druid-ui/host --external:./index",
     "build:types": "tsc --emitDeclarationOnly --outDir dist/types",
     "build:types-ui": "druid-ui-gen-types druid-ui --out-dir=dist/types"
   },

package/src/jsx-runtime.ts

@@ -0,0 +1,19 @@
+import { d } from "./index";
+
+// Adapter for React JSX runtime - extracts children from props
+export function jsx(type: any, props: any) {
+  const { children, ...rest } = props || {};
+  if (children !== undefined) {
+    return d(type, rest, children);
+  }
+  return d(type, rest);
+}
+
+// jsxs is the same as jsx (used for multiple children)
+export const jsxs = jsx;
+
+// jsxDEV is the same for development
+export const jsxDEV = jsx;
+
+// Fragment is just an empty element for druid-ui
+export const Fragment = Symbol.for("react.fragment");

package/src/utils.ts

@@ -3,22 +3,16 @@ import { log, rerender, d, setHook } from "druid:ui/ui";
 import type { Event } from "@druid-ui/host";
 import type { Context } from "druid:ui/component";
 
-export function fnv1aHash(str: string) {
-  let hash = 0x811c9dc5; // FNV offset basis
-  for (let i = 0; i < str.length; i++) {
-    hash ^= str.charCodeAt(i);
-    hash +=
-      (hash << 1) + (hash << 4) + (hash << 7) + (hash << 8) + (hash << 24);
-  }
-  return (hash >>> 0).toString(36);
-}
-
 export const callbackMap: Record<string, Record<string, Function>> = {};
 
 export function emit(nodeid: string, event: string, e: Event) {
   log(`Emit called for nodeid: ${nodeid}, event: ${event}`);
   const callbacks = callbackMap[nodeid];
-  callbacks?.[event]?.(e);
+  const result = callbacks?.[event]?.(e);
+  // if we have have shim3 with async support, we can call rerender external only
+  if (result instanceof Promise) {
+    result.then(() => rerender());
+  }
 }
 
 const registerHooks = (

package/dist/raw.js

@@ -1,106 +0,0 @@
-// src/utils.ts
-import { log, rerender, setHook } from "druid:ui/ui";
-var callbackMap = {};
-function emit(nodeid, event, e) {
-  log(`Emit called for nodeid: ${nodeid}, event: ${event}`);
-  const callbacks = callbackMap[nodeid];
-  callbacks?.[event]?.(e);
-}
-var registerHooks = (id, fnresult) => {
-  switch (true) {
-    case !!fnresult.init:
-      setHook(id, "init");
-      callbackMap[id] = {
-        ...callbackMap[id],
-        init: fnresult.init
-      };
-      break;
-  }
-};
-var createDFunc = (dfunc2) => {
-  return (tag, props, ...children) => {
-    children = children.flat();
-    if (typeof tag !== "string") {
-      if (typeof tag === "function") {
-        const fnresult = tag(props);
-        if (fnresult?.view) {
-          const id3 = fnresult.view(props);
-          registerHooks(id3, fnresult);
-          return id3;
-        } else {
-          return tag(props);
-        }
-      }
-      const id2 = tag.view(props);
-      registerHooks(id2, tag);
-      return id2;
-    }
-    const ps = { prop: [], on: [] };
-    const cbObj = {};
-    if (props) {
-      for (const [key, value] of Object.entries(props)) {
-        if (value instanceof Function) {
-          const eventKey = key.startsWith("on") ? key.slice(2).toLowerCase() : key;
-          cbObj[eventKey] = value;
-          ps.on.push(eventKey);
-        } else {
-          if (typeof value === "boolean") {
-            if (value) {
-              ps.prop.push({ key, value: "true" });
-            }
-            continue;
-          }
-          ps.prop.push({ key, value });
-        }
-      }
-    }
-    const id = dfunc2(
-      tag,
-      ps,
-      children.filter((c) => typeof c !== "boolean").map((c) => c?.toString())
-    );
-    callbackMap[id] = {
-      ...callbackMap[id],
-      ...cbObj
-    };
-    return id;
-  };
-};
-var pendingOperations = /* @__PURE__ */ new Map();
-var asyncCallback = (id, result) => {
-  log(`Async callback received for id: ${id} with result: ${result.tag}`);
-  const pending = pendingOperations.get(id);
-  if (pending) {
-    if (result.tag === "ok") {
-      pending.resolve(result.val);
-    } else {
-      pending.reject(new Error(result.val));
-    }
-    pendingOperations.delete(id);
-    rerender();
-  }
-};
-var rawAsyncToPromise = (fn) => (...args) => {
-  return new Promise((resolve, reject) => {
-    const asyncId = fn(...args);
-    pendingOperations.set(asyncId, { resolve, reject });
-  });
-};
-var createComponent = (j) => ({
-  init: (ctx) => j(ctx),
-  emit,
-  asyncComplete: asyncCallback
-});
-
-// src/raw.ts
-var dfunc = window["druid-ui"]?.d || (() => {
-  throw new Error("druid.d function not defined");
-});
-var d2 = createDFunc(dfunc);
-var log2 = (msg) => console.log("UI LOG:", msg);
-export {
-  createComponent,
-  d2 as d,
-  log2 as log,
-  rawAsyncToPromise
-};

package/dist/types/raw.d.ts

@@ -1,13 +0,0 @@
-export declare const d: (tag: string | {
-    view: (props?: any) => string;
-    init?: () => void;
-} | ((props?: any) => void) | ((props?: any) => {
-    view: (props?: any) => string;
-    init?: () => void;
-}), props?: Record<string, any>, ...children: string[] | Array<string[]>) => string | void | {
-    view: (props?: any) => string;
-    init?: () => void;
-};
-export declare const log: (msg: string) => void;
-export { createComponent, rawAsyncToPromise } from "./utils";
-//# sourceMappingURL=raw.d.ts.map

package/dist/types/raw.d.ts.map

@@ -1 +0,0 @@
-{"version":3,"file":"raw.d.ts","sourceRoot":"","sources":["../../src/raw.ts"],"names":[],"mappings":"AASA,eAAO,MAAM,CAAC;gBAKouB,CAAC;QAAsB,CAAC;WAA8B,CAAC,yBAA+B,CAAC;gBAAwB,CAAC;QAAsB,CAAC;;gBAAxB,CAAC;;CAL/zB,CAAC;AAEpC,eAAO,MAAM,GAAG,GAAI,KAAK,MAAM,SAAgC,CAAC;AAEhE,OAAO,EAAE,eAAe,EAAE,iBAAiB,EAAE,MAAM,SAAS,CAAC"}

package/src/raw.ts

@@ -1,14 +0,0 @@
-//this file fully works in the browser, this hopefully can be remvoved in the future and unified with
-import { createDFunc } from "./utils";
-
-const dfunc =
-  window["druid-ui"]?.d ||
-  (() => {
-    throw new Error("druid.d function not defined");
-  });
-
-export const d = createDFunc(dfunc);
-
-export const log = (msg: string) => console.log("UI LOG:", msg);
-
-export { createComponent, rawAsyncToPromise } from "./utils";

package/src/utils.d.ts

@@ -1,22 +0,0 @@
-import type { Props } from "druid:ui/ui";
-import type { Event } from "../types";
-import type { Context } from "druid:ui/component";
-export declare function fnv1aHash(str: string): string;
-export declare const eventMap: Record<string, Record<string, Function>>;
-export declare function emit(nodeid: string, event: string, e: Event): void;
-export declare const createDFunc: (dfunc: (element: string, props: Props, children: string[]) => string) => (tag: string | {
-    view: (props?: any) => void;
-} | ((props?: any) => void), props?: Record<string, any>, ...children: string[]) => string | void;
-export declare const asyncCallback: (id: string, result: {
-    tag: "ok" | "err";
-    val: any;
-}) => void;
-export declare const rawAsyncToPromise: <T>(fn: (...args: any[]) => any) => (...args: any[]) => Promise<T>;
-export declare const createComponent: (j: (ctx: Context) => string | JSX.Element) => {
-    init: (ctx: Context) => string | JSX.Element;
-    emit: typeof emit;
-    asyncComplete: (id: string, result: {
-        tag: "ok" | "err";
-        val: any;
-    }) => void;
-};