@es-joy/jsoe 0.16.0 → 0.18.0

package/src/fundamentalTypes/literalType.js

@@ -0,0 +1,81 @@
+import {$e} from '../utils/templateUtils.js';
+
+import booleanType from './booleanType.js';
+import numberType from './numberType.js';
+import stringType from './stringType.js';
+
+/**
+ * @type {import('../types.js').TypeObject}
+ */
+const literalType = {
+  option: ['Literal'],
+  stringRegex: /^Literal\((.*)\)$/u,
+  valueMatch (x) {
+    // const schema =
+    //   /** @type {import('zodex').SzLiteral<any>} */ (cfg?.schema);
+    return (typeof x === 'boolean' || typeof x === 'number' ||
+      typeof x === 'string'); // && (!schema || schema.value === x);
+  },
+  toValue (s) {
+    const value = s === 'true'
+      ? true
+      : s === 'false'
+        ? false
+        : s.charAt(0) === '"'
+          ? s.slice(1, -1)
+          : Number(s);
+    return {value};
+  },
+  // Todo: Fix all the following methods up to `setValue` to work with children
+  getInput ({root}) {
+    return /** @type {HTMLTextAreaElement} */ ($e(root, 'input,textarea'));
+  },
+  setValue ({root, value}) {
+    this.getInput({root}).value = value;
+  },
+  getValue ({root, stateObj}) {
+    const innerTypeHolder = $e(root, '[data-type]');
+    const typeObject = stateObj?.types?.getTypeObject?.(
+      /** @type {import('../types.js').AvailableType} */ (
+        innerTypeHolder?.dataset.type
+      )
+    );
+    return /** @type {import('../types.js').TypeObject} */ (
+      typeObject
+    )?.getValue({root, stateObj});
+  },
+  viewUI ({value, specificSchemaObject}) {
+    return ['span', {
+      dataset: {type: 'literal'},
+      title: specificSchemaObject?.description ?? `(a literal ${typeof value})`
+    }, [`${value}`]];
+  },
+  editUI (arg) {
+    const {specificSchemaObject} = arg;
+    const {
+      value: val
+    } = /** @type {import('zodex').SzLiteral<any>} */ (specificSchemaObject);
+
+    let specificLiteralEditUI;
+    switch (typeof val) {
+    case 'boolean':
+      // arg.specificSchemaObject = {type: 'boolean'};
+      specificLiteralEditUI = booleanType.editUI(arg);
+      break;
+    case 'number':
+      // arg.specificSchemaObject = {type: 'number'};
+      specificLiteralEditUI = numberType.editUI(arg);
+      break;
+    case 'string': default:
+      // arg.specificSchemaObject = {type: 'string'};
+      specificLiteralEditUI = stringType.editUI(arg);
+      break;
+    }
+
+    return ['div', {dataset: {type: 'literal'}}, [
+      specificLiteralEditUI
+    ]];
+  }
+};
+
+export default literalType;

package/src/fundamentalTypes/mapType.js

@@ -1,3 +1,4 @@
+import {toStringTag} from '../vendor-imports.js';
 import arrayType from './arrayType.js';
 
 /**
@@ -10,6 +11,9 @@ const mapType = {
   regexEndings: [',', ')'],
   stringRegexBegin: /^Map\(/u,
   stringRegexEnd: /^\)/u,
+  valueMatch (x) {
+    return toStringTag(x) === 'Map';
+  },
   toValue (...args) {
     return /** @type {import('../types.js').ToValue} */ (
       arrayType.toValue

package/src/fundamentalTypes/nanType.js

@@ -0,0 +1,41 @@
+import {$e} from '../utils/templateUtils.js';
+
+/**
+ * @type {import('../types.js').TypeObject}
+ */
+const nanType = {
+  option: ['NaN'],
+  stringRegex: /^NaN$/u,
+  valueMatch (x) {
+    return Number.isNaN(x);
+  },
+  toValue: () => ({value: Number.NaN}),
+  getValue: () => Number.NaN,
+  /* istanbul ignore next -- No dupe keys, array refs, or validation */
+  getInput ({root}) {
+    return /** @type {HTMLInputElement} */ ($e(root, 'input'));
+  },
+  viewUI ({specificSchemaObject}) {
+    return ['i', {
+      dataset: {type: 'nan'},
+      title: specificSchemaObject?.description ?? '(a `NaN`)'
+    }, ['NaN']];
+  },
+  editUI ({typeNamespace, specificSchemaObject}) {
+    return ['div', {
+      dataset: {type: 'nan'},
+      title: specificSchemaObject?.description ?? 'NaN'
+    }, [
+      ['label', [
+        'NaN',
+        ['input', {
+          type: 'checkbox',
+          name: `${typeNamespace}-nan`,
+          checked: true
+        }]
+      ]]
+    ]];
+  }
+};
+
+export default nanType;

package/src/fundamentalTypes/nativeEnumType.js

@@ -0,0 +1,155 @@
+import {$e} from '../utils/templateUtils.js';
+import {escapeRegex} from '../types.js';
+import {jml} from '../vendor-imports.js';
+
+/**
+ * @type {import('../types.js').TypeObject}
+ */
+const nativeEnumType = {
+  option: ['Native enum'],
+  stringRegex: /^nativeEnum\((.*)\)$/u,
+  valueMatch (x) {
+    return ['number', 'string'].includes(typeof x);
+  },
+  toValue (s, rootInfo) {
+    const key = s.charAt(0) === '"' ? s.slice(1, -1) : Number(s);
+
+    let schema = rootInfo?.schemaObject;
+    /* istanbul ignore else -- Most likely is if */
+    if (rootInfo?.schemaObject?.type === 'union') {
+      const schemas = /** @type {import('zodex').SzUnion} */ (
+        rootInfo.schemaObject
+      ).options.filter((option) => {
+        return option.type === 'nativeEnum';
+      });
+      schema = schemas.find((schema) => {
+        return key in schema.values;
+      });
+    }
+    const value = /** @type {import('zodex').SzNativeEnum} */ (schema)?.values[
+      key
+    ];
+    return {value};
+  },
+  getInput ({root}) {
+    return /** @type {HTMLTextAreaElement} */ ($e(root, 'input'));
+  },
+  setValue ({root, value}) {
+    const input = /**
+    * @type {HTMLInputElement & {
+    *   $schemaNativeEnumValues: import('zodex').SzNativeEnum['values']
+    * }}
+    */ (this.getInput({root}));
+    input.value = Object.entries(
+      input.$schemaNativeEnumValues
+    ).find(([, val]) => {
+      return val === value;
+    })?.[0] ?? '';
+    /** @type {HTMLSpanElement} */ (
+      $e(root, '.enumeratedValue')
+    ).textContent = value;
+  },
+  getValue ({root}) {
+    const {value, $schemaNativeEnumValues} =
+      /**
+       * @type {HTMLInputElement & {
+       *   $schemaNativeEnumValues: import('zodex').SzNativeEnum['values']
+       * }}
+       */ (
+        this.getInput({root})
+      );
+
+    return $schemaNativeEnumValues[value];
+  },
+  viewUI ({value, specificSchemaObject}) {
+    return ['div', [
+      'Native enum: ',
+      ['span', {
+        dataset: {type: 'nativeEnum'},
+        title: specificSchemaObject?.description ?? '(a native enum)'
+      }, [value]]
+    ]];
+  },
+  editUI (info) {
+    const {
+      specificSchemaObject,
+      value
+      // typeNamespace
+    } = info;
+    const schemaNativeEnumValues = /** @type {import('zodex').SzNativeEnum} */ (
+      specificSchemaObject
+    )?.values;
+    const nativeEnumKeys = Object.keys(schemaNativeEnumValues);
+
+    let keyForValue;
+    if (schemaNativeEnumValues && 'value' in info) {
+      keyForValue = Object.entries(schemaNativeEnumValues).find(([, val]) => {
+        return val === value;
+      })?.[0];
+    }
+
+    const nativeEnumPattern = nativeEnumKeys.map((nativeEnumKey) => {
+      // Zod seems to prohibit numerically-indexed strings so we prevent here,
+      //   but it seems the generated JavaScript allows them (?)
+      if (
+        (/^\d$/u).test(nativeEnumKey) &&
+        Object.values(schemaNativeEnumValues).includes(
+          Number.parseInt(nativeEnumKey)
+        )
+      ) {
+        return null;
+      }
+      return escapeRegex(nativeEnumKey);
+    }).filter(Boolean).join('|');
+
+    const input =
+      /**
+       * @type {HTMLInputElement & {
+       *   $schemaNativeEnumValues: import('zodex').SzNativeEnum['values']
+       * }}
+       */ (jml(
+        'input',
+        /** @type {import('jamilih').JamilihAttributes} */ ({
+          class: 'nativeEnumKey',
+          placeholder: nativeEnumPattern,
+          title: nativeEnumPattern,
+          // Implicitly already wrapped by HTML in `^(?:...)$`
+          pattern: nativeEnumPattern,
+          value: keyForValue ?? '',
+          $on: {
+            input () {
+              const ev = /** @type {HTMLSpanElement} */ (
+                this.parentElement?.parentElement?.querySelector(
+                  '.enumeratedValue'
+                )
+              );
+              ev.textContent = String(schemaNativeEnumValues[
+                /** @type {HTMLInputElement} */
+                (this).value
+              ] ?? '');
+            }
+          }
+        })
+      ));
+    input.$schemaNativeEnumValues = schemaNativeEnumValues;
+
+    return ['div', {
+      dataset: {type: 'nativeEnum'},
+      title: specificSchemaObject?.description ?? 'Native Enum'
+    }, [
+      ['label', [
+        'Enumerated key ',
+        input
+      ]],
+      ['br'],
+      'Enumerated value: ',
+      ['span', {
+        class: 'enumeratedValue'
+      }, [
+        value ?? ''
+      ]]
+    ]];
+  }
+};
+
+export default nativeEnumType;

package/src/fundamentalTypes/neverType.js

@@ -0,0 +1,44 @@
+import {$e} from '../utils/templateUtils.js';
+
+/**
+ * @type {import('../types.js').TypeObject}
+ */
+const neverType = {
+  stringRegex: /^never$/u,
+  option: ['Never'],
+  valueMatch () {
+    return false;
+  },
+  toValue (/* _s */) {
+    throw new Error('Cannot convert to value');
+  },
+  getValue () {
+    return /** @type {import('../types.js').ToValue} */ (
+      this.toValue
+    )('');
+  },
+  viewUI ({specificSchemaObject}) {
+    return ['i', {
+      dataset: {type: 'never'},
+      title: specificSchemaObject?.description ?? '(a `never`)'
+    }, ['never']];
+  },
+  /* istanbul ignore next -- No dupe keys, array refs, or validation */
+  getInput ({root}) {
+    return /** @type {HTMLInputElement} */ ($e(root, 'input'));
+  },
+  editUI ({typeNamespace}) {
+    return ['div', {dataset: {type: 'never'}}, [
+      ['label', [
+        'Never (no value present here)',
+        ['input', {
+          type: 'checkbox',
+          name: `${typeNamespace}-never`,
+          hidden: true
+        }]
+      ]]
+    ]];
+  }
+};
+
+export default neverType;

package/src/fundamentalTypes/noneditableType.js

@@ -8,6 +8,9 @@ const noneditableType = {
   // Ideally, we would remove the option,
   //   but edit forms currently need a pull-down option
   option: ['Non-editable'],
+  valueMatch () {
+    return true;
+  },
   getInput ({root}) {
     return /** @type {HTMLButtonElement} */ ($e(root, 'button'));
   },
@@ -36,19 +39,30 @@ const noneditableType = {
       valid: val !== undefined
     };
   },
-  viewUI ({value}) {
+  viewUI ({value, specificSchemaObject}) {
+    const stringTag = toStringTag(value);
     return ['div', {dataset: {type: 'resurrectable'}}, [
-      ['b', {class: 'emphasis'}, ['Non-editable']],
+      ['b', {
+        class: 'emphasis',
+        title: specificSchemaObject?.description
+          ? `(a non-editable ${stringTag})`
+          : undefined
+      }, [
+        specificSchemaObject?.description ?? 'Non-editable'
+      ]],
       ['span', {
         title: 'There is no current support for editing this element\'s ' +
           'type, but its contents will be passed on transparently.'
       }, ['?']],
       ['b', ['String tag: ']],
-      toStringTag(value)
+      stringTag
     ]];
   },
-  editUI ({typeNamespace, value}) {
-    return ['div', {dataset: {type: 'resurrectable'}}, [
+  editUI ({typeNamespace, specificSchemaObject, value}) {
+    return ['div', {
+      dataset: {type: 'resurrectable'},
+      title: specificSchemaObject?.description ?? 'Non-editable'
+    }, [
       ['a', {
         // eslint-disable-next-line no-script-url -- Safe
         href: 'javascript:void(0)',

package/src/fundamentalTypes/nullType.js

@@ -6,23 +6,33 @@ import {$e} from '../utils/templateUtils.js';
 const nullType = {
   option: ['Null'],
   stringRegex: /^null$/u,
+  valueMatch (x) {
+    return x === null;
+  },
   toValue: () => ({value: null}),
   getValue: () => null,
-  viewUI () {
-    return ['i', {dataset: {type: 'null'}}, ['null']];
-  },
   /* istanbul ignore next -- No dupe keys, array refs, or validation */
   getInput ({root}) {
     return /** @type {HTMLInputElement} */ ($e(root, 'input'));
   },
-  editUI ({typeNamespace}) {
-    return ['div', {dataset: {type: 'null'}}, [
+  viewUI ({specificSchemaObject}) {
+    return ['i', {
+      dataset: {type: 'null'},
+      title: specificSchemaObject?.description ?? '(a `null`)'
+    }, ['null']];
+  },
+  editUI ({typeNamespace, specificSchemaObject}) {
+    return ['div', {
+      dataset: {type: 'null'},
+      title: specificSchemaObject?.description ?? 'Null'
+    }, [
       ['label', [
         'Null',
         ['input', {
           type: 'checkbox',
           name: `${typeNamespace}-null`,
-          checked: true
+          checked: true,
+          disabled: true
         }]
       ]]
     ]];

package/src/fundamentalTypes/numberType.js

@@ -9,7 +9,7 @@ const numberType = {
     '^' + // No leading content.
       '[-+]?' + // Optional sign.
       // Optionally 0-30 decimal digits of mantissa.
-      '(?:[0-9]{0,30}\\.)?' +
+      String.raw`(?:[0-9]{0,30}\.)?` +
       // 1-30 decimal digits of integer or fraction.
       '[0-9]{1,30}' +
       // Optional exponent 0-29 for scientific notation.
@@ -17,6 +17,13 @@ const numberType = {
       '$', // No trailing content.
     'u'
   ),
+  valueMatch (x) {
+    return typeof x === 'number' &&
+      // Avoid special numbers:
+      !Number.isNaN(x) &&
+      x !== Number.POSITIVE_INFINITY && x !== Number.NEGATIVE_INFINITY &&
+      !Object.is(x, -0);
+  },
   toValue (s) {
     return {value: Number(s)};
   },
@@ -41,13 +48,49 @@ const numberType = {
     // Todo?
   },
   */
-  viewUI ({value}) {
-    return ['i', {dataset: {type: 'number'}}, [String(value)]];
+  viewUI ({value, specificSchemaObject}) {
+    return ['i', {
+      dataset: {type: 'number'},
+      title: specificSchemaObject?.description ?? '(a number)'
+    }, [
+      String(value)
+    ]];
   },
-  editUI ({typeNamespace, value = ''}) {
-    return ['div', {dataset: {type: 'number'}}, [
+  editUI ({typeNamespace, specificSchemaObject, value}) {
+    const isLiteral = specificSchemaObject?.type === 'literal';
+    const numberSchemaObject = /** @type {import('zodex').SzNumber} */ (
+      specificSchemaObject
+    );
+    // Seems to need a multiplier of around these sizes to have a noticeable
+    //   effect on the inputs; shouldn't need any though
+    const epsilon = 150 * Number.EPSILON;
+    const maxEpsilon = 300 * Number.EPSILON;
+
+    return ['div', {
+      dataset: {type: 'number'},
+      title: specificSchemaObject?.description ?? 'Number'
+    }, [
       ['input', {
-        name: `${typeNamespace}-number`, type: 'number', step: 'any', value
+        disabled: isLiteral,
+        name: `${typeNamespace}-number`,
+        type: 'number',
+        min: numberSchemaObject?.min
+          ? numberSchemaObject?.minInclusive
+            ? numberSchemaObject?.min
+            : numberSchemaObject?.min +
+              (numberSchemaObject?.int ? 1 : epsilon)
+          : undefined,
+        max: numberSchemaObject?.max
+          ? numberSchemaObject?.maxInclusive
+            ? numberSchemaObject?.max
+            : numberSchemaObject?.max -
+              (numberSchemaObject?.int ? 1 : maxEpsilon)
+          : undefined,
+        step: numberSchemaObject?.multipleOf ??
+          (numberSchemaObject?.int ? '1' : 'any'),
+        value: isLiteral
+          ? specificSchemaObject?.value
+          : (value ?? specificSchemaObject?.defaultValue ?? '')
       }]
     ]];
   }

package/src/fundamentalTypes/objectType.js

@@ -1,3 +1,4 @@
+import {toStringTag} from '../vendor-imports.js';
 import arrayType from './arrayType.js';
 
 /**
@@ -8,6 +9,11 @@ const objectType = {
   regexEndings: [',', '}'],
   stringRegexBegin: /^\{/u,
   stringRegexEnd: /^\}/u,
+  valueMatch (x) {
+    return x && typeof x === 'object' &&
+      // Exclude other special object types
+      toStringTag(x) === 'Object';
+  },
   toValue (...args) {
     return /** @type {import('../types.js').ToValue} */ (
       arrayType.toValue
@@ -19,8 +25,10 @@ const objectType = {
   getInput (...args) {
     return arrayType.getInput.apply(this, args);
   },
-  viewUI (...args) {
-    return arrayType.viewUI.apply(this, args);
+  viewUI ({...args}) {
+    return arrayType.viewUI.call(this, {
+      ...args, type: 'object'
+    });
   },
   editUI ({...args}) {
     return arrayType.editUI.call(this, {

package/src/fundamentalTypes/promiseType.js

@@ -0,0 +1,60 @@
+import {toStringTag} from '../vendor-imports.js';
+import {$e} from '../utils/templateUtils.js';
+
+/**
+ * @type {import('../types.js').TypeObject}
+ */
+const promiseType = {
+  option: ['Promise'],
+  stringRegex: /^Promise\((.*)\)$/u,
+  // Todo: Fix all the following methods up to `editUI` to work with children
+  valueMatch (x) {
+    return toStringTag(x) === 'Promise';
+  },
+  toValue (s) {
+    return {value: s.slice(8, -1)};
+  },
+  getInput ({root}) {
+    return /** @type {HTMLTextAreaElement} */ ($e(root, 'input'));
+  },
+  setValue ({root, value}) {
+    this.getInput({root}).value = value;
+  },
+  getValue ({root}) {
+    return this.getInput({root}).value;
+  },
+  viewUI ({specificSchemaObject}) {
+    return ['span', {
+      dataset: {type: 'promise'},
+      title: specificSchemaObject?.description
+    }, [
+      // We don't know what it resolves to without awaiting it
+      'A Promise'
+    ]];
+  },
+  editUI ({
+    format, type, buildTypeChoices, specificSchemaObject,
+    topRoot, schemaContent, typeNamespace
+  }) {
+    return ['div', {dataset: {type: '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} */ (
+          specificSchemaObject
+        )?.value ?? {type: 'any'},
+        state: type,
+        // itemIndex,
+        typeNamespace
+      }).domArray)
+    ]];
+  }
+};
+
+export default promiseType;

package/src/fundamentalTypes/recordType.js

@@ -0,0 +1,42 @@
+import {toStringTag} from '../vendor-imports.js';
+import arrayType from './arrayType.js';
+
+/**
+ * @type {import('../types.js').TypeObject}
+ */
+const recordType = {
+  option: ['Record'],
+  regexEndings: [',', '}'],
+  stringRegexBegin: /^Record\{/u,
+  stringRegexEnd: /^\}/u,
+  array: true,
+  record: true,
+  valueMatch (x) { // Like `object` type, can also match
+    return x && typeof x === 'object' &&
+      // Exclude other special object types
+      toStringTag(x) === 'Object';
+  },
+  toValue (...args) {
+    return /** @type {import('../types.js').ToValue} */ (
+      arrayType.toValue
+    ).apply(this, args);
+  },
+  getValue (...args) {
+    return arrayType.getValue.apply(this, args);
+  },
+  getInput (...args) {
+    return arrayType.getInput.apply(this, args);
+  },
+  viewUI ({...args}) {
+    return arrayType.viewUI.call(this, {
+      ...args, type: 'record'
+    });
+  },
+  editUI ({...args}) {
+    return arrayType.editUI.call(this, {
+      ...args, type: 'record'
+    });
+  }
+};
+
+export default recordType;