@es-joy/jsoe 0.24.2 → 0.25.0

package/src/types.js

@@ -4,10 +4,11 @@ import {
   // jamilih
   jml,
   // typeson-registry
-  Typeson, getJSONType, structuredCloningThrowing
+  Typeson, getJSONType, structuredCloningForStorage
 } from './vendor-imports.js';
 
 import {$e, $$e} from './utils/templateUtils.js';
+import {resolveSchemaMeta, appendSchemaMeta} from './utils/schemaMeta.js';
 
 import nullType from './fundamentalTypes/nullType.js';
 import trueType from './subTypes/trueType.js';
@@ -22,16 +23,11 @@ import stringType from './fundamentalTypes/stringType.js';
 import arrayReferenceType from './fundamentalTypes/arrayReferenceType.js';
 import objectReferenceType from './fundamentalTypes/objectReferenceType.js';
 import arrayType from './fundamentalTypes/arrayType.js';
-import tupleType from './fundamentalTypes/tupleType.js';
 import objectType from './fundamentalTypes/objectType.js';
-import recordType from './fundamentalTypes/recordType.js';
 import dateType from './fundamentalTypes/dateType.js';
-import enumType from './fundamentalTypes/enumType.js';
 import setType from './fundamentalTypes/setType.js';
 import mapType from './fundamentalTypes/mapType.js';
-import literalType from './fundamentalTypes/literalType.js';
 import undefinedType from './fundamentalTypes/undefinedType.js';
-import voidType from './fundamentalTypes/voidType.js';
 import regexpType from './fundamentalTypes/regexpType.js';
 import BooleanObjectType from './fundamentalTypes/BooleanObjectType.js';
 import NumberObjectType from './fundamentalTypes/NumberObjectType.js';
@@ -51,9 +47,6 @@ import dompointType from './superTypes/dompointType.js';
 import dommatrixType from './superTypes/dommatrixType.js';
 import buffersourceType from './superTypes/buffersourceType.js';
 import noneditableType from './fundamentalTypes/noneditableType.js';
-import neverType from './fundamentalTypes/neverType.js';
-import catchType from './fundamentalTypes/catchType.js';
-import nativeEnumType from './fundamentalTypes/nativeEnumType.js';
 
 import symbolType from './fundamentalTypes/symbolType.js';
 import promiseType from './fundamentalTypes/promiseType.js';
@@ -79,8 +72,9 @@ export const getPropertyValueFromLegend = (legend) => {
       'No property with text present on the supplied legend element'
     );
   }
-  // 1-based to 0-based
-  return String(Number.parseInt(propElem.textContent) - 1);
+  // 1-based to 0-based (truncate first, then decrement, as the previous
+  //   `parseInt` did)
+  return String(Math.trunc(Number(propElem.textContent)) - 1);
 };
 
 /**
@@ -155,28 +149,30 @@ export const getPropertyValueFromLegend = (legend) => {
  */
 
 /**
-* @typedef {{
-*   typeNamespace?: string,
-*   "readonly"?: boolean,
-*   format?: import('./formats.js').AvailableFormat,
-*   formats?: import('./formats.js').default,
-*   types?: Types,
-*   error?: Error,
-*   rootUI?: Element,
-*   schema?: string,
-*   schemaParent?: import('./formats/schema.js').ZodexSchema,
-*   schemaContent?: import('./formats/schema.js').ZodexSchema,
-*   specificSchema?: import('./formats/schema.js').ZodexSchema,
-*   specificSchemas?: import('./formats/schema.js').ZodexSchema[],
-*   paths?: {[currentPath: string]: {
-*     referentPath: string,
-*     expectArrayReferent: boolean
-*   }},
-*   handlingReference?: boolean
-* }} StateObject
-*/
-
-/* eslint-disable jsdoc/valid-types -- readonly reserved */
+ * @typedef {{
+ *   typeNamespace?: string,
+ *   readonly?: boolean,
+ *   format?: import('./formats.js').AvailableFormat,
+ *   formats?: import('./formats.js').default,
+ *   types?: Types,
+ *   error?: Error,
+ *   rootUI?: HTMLElement,
+ *   schema?: string,
+ *   schemaParent?: import('./formats/schema.js').ZodexSchema,
+ *   schemaContent?: import('./formats/schema.js').ZodexSchema,
+ *   specificSchema?: import('./formats/schema.js').ZodexSchema,
+ *   specificSchemas?: import('./formats/schema.js').ZodexSchema[],
+ *   paths?: {[currentPath: string]: {
+ *     referentPath: string,
+ *     expectArrayReferent: boolean
+ *   }},
+ *   handlingReference?: boolean,
+ *   pendingBuilds?: Promise<void>[],
+ *   whenBuilt?: Promise<void>,
+ *   buildWarnings?: {keypath: string, type: string, reason: string}[]
+ * }} StateObject
+ */
+
 /**
  * @typedef {(cfg: {
  *   readonly?: boolean,
@@ -195,7 +191,6 @@ export const getPropertyValueFromLegend = (legend) => {
  *   schemaFallingBack?: boolean
  * }) => HTMLElement} GetUIForModeAndType
  */
-/* eslint-enable jsdoc/valid-types -- readonly reserved */
 
 /**
  * @typedef {(cfg: {
@@ -225,7 +220,7 @@ export const getPropertyValueFromLegend = (legend) => {
  *   type: AvailableArbitraryType,
  *   root: RootElement,
  *   value: StructuredCloneValue,
- * }) => void} SetValue
+ * }) => void|Promise<void>} SetValue
  */
 
 /**
@@ -245,12 +240,12 @@ export const getPropertyValueFromLegend = (legend) => {
  *   schemaObject?: import('./formatAndTypeChoices.js').ZodexSchema|undefined
  *   schemaOriginal?: import('./formatAndTypeChoices.js').ZodexSchema|undefined
  * }) => [
-*   value: StructuredCloneValue,
-*   remnant: string,
-*   beginOnly: boolean,
-*   assign: boolean
-* ]} GetValueForString
-*/
+ *   value: StructuredCloneValue,
+ *   remnant: string,
+ *   beginOnly: boolean,
+ *   assign: boolean
+ * ]} GetValueForString
+ */
 
 /**
  * @typedef {(
@@ -291,7 +286,7 @@ export const getPropertyValueFromLegend = (legend) => {
  *     root: HTMLDivElement,
  *     value: StructuredCloneValue
  *   }
- * ) => void} TypeObjectSetValue
+ * ) => void|Promise<void>} TypeObjectSetValue
  */
 
 /**
@@ -304,6 +299,10 @@ export const getPropertyValueFromLegend = (legend) => {
  * }} ToValue
  */
 
+/**
+ * @typedef {((nonGrouping?: boolean) => RegExp)} StringMatcher
+ */
+
 /**
  * @typedef {object} TypeObject
  * @property {[
@@ -315,10 +314,6 @@ export const getPropertyValueFromLegend = (legend) => {
  *   it is a `Map`. Do not use in other types.
  * @property {boolean} [set] Private context variable. Whether or not
  *   it is a `Set`. Do not use in other types.
- * @property {boolean} [record] Private context variable. Whether or not
- *   it is a `Record`. Do not use in other types.
- * @property {boolean} [tuple] Private context variable. Whether or not
- *   it is a tuple type. Do not use in other types.
  * @property {boolean} [filelist] Private context variable. Whether or not
  *   it is a `FileList` type. Do not use in other types.
  * @property {boolean} [sparse] Private context variable. Whether or not
@@ -326,7 +321,7 @@ export const getPropertyValueFromLegend = (legend) => {
  * @property {boolean} [valid] Private context variable. Whether or not
  *   it is a valid date. Do not use in other types.
  * @property {string[]} [regexEndings] Used for string parsing.
- * @property {RegExp|((nonGrouping?: boolean) => RegExp)} [stringRegex] Used
+ * @property {RegExp|StringMatcher} [stringRegex] Used
  *   for string parsing. If not present, use `stringRegexBegin` and
  *   `stringRegexEnd`.
  * @property {RegExp} [stringRegexBegin] Used for string parsing. If not
@@ -409,17 +404,16 @@ export const getPropertyValueFromLegend = (legend) => {
  */
 
 /**
- * @typedef {"null"|"true"|"false"|"number"|"bigint"|"bigintObject"|
- *   "string"|"arrayReference"|
- *   "objectReference"|"array"|"object"|"date"|"userObject"|"undef"|
- *   "SpecialRealNumber"|"SpecialNumber"|"regexp"|"BooleanObject"|
- *   "NumberObject"|"StringObject"|"map"|"set"|"file"|"filelist"|"blobHTML"|
- *   "buffersource"|"dataview"|"imagedata"|"imagebitmap"|
- *   "int8array"|"uint8array"|"uint8clampedarray"|"int16array"|"uint16array"|
- *   "int32array"|"uint32array"|"float32array"|"float64array"|"ValidDate"|
- *   "arrayNonindexKeys"|"error"|"errors"|"blob"|"domexception"|"domrect"|
- *   "dompoint"|"dommatrix"|"resurrectable"|"boolean"|"nan"|"tuple"|
- *   "record"|"void"|"enum"|"literal"|"never"|"catch"|"nativeEnum"
+ * @typedef {"null"|"true"|"false"|"number"|"bigint"|"bigintObject"
+ *   |"string"|"arrayReference"
+ *   |"objectReference"|"array"|"object"|"date"|"userObject"|"undef"
+ *   |"SpecialRealNumber"|"SpecialNumber"|"regexp"|"BooleanObject"
+ *   |"NumberObject"|"StringObject"|"map"|"set"|"file"|"filelist"|"blobHTML"
+ *   |"buffersource"|"dataview"|"imagedata"|"imagebitmap"
+ *   |"int8array"|"uint8array"|"uint8clampedarray"|"int16array"|"uint16array"
+ *   |"int32array"|"uint32array"|"float32array"|"float64array"|"ValidDate"
+ *   |"arrayNonindexKeys"|"error"|"errors"|"blob"|"domexception"|"domrect"
+ *   |"dompoint"|"dommatrix"|"resurrectable"|"boolean"|"nan"
  * } AvailableType
  */
 
@@ -429,20 +423,31 @@ export const getPropertyValueFromLegend = (legend) => {
 
 /**
  * @typedef {TypeObject & {
-*   childTypes: string[]
-* }} SuperTypeObject
-*/
+ *   childTypes: string[]
+ * }} SuperTypeObject
+ */
 
 /**
  *
  */
 class Types {
   /**
-   *
+   * @param {{
+   *   useZodexyErrorMessages?: boolean,
+   *   useZodexyErrorMessagesInTypes?: boolean
+   * }} [cfg]
    */
-  constructor () {
+  constructor ({
+    useZodexyErrorMessages = false,
+    useZodexyErrorMessagesInTypes = false
+  } = {}) {
     this.formats = new Formats(); // Todo: Make customizable and test
 
+    this.useZodexyErrorMessages = useZodexyErrorMessages;
+    this.useZodexyErrorMessagesInTypes = useZodexyErrorMessagesInTypes;
+    /** @type {WeakMap<RootElement, import('./formats/schema.js').ZodexSchema>} */
+    this.schemasForRoots = new WeakMap();
+
     /** @type {CustomValidateAllReferences|undefined} */
     this.customValidateAllReferences = undefined;
     /**
@@ -463,22 +468,17 @@ class Types {
       arrayReference: arrayReferenceType,
       objectReference: objectReferenceType,
       array: arrayType,
-      tuple: tupleType, // Schema type
       // Note: We don't do for BooleanObject/NumberObject/StringObject, date,
       //   regexp, as added properties on them are not being cloned (in Chrome
       //   at least)
       object: objectType,
-      record: recordType, // Schema type
       date: dateType,
-      enum: enumType,
-
       // This type is only for throwing upon cloning errors:
       // 'checkDataCloneException'
       // This type might be supported by evaluable JS or config
       //   passed in:
       userObject: ['User objects'],
       undef: undefinedType,
-      void: voidType,
       SpecialRealNumber: SpecialRealNumberSuperType,
       SpecialNumber: SpecialNumberSuperType,
 
@@ -490,8 +490,6 @@ class Types {
       NumberObject: NumberObjectType,
       StringObject: StringObjectType,
 
-      literal: literalType,
-
       map: mapType,
       set: setType,
 
@@ -506,15 +504,11 @@ class Types {
       dommatrix: dommatrixType,
 
       resurrectable: noneditableType,
-      never: neverType,
 
       symbol: symbolType, // Non-cloning type
       promise: promiseType,
       function: functionType,
 
-      catch: catchType,
-      nativeEnum: nativeEnumType,
-
       buffersource: buffersourceType,
       dataview: {
         option: ['DataView']
@@ -580,11 +574,9 @@ class Types {
     const copyTypeObjs = (replacements) => {
       replacements.forEach(([copyFrom, copyTo]) => {
         Object.assign(this.availableTypes[
-          /** @type {AvailableType} */
-          (copyTo)
+          copyTo
         ], this.availableTypes[
-          /** @type {AvailableType} */
-          (copyFrom)
+          copyFrom
         ]);
       });
     };
@@ -616,12 +608,12 @@ class Types {
         Object.entries(stateDependent).forEach(([
           format, formatStateDependent
         ]) => {
-          if (!this.contexts[format]) {
+          if (!Object.hasOwn(this.contexts, format)) {
             this.contexts[format] = {};
           }
           const {contexts, after} = formatStateDependent;
           contexts.forEach((context) => {
-            if (!this.contexts[format][context]) {
+            if (!Object.hasOwn(this.contexts[format], context)) {
               this.contexts[format][context] = [];
             }
             this.contexts[format][context].push({type, after});
@@ -722,8 +714,12 @@ class Types {
       ...availableType.option
     ];
 
-    if (schemaContent && schemaContent.description) {
-      optInfo[0] = `${optInfo[0]} (${schemaContent.description})`;
+    // `record`/`tuple` are not shown as their own pull-down entries; they render
+    //   as `Object`/`Array` (their schema, incl. child descriptions, informs the
+    //   layout — see `arrayType.js`).
+    const schemaContentLabel = resolveSchemaMeta(schemaContent).label;
+    if (schemaContentLabel) {
+      optInfo[0] = `${optInfo[0]} (${schemaContentLabel})`;
     }
 
     optInfo[1] = {
@@ -786,6 +782,10 @@ class Types {
         ? typeObj.viewUI(arg)
         : typeObj.editUI(arg))
     ));
+    if (specificSchemaObject) {
+      this.schemasForRoots.set(root, specificSchemaObject);
+    }
+    appendSchemaMeta(root, specificSchemaObject);
     if (!readonly && typeObj.validate) {
       const formControl = typeObj.getInput({root});
       formControl.addEventListener('input', () => {
@@ -817,18 +817,77 @@ class Types {
     }
   }
 
+  /**
+   * @param {{
+   *   message: string|null|undefined,
+   *   schema?: import('./formats/schema.js').ZodexSchema,
+   *   typeSpecific?: boolean
+   * }} cfg
+   * @returns {string|null|undefined}
+   */
+  getValidationMessage ({message, schema, typeSpecific = false}) {
+    if (!message) {
+      return message;
+    }
+    const schemaError = schema?.error;
+    return typeof schemaError === 'string' && this.useZodexyErrorMessages &&
+      (!typeSpecific || this.useZodexyErrorMessagesInTypes)
+      ? schemaError
+      : message;
+  }
+
   /** @type {Validate} */
   validate ({type, root, topRoot, avoidReport}) {
+    if (Types.getTypeForRoot(root) !== type) {
+      return true;
+    }
     const typeObj = /** @type {TypeObject} */ (this.availableTypes[type]);
-    // Todo (low): We limit for now to input boxes which have `validate`
-    if (typeObj.validate) {
-      const {valid, message} = typeObj.validate({root, topRoot});
-      const formControl = typeObj.getInput({root});
+    const typeValidation = typeObj.validate
+      ? typeObj.validate({root, topRoot})
+      : {valid: true, message: undefined};
+    const schemaObject = this.schemasForRoots.get(root);
+    let value;
+    let valueReady = true;
+    try {
+      value = typeObj.getValue?.({
+        root,
+        stateObj: {types: this, formats: this.formats}
+      });
+    } catch (error) {
+      const errorMessage = error && typeof error === 'object' &&
+        'message' in error
+        ? error.message
+        : undefined;
+      if (errorMessage !== 'Not yet instantiated') {
+        return false;
+      }
+      valueReady = false;
+    }
+    const schemaFormat = this.formats.getAvailableFormat('schema');
+    const schemaValidation = valueReady && schemaObject &&
+      (schemaObject.type === 'templateLiteral' ||
+        schemaFormat.isValueValidationRequired?.(schemaObject))
+      ? schemaFormat.validateValue?.(
+        this, schemaObject, value
+      ) ?? {valid: true, message: undefined}
+      : {valid: true, message: undefined};
+    const valid = typeValidation.valid && schemaValidation.valid;
+    const message = typeValidation.valid
+      ? schemaValidation.message
+      : typeValidation.message;
+    const formControl = typeObj.getInput?.({root});
+    if (formControl) {
+      const validationMessage = this.getValidationMessage({
+        message: message || 'Invalid',
+        schema: schemaValidation.valid
+          ? schemaObject
+          : schemaValidation.schema ?? schemaObject
+      });
       formControl.setCustomValidity(
         valid
           ? ''
           /* istanbul ignore next -- Should always have a message */
-          : (message || 'Invalid')
+          : (validationMessage || 'Invalid')
       );
 
       // We don't want a focus as `reportValidity` does in at least
@@ -837,17 +896,22 @@ class Types {
       if (!avoidReport) {
         formControl.reportValidity();
       }
-      return valid;
     }
-    return true;
+    return valid;
   }
 
   /** @type {SetValue} */
   setValue ({type, root, value}) {
+    if (Types.getTypeForRoot(root) !== type) {
+      return undefined;
+    }
     const typeObj = /** @type {TypeObject} */ (this.availableTypes[type]);
     if (typeObj.setValue) {
-      typeObj.setValue({root, value});
+      // May return a promise for types whose UI building is deferred; callers
+      //   that need the built DOM (e.g. a subsequent `validate`) can await it.
+      return typeObj.setValue({root, value});
     }
+    return undefined;
   }
 
   // Todo (low): Should really add real parser
@@ -890,9 +954,6 @@ class Types {
       reduced
     ).map((str) => escapeRegex(str)).join('|');
 
-    /**
-     * @type {RegExpMatchArray|boolean|null}
-     */
     let match = null;
     let found = allowedTypeObjs.find(([/* _type */, typObj]) => {
       const typeObj = /** @type {TypeObject} */ (typObj);
@@ -991,7 +1052,7 @@ class Types {
         //        allow `arbitraryJS` values; should also be using
         //        `structuredCloningFixed`
         const typeson = new Typeson().register(
-          structuredCloningThrowing
+          structuredCloningForStorage
         );
         try {
           const topRoot = typeson.revive(value);
@@ -1003,10 +1064,9 @@ class Types {
             // @ts-expect-error Reference method exists
             const val = typeObject.resolveReference(path, topRoot);
             const basicType = getJSONType(val);
-            // eslint-disable-next-line @stylistic/max-len -- Long
             /* istanbul ignore else -- Successful reference always an object/array? */
             if (
-              ['array', 'object'].includes(type) && basicType === type
+              basicType === type && ['array', 'object'].includes(type)
             ) {
               /** @type {{[key: string]: any}} */ (
                 parent
@@ -1079,7 +1139,7 @@ Types.validValuesSet = ({form, typeNamespace, keySelectClass}) => {
  * @returns {string}
  */
 export function escapeRegex (str) {
-  return String(str).
+  return str.
     replaceAll(/[.\\+*?^[\]$(){}=!<>|:-]/gu, String.raw`\$&`);
 }
 

package/src/utils/FileList.js

@@ -7,10 +7,10 @@
 class FileList {
   /**
    * Set private properties and length.
+   * @param {File[]} files Files to include.
    */
-  constructor () {
-    // eslint-disable-next-line prefer-rest-params -- Keep API
-    this._files = arguments[0];
+  constructor (files) {
+    this._files = files;
     this.length = this._files.length;
   }
   /**

package/src/utils/dialogs.js

@@ -81,9 +81,8 @@ const dialogs = {
           if (cancel) {
             if (
               cancel.call(
-                // eslint-disable-next-line object-shorthand -- Needed for TS
-                this, {e: /** @type {Event} */ (e), dialog}
-              ) === false
+                this, {e, dialog}
+              )
             ) {
               return;
             }
@@ -111,8 +110,7 @@ const dialogs = {
         class: submitClass,
         $on: {
           click (e) {
-            // eslint-disable-next-line object-shorthand -- Needed for TS
-            submit.call(this, {e: /** @type {Event} */ (e), dialog});
+            submit.call(this, {e, dialog});
           }
         }
       }, [submitText ?? this.localeStrings.submit]),
@@ -128,12 +126,12 @@ const dialogs = {
    * @returns {Promise<void>}
    */
   alert (message) {
-    message = typeof message === 'string' ? {message} : message;
+    message = message && typeof message === 'object' ? message : {message};
     const {submitClass = 'submit'} = message;
     const {message: outputMessage} = message;
     return new Promise((resolve /* , _reject */) => {
       const dialog = jml('dialog', [
-        /** @type {string|import('jamilih').JamilihArray} */ (outputMessage),
+        outputMessage,
         ['br'], ['br'],
         ['div', {class: submitClass}, [
           ['button', {$on: {click () {

package/src/utils/jsonPointer.js

@@ -49,7 +49,7 @@ const getJSONPointerParts = (path) => {
  * @returns {ArbitraryObject|string}
  */
 const reduceJSONPointerParts = (obj, pathPart) => {
-  if (!(pathPart in obj)) {
+  if (!(Object.hasOwn(obj, pathPart))) {
     throw new TypeError('Path part not found in object');
   }
   obj = obj[pathPart];

package/src/utils/media.js

@@ -72,6 +72,7 @@ function visualize (stream, canvas) {
  * @returns {Promise<MediaStream|null>}
  */
 async function getUserMedia (constraints) {
+  // eslint-disable-next-line no-useless-assignment -- ESLint bug
   let stream = null;
   try {
     stream = await navigator.mediaDevices.getUserMedia(constraints);