feat(DateTimeControl): add component api types and validator

src/common/schema-derived-types.ts

@@ -6,6 +6,7 @@ import {
   NumericControlOptions,
   OneOfControlOptions,
   TextControlOptions,
+  DateTimeControlOptions,
   UISchema,
 } from ".."
 
@@ -21,11 +22,13 @@ type JsonSchemaTypeToControlOptions<
   // K extends keyof T & string,
 > = T extends { enum: unknown }
   ? EnumControlOptions
-  : T extends { type: infer U }
+  : T extends { type: infer U; format?: infer F }
     ? U extends "object" // ObjectControlOptions goes here
       ? unknown
       : U extends "string"
-        ? TextControlOptions
+        ? F extends "date-time"
+          ? DateTimeControlOptions
+          : TextControlOptions
         : U extends "number" | "integer"
           ? NumericControlOptions
           : U extends "array"

src/ui-schema.ts

@@ -7,6 +7,7 @@ import type {
   FormItemProps,
   InputNumberProps,
   InputProps,
+  DatePickerProps,
 } from "antd"
 import type { TextAreaProps } from "antd/es/input"
 import type { RuleObject as AntDRule } from "antd/es/form"
@@ -191,6 +192,55 @@ export type TextControlOptions = {
     }
 )
 
+/**
+ * The input props of the AntD DatePicker component that we want to
+ * expose to api consumers through schema options.  Full list of props
+ * can be found in [this section](https://ant.design/components/date-picker#datepicker)
+ * of the antd docs.
+ */
+export const allowedDateTimePropKeys: (keyof DatePickerProps)[] = [
+  "id",
+  "is",
+  "alt",
+  "size",
+  "width",
+  "style",
+  "format",
+  "height",
+  "title",
+  "presets",
+  "showNow",
+  "showHour",
+  "showTime",
+  "showWeek",
+  "showMinute",
+  "showSecond",
+  "showMillisecond",
+] as const
+
+export type DateTimeControlOptions = Pick<
+  DatePickerProps,
+  (typeof allowedDateTimePropKeys)[number]
+>
+
+export function isDateTimeControlOptions(
+  options: unknown,
+): options is DateTimeControlOptions {
+  if (typeof options !== "object" || options == null) {
+    return false
+  }
+
+  for (const key of Object.keys(options)) {
+    if (
+      !allowedDateTimePropKeys.includes(key as keyof DateTimeControlOptions)
+    ) {
+      return false
+    }
+  }
+
+  return true
+}
+
 /**
  * A control element. The scope property of the control determines
  * to which part of the schema the control should be bound.