refactor(package): improve types for input dialog

package/client/resource/interface/input.ts

@@ -1,8 +1,9 @@
 import { IconName, IconPrefix } from '@fortawesome/fontawesome-common-types';
 
-// Should really be improved at some point to only display properties depending on the input type
+type Icon = IconName | [IconName, IconPrefix];
-interface InputDialogRowProps {
+
-  type:
+interface BaseInput {
+  type?:
     | 'input'
     | 'number'
     | 'checkbox'
@@ -13,29 +14,144 @@ interface InputDialogRowProps {
     | 'date'
     | 'date-range'
     | 'time'
-    | 'text-area';
+    | 'textarea';
   label: string;
-  options?: { value: string; label: string; default?: string }[];
+}
-  password?: boolean;
+
-  icon?: IconName | [IconPrefix, IconName];
+// Should really be improved at some point to only display properties depending on the input type
-  iconColor?: string;
+interface InputProps extends BaseInput {
+  type?: 'input';
+  description?: string;
   placeholder?: string;
-  default?: string | number;
+  icon?: Icon;
+  required?: boolean;
   disabled?: boolean;
+  default?: string;
+  password?: boolean;
+  min?: number;
+  max?: number;
+}
+
+interface NumberProps extends BaseInput {
+  type: 'number';
+  description?: string;
+  placeholder?: string;
+  icon?: Icon;
+  required?: boolean;
+  disabled?: boolean;
+  default?: number;
+  min?: number;
+  max?: number;
+  precision?: number;
+  step?: number;
+}
+
+interface CheckboxProps extends BaseInput {
+  type: 'checkbox';
   checked?: boolean;
+  disabled?: boolean;
+  required?: boolean;
+}
+
+interface SelectProps extends BaseInput {
+  type: 'select' | 'multi-select';
+  options: { value: string; label?: string }[];
+  description?: string;
+  placeholder?: string;
+  icon?: Icon;
+  required?: boolean;
+  disabled?: boolean;
+  default?: string | string[];
+  clearable?: boolean;
+}
+
+interface SliderProps extends BaseInput {
+  type: 'slider';
+  placeholder?: string;
+  icon?: Icon;
+  required?: boolean;
+  disabled?: boolean;
+  default?: number;
+  min?: number;
+  max?: number;
+  step?: number;
+}
+
+interface ColorProps extends BaseInput {
+  type: 'color';
+  description?: string;
+  placeholder?: string;
+  icon?: Icon;
+  required?: boolean;
+  disabled?: boolean;
+  default?: string;
+  format?: 'hex' | 'hexa' | 'rgb' | 'rgba' | 'hsl' | 'hsla';
+}
+
+interface DateProps extends BaseInput {
+  type: 'date';
+  description?: string;
+  icon?: Icon;
+  required?: boolean;
+  disabled?: boolean;
+  default?: string | true;
+  format?: string;
+  returnString?: boolean;
+  clearable?: boolean;
+  min?: string;
+  max?: string;
+}
+
+interface DateRangeProps extends BaseInput {
+  type: 'date-range';
+  description?: string;
+  icon?: Icon;
+  required?: boolean;
+  disabled?: boolean;
+  default?: [string, string];
+  format?: string;
+  returnString?: boolean;
+  clearable?: boolean;
+}
+
+interface TimeProps extends BaseInput {
+  type: 'time';
+  description?: string;
+  icon?: Icon;
+  required?: boolean;
+  disabled?: boolean;
+  default?: string;
+  format?: '12' | '24';
+  clearable?: boolean;
+}
+
+interface TextAreaProps extends BaseInput {
+  type: 'textarea';
+  description?: string;
+  placeholder?: string;
+  icon?: Icon;
+  required?: boolean;
+  disabled?: boolean;
+  default?: number;
   min?: number;
   max?: number;
   autosize?: boolean;
-  step?: number;
-  required?: boolean;
-  format?: string;
-  returnString?: boolean;
-  description?: string;
 }
 
+type RowInput =
+  | InputProps
+  | NumberProps
+  | CheckboxProps
+  | SelectProps
+  | SliderProps
+  | ColorProps
+  | DateProps
+  | DateRangeProps
+  | TimeProps;
+
 type inputDialog = (
   heading: string,
-  rows: string[] | InputDialogRowProps[],
+  rows: string[] | RowInput[],
   options: {
     allowCancel?: boolean;
   }