@useloops/design-system 1.4.168 → 1.4.169

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
package/dist/index.d.ts CHANGED
@@ -1,21 +1,15 @@
1
- import { Icons } from 'BrandCore/Icon';
2
- export { default as Icon, Icons, iconSizeMap, icons } from 'BrandCore/Icon';
3
1
  import * as _mui_material from '@mui/material';
4
- import { SxProps, Theme, AvatarGroupProps as AvatarGroupProps$1, ButtonProps as ButtonProps$1, CheckboxProps as CheckboxProps$1, ContainerProps, MenuProps, MenuItemProps as MenuItemProps$1, FormControlLabelProps as FormControlLabelProps$1, Breakpoint, TooltipProps as TooltipProps$1, IconButtonProps as IconButtonProps$1, ButtonGroupProps, TextFieldProps as TextFieldProps$1, LinkProps as LinkProps$1, PopperProps as PopperProps$1, ClickAwayListenerProps, FadeProps, SelectProps as SelectProps$1, SelectChangeEvent, PaperProps, SwitchProps as SwitchProps$1, TypographyProps as TypographyProps$1, PaletteMode, Direction } from '@mui/material';
5
- import react, { FunctionComponent, ReactNode, PropsWithChildren, ReactElement, ChangeEvent, FC } from 'react';
6
- import { SurfaceProps as SurfaceProps$1 } from 'WebCore/Surface';
7
- import { GenericSizeMap as GenericSizeMap$1 } from 'BrandCore/primitiveVariables';
8
- import * as react_jsx_runtime from 'react/jsx-runtime';
9
- import * as _emotion_styled from '@emotion/styled';
10
- import * as _mui_system from '@mui/system';
2
+ import { SxProps, Theme, PaperProps, AvatarGroupProps as AvatarGroupProps$1, ButtonProps as ButtonProps$1, CheckboxProps as CheckboxProps$1, ContainerProps, MenuProps, MenuItemProps as MenuItemProps$1, FormControlLabelProps as FormControlLabelProps$1, Breakpoint, TooltipProps as TooltipProps$1, IconButtonProps as IconButtonProps$1, ButtonGroupProps, TextFieldProps as TextFieldProps$1, LinkProps as LinkProps$1, PopperProps as PopperProps$1, ClickAwayListenerProps, FadeProps, SelectProps as SelectProps$1, SelectChangeEvent, SwitchProps as SwitchProps$1, TypographyProps as TypographyProps$1, PaletteMode, Direction } from '@mui/material';
3
+ import react, { FunctionComponent, PropsWithChildren, FC, ReactNode, ReactElement, ChangeEvent } from 'react';
4
+ import { SubmitHandler } from 'react-hook-form';
11
5
  import { Theme as Theme$1 } from '@mui/material/styles';
12
- import { NavigationSizing as NavigationSizing$1 } from 'Platform/Navigation';
13
6
  import { NumericFormatProps } from 'react-number-format';
14
- import { InputFieldBaseProps as InputFieldBaseProps$1 } from 'WebCore/InputFieldBase';
15
- import { PopupState } from 'material-ui-popup-state/hooks';
7
+ import * as _emotion_styled from '@emotion/styled';
8
+ import * as _mui_system from '@mui/system';
9
+ import * as react_jsx_runtime from 'react/jsx-runtime';
16
10
  import { UniqueIdentifier } from '@dnd-kit/core';
17
- import { SubmitHandler } from 'react-hook-form';
18
- import { TextFieldProps as TextFieldProps$2, NumberFieldProps as NumberFieldProps$1, TextareaProps as TextareaProps$1, SelectProps as SelectProps$2, CheckboxProps as CheckboxProps$2, CheckboxGroupProps as CheckboxGroupProps$1, SwitchProps as SwitchProps$2, SliderProps as SliderProps$1, DifferentialProps as DifferentialProps$1, LikertProps as LikertProps$1, RadioGroupProps as RadioGroupProps$1, RankProps as RankProps$1, RichTextFieldProps as RichTextFieldProps$1, StarRatingProps as StarRatingProps$1, HtmlProps as HtmlProps$1, CustomFieldProps as CustomFieldProps$1, InputLabelProps as InputLabelProps$1, InputLabelHelpProps as InputLabelHelpProps$1 } from 'WebCore';
11
+ import { LazyLoadImageProps } from 'react-lazy-load-image-component';
12
+ import { PopupState } from 'material-ui-popup-state/hooks';
19
13
 
20
14
  interface ColorRange$1 {
21
15
  0: string;
@@ -499,6 +493,17 @@ declare const fonts: {
499
493
  };
500
494
  };
501
495
 
496
+ declare const iconSizeMap: Record<string, number>;
497
+ interface IconProps {
498
+ color?: string;
499
+ name: IconName;
500
+ size?: number;
501
+ sx?: SxProps;
502
+ }
503
+ declare const Icon: FunctionComponent<IconProps>;
504
+
505
+ type IconName = 'brand-wordmark' | 'brand-logomark' | 'menu' | 'menu-open' | 'chevron-up' | 'chevron-down' | 'chevron-left' | 'chevron-right' | 'arrow-left' | 'arrow-right' | 'search' | 'close' | 'more-horizontal' | 'more-vertical' | 'home' | 'home-filled' | 'settings' | 'controls' | 'help' | 'filter-list' | 'open-in-new' | 'nav-toggle' | 'nav-collapse' | 'nav-expand' | 'play-circle' | 'play-video' | 'email' | 'document' | 'folder' | 'attach-file' | 'photo-add' | 'upload' | 'upload-cloud' | 'time' | 'time-filled' | 'zoom-in' | 'zoom-out' | 'add' | 'remove' | 'test' | 'dashboard' | 'list-view' | 'grid-view' | 'grid-view-filled' | 'eye' | 'eye-off' | 'notification' | 'pound' | 'euro' | 'dollar' | 'send' | 'comment' | 'chat' | 'error' | 'warning' | 'lightbulb' | 'check-circle' | 'thumb-up' | 'info' | 'info-filled' | 'cancel' | 'compress' | 'expand' | 'unfold' | 'drag-handle' | 'focus' | 'lock' | 'copy' | 'edit' | 'delete' | 'check' | 'star' | 'star-half' | 'star-filled' | 'ai' | 'work' | 'gift' | 'social-medium-single-colour' | 'social-linkedin-single-colour' | 'social-youtube-single-colour' | 'social-linkedin-full-colour' | 'social-google-full-colour' | 'badge-tick' | 'badge-tick-in-circle' | 'badge-cross' | 'badge-cross-in-circle' | 'badge-hyphen' | 'badge-hyphen-in-circle' | 'badge-question' | 'badge-question-in-circle';
506
+
502
507
  interface CustomTheme {
503
508
  palette: {
504
509
  black: string;
@@ -637,9 +642,22 @@ interface CustomTheme {
637
642
  };
638
643
  }
639
644
 
640
- interface AuthContainerSurfaceProps extends SurfaceProps$1 {
645
+ type SurfaceVariation = 'default' | 'sunken' | 'raised' | 'overlay';
646
+ type BorderRadius = 'xs' | 'sm' | 'md' | 'lg' | 'xl';
647
+
648
+ interface SurfaceProps extends PropsWithChildren {
649
+ variation?: SurfaceVariation;
650
+ borderradius?: BorderRadius;
651
+ sx?: SxProps<Theme>;
652
+ ref?: PaperProps['ref'];
653
+ component?: PaperProps['component'];
654
+ }
655
+ declare const Surface: FC<SurfaceProps>;
656
+
657
+ interface AuthContainerSurfaceProps extends SurfaceProps {
641
658
  headContent?: ReactNode;
642
659
  sx?: SxProps<Theme>;
660
+ children: ReactNode;
643
661
  }
644
662
  declare const AuthContainerSurface: FunctionComponent<AuthContainerSurfaceProps>;
645
663
 
@@ -661,7 +679,7 @@ interface MenuItemProps {
661
679
  danger?: boolean;
662
680
  fullWidth?: boolean;
663
681
  href?: string;
664
- icon?: Icons;
682
+ icon?: IconName;
665
683
  label: string;
666
684
  onClick?: () => void;
667
685
  selected?: boolean;
@@ -722,6 +740,40 @@ interface ProjectItemProps extends ProjectItemDataProps, ProjectItemViewType {
722
740
 
723
741
  declare const ProjectItem: FunctionComponent<ProjectItemProps>;
724
742
 
743
+ declare const emailValidation: {
744
+ pattern: {
745
+ value: RegExp;
746
+ message: string;
747
+ };
748
+ };
749
+
750
+ declare const chooseArticle: (word: string) => string;
751
+ declare const defaultInputValidation: (inputName?: string, isRequired?: boolean, maxLength?: number) => {
752
+ required?: string | undefined;
753
+ maxLength: {
754
+ value: number;
755
+ message: string;
756
+ };
757
+ };
758
+ declare const DEFAULT_MAX_INPUT_LENGTH: number;
759
+
760
+ declare const passwordValidation: (min?: number) => {
761
+ minLength: {
762
+ value: number;
763
+ message: string;
764
+ };
765
+ equal: {
766
+ value: string;
767
+ message: string;
768
+ };
769
+ };
770
+
771
+ interface BackgroundOptions {
772
+ texture?: 'none' | 'noise1';
773
+ gradient?: 'tone1' | 'tone2' | 'tone3' | 'tone4';
774
+ }
775
+ declare const backgroundCreator: (theme: Theme, options: BackgroundOptions) => string;
776
+
725
777
  interface AuthFormHeaderProps {
726
778
  logo?: ReactElement | false | undefined;
727
779
  headerText?: string;
@@ -745,7 +797,7 @@ interface AvatarGroupProps extends AvatarGroupProps$1 {
745
797
  }
746
798
  declare const AvatarGroup: FunctionComponent<AvatarGroupProps>;
747
799
 
748
- type ButtonSizing = Exclude<GenericSizeMap$1, 'none'>;
800
+ type ButtonSizing = Exclude<GenericSizeMap, 'none'>;
749
801
 
750
802
  interface ButtonBaseProps extends ButtonProps$1 {
751
803
  loading?: boolean;
@@ -886,6 +938,98 @@ interface FormControlLabelProps {
886
938
  }
887
939
  declare const FormControlLabel: FunctionComponent<FormControlLabelProps>;
888
940
 
941
+ /**
942
+ * Form Generator Core Types
943
+ */
944
+ interface FormGeneratorHandler {
945
+ set: () => void;
946
+ reset: () => void;
947
+ submit: () => void;
948
+ values: () => void;
949
+ valid: () => void;
950
+ errors: () => void;
951
+ triggerFormValidation: () => Promise<unknown>;
952
+ }
953
+ type FormGeneratorProps = FunctionComponent<{
954
+ ref?: any;
955
+ formConfig: FormGeneratorConfig;
956
+ onFormSubmit?: SubmitHandler<any>;
957
+ onFormChange?: (formData: any) => void;
958
+ submitButton?: ReactElement;
959
+ secondaryButton?: ReactElement;
960
+ }>;
961
+ interface FormGeneratorConfig {
962
+ fields: FieldTypes[];
963
+ autoComplete?: 'off';
964
+ mode?: 'onSubmit' | 'onBlur' | 'onChange';
965
+ formId?: string;
966
+ reValidateMode?: 'onSubmit' | 'onBlur' | 'onChange';
967
+ styleOverrides?: {
968
+ sxForm?: SxProps<Theme>;
969
+ sxButtons?: SxProps<Theme>;
970
+ sxStack?: SxProps<Theme>;
971
+ };
972
+ }
973
+ /**
974
+ * Field Types
975
+ */
976
+ type FieldTypes = CheckboxType | CheckboxGroupType | SwitchType | TextareaType | SelectType | TextFieldType | SliderType | DifferentialType | RichTextFieldType | LikertType | RadioGroupType | DragAndDropRankingType | NumberFieldType | StarRatingType | HTMLType | CustomFieldType;
977
+ type TextFieldType = CreateFieldType<'textfield', TextFieldProps, string>;
978
+ type NumberFieldType = CreateFieldType<'numberfield', NumberFieldProps, number>;
979
+ type TextareaType = CreateFieldType<'textarea', TextareaProps, string>;
980
+ type SelectType = CreateFieldType<'select', SelectProps, SelectProps['value']>;
981
+ type CheckboxType = CreateFieldType<'checkbox', CheckboxProps, NonNullable<CheckboxProps['value']>>;
982
+ type CheckboxGroupType = CreateFieldType<'checkboxGroup', CheckboxGroupProps, string[]>;
983
+ type SwitchType = CreateFieldType<'switch', SwitchProps, NonNullable<SwitchProps['checked']>>;
984
+ type SliderType = CreateFieldType<'slider', SliderProps, NonNullable<SliderProps['value']>>;
985
+ type DifferentialType = CreateFieldType<'differential', DifferentialProps, NonNullable<DifferentialProps['value']>>;
986
+ type LikertType = CreateFieldType<'likert', LikertProps, LikertProps['value']>;
987
+ type RadioGroupType = CreateFieldType<'radioGroup', RadioGroupProps, RadioGroupProps['value']>;
988
+ type DragAndDropRankingType = CreateFieldType<'ranking', RankProps, NonNullable<RankProps['value']>>;
989
+ type RichTextFieldType = CreateFieldType<'richTextfield', RichTextFieldProps, RichTextFieldProps['value']>;
990
+ type StarRatingType = CreateFieldType<'starRating', StarRatingProps, NonNullable<StarRatingProps['value']>>;
991
+ type HTMLType = {
992
+ fieldType: 'html';
993
+ content: HtmlProps['children'];
994
+ defaultValue?: never;
995
+ } & BaseField;
996
+ type CustomFieldType = {
997
+ fieldType: 'customfield';
998
+ defaultValue?: CustomFieldProps['value'];
999
+ } & BaseField & CustomFieldProps;
1000
+ /**
1001
+ * Field Type Utilities
1002
+ */
1003
+ interface BaseField {
1004
+ name: string;
1005
+ ref?: any;
1006
+ multiline?: boolean;
1007
+ content?: ReactElement;
1008
+ label?: string;
1009
+ labelProps?: InputLabelProps;
1010
+ helperText?: string;
1011
+ hidden?: boolean;
1012
+ type?: string;
1013
+ helpTextProps?: InputLabelHelpProps;
1014
+ validation?: any;
1015
+ valueTransformer?: (valueToTransform: string) => string;
1016
+ disabled?: boolean;
1017
+ strengthIndicator?: boolean;
1018
+ styleOverrides?: {
1019
+ sxInputWrapper?: SxProps<Theme>;
1020
+ sxInputBase?: SxProps<Theme>;
1021
+ sxInputStack?: SxProps<Theme>;
1022
+ };
1023
+ }
1024
+ type CreateFieldType<TFieldType extends string, TProps, TDefaultValue extends any = void> = {
1025
+ fieldType: TFieldType;
1026
+ } & BaseField & Omit<TProps, 'value' | 'defaultValue' | 'onChange' | 'name'> & (TDefaultValue extends void ? unknown : {
1027
+ defaultValue?: TDefaultValue;
1028
+ });
1029
+ type FieldType = FieldTypes['fieldType'];
1030
+
1031
+ declare const FormGenerator: FormGeneratorProps;
1032
+
889
1033
  interface GridOverlayProps {
890
1034
  breakpoint?: Breakpoint;
891
1035
  }
@@ -945,6 +1089,10 @@ interface IconButtonGroupProps extends PropsWithChildren {
945
1089
  }
946
1090
  declare const IconButtonGroup: FunctionComponent<IconButtonGroupProps>;
947
1091
 
1092
+ interface ImageProps extends LazyLoadImageProps {
1093
+ }
1094
+ declare const Image: FunctionComponent<ImageProps>;
1095
+
948
1096
  type InputFieldBaseProps = TextFieldProps$1;
949
1097
  declare const InputFieldBase: _emotion_styled.StyledComponent<{
950
1098
  variant?: _mui_material.TextFieldVariants | undefined;
@@ -1021,9 +1169,9 @@ interface MenuButtonProps {
1021
1169
  danger?: boolean;
1022
1170
  fullWidth?: boolean;
1023
1171
  href?: string;
1024
- icon?: Icons;
1172
+ icon?: IconName;
1025
1173
  label: string;
1026
- navigationSizing: NavigationSizing$1;
1174
+ navigationSizing: NavigationSizing;
1027
1175
  onClick?: () => void;
1028
1176
  sizing?: MenuButtonSizing;
1029
1177
  }
@@ -1033,11 +1181,11 @@ interface NudgeProps extends PropsWithChildren {
1033
1181
  description: string;
1034
1182
  notification?: boolean;
1035
1183
  title: string;
1036
- navigationSizing: NavigationSizing$1;
1184
+ navigationSizing: NavigationSizing;
1037
1185
  }
1038
1186
  declare const Nudge: FunctionComponent<NudgeProps>;
1039
1187
 
1040
- type NumberFieldProps = InputFieldBaseProps$1 & {
1188
+ type NumberFieldProps = InputFieldBaseProps & {
1041
1189
  hideActionButtons?: boolean;
1042
1190
  max?: number;
1043
1191
  min?: number;
@@ -1064,9 +1212,11 @@ declare const Pill: FunctionComponent<PillProps>;
1064
1212
  type BindOn = 'trigger' | 'contextMenu' | 'toggle' | 'hover' | 'focus' | 'doubleClick';
1065
1213
  interface PopperProps {
1066
1214
  popperProps?: Partial<PopperProps$1>;
1067
- clickAwayListenerProps?: Partial<ClickAwayListenerProps>;
1215
+ clickAwayListenerProps?: Partial<Omit<ClickAwayListenerProps, 'onClickAway'> & {
1216
+ onClickAway?: (event: MouseEvent | TouchEvent, state: PopupState) => void;
1217
+ }>;
1068
1218
  transitionFadeProps?: Pick<FadeProps, 'easing' | 'timeout' | 'appear' | 'enter' | 'exit'>;
1069
- surfaceProps?: SurfaceProps$1;
1219
+ surfaceProps?: SurfaceProps;
1070
1220
  bindOn?: BindOn[];
1071
1221
  trigger: (state: PopupState) => ReactNode;
1072
1222
  children: ReactElement;
@@ -1079,7 +1229,7 @@ declare const Portal: FunctionComponent<PortalProps>;
1079
1229
 
1080
1230
  declare const PoweredByWatermarkLogo: () => react_jsx_runtime.JSX.Element;
1081
1231
 
1082
- type ProgressSizing = Exclude<GenericSizeMap$1, 'none'>;
1232
+ type ProgressSizing = Exclude<GenericSizeMap, 'none'>;
1083
1233
  interface ProgressProps {
1084
1234
  sizing?: ProgressSizing;
1085
1235
  }
@@ -1120,6 +1270,41 @@ interface RadioGroupProps {
1120
1270
  }
1121
1271
  declare const RadioGroup: FunctionComponent<RadioGroupProps>;
1122
1272
 
1273
+ type SelectOption = {
1274
+ label: string;
1275
+ value: string;
1276
+ };
1277
+
1278
+ type SelectOnChange = (event: SelectChangeEvent<any>, child: React.ReactNode) => void;
1279
+ type AutocompleteOnChange = (value: string | string[]) => void;
1280
+ type SelectProps = {
1281
+ selections: SelectOption[];
1282
+ autoComplete?: boolean;
1283
+ autoFocus?: boolean;
1284
+ disabled?: boolean;
1285
+ disablePortal?: boolean;
1286
+ error?: boolean;
1287
+ fullWidth?: boolean;
1288
+ id?: string;
1289
+ inputRef?: SelectProps$1['inputRef'];
1290
+ internalChange?: () => void;
1291
+ MenuProps?: SelectProps$1['MenuProps'];
1292
+ multi?: boolean;
1293
+ name: string;
1294
+ onBlur?: SelectProps$1['onBlur'];
1295
+ onChange?: SelectOnChange | AutocompleteOnChange;
1296
+ placeholder?: string | undefined;
1297
+ readOnly?: boolean;
1298
+ ref?: SelectProps$1['ref'];
1299
+ required?: boolean;
1300
+ selectOptionProps?: MenuItemProps$1;
1301
+ sizing?: 'xs' | 'md' | 'lg';
1302
+ sx?: SelectProps$1['sx'];
1303
+ value?: SelectProps$1['value'];
1304
+ renderListItem?: (value: string, label: string) => ReactElement;
1305
+ };
1306
+ declare const Select: FunctionComponent<SelectProps>;
1307
+
1123
1308
  interface Option {
1124
1309
  label: string;
1125
1310
  value: string;
@@ -1173,41 +1358,6 @@ type RichTextFieldProps = Omit<InputFieldBaseProps, 'value' | 'onChange'> & {
1173
1358
  };
1174
1359
  declare const RichTextField: FunctionComponent<RichTextFieldProps>;
1175
1360
 
1176
- type SelectOption = {
1177
- label: string;
1178
- value: string;
1179
- };
1180
-
1181
- type SelectOnChange = (event: SelectChangeEvent<any>, child: React.ReactNode) => void;
1182
- type AutocompleteOnChange = (value: string | string[]) => void;
1183
- type SelectProps = {
1184
- selections: SelectOption[];
1185
- autoComplete?: boolean;
1186
- autoFocus?: boolean;
1187
- disabled?: boolean;
1188
- disablePortal?: boolean;
1189
- error?: boolean;
1190
- fullWidth?: boolean;
1191
- id?: string;
1192
- inputRef?: SelectProps$1['inputRef'];
1193
- internalChange?: () => void;
1194
- MenuProps?: SelectProps$1['MenuProps'];
1195
- multi?: boolean;
1196
- name: string;
1197
- onBlur?: SelectProps$1['onBlur'];
1198
- onChange?: SelectOnChange | AutocompleteOnChange;
1199
- placeholder?: string | undefined;
1200
- readOnly?: boolean;
1201
- ref?: SelectProps$1['ref'];
1202
- required?: boolean;
1203
- selectOptionProps?: MenuItemProps$1;
1204
- sizing?: 'xs' | 'md' | 'lg';
1205
- sx?: SelectProps$1['sx'];
1206
- value?: SelectProps$1['value'];
1207
- renderListItem?: (value: string, label: string) => ReactElement;
1208
- };
1209
- declare const Select: FunctionComponent<SelectProps>;
1210
-
1211
1361
  interface SliderProps {
1212
1362
  labelLeft: string;
1213
1363
  labelRight: string;
@@ -1236,18 +1386,6 @@ interface StarRatingProps {
1236
1386
  }
1237
1387
  declare const StarRating: FunctionComponent<StarRatingProps>;
1238
1388
 
1239
- type SurfaceVariation = 'default' | 'sunken' | 'raised' | 'overlay';
1240
- type BorderRadius = 'xs' | 'sm' | 'md' | 'lg' | 'xl';
1241
-
1242
- interface SurfaceProps extends PropsWithChildren {
1243
- variation?: SurfaceVariation;
1244
- borderradius?: BorderRadius;
1245
- sx?: SxProps<Theme>;
1246
- ref?: PaperProps['ref'];
1247
- component?: PaperProps['component'];
1248
- }
1249
- declare const Surface: FC<SurfaceProps>;
1250
-
1251
1389
  interface StyledSwitchProps extends SwitchProps$1 {
1252
1390
  sizing?: 'sm' | 'lg';
1253
1391
  }
@@ -1263,7 +1401,7 @@ interface SwitchProps extends StyledSwitchProps {
1263
1401
  }
1264
1402
  declare const Switch: FunctionComponent<SwitchProps>;
1265
1403
 
1266
- type TextareaProps = InputFieldBaseProps$1 & {
1404
+ type TextareaProps = InputFieldBaseProps & {
1267
1405
  startAdornment?: ReactElement;
1268
1406
  endAdornment?: ReactElement;
1269
1407
  internalChange?: () => void;
@@ -1286,7 +1424,7 @@ interface TextBarDividerProps {
1286
1424
  }
1287
1425
  declare const TextBarDivider: FunctionComponent<TextBarDividerProps>;
1288
1426
 
1289
- type TextFieldProps = InputFieldBaseProps$1 & {
1427
+ type TextFieldProps = InputFieldBaseProps & {
1290
1428
  startAdornment?: ReactElement;
1291
1429
  endAdornment?: ReactElement;
1292
1430
  internalChange?: () => void;
@@ -1319,132 +1457,6 @@ interface MenuItem {
1319
1457
  }
1320
1458
  declare const UserMenu: FunctionComponent<UserMenuProps>;
1321
1459
 
1322
- interface BackgroundOptions {
1323
- texture?: 'none' | 'noise1';
1324
- gradient?: 'tone1' | 'tone2' | 'tone3' | 'tone4';
1325
- }
1326
- declare const backgroundCreator: (theme: Theme, options: BackgroundOptions) => string;
1327
-
1328
- /**
1329
- * Form Generator Core Types
1330
- */
1331
- interface FormGeneratorHandler {
1332
- set: () => void;
1333
- reset: () => void;
1334
- submit: () => void;
1335
- values: () => void;
1336
- valid: () => void;
1337
- errors: () => void;
1338
- triggerFormValidation: () => Promise<unknown>;
1339
- }
1340
- type FormGeneratorProps = FunctionComponent<{
1341
- ref?: any;
1342
- formConfig: FormGeneratorConfig;
1343
- onFormSubmit?: SubmitHandler<any>;
1344
- onFormChange?: (formData: any) => void;
1345
- submitButton?: ReactElement;
1346
- secondaryButton?: ReactElement;
1347
- }>;
1348
- interface FormGeneratorConfig {
1349
- fields: FieldTypes[];
1350
- autoComplete?: 'off';
1351
- mode?: 'onSubmit' | 'onBlur' | 'onChange';
1352
- formId?: string;
1353
- reValidateMode?: 'onSubmit' | 'onBlur' | 'onChange';
1354
- styleOverrides?: {
1355
- sxForm?: SxProps<Theme>;
1356
- sxButtons?: SxProps<Theme>;
1357
- sxStack?: SxProps<Theme>;
1358
- };
1359
- }
1360
- /**
1361
- * Field Types
1362
- */
1363
- type FieldTypes = CheckboxType | CheckboxGroupType | SwitchType | TextareaType | SelectType | TextFieldType | SliderType | DifferentialType | RichTextFieldType | LikertType | RadioGroupType | DragAndDropRankingType | NumberFieldType | StarRatingType | HTMLType | CustomFieldType;
1364
- type TextFieldType = CreateFieldType<'textfield', TextFieldProps$2, string>;
1365
- type NumberFieldType = CreateFieldType<'numberfield', NumberFieldProps$1, number>;
1366
- type TextareaType = CreateFieldType<'textarea', TextareaProps$1, string>;
1367
- type SelectType = CreateFieldType<'select', SelectProps$2, SelectProps$2['value']>;
1368
- type CheckboxType = CreateFieldType<'checkbox', CheckboxProps$2, NonNullable<CheckboxProps$2['value']>>;
1369
- type CheckboxGroupType = CreateFieldType<'checkboxGroup', CheckboxGroupProps$1, string[]>;
1370
- type SwitchType = CreateFieldType<'switch', SwitchProps$2, NonNullable<SwitchProps$2['checked']>>;
1371
- type SliderType = CreateFieldType<'slider', SliderProps$1, NonNullable<SliderProps$1['value']>>;
1372
- type DifferentialType = CreateFieldType<'differential', DifferentialProps$1, NonNullable<DifferentialProps$1['value']>>;
1373
- type LikertType = CreateFieldType<'likert', LikertProps$1, LikertProps$1['value']>;
1374
- type RadioGroupType = CreateFieldType<'radioGroup', RadioGroupProps$1, RadioGroupProps$1['value']>;
1375
- type DragAndDropRankingType = CreateFieldType<'ranking', RankProps$1, NonNullable<RankProps$1['value']>>;
1376
- type RichTextFieldType = CreateFieldType<'richTextfield', RichTextFieldProps$1, RichTextFieldProps$1['value']>;
1377
- type StarRatingType = CreateFieldType<'starRating', StarRatingProps$1, NonNullable<StarRatingProps$1['value']>>;
1378
- type HTMLType = {
1379
- fieldType: 'html';
1380
- content: HtmlProps$1['children'];
1381
- defaultValue?: never;
1382
- } & BaseField;
1383
- type CustomFieldType = {
1384
- fieldType: 'customfield';
1385
- defaultValue?: CustomFieldProps$1['value'];
1386
- } & BaseField & CustomFieldProps$1;
1387
- /**
1388
- * Field Type Utilities
1389
- */
1390
- interface BaseField {
1391
- name: string;
1392
- ref?: any;
1393
- multiline?: boolean;
1394
- content?: ReactElement;
1395
- label?: string;
1396
- labelProps?: InputLabelProps$1;
1397
- helperText?: string;
1398
- hidden?: boolean;
1399
- type?: string;
1400
- helpTextProps?: InputLabelHelpProps$1;
1401
- validation?: any;
1402
- valueTransformer?: (valueToTransform: string) => string;
1403
- disabled?: boolean;
1404
- strengthIndicator?: boolean;
1405
- styleOverrides?: {
1406
- sxInputWrapper?: SxProps<Theme>;
1407
- sxInputBase?: SxProps<Theme>;
1408
- sxInputStack?: SxProps<Theme>;
1409
- };
1410
- }
1411
- type CreateFieldType<TFieldType extends string, TProps, TDefaultValue extends any = void> = {
1412
- fieldType: TFieldType;
1413
- } & BaseField & Omit<TProps, 'value' | 'defaultValue' | 'onChange' | 'name'> & (TDefaultValue extends void ? unknown : {
1414
- defaultValue?: TDefaultValue;
1415
- });
1416
- type FieldType = FieldTypes['fieldType'];
1417
-
1418
- declare const FormGenerator: FormGeneratorProps;
1419
-
1420
- declare const emailValidation: {
1421
- pattern: {
1422
- value: RegExp;
1423
- message: string;
1424
- };
1425
- };
1426
-
1427
- declare const chooseArticle: (word: string) => string;
1428
- declare const defaultInputValidation: (inputName?: string, isRequired?: boolean, maxLength?: number) => {
1429
- required?: string | undefined;
1430
- maxLength: {
1431
- value: number;
1432
- message: string;
1433
- };
1434
- };
1435
- declare const DEFAULT_MAX_INPUT_LENGTH: number;
1436
-
1437
- declare const passwordValidation: (min?: number) => {
1438
- minLength: {
1439
- value: number;
1440
- message: string;
1441
- };
1442
- equal: {
1443
- value: string;
1444
- message: string;
1445
- };
1446
- };
1447
-
1448
1460
  type ScreenSize = 'sm' | 'lg';
1449
1461
 
1450
1462
  interface Props extends PropsWithChildren {
@@ -1659,4 +1671,4 @@ declare module '@mui/system' {
1659
1671
  }
1660
1672
  }
1661
1673
 
1662
- export { AuthContainerSurface, AuthFormHeader, type AuthFormHeaderProps, Avatar, AvatarGroup, type AvatarGroupProps, type AvatarProps, Button, type ButtonProps, CheckboxGroup as CheckBoxGroup, Checkbox, type CheckboxGroupProps, type CheckboxProps, ColorBackgroundContainer, type ColorBackgroundContainerProps, type ColorRange$1 as ColorRange, type ColorRangeAlpha$1 as ColorRangeAlpha, CustomField, type CustomFieldProps, DEFAULT_MAX_INPUT_LENGTH, Differential, type DifferentialProps, DropdownMenu, type FieldType, type FieldTypes, FontWeight, FormControlLabel, FormGenerator, type FormGeneratorConfig, type FormGeneratorHandler, type GenericSizeMap, GridOverlay, type GridOverlayProps, Html, type HtmlProps, IconButton, IconButtonGroup, type IconButtonProps, InputFieldBase, type InputFieldBaseProps, InputLabel, InputLabelHelp, type InputLabelHelpProps, type InputLabelProps, Likert, type LikertProps, Link, type LinkProps, Loader, type LoaderProps, Logo, Markdown, MenuButton, type MenuButtonProps, Navigation, type NavigationProps, type NavigationSizing, Nudge, type NudgeProps, NumberField, type NumberFieldProps, Pill, type PillProps, Popper, type PopperProps, Portal, type PortalProps, PoweredByWatermarkLogo, Progress, type ProgressProps, ProjectItem, type ProjectItemProps, Radio, RadioGroup, type RadioGroupProps, type RadioProps, Rank, type RankProps, RichTextField, type RichTextFieldProps, Select, type SelectProps, type SemanticColor, Slider, type SliderProps, SortableList, type SortableListProps, StarRating, type StarRatingProps, Surface, type SurfaceProps, Switch, type SwitchProps, Textarea as TextArea, TextBarDivider, type TextBarDividerProps, TextField, type TextFieldProps, type TextareaProps, ThemeProvider, Toast, type ToastProps, Tooltip, type TooltipProps, Typography, type TypographyProps, UserMenu, type UserMenuProps, backgroundCreator, base, blue, blueRamp, boxShadow, breakpoints, chooseArticle, darkNeutral, darkNeutralAlpha, defaultInputValidation, easing, elevation, elevationFilter, emailValidation, fonts, generateRamp, green, greenRamp, margin, neutral, neutralAlpha, neutralRamp, padding, passwordValidation, peach, peachRamp, purple, purpleRamp, radius, red, redRamp, semantic, space, useDropdownMenu, yellow, yellowRamp };
1674
+ export { AuthContainerSurface, AuthFormHeader, type AuthFormHeaderProps, Avatar, AvatarGroup, type AvatarGroupProps, type AvatarProps, Button, type ButtonProps, Checkbox, CheckboxGroup, type CheckboxGroupProps, type CheckboxProps, ColorBackgroundContainer, type ColorBackgroundContainerProps, type ColorRange$1 as ColorRange, type ColorRangeAlpha$1 as ColorRangeAlpha, CustomField, type CustomFieldProps, DEFAULT_MAX_INPUT_LENGTH, Differential, type DifferentialProps, DropdownMenu, type FieldType, type FieldTypes, FontWeight, FormControlLabel, FormGenerator, type FormGeneratorConfig, type FormGeneratorHandler, type GenericSizeMap, GridOverlay, type GridOverlayProps, Html, type HtmlProps, Icon, IconButton, IconButtonGroup, type IconButtonProps, type IconName, Image, type ImageProps, InputFieldBase, type InputFieldBaseProps, InputLabel, InputLabelHelp, type InputLabelHelpProps, type InputLabelProps, Likert, type LikertProps, Link, type LinkProps, Loader, type LoaderProps, Logo, Markdown, MenuButton, type MenuButtonProps, Navigation, type NavigationProps, type NavigationSizing, Nudge, type NudgeProps, NumberField, type NumberFieldProps, Pill, type PillProps, Popper, type PopperProps, Portal, type PortalProps, PoweredByWatermarkLogo, Progress, type ProgressProps, ProjectItem, type ProjectItemProps, Radio, RadioGroup, type RadioGroupProps, type RadioProps, Rank, type RankProps, RichTextField, type RichTextFieldProps, Select, type SelectProps, type SemanticColor, Slider, type SliderProps, SortableList, type SortableListProps, StarRating, type StarRatingProps, Surface, type SurfaceProps, Switch, type SwitchProps, TextBarDivider, type TextBarDividerProps, TextField, type TextFieldProps, Textarea, type TextareaProps, ThemeProvider, Toast, type ToastProps, Tooltip, type TooltipProps, Typography, type TypographyProps, UserMenu, type UserMenuProps, backgroundCreator, base, blue, blueRamp, boxShadow, breakpoints, chooseArticle, darkNeutral, darkNeutralAlpha, defaultInputValidation, easing, elevation, elevationFilter, emailValidation, fonts, generateRamp, green, greenRamp, iconSizeMap, margin, neutral, neutralAlpha, neutralRamp, padding, passwordValidation, peach, peachRamp, purple, purpleRamp, radius, red, redRamp, semantic, space, useDropdownMenu, yellow, yellowRamp };