@zealicsolutions/web-ui 0.2.70 → 0.2.71

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 (98) hide show
  1. package/dist/cjs/index.js +3 -3
  2. package/dist/cjs/index.js.map +1 -1
  3. package/dist/cjs/src/atoms/Avatar/Avatar.d.ts +2 -2
  4. package/dist/cjs/src/atoms/Buttons/Button.d.ts +5 -2
  5. package/dist/cjs/src/atoms/Buttons/TextButton.d.ts +3 -12
  6. package/dist/cjs/src/atoms/Icon/Icon.d.ts +18 -15
  7. package/dist/cjs/src/atoms/RegularImage/RegularImage.d.ts +1 -2
  8. package/dist/cjs/src/atoms/Tab/Tab.d.ts +3 -3
  9. package/dist/cjs/src/atoms/Tab/Tab.stories.d.ts +1 -1
  10. package/dist/cjs/src/atoms/Tab/styles.d.ts +3 -2
  11. package/dist/cjs/src/atoms/TextWrapper/TextWrapper.stories.d.ts +1 -1
  12. package/dist/cjs/src/atoms/index.d.ts +0 -1
  13. package/dist/cjs/src/containers/Container.d.ts +4 -0
  14. package/dist/cjs/src/containers/Container.stories.d.ts +9 -0
  15. package/dist/cjs/src/containers/MoleculeItem.d.ts +3 -0
  16. package/dist/cjs/src/containers/OrganismItem.d.ts +5 -0
  17. package/dist/cjs/src/containers/helpers.d.ts +2 -0
  18. package/dist/cjs/src/containers/index.d.ts +5 -0
  19. package/dist/cjs/src/containers/styles.d.ts +8 -0
  20. package/dist/cjs/src/containers/types/moleculeTypes.d.ts +111 -0
  21. package/dist/cjs/src/containers/types/types.d.ts +30 -0
  22. package/dist/cjs/src/helpers/constants.d.ts +6 -3
  23. package/dist/cjs/src/icons/CaretDown.d.ts +1 -1
  24. package/dist/cjs/src/icons/Check.d.ts +1 -1
  25. package/dist/cjs/src/icons/Close.d.ts +1 -1
  26. package/dist/cjs/src/icons/Filter.d.ts +2 -2
  27. package/dist/cjs/src/icons/Hide.d.ts +1 -1
  28. package/dist/cjs/src/icons/Mail.d.ts +1 -1
  29. package/dist/cjs/src/icons/Minus.d.ts +2 -2
  30. package/dist/cjs/src/icons/Mobile.d.ts +2 -2
  31. package/dist/cjs/src/icons/Play.d.ts +1 -1
  32. package/dist/cjs/src/icons/Search.d.ts +1 -1
  33. package/dist/cjs/src/icons/View.d.ts +2 -2
  34. package/dist/cjs/src/icons/Warning.d.ts +1 -1
  35. package/dist/cjs/src/molecules/Columns/styles.d.ts +2 -11
  36. package/dist/cjs/src/molecules/Image/Image.d.ts +2 -3
  37. package/dist/cjs/src/molecules/TabGroup/TabGroup.d.ts +10 -4
  38. package/dist/cjs/src/molecules/TabGroup/TabGroup.stories.d.ts +2 -1
  39. package/dist/cjs/src/molecules/TabGroup/styles.d.ts +9 -5
  40. package/dist/cjs/src/molecules/TextMolecule/TextMolecule.d.ts +3 -1
  41. package/dist/cjs/src/molecules/TextMolecule/TextMolecule.stories.d.ts +1 -1
  42. package/dist/cjs/src/molecules/Video/Video.d.ts +14 -0
  43. package/dist/cjs/src/molecules/Video/Video.stories.d.ts +9 -0
  44. package/dist/cjs/src/molecules/index.d.ts +3 -0
  45. package/dist/cjs/src/theme/types.d.ts +3 -2
  46. package/dist/cjs/src/typescript.d.ts +4 -0
  47. package/dist/esm/index.js +3 -3
  48. package/dist/esm/index.js.map +1 -1
  49. package/dist/esm/src/atoms/Avatar/Avatar.d.ts +2 -2
  50. package/dist/esm/src/atoms/Buttons/Button.d.ts +5 -2
  51. package/dist/esm/src/atoms/Buttons/TextButton.d.ts +3 -12
  52. package/dist/esm/src/atoms/Icon/Icon.d.ts +18 -15
  53. package/dist/esm/src/atoms/RegularImage/RegularImage.d.ts +1 -2
  54. package/dist/esm/src/atoms/Tab/Tab.d.ts +3 -3
  55. package/dist/esm/src/atoms/Tab/Tab.stories.d.ts +1 -1
  56. package/dist/esm/src/atoms/Tab/styles.d.ts +3 -2
  57. package/dist/esm/src/atoms/TextWrapper/TextWrapper.stories.d.ts +1 -1
  58. package/dist/esm/src/atoms/index.d.ts +0 -1
  59. package/dist/esm/src/containers/Container.d.ts +4 -0
  60. package/dist/esm/src/containers/Container.stories.d.ts +9 -0
  61. package/dist/esm/src/containers/MoleculeItem.d.ts +3 -0
  62. package/dist/esm/src/containers/OrganismItem.d.ts +5 -0
  63. package/dist/esm/src/containers/helpers.d.ts +2 -0
  64. package/dist/esm/src/containers/index.d.ts +5 -0
  65. package/dist/esm/src/containers/styles.d.ts +8 -0
  66. package/dist/esm/src/containers/types/moleculeTypes.d.ts +111 -0
  67. package/dist/esm/src/containers/types/types.d.ts +30 -0
  68. package/dist/esm/src/helpers/constants.d.ts +6 -3
  69. package/dist/esm/src/icons/CaretDown.d.ts +1 -1
  70. package/dist/esm/src/icons/Check.d.ts +1 -1
  71. package/dist/esm/src/icons/Close.d.ts +1 -1
  72. package/dist/esm/src/icons/Filter.d.ts +2 -2
  73. package/dist/esm/src/icons/Hide.d.ts +1 -1
  74. package/dist/esm/src/icons/Mail.d.ts +1 -1
  75. package/dist/esm/src/icons/Minus.d.ts +2 -2
  76. package/dist/esm/src/icons/Mobile.d.ts +2 -2
  77. package/dist/esm/src/icons/Play.d.ts +1 -1
  78. package/dist/esm/src/icons/Search.d.ts +1 -1
  79. package/dist/esm/src/icons/View.d.ts +2 -2
  80. package/dist/esm/src/icons/Warning.d.ts +1 -1
  81. package/dist/esm/src/molecules/Columns/styles.d.ts +2 -11
  82. package/dist/esm/src/molecules/Image/Image.d.ts +2 -3
  83. package/dist/esm/src/molecules/TabGroup/TabGroup.d.ts +10 -4
  84. package/dist/esm/src/molecules/TabGroup/TabGroup.stories.d.ts +2 -1
  85. package/dist/esm/src/molecules/TabGroup/styles.d.ts +9 -5
  86. package/dist/esm/src/molecules/TextMolecule/TextMolecule.d.ts +3 -1
  87. package/dist/esm/src/molecules/TextMolecule/TextMolecule.stories.d.ts +1 -1
  88. package/dist/esm/src/molecules/Video/Video.d.ts +14 -0
  89. package/dist/esm/src/molecules/Video/Video.stories.d.ts +9 -0
  90. package/dist/esm/src/molecules/index.d.ts +3 -0
  91. package/dist/esm/src/theme/types.d.ts +3 -2
  92. package/dist/esm/src/typescript.d.ts +4 -0
  93. package/dist/index.d.ts +82 -50
  94. package/package.json +1 -1
  95. package/dist/cjs/src/atoms/Video/Video.d.ts +0 -11
  96. package/dist/cjs/src/atoms/Video/Video.stories.d.ts +0 -9
  97. package/dist/esm/src/atoms/Video/Video.d.ts +0 -11
  98. package/dist/esm/src/atoms/Video/Video.stories.d.ts +0 -9
@@ -0,0 +1,14 @@
1
+ /// <reference types="react" />
2
+ import { FeedContentTemplateTypes } from 'organisms/FeedContent/types';
3
+ import { CSSProperties } from 'styled-components';
4
+ export declare type VideoProps = {
5
+ src: string;
6
+ } & Partial<{
7
+ width: number;
8
+ autoplay: boolean;
9
+ enableCoverImage: boolean;
10
+ coverImageSrc: string;
11
+ style: CSSProperties;
12
+ template: FeedContentTemplateTypes;
13
+ }>;
14
+ export declare const Video: ({ style, src, width, template, autoplay, enableCoverImage, coverImageSrc, }: VideoProps) => JSX.Element;
@@ -0,0 +1,9 @@
1
+ /// <reference types="react" />
2
+ import { StoryFn } from '@storybook/react';
3
+ import { Video as VideoComponent } from './Video';
4
+ declare const _default: {
5
+ title: string;
6
+ component: ({ style, src, width, template, autoplay, enableCoverImage, coverImageSrc, }: import("./Video").VideoProps) => JSX.Element;
7
+ };
8
+ export default _default;
9
+ export declare const Video: StoryFn<typeof VideoComponent>;
@@ -21,3 +21,6 @@ export * from './PdfDocument/PdfDocument';
21
21
  export * from './FeedContentHeader/FeedContentHeader';
22
22
  export * from './HorizontalButtonsField/HorizontalButtonsField';
23
23
  export * from './BottomNavBarItem/BottomNavBarItem';
24
+ export * from './Video/Video';
25
+ export * from './Image/Image';
26
+ export * from './Caruser/Carousel';
@@ -1,7 +1,8 @@
1
- export declare type ThemeColors = 'primary' | 'secondary' | 'background' | 'gray1' | 'gray2' | 'gray3' | 'gray4' | 'gray5' | 'indigo' | 'blue' | 'white' | 'black' | 'indigoTint' | 'indigoTint2' | 'success' | 'error' | 'warning' | 'green' | 'greenTint';
1
+ export declare type ThemeColors = 'primary' | 'secondary' | 'pink' | 'pinkTint' | 'pinkShade' | 'orange' | 'orangeTint' | 'orangeShade' | 'purple' | 'purpleTint' | 'purpleShade' | 'indigo' | 'indigoTint1' | 'indigoTint2' | 'gray1' | 'gray2' | 'gray3' | 'gray4' | 'gray5' | 'green' | 'greenTint' | 'greenShade' | 'yellow' | 'yellowTint' | 'yellowShade' | 'red' | 'redTint' | 'redShade' | 'black' | 'white' | 'blue' | 'blueTint' | 'blueShade' | 'background';
2
2
  export declare type SizesTypes = '5XL' | '4XL' | '3XL' | '2XL' | 'XL' | 'L' | 'M' | 'S' | 'XS';
3
- export declare type FontSizesTypes = Exclude<SizesTypes, 'XL-2XL'> | 'H2' | 'H1';
3
+ export declare type FontSizesTypes = Exclude<SizesTypes, '5XL' | '4XL'>;
4
4
  export declare type BreakpointSizesTypes = 'xs' | 'sm' | 'md' | 'lg' | 'xl';
5
+ export declare type FontWeight = 100 | 200 | 300 | 400 | 500 | 600 | 700 | 800 | 900;
5
6
  export declare type ThemeColorsType = Record<ThemeColors, string>;
6
7
  export declare type ThemeTextType = Record<FontSizesTypes, {
7
8
  'font-weight': string;
@@ -2,3 +2,7 @@ import { DefaultTheme, ThemedCssFunction } from 'styled-components';
2
2
  export declare type StylesType = ReturnType<ThemedCssFunction<DefaultTheme>>;
3
3
  export declare type Callback = () => void;
4
4
  export declare type Nullable<T> = T | null;
5
+ declare type UnionKeys<T> = T extends any ? keyof T : never;
6
+ declare type StrictUnionHelper<T, TAll> = T extends any ? T & Partial<Record<Exclude<UnionKeys<TAll>, keyof T>, never>> : never;
7
+ export declare type StrictUnion<T> = StrictUnionHelper<T, T>;
8
+ export {};
package/dist/index.d.ts CHANGED
@@ -8,7 +8,6 @@ import { Callback as Callback$1, StylesType, Nullable } from 'typescript';
8
8
  import { IconNames as IconNames$1 } from 'atoms/Icon/Icon';
9
9
  import { InputFieldTypes as InputFieldTypes$1, FieldTypes as FieldTypes$1, UIFields as UIFields$1 } from 'fieldsConfiguration/types';
10
10
  import { FontSizesTypes as FontSizesTypes$2, ThemeColors as ThemeColors$2, SizesTypes as SizesTypes$2, BreakpointSizesTypes as BreakpointSizesTypes$1 } from 'theme/types';
11
- import { FeedContentTemplateTypes as FeedContentTemplateTypes$1, FeedContentProps as FeedContentProps$1 } from 'organisms/FeedContent/types';
12
11
  import { TooltipProps as TooltipProps$1 } from 'rc-tooltip/lib/Tooltip';
13
12
  import { WithGoogleMapProps } from 'react-google-maps/lib/withGoogleMap';
14
13
  import { WithScriptjsProps } from 'react-google-maps/lib/withScriptjs';
@@ -19,6 +18,7 @@ import { SelectOption as SelectOption$1 } from 'atoms/Select/types';
19
18
  import { ControllerProps as ControllerProps$1, DeepPartial, FieldValues, FormState, Control as Control$1 } from 'react-hook-form';
20
19
  import { DrawerProps as DrawerProps$1 } from '@mui/material';
21
20
  import { ProcessTrackerStatus as ProcessTrackerStatus$1, FilteredFeedContentType as FilteredFeedContentType$1, ConsentProps as ConsentProps$1, HeroSliderProps as HeroSliderProps$1, ProcessTrackerProps as ProcessTrackerProps$1 } from 'organisms';
21
+ import { FeedContentTemplateTypes as FeedContentTemplateTypes$1, FeedContentProps as FeedContentProps$1 } from 'organisms/FeedContent/types';
22
22
  import { SetPasswordFields, MaxRuleValidation, MinRuleValidation } from 'organisms/SetPasswordForm/types';
23
23
  import { UIFields as UIFields$2 } from 'fieldsConfiguration';
24
24
  import { ConsentProps as ConsentProps$2 } from 'organisms/Consent/Consent';
@@ -36,7 +36,7 @@ import { AnnotationsList as AnnotationsList$1 } from 'contexts/MlrRichTextViewer
36
36
  import * as contexts_MlrRichTextViewerContext_MlrRichTextViewerContext from 'contexts/MlrRichTextViewerContext/MlrRichTextViewerContext';
37
37
  export * from 'helpers/constants';
38
38
 
39
- declare type ButtonVariant = 'primary' | 'secondary' | 'text';
39
+ declare type ButtonVariant = 'primary' | 'secondary' | 'text' | 'custom';
40
40
  declare type BaseButtonProps = PropsWithChildren<{
41
41
  onClick?: Callback$1;
42
42
  variant?: ButtonVariant;
@@ -46,7 +46,8 @@ declare type BaseButtonProps = PropsWithChildren<{
46
46
  buttonFont?: FontSizesTypes$1;
47
47
  textColor?: ThemeColors$1 | string;
48
48
  textSize?: number;
49
- buttonPadding?: SizesTypes$1;
49
+ horizontalPadding?: SizesTypes$1;
50
+ verticalPadding?: SizesTypes$1;
50
51
  buttonColor?: ThemeColors$1 | string;
51
52
  buttonStroke?: ThemeColors$1 | string;
52
53
  cornerRadius?: SizesTypes$1 | number;
@@ -55,6 +56,8 @@ declare type BaseButtonProps = PropsWithChildren<{
55
56
  inactiveButtonColor?: ThemeColors$1 | string;
56
57
  inactiveStrokeColor?: ThemeColors$1 | string;
57
58
  styles?: StylesType;
59
+ colorTheme?: 'light' | 'dark';
60
+ href?: string;
58
61
  }>;
59
62
  declare type ButtonProps = BaseButtonProps & {
60
63
  fullWidth?: boolean;
@@ -150,30 +153,32 @@ declare type IconProps = {
150
153
  color?: ThemeColors$1 | string;
151
154
  fill?: ThemeColors$1 | string;
152
155
  pointerEvents?: 'auto' | 'none';
153
- style?: React.CSSProperties;
156
+ style?: CSSProperties;
154
157
  };
155
158
  declare const availableIcons: {
156
- CaretDown: ({ color, size }: Omit<IconProps, "name">) => JSX.Element;
157
- CaretUp: ({ color, ...props }: Omit<IconProps, "name">) => JSX.Element;
159
+ ArrowRight: ({ color, ...props }: Omit<IconProps, "name">) => JSX.Element;
160
+ Bell: ({ size, color }: Omit<IconProps, "name">) => JSX.Element;
161
+ Bookmark: ({ fill, color, size, ...props }: Omit<IconProps, "name">) => JSX.Element;
162
+ CaretDown: ({ color, size, }: Omit<IconProps, "name">) => JSX.Element;
158
163
  CaretLeft: ({ color, size, ...props }: Omit<IconProps, "name">) => JSX.Element;
159
164
  CaretRight: ({ color, size, ...props }: Omit<IconProps, "name">) => JSX.Element;
160
- Filter: ({ size, color }: Omit<IconProps, "name">) => JSX.Element;
161
- Check: ({ size, color }: Omit<IconProps, "name">) => JSX.Element;
162
- Info: ({ size, color }: Omit<IconProps, "name">) => JSX.Element;
163
- View: ({ color, size }: Omit<IconProps, "name">) => JSX.Element;
165
+ CaretUp: ({ color, ...props }: Omit<IconProps, "name">) => JSX.Element;
166
+ Check: ({ size, color, }: Omit<IconProps, "name">) => JSX.Element;
167
+ Close: ({ size, color, }: Omit<IconProps, "name">) => JSX.Element;
168
+ Edit: ({ size, color }: Omit<IconProps, "name">) => JSX.Element;
169
+ Filter: ({ size, color, }: Omit<IconProps, "name">) => JSX.Element;
164
170
  Hide: ({ color, size }: Omit<IconProps, "name">) => JSX.Element;
165
- Close: ({ size, color }: Omit<IconProps, "name">) => JSX.Element;
166
- Play: ({ size, color }: Omit<IconProps, "name">) => JSX.Element;
167
- Minus: ({ size, color }: Omit<IconProps, "name">) => JSX.Element;
171
+ Info: ({ size, color }: Omit<IconProps, "name">) => JSX.Element;
168
172
  InfoBoxIcon: ({ color, size }: Omit<IconProps, "name">) => JSX.Element;
169
- Warning: ({ size, color }: Omit<IconProps, "name">) => JSX.Element;
170
- Bell: ({ size, color }: Omit<IconProps, "name">) => JSX.Element;
171
- Mobile: ({ size, color }: Omit<IconProps, "name">) => JSX.Element;
172
173
  Mail: ({ size, color }: Omit<IconProps, "name">) => JSX.Element;
173
174
  Menu: ({ size, color }: Omit<IconProps, "name">) => JSX.Element;
175
+ Minus: ({ size, color, }: Omit<IconProps, "name">) => JSX.Element;
176
+ Mobile: ({ size, color, }: Omit<IconProps, "name">) => JSX.Element;
177
+ Play: ({ size, color }: Omit<IconProps, "name">) => JSX.Element;
178
+ Save: ({ size, color }: Omit<IconProps, "name">) => JSX.Element;
174
179
  Search: ({ size, color, ...props }: Omit<IconProps, "name">) => JSX.Element;
175
- Bookmark: ({ fill, color, size, ...props }: Omit<IconProps, "name">) => JSX.Element;
176
- ArrowRight: ({ color, ...props }: Omit<IconProps, "name">) => JSX.Element;
180
+ View: ({ color, size, }: Omit<IconProps, "name">) => JSX.Element;
181
+ Warning: ({ size, color, }: Omit<IconProps, "name">) => JSX.Element;
177
182
  };
178
183
  declare type IconNames = keyof typeof availableIcons;
179
184
  declare const Icon: ({ name, color, ...props }: IconProps) => JSX.Element;
@@ -195,29 +200,20 @@ declare type RegularImageProps = {
195
200
  alt?: string;
196
201
  width?: number | string;
197
202
  height?: number | string;
198
- styles?: StylesType;
199
203
  onClick?: Callback$1;
200
204
  cornerRadius?: number;
201
205
  };
202
206
  declare const RegularImage: styled_components.StyledComponent<"img", styled_components.DefaultTheme, RegularImageProps, never>;
203
207
  declare const BackgroundImage: styled_components.StyledComponent<"img", styled_components.DefaultTheme, RegularImageProps, never>;
204
208
 
205
- declare type TextButtonProps = Pick<BaseButtonProps, 'disabled' | 'onClick' | 'children' | 'styles' | 'buttonPadding' | 'textColor' | 'textSize' | 'buttonFont'> & {
209
+ declare type TextButtonProps = Pick<BaseButtonProps, 'disabled' | 'onClick' | 'children' | 'colorTheme' | 'size'> & {
206
210
  buttonLink?: string;
207
211
  elementId?: string;
208
212
  };
209
- declare const TextButton: styled_components.StyledComponent<"div", styled_components.DefaultTheme, {
210
- activeOpacity?: number | undefined;
211
- withoutOpacityEffect?: boolean | undefined;
212
- disabled?: boolean | undefined;
213
- } & {
214
- children?: React$1.ReactNode;
215
- } & {
216
- withoutOpacityEffect: boolean;
217
- } & Pick<BaseButtonProps, "disabled" | "onClick" | "textSize" | "textColor" | "styles" | "children" | "buttonPadding" | "buttonFont"> & {
213
+ declare const TextButton: styled_components.StyledComponent<"a", styled_components.DefaultTheme, Pick<BaseButtonProps, "children" | "onClick" | "disabled" | "size" | "colorTheme"> & {
218
214
  buttonLink?: string | undefined;
219
215
  elementId?: string | undefined;
220
- }, "withoutOpacityEffect">;
216
+ }, never>;
221
217
 
222
218
  declare type ValidationTagStatus = 'DEFAULT' | 'ERROR' | 'SUCCESS';
223
219
  declare type ValidationTagProps = {
@@ -226,15 +222,6 @@ declare type ValidationTagProps = {
226
222
  };
227
223
  declare const ValidationTag: ({ text, status }: ValidationTagProps) => JSX.Element;
228
224
 
229
- declare type VideoProps = {
230
- src: string;
231
- style?: CSSProperties;
232
- template?: FeedContentTemplateTypes$1;
233
- autoplay?: boolean;
234
- coverImage?: string;
235
- };
236
- declare const Video: ({ style, src, template, autoplay, coverImage }: VideoProps) => JSX.Element;
237
-
238
225
  declare type TooltipProps = Pick<TooltipProps$1, 'overlay' | 'placement' | 'trigger' | 'visible' | 'children'>;
239
226
  declare const StyleWrapper: styled_components.StyledComponent<"div", styled_components.DefaultTheme, {}, never>;
240
227
  declare const Tooltip: ({ trigger, placement, ...props }: TooltipProps) => JSX.Element;
@@ -267,7 +254,7 @@ declare type AvatarProps = {
267
254
  backgroundColor?: ThemeColors$1;
268
255
  textConfig?: {
269
256
  color?: ThemeColors$1;
270
- font?: SizesTypes$1;
257
+ font?: FontSizesTypes$1;
271
258
  };
272
259
  content: {
273
260
  initials?: string;
@@ -384,12 +371,12 @@ declare type TabProps<T = string, K = string> = {
384
371
  tabFont: FontSizesTypes$1;
385
372
  textSize: number;
386
373
  tabPadding: SizesTypes$1 | number;
387
- textColor: ThemeColors$1 | string;
374
+ defaultTabTextColor: ThemeColors$1 | string;
388
375
  selectedTabTextColor: ThemeColors$1 | string;
389
376
  selectedTabIndicatorColor: ThemeColors$1 | string;
390
377
  styles: StylesType;
391
378
  }>;
392
- declare const ZealTab: <T extends string, K extends string>({ options, onClick, text, tabKey, vertical, onOptionClick, tabTheme, tabFont, tabPadding, selectedTabIndicatorColor, textSize, textColor, ...tabProps }: TabProps<T, K>, ref: React__default.ForwardedRef<TabElement>) => JSX.Element;
379
+ 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;
393
380
  declare const Tab: <T, K>(props: {
394
381
  tabKey: T;
395
382
  text: string;
@@ -405,7 +392,7 @@ declare const Tab: <T, K>(props: {
405
392
  tabFont: FontSizesTypes$1;
406
393
  textSize: number;
407
394
  tabPadding: SizesTypes$1 | number;
408
- textColor: ThemeColors$1 | string;
395
+ defaultTabTextColor: ThemeColors$1 | string;
409
396
  selectedTabTextColor: ThemeColors$1 | string;
410
397
  selectedTabIndicatorColor: ThemeColors$1 | string;
411
398
  styles: styled_components.FlattenInterpolation<styled_components.ThemedStyledProps<object, styled_components.DefaultTheme>>;
@@ -600,6 +587,10 @@ declare type AvatarDropdownProps<T> = {
600
587
  declare const AvatarDropdown: <T extends string | number>({ avatarProps, menuConfig, }: AvatarDropdownProps<T>) => JSX.Element;
601
588
 
602
589
  declare type TabType<T = string, K = string> = Pick<TabProps$1<T, K>, 'text' | 'tabKey' | 'disabled' | 'options' | 'divider'>;
590
+ declare type AdditionalTabContainerProps = {
591
+ containerStyle?: CSSProperties;
592
+ containerProps?: Record<string, unknown>;
593
+ };
603
594
  declare type TabGroupProps<T = string, K = string> = {
604
595
  tabs: TabType<T, K>[];
605
596
  activeTabKey: T;
@@ -612,13 +603,13 @@ declare type TabGroupProps<T = string, K = string> = {
612
603
  textSize?: number;
613
604
  tabPadding?: SizesTypes$2 | number;
614
605
  tabSpacing?: SizesTypes$2;
615
- textColor?: ThemeColors$2 | string;
606
+ defaultTabTextColor?: ThemeColors$2 | string;
616
607
  selectedTabTextColor?: ThemeColors$2 | string;
617
608
  selectedTabIndicatorColor?: ThemeColors$2 | string;
618
- containerStyle?: CSSProperties;
619
- containerProps?: Record<string, unknown>;
609
+ wide?: AdditionalTabContainerProps;
610
+ compact?: AdditionalTabContainerProps;
620
611
  };
621
- declare const TabGroup: <T extends string, K extends string>({ tabs, vertical, activeTabKey, onTabChange, tabTheme, containerStyle, containerProps, tabSpacing, ...props }: TabGroupProps<T, K>) => JSX.Element;
612
+ declare const TabGroup: <T extends string, K extends string>({ tabs, vertical, activeTabKey, onTabChange, tabTheme, wide, compact, tabSpacing, ...props }: TabGroupProps<T, K>) => JSX.Element;
622
613
 
623
614
  declare type FieldSectionProps<T extends object> = {
624
615
  label: string;
@@ -731,6 +722,46 @@ declare type BottomNaVBarItemProps = {
731
722
  };
732
723
  declare const BottomNavBarItem: ({ name, icon: IconComponent, active, activeColor, onNavigate, }: BottomNaVBarItemProps) => JSX.Element;
733
724
 
725
+ declare type VideoProps = {
726
+ src: string;
727
+ } & Partial<{
728
+ width: number;
729
+ autoplay: boolean;
730
+ enableCoverImage: boolean;
731
+ coverImageSrc: string;
732
+ style: CSSProperties;
733
+ template: FeedContentTemplateTypes$1;
734
+ }>;
735
+ declare const Video: ({ style, src, width, template, autoplay, enableCoverImage, coverImageSrc, }: VideoProps) => JSX.Element;
736
+
737
+ declare type ImageProps = {
738
+ src: string;
739
+ } & Partial<{
740
+ altText: string;
741
+ link: string;
742
+ width: number;
743
+ height: number;
744
+ cornerRadius: number;
745
+ behaveAs: 'background' | 'regular';
746
+ styles: CSSProperties$1;
747
+ }>;
748
+ declare const Image: ({ src, link, altText, styles, width, height, behaveAs, cornerRadius, }: ImageProps) => JSX.Element;
749
+
750
+ declare type CarouselProps = {
751
+ children: JSX.Element[];
752
+ };
753
+ declare const Carousel: ({ children }: PropsWithChildren<CarouselProps>) => JSX.Element;
754
+ declare const Wrapper: styled_components.StyledComponent<"section", styled_components.DefaultTheme, {}, never>;
755
+ declare const SlidesWrapper: styled_components.StyledComponent<"ul", styled_components.DefaultTheme, {
756
+ translateX: number;
757
+ }, never>;
758
+ declare const Slide: styled_components.StyledComponent<"li", styled_components.DefaultTheme, {}, never>;
759
+ declare const ButtonsWrapper: styled_components.StyledComponent<"div", styled_components.DefaultTheme, {}, never>;
760
+ declare const ArrowIconWrapper: styled_components.StyledComponent<"div", styled_components.DefaultTheme, {
761
+ arrowSide: 'left' | 'right';
762
+ }, never>;
763
+ declare const NavigationDotsWrapper: styled_components.StyledComponent<"div", styled_components.DefaultTheme, {}, never>;
764
+
734
765
  declare type SetPasswordRuleValidation = {
735
766
  label: string;
736
767
  rule: MaxRuleValidation | MinRuleValidation;
@@ -1055,10 +1086,11 @@ declare const ZealThemeProvider: (props: PropsWithChildren<{
1055
1086
  theme?: DefaultTheme;
1056
1087
  }>) => JSX.Element;
1057
1088
 
1058
- declare type ThemeColors = 'primary' | 'secondary' | 'background' | 'gray1' | 'gray2' | 'gray3' | 'gray4' | 'gray5' | 'indigo' | 'blue' | 'white' | 'black' | 'indigoTint' | 'indigoTint2' | 'success' | 'error' | 'warning' | 'green' | 'greenTint';
1089
+ declare type ThemeColors = 'primary' | 'secondary' | 'pink' | 'pinkTint' | 'pinkShade' | 'orange' | 'orangeTint' | 'orangeShade' | 'purple' | 'purpleTint' | 'purpleShade' | 'indigo' | 'indigoTint1' | 'indigoTint2' | 'gray1' | 'gray2' | 'gray3' | 'gray4' | 'gray5' | 'green' | 'greenTint' | 'greenShade' | 'yellow' | 'yellowTint' | 'yellowShade' | 'red' | 'redTint' | 'redShade' | 'black' | 'white' | 'blue' | 'blueTint' | 'blueShade' | 'background';
1059
1090
  declare type SizesTypes = '5XL' | '4XL' | '3XL' | '2XL' | 'XL' | 'L' | 'M' | 'S' | 'XS';
1060
- declare type FontSizesTypes = Exclude<SizesTypes, 'XL-2XL'> | 'H2' | 'H1';
1091
+ declare type FontSizesTypes = Exclude<SizesTypes, '5XL' | '4XL'>;
1061
1092
  declare type BreakpointSizesTypes = 'xs' | 'sm' | 'md' | 'lg' | 'xl';
1093
+ declare type FontWeight = 100 | 200 | 300 | 400 | 500 | 600 | 700 | 800 | 900;
1062
1094
  declare type ThemeColorsType = Record<ThemeColors, string>;
1063
1095
  declare type ThemeTextType = Record<FontSizesTypes, {
1064
1096
  'font-weight': string;
@@ -1106,4 +1138,4 @@ declare type AnnotationsList = {
1106
1138
 
1107
1139
  declare const useMlrRichTextViewerContext: () => contexts_MlrRichTextViewerContext_MlrRichTextViewerContext.MlrRichTextViewerContextType;
1108
1140
 
1109
- export { AcquisitionForm, AcquisitionFormProps, Alert, AlertProps, AnnotationsList, AuthMethod, Avatar, AvatarDropdown, AvatarDropdownProps, AvatarProps, BackgroundImage, BaseButtonProps, Body, BodyProps, BottomNaVBarItemProps, BottomNavBarItem, BottomNavBarNavigation, BottomNavBarNavigationProps, BreakpointSizesTypes, Button, ButtonProps, ButtonVariant, COMMUNICATION_LINK_DATA_TEXT, COMMUNICATION_LINK_DATA_URL, COMMUNICATION_LINK_ELEMENT_ID, CaretIconWrapper, CheckBoxProps, Checkbox, CheckboxField, CheckboxFieldProps, Circle, CircleBoxProps, CircularIndicator, CircularIndicatorProps, CircularIndicatorStyledComponent, ColumnItem, Columns, ColumnsProps, Consent, ConsentProps, CustomValidation, CustomValidationProps, CustomValidationRule, DefaultTemplate, DefaultTemplateProps, Divider, DividerProps, Drawer, DynamicContentZone, DynamicContentZoneProps, DynamicElementProps, EmphasizedText, EmphasizedTextProps, FeedContent, FeedContentContainer, FeedContentContainerProps, FeedContentHeader, FeedContentHeaderProps, FeedTemplateKeys, FieldLabels, FieldLabelsProps, FieldMapper, FieldMapperProps, FieldRuleLabelTypes, FieldSection, FieldSectionProps, FieldTypes, FilteredFeedContentType, FontSizesTypes, 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, Input, InputField, InputFieldProps, InputFieldTypes, InputIconProps, InputProps, LoginForm, LoginFormProps, MATRIX_MESSAGE_DATA_ID, MATRIX_MESSAGE_ELEMENT_ID, MapPosition, MenuItem, MenuItems, MenuItemsProps, MenuNavigation, MenuNavigationProps, MlrRichTextViewerContext, MlrRichTextViewerContextType, MlrRichTextViewerProvider, MlrRichTextViewerProviderProps, OrientationType, PdfDocument, PdfDocumentProps, ProcessTracker, ProcessTrackerProps, ProcessTrackerStatus, ProfileInformation, ProfileInformationProps, RadioButtonField, RadioButtonFieldProps, RadioButtonType, RadioButtons, RadioButtonsProps, RegularImage, RegularImageProps, RichTextEditorProps, RichTextViewer, Select, SelectField, SelectFieldProps, SelectableCardGroup, SelectableCardGroupProps, SeoTags, SetPasswordForm, SetPasswordFormProps, SetPasswordRuleValidation, SizesTypes, Spacer, SpacerProps, Spinner, Stepper, StepperProps, StyleWrapper, SubscribePanel, Tab, TabGroup, TabGroupProps, TabOption, TabProps, TabTheme, TabType, TextAlign, TextButton, TextButtonProps, TextProps, TextTypes, TextWrapper, TextWrapperProps, ThemeColors, ThemeColorsType, ThemeDevicesType, ThemeSizesType, ThemeTextType, Tooltip, TooltipProps, TouchableOpacity, TouchableOpacityProps, TwoFactorAuth, TwoFactorAuthProps, UICheckboxField, UIField, UIFields, UIInputField, UISelectField, ValidationTag, ValidationTagProps, ValidationTagStatus, VerticalPadding, Video, VideoProps, ZealTheme, ZealThemeProvider, acquisitionFormMockFields, defaultTheme, getFieldPlaceholder, getFieldsFromFieldSections, getInitialValuesFromFields, isFormValid, loginMockFields, profileInformationMockForm, sectionMockFields, setPasswordMockFields, showAcceptToastMessage, toast, toastStyles, useMediaQuery, useMlrRichTextViewerContext, useRequiredConsentsAcceptedValues, useStep };
1141
+ export { AcquisitionForm, AcquisitionFormProps, Alert, AlertProps, AnnotationsList, ArrowIconWrapper, AuthMethod, Avatar, AvatarDropdown, AvatarDropdownProps, AvatarProps, BackgroundImage, BaseButtonProps, Body, BodyProps, BottomNaVBarItemProps, BottomNavBarItem, BottomNavBarNavigation, BottomNavBarNavigationProps, BreakpointSizesTypes, Button, ButtonProps, ButtonVariant, ButtonsWrapper, COMMUNICATION_LINK_DATA_TEXT, COMMUNICATION_LINK_DATA_URL, COMMUNICATION_LINK_ELEMENT_ID, CaretIconWrapper, Carousel, CarouselProps, CheckBoxProps, Checkbox, CheckboxField, CheckboxFieldProps, Circle, CircleBoxProps, CircularIndicator, CircularIndicatorProps, CircularIndicatorStyledComponent, ColumnItem, Columns, ColumnsProps, Consent, ConsentProps, CustomValidation, CustomValidationProps, CustomValidationRule, DefaultTemplate, DefaultTemplateProps, Divider, DividerProps, Drawer, DynamicContentZone, DynamicContentZoneProps, DynamicElementProps, EmphasizedText, EmphasizedTextProps, 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, ImageProps, Input, InputField, InputFieldProps, InputFieldTypes, InputIconProps, InputProps, LoginForm, LoginFormProps, MATRIX_MESSAGE_DATA_ID, MATRIX_MESSAGE_ELEMENT_ID, MapPosition, MenuItem, MenuItems, MenuItemsProps, MenuNavigation, MenuNavigationProps, MlrRichTextViewerContext, MlrRichTextViewerContextType, MlrRichTextViewerProvider, MlrRichTextViewerProviderProps, NavigationDotsWrapper, OrientationType, PdfDocument, PdfDocumentProps, ProcessTracker, ProcessTrackerProps, ProcessTrackerStatus, ProfileInformation, ProfileInformationProps, RadioButtonField, RadioButtonFieldProps, RadioButtonType, RadioButtons, RadioButtonsProps, RegularImage, RegularImageProps, RichTextEditorProps, RichTextViewer, Select, SelectField, SelectFieldProps, SelectableCardGroup, SelectableCardGroupProps, SeoTags, SetPasswordForm, SetPasswordFormProps, SetPasswordRuleValidation, SizesTypes, Slide, SlidesWrapper, Spacer, SpacerProps, Spinner, Stepper, StepperProps, StyleWrapper, SubscribePanel, Tab, TabGroup, TabGroupProps, TabOption, TabProps, TabTheme, TabType, TextAlign, TextButton, TextButtonProps, TextProps, TextTypes, TextWrapper, TextWrapperProps, ThemeColors, ThemeColorsType, ThemeDevicesType, ThemeSizesType, ThemeTextType, Tooltip, TooltipProps, TouchableOpacity, TouchableOpacityProps, TwoFactorAuth, TwoFactorAuthProps, UICheckboxField, UIField, UIFields, UIInputField, UISelectField, ValidationTag, ValidationTagProps, ValidationTagStatus, VerticalPadding, Video, VideoProps, Wrapper, ZealTheme, ZealThemeProvider, acquisitionFormMockFields, defaultTheme, getFieldPlaceholder, getFieldsFromFieldSections, getInitialValuesFromFields, isFormValid, loginMockFields, profileInformationMockForm, sectionMockFields, setPasswordMockFields, showAcceptToastMessage, toast, toastStyles, useMediaQuery, useMlrRichTextViewerContext, useRequiredConsentsAcceptedValues, useStep };
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@zealicsolutions/web-ui",
3
- "version": "0.2.70",
3
+ "version": "0.2.71",
4
4
  "repository": {
5
5
  "type": "git",
6
6
  "url": "git+ssh://git@bitbucket.org/Zealic_Solutions/zeal-ui-web.git"
@@ -1,11 +0,0 @@
1
- /// <reference types="react" />
2
- import { FeedContentTemplateTypes } from 'organisms/FeedContent/types';
3
- import { CSSProperties } from 'styled-components';
4
- export declare type VideoProps = {
5
- src: string;
6
- style?: CSSProperties;
7
- template?: FeedContentTemplateTypes;
8
- autoplay?: boolean;
9
- coverImage?: string;
10
- };
11
- export declare const Video: ({ style, src, template, autoplay, coverImage }: VideoProps) => JSX.Element;
@@ -1,9 +0,0 @@
1
- /// <reference types="react" />
2
- import { ComponentStory } from '@storybook/react';
3
- import { Video as VideoComponent } from './Video';
4
- declare const _default: {
5
- title: string;
6
- component: ({ style, src, template, autoplay, coverImage }: import("./Video").VideoProps) => JSX.Element;
7
- };
8
- export default _default;
9
- export declare const Video: ComponentStory<typeof VideoComponent>;
@@ -1,11 +0,0 @@
1
- /// <reference types="react" />
2
- import { FeedContentTemplateTypes } from 'organisms/FeedContent/types';
3
- import { CSSProperties } from 'styled-components';
4
- export declare type VideoProps = {
5
- src: string;
6
- style?: CSSProperties;
7
- template?: FeedContentTemplateTypes;
8
- autoplay?: boolean;
9
- coverImage?: string;
10
- };
11
- export declare const Video: ({ style, src, template, autoplay, coverImage }: VideoProps) => JSX.Element;
@@ -1,9 +0,0 @@
1
- /// <reference types="react" />
2
- import { ComponentStory } from '@storybook/react';
3
- import { Video as VideoComponent } from './Video';
4
- declare const _default: {
5
- title: string;
6
- component: ({ style, src, template, autoplay, coverImage }: import("./Video").VideoProps) => JSX.Element;
7
- };
8
- export default _default;
9
- export declare const Video: ComponentStory<typeof VideoComponent>;