✨ [#2] Implement 'new' cosign component schema type definitions

src/formio/components/cosign.ts

@@ -1,4 +1,5 @@
 import {OFExtensions, StrictComponentSchema} from '..';
+import {EmailInputSchema} from './email';
 
 type TranslatableKeys = 'label' | 'description';
 
@@ -30,8 +31,36 @@ export type CosignV1InputSchema = StrictComponentSchema<never> &
  *
  * @group Form.io components
  * @category Concrete types
+ *
+ * @deprecated
+ *
+ * The in-band cosign flow is problematic with existing DigiD/eHerkenning sessions. It
+ * is currently not scheduled for removal, but we recommend using the V2 variant for
+ * better UX.
  */
 export interface CosignV1ComponentSchema extends Omit<CosignV1InputSchema, KeysToOmit> {
   type: 'coSign';
   authPlugin: string; // plugin identifiers in the backend are dynamic
 }
+
+type V2KeysToOmit = 'hideLabel' | 'disabled' | 'placeholder';
+
+/**
+ * The cosign component type, otherwise known as 'Cosign'.
+ *
+ * This is a custom component sharing most of the functionality with the email input
+ * component type - it collects the e-mail address of any/a cosigner so that they
+ * receive a notification they're expected to cosign. The actual cosigning happens
+ * out-of-band. This component *does* take form data input, as opposed to the V1
+ * component implementation.
+ *
+ * @group Form.io components
+ * @category Concrete types
+ */
+export interface CosignV2ComponentSchema extends Omit<EmailInputSchema, V2KeysToOmit> {
+  type: 'cosign';
+  validateOn: 'blur';
+  authPlugin: string; // plugin identifiers in the backend are dynamic
+  defaultValue?: string; // no multiple support, so must always be a single string
+  autocomplete?: string;
+}

src/formio/index.ts

@@ -5,6 +5,7 @@ import {
   ColumnsComponentSchema,
   ContentComponentSchema,
   CosignV1ComponentSchema,
+  CosignV2ComponentSchema,
   CurrencyComponentSchema,
   DateComponentSchema,
   DateTimeComponentSchema,
@@ -72,6 +73,7 @@ export type AnyComponentSchema =
   | BsnComponentSchema
   | AddressNLComponentSchema
   | NpFamilyMembersComponentSchema
+  | CosignV2ComponentSchema
   | MapComponentSchema
   // layout
   | ContentComponentSchema

test-d/formio/components/cosign-v2.test-d.ts

@@ -0,0 +1,116 @@
+import {expectAssignable, expectNotAssignable} from 'tsd';
+
+import {CosignV2ComponentSchema} from '../../../lib/';
+
+// minimal cosign component schema
+expectAssignable<CosignV2ComponentSchema>({
+  id: 'yejak',
+  type: 'cosign',
+  validateOn: 'blur',
+  key: 'someCoSign',
+  label: 'Some cosign',
+  authPlugin: 'digid',
+});
+
+// full, correct schema
+expectAssignable<CosignV2ComponentSchema>({
+  id: 'yejak',
+  type: 'cosign',
+  validateOn: 'blur',
+  // basic tab in builder form
+  label: 'Some cosign',
+  key: 'someCoSign',
+  description: 'A description',
+  tooltip: 'A tooltip',
+  authPlugin: 'oidc-digid',
+  showInSummary: true,
+  showInEmail: false,
+  showInPDF: true,
+  hidden: false,
+  clearOnHide: true,
+  isSensitiveData: true,
+  defaultValue: '',
+  autocomplete: 'email',
+  // advanced tab in builder form
+  conditional: {
+    show: undefined,
+    when: undefined,
+    eq: undefined,
+  },
+  // validation tab in builder form
+  validate: {
+    required: false,
+    plugins: undefined,
+  },
+  translatedErrors: {
+    nl: {
+      required: 'Je moet een waarde opgeven!!!',
+    },
+  },
+  errors: {
+    // translatedErrors is converted into errors by the backend
+    required: 'Je moet een waarde opgeven!!!',
+  },
+  // registration tab in builder form
+  registration: {
+    attribute: '',
+  },
+  // translations tab in builder form
+  openForms: {
+    translations: {
+      nl: {
+        label: 'foo',
+        description: 'bar',
+        tooltip: 'baz',
+      },
+    },
+  },
+});
+
+// different component type
+expectNotAssignable<CosignV2ComponentSchema>({
+  type: 'fieldset' as const,
+});
+
+// using unsupported properties
+expectNotAssignable<CosignV2ComponentSchema>({
+  id: 'yejak',
+  type: 'cosign' as const,
+  validateOn: 'blur' as const,
+  key: 'someCoSign',
+  label: 'Some cosign',
+  authPlugin: 'digid',
+  hideLabel: true,
+});
+
+// multiple is not supported
+expectNotAssignable<CosignV2ComponentSchema>({
+  id: 'yejak',
+  type: 'cosign' as const,
+  validateOn: 'blur' as const,
+  key: 'someCoSign',
+  label: 'Some cosign',
+  authPlugin: 'digid',
+  multiple: true as boolean,
+});
+expectNotAssignable<CosignV2ComponentSchema>({
+  id: 'yejak',
+  type: 'cosign' as const,
+  validateOn: 'blur' as const,
+  key: 'someCoSign',
+  label: 'Some cosign',
+  authPlugin: 'digid',
+  defaultValue: [],
+});
+
+// while it shares functionality with email, we should not be able to use all
+// email extensions
+expectNotAssignable<CosignV2ComponentSchema>({
+  id: 'yejak',
+  type: 'cosign' as const,
+  validateOn: 'blur' as const,
+  key: 'someCoSign',
+  label: 'Some cosign',
+  authPlugin: 'digid',
+  confirmationRecipient: true,
+});