Skip to content

Commit

Permalink
✨ [#2] Apply feedback and add radio component
Browse files Browse the repository at this point in the history
  • Loading branch information
Viicos committed Oct 26, 2023
1 parent 55c133e commit dab8ef2
Show file tree
Hide file tree
Showing 12 changed files with 594 additions and 9 deletions.
29 changes: 29 additions & 0 deletions src/formio/common.ts
Original file line number Diff line number Diff line change
@@ -0,0 +1,29 @@
import {JSONObject} from '@/types';

import {ComponentTranslations} from './i18n';

/**
* @category Utilities
*/
export interface Option {
value: string;
label: string;
openForms?: {
translations: ComponentTranslations;
};
}

/**
* @category Utilities
*/
export interface ManualValues {
dataSrc: 'manual';
}

/**
* @category Utilities
*/
export interface VariableValues {
dataSrc: 'variable';
itemsExpression: string | JSONObject;
}
4 changes: 3 additions & 1 deletion src/formio/components/checkbox.ts
Original file line number Diff line number Diff line change
Expand Up @@ -3,7 +3,7 @@ import {InputComponentSchema} from '..';
type Validator = 'required';
type TranslatableKeys = 'label' | 'description' | 'tooltip';

export type CheckboxInputSchema = InputComponentSchema<string, Validator, TranslatableKeys>;
export type CheckboxInputSchema = InputComponentSchema<boolean, Validator, TranslatableKeys>;

/**
* @group Form.io components
Expand All @@ -12,4 +12,6 @@ export type CheckboxInputSchema = InputComponentSchema<string, Validator, Transl
export interface CheckboxComponentSchema
extends Omit<CheckboxInputSchema, 'hideLabel' | 'disabled'> {
type: 'checkbox';
defaultValue?: boolean;
multiple?: false;
}
1 change: 1 addition & 0 deletions src/formio/components/email.ts
Original file line number Diff line number Diff line change
Expand Up @@ -11,6 +11,7 @@ export type EmailInputSchema = InputComponentSchema<string, Validator, Translata
*/
export interface BaseEmailComponentSchema extends Omit<EmailInputSchema, 'hideLabel' | 'disabled'> {
type: 'email';
validateOn?: 'blur';
// additional properties
autocomplete?: string;
// OF custom properties
Expand Down
1 change: 1 addition & 0 deletions src/formio/components/index.ts
Original file line number Diff line number Diff line change
Expand Up @@ -7,6 +7,7 @@ export * from './datetime';
export * from './time';
export * from './phonenumber';
export * from './postcode';
export * from './radio';
export * from './selectboxes';
export * from './number';
export * from './file';
Expand Down
39 changes: 39 additions & 0 deletions src/formio/components/radio.ts
Original file line number Diff line number Diff line change
@@ -0,0 +1,39 @@
import {InputComponentSchema} from '..';
import {OFExtensions} from '../base';
import {ManualValues, Option, VariableValues} from '../common';

type Validator = 'required';
type TranslatableKeys = 'label' | 'description' | 'tooltip';

export type RadioInputSchema = InputComponentSchema<string | null, Validator, TranslatableKeys>;

/**
* @group Form.io components
* @category Base types
*/
interface RadioManualValuesSchema extends Omit<RadioInputSchema, 'hideLabel' | 'disabled'> {
type: 'radio';
defaultValue?: string | null;
multiple?: false;
// additional properties
openForms: OFExtensions<TranslatableKeys>['openForms'] & ManualValues;
values: Option[];
}

/**
* @group Form.io components
* @category Base types
*/
interface RadioVariableValuesSchema extends Omit<RadioInputSchema, 'hideLabel' | 'disabled'> {
type: 'radio';
defaultValue?: string | null;
multiple?: false;
// additional properties
openForms: OFExtensions<TranslatableKeys>['openForms'] & VariableValues;
}

/**
* @group Form.io components
* @category Concrete types
*/
export type RadioComponentSchema = RadioManualValuesSchema | RadioVariableValuesSchema;
41 changes: 35 additions & 6 deletions src/formio/components/selectboxes.ts
Original file line number Diff line number Diff line change
@@ -1,18 +1,47 @@
import {InputComponentSchema} from '..';
import {OFExtensions} from '../base';
import {ManualValues, Option, VariableValues} from '../common';

type Validator = 'required';
type TranslatableKeys = 'label' | 'description' | 'tooltip';

export type SelectboxesInputSchema = InputComponentSchema<string, Validator, TranslatableKeys>;
export type SelectboxesInputSchema = InputComponentSchema<
Record<string, boolean>,
Validator,
TranslatableKeys
>;

/**
* @group Form.io components
* @category Concrete types
* @category Base types
*/
export interface SelectboxesComponentSchema
interface SelectboxesManualValuesSchema
extends Omit<SelectboxesInputSchema, 'hideLabel' | 'disabled'> {
type: 'selectboxes';
// OF custom properties
dataSrc: 'manual' | 'variable';
itemsExpression?: string;
defaultValue?: Record<string, boolean>;
multiple?: false;
// additional properties
openForms: OFExtensions<TranslatableKeys>['openForms'] & ManualValues;
values: Option[];
}

/**
* @group Form.io components
* @category Base types
*/
interface SelectboxesVariableValuesSchema
extends Omit<SelectboxesInputSchema, 'hideLabel' | 'disabled'> {
type: 'selectboxes';
defaultValue?: Record<string, boolean>;
multiple?: false;
// additional properties
openForms: OFExtensions<TranslatableKeys>['openForms'] & VariableValues;
}

/**
* @group Form.io components
* @category Concrete types
*/
export type SelectboxesComponentSchema =
| SelectboxesManualValuesSchema
| SelectboxesVariableValuesSchema;
6 changes: 4 additions & 2 deletions src/formio/index.ts
Original file line number Diff line number Diff line change
Expand Up @@ -8,6 +8,7 @@ import {
NumberComponentSchema,
PhoneNumberComponentSchema,
PostcodeComponentSchema,
RadioComponentSchema,
SelectboxesComponentSchema,
TextFieldComponentSchema,
TimeComponentSchema,
Expand Down Expand Up @@ -39,16 +40,17 @@ export * from './components';
export type AnyComponentSchema =
// inputs
| TextFieldComponentSchema
| CheckboxComponentSchema
| EmailComponentSchema
| DateComponentSchema
| DateTimeComponentSchema
| TimeComponentSchema
| PhoneNumberComponentSchema
| PostcodeComponentSchema
| SelectboxesComponentSchema
| FileComponentSchema
| NumberComponentSchema
| CheckboxComponentSchema
| SelectboxesComponentSchema
| RadioComponentSchema
// layout
| ContentComponentSchema;

Expand Down
4 changes: 4 additions & 0 deletions src/types.ts
Original file line number Diff line number Diff line change
@@ -0,0 +1,4 @@
export type JSONPrimitive = string | number | boolean | null;
export type JSONValue = JSONPrimitive | JSONObject | JSONArray;
export type JSONObject = {[member: string]: JSONValue};
export interface JSONArray extends Array<JSONValue> {}
84 changes: 84 additions & 0 deletions test-d/formio/components/checkbox.test-d.ts
Original file line number Diff line number Diff line change
@@ -0,0 +1,84 @@
import {expectAssignable, expectNotAssignable} from 'tsd';

import {CheckboxComponentSchema} from '../../../lib';

// minimal component schema
expectAssignable<CheckboxComponentSchema>({
id: 'yejak',
type: 'checkbox',
key: 'someCheckbox',
label: 'Some checkbox',
});


// multiple false and appropriate default value type
expectAssignable<CheckboxComponentSchema>({
id: 'yejak',
type: 'checkbox',
key: 'someCheckbox',
label: 'Some checkbox',
multiple: false,
defaultValue: true,
});

// full, correct schema
expectAssignable<CheckboxComponentSchema>({
id: 'yejak',
type: 'checkbox',
// basic tab
label: 'Some checkbox',
key: 'someCheckbox',
description: '',
tooltip: 'A tooltip',
showInSummary: true,
showInEmail: false,
showInPDF: true,
multiple: false,
hidden: false,
clearOnHide: true,
isSensitiveData: true,
defaultValue: false,
// Advanced tab
conditional: {
show: undefined,
when: '',
eq: '',
},
// Validation tab
validate: {
required: false,
plugins: [],
},
translatedErrors: {nl: {required: 'Geef checkbox.'}},
errors: {required: 'Geef checkbox.'},
// registration tab
registration: {
attribute: '',
},
// translations tab in builder form
openForms: {
translations: {
nl: {label: 'foo'},
},
},
// fixed but not editable
validateOn: 'blur',
});

// multiple true not allowed
expectNotAssignable<CheckboxComponentSchema>({
id: 'yejak',
type: 'checkbox',
key: 'someCheckbox',
label: 'Some checkbox',
multiple: true,
});

// defaultValue not allowed
expectNotAssignable<CheckboxComponentSchema>({
id: 'yejak',
type: 'checkbox',
key: 'someCheckbox',
label: 'Some checkbox',
defaultValue: [true],
});
9 changes: 9 additions & 0 deletions test-d/formio/components/email.test-d.ts
Original file line number Diff line number Diff line change
Expand Up @@ -86,6 +86,15 @@ expectAssignable<EmailComponentSchema>({
validateOn: 'blur',
});

// validateOn not `blur`
expectNotAssignable<EmailComponentSchema>({
id: 'yejak',
type: 'email',
key: 'someEmail',
label: 'Some email',
validateOn: 'change',
});

// invalid, multiple true and non-array default value
expectNotAssignable<EmailComponentSchema>({
id: 'yejak',
Expand Down
Loading

0 comments on commit dab8ef2

Please sign in to comment.