@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.
- package/dist/cjs/index.css +246 -246
- package/dist/cjs/index.js +26 -26
- package/dist/cjs/index.js.map +1 -1
- package/dist/cjs/src/containers/MoleculeItem.d.ts +1 -0
- package/dist/cjs/src/containers/mock-data.d.ts +1 -0
- package/dist/cjs/src/containers/types/moleculeTypes.d.ts +56 -2
- package/dist/cjs/src/containers/types/types.d.ts +7 -4
- package/dist/cjs/src/contexts/ButtonActionsContext/ButtonActionsContext.d.ts +11 -0
- package/dist/cjs/src/contexts/ButtonActionsContext/ButtonActionsContextProvider.d.ts +11 -0
- package/dist/cjs/src/contexts/hooks/useButtonActionsContext.d.ts +1 -0
- package/dist/cjs/src/contexts/index.d.ts +3 -0
- package/dist/cjs/src/molecules/Button/Button.d.ts +1 -2
- package/dist/cjs/src/molecules/CheckboxField/CheckboxField.stories.d.ts +1 -18
- package/dist/cjs/src/molecules/InputField/InputField.stories.d.ts +1 -18
- package/dist/cjs/src/molecules/RadioButtonField/RadioButtonField.stories.d.ts +1 -18
- package/dist/cjs/src/molecules/SelectField/SelectField.stories.d.ts +1 -18
- package/dist/cjs/src/molecules/ZealUIModal/ZealUIModal.d.ts +13 -0
- package/dist/cjs/src/molecules/index.d.ts +1 -0
- package/dist/cjs/src/typescript.d.ts +3 -0
- package/dist/esm/index.css +246 -246
- package/dist/esm/index.js +12 -12
- package/dist/esm/index.js.map +1 -1
- package/dist/esm/src/containers/MoleculeItem.d.ts +1 -0
- package/dist/esm/src/containers/mock-data.d.ts +1 -0
- package/dist/esm/src/containers/types/moleculeTypes.d.ts +56 -2
- package/dist/esm/src/containers/types/types.d.ts +7 -4
- package/dist/esm/src/contexts/ButtonActionsContext/ButtonActionsContext.d.ts +11 -0
- package/dist/esm/src/contexts/ButtonActionsContext/ButtonActionsContextProvider.d.ts +11 -0
- package/dist/esm/src/contexts/hooks/useButtonActionsContext.d.ts +1 -0
- package/dist/esm/src/contexts/index.d.ts +3 -0
- package/dist/esm/src/molecules/Button/Button.d.ts +1 -2
- package/dist/esm/src/molecules/CheckboxField/CheckboxField.stories.d.ts +1 -18
- package/dist/esm/src/molecules/InputField/InputField.stories.d.ts +1 -18
- package/dist/esm/src/molecules/RadioButtonField/RadioButtonField.stories.d.ts +1 -18
- package/dist/esm/src/molecules/SelectField/SelectField.stories.d.ts +1 -18
- package/dist/esm/src/molecules/ZealUIModal/ZealUIModal.d.ts +13 -0
- package/dist/esm/src/molecules/index.d.ts +1 -0
- package/dist/esm/src/typescript.d.ts +3 -0
- package/dist/index.d.ts +140 -48
- 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;
|
@@ -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
|
-
|
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<
|
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<
|
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<
|
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<
|
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>;
|
@@ -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 {};
|