diff --git a/package/client/resource/interface/input.ts b/package/client/resource/interface/input.ts index 0a34f5b..49e2281 100644 --- a/package/client/resource/interface/input.ts +++ b/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 -interface InputDialogRowProps { - type: +type Icon = IconName | [IconName, IconPrefix]; + +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]; - iconColor?: string; +} + +// Should really be improved at some point to only display properties depending on the input type +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; }