@es-joy/jsoe 0.24.2 → 0.25.0

package/src/fundamentalTypes/functionType.js

@@ -1,6 +1,8 @@
 import {$e, $$e} from '../utils/templateUtils.js';
+import {schemaLabel} from '../utils/schemaMeta.js';
 import {jml, parseAcorn} from '../vendor-imports.js';
 import {copyObject} from '../utils/objects.js';
+import {tick} from '../utils/timing.js';
 
 const observerMap = new WeakMap();
 
@@ -18,16 +20,15 @@ const idRegex =
  */
 const setTooltips = ({root, specificSchemaObject, textareas, textareaBody}) => {
   // Todo: For these `JSON.stringify` calls, might instead use
-  //    zodex->(zod)->zod-to-json-schema instead
+  //    zodexy->(zod)->zod-to-json-schema instead
   textareaBody.title = `Return type:\n\n${JSON.stringify(
-    /** @type {import('zodex').SzFunction<any, any>} */
-    (specificSchemaObject).returns,
+    /** @type {import('zodexy').SzFunction<any, any>} */
+    (specificSchemaObject).output,
     null,
     2
   )}`;
-  // eslint-disable-next-line prefer-destructuring -- TS
-  const args = /** @type {import('zodex').SzFunction<any, any>} */
-    (specificSchemaObject).args;
+  const args = /** @type {import('zodexy').SzFunction<any, any>} */
+    (specificSchemaObject).input;
   textareas.forEach((textarea, idx) => {
     textarea.title = JSON.stringify(
       args.items[idx] ?? args.rest,
@@ -68,13 +69,15 @@ const setTooltips = ({root, specificSchemaObject, textareas, textareaBody}) => {
 
   const observer = new MutationObserver((mutationList) => {
     for (const mutation of mutationList) {
-      if (mutation.type === 'childList') {
-        for (const node of mutation.removedNodes) {
-          addTitles(node);
-        }
-        for (const node of mutation.addedNodes) {
-          addTitles(node);
-        }
+      if (mutation.type !== 'childList') {
+        continue;
+      }
+
+      for (const node of mutation.removedNodes) {
+        addTitles(node);
+      }
+      for (const node of mutation.addedNodes) {
+        addTitles(node);
       }
     }
   });
@@ -93,11 +96,11 @@ const setTooltips = ({root, specificSchemaObject, textareas, textareaBody}) => {
  */
 const getArgsAndBodyOfFunction = (func) => {
   const funcStr = String(func);
-  const funcStrFull = String(`(${
+  const funcStrFull = `(${
     funcStr.trimStart().startsWith('function')
       ? funcStr
       : `function ${funcStr}`
-  })`);
+  })`;
   const body = funcStrFull.slice(
     funcStrFull.indexOf('{') + 1, funcStrFull.lastIndexOf('}')
   ).trim();
@@ -128,8 +131,11 @@ const getArgsAndBodyOfFunction = (func) => {
 const setValueAndTooltips = ({root, value, specificSchemaObject}) => {
   const {args, body} = getArgsAndBodyOfFunction(value);
 
-  // Wait for textareas to be available
-  setTimeout(() => {
+  // Wait for textareas to be available; return a promise that settles once the
+  //   argument textareas have been added and populated, so callers can await a
+  //   fully-built function editor.
+  return (async () => {
+    await tick();
     let textareas = /** @type {HTMLTextAreaElement[]} */ (
       $$e(root, 'textarea[name$="-string"]')
     );
@@ -137,27 +143,33 @@ const setValueAndTooltips = ({root, value, specificSchemaObject}) => {
     const textareaBody = /** @type {HTMLTextAreaElement} */ (textareas.pop());
 
     args.forEach((_arg, idx) => {
-      if (!textareas[idx]) {
+      if (!Object.hasOwn(textareas, idx)) {
         $e(root, '.addArrayElement')?.click();
       }
     });
 
-    setTimeout(() => {
-      textareas = /** @type {HTMLTextAreaElement[]} */ (
-        $$e(root, 'textarea[name$="-string"]').slice(0, -1)
-      );
+    await tick();
+    textareas = /** @type {HTMLTextAreaElement[]} */ (
+      $$e(root, 'textarea[name$="-string"]').slice(0, -1)
+    );
 
-      if (value) {
-        args.forEach((arg, idx) => {
+    if (value) {
+      args.forEach((arg, idx) => {
+        // A slow environment may not have added every arg textarea within the
+        //   tick; skip rather than throw (the guard in `getValue` covers a
+        //   read that arrives before this settles).
+        if (Object.hasOwn(textareas, idx)) {
           textareas[idx].value = arg;
-        });
+        }
+      });
+      if (textareaBody) {
         textareaBody.value = body;
       }
-      if (specificSchemaObject) {
-        setTooltips({root, specificSchemaObject, textareas, textareaBody});
-      }
-    });
-  });
+    }
+    if (specificSchemaObject) {
+      setTooltips({root, specificSchemaObject, textareas, textareaBody});
+    }
+  })();
 };
 
 /**
@@ -191,13 +203,20 @@ const functionType = {
     return /** @type {HTMLTextAreaElement} */ ($e(root, 'textarea'));
   },
   setValue ({root, value}) {
-    setValueAndTooltips({root, value});
+    return setValueAndTooltips({root, value});
   },
   getValue ({root}) {
     const textareas = /** @type {HTMLTextAreaElement[]} */ (
       $$e(root, 'textarea')
     );
     const textareaBody = /** @type {HTMLTextAreaElement} */ (textareas.pop());
+    /* istanbul ignore if -- Async guard */
+    if (!textareaBody) {
+      // `editUI` builds its textareas asynchronously, so if `getValue` is
+      //   reached first (e.g. a synchronous `validate` while a value is
+      //   being auto-populated), the value is not ready yet.
+      throw new Error('Not yet instantiated');
+    }
     // eslint-disable-next-line no-new-func -- Needed
     return new Function(
       ...textareas.map(({value}) => value.trim()),
@@ -208,7 +227,7 @@ const functionType = {
     const {args, body} = getArgsAndBodyOfFunction(value);
     return ['span', {
       dataset: {type: 'function'},
-      title: specificSchemaObject?.description ?? '(a function)'
+      title: schemaLabel(specificSchemaObject) ?? '(a function)'
     }, [
       ['b', ['Args']],
       ' ',
@@ -228,9 +247,9 @@ const functionType = {
     const specificSchemaObj = specificSchemaObject
       ? copyObject(specificSchemaObject)
       : undefined;
-    const argsTuple = /** @type {import('zodex').SzFunction<any, any>} */ (
+    const argsTuple = /** @type {import('zodexy').SzFunction<any, any>} */ (
       specificSchemaObj
-    )?.args ?? {type: 'tuple', items: [], rest: {type: 'any'}};
+    )?.input ?? {type: 'tuple', items: [], rest: {type: 'any'}};
     argsTuple.description = '';
     // This `description` not in use, but could support
     if (argsTuple.rest) {
@@ -238,7 +257,7 @@ const functionType = {
     }
 
     const size = argsTuple.items.length;
-    const args = /** @type {import('zodex').SzType} */ (
+    const args = /** @type {import('zodexy').SzType} */ (
       {
         type: 'set',
         minSize: size,
@@ -259,7 +278,6 @@ const functionType = {
         buildTypeChoices
       )({
         // resultType,
-        // eslint-disable-next-line object-shorthand -- TS
         topRoot: /** @type {HTMLDivElement} */ (topRoot),
         format: 'schema', // We're always supplying a schema
         // schemaOriginal: schemaContent,
@@ -275,7 +293,6 @@ const functionType = {
         buildTypeChoices
       )({
         // resultType,
-        // eslint-disable-next-line object-shorthand -- TS
         topRoot: /** @type {HTMLDivElement} */ (topRoot),
         format: 'schema', // We're always supplying a schema
         // schemaOriginal: schemaContent,
@@ -288,12 +305,15 @@ const functionType = {
 
     if (value) {
       setTimeout(() => {
+        // Fire-and-forget population; swallow rejections from a still-settling
+        //   editor so they cannot surface as an unhandled rejection.
         setValueAndTooltips({
           root: div,
           value,
           specificSchemaObject
-        });
-      });
+        // eslint-disable-next-line promise/prefer-await-to-then -- Convenient
+        }).catch(() => { /* best-effort */ });
+      }, 0);
     } else if (specificSchemaObject) {
       setTimeout(() => {
         setTimeout(() => {
@@ -307,8 +327,8 @@ const functionType = {
           setTooltips({
             root: div, specificSchemaObject, textareas, textareaBody
           });
-        });
-      });
+        }, 0);
+      }, 0);
     }
 
     return [div];

package/src/fundamentalTypes/nanType.js

@@ -1,4 +1,5 @@
 import {$e} from '../utils/templateUtils.js';
+import {schemaLabel} from '../utils/schemaMeta.js';
 
 /**
  * @type {import('../types.js').TypeObject}
@@ -9,8 +10,8 @@ const nanType = {
   valueMatch (x) {
     return Number.isNaN(x);
   },
-  toValue: () => ({value: Number.NaN}),
-  getValue: () => Number.NaN,
+  toValue: () => ({value: NaN}),
+  getValue: () => NaN,
   /* istanbul ignore next -- No dupe keys, array refs, or validation */
   getInput ({root}) {
     return /** @type {HTMLInputElement} */ ($e(root, 'input'));
@@ -18,13 +19,13 @@ const nanType = {
   viewUI ({specificSchemaObject}) {
     return ['i', {
       dataset: {type: 'nan'},
-      title: specificSchemaObject?.description ?? '(a `NaN`)'
+      title: schemaLabel(specificSchemaObject) ?? '(a `NaN`)'
     }, ['NaN']];
   },
   editUI ({typeNamespace, specificSchemaObject}) {
     return ['div', {
       dataset: {type: 'nan'},
-      title: specificSchemaObject?.description ?? 'NaN'
+      title: schemaLabel(specificSchemaObject) ?? 'NaN'
     }, [
       ['label', [
         'NaN',

package/src/fundamentalTypes/noneditableType.js

@@ -1,5 +1,6 @@
 import {toStringTag} from '../vendor-imports.js';
 import {$e} from '../utils/templateUtils.js';
+import {schemaLabel} from '../utils/schemaMeta.js';
 
 /**
  * @type {import('../types.js').TypeObject}
@@ -44,11 +45,11 @@ const noneditableType = {
     return ['div', {dataset: {type: 'resurrectable'}}, [
       ['b', {
         class: 'emphasis',
-        title: specificSchemaObject?.description
+        title: schemaLabel(specificSchemaObject)
           ? `(a non-editable ${stringTag})`
           : undefined
       }, [
-        specificSchemaObject?.description ?? 'Non-editable'
+        schemaLabel(specificSchemaObject) ?? 'Non-editable'
       ]],
       ['span', {
         title: 'There is no current support for editing this element\'s ' +
@@ -61,7 +62,7 @@ const noneditableType = {
   editUI ({typeNamespace, specificSchemaObject, value}) {
     return ['div', {
       dataset: {type: 'resurrectable'},
-      title: specificSchemaObject?.description ?? 'Non-editable'
+      title: schemaLabel(specificSchemaObject) ?? 'Non-editable'
     }, [
       ['a', {
         // eslint-disable-next-line no-script-url -- Safe

package/src/fundamentalTypes/nullType.js

@@ -1,4 +1,5 @@
 import {$e} from '../utils/templateUtils.js';
+import {schemaLabel} from '../utils/schemaMeta.js';
 
 /**
  * @type {import('../types.js').TypeObject}
@@ -18,13 +19,13 @@ const nullType = {
   viewUI ({specificSchemaObject}) {
     return ['i', {
       dataset: {type: 'null'},
-      title: specificSchemaObject?.description ?? '(a `null`)'
+      title: schemaLabel(specificSchemaObject) ?? '(a `null`)'
     }, ['null']];
   },
   editUI ({typeNamespace, specificSchemaObject}) {
     return ['div', {
       dataset: {type: 'null'},
-      title: specificSchemaObject?.description ?? 'Null'
+      title: schemaLabel(specificSchemaObject) ?? 'Null'
     }, [
       ['label', [
         'Null',

package/src/fundamentalTypes/numberType.js

@@ -1,4 +1,5 @@
 import {$e} from '../utils/templateUtils.js';
+import {schemaLabel} from '../utils/schemaMeta.js';
 
 /**
  * @type {import('../types.js').TypeObject}
@@ -21,14 +22,16 @@ const numberType = {
     return typeof x === 'number' &&
       // Avoid special numbers:
       !Number.isNaN(x) &&
-      x !== Number.POSITIVE_INFINITY && x !== Number.NEGATIVE_INFINITY &&
+      x !== Infinity && x !== -Infinity &&
       !Object.is(x, -0);
   },
   toValue (s) {
     return {value: Number(s)};
   },
   getInput ({root}) {
-    return /** @type {HTMLInputElement} */ ($e(root, 'input'));
+    return /** @type {HTMLInputElement|HTMLSelectElement} */ (
+      $e(root, 'input,select')
+    );
   },
   setValue ({root, value}) {
     this.getInput({root}).value = String(value);
@@ -41,7 +44,11 @@ const numberType = {
     };
   },
   getValue ({root}) {
-    return Number.parseFloat(this.getInput({root}).value);
+    const {value} = this.getInput({root});
+    // Preserve the pre-existing `parseFloat` semantics: an empty field reads
+    //   as `NaN` (which `validate` also rejects), not `0` as `Number('')` and
+    //   `Math.trunc(Number(''))` would give.
+    return value.trim() === '' ? NaN : Number(value);
   },
   /* schema
   viewSchemaUI () {
@@ -51,14 +58,32 @@ const numberType = {
   viewUI ({value, specificSchemaObject}) {
     return ['i', {
       dataset: {type: 'number'},
-      title: specificSchemaObject?.description ?? '(a number)'
+      title: schemaLabel(specificSchemaObject) ?? '(a number)'
     }, [
       String(value)
     ]];
   },
   editUI ({typeNamespace, specificSchemaObject, value}) {
-    const isLiteral = specificSchemaObject?.type === 'literal';
-    const numberSchemaObject = /** @type {import('zodex').SzNumber} */ (
+    const isConstrained = specificSchemaObject?.type === 'literal' ||
+      specificSchemaObject?.type === 'enum';
+    if (isConstrained) {
+      const selectedValue = value ?? specificSchemaObject.defaultValue;
+      return ['div', {
+        dataset: {type: 'number'},
+        title: schemaLabel(specificSchemaObject) ?? 'Number'
+      }, [
+        ['select', {
+          name: `${typeNamespace}-number`
+        }, Object.values(specificSchemaObject.values).filter((val) => {
+          return typeof val === 'number';
+        }).map((val) => {
+          return ['option', {
+            selected: val === selectedValue
+          }, [String(val)]];
+        })]
+      ]];
+    }
+    const numberSchemaObject = /** @type {import('zodexy').SzNumber} */ (
       specificSchemaObject
     );
     // Seems to need a multiplier of around these sizes to have a noticeable
@@ -66,31 +91,58 @@ const numberType = {
     const epsilon = 150 * Number.EPSILON;
     const maxEpsilon = 300 * Number.EPSILON;
 
+    const isInteger = () => {
+      return numberSchemaObject && 'format' in numberSchemaObject && numberSchemaObject.format && [
+        'int32', 'uint32', 'safeint'
+      ].includes(numberSchemaObject.format);
+    };
+
+    const min = numberSchemaObject?.min ??
+      (numberSchemaObject && 'format' in numberSchemaObject && numberSchemaObject.format
+        ? {
+          int32: -2147483648,
+          uint32: 0,
+          safeint: Number.MIN_SAFE_INTEGER,
+          float32: 1.1754943508222875e-38,
+          float64: Number.MIN_VALUE
+        }[numberSchemaObject.format]
+        : undefined);
+
+    const max = numberSchemaObject?.max ??
+      (numberSchemaObject && 'format' in numberSchemaObject && numberSchemaObject.format
+        ? {
+          int32: 2147483647,
+          uint32: 4294967295,
+          safeint: Number.MAX_SAFE_INTEGER,
+          float32: 3.4028234663852886e+38,
+          float64: Number.MAX_VALUE
+        }[numberSchemaObject.format]
+        : undefined);
+
     return ['div', {
       dataset: {type: 'number'},
-      title: specificSchemaObject?.description ?? 'Number'
+      title: schemaLabel(specificSchemaObject) ?? 'Number'
     }, [
       ['input', {
-        disabled: isLiteral,
         name: `${typeNamespace}-number`,
+        // Numeric type can't impose `pattern`
         type: 'number',
-        min: numberSchemaObject?.min
+        min: min
           ? numberSchemaObject?.minInclusive
-            ? numberSchemaObject?.min
-            : numberSchemaObject?.min +
-              (numberSchemaObject?.int ? 1 : epsilon)
+            ? min
+            : min + (
+              (isInteger() ? 1 : epsilon)
+            )
           : undefined,
-        max: numberSchemaObject?.max
+        max: max
           ? numberSchemaObject?.maxInclusive
-            ? numberSchemaObject?.max
-            : numberSchemaObject?.max -
-              (numberSchemaObject?.int ? 1 : maxEpsilon)
+            ? max
+            : max -
+              (isInteger() ? 1 : maxEpsilon)
           : undefined,
         step: numberSchemaObject?.multipleOf ??
-          (numberSchemaObject?.int ? '1' : 'any'),
-        value: isLiteral
-          ? specificSchemaObject?.value
-          : (value ?? specificSchemaObject?.defaultValue ?? '')
+          (isInteger() ? '1' : 'any'),
+        value: (value ?? specificSchemaObject?.defaultValue ?? '')
       }]
     ]];
   }

package/src/fundamentalTypes/promiseType.js

@@ -1,29 +1,19 @@
 import {
   jml, toStringTag,
-  Typeson, structuredCloningThrowing,
+  Typeson,
   resurrectable as noneditable, symbol, promise
 } from '../vendor-imports.js';
 import {$e} from '../utils/templateUtils.js';
+import {schemaLabel} from '../utils/schemaMeta.js';
+import {tick} from '../utils/timing.js';
 import arrayType from './arrayType.js';
+import {structuredCloningJsoe, functionSpec} from '../formats/structuredCloning.js';
 
 /**
  *
  */
 const getTypeson = () => {
-  const structuredCloningFixed = structuredCloningThrowing.filter(
-    (typeSpecSet) => {
-      return ![
-        // Not yet supported within JSOE
-        'imagedata',
-        'imagebitmap',
-        'cryptokey',
-        'domquad'
-      ].some((prop) => {
-        return Object.hasOwn(typeSpecSet, prop);
-      });
-    }
-  );
-  structuredCloningFixed.splice(
+  structuredCloningJsoe.splice(
     // Add after userObjects
     1,
     0,
@@ -31,23 +21,10 @@ const getTypeson = () => {
   );
   return new Typeson().register(
     [
-      ...structuredCloningFixed,
+      ...structuredCloningJsoe,
       symbol,
       promise,
-      {
-        function: {
-          test (x) {
-            return typeof x === 'function';
-          },
-          replace (funcType) {
-            return '(' + funcType.toString() + ')';
-          },
-          revive (o) {
-            // eslint-disable-next-line no-eval -- User opted in
-            return eval(o);
-          }
-        }
-      }
+      functionSpec
     ]
   );
 };
@@ -79,14 +56,15 @@ const promiseType = {
     const childRoot = /** @type {HTMLDivElement} */ (
       $e(root, 'div[data-type]')
     );
-    // eslint-disable-next-line @stylistic/max-len -- Long
     return /** @type {HTMLInputElement|HTMLTextAreaElement|HTMLSelectElement|HTMLButtonElement} */ (
       this.types?.getFormControlForRoot(childRoot)
     );
   },
   setValue ({root, value}) {
-    // Need to wait a tick
-    setTimeout(async () => {
+    // Need to wait a tick; return a promise that settles once the resolved
+    //   value's child editor is built and populated.
+    return (async () => {
+      await tick();
       const val = await value;
       const typeson = getTypeson();
       const type = /** @type {import('../types.js').AvailableArbitraryType} */ (
@@ -101,7 +79,7 @@ const promiseType = {
         $e(root, 'div[data-type]')
       );
 
-      this.types?.setValue({
+      await this.types?.setValue({
         type,
         root: childRoot,
         value: val
@@ -110,7 +88,7 @@ const promiseType = {
       // Avoid invalid number, etc.
       input?.dispatchEvent(new Event('input'));
       input?.blur();
-    });
+    })();
   },
   getValue ({root}) {
     const childRoot = /** @type {HTMLDivElement} */ (
@@ -142,7 +120,7 @@ const promiseType = {
 
     return ['span', {
       dataset: {type: 'promise'},
-      title: specificSchemaObject?.description
+      title: schemaLabel(specificSchemaObject)
     }, [
       'A Promise ',
       span,
@@ -157,19 +135,17 @@ const promiseType = {
 
     const div = jml('div', {
       dataset: {type: 'promise'},
-      title: specificSchemaObject?.description ?? '(a Promise)'
+      title: schemaLabel(specificSchemaObject) ?? '(a Promise)'
     }, [
       'Promise ',
       ...(/** @type {import('../typeChoices.js').BuildTypeChoices} */ (
         buildTypeChoices
       )({
         // resultType,
-        // eslint-disable-next-line object-shorthand -- TS
         topRoot: /** @type {HTMLDivElement} */ (topRoot),
-        // eslint-disable-next-line object-shorthand -- TS
         format: /** @type {import('../formats.js').AvailableFormat} */ (format),
         schemaOriginal: schemaContent,
-        schemaContent: /** @type {import('zodex').SzPromise} */ (
+        schemaContent: /** @type {import('zodexy').SzPromise} */ (
           specificSchemaObject
         )?.value ?? {type: 'any'},
         state: type,

package/src/fundamentalTypes/regexpType.js

@@ -1,5 +1,6 @@
 import {jml, toStringTag} from '../vendor-imports.js';
 import {$e} from '../utils/templateUtils.js';
+import {schemaLabel} from '../utils/schemaMeta.js';
 
 /**
  * @type {import('../types.js').TypeObject & {allowedFlags: string[]}}
@@ -23,9 +24,10 @@ const regexpType = {
       throw new TypeError('Guard for TS');
     }
     const [, str, flags] = /** @type {RegExpMatchArray} */ (s.match(
-      /** @type {Required<import('../types.js').TypeObject>} */ (
+      /** @type {import('../types.js').StringMatcher} */
+      (/** @type {Required<import('../types.js').TypeObject>} */ (
         this
-      ).stringRegex()
+      ).stringRegex)()
     ));
     return {value: new RegExp(str, flags)};
   },
@@ -67,7 +69,7 @@ const regexpType = {
   viewUI ({value, specificSchemaObject}) {
     return ['i', {
       dataset: {type: 'regexp'},
-      title: specificSchemaObject?.description ?? '(a `RegExp`)'
+      title: schemaLabel(specificSchemaObject) ?? '(a `RegExp`)'
     }, [
       String(value)
     ]];
@@ -86,15 +88,7 @@ const regexpType = {
 
         /** @type {$Set} */
         $set (valArr) { // A useful reusable method for multiple selects
-          [...(
-            /**
-             * @type {HTMLSelectElement & {
-             *   $set: $Set
-             * }}
-             */ (
-              this
-            )
-          ).options].forEach((opt) => {
+          [...this.options].forEach((opt) => {
             opt.selected = valArr.includes(opt.value);
           });
         }
@@ -106,7 +100,7 @@ const regexpType = {
     }));
     const root = jml('div', {
       dataset: {type: 'regexp'},
-      title: specificSchemaObject?.description ?? 'RegExp'
+      title: schemaLabel(specificSchemaObject) ?? 'RegExp'
     }, [
       ['label', [
         'Source ',