@remoteoss/json-schema-form 0.9.1-dev.20240320135936 → 0.9.1-dev.20240321210726

package/dist/index.cjs

@@ -1,8 +1,8 @@
 
 /*!
  Copyright (c) 2024 Remote Technology, Inc.
- NPM Package: @remoteoss/json-schema-form@0.9.1-dev.20240320135936
- Generated: Wed, 20 Mar 2024 13:59:53 GMT
+ NPM Package: @remoteoss/json-schema-form@0.9.1-dev.20240321210726
+ Generated: Thu, 21 Mar 2024 21:07:37 GMT
 
  MIT License
 
@@ -457,6 +457,15 @@ var validateMaxDate = (value, minDate) => {
   const compare = compareDates(value, minDate);
   return compare === "LESSER" || compare === "EQUAL" ? true : false;
 };
+var validateRadioOrSelectOptions = (value, options) => {
+  if (value === void 0)
+    return true;
+  const exactMatch = options.some((option) => option.value === value);
+  if (exactMatch)
+    return true;
+  const patternMatch = options.some((option) => option.pattern?.test(value));
+  return !!patternMatch;
+};
 var yupSchemas = {
   text: validateOnlyStrings,
   radioOrSelectString: (options) => {
@@ -469,28 +478,9 @@ var yupSchemas = {
       }
       return value === null ? void 0 : value;
     }).test(
-      /* 
-        Custom test determines if the value either:
-         - Matches a specific option by value
-         - Matches a pattern
-        If the option is undefined do not test, to allow for optional fields. 
-       */
       "matchesOptionOrPattern",
       ({ value }) => `The option ${JSON.stringify(value)} is not valid.`,
-      (value) => {
-        if (value === void 0) {
-          return true;
-        }
-        const exactMatch = options.some((option) => option.value === value);
-        if (exactMatch) {
-          return true;
-        }
-        const patternMatch = options.some((option) => option.pattern?.test(value));
-        if (patternMatch) {
-          return true;
-        }
-        return false;
-      }
+      (value) => validateRadioOrSelectOptions(value, options)
     );
   },
   date: ({ minDate, maxDate }) => {
@@ -519,9 +509,22 @@ var yupSchemas = {
     }
     return dateString;
   },
-  radioOrSelectNumber: (options) => (0, import_yup.mixed)().typeError("The value must be a number").oneOf(options, ({ value }) => {
-    return `The option ${JSON.stringify(value)} is not valid.`;
-  }).nullable(),
+  radioOrSelectNumber: (options) => (0, import_yup.mixed)().typeError("The value must be a number").transform((value) => {
+    if (options?.some((option) => option.value === null)) {
+      return value;
+    }
+    return value === null ? void 0 : value;
+  }).test(
+    "matchesOptionOrPattern",
+    ({ value }) => {
+      return `The option ${JSON.stringify(value)} is not valid.`;
+    },
+    (value) => {
+      if (value !== void 0 && typeof value !== "number")
+        return false;
+      return validateRadioOrSelectOptions(value, options);
+    }
+  ).nullable(),
   number: (0, import_yup.number)().typeError("The value must be a number").nullable(),
   file: (0, import_yup.array)().nullable(),
   email: (0, import_yup.string)().trim().email("Please enter a valid email address").nullable(),
@@ -567,13 +570,16 @@ var getOptions = (field) => {
 };
 var getYupSchema = ({ inputType, ...field }) => {
   const jsonType = getJsonTypeInArray(field.jsonType);
-  if (field.options?.length > 0 && field.jsonType !== "number") {
+  const hasOptions = field.options?.length > 0;
+  const generateOptionSchema = (type) => {
     const optionValues = getOptions(field);
-    return yupSchemas.radioOrSelectString(optionValues);
-  }
-  if (field.options?.length > 0 && field.jsonType === "number") {
-    const optionValues = getOptions(field).map((i) => i.value);
-    return yupSchemas.radioOrSelectNumber(optionValues);
+    return type === "number" ? yupSchemas.radioOrSelectNumber(optionValues) : yupSchemas.radioOrSelectString(optionValues);
+  };
+  if (hasOptions) {
+    if (Array.isArray(field.jsonType)) {
+      return field.jsonType.includes("number") ? generateOptionSchema("number") : generateOptionSchema("string");
+    }
+    return generateOptionSchema(field.jsonType);
   }
   if (field.format === "date") {
     return yupSchemas.date({ minDate: field.minDate, maxDate: field.maxDate });

package/dist/index.js

@@ -1,8 +1,8 @@
 
 /*!
  Copyright (c) 2024 Remote Technology, Inc.
- NPM Package: @remoteoss/json-schema-form@0.9.1-dev.20240320135936
- Generated: Wed, 20 Mar 2024 13:59:53 GMT
+ NPM Package: @remoteoss/json-schema-form@0.9.1-dev.20240321210726
+ Generated: Thu, 21 Mar 2024 21:07:37 GMT
 
  MIT License
 
@@ -421,6 +421,15 @@ var validateMaxDate = (value, minDate) => {
   const compare = compareDates(value, minDate);
   return compare === "LESSER" || compare === "EQUAL" ? true : false;
 };
+var validateRadioOrSelectOptions = (value, options) => {
+  if (value === void 0)
+    return true;
+  const exactMatch = options.some((option) => option.value === value);
+  if (exactMatch)
+    return true;
+  const patternMatch = options.some((option) => option.pattern?.test(value));
+  return !!patternMatch;
+};
 var yupSchemas = {
   text: validateOnlyStrings,
   radioOrSelectString: (options) => {
@@ -433,28 +442,9 @@ var yupSchemas = {
       }
       return value === null ? void 0 : value;
     }).test(
-      /* 
-        Custom test determines if the value either:
-         - Matches a specific option by value
-         - Matches a pattern
-        If the option is undefined do not test, to allow for optional fields. 
-       */
       "matchesOptionOrPattern",
       ({ value }) => `The option ${JSON.stringify(value)} is not valid.`,
-      (value) => {
-        if (value === void 0) {
-          return true;
-        }
-        const exactMatch = options.some((option) => option.value === value);
-        if (exactMatch) {
-          return true;
-        }
-        const patternMatch = options.some((option) => option.pattern?.test(value));
-        if (patternMatch) {
-          return true;
-        }
-        return false;
-      }
+      (value) => validateRadioOrSelectOptions(value, options)
     );
   },
   date: ({ minDate, maxDate }) => {
@@ -483,9 +473,22 @@ var yupSchemas = {
     }
     return dateString;
   },
-  radioOrSelectNumber: (options) => mixed().typeError("The value must be a number").oneOf(options, ({ value }) => {
-    return `The option ${JSON.stringify(value)} is not valid.`;
-  }).nullable(),
+  radioOrSelectNumber: (options) => mixed().typeError("The value must be a number").transform((value) => {
+    if (options?.some((option) => option.value === null)) {
+      return value;
+    }
+    return value === null ? void 0 : value;
+  }).test(
+    "matchesOptionOrPattern",
+    ({ value }) => {
+      return `The option ${JSON.stringify(value)} is not valid.`;
+    },
+    (value) => {
+      if (value !== void 0 && typeof value !== "number")
+        return false;
+      return validateRadioOrSelectOptions(value, options);
+    }
+  ).nullable(),
   number: number().typeError("The value must be a number").nullable(),
   file: array().nullable(),
   email: string().trim().email("Please enter a valid email address").nullable(),
@@ -531,13 +534,16 @@ var getOptions = (field) => {
 };
 var getYupSchema = ({ inputType, ...field }) => {
   const jsonType = getJsonTypeInArray(field.jsonType);
-  if (field.options?.length > 0 && field.jsonType !== "number") {
+  const hasOptions = field.options?.length > 0;
+  const generateOptionSchema = (type) => {
     const optionValues = getOptions(field);
-    return yupSchemas.radioOrSelectString(optionValues);
-  }
-  if (field.options?.length > 0 && field.jsonType === "number") {
-    const optionValues = getOptions(field).map((i) => i.value);
-    return yupSchemas.radioOrSelectNumber(optionValues);
+    return type === "number" ? yupSchemas.radioOrSelectNumber(optionValues) : yupSchemas.radioOrSelectString(optionValues);
+  };
+  if (hasOptions) {
+    if (Array.isArray(field.jsonType)) {
+      return field.jsonType.includes("number") ? generateOptionSchema("number") : generateOptionSchema("string");
+    }
+    return generateOptionSchema(field.jsonType);
   }
   if (field.format === "date") {
     return yupSchemas.date({ minDate: field.minDate, maxDate: field.maxDate });

package/dist/standalone.js

@@ -1,8 +1,8 @@
 
 /*!
  Copyright (c) 2024 Remote Technology, Inc.
- NPM Package: @remoteoss/json-schema-form@0.9.1-dev.20240320135936
- Generated: Wed, 20 Mar 2024 13:59:53 GMT
+ NPM Package: @remoteoss/json-schema-form@0.9.1-dev.20240321210726
+ Generated: Thu, 21 Mar 2024 21:07:37 GMT
 
  MIT License
 
@@ -11775,6 +11775,15 @@ var validateMaxDate = (value, minDate) => {
   const compare = compareDates(value, minDate);
   return compare === "LESSER" || compare === "EQUAL" ? true : false;
 };
+var validateRadioOrSelectOptions = (value, options) => {
+  if (value === void 0)
+    return true;
+  const exactMatch = options.some((option) => option.value === value);
+  if (exactMatch)
+    return true;
+  const patternMatch = options.some((option) => option.pattern?.test(value));
+  return !!patternMatch;
+};
 var yupSchemas = {
   text: validateOnlyStrings,
   radioOrSelectString: (options) => {
@@ -11787,28 +11796,9 @@ var yupSchemas = {
       }
       return value === null ? void 0 : value;
     }).test(
-      /* 
-        Custom test determines if the value either:
-         - Matches a specific option by value
-         - Matches a pattern
-        If the option is undefined do not test, to allow for optional fields. 
-       */
       "matchesOptionOrPattern",
       ({ value }) => `The option ${JSON.stringify(value)} is not valid.`,
-      (value) => {
-        if (value === void 0) {
-          return true;
-        }
-        const exactMatch = options.some((option) => option.value === value);
-        if (exactMatch) {
-          return true;
-        }
-        const patternMatch = options.some((option) => option.pattern?.test(value));
-        if (patternMatch) {
-          return true;
-        }
-        return false;
-      }
+      (value) => validateRadioOrSelectOptions(value, options)
     );
   },
   date: ({ minDate, maxDate }) => {
@@ -11837,9 +11827,22 @@ var yupSchemas = {
     }
     return dateString;
   },
-  radioOrSelectNumber: (options) => SchemaType().typeError("The value must be a number").oneOf(options, ({ value }) => {
-    return `The option ${JSON.stringify(value)} is not valid.`;
-  }).nullable(),
+  radioOrSelectNumber: (options) => SchemaType().typeError("The value must be a number").transform((value) => {
+    if (options?.some((option) => option.value === null)) {
+      return value;
+    }
+    return value === null ? void 0 : value;
+  }).test(
+    "matchesOptionOrPattern",
+    ({ value }) => {
+      return `The option ${JSON.stringify(value)} is not valid.`;
+    },
+    (value) => {
+      if (value !== void 0 && typeof value !== "number")
+        return false;
+      return validateRadioOrSelectOptions(value, options);
+    }
+  ).nullable(),
   number: NumberSchema().typeError("The value must be a number").nullable(),
   file: array_default().nullable(),
   email: StringSchema().trim().email("Please enter a valid email address").nullable(),
@@ -11885,13 +11888,16 @@ var getOptions = (field) => {
 };
 var getYupSchema = ({ inputType, ...field }) => {
   const jsonType = getJsonTypeInArray(field.jsonType);
-  if (field.options?.length > 0 && field.jsonType !== "number") {
+  const hasOptions = field.options?.length > 0;
+  const generateOptionSchema = (type) => {
     const optionValues = getOptions(field);
-    return yupSchemas.radioOrSelectString(optionValues);
-  }
-  if (field.options?.length > 0 && field.jsonType === "number") {
-    const optionValues = getOptions(field).map((i) => i.value);
-    return yupSchemas.radioOrSelectNumber(optionValues);
+    return type === "number" ? yupSchemas.radioOrSelectNumber(optionValues) : yupSchemas.radioOrSelectString(optionValues);
+  };
+  if (hasOptions) {
+    if (Array.isArray(field.jsonType)) {
+      return field.jsonType.includes("number") ? generateOptionSchema("number") : generateOptionSchema("string");
+    }
+    return generateOptionSchema(field.jsonType);
   }
   if (field.format === "date") {
     return yupSchemas.date({ minDate: field.minDate, maxDate: field.maxDate });

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@remoteoss/json-schema-form",
-  "version": "0.9.1-dev.20240320135936",
+  "version": "0.9.1-dev.20240321210726",
   "description": "Headless UI form powered by JSON Schemas",
   "author": "Remote.com <engineering@remote.com> (https://remote.com/)",
   "license": "MIT",

package/src/tests/const.test.js

@@ -195,7 +195,7 @@ describe('const/default with forced values', () => {
 });
 
 describe('OneOf const', () => {
-  it('Validates numbers correctly', () => {
+  it('Validates numbers or strings correctly', () => {
     const { handleValidation } = createHeadlessForm(
       {
         properties: {
@@ -214,22 +214,23 @@ describe('OneOf const', () => {
     });
   });
 
-  it('Validates strings', () => {
+  it('Validates numbers or strings when type is an array with null', () => {
     const { handleValidation } = createHeadlessForm(
       {
         properties: {
-          number: { type: 'number', oneOf: [{ const: 'a' }, { const: 'b' }, { const: 'c' }] },
+          number: { type: ['number', 'null'], oneOf: [{ const: 0 }, { const: 1 }, { const: 2 }] },
         },
       },
       { strictInputType: false }
     );
     expect(handleValidation({}).formErrors).toEqual(undefined);
-    expect(handleValidation({ number: 'd' }).formErrors).toEqual({
-      number: 'The option "d" is not valid.',
+    expect(handleValidation({ number: 3 }).formErrors).toEqual({
+      number: 'The option 3 is not valid.',
     });
-    expect(handleValidation({ number: 'a' }).formErrors).toBeUndefined();
+    expect(handleValidation({ number: 2 }).formErrors).toBeUndefined();
     expect(handleValidation({ number: '2' }).formErrors).toEqual({
       number: 'The option "2" is not valid.',
     });
+    expect(handleValidation({ number: null }).formErrors).toEqual(undefined);
   });
 });

package/src/tests/createHeadlessForm.test.js

@@ -2028,6 +2028,45 @@ describe('createHeadlessForm', () => {
     });
   });
 
+  it('supports oneOf number const', () => {
+    const result = createHeadlessForm({
+      type: 'object',
+      additionalProperties: false,
+      properties: {
+        pets: {
+          title: 'How many pets?',
+          oneOf: [
+            {
+              title: 'One',
+              const: 0,
+            },
+            {
+              title: 'Two',
+              const: 2,
+            },
+            {
+              title: 'null',
+              const: 1,
+            },
+          ],
+          'x-jsf-presentation': {
+            inputType: 'select',
+          },
+          type: ['number', 'null'],
+        },
+      },
+      required: [],
+      'x-jsf-order': ['pets'],
+    });
+
+    const fieldValidator = result.fields[0].schema;
+
+    expect(fieldValidator.isValidSync(0)).toBe(true);
+    expect(fieldValidator.isValidSync(1)).toBe(true);
+    expect(() => fieldValidator.validateSync('2')).toThrowError('The option "2" is not valid.');
+    expect(fieldValidator.isValidSync(null)).toBe(true);
+  });
+
   describe('x-jsf-presentation attribute', () => {
     it('support field with "x-jsf-presentation.statement"', () => {
       const result = createHeadlessForm(schemaInputWithStatement);