@zealicsolutions/web-ui 0.1.7 → 0.1.9

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 (128) hide show
  1. package/dist/cjs/index.js +33 -27
  2. package/dist/cjs/index.js.map +1 -1
  3. package/dist/cjs/src/assets/index.d.ts +2 -1
  4. package/dist/cjs/src/atoms/Icon/Icon.d.ts +2 -1
  5. package/dist/cjs/src/atoms/RichTextViewer/RichTextViewer.d.ts +5 -0
  6. package/dist/cjs/src/atoms/RichTextViewer/components/EditorElement.d.ts +3 -0
  7. package/dist/cjs/src/atoms/RichTextViewer/components/Leaf.d.ts +3 -0
  8. package/dist/cjs/src/atoms/RichTextViewer/components/LinkElement.d.ts +3 -0
  9. package/dist/cjs/src/atoms/RichTextViewer/components/index.d.ts +3 -0
  10. package/dist/cjs/src/atoms/RichTextViewer/types.d.ts +21 -0
  11. package/dist/cjs/src/atoms/TextWrapper/TextWrapper.d.ts +3 -3
  12. package/dist/cjs/src/atoms/TextWrapper/TextWrapper.stories.d.ts +1 -1
  13. package/dist/cjs/src/atoms/index.d.ts +1 -0
  14. package/dist/cjs/src/helpers/date.d.ts +3 -0
  15. package/dist/cjs/src/icons/Menu.d.ts +3 -0
  16. package/dist/cjs/src/icons/index.d.ts +1 -0
  17. package/dist/cjs/src/molecules/Columns/Columns.d.ts +15 -0
  18. package/dist/cjs/src/molecules/Columns/Columns.stories.d.ts +9 -0
  19. package/dist/cjs/src/molecules/EmphasizedText/EmphasizedText.d.ts +7 -0
  20. package/dist/cjs/src/molecules/EmphasizedText/EmphasizedText.stories.d.ts +9 -0
  21. package/dist/cjs/src/molecules/HeroImage/HeroImage.d.ts +12 -0
  22. package/dist/cjs/src/molecules/HeroImage/HeroImage.stories.d.ts +9 -0
  23. package/dist/cjs/src/molecules/MenuNavigation/MenuNavigation.d.ts +6 -0
  24. package/dist/cjs/src/molecules/MenuNavigation/MenuNavigation.stories.d.ts +10 -0
  25. package/dist/cjs/src/molecules/SelectableInfoCard/styles.d.ts +1 -1
  26. package/dist/cjs/src/molecules/Tab/styles.d.ts +1 -1
  27. package/dist/cjs/src/molecules/TabGroup/TabGroup.d.ts +3 -1
  28. package/dist/cjs/src/molecules/TabGroup/TabGroup.stories.d.ts +1 -1
  29. package/dist/cjs/src/molecules/index.d.ts +4 -2
  30. package/dist/cjs/src/organisms/Body/Body.d.ts +11 -0
  31. package/dist/cjs/src/organisms/Body/Body.stories.d.ts +9 -0
  32. package/dist/cjs/src/organisms/Footer/Footer.d.ts +6 -0
  33. package/dist/cjs/src/organisms/Footer/Footer.stories.d.ts +9 -0
  34. package/dist/cjs/src/organisms/Footer/FooterA.d.ts +13 -0
  35. package/dist/cjs/src/organisms/Footer/FooterB.d.ts +11 -0
  36. package/dist/cjs/src/organisms/Footer/FooterC.d.ts +6 -0
  37. package/dist/cjs/src/organisms/Footer/styles.d.ts +9 -0
  38. package/dist/cjs/src/organisms/Footer/types.d.ts +10 -0
  39. package/dist/cjs/src/organisms/Header/Header/Header.d.ts +16 -0
  40. package/dist/cjs/src/organisms/Header/Header/Header.stories.d.ts +17 -0
  41. package/dist/cjs/src/organisms/Header/HeaderA/HeaderA.d.ts +18 -0
  42. package/dist/cjs/src/organisms/Header/HeaderA/HeaderA.stories.d.ts +9 -0
  43. package/dist/cjs/src/organisms/Header/HeaderB/HeaderB.d.ts +12 -0
  44. package/dist/cjs/src/organisms/Header/HeaderB/HeaderB.stories.d.ts +9 -0
  45. package/dist/cjs/src/organisms/Header/HeaderC/HeaderC.d.ts +9 -0
  46. package/dist/cjs/src/organisms/Header/HeaderC/HeaderC.stories.d.ts +9 -0
  47. package/dist/cjs/src/organisms/Header/HeaderD/HeaderD.d.ts +17 -0
  48. package/dist/cjs/src/organisms/Header/HeaderD/HeaderD.stories.d.ts +9 -0
  49. package/dist/cjs/src/organisms/Header/styles.d.ts +2 -1
  50. package/dist/cjs/src/organisms/ISI/ISI.d.ts +4 -0
  51. package/dist/cjs/src/organisms/ISI/ISI.stories.d.ts +9 -0
  52. package/dist/cjs/src/organisms/ISI/ISIA.d.ts +7 -0
  53. package/dist/cjs/src/organisms/index.d.ts +5 -1
  54. package/dist/cjs/src/templates/DefaultTemplate/mockProps.d.ts +2 -2
  55. package/dist/cjs/src/theme/index.d.ts +1 -0
  56. package/dist/cjs/src/theme/types.d.ts +6 -2
  57. package/dist/cjs/src/theme/useMediaQuery.d.ts +2 -0
  58. package/dist/esm/index.js +33 -27
  59. package/dist/esm/index.js.map +1 -1
  60. package/dist/esm/src/assets/index.d.ts +2 -1
  61. package/dist/esm/src/atoms/Icon/Icon.d.ts +2 -1
  62. package/dist/esm/src/atoms/RichTextViewer/RichTextViewer.d.ts +5 -0
  63. package/dist/esm/src/atoms/RichTextViewer/components/EditorElement.d.ts +3 -0
  64. package/dist/esm/src/atoms/RichTextViewer/components/Leaf.d.ts +3 -0
  65. package/dist/esm/src/atoms/RichTextViewer/components/LinkElement.d.ts +3 -0
  66. package/dist/esm/src/atoms/RichTextViewer/components/index.d.ts +3 -0
  67. package/dist/esm/src/atoms/RichTextViewer/types.d.ts +21 -0
  68. package/dist/esm/src/atoms/TextWrapper/TextWrapper.d.ts +3 -3
  69. package/dist/esm/src/atoms/TextWrapper/TextWrapper.stories.d.ts +1 -1
  70. package/dist/esm/src/atoms/index.d.ts +1 -0
  71. package/dist/esm/src/helpers/date.d.ts +3 -0
  72. package/dist/esm/src/icons/Menu.d.ts +3 -0
  73. package/dist/esm/src/icons/index.d.ts +1 -0
  74. package/dist/esm/src/molecules/Columns/Columns.d.ts +15 -0
  75. package/dist/esm/src/molecules/Columns/Columns.stories.d.ts +9 -0
  76. package/dist/esm/src/molecules/EmphasizedText/EmphasizedText.d.ts +7 -0
  77. package/dist/esm/src/molecules/EmphasizedText/EmphasizedText.stories.d.ts +9 -0
  78. package/dist/esm/src/molecules/HeroImage/HeroImage.d.ts +12 -0
  79. package/dist/esm/src/molecules/HeroImage/HeroImage.stories.d.ts +9 -0
  80. package/dist/esm/src/molecules/MenuNavigation/MenuNavigation.d.ts +6 -0
  81. package/dist/esm/src/molecules/MenuNavigation/MenuNavigation.stories.d.ts +10 -0
  82. package/dist/esm/src/molecules/SelectableInfoCard/styles.d.ts +1 -1
  83. package/dist/esm/src/molecules/Tab/styles.d.ts +1 -1
  84. package/dist/esm/src/molecules/TabGroup/TabGroup.d.ts +3 -1
  85. package/dist/esm/src/molecules/TabGroup/TabGroup.stories.d.ts +1 -1
  86. package/dist/esm/src/molecules/index.d.ts +4 -2
  87. package/dist/esm/src/organisms/Body/Body.d.ts +11 -0
  88. package/dist/esm/src/organisms/Body/Body.stories.d.ts +9 -0
  89. package/dist/esm/src/organisms/Footer/Footer.d.ts +6 -0
  90. package/dist/esm/src/organisms/Footer/Footer.stories.d.ts +9 -0
  91. package/dist/esm/src/organisms/Footer/FooterA.d.ts +13 -0
  92. package/dist/esm/src/organisms/Footer/FooterB.d.ts +11 -0
  93. package/dist/esm/src/organisms/Footer/FooterC.d.ts +6 -0
  94. package/dist/esm/src/organisms/Footer/styles.d.ts +9 -0
  95. package/dist/esm/src/organisms/Footer/types.d.ts +10 -0
  96. package/dist/esm/src/organisms/Header/Header/Header.d.ts +16 -0
  97. package/dist/esm/src/organisms/Header/Header/Header.stories.d.ts +17 -0
  98. package/dist/esm/src/organisms/Header/HeaderA/HeaderA.d.ts +18 -0
  99. package/dist/esm/src/organisms/Header/HeaderA/HeaderA.stories.d.ts +9 -0
  100. package/dist/esm/src/organisms/Header/HeaderB/HeaderB.d.ts +12 -0
  101. package/dist/esm/src/organisms/Header/HeaderB/HeaderB.stories.d.ts +9 -0
  102. package/dist/esm/src/organisms/Header/HeaderC/HeaderC.d.ts +9 -0
  103. package/dist/esm/src/organisms/Header/HeaderC/HeaderC.stories.d.ts +9 -0
  104. package/dist/esm/src/organisms/Header/HeaderD/HeaderD.d.ts +17 -0
  105. package/dist/esm/src/organisms/Header/HeaderD/HeaderD.stories.d.ts +9 -0
  106. package/dist/esm/src/organisms/Header/styles.d.ts +2 -1
  107. package/dist/esm/src/organisms/ISI/ISI.d.ts +4 -0
  108. package/dist/esm/src/organisms/ISI/ISI.stories.d.ts +9 -0
  109. package/dist/esm/src/organisms/ISI/ISIA.d.ts +7 -0
  110. package/dist/esm/src/organisms/index.d.ts +5 -1
  111. package/dist/esm/src/templates/DefaultTemplate/mockProps.d.ts +2 -2
  112. package/dist/esm/src/theme/index.d.ts +1 -0
  113. package/dist/esm/src/theme/types.d.ts +6 -2
  114. package/dist/esm/src/theme/useMediaQuery.d.ts +2 -0
  115. package/dist/index.d.ts +116 -65
  116. package/package.json +8 -5
  117. package/dist/cjs/src/molecules/Banner/Banner.d.ts +0 -9
  118. package/dist/cjs/src/molecules/Banner/Banner.stories.d.ts +0 -9
  119. package/dist/cjs/src/molecules/InfoBox/InfoBox.d.ts +0 -9
  120. package/dist/cjs/src/molecules/InfoBox/InfoBox.stories.d.ts +0 -9
  121. package/dist/cjs/src/organisms/Header/Header.d.ts +0 -18
  122. package/dist/cjs/src/organisms/Header/Header.stories.d.ts +0 -9
  123. package/dist/esm/src/molecules/Banner/Banner.d.ts +0 -9
  124. package/dist/esm/src/molecules/Banner/Banner.stories.d.ts +0 -9
  125. package/dist/esm/src/molecules/InfoBox/InfoBox.d.ts +0 -9
  126. package/dist/esm/src/molecules/InfoBox/InfoBox.stories.d.ts +0 -9
  127. package/dist/esm/src/organisms/Header/Header.d.ts +0 -18
  128. package/dist/esm/src/organisms/Header/Header.stories.d.ts +0 -9
package/dist/index.d.ts CHANGED
@@ -3,11 +3,14 @@ import { Callback, StylesType } from 'typescript';
3
3
  import * as react from 'react';
4
4
  import react__default, { PropsWithChildren, ReactNode, Dispatch, SetStateAction } from 'react';
5
5
  import * as styled_components from 'styled-components';
6
- import { DefaultTheme, CSSProperties } from 'styled-components';
6
+ import { CSSProperties, DefaultTheme } from 'styled-components';
7
7
  import { IconNames as IconNames$1 } from 'atoms/Icon/Icon';
8
8
  import { InputFieldTypes as InputFieldTypes$1, FieldTypes as FieldTypes$1, UIFields as UIFields$1 } from 'fieldsConfiguration/types';
9
- import { SizesTypes as SizesTypes$1, ThemeColors as ThemeColors$1 } from 'theme/types';
10
- import { SizesTypes as SizesTypes$2, ThemeColors as ThemeColors$2 } from 'theme';
9
+ import * as _mui_material_OverridableComponent from '@mui/material/OverridableComponent';
10
+ import * as _mui_material from '@mui/material';
11
+ import { DrawerProps as DrawerProps$1 } from '@mui/material';
12
+ import { FontSizesTypes as FontSizesTypes$1, ThemeColors as ThemeColors$1, SizesTypes as SizesTypes$2, BreakpointSizesTypes as BreakpointSizesTypes$1 } from 'theme/types';
13
+ import { ThemeColors as ThemeColors$2, SizesTypes as SizesTypes$1 } from 'theme';
11
14
  import { TooltipProps as TooltipProps$1 } from 'rc-tooltip/lib/Tooltip';
12
15
  import { WithGoogleMapProps } from 'react-google-maps/lib/withGoogleMap';
13
16
  import { WithScriptjsProps } from 'react-google-maps/lib/withScriptjs';
@@ -15,9 +18,13 @@ import { Control, ControllerProps } from 'react-hook-form/dist/types';
15
18
  import { InputProps as InputProps$1 } from 'atoms';
16
19
  import { SelectOption as SelectOption$1 } from 'atoms/Select/types';
17
20
  import { ControllerProps as ControllerProps$1, DeepPartial, FieldValues, FormState } from 'react-hook-form';
18
- import { DrawerProps as DrawerProps$1 } from '@mui/material';
19
21
  import { SetPasswordFields, MaxRuleValidation, MinRuleValidation } from 'organisms/SetPasswordForm/types';
20
- import { FieldSectionProps as FieldSectionProps$1 } from 'molecules';
22
+ export * from 'organisms/Header/Header/Header';
23
+ import { FooterAProps } from 'organisms/Footer/FooterA';
24
+ import { FooterBProps } from 'organisms/Footer/FooterB';
25
+ import { FooterCProps } from 'organisms/Footer/FooterC';
26
+ import { FieldSectionProps as FieldSectionProps$1, HeroImageProps as HeroImageProps$1, ColumnsProps as ColumnsProps$1, EmphasizedTextProps as EmphasizedTextProps$1 } from 'molecules';
27
+ import { ISIAProps } from 'organisms/ISI/ISIA';
21
28
  import { LoginFields as LoginFields$1 } from 'organisms/LoginForm/types';
22
29
 
23
30
  declare type BaseButtonProps = {
@@ -93,41 +100,18 @@ declare const Input: ({ value, leftIcon, rightIcon, onChange, onBlur, disabled,
93
100
  declare type TextTypes = 'primary' | 'secondary' | 'error' | 'success';
94
101
  declare type TextWrapperProps = {
95
102
  children: ReactNode;
96
- variant: SizesTypes$1;
103
+ variant: FontSizesTypes$1;
97
104
  layout?: 'div' | 'span';
98
105
  type?: TextTypes;
99
106
  styles?: StylesType;
100
107
  color?: ThemeColors$1 | string;
101
108
  };
102
- declare const TextWrapper: styled_components.StyledComponent<"div", styled_components.DefaultTheme, TextWrapperProps, never>;
103
-
104
- declare const defaultTheme: DefaultTheme;
105
-
106
- declare const ZealThemeProvider: (props: PropsWithChildren<{
107
- theme?: DefaultTheme;
108
- }>) => JSX.Element;
109
-
110
- declare type ThemeColors = 'primary' | 'secondary' | 'background' | 'gray1' | 'gray2' | 'gray3' | 'gray4' | 'gray5' | 'indigo' | 'blue' | 'white' | 'black' | 'indigoTint' | 'indigoTint2' | 'success' | 'error' | 'warning';
111
- declare type SizesTypes = '2XL' | 'XL' | 'L' | 'M' | 'S' | 'XS';
112
- declare type ThemeColorsType = Record<ThemeColors, string>;
113
- declare type ThemeTextType = Record<SizesTypes, {
114
- 'font-weight': string;
115
- 'font-size': number;
116
- 'line-height': number;
117
- }>;
118
- declare type ThemeSizesType = Record<SizesTypes, number>;
119
- declare type ZealTheme = {
120
- colors: ThemeColorsType;
121
- fonts: ThemeTextType;
122
- sizes: ThemeSizesType;
123
- };
124
-
125
- declare const toastStyles: styled_components.FlattenSimpleInterpolation;
109
+ declare const TextWrapper: styled_components.StyledComponent<_mui_material_OverridableComponent.OverridableComponent<_mui_material.BoxTypeMap<{}, "div">>, styled_components.DefaultTheme, TextWrapperProps, never>;
126
110
 
127
111
  declare type IconProps = {
128
112
  name: IconNames;
129
113
  size?: number;
130
- color?: ThemeColors | string;
114
+ color?: ThemeColors$2 | string;
131
115
  pointerEvents?: 'auto' | 'none';
132
116
  };
133
117
  declare const availableIcons: {
@@ -145,20 +129,21 @@ declare const availableIcons: {
145
129
  Bell: ({ size, color }: Omit<IconProps, "name">) => JSX.Element;
146
130
  Mobile: ({ size, color }: Omit<IconProps, "name">) => JSX.Element;
147
131
  Mail: ({ size, color }: Omit<IconProps, "name">) => JSX.Element;
132
+ Menu: ({ size, color }: Omit<IconProps, "name">) => JSX.Element;
148
133
  };
149
134
  declare type IconNames = keyof typeof availableIcons;
150
135
  declare const Icon: ({ name, color, ...props }: IconProps) => JSX.Element;
151
136
 
152
137
  declare type SpacerProps = {
153
- width?: SizesTypes$2 | number;
154
- height?: SizesTypes$2 | number;
138
+ width?: SizesTypes$1 | number;
139
+ height?: SizesTypes$1 | number;
155
140
  layout?: 'div' | 'span';
156
141
  };
157
142
  declare const Spacer: styled_components.StyledComponent<"div", styled_components.DefaultTheme, SpacerProps, never>;
158
143
 
159
144
  declare const Spinner: styled_components.StyledComponent<"div", styled_components.DefaultTheme, {
160
145
  color?: ThemeColors$1 | undefined;
161
- size?: SizesTypes$1 | undefined;
146
+ size?: SizesTypes$2 | undefined;
162
147
  }, never>;
163
148
 
164
149
  declare type ImageProps = {
@@ -208,13 +193,13 @@ declare type ToastParams = {
208
193
  declare const toast: ({ message, type, duration }: ToastParams) => void | undefined;
209
194
 
210
195
  declare type AvatarProps = {
211
- size?: SizesTypes$2 | number;
196
+ size?: SizesTypes$1 | number;
212
197
  withShadow?: boolean;
213
198
  label?: string;
214
199
  backgroundColor?: ThemeColors$2;
215
200
  textConfig?: {
216
201
  color?: ThemeColors$2;
217
- font?: SizesTypes$2;
202
+ font?: SizesTypes$1;
218
203
  };
219
204
  content: {
220
205
  initials?: string;
@@ -226,7 +211,7 @@ declare type AvatarProps = {
226
211
  declare const Avatar: ({ size, withShadow, label, backgroundColor, onPress, content: { initials, iconName, imageUrl }, textConfig: { color, font }, }: AvatarProps) => JSX.Element;
227
212
 
228
213
  declare type HorizontalPaddingProps = {
229
- padding: SizesTypes$2 | number;
214
+ padding: SizesTypes$1 | number;
230
215
  };
231
216
  declare const HorizontalPadding: styled_components.StyledComponent<"div", styled_components.DefaultTheme, HorizontalPaddingProps, never>;
232
217
  declare const VerticalPadding: styled_components.StyledComponent<"div", styled_components.DefaultTheme, HorizontalPaddingProps, never>;
@@ -234,8 +219,8 @@ declare const VerticalPadding: styled_components.StyledComponent<"div", styled_c
234
219
  declare type DividerProps = {
235
220
  type?: 'horizontal' | 'vertical';
236
221
  color?: ThemeColors$2 | string;
237
- marginVertical?: SizesTypes$2 | number;
238
- marginHorizontal?: SizesTypes$2 | number;
222
+ marginVertical?: SizesTypes$1 | number;
223
+ marginHorizontal?: SizesTypes$1 | number;
239
224
  weight?: number;
240
225
  };
241
226
  declare const Divider: styled_components.StyledComponent<"div", styled_components.DefaultTheme, DividerProps, never>;
@@ -251,6 +236,11 @@ declare const GoogleMap: react__default.ComponentClass<{
251
236
  position: MapPosition;
252
237
  } & WithScriptjsProps & WithGoogleMapProps, any>;
253
238
 
239
+ declare type RichTextEditorProps = Partial<{
240
+ value: string;
241
+ }>;
242
+ declare const RichTextViewer: ({ value }: RichTextEditorProps) => JSX.Element | null;
243
+
254
244
  declare type FieldRuleLabelTypes = 'OPTIONAL' | 'REQUIRED';
255
245
  declare type FieldLabelsProps = {
256
246
  label: string;
@@ -355,6 +345,35 @@ declare type CustomValidationProps<T = string> = {
355
345
  };
356
346
  declare const CustomValidation: <T extends string = string>({ rules, value, isSubmitted, label, }: CustomValidationProps<T>) => JSX.Element;
357
347
 
348
+ declare const defaultTheme: DefaultTheme;
349
+
350
+ declare const ZealThemeProvider: (props: PropsWithChildren<{
351
+ theme?: DefaultTheme;
352
+ }>) => JSX.Element;
353
+
354
+ declare type ThemeColors = 'primary' | 'secondary' | 'background' | 'gray1' | 'gray2' | 'gray3' | 'gray4' | 'gray5' | 'indigo' | 'blue' | 'white' | 'black' | 'indigoTint' | 'indigoTint2' | 'success' | 'error' | 'warning';
355
+ declare type SizesTypes = '2XL' | 'XL' | 'L' | 'M' | 'S' | 'XS';
356
+ declare type FontSizesTypes = SizesTypes | 'H2';
357
+ declare type BreakpointSizesTypes = 'xs' | 'sm' | 'md' | 'lg' | 'xl';
358
+ declare type ThemeColorsType = Record<ThemeColors, string>;
359
+ declare type ThemeTextType = Record<FontSizesTypes, {
360
+ 'font-weight': string;
361
+ 'font-size': number;
362
+ 'line-height': number;
363
+ }>;
364
+ declare type ThemeSizesType = Record<SizesTypes, number>;
365
+ declare type ThemeDevicesType = Record<BreakpointSizesTypes, string>;
366
+ declare type ZealTheme = {
367
+ colors: ThemeColorsType;
368
+ fonts: Record<FontSizesTypes, number>;
369
+ sizes: ThemeSizesType;
370
+ devices: ThemeDevicesType;
371
+ };
372
+
373
+ declare const toastStyles: styled_components.FlattenSimpleInterpolation;
374
+
375
+ declare const useMediaQuery: (breakpointSize: BreakpointSizesTypes$1) => boolean;
376
+
358
377
  declare type BaseSelectableProps<T> = {
359
378
  iconName: IconNames;
360
379
  infoText: string;
@@ -371,30 +390,38 @@ declare type SelectableCardGroupProps<T> = {
371
390
  };
372
391
  declare const SelectableCardGroup: <T extends string>({ cards, handleChange, spacing, initialValue, }: SelectableCardGroupProps<T>) => JSX.Element;
373
392
 
374
- declare type BannerProps = {
393
+ declare type HeroImageAlignment = 'left_aligned' | 'center_aligned';
394
+ declare type HeroImageProps = {
395
+ type: 'hero_image';
375
396
  backgroundImage: ImageProps;
376
- title: string;
377
- description?: string;
397
+ mainHeading: string;
398
+ subHeading?: string;
378
399
  button?: ButtonProps;
400
+ contentAlignment?: HeroImageAlignment;
379
401
  };
380
- declare const Banner: ({ backgroundImage, button, title, description }: BannerProps) => JSX.Element;
402
+ declare const HeroImage: ({ backgroundImage, button, contentAlignment, mainHeading, subHeading, }: HeroImageProps) => JSX.Element;
381
403
 
382
404
  declare type Anchor = 'top' | 'left' | 'bottom' | 'right';
383
405
  declare type DrawerProps = DrawerProps$1 & {
384
406
  anchor: Anchor;
385
- padding?: SizesTypes$1 | number;
407
+ padding?: SizesTypes$2 | number;
386
408
  closeIconColor?: ThemeColors$1 | string;
387
409
  };
388
410
 
389
411
  declare const Drawer: ({ children, closeIconColor, ...props }: PropsWithChildren<DrawerProps>) => JSX.Element;
390
412
 
391
- declare type InfoBoxProps = {
392
- title: string;
393
- description?: string;
394
- linkButton?: LinkButtonProps;
395
- icon?: IconNames;
413
+ declare type ColumnItem = {
414
+ title?: string;
415
+ mainContent?: string;
416
+ button?: LinkButtonProps;
417
+ icon: string;
418
+ };
419
+ declare type ColumnsProps = {
420
+ type: 'columns';
421
+ columns: ColumnItem[];
422
+ containerStyles?: CSSProperties;
396
423
  };
397
- declare const InfoBox: ({ title, icon, description, linkButton }: InfoBoxProps) => JSX.Element;
424
+ declare const Columns: ({ columns, containerStyles }: ColumnsProps) => JSX.Element;
398
425
 
399
426
  declare type MenuItem<T> = {
400
427
  id: T;
@@ -427,11 +454,12 @@ declare type TabProps<T = string, K = string> = {
427
454
  declare type TabGroupProps<T = string, K = string> = {
428
455
  tabs: Pick<TabProps<T, K>, 'text' | 'tabKey' | 'disabled' | 'options'>[];
429
456
  activeTabKey: T;
430
- spacing?: SizesTypes$1;
457
+ spacing?: SizesTypes$2;
431
458
  onTabChange?: (tabKey: T) => void;
432
459
  onOptionClick?: (optionKey: K) => void;
460
+ style?: CSSProperties;
433
461
  };
434
- declare const TabGroup: <T extends string, K extends string>({ tabs, spacing, activeTabKey, onTabChange, }: TabGroupProps<T, K>) => JSX.Element;
462
+ declare const TabGroup: <T extends string, K extends string>({ tabs, spacing, activeTabKey, onTabChange, style, }: TabGroupProps<T, K>) => JSX.Element;
435
463
 
436
464
  declare type FieldSectionProps<T extends object> = {
437
465
  label: string;
@@ -441,6 +469,18 @@ declare type FieldSectionProps<T extends object> = {
441
469
  };
442
470
  declare const FieldSection: <T extends object>({ fields, label, isEditMode, control, }: FieldSectionProps<T>) => JSX.Element;
443
471
 
472
+ declare type MenuNavigationProps<T> = {
473
+ menuConfig: MenuItemsProps<T>;
474
+ };
475
+ declare const MenuNavigation: <T extends string | number>({ menuConfig, }: MenuNavigationProps<T>) => JSX.Element;
476
+
477
+ declare type EmphasizedTextProps = {
478
+ type: 'emphasized_text';
479
+ invertColors: boolean;
480
+ textContent: string;
481
+ };
482
+ declare const EmphasizedText: ({ textContent, invertColors }: EmphasizedTextProps) => JSX.Element;
483
+
444
484
  declare type SetPasswordRuleValidation = {
445
485
  label: string;
446
486
  rule: MaxRuleValidation | MinRuleValidation;
@@ -499,20 +539,19 @@ declare type LoginFormProps = {
499
539
  };
500
540
  declare const LoginForm: ({ logoUrl, fields, onSubmit, onSignUpButtonClick, isLoading, twoFactorAuthConfig, onForgotPasswordButtonClick, }: LoginFormProps) => JSX.Element;
501
541
 
502
- declare type ImportantLink = {
503
- text: string;
504
- href: string;
542
+ declare type FooterProps = FooterAProps | FooterBProps | FooterCProps;
543
+ declare const Footer: (props: FooterProps) => JSX.Element;
544
+
545
+ declare type FooterContentInfo = {
546
+ phoneNumber: string;
547
+ addressLine1: string;
548
+ addressLine2: string;
505
549
  };
506
- declare type HeaderProps = {
507
- links?: ImportantLink[];
508
- logoUrl: string;
509
- tabs: TabGroupProps['tabs'];
510
- withAvatar?: {
511
- props: AvatarDropdownProps<string>;
512
- };
513
- onActionButtonClick?: Callback;
550
+ declare type FooterLink = {
551
+ id: string;
552
+ name: string;
553
+ location: string;
514
554
  };
515
- declare const Header: ({ logoUrl, links, onActionButtonClick, tabs, withAvatar }: HeaderProps) => JSX.Element;
516
555
 
517
556
  declare type ProfileInformationProps<TabKeys extends string> = {
518
557
  backgroundImageUrl: string;
@@ -541,6 +580,18 @@ declare type ForgotPasswordFormProps = {
541
580
  };
542
581
  declare const ForgotPasswordForm: ({ logoUrl, onBack, onSubmit, isLoading, }: ForgotPasswordFormProps) => JSX.Element;
543
582
 
583
+ declare type BodyProps = {
584
+ elements: {
585
+ data: (HeroImageProps$1 | ColumnsProps$1 | EmphasizedTextProps$1)[];
586
+ spacer?: number;
587
+ };
588
+ containerStyles?: CSSProperties;
589
+ };
590
+ declare const Body: ({ elements, containerStyles }: BodyProps) => JSX.Element;
591
+
592
+ declare type ISIProps = ISIAProps;
593
+ declare const ISI: (props: ISIProps) => JSX.Element;
594
+
544
595
  declare type DefaultTemplateProps = {
545
596
  header: React.ReactNode;
546
597
  banner?: React.ReactNode;
@@ -558,4 +609,4 @@ interface Helpers {
558
609
  }
559
610
  declare const useStep: (maxStep: number) => [number, Helpers];
560
611
 
561
- export { AcquisitionForm, AcquisitionFormProps, AuthMethod, Avatar, AvatarDropdown, AvatarDropdownProps, AvatarProps, Banner, BannerProps, BaseButtonProps, Button, ButtonProps, CheckBoxProps, Checkbox, CheckboxField, CheckboxFieldProps, CustomValidation, CustomValidationProps, CustomValidationRule, DefaultTemplate, DefaultTemplateProps, Divider, DividerProps, Drawer, FieldLabels, FieldLabelsProps, FieldMapper, FieldMapperProps, FieldRuleLabelTypes, FieldSection, FieldSectionProps, FieldTypes, ForgotPasswordForm, ForgotPasswordFormProps, GoogleMap, GoogleMapProps, Header, HeaderProps, HorizontalPadding, HorizontalPaddingProps, Icon, IconNames, IconProps, Image, ImageProps, InfoBox, InfoBoxProps, Input, InputField, InputFieldProps, InputFieldTypes, InputIconProps, InputProps, LinkButton, LinkButtonProps, LoginForm, LoginFormProps, MapPosition, MenuItem, MenuItems, MenuItemsProps, ProfileInformation, ProfileInformationProps, Select, SelectField, SelectFieldProps, SelectableCardGroup, SelectableCardGroupProps, SetPasswordForm, SetPasswordFormProps, SetPasswordRuleValidation, SizesTypes, Spacer, SpacerProps, Spinner, StyleWrapper, TabGroup, TabGroupProps, TextTypes, TextWrapper, TextWrapperProps, ThemeColors, ThemeColorsType, ThemeSizesType, ThemeTextType, Tooltip, TooltipProps, TouchableOpacity, TouchableOpacityProps, TwoFactorAuth, TwoFactorAuthProps, UICheckboxField, UIField, UIFields, UIInputField, UISelectField, ValidationTag, ValidationTagProps, ValidationTagStatus, VerticalPadding, ZealTheme, ZealThemeProvider, acquisitionFormMockFields, defaultTheme, getFieldPlaceholder, getFieldsFromFieldSections, getInitialValuesFromFields, isFormValid, loginMockFields, profileInformationMockForm, sectionMockFields, setPasswordMockFields, toast, toastStyles, useStep };
612
+ export { AcquisitionForm, AcquisitionFormProps, AuthMethod, Avatar, AvatarDropdown, AvatarDropdownProps, AvatarProps, BaseButtonProps, Body, BodyProps, BreakpointSizesTypes, Button, ButtonProps, CheckBoxProps, Checkbox, CheckboxField, CheckboxFieldProps, ColumnItem, Columns, ColumnsProps, CustomValidation, CustomValidationProps, CustomValidationRule, DefaultTemplate, DefaultTemplateProps, Divider, DividerProps, Drawer, EmphasizedText, EmphasizedTextProps, FieldLabels, FieldLabelsProps, FieldMapper, FieldMapperProps, FieldRuleLabelTypes, FieldSection, FieldSectionProps, FieldTypes, FontSizesTypes, Footer, FooterContentInfo, FooterLink, FooterProps, ForgotPasswordForm, ForgotPasswordFormProps, GoogleMap, GoogleMapProps, HeroImage, HeroImageAlignment, HeroImageProps, HorizontalPadding, HorizontalPaddingProps, ISI, ISIProps, Icon, IconNames, IconProps, Image, ImageProps, Input, InputField, InputFieldProps, InputFieldTypes, InputIconProps, InputProps, LinkButton, LinkButtonProps, LoginForm, LoginFormProps, MapPosition, MenuItem, MenuItems, MenuItemsProps, MenuNavigation, MenuNavigationProps, ProfileInformation, ProfileInformationProps, RichTextEditorProps, RichTextViewer, Select, SelectField, SelectFieldProps, SelectableCardGroup, SelectableCardGroupProps, SetPasswordForm, SetPasswordFormProps, SetPasswordRuleValidation, SizesTypes, Spacer, SpacerProps, Spinner, StyleWrapper, TabGroup, TabGroupProps, TextTypes, TextWrapper, TextWrapperProps, ThemeColors, ThemeColorsType, ThemeDevicesType, ThemeSizesType, ThemeTextType, Tooltip, TooltipProps, TouchableOpacity, TouchableOpacityProps, TwoFactorAuth, TwoFactorAuthProps, UICheckboxField, UIField, UIFields, UIInputField, UISelectField, ValidationTag, ValidationTagProps, ValidationTagStatus, VerticalPadding, ZealTheme, ZealThemeProvider, acquisitionFormMockFields, defaultTheme, getFieldPlaceholder, getFieldsFromFieldSections, getInitialValuesFromFields, isFormValid, loginMockFields, profileInformationMockForm, sectionMockFields, setPasswordMockFields, toast, toastStyles, useMediaQuery, useStep };
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@zealicsolutions/web-ui",
3
- "version": "0.1.7",
3
+ "version": "0.1.9",
4
4
  "repository": {
5
5
  "type": "git",
6
6
  "url": "git+ssh://git@bitbucket.org/Zealic_Solutions/zeal-ui-web.git"
@@ -83,17 +83,20 @@
83
83
  "styled-components": "^5.3.5"
84
84
  },
85
85
  "dependencies": {
86
- "react": "^18.2.0",
87
- "react-dom": "^18.2.0",
88
- "styled-components": "^5.3.5",
89
86
  "@mui/material": "^5.10.4",
90
87
  "@mui/styled-engine-sc": "npm:@mui/styled-engine-sc@latest",
91
88
  "@types/react-dom": "^18.0.6",
89
+ "date-fns": "^2.29.3",
92
90
  "rc-dropdown": "^4.0.1",
93
91
  "rc-notification": "^4.6.0",
94
92
  "rc-tooltip": "^5.2.2",
93
+ "react": "^18.2.0",
94
+ "react-dom": "^18.2.0",
95
95
  "react-google-maps": "^9.4.5",
96
- "react-hook-form": "^7.34.2"
96
+ "react-hook-form": "^7.34.2",
97
+ "slate": "^0.85.0",
98
+ "slate-react": "^0.83.2",
99
+ "styled-components": "^5.3.5"
97
100
  },
98
101
  "resolutions": {
99
102
  "@mui/styled-engine": "npm:@mui/styled-engine-sc@latest"
@@ -1,9 +0,0 @@
1
- /// <reference types="react" />
2
- import { ButtonProps, ImageProps } from '../../atoms';
3
- export declare type BannerProps = {
4
- backgroundImage: ImageProps;
5
- title: string;
6
- description?: string;
7
- button?: ButtonProps;
8
- };
9
- export declare const Banner: ({ backgroundImage, button, title, description }: BannerProps) => JSX.Element;
@@ -1,9 +0,0 @@
1
- /// <reference types="react" />
2
- import type { ComponentStory } from '@storybook/react';
3
- import { Banner as BannerComponent } from './Banner';
4
- declare const _default: {
5
- title: string;
6
- component: ({ backgroundImage, button, title, description }: import("./Banner").BannerProps) => JSX.Element;
7
- };
8
- export default _default;
9
- export declare const Banner: ComponentStory<typeof BannerComponent>;
@@ -1,9 +0,0 @@
1
- /// <reference types="react" />
2
- import { IconNames, LinkButtonProps } from '../../atoms';
3
- export declare type InfoBoxProps = {
4
- title: string;
5
- description?: string;
6
- linkButton?: LinkButtonProps;
7
- icon?: IconNames;
8
- };
9
- export declare const InfoBox: ({ title, icon, description, linkButton }: InfoBoxProps) => JSX.Element;
@@ -1,9 +0,0 @@
1
- /// <reference types="react" />
2
- import type { ComponentStory } from '@storybook/react';
3
- import { InfoBox as InfoBoxComponent } from './InfoBox';
4
- declare const _default: {
5
- title: string;
6
- component: ({ title, icon, description, linkButton }: import("./InfoBox").InfoBoxProps) => JSX.Element;
7
- };
8
- export default _default;
9
- export declare const InfoBox: ComponentStory<typeof InfoBoxComponent>;
@@ -1,18 +0,0 @@
1
- /// <reference types="react" />
2
- import type { Callback } from 'typescript';
3
- import { AvatarDropdownProps, TabGroupProps } from '../../molecules';
4
- declare type ImportantLink = {
5
- text: string;
6
- href: string;
7
- };
8
- export declare type HeaderProps = {
9
- links?: ImportantLink[];
10
- logoUrl: string;
11
- tabs: TabGroupProps['tabs'];
12
- withAvatar?: {
13
- props: AvatarDropdownProps<string>;
14
- };
15
- onActionButtonClick?: Callback;
16
- };
17
- export declare const Header: ({ logoUrl, links, onActionButtonClick, tabs, withAvatar }: HeaderProps) => JSX.Element;
18
- export {};
@@ -1,9 +0,0 @@
1
- /// <reference types="react" />
2
- import { ComponentStory } from '@storybook/react';
3
- import { Header as HeaderComponent } from './Header';
4
- declare const _default: {
5
- title: string;
6
- component: ({ logoUrl, links, onActionButtonClick, tabs, withAvatar }: import("./Header").HeaderProps) => JSX.Element;
7
- };
8
- export default _default;
9
- export declare const Header: ComponentStory<typeof HeaderComponent>;
@@ -1,9 +0,0 @@
1
- /// <reference types="react" />
2
- import { ButtonProps, ImageProps } from '../../atoms';
3
- export declare type BannerProps = {
4
- backgroundImage: ImageProps;
5
- title: string;
6
- description?: string;
7
- button?: ButtonProps;
8
- };
9
- export declare const Banner: ({ backgroundImage, button, title, description }: BannerProps) => JSX.Element;
@@ -1,9 +0,0 @@
1
- /// <reference types="react" />
2
- import type { ComponentStory } from '@storybook/react';
3
- import { Banner as BannerComponent } from './Banner';
4
- declare const _default: {
5
- title: string;
6
- component: ({ backgroundImage, button, title, description }: import("./Banner").BannerProps) => JSX.Element;
7
- };
8
- export default _default;
9
- export declare const Banner: ComponentStory<typeof BannerComponent>;
@@ -1,9 +0,0 @@
1
- /// <reference types="react" />
2
- import { IconNames, LinkButtonProps } from '../../atoms';
3
- export declare type InfoBoxProps = {
4
- title: string;
5
- description?: string;
6
- linkButton?: LinkButtonProps;
7
- icon?: IconNames;
8
- };
9
- export declare const InfoBox: ({ title, icon, description, linkButton }: InfoBoxProps) => JSX.Element;
@@ -1,9 +0,0 @@
1
- /// <reference types="react" />
2
- import type { ComponentStory } from '@storybook/react';
3
- import { InfoBox as InfoBoxComponent } from './InfoBox';
4
- declare const _default: {
5
- title: string;
6
- component: ({ title, icon, description, linkButton }: import("./InfoBox").InfoBoxProps) => JSX.Element;
7
- };
8
- export default _default;
9
- export declare const InfoBox: ComponentStory<typeof InfoBoxComponent>;
@@ -1,18 +0,0 @@
1
- /// <reference types="react" />
2
- import type { Callback } from 'typescript';
3
- import { AvatarDropdownProps, TabGroupProps } from '../../molecules';
4
- declare type ImportantLink = {
5
- text: string;
6
- href: string;
7
- };
8
- export declare type HeaderProps = {
9
- links?: ImportantLink[];
10
- logoUrl: string;
11
- tabs: TabGroupProps['tabs'];
12
- withAvatar?: {
13
- props: AvatarDropdownProps<string>;
14
- };
15
- onActionButtonClick?: Callback;
16
- };
17
- export declare const Header: ({ logoUrl, links, onActionButtonClick, tabs, withAvatar }: HeaderProps) => JSX.Element;
18
- export {};
@@ -1,9 +0,0 @@
1
- /// <reference types="react" />
2
- import { ComponentStory } from '@storybook/react';
3
- import { Header as HeaderComponent } from './Header';
4
- declare const _default: {
5
- title: string;
6
- component: ({ logoUrl, links, onActionButtonClick, tabs, withAvatar }: import("./Header").HeaderProps) => JSX.Element;
7
- };
8
- export default _default;
9
- export declare const Header: ComponentStory<typeof HeaderComponent>;