@zealicsolutions/web-ui 0.3.7 → 0.3.9

Sign up to get free protection for your applications and to get access to all the features.
Files changed (40) hide show
  1. package/dist/cjs/index.css +246 -246
  2. package/dist/cjs/index.js +26 -26
  3. package/dist/cjs/index.js.map +1 -1
  4. package/dist/cjs/src/containers/MoleculeItem.d.ts +1 -0
  5. package/dist/cjs/src/containers/mock-data.d.ts +1 -0
  6. package/dist/cjs/src/containers/types/moleculeTypes.d.ts +56 -2
  7. package/dist/cjs/src/containers/types/types.d.ts +7 -4
  8. package/dist/cjs/src/contexts/ButtonActionsContext/ButtonActionsContext.d.ts +11 -0
  9. package/dist/cjs/src/contexts/ButtonActionsContext/ButtonActionsContextProvider.d.ts +11 -0
  10. package/dist/cjs/src/contexts/hooks/useButtonActionsContext.d.ts +1 -0
  11. package/dist/cjs/src/contexts/index.d.ts +3 -0
  12. package/dist/cjs/src/molecules/Button/Button.d.ts +1 -2
  13. package/dist/cjs/src/molecules/CheckboxField/CheckboxField.stories.d.ts +1 -18
  14. package/dist/cjs/src/molecules/InputField/InputField.stories.d.ts +1 -18
  15. package/dist/cjs/src/molecules/RadioButtonField/RadioButtonField.stories.d.ts +1 -18
  16. package/dist/cjs/src/molecules/SelectField/SelectField.stories.d.ts +1 -18
  17. package/dist/cjs/src/molecules/ZealUIModal/ZealUIModal.d.ts +13 -0
  18. package/dist/cjs/src/molecules/index.d.ts +1 -0
  19. package/dist/cjs/src/typescript.d.ts +3 -0
  20. package/dist/esm/index.css +246 -246
  21. package/dist/esm/index.js +12 -12
  22. package/dist/esm/index.js.map +1 -1
  23. package/dist/esm/src/containers/MoleculeItem.d.ts +1 -0
  24. package/dist/esm/src/containers/mock-data.d.ts +1 -0
  25. package/dist/esm/src/containers/types/moleculeTypes.d.ts +56 -2
  26. package/dist/esm/src/containers/types/types.d.ts +7 -4
  27. package/dist/esm/src/contexts/ButtonActionsContext/ButtonActionsContext.d.ts +11 -0
  28. package/dist/esm/src/contexts/ButtonActionsContext/ButtonActionsContextProvider.d.ts +11 -0
  29. package/dist/esm/src/contexts/hooks/useButtonActionsContext.d.ts +1 -0
  30. package/dist/esm/src/contexts/index.d.ts +3 -0
  31. package/dist/esm/src/molecules/Button/Button.d.ts +1 -2
  32. package/dist/esm/src/molecules/CheckboxField/CheckboxField.stories.d.ts +1 -18
  33. package/dist/esm/src/molecules/InputField/InputField.stories.d.ts +1 -18
  34. package/dist/esm/src/molecules/RadioButtonField/RadioButtonField.stories.d.ts +1 -18
  35. package/dist/esm/src/molecules/SelectField/SelectField.stories.d.ts +1 -18
  36. package/dist/esm/src/molecules/ZealUIModal/ZealUIModal.d.ts +13 -0
  37. package/dist/esm/src/molecules/index.d.ts +1 -0
  38. package/dist/esm/src/typescript.d.ts +3 -0
  39. package/dist/index.d.ts +140 -48
  40. package/package.json +1 -1
package/dist/index.d.ts CHANGED
@@ -1,11 +1,11 @@
1
1
  /// <reference types="react" />
2
2
  import * as React$1 from 'react';
3
- import React__default, { PropsWithChildren, ReactNode, Dispatch, SetStateAction, CSSProperties as CSSProperties$1, ComponentType } from 'react';
3
+ import React__default, { PropsWithChildren, ReactNode, Dispatch, SetStateAction, CSSProperties as CSSProperties$1, ComponentType, KeyboardEvent } from 'react';
4
4
  import * as styled_components from 'styled-components';
5
- import { CSSProperties, DefaultTheme } from 'styled-components';
5
+ import { CSSProperties, DefaultTheme, ThemedCssFunction } from 'styled-components';
6
6
  import { ThemeColors as ThemeColors$1, SizesTypes as SizesTypes$1, FontSizesTypes as FontSizesTypes$2 } from 'theme';
7
7
  import * as typescript from 'typescript';
8
- import { StylesType, Callback as Callback$1, OverrideStyles, StyledTransientProps, Nullable, StrictUnion } from 'typescript';
8
+ import { StylesType as StylesType$1, Callback as Callback$1, OverrideStyles as OverrideStyles$1, StyledTransientProps, Nullable, AnyObject, StrictUnion } from 'typescript';
9
9
  import { RefCallBack, Control as Control$1, ControllerProps as ControllerProps$1 } from 'react-hook-form/dist/types';
10
10
  import { IconNames as IconNames$1 } from 'atoms/Icon/Icon';
11
11
  import { InputFieldTypes as InputFieldTypes$1, FieldTypes as FieldTypes$1, UIFields as UIFields$2 } from 'fieldsConfiguration/types';
@@ -16,7 +16,7 @@ import { WithGoogleMapProps } from 'react-google-maps/lib/withGoogleMap';
16
16
  import { WithScriptjsProps } from 'react-google-maps/lib/withScriptjs';
17
17
  import * as atoms from 'atoms';
18
18
  import { TextProps as TextProps$1, IconNames as IconNames$2, TouchableOpacityProps as TouchableOpacityProps$1, AvatarProps as AvatarProps$1, TabProps as TabProps$1, RadioButtonsProps as RadioButtonsProps$1, SelectOption as SelectOption$1, InputProps as InputProps$1, SelectProps as SelectProps$1, RegularImageProps as RegularImageProps$1, TextButtonProps as TextButtonProps$1, TabTheme as TabTheme$1, RadioButtonInternalConfigProps as RadioButtonInternalConfigProps$1, HorizontalButtonsProps as HorizontalButtonsProps$1, IconProps as IconProps$1 } from 'atoms';
19
- import { RadioGroup, DrawerProps as DrawerProps$1 } from '@mui/material';
19
+ import { RadioGroup, DrawerProps as DrawerProps$1, ModalProps } from '@mui/material';
20
20
  import { UIFields as UIFields$1, UIField as UIField$1 } from 'fieldsConfiguration';
21
21
  import { MaxRuleValidation, MinRuleValidation, SetPasswordFields } from 'organisms/SetPasswordForm/types';
22
22
  import { ConsentProps as ConsentProps$1, FilteredFeedContentType as FilteredFeedContentType$1, HeroSliderProps as HeroSliderProps$1, ProcessTrackerProps as ProcessTrackerProps$1, ProcessTrackerStatus as ProcessTrackerStatus$1 } from 'organisms';
@@ -36,9 +36,10 @@ import { AlertProps as AlertProps$2 } from 'molecules/Alert/Alert';
36
36
  import { LoginFields as LoginFields$1 } from 'organisms/LoginForm/types';
37
37
  import { AnnotationsList as AnnotationsList$1 } from 'contexts/MlrRichTextViewerContext/types';
38
38
  import * as contexts_MlrRichTextViewerContext_MlrRichTextViewerContext from 'contexts/MlrRichTextViewerContext/MlrRichTextViewerContext';
39
+ import * as contexts_ButtonActionsContext_ButtonActionsContext from 'contexts/ButtonActionsContext/ButtonActionsContext';
40
+ import { ContainerComponentProps as ContainerComponentProps$1, ContainerProps as ContainerProps$1, Molecule as Molecule$1 } from 'containers';
39
41
  export * from 'helpers/constants';
40
42
  import { CheckboxInternalConfigProps as CheckboxInternalConfigProps$1 } from 'atoms/Checkbox/types';
41
- import { ContainerProps as ContainerProps$1, ContainerComponentProps as ContainerComponentProps$1, Molecule as Molecule$1 } from 'containers';
42
43
  import * as containers_types_types from 'containers/types/types';
43
44
  import { ContainerProps as ContainerProps$2 } from 'containers/types/types';
44
45
 
@@ -60,8 +61,8 @@ declare type CheckboxInternalConfigProps = Partial<{
60
61
  selectedCheckboxIconColor: ThemeColors$1 | string;
61
62
  buttonPadding: number;
62
63
  textPadding: number;
63
- styles: StylesType;
64
- wrapperStyles: StylesType;
64
+ styles: StylesType$1;
65
+ wrapperStyles: StylesType$1;
65
66
  buttonOptionSpacing?: SizesTypes$1;
66
67
  }>;
67
68
 
@@ -90,8 +91,8 @@ declare type SelectInternalConfigurationOptions = {
90
91
  selectedTextFontSize: number;
91
92
  verticalPadding: number;
92
93
  horizontalPadding: number;
93
- wrapperStyles: StylesType;
94
- styles: StylesType;
94
+ wrapperStyles: StylesType$1;
95
+ styles: StylesType$1;
95
96
  };
96
97
  declare type SelectProps = Partial<{
97
98
  ref: RefCallBack;
@@ -116,8 +117,8 @@ declare type InputFieldInternalConfigProps = Partial<{
116
117
  placeholderTextFontSize: number;
117
118
  verticalPadding: number;
118
119
  horizontalPadding: number;
119
- styles: StylesType;
120
- wrapperStyles: StylesType;
120
+ styles: StylesType$1;
121
+ wrapperStyles: StylesType$1;
121
122
  }>;
122
123
  declare type InputIconProps = {
123
124
  name: IconNames$1;
@@ -147,7 +148,7 @@ declare type TextProps = {
147
148
  variant: FontSizesTypes$1;
148
149
  layout?: 'div' | 'span';
149
150
  type?: TextTypes;
150
- styles?: StylesType;
151
+ styles?: StylesType$1;
151
152
  color?: ThemeColors$2 | string;
152
153
  numberOfLines?: number;
153
154
  textAlign?: TextAlign;
@@ -216,7 +217,7 @@ declare type RegularImageProps = {
216
217
  height: number | string;
217
218
  onClick: Callback$1;
218
219
  cornerRadius: number;
219
- }> & OverrideStyles;
220
+ }> & OverrideStyles$1;
220
221
  declare const RegularImage: styled_components.StyledComponent<"img", styled_components.DefaultTheme, {
221
222
  src: string;
222
223
  } & Partial<{
@@ -225,7 +226,7 @@ declare const RegularImage: styled_components.StyledComponent<"img", styled_comp
225
226
  height: number | string;
226
227
  onClick: Callback$1;
227
228
  cornerRadius: number;
228
- }> & OverrideStyles, never>;
229
+ }> & OverrideStyles$1, never>;
229
230
  declare const BackgroundImage: styled_components.StyledComponent<"img", styled_components.DefaultTheme, {
230
231
  src: string;
231
232
  } & Partial<{
@@ -234,7 +235,7 @@ declare const BackgroundImage: styled_components.StyledComponent<"img", styled_c
234
235
  height: number | string;
235
236
  onClick: Callback$1;
236
237
  cornerRadius: number;
237
- }> & OverrideStyles, never>;
238
+ }> & OverrideStyles$1, never>;
238
239
 
239
240
  declare type TextButtonProps = Pick<BaseButtonProps$1, 'disabled' | 'onClick' | 'children' | 'colorTheme' | 'size'> & {
240
241
  buttonLink?: string;
@@ -253,9 +254,9 @@ declare type ValidationTagProps = {
253
254
  declare const ValidationTag: ({ text, status }: ValidationTagProps) => JSX.Element;
254
255
 
255
256
  declare type TooltipProps = Pick<TooltipProps$1, 'overlay' | 'placement' | 'trigger' | 'visible' | 'children'> & {
256
- styles?: StylesType;
257
+ styles?: StylesType$1;
257
258
  };
258
- declare const StyleWrapper: styled_components.StyledComponent<"div", styled_components.DefaultTheme, OverrideStyles, never>;
259
+ declare const StyleWrapper: styled_components.StyledComponent<"div", styled_components.DefaultTheme, OverrideStyles$1, never>;
259
260
  declare const Tooltip: ({ trigger, placement, styles, ...props }: TooltipProps) => JSX.Element;
260
261
 
261
262
  declare type ToastType = 'success' | 'infoTierOne' | 'infoTierTwo' | 'warning' | 'error';
@@ -332,7 +333,7 @@ declare type RichTextEditorProps = Partial<{
332
333
  value: string;
333
334
  font: FontSizesTypes$2;
334
335
  color: ThemeColors$1 | string;
335
- textStyles: StylesType;
336
+ textStyles: StylesType$1;
336
337
  numberOfLines?: number;
337
338
  extraTextProps?: TextProps$1;
338
339
  }>;
@@ -343,10 +344,10 @@ declare type RadioButtonInternalConfigProps = Partial<{
343
344
  selectedRadioOptionIndicatorColor: ThemeColors$1 | string;
344
345
  buttonPadding: number;
345
346
  textPadding: number;
346
- styles: StylesType;
347
- wrapperStyles: StylesType;
347
+ styles: StylesType$1;
348
+ wrapperStyles: StylesType$1;
348
349
  buttonOptionSpacing: SizesTypes$1;
349
- radioGroupWrapperStyles: StylesType;
350
+ radioGroupWrapperStyles: StylesType$1;
350
351
  }>;
351
352
  declare type RadioButtonsProps<T extends string> = Partial<{
352
353
  ref: RefCallBack;
@@ -387,7 +388,7 @@ declare const RadioButtons: <T extends string>({ ref, name, value, options, onBl
387
388
  }>) => JSX.Element;
388
389
  declare const RadioGroupWrapper: styled_components.StyledComponent<typeof RadioGroup, styled_components.DefaultTheme, StyledTransientProps<{
389
390
  isRow: boolean;
390
- }> & OverrideStyles, never>;
391
+ }> & OverrideStyles$1, never>;
391
392
 
392
393
  declare type CircleType = 'link' | 'message';
393
394
  declare type CircleBoxProps = {
@@ -441,7 +442,7 @@ declare type TabProps<T = string, K = string> = {
441
442
  defaultTabTextColor: ThemeColors$1 | string;
442
443
  selectedTabTextColor: ThemeColors$1 | string;
443
444
  selectedTabIndicatorColor: ThemeColors$1 | string;
444
- styles: StylesType;
445
+ styles: StylesType$1;
445
446
  }>;
446
447
  declare const ZealTab: <T extends string, K extends string>({ options, onClick, text, tabKey, vertical, onOptionClick, tabTheme, tabFont, tabPadding, selectedTabIndicatorColor, textSize, defaultTabTextColor, ...tabProps }: TabProps<T, K>, ref: React__default.ForwardedRef<TabElement>) => JSX.Element;
447
448
  declare const Tab: <T, K>(props: {
@@ -563,7 +564,7 @@ declare type FeedContentProps = {
563
564
  showDefaultDocumentStyles?: boolean;
564
565
  destinationLink?: string;
565
566
  onDestinationHandler?: Callback$1;
566
- imageStyles?: StylesType;
567
+ imageStyles?: StylesType$1;
567
568
  videoStyles?: CSSProperties;
568
569
  isEnabledFavoriting?: boolean;
569
570
  isFavorite?: boolean;
@@ -888,6 +889,28 @@ declare type AnnotationsList = {
888
889
 
889
890
  declare const useMlrRichTextViewerContext: () => contexts_MlrRichTextViewerContext_MlrRichTextViewerContext.MlrRichTextViewerContextType;
890
891
 
892
+ declare const useButtonActionsContext: () => contexts_ButtonActionsContext_ButtonActionsContext.ButtonActionsContextType;
893
+
894
+ declare type ButtonActionsContextType = {
895
+ actionContent?: ContainerComponentProps$1;
896
+ setActionContent: Dispatch<SetStateAction<ContainerComponentProps$1>>;
897
+ isModalVisible: boolean;
898
+ setModalVisible: Dispatch<SetStateAction<boolean>>;
899
+ isDrawerVisible: boolean;
900
+ setDrawerVisible: Dispatch<SetStateAction<boolean>>;
901
+ };
902
+ declare const ButtonActionsContext: React$1.Context<ButtonActionsContextType>;
903
+
904
+ declare type ButtonActionsProviderProps = PropsWithChildren<Partial<{
905
+ actionContent: ContainerComponentProps$1;
906
+ setActionContent: Dispatch<SetStateAction<ContainerComponentProps$1>>;
907
+ isModalVisible: boolean;
908
+ setModalVisible: Dispatch<SetStateAction<boolean>>;
909
+ setDrawerVisible: Dispatch<SetStateAction<boolean>>;
910
+ isDrawerVisible: boolean;
911
+ }>>;
912
+ declare const ButtonActionsProvider: ({ children }: ButtonActionsProviderProps) => JSX.Element;
913
+
891
914
  declare type FieldRuleLabelTypes = 'OPTIONAL' | 'REQUIRED';
892
915
  declare type LabelInternalConfig = {
893
916
  fontVariant: FontSizesTypes$2;
@@ -895,15 +918,15 @@ declare type LabelInternalConfig = {
895
918
  fontWeight: string | number;
896
919
  color: ThemeColors$1 | string;
897
920
  padding: string;
898
- styles: StylesType;
899
- wrapperStyles: StylesType;
921
+ styles: StylesType$1;
922
+ wrapperStyles: StylesType$1;
900
923
  };
901
924
  declare type RuleLabelInternalConfig = {
902
925
  requiredTextColor: ThemeColors$1 | string;
903
926
  optionalTextColor: ThemeColors$1 | string;
904
927
  padding: string;
905
928
  fontSize: number;
906
- styles: StylesType;
929
+ styles: StylesType$1;
907
930
  };
908
931
  declare type TooltipInternalConfig = {
909
932
  fontVariant: FontSizesTypes$2;
@@ -913,8 +936,8 @@ declare type TooltipInternalConfig = {
913
936
  padding: string;
914
937
  backgroundColor: ThemeColors$1 | string;
915
938
  iconColor: ThemeColors$1 | string;
916
- styles: StylesType;
917
- wrapperStyles: StylesType;
939
+ styles: StylesType$1;
940
+ wrapperStyles: StylesType$1;
918
941
  };
919
942
  declare type FieldLabelsProps = {
920
943
  label?: string;
@@ -937,7 +960,7 @@ declare type InputFieldProps = Partial<{
937
960
  optional: boolean;
938
961
  defaultValue: string;
939
962
  inputProps: InputProps$1;
940
- styles: StylesType;
963
+ styles: StylesType$1;
941
964
  labelsProps: FieldLabelsProps;
942
965
  }>;
943
966
  declare const InputField: ({ control, name, inputProps, styles, labelsProps, defaultValue, optional, required, rules, }: InputFieldProps) => JSX.Element;
@@ -949,13 +972,13 @@ declare type FieldMapperProps<T extends object> = {
949
972
  spacer?: number;
950
973
  isTooltipVisible?: boolean;
951
974
  optionsPresentation?: boolean;
952
- styles?: StylesType;
975
+ styles?: StylesType$1;
953
976
  };
954
977
  declare const FieldMapper: <T extends object>({ field, isEditMode, spacer, control, isTooltipVisible, optionsPresentation, styles, }: FieldMapperProps<T>) => JSX.Element | null;
955
978
 
956
979
  declare type CheckboxesProps = Partial<{
957
- checkboxGroupWrapperStyles: StylesType;
958
- checkboxFieldWrapperStyles: StylesType;
980
+ checkboxGroupWrapperStyles: StylesType$1;
981
+ checkboxFieldWrapperStyles: StylesType$1;
959
982
  onChange: (id: string) => void;
960
983
  disabled: boolean;
961
984
  options?: SelectOption$1[];
@@ -973,7 +996,7 @@ declare type CheckboxFieldProps = Partial<{
973
996
  control: Control$1<any>;
974
997
  required: boolean;
975
998
  optional: boolean;
976
- wrapperStyles: StylesType;
999
+ wrapperStyles: StylesType$1;
977
1000
  }>;
978
1001
  declare const CheckboxField: ({ checkboxesProps, name, rules, control, optional, required, labelsProps, wrapperStyles, }: CheckboxFieldProps) => JSX.Element;
979
1002
 
@@ -994,7 +1017,7 @@ declare type SelectFieldProps = Partial<{
994
1017
  required: boolean;
995
1018
  optional: boolean;
996
1019
  defaultValue: string;
997
- styles: StylesType;
1020
+ styles: StylesType$1;
998
1021
  }>;
999
1022
  declare const SelectField: ({ selectProps, name, defaultValue, optional, required, control, styles, labelsProps, rules, }: SelectFieldProps) => JSX.Element;
1000
1023
 
@@ -1089,7 +1112,7 @@ declare const AvatarDropdown: <T extends string | number>({ avatarProps, menuCon
1089
1112
 
1090
1113
  declare type TabType<T = string, K = string> = Pick<TabProps$1<T, K>, 'text' | 'tabKey' | 'disabled' | 'options' | 'divider'>;
1091
1114
  declare type AdditionalTabContainerProps = {
1092
- containerStyle?: StylesType;
1115
+ containerStyle?: StylesType$1;
1093
1116
  containerProps?: Record<string, unknown>;
1094
1117
  };
1095
1118
  declare type TabGroupProps<T = string, K = string> = {
@@ -1097,7 +1120,7 @@ declare type TabGroupProps<T = string, K = string> = {
1097
1120
  activeTabKey: T;
1098
1121
  onTabChange?: (tabKey: T) => void;
1099
1122
  onOptionClick?: (optionKey: K) => void;
1100
- styles?: StylesType;
1123
+ styles?: StylesType$1;
1101
1124
  vertical?: boolean;
1102
1125
  tabTheme?: TabTheme$1;
1103
1126
  tabFont?: FontSizesTypes$1;
@@ -1138,7 +1161,7 @@ declare const EmphasizedText: ({ textContent, invertColors }: EmphasizedTextProp
1138
1161
  declare type RadioButtonFieldProps<T extends string> = Partial<{
1139
1162
  name: string;
1140
1163
  rules: ControllerProps$1['rules'];
1141
- styles: StylesType;
1164
+ styles: StylesType$1;
1142
1165
  control: Control$1<any>;
1143
1166
  optional: boolean;
1144
1167
  required: boolean;
@@ -1255,6 +1278,10 @@ declare type ToggleFieldProps = {
1255
1278
  };
1256
1279
  declare const HorizontalButtonsField: ({ name, title, control, description, horizontalButtonsProps, }: ToggleFieldProps) => JSX.Element;
1257
1280
 
1281
+ declare type StylesType = ReturnType<ThemedCssFunction<DefaultTheme>>;
1282
+ declare type OverrideStyles = {
1283
+ $styles?: StylesType;
1284
+ };
1258
1285
  declare type Callback = () => void;
1259
1286
 
1260
1287
  declare type BottomNaVBarItemProps = {
@@ -1288,7 +1315,7 @@ declare type ImageProps = {
1288
1315
  height: number;
1289
1316
  cornerRadius: number;
1290
1317
  behaveAs: 'background' | 'regular';
1291
- styles: StylesType;
1318
+ styles: StylesType$1;
1292
1319
  }>;
1293
1320
  declare const Image: ({ src, link, altText, styles, width, height, id, behaveAs, cornerRadius, }: ImageProps) => JSX.Element;
1294
1321
 
@@ -1317,7 +1344,7 @@ declare type TextMoleculeProps = Partial<{
1317
1344
  lineHeight: number;
1318
1345
  fontWeight: string | number;
1319
1346
  isRichText: boolean;
1320
- styles: StylesType;
1347
+ styles: StylesType$1;
1321
1348
  textAlign: 'center' | 'right' | 'left';
1322
1349
  }> & Pick<TextProps$1, 'seoTag' | 'numberOfLines'>;
1323
1350
  declare const TextMolecule: ({ isRichText, variant, text, seoTag, fontVariant, textColor, textSize, fontWeight, lineHeight, letterSpacing, styles, textAlign, ...restOfTextProps }: TextMoleculeProps) => JSX.Element;
@@ -1344,7 +1371,7 @@ declare type BaseButtonProps = PropsWithChildren<{
1344
1371
  inactiveButtonColor?: ThemeColors$1 | string;
1345
1372
  inactiveStrokeColor?: ThemeColors$1 | string;
1346
1373
  inactiveTextColor?: ThemeColors$1 | string;
1347
- styles?: StylesType;
1374
+ styles?: StylesType$1;
1348
1375
  colorTheme?: 'light' | 'dark';
1349
1376
  href?: string;
1350
1377
  type?: ButtonType;
@@ -1356,19 +1383,72 @@ declare type ButtonProps = BaseButtonProps & {
1356
1383
  elementId?: string;
1357
1384
  loading?: boolean;
1358
1385
  isRichText?: boolean;
1359
- containerStyle?: StylesType;
1360
- buttonStyle?: StylesType;
1386
+ containerStyle?: StylesType$1;
1387
+ buttonStyle?: StylesType$1;
1361
1388
  };
1362
1389
  declare const Button: ({ text: textProp, onClick, loading, disabled, variant, isRichText, fullWidth, elementId, link, containerStyle, children, buttonStyle, size, textColor, inactiveTextColor, state, href, ...props }: ButtonProps) => JSX.Element | null;
1363
1390
 
1391
+ declare type ZealUIModalProps = PropsWithChildren<Pick<ModalProps, 'open'>> & {
1392
+ padding?: number | string;
1393
+ wrapperStyles?: CSSProperties;
1394
+ onKeyDown?: <T extends HTMLElement>(event: KeyboardEvent<T>) => void;
1395
+ modalStyles?: CSSProperties;
1396
+ onClose?: Callback;
1397
+ };
1398
+ declare const ZealUIModal: ({ children, wrapperStyles, padding, onKeyDown, modalStyles, onClose, ...rest }: ZealUIModalProps) => JSX.Element;
1399
+ declare const ModalWrapper: styled_components.StyledComponent<"div", styled_components.DefaultTheme, OverrideStyles, never>;
1400
+
1364
1401
  declare const Container: ({ children, wide, compact, type, props }: ContainerProps$1) => JSX.Element;
1365
1402
  declare const ContainerComponent: ({ type, items, config, tabsProps }: ContainerComponentProps$1) => JSX.Element | null;
1366
1403
 
1404
+ declare type ActionTypes = 'link' | 'popup' | 'drawer' | 'download' | 'submit' | 'reset' | 'destroy';
1405
+ declare type FileType = 'image' | 'video' | 'document' | 'audio';
1406
+ declare type ContentStatus = 'in_use' | 'draft';
1407
+ declare type FileMatrixMessageDTO = Readonly<Partial<{
1408
+ id: string;
1409
+ text: string;
1410
+ label: string;
1411
+ locationId: string;
1412
+ }>>;
1413
+ declare type FileObjectDTO = Readonly<Partial<{
1414
+ id: string;
1415
+ name: string;
1416
+ fileType: FileType;
1417
+ description: string;
1418
+ originalName: string;
1419
+ url: string;
1420
+ size: number;
1421
+ type: FileType;
1422
+ updatedAt: string;
1423
+ createdAt: string;
1424
+ status: ContentStatus;
1425
+ tags: FileMatrixMessageDTO[];
1426
+ }>> | null;
1427
+ declare type LinkAction = Omit<LinkAttributes, 'attributeType'>;
1428
+ declare type PopupDrawerAction = ContainerComponentProps;
1429
+ declare type DownloadAction = FileObjectDTO;
1430
+ declare type SubmitAction = AnyObject;
1431
+ declare type CancelAction = AnyObject;
1432
+ declare type ResetAction = AnyObject;
1433
+ declare type DestroyAction = AnyObject;
1434
+ declare type Action = {
1435
+ type: ActionTypes;
1436
+ } & Partial<{
1437
+ link: LinkAction;
1438
+ popup: PopupDrawerAction;
1439
+ drawer: PopupDrawerAction;
1440
+ download: DownloadAction;
1441
+ submit: SubmitAction;
1442
+ cancel: CancelAction;
1443
+ reset: ResetAction;
1444
+ destroy: DestroyAction;
1445
+ }>;
1367
1446
  declare type ImageAttributes = {
1368
1447
  attributeType: 'image';
1369
1448
  imageSource: string;
1370
1449
  };
1371
1450
  interface TextAttributes {
1451
+ id?: string;
1372
1452
  attributeType: 'text';
1373
1453
  isRichText: boolean;
1374
1454
  text: string;
@@ -1377,6 +1457,10 @@ interface VideoAttributes {
1377
1457
  attributeType: 'video';
1378
1458
  videoSource: string;
1379
1459
  }
1460
+ interface ActionAttributes {
1461
+ attributeType: 'action';
1462
+ action: Action;
1463
+ }
1380
1464
  interface LinkAttributes {
1381
1465
  id: string;
1382
1466
  attributeType: 'link';
@@ -1386,6 +1470,7 @@ interface LinkAttributes {
1386
1470
  name: string;
1387
1471
  }
1388
1472
  interface SelectAttributes {
1473
+ id?: string;
1389
1474
  attributeType: 'select';
1390
1475
  value: string;
1391
1476
  options: SelectOption$1[];
@@ -1403,6 +1488,10 @@ interface BaseMolecule {
1403
1488
  id: string;
1404
1489
  instance: 'molecule';
1405
1490
  type: MoleculeTypes;
1491
+ metadata?: AnyObject;
1492
+ idForFrontend?: string;
1493
+ moleculeLibraryId?: string;
1494
+ organismLibraryMoleculeId?: string;
1406
1495
  }
1407
1496
  interface ImageMolecule extends BaseMolecule {
1408
1497
  type: 'image';
@@ -1429,7 +1518,7 @@ interface ButtonMolecule extends BaseMolecule {
1429
1518
  type: 'button';
1430
1519
  attributes: {
1431
1520
  title: TextAttributes;
1432
- buttonLink: LinkAttributes;
1521
+ action: ActionAttributes;
1433
1522
  };
1434
1523
  config: {
1435
1524
  props: Partial<Omit<ButtonProps$1, 'disabled' | 'children' | 'link' | 'text' | 'onClick' | 'elementId'>>;
@@ -1516,13 +1605,13 @@ declare type Molecule = StrictUnion<ImageMolecule | TextMoleculeType | ButtonMol
1516
1605
  };
1517
1606
 
1518
1607
  declare type ContainerType = 'row' | 'column' | 'slider' | 'form';
1519
- declare type ContainerPositionType = 'fixed' | 'sticky' | 'static';
1608
+ declare type ContainerPositionType = 'fixed' | 'sticky' | 'static' | 'relative';
1520
1609
  declare type ContainerScrollBehaviourType = 'vertical' | 'horizontal' | 'auto' | 'none';
1521
1610
  declare type ContainerPropsType = Partial<{
1522
1611
  position: ContainerPositionType;
1523
1612
  scrollBehaviour: ContainerScrollBehaviourType;
1524
1613
  cornerRadius: number;
1525
- styles: StylesType;
1614
+ styles: StylesType$1;
1526
1615
  formProps: {
1527
1616
  mode: keyof ValidationMode;
1528
1617
  };
@@ -1541,13 +1630,16 @@ declare type ContainerComponentProps = {
1541
1630
  id: string;
1542
1631
  instance: 'container';
1543
1632
  type: ContainerType;
1633
+ items: (ContainerComponentProps | Molecule)[];
1544
1634
  config: {
1545
1635
  wide?: AdditionalContainerProps;
1546
1636
  compact?: AdditionalContainerProps;
1547
1637
  props?: ContainerPropsType;
1548
1638
  };
1549
- items: (ContainerComponentProps | Molecule)[];
1550
1639
  tabsProps?: Pick<TabGroupProps$1, 'tabs' | 'activeTabKey' | 'onTabChange'>;
1640
+ metadata?: AnyObject;
1641
+ attributes?: AnyObject;
1642
+ containerLibraryId?: string;
1551
1643
  };
1552
1644
 
1553
1645
  declare const ContainerWrapper: styled_components.StyledComponent<"div", styled_components.DefaultTheme, Pick<ContainerProps$2, "type"> & {
@@ -1567,4 +1659,4 @@ declare const OrganismItem: ({ item, tabsProps, }: {
1567
1659
  tabsProps?: Pick<TabGroupProps$1<string, string>, "tabs" | "activeTabKey" | "onTabChange"> | undefined;
1568
1660
  }) => JSX.Element | null;
1569
1661
 
1570
- export { AcquisitionForm, AcquisitionFormProps, AdditionalContainerProps, AdditionalTabContainerProps, Alert, AlertProps, AnnotationsList, ArrowIconWrapper, AuthMethod, Avatar, AvatarDropdown, AvatarDropdownProps, AvatarProps, BackgroundImage, BaseButtonProps, BaseMolecule, Body, BodyProps, BooleanAttributes, BottomNaVBarItemProps, BottomNavBarItem, BottomNavBarNavigation, BottomNavBarNavigationProps, BreakpointSizesTypes, Button, ButtonMolecule, ButtonProps, ButtonType, ButtonVariant, ButtonsWrapper, COMMUNICATION_LINK_DATA_TEXT, COMMUNICATION_LINK_DATA_URL, COMMUNICATION_LINK_ELEMENT_ID, CaretIconWrapper, Carousel, CarouselProps, Checkbox, CheckboxField, CheckboxFieldMolecule, CheckboxFieldProps, CheckboxGroup, CheckboxGroupProps, CheckboxProps, CheckboxesProps, Circle, CircleBoxProps, CirclesWrapper, CircularIndicator, CircularIndicatorProps, CircularIndicatorStyledComponent, ColumnItem, Columns, ColumnsProps, Consent, ConsentProps, Container, ContainerComponent, ContainerComponentProps, ContainerPositionType, ContainerProps, ContainerPropsType, ContainerScrollBehaviourType, ContainerType, ContainerWrapper, CustomValidation, CustomValidationProps, CustomValidationRule, DefaultTemplate, DefaultTemplateProps, Divider, DividerProps, Drawer, DynamicContentZone, DynamicContentZoneProps, DynamicElementProps, EmphasizedText, EmphasizedTextProps, ErrorText, FeedContent, FeedContentContainer, FeedContentContainerProps, FeedContentHeader, FeedContentHeaderProps, FeedTemplateKeys, FieldLabels, FieldLabelsProps, FieldMapper, FieldMapperProps, FieldRuleLabelTypes, FieldSection, FieldSectionProps, FieldTypes, FilteredFeedContentType, FontSizesTypes, FontWeight, Footer, FooterContactInfo, FooterLink, FooterProps, ForgotPasswordForm, ForgotPasswordFormProps, GoogleMap, GoogleMapProps, Header, HeaderProps, HeroImage, HeroImageAlignment, HeroImageProps, HeroImageTemplate, HeroSlider, HeroSliderProps, HeroSliderWrapper, HorizontalButtons, HorizontalButtonsField, HorizontalButtonsProps, HorizontalPadding, HorizontalPaddingProps, ISI, ISIProps, Icon, IconButton, IconButtonProps, IconNames, IconProps, Image, ImageAttributes, ImageMolecule, ImageProps, Input, InputField, InputFieldInternalConfigProps, InputFieldProps, InputFieldTypes, InputIconProps, InputProps, IterableAttributes, LabelInternalConfig, LinkAttributes, LoginForm, LoginFormProps, MATRIX_MESSAGE_DATA_ID, MATRIX_MESSAGE_ELEMENT_ID, MapPosition, MenuItem, MenuItems, MenuItemsProps, MenuNavigation, MenuNavigationProps, MlrRichTextViewerContext, MlrRichTextViewerContextType, MlrRichTextViewerProvider, MlrRichTextViewerProviderProps, Molecule, MoleculeTypes, NavigationDotsWrapper, OrganismItem, OrientationType, PdfDocument, PdfDocumentProps, ProcessTracker, ProcessTrackerProps, ProcessTrackerStatus, ProfileInformation, ProfileInformationProps, RadioButtonField, RadioButtonFieldMolecule, RadioButtonFieldProps, RadioButtonInternalConfigProps, RadioButtons, RadioButtonsProps, RadioGroupWrapper, RegularImage, RegularImageProps, RichTextEditorProps, RichTextViewer, RuleLabelInternalConfig, Select, SelectAttributes, SelectField, SelectFieldMolecule, SelectFieldProps, SelectInternalConfigurationOptions, SelectOption, SelectProps, SelectableCardGroup, SelectableCardGroupProps, SeoTags, SetPasswordForm, SetPasswordFormProps, SetPasswordRuleValidation, SizesTypes, Slide, SlidesWrapper, Spacer, SpacerProps, Spinner, Stepper, StepperProps, StyleWrapper, SubscribePanel, Tab, TabGroup, TabGroupMolecule, TabGroupProps, TabOption, TabProps, TabTheme, TabType, TextAlign, TextAttributes, TextButton, TextButtonProps, TextInputMolecule, TextMolecule, TextMoleculeProps, TextMoleculeType, TextProps, TextTypes, TextWrapper, TextWrapperProps, ThemeColors, ThemeColorsType, ThemeDevicesType, ThemeSizesType, ThemeTextType, Tooltip, TooltipInternalConfig, TooltipProps, TouchableOpacity, TouchableOpacityProps, TwoFactorAuth, TwoFactorAuthProps, UICheckboxField, UIField, UIFields, UIInputField, UISelectField, ValidationTag, ValidationTagProps, ValidationTagStatus, VerticalPadding, Video, VideoAttributes, VideoMolecule, VideoProps, Wrapper, ZealTheme, ZealThemeProvider, acquisitionFormMockFields, defaultTheme, getFieldPlaceholder, getFieldsFromFieldSections, getInitialValuesFromFields, isFormValid, loginMockFields, profileInformationMockForm, sectionMockFields, setPasswordMockFields, showAcceptToastMessage, toast, toastStyles, useMediaQuery, useMlrRichTextViewerContext, useRequiredConsentsAcceptedValues, useStep };
1662
+ export { AcquisitionForm, AcquisitionFormProps, ActionAttributes, ActionTypes, AdditionalContainerProps, AdditionalTabContainerProps, Alert, AlertProps, AnnotationsList, ArrowIconWrapper, AuthMethod, Avatar, AvatarDropdown, AvatarDropdownProps, AvatarProps, BackgroundImage, BaseButtonProps, BaseMolecule, Body, BodyProps, BooleanAttributes, BottomNaVBarItemProps, BottomNavBarItem, BottomNavBarNavigation, BottomNavBarNavigationProps, BreakpointSizesTypes, Button, ButtonActionsContext, ButtonActionsContextType, ButtonActionsProvider, ButtonActionsProviderProps, ButtonMolecule, ButtonProps, ButtonType, ButtonVariant, ButtonsWrapper, COMMUNICATION_LINK_DATA_TEXT, COMMUNICATION_LINK_DATA_URL, COMMUNICATION_LINK_ELEMENT_ID, CaretIconWrapper, Carousel, CarouselProps, Checkbox, CheckboxField, CheckboxFieldMolecule, CheckboxFieldProps, CheckboxGroup, CheckboxGroupProps, CheckboxProps, CheckboxesProps, Circle, CircleBoxProps, CirclesWrapper, CircularIndicator, CircularIndicatorProps, CircularIndicatorStyledComponent, ColumnItem, Columns, ColumnsProps, Consent, ConsentProps, Container, ContainerComponent, ContainerComponentProps, ContainerPositionType, ContainerProps, ContainerPropsType, ContainerScrollBehaviourType, ContainerType, ContainerWrapper, ContentStatus, CustomValidation, CustomValidationProps, CustomValidationRule, DefaultTemplate, DefaultTemplateProps, Divider, DividerProps, Drawer, DynamicContentZone, DynamicContentZoneProps, DynamicElementProps, EmphasizedText, EmphasizedTextProps, ErrorText, FeedContent, FeedContentContainer, FeedContentContainerProps, FeedContentHeader, FeedContentHeaderProps, FeedTemplateKeys, FieldLabels, FieldLabelsProps, FieldMapper, FieldMapperProps, FieldRuleLabelTypes, FieldSection, FieldSectionProps, FieldTypes, FileMatrixMessageDTO, FileObjectDTO, FileType, FilteredFeedContentType, FontSizesTypes, FontWeight, Footer, FooterContactInfo, FooterLink, FooterProps, ForgotPasswordForm, ForgotPasswordFormProps, GoogleMap, GoogleMapProps, Header, HeaderProps, HeroImage, HeroImageAlignment, HeroImageProps, HeroImageTemplate, HeroSlider, HeroSliderProps, HeroSliderWrapper, HorizontalButtons, HorizontalButtonsField, HorizontalButtonsProps, HorizontalPadding, HorizontalPaddingProps, ISI, ISIProps, Icon, IconButton, IconButtonProps, IconNames, IconProps, Image, ImageAttributes, ImageMolecule, ImageProps, Input, InputField, InputFieldInternalConfigProps, InputFieldProps, InputFieldTypes, InputIconProps, InputProps, IterableAttributes, LabelInternalConfig, LinkAttributes, LoginForm, LoginFormProps, MATRIX_MESSAGE_DATA_ID, MATRIX_MESSAGE_ELEMENT_ID, MapPosition, MenuItem, MenuItems, MenuItemsProps, MenuNavigation, MenuNavigationProps, MlrRichTextViewerContext, MlrRichTextViewerContextType, MlrRichTextViewerProvider, MlrRichTextViewerProviderProps, ModalWrapper, Molecule, MoleculeTypes, NavigationDotsWrapper, OrganismItem, OrientationType, PdfDocument, PdfDocumentProps, ProcessTracker, ProcessTrackerProps, ProcessTrackerStatus, ProfileInformation, ProfileInformationProps, RadioButtonField, RadioButtonFieldMolecule, RadioButtonFieldProps, RadioButtonInternalConfigProps, RadioButtons, RadioButtonsProps, RadioGroupWrapper, RegularImage, RegularImageProps, RichTextEditorProps, RichTextViewer, RuleLabelInternalConfig, Select, SelectAttributes, SelectField, SelectFieldMolecule, SelectFieldProps, SelectInternalConfigurationOptions, SelectOption, SelectProps, SelectableCardGroup, SelectableCardGroupProps, SeoTags, SetPasswordForm, SetPasswordFormProps, SetPasswordRuleValidation, SizesTypes, Slide, SlidesWrapper, Spacer, SpacerProps, Spinner, Stepper, StepperProps, StyleWrapper, SubscribePanel, Tab, TabGroup, TabGroupMolecule, TabGroupProps, TabOption, TabProps, TabTheme, TabType, TextAlign, TextAttributes, TextButton, TextButtonProps, TextInputMolecule, TextMolecule, TextMoleculeProps, TextMoleculeType, TextProps, TextTypes, TextWrapper, TextWrapperProps, ThemeColors, ThemeColorsType, ThemeDevicesType, ThemeSizesType, ThemeTextType, Tooltip, TooltipInternalConfig, TooltipProps, TouchableOpacity, TouchableOpacityProps, TwoFactorAuth, TwoFactorAuthProps, UICheckboxField, UIField, UIFields, UIInputField, UISelectField, ValidationTag, ValidationTagProps, ValidationTagStatus, VerticalPadding, Video, VideoAttributes, VideoMolecule, VideoProps, Wrapper, ZealTheme, ZealThemeProvider, ZealUIModal, ZealUIModalProps, acquisitionFormMockFields, defaultTheme, getFieldPlaceholder, getFieldsFromFieldSections, getInitialValuesFromFields, isFormValid, loginMockFields, profileInformationMockForm, sectionMockFields, setPasswordMockFields, showAcceptToastMessage, toast, toastStyles, useButtonActionsContext, useMediaQuery, useMlrRichTextViewerContext, useRequiredConsentsAcceptedValues, useStep };
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@zealicsolutions/web-ui",
3
- "version": "0.3.7",
3
+ "version": "0.3.9",
4
4
  "repository": {
5
5
  "type": "git",
6
6
  "url": "git+ssh://git@bitbucket.org/Zealic_Solutions/zeal-ui-web.git"