@zealicsolutions/web-ui 0.3.7 → 0.3.9

Sign up to get free protection for your applications and to get access to all the features.
Files changed (40) hide show
  1. package/dist/cjs/index.css +246 -246
  2. package/dist/cjs/index.js +26 -26
  3. package/dist/cjs/index.js.map +1 -1
  4. package/dist/cjs/src/containers/MoleculeItem.d.ts +1 -0
  5. package/dist/cjs/src/containers/mock-data.d.ts +1 -0
  6. package/dist/cjs/src/containers/types/moleculeTypes.d.ts +56 -2
  7. package/dist/cjs/src/containers/types/types.d.ts +7 -4
  8. package/dist/cjs/src/contexts/ButtonActionsContext/ButtonActionsContext.d.ts +11 -0
  9. package/dist/cjs/src/contexts/ButtonActionsContext/ButtonActionsContextProvider.d.ts +11 -0
  10. package/dist/cjs/src/contexts/hooks/useButtonActionsContext.d.ts +1 -0
  11. package/dist/cjs/src/contexts/index.d.ts +3 -0
  12. package/dist/cjs/src/molecules/Button/Button.d.ts +1 -2
  13. package/dist/cjs/src/molecules/CheckboxField/CheckboxField.stories.d.ts +1 -18
  14. package/dist/cjs/src/molecules/InputField/InputField.stories.d.ts +1 -18
  15. package/dist/cjs/src/molecules/RadioButtonField/RadioButtonField.stories.d.ts +1 -18
  16. package/dist/cjs/src/molecules/SelectField/SelectField.stories.d.ts +1 -18
  17. package/dist/cjs/src/molecules/ZealUIModal/ZealUIModal.d.ts +13 -0
  18. package/dist/cjs/src/molecules/index.d.ts +1 -0
  19. package/dist/cjs/src/typescript.d.ts +3 -0
  20. package/dist/esm/index.css +246 -246
  21. package/dist/esm/index.js +12 -12
  22. package/dist/esm/index.js.map +1 -1
  23. package/dist/esm/src/containers/MoleculeItem.d.ts +1 -0
  24. package/dist/esm/src/containers/mock-data.d.ts +1 -0
  25. package/dist/esm/src/containers/types/moleculeTypes.d.ts +56 -2
  26. package/dist/esm/src/containers/types/types.d.ts +7 -4
  27. package/dist/esm/src/contexts/ButtonActionsContext/ButtonActionsContext.d.ts +11 -0
  28. package/dist/esm/src/contexts/ButtonActionsContext/ButtonActionsContextProvider.d.ts +11 -0
  29. package/dist/esm/src/contexts/hooks/useButtonActionsContext.d.ts +1 -0
  30. package/dist/esm/src/contexts/index.d.ts +3 -0
  31. package/dist/esm/src/molecules/Button/Button.d.ts +1 -2
  32. package/dist/esm/src/molecules/CheckboxField/CheckboxField.stories.d.ts +1 -18
  33. package/dist/esm/src/molecules/InputField/InputField.stories.d.ts +1 -18
  34. package/dist/esm/src/molecules/RadioButtonField/RadioButtonField.stories.d.ts +1 -18
  35. package/dist/esm/src/molecules/SelectField/SelectField.stories.d.ts +1 -18
  36. package/dist/esm/src/molecules/ZealUIModal/ZealUIModal.d.ts +13 -0
  37. package/dist/esm/src/molecules/index.d.ts +1 -0
  38. package/dist/esm/src/typescript.d.ts +3 -0
  39. package/dist/index.d.ts +140 -48
  40. package/package.json +1 -1
@@ -3,6 +3,7 @@ import { Molecule } from 'containers';
3
3
  import { TabGroupProps } from 'molecules';
4
4
  export declare const getFullLink: (url: string) => string;
5
5
  export declare const navigateToPage: (url: string) => void;
6
+ export declare const downloadFile: (url?: string, name?: string) => Promise<void>;
6
7
  export declare const MoleculeItem: ({ type, config, attributes, tabsProps, form, id: moleculeId, }: Molecule & {
7
8
  tabsProps?: Pick<TabGroupProps<string, string>, "tabs" | "activeTabKey" | "onTabChange"> | undefined;
8
9
  }) => JSX.Element;
@@ -1,3 +1,4 @@
1
1
  import { ContainerComponentProps } from 'containers';
2
+ export declare const sliderContainerProps: ContainerComponentProps;
2
3
  export declare const formContainerProps: ContainerComponentProps;
3
4
  export declare const columnContainerProps: ContainerComponentProps;
@@ -2,12 +2,56 @@ import { SelectOption } from 'atoms';
2
2
  import { AdditionalTabContainerProps, ButtonProps, CheckboxFieldProps, ImageProps, InputFieldProps, RadioButtonFieldProps, SelectFieldProps, TabGroupProps, TextMoleculeProps } from 'molecules';
3
3
  import { UseFormReturn } from 'react-hook-form';
4
4
  import { CSSProperties } from 'styled-components';
5
- import type { Nullable, StrictUnion } from 'typescript';
5
+ import type { AnyObject, Nullable, StrictUnion } from 'typescript';
6
+ import { ContainerComponentProps } from './types';
7
+ export declare type ActionTypes = 'link' | 'popup' | 'drawer' | 'download' | 'submit' | 'reset' | 'destroy';
8
+ export declare type FileType = 'image' | 'video' | 'document' | 'audio';
9
+ export declare type ContentStatus = 'in_use' | 'draft';
10
+ export declare type FileMatrixMessageDTO = Readonly<Partial<{
11
+ id: string;
12
+ text: string;
13
+ label: string;
14
+ locationId: string;
15
+ }>>;
16
+ export declare type FileObjectDTO = Readonly<Partial<{
17
+ id: string;
18
+ name: string;
19
+ fileType: FileType;
20
+ description: string;
21
+ originalName: string;
22
+ url: string;
23
+ size: number;
24
+ type: FileType;
25
+ updatedAt: string;
26
+ createdAt: string;
27
+ status: ContentStatus;
28
+ tags: FileMatrixMessageDTO[];
29
+ }>> | null;
30
+ declare type LinkAction = Omit<LinkAttributes, 'attributeType'>;
31
+ declare type PopupDrawerAction = ContainerComponentProps;
32
+ declare type DownloadAction = FileObjectDTO;
33
+ declare type SubmitAction = AnyObject;
34
+ declare type CancelAction = AnyObject;
35
+ declare type ResetAction = AnyObject;
36
+ declare type DestroyAction = AnyObject;
37
+ declare type Action = {
38
+ type: ActionTypes;
39
+ } & Partial<{
40
+ link: LinkAction;
41
+ popup: PopupDrawerAction;
42
+ drawer: PopupDrawerAction;
43
+ download: DownloadAction;
44
+ submit: SubmitAction;
45
+ cancel: CancelAction;
46
+ reset: ResetAction;
47
+ destroy: DestroyAction;
48
+ }>;
6
49
  export declare type ImageAttributes = {
7
50
  attributeType: 'image';
8
51
  imageSource: string;
9
52
  };
10
53
  export interface TextAttributes {
54
+ id?: string;
11
55
  attributeType: 'text';
12
56
  isRichText: boolean;
13
57
  text: string;
@@ -16,6 +60,10 @@ export interface VideoAttributes {
16
60
  attributeType: 'video';
17
61
  videoSource: string;
18
62
  }
63
+ export interface ActionAttributes {
64
+ attributeType: 'action';
65
+ action: Action;
66
+ }
19
67
  export interface LinkAttributes {
20
68
  id: string;
21
69
  attributeType: 'link';
@@ -25,6 +73,7 @@ export interface LinkAttributes {
25
73
  name: string;
26
74
  }
27
75
  export interface SelectAttributes {
76
+ id?: string;
28
77
  attributeType: 'select';
29
78
  value: string;
30
79
  options: SelectOption[];
@@ -42,6 +91,10 @@ export interface BaseMolecule {
42
91
  id: string;
43
92
  instance: 'molecule';
44
93
  type: MoleculeTypes;
94
+ metadata?: AnyObject;
95
+ idForFrontend?: string;
96
+ moleculeLibraryId?: string;
97
+ organismLibraryMoleculeId?: string;
45
98
  }
46
99
  export interface ImageMolecule extends BaseMolecule {
47
100
  type: 'image';
@@ -68,7 +121,7 @@ export interface ButtonMolecule extends BaseMolecule {
68
121
  type: 'button';
69
122
  attributes: {
70
123
  title: TextAttributes;
71
- buttonLink: LinkAttributes;
124
+ action: ActionAttributes;
72
125
  };
73
126
  config: {
74
127
  props: Partial<Omit<ButtonProps, 'disabled' | 'children' | 'link' | 'text' | 'onClick' | 'elementId'>>;
@@ -153,3 +206,4 @@ export interface CheckboxFieldMolecule extends BaseMolecule {
153
206
  export declare type Molecule = StrictUnion<ImageMolecule | TextMoleculeType | ButtonMolecule | VideoMolecule | TabGroupMolecule | TextInputMolecule | SelectFieldMolecule | RadioButtonFieldMolecule | CheckboxFieldMolecule> & {
154
207
  form?: UseFormReturn<any>;
155
208
  };
209
+ export {};
@@ -1,11 +1,11 @@
1
1
  import { TabGroupProps } from 'molecules';
2
2
  import { PropsWithChildren } from 'react';
3
3
  import { CSSProperties } from 'styled-components';
4
- import { Molecule } from './moleculeTypes';
5
4
  import { ValidationMode } from 'react-hook-form';
6
- import { StylesType } from 'typescript';
5
+ import type { AnyObject, StylesType } from 'typescript';
6
+ import { Molecule } from './moleculeTypes';
7
7
  export declare type ContainerType = 'row' | 'column' | 'slider' | 'form';
8
- export declare type ContainerPositionType = 'fixed' | 'sticky' | 'static';
8
+ export declare type ContainerPositionType = 'fixed' | 'sticky' | 'static' | 'relative';
9
9
  export declare type ContainerScrollBehaviourType = 'vertical' | 'horizontal' | 'auto' | 'none';
10
10
  export declare type ContainerPropsType = Partial<{
11
11
  position: ContainerPositionType;
@@ -30,11 +30,14 @@ export declare type ContainerComponentProps = {
30
30
  id: string;
31
31
  instance: 'container';
32
32
  type: ContainerType;
33
+ items: (ContainerComponentProps | Molecule)[];
33
34
  config: {
34
35
  wide?: AdditionalContainerProps;
35
36
  compact?: AdditionalContainerProps;
36
37
  props?: ContainerPropsType;
37
38
  };
38
- items: (ContainerComponentProps | Molecule)[];
39
39
  tabsProps?: Pick<TabGroupProps, 'tabs' | 'activeTabKey' | 'onTabChange'>;
40
+ metadata?: AnyObject;
41
+ attributes?: AnyObject;
42
+ containerLibraryId?: string;
40
43
  };
@@ -0,0 +1,11 @@
1
+ import { Dispatch, SetStateAction } from 'react';
2
+ import { ContainerComponentProps } from 'containers';
3
+ export declare type ButtonActionsContextType = {
4
+ actionContent?: ContainerComponentProps;
5
+ setActionContent: Dispatch<SetStateAction<ContainerComponentProps>>;
6
+ isModalVisible: boolean;
7
+ setModalVisible: Dispatch<SetStateAction<boolean>>;
8
+ isDrawerVisible: boolean;
9
+ setDrawerVisible: Dispatch<SetStateAction<boolean>>;
10
+ };
11
+ export declare const ButtonActionsContext: import("react").Context<ButtonActionsContextType>;
@@ -0,0 +1,11 @@
1
+ import { Dispatch, PropsWithChildren, SetStateAction } from 'react';
2
+ import { ContainerComponentProps } from 'containers';
3
+ export declare type ButtonActionsProviderProps = PropsWithChildren<Partial<{
4
+ actionContent: ContainerComponentProps;
5
+ setActionContent: Dispatch<SetStateAction<ContainerComponentProps>>;
6
+ isModalVisible: boolean;
7
+ setModalVisible: Dispatch<SetStateAction<boolean>>;
8
+ setDrawerVisible: Dispatch<SetStateAction<boolean>>;
9
+ isDrawerVisible: boolean;
10
+ }>>;
11
+ export declare const ButtonActionsProvider: ({ children }: ButtonActionsProviderProps) => JSX.Element;
@@ -0,0 +1 @@
1
+ export declare const useButtonActionsContext: () => import("contexts/ButtonActionsContext/ButtonActionsContext").ButtonActionsContextType;
@@ -2,3 +2,6 @@ export * from './MlrRichTextViewerContext/MlrRichTextViewerProvider';
2
2
  export * from './MlrRichTextViewerContext/MlrRichTextViewerContext';
3
3
  export * from './MlrRichTextViewerContext/types';
4
4
  export * from './hooks/useMlrRichTextViewerContext';
5
+ export * from './hooks/useButtonActionsContext';
6
+ export * from './ButtonActionsContext/ButtonActionsContext';
7
+ export * from './ButtonActionsContext/ButtonActionsContextProvider';
@@ -1,7 +1,6 @@
1
1
  import { PropsWithChildren } from 'react';
2
2
  import { FontSizesTypes, SizesTypes, ThemeColors } from 'theme';
3
- import type { Callback } from 'typescript';
4
- import { StylesType } from 'typescript';
3
+ import type { Callback, StylesType } from 'typescript';
5
4
  export declare type ButtonVariant = 'primary' | 'secondary' | 'text' | 'custom';
6
5
  export declare type ButtonType = 'button' | 'submit' | 'reset';
7
6
  export declare type BaseButtonProps = PropsWithChildren<{
@@ -26,24 +26,7 @@ declare const _default: {
26
26
  }>;
27
27
  labelsProps: import("molecules").FieldLabelsProps;
28
28
  name: string;
29
- rules: Omit<Partial<{
30
- required: string | import("react-hook-form").ValidationRule<boolean>;
31
- min: import("react-hook-form").ValidationRule<string | number>;
32
- max: import("react-hook-form").ValidationRule<string | number>;
33
- maxLength: import("react-hook-form").ValidationRule<number>;
34
- minLength: import("react-hook-form").ValidationRule<number>;
35
- pattern: import("react-hook-form").ValidationRule<RegExp>;
36
- validate: import("react-hook-form").Validate<any> | Record<string, import("react-hook-form").Validate<any>>;
37
- valueAsNumber: boolean;
38
- valueAsDate: boolean;
39
- value: any;
40
- setValueAs: (value: any) => any;
41
- shouldUnregister?: boolean | undefined;
42
- onChange?: ((event: any) => void) | undefined;
43
- onBlur?: ((event: any) => void) | undefined;
44
- disabled: boolean;
45
- deps: string | string[];
46
- }>, "disabled" | "valueAsNumber" | "valueAsDate" | "setValueAs"> | undefined;
29
+ rules: Omit<import("react-hook-form").RegisterOptions<import("react-hook-form").FieldValues, string>, "disabled" | "valueAsNumber" | "valueAsDate" | "setValueAs"> | undefined;
47
30
  control: import("react-hook-form").Control<any, any>;
48
31
  required: boolean;
49
32
  optional: boolean;
@@ -6,24 +6,7 @@ declare const _default: {
6
6
  component: ({ control, name, inputProps, styles, labelsProps, defaultValue, optional, required, rules, }: Partial<{
7
7
  name: string;
8
8
  control: import("react-hook-form").Control<any, any>;
9
- rules: Omit<Partial<{
10
- required: string | import("react-hook-form").ValidationRule<boolean>;
11
- min: import("react-hook-form").ValidationRule<string | number>;
12
- max: import("react-hook-form").ValidationRule<string | number>;
13
- maxLength: import("react-hook-form").ValidationRule<number>;
14
- minLength: import("react-hook-form").ValidationRule<number>;
15
- pattern: import("react-hook-form").ValidationRule<RegExp>;
16
- validate: import("react-hook-form").Validate<any> | Record<string, import("react-hook-form").Validate<any>>;
17
- valueAsNumber: boolean;
18
- valueAsDate: boolean;
19
- value: any;
20
- setValueAs: (value: any) => any;
21
- shouldUnregister?: boolean | undefined;
22
- onChange?: ((event: any) => void) | undefined;
23
- onBlur?: ((event: any) => void) | undefined;
24
- disabled: boolean;
25
- deps: string | string[];
26
- }>, "disabled" | "valueAsNumber" | "valueAsDate" | "setValueAs"> | undefined;
9
+ rules: Omit<import("react-hook-form").RegisterOptions<import("react-hook-form").FieldValues, string>, "disabled" | "valueAsNumber" | "valueAsDate" | "setValueAs"> | undefined;
27
10
  required: boolean;
28
11
  optional: boolean;
29
12
  defaultValue: string;
@@ -5,24 +5,7 @@ declare const _default: {
5
5
  title: string;
6
6
  component: <T extends string>({ name, rules, styles, control, optional, required, labelsProps, defaultValue, radioButtonsProps, }: Partial<{
7
7
  name: string;
8
- rules: Omit<Partial<{
9
- required: string | import("react-hook-form").ValidationRule<boolean>;
10
- min: import("react-hook-form").ValidationRule<string | number>;
11
- max: import("react-hook-form").ValidationRule<string | number>;
12
- maxLength: import("react-hook-form").ValidationRule<number>;
13
- minLength: import("react-hook-form").ValidationRule<number>;
14
- pattern: import("react-hook-form").ValidationRule<RegExp>;
15
- validate: import("react-hook-form").Validate<any> | Record<string, import("react-hook-form").Validate<any>>;
16
- valueAsNumber: boolean;
17
- valueAsDate: boolean;
18
- value: any;
19
- setValueAs: (value: any) => any;
20
- shouldUnregister?: boolean | undefined;
21
- onChange?: ((event: any) => void) | undefined;
22
- onBlur?: ((event: any) => void) | undefined;
23
- disabled: boolean;
24
- deps: string | string[];
25
- }>, "disabled" | "valueAsNumber" | "valueAsDate" | "setValueAs"> | undefined;
8
+ rules: Omit<import("react-hook-form").RegisterOptions<import("react-hook-form").FieldValues, string>, "disabled" | "valueAsNumber" | "valueAsDate" | "setValueAs"> | undefined;
26
9
  styles: import("styled-components").FlattenInterpolation<import("styled-components").ThemedStyledProps<object, import("styled-components").DefaultTheme>>;
27
10
  control: import("react-hook-form").Control<any, any>;
28
11
  optional: boolean;
@@ -20,24 +20,7 @@ declare const _default: {
20
20
  }>;
21
21
  labelsProps: import("..").FieldLabelsProps;
22
22
  name: string;
23
- rules: Omit<Partial<{
24
- required: string | import("react-hook-form").ValidationRule<boolean>;
25
- min: import("react-hook-form").ValidationRule<string | number>;
26
- max: import("react-hook-form").ValidationRule<string | number>;
27
- maxLength: import("react-hook-form").ValidationRule<number>;
28
- minLength: import("react-hook-form").ValidationRule<number>;
29
- pattern: import("react-hook-form").ValidationRule<RegExp>;
30
- validate: import("react-hook-form").Validate<any> | Record<string, import("react-hook-form").Validate<any>>;
31
- valueAsNumber: boolean;
32
- valueAsDate: boolean;
33
- value: any;
34
- setValueAs: (value: any) => any;
35
- shouldUnregister?: boolean | undefined;
36
- onChange?: ((event: any) => void) | undefined;
37
- onBlur?: ((event: any) => void) | undefined;
38
- disabled: boolean;
39
- deps: string | string[];
40
- }>, "disabled" | "valueAsNumber" | "valueAsDate" | "setValueAs"> | undefined;
23
+ rules: Omit<import("react-hook-form").RegisterOptions<import("react-hook-form").FieldValues, string>, "disabled" | "valueAsNumber" | "valueAsDate" | "setValueAs"> | undefined;
41
24
  control: import("react-hook-form").Control<any, any>;
42
25
  required: boolean;
43
26
  optional: boolean;
@@ -0,0 +1,13 @@
1
+ import { ModalProps as MUIModalProps } from '@mui/material';
2
+ import { KeyboardEvent, PropsWithChildren } from 'react';
3
+ import { CSSProperties } from 'styled-components';
4
+ import { Callback, OverrideStyles } from '../../typescript';
5
+ export declare type ZealUIModalProps = PropsWithChildren<Pick<MUIModalProps, 'open'>> & {
6
+ padding?: number | string;
7
+ wrapperStyles?: CSSProperties;
8
+ onKeyDown?: <T extends HTMLElement>(event: KeyboardEvent<T>) => void;
9
+ modalStyles?: CSSProperties;
10
+ onClose?: Callback;
11
+ };
12
+ export declare const ZealUIModal: ({ children, wrapperStyles, padding, onKeyDown, modalStyles, onClose, ...rest }: ZealUIModalProps) => JSX.Element;
13
+ export declare const ModalWrapper: import("styled-components").StyledComponent<"div", import("styled-components").DefaultTheme, OverrideStyles, never>;
@@ -27,3 +27,4 @@ export * from './Image/Image';
27
27
  export * from './Caruser/Carousel';
28
28
  export * from './TextMolecule/TextMolecule';
29
29
  export * from './Button/Button';
30
+ export * from './ZealUIModal/ZealUIModal';
@@ -1,4 +1,5 @@
1
1
  import { DefaultTheme, ThemedCssFunction } from 'styled-components';
2
+ export declare type FileType = 'image' | 'video' | 'document' | 'audio';
2
3
  export declare type StylesType = ReturnType<ThemedCssFunction<DefaultTheme>>;
3
4
  export declare type StyledTransientProps<T> = {
4
5
  [K in keyof T & string as `$${K}`]: T[K];
@@ -11,4 +12,6 @@ export declare type Nullable<T> = T | null;
11
12
  declare type UnionKeys<T> = T extends any ? keyof T : never;
12
13
  declare type StrictUnionHelper<T, TAll> = T extends any ? T & Partial<Record<Exclude<UnionKeys<TAll>, keyof T>, never>> : never;
13
14
  export declare type StrictUnion<T> = StrictUnionHelper<T, T>;
15
+ export declare type AnyObject = Record<string, unknown>;
16
+ export declare type LooseObject = Record<string, any>;
14
17
  export {};