@zealicsolutions/web-ui 0.3.7 → 0.3.8

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.
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.8",
4
4
  "repository": {
5
5
  "type": "git",
6
6
  "url": "git+ssh://git@bitbucket.org/Zealic_Solutions/zeal-ui-web.git"