@zealicsolutions/web-ui 0.2.101 → 0.2.104
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.
- 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/atoms/Circle/Circle.d.ts +1 -0
- package/dist/cjs/src/atoms/RadioButtons/RadioButtons.d.ts +40 -21
- package/dist/cjs/src/atoms/RadioButtons/RadioButtons.stories.d.ts +22 -8
- package/dist/cjs/src/atoms/RadioButtons/RadioOption.d.ts +6 -3
- package/dist/cjs/src/atoms/RadioButtons/helpers.d.ts +9 -3
- package/dist/cjs/src/atoms/RadioButtons/styles.d.ts +7 -7
- package/dist/cjs/src/atoms/RichTextViewer/types.d.ts +1 -0
- package/dist/cjs/src/atoms/Select/Select.d.ts +17 -14
- package/dist/cjs/src/atoms/Select/Select.stories.d.ts +14 -1
- package/dist/cjs/src/containers/MoleculeItem.d.ts +2 -1
- package/dist/cjs/src/containers/mock-data.d.ts +1 -0
- package/dist/cjs/src/containers/types/moleculeTypes.d.ts +59 -11
- 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/MlrRichTextViewerContext/types.d.ts +3 -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/CheckboxGroup.d.ts +5 -1
- package/dist/cjs/src/molecules/RadioButtonField/RadioButtonField.d.ts +41 -16
- package/dist/cjs/src/molecules/RadioButtonField/RadioButtonField.stories.d.ts +34 -10
- package/dist/cjs/src/molecules/SelectField/SelectField.stories.d.ts +14 -1
- package/dist/cjs/src/molecules/TabGroup/TabGroup.d.ts +2 -4
- package/dist/cjs/src/molecules/TabGroup/styles.d.ts +3 -3
- package/dist/cjs/src/molecules/ZealUIModal/ZealUIModal.d.ts +10 -0
- package/dist/cjs/src/molecules/ZealUIModal/styles.d.ts +2 -0
- package/dist/cjs/src/molecules/index.d.ts +1 -0
- package/dist/cjs/src/typescript.d.ts +6 -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/atoms/Circle/Circle.d.ts +1 -0
- package/dist/esm/src/atoms/RadioButtons/RadioButtons.d.ts +40 -21
- package/dist/esm/src/atoms/RadioButtons/RadioButtons.stories.d.ts +22 -8
- package/dist/esm/src/atoms/RadioButtons/RadioOption.d.ts +6 -3
- package/dist/esm/src/atoms/RadioButtons/helpers.d.ts +9 -3
- package/dist/esm/src/atoms/RadioButtons/styles.d.ts +7 -7
- package/dist/esm/src/atoms/RichTextViewer/types.d.ts +1 -0
- package/dist/esm/src/atoms/Select/Select.d.ts +17 -14
- package/dist/esm/src/atoms/Select/Select.stories.d.ts +14 -1
- package/dist/esm/src/containers/MoleculeItem.d.ts +2 -1
- package/dist/esm/src/containers/mock-data.d.ts +1 -0
- package/dist/esm/src/containers/types/moleculeTypes.d.ts +59 -11
- 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/MlrRichTextViewerContext/types.d.ts +3 -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/CheckboxGroup.d.ts +5 -1
- package/dist/esm/src/molecules/RadioButtonField/RadioButtonField.d.ts +41 -16
- package/dist/esm/src/molecules/RadioButtonField/RadioButtonField.stories.d.ts +34 -10
- package/dist/esm/src/molecules/SelectField/SelectField.stories.d.ts +14 -1
- package/dist/esm/src/molecules/TabGroup/TabGroup.d.ts +2 -4
- package/dist/esm/src/molecules/TabGroup/styles.d.ts +3 -3
- package/dist/esm/src/molecules/ZealUIModal/ZealUIModal.d.ts +10 -0
- package/dist/esm/src/molecules/ZealUIModal/styles.d.ts +2 -0
- package/dist/esm/src/molecules/index.d.ts +1 -0
- package/dist/esm/src/typescript.d.ts +6 -0
- package/dist/index.d.ts +198 -68
- package/package.json +1 -1
@@ -5,4 +5,5 @@ export declare type CircleBoxProps = {
|
|
5
5
|
type: CircleType;
|
6
6
|
};
|
7
7
|
export declare const Circle: ({ index, type }: CircleBoxProps) => JSX.Element;
|
8
|
+
export declare const CirclesWrapper: import("styled-components").StyledComponent<"span", import("styled-components").DefaultTheme, {}, never>;
|
8
9
|
export {};
|
@@ -1,37 +1,56 @@
|
|
1
1
|
/// <reference types="react" />
|
2
|
+
import { RadioGroup } from '@mui/material';
|
3
|
+
import { RefCallBack } from 'react-hook-form/dist/types';
|
2
4
|
import { SizesTypes, ThemeColors } from 'theme';
|
3
|
-
import { StylesType } from 'typescript';
|
4
|
-
|
5
|
+
import type { Callback, OverrideStyles, StyledTransientProps, StylesType } from 'typescript';
|
6
|
+
import { SelectOption } from '../Select/Select';
|
7
|
+
export declare type RadioButtonInternalConfigProps = Partial<{
|
5
8
|
selectedRadioOptionBackgroundColor: ThemeColors | string;
|
6
9
|
selectedRadioOptionIndicatorColor: ThemeColors | string;
|
7
10
|
buttonPadding: number;
|
8
11
|
textPadding: number;
|
9
12
|
styles: StylesType;
|
10
13
|
wrapperStyles: StylesType;
|
11
|
-
buttonOptionSpacing
|
12
|
-
|
13
|
-
|
14
|
-
id: T;
|
15
|
-
label?: string;
|
16
|
-
error?: boolean;
|
17
|
-
disabled?: boolean;
|
18
|
-
isRichText?: boolean;
|
19
|
-
};
|
14
|
+
buttonOptionSpacing: SizesTypes;
|
15
|
+
radioGroupWrapperStyles: StylesType;
|
16
|
+
}>;
|
20
17
|
export declare type RadioButtonsProps<T extends string> = Partial<{
|
21
|
-
|
22
|
-
|
18
|
+
ref: RefCallBack;
|
19
|
+
name: string;
|
23
20
|
value: T;
|
21
|
+
options: SelectOption[];
|
22
|
+
onBlur: Callback;
|
23
|
+
onChange: (value: T) => void;
|
24
24
|
isRow: boolean;
|
25
|
-
|
26
|
-
|
25
|
+
isError: boolean;
|
26
|
+
disabled: boolean;
|
27
|
+
isEditMode: boolean;
|
28
|
+
isRichText: boolean;
|
27
29
|
internalConfig: RadioButtonInternalConfigProps;
|
28
30
|
}>;
|
29
|
-
export declare const RadioButtons: <T extends string>({ value,
|
30
|
-
|
31
|
-
|
31
|
+
export declare const RadioButtons: <T extends string>({ ref, name, value, options, onBlur, onChange, isRow, isError, disabled, isEditMode, isRichText, internalConfig, }: Partial<{
|
32
|
+
ref: RefCallBack;
|
33
|
+
name: string;
|
32
34
|
value: T;
|
35
|
+
options: SelectOption[];
|
36
|
+
onBlur: Callback;
|
37
|
+
onChange: (value: T) => void;
|
33
38
|
isRow: boolean;
|
34
|
-
|
35
|
-
|
36
|
-
|
39
|
+
isError: boolean;
|
40
|
+
disabled: boolean;
|
41
|
+
isEditMode: boolean;
|
42
|
+
isRichText: boolean;
|
43
|
+
internalConfig: Partial<{
|
44
|
+
selectedRadioOptionBackgroundColor: ThemeColors | string;
|
45
|
+
selectedRadioOptionIndicatorColor: ThemeColors | string;
|
46
|
+
buttonPadding: number;
|
47
|
+
textPadding: number;
|
48
|
+
styles: import("styled-components").FlattenInterpolation<import("styled-components").ThemedStyledProps<object, import("styled-components").DefaultTheme>>;
|
49
|
+
wrapperStyles: import("styled-components").FlattenInterpolation<import("styled-components").ThemedStyledProps<object, import("styled-components").DefaultTheme>>;
|
50
|
+
buttonOptionSpacing: SizesTypes;
|
51
|
+
radioGroupWrapperStyles: import("styled-components").FlattenInterpolation<import("styled-components").ThemedStyledProps<object, import("styled-components").DefaultTheme>>;
|
52
|
+
}>;
|
37
53
|
}>) => JSX.Element;
|
54
|
+
export declare const RadioGroupWrapper: import("styled-components").StyledComponent<typeof RadioGroup, import("styled-components").DefaultTheme, StyledTransientProps<{
|
55
|
+
isRow: boolean;
|
56
|
+
}> & OverrideStyles, never>;
|
@@ -1,17 +1,31 @@
|
|
1
1
|
/// <reference types="react" />
|
2
|
-
import type {
|
2
|
+
import type { StoryFn } from '@storybook/react';
|
3
3
|
import { RadioButtons as RadioButtonsComponent } from './RadioButtons';
|
4
4
|
declare const _default: {
|
5
5
|
title: string;
|
6
|
-
component: <T extends string>({ value,
|
7
|
-
|
8
|
-
|
6
|
+
component: <T extends string>({ ref, name, value, options, onBlur, onChange, isRow, isError, disabled, isEditMode, isRichText, internalConfig, }: Partial<{
|
7
|
+
ref: import("react-hook-form").RefCallBack;
|
8
|
+
name: string;
|
9
9
|
value: T;
|
10
|
+
options: import("..").SelectOption[];
|
11
|
+
onBlur: import("../../typescript").Callback;
|
12
|
+
onChange: (value: T) => void;
|
10
13
|
isRow: boolean;
|
11
|
-
|
12
|
-
|
13
|
-
|
14
|
+
isError: boolean;
|
15
|
+
disabled: boolean;
|
16
|
+
isEditMode: boolean;
|
17
|
+
isRichText: boolean;
|
18
|
+
internalConfig: Partial<{
|
19
|
+
selectedRadioOptionBackgroundColor: string;
|
20
|
+
selectedRadioOptionIndicatorColor: string;
|
21
|
+
buttonPadding: number;
|
22
|
+
textPadding: number;
|
23
|
+
styles: import("styled-components").FlattenInterpolation<import("styled-components").ThemedStyledProps<object, import("styled-components").DefaultTheme>>;
|
24
|
+
wrapperStyles: import("styled-components").FlattenInterpolation<import("styled-components").ThemedStyledProps<object, import("styled-components").DefaultTheme>>;
|
25
|
+
buttonOptionSpacing: import("theme").SizesTypes;
|
26
|
+
radioGroupWrapperStyles: import("styled-components").FlattenInterpolation<import("styled-components").ThemedStyledProps<object, import("styled-components").DefaultTheme>>;
|
27
|
+
}>;
|
14
28
|
}>) => JSX.Element;
|
15
29
|
};
|
16
30
|
export default _default;
|
17
|
-
export declare const RadioButtons:
|
31
|
+
export declare const RadioButtons: StoryFn<typeof RadioButtonsComponent>;
|
@@ -1,9 +1,12 @@
|
|
1
1
|
/// <reference types="react" />
|
2
|
-
import { RadioButtonInternalConfigProps,
|
2
|
+
import { RadioButtonInternalConfigProps, SelectOption } from 'atoms';
|
3
3
|
declare type RadioOptionProps = {
|
4
|
-
|
4
|
+
option: SelectOption;
|
5
|
+
isError?: boolean;
|
6
|
+
disabled?: boolean;
|
5
7
|
isEditMode?: boolean;
|
8
|
+
isRichText?: boolean;
|
6
9
|
internalConfig?: RadioButtonInternalConfigProps;
|
7
10
|
};
|
8
|
-
export declare const RadioOption: ({
|
11
|
+
export declare const RadioOption: ({ option, isError, disabled, isEditMode, isRichText, internalConfig, }: RadioOptionProps) => JSX.Element;
|
9
12
|
export {};
|
@@ -1,9 +1,15 @@
|
|
1
|
-
import { RadioButtonInternalConfigProps
|
2
|
-
import { StylesType } from 'typescript';
|
1
|
+
import { RadioButtonInternalConfigProps } from 'atoms';
|
2
|
+
import type { StylesType } from 'typescript';
|
3
3
|
declare type RadioOptionStylesConfig = {
|
4
4
|
textStyles: StylesType;
|
5
|
+
groupWrapperStyles: StylesType;
|
5
6
|
radioIconWrapperStyles: StylesType;
|
6
7
|
radioLabelWrapperStyles: StylesType;
|
7
8
|
};
|
8
|
-
|
9
|
+
declare type GetRadioOptionStylesProps = Partial<{
|
10
|
+
isError: boolean;
|
11
|
+
disabled: boolean;
|
12
|
+
internalConfig: RadioButtonInternalConfigProps;
|
13
|
+
}>;
|
14
|
+
export declare const getRadioOptionStyles: ({ isError, disabled, internalConfig, }: GetRadioOptionStylesProps) => RadioOptionStylesConfig;
|
9
15
|
export {};
|
@@ -1,9 +1,9 @@
|
|
1
1
|
import { FormControlLabel, Radio } from '@mui/material';
|
2
|
-
import { OverrideStyles } from 'typescript';
|
3
|
-
export declare const RadioLabelWrapper: import("styled-components").StyledComponent<typeof FormControlLabel, import("styled-components").DefaultTheme, {
|
4
|
-
|
5
|
-
} & OverrideStyles, never>;
|
6
|
-
export declare const RadioIconWrapper: import("styled-components").StyledComponent<typeof Radio, import("styled-components").DefaultTheme, {
|
2
|
+
import type { OverrideStyles, StyledTransientProps } from 'typescript';
|
3
|
+
export declare const RadioLabelWrapper: import("styled-components").StyledComponent<typeof FormControlLabel, import("styled-components").DefaultTheme, StyledTransientProps<{
|
4
|
+
isError?: boolean | undefined;
|
5
|
+
}> & OverrideStyles, never>;
|
6
|
+
export declare const RadioIconWrapper: import("styled-components").StyledComponent<typeof Radio, import("styled-components").DefaultTheme, StyledTransientProps<{
|
7
7
|
disabled: boolean;
|
8
|
-
|
9
|
-
} & OverrideStyles, never>;
|
8
|
+
isError?: boolean | undefined;
|
9
|
+
}> & OverrideStyles, never>;
|
@@ -1,6 +1,7 @@
|
|
1
1
|
/// <reference types="react" />
|
2
2
|
import { ThemeColors } from 'theme';
|
3
|
-
import { StylesType } from 'typescript';
|
3
|
+
import type { Callback, StylesType } from 'typescript';
|
4
|
+
import { RefCallBack } from 'react-hook-form/dist/types';
|
4
5
|
export declare type SelectOption = {
|
5
6
|
id: string;
|
6
7
|
label: string;
|
@@ -15,16 +16,18 @@ export declare type SelectInternalConfigurationOptions = {
|
|
15
16
|
wrapperStyles: StylesType;
|
16
17
|
styles: StylesType;
|
17
18
|
};
|
18
|
-
export declare type SelectProps = {
|
19
|
-
|
20
|
-
|
21
|
-
|
22
|
-
|
23
|
-
|
24
|
-
|
25
|
-
|
26
|
-
|
27
|
-
|
28
|
-
|
29
|
-
|
30
|
-
|
19
|
+
export declare type SelectProps = Partial<{
|
20
|
+
ref: RefCallBack;
|
21
|
+
onBlur: Callback;
|
22
|
+
value: string;
|
23
|
+
optionsPresentation: boolean;
|
24
|
+
onChange: (value: string) => void;
|
25
|
+
placeholder: string;
|
26
|
+
disabled: boolean;
|
27
|
+
options: SelectOption[];
|
28
|
+
isError: boolean;
|
29
|
+
isEditMode: boolean;
|
30
|
+
selectInternalConfig: SelectInternalConfigurationOptions;
|
31
|
+
isRichText: boolean;
|
32
|
+
}>;
|
33
|
+
export declare const Select: ({ ref, onBlur, onChange, value, placeholder, options, disabled, optionsPresentation, isError, selectInternalConfig, isRichText, }: SelectProps) => JSX.Element;
|
@@ -3,7 +3,20 @@ import { StoryFn } from '@storybook/react';
|
|
3
3
|
import { SelectProps } from './Select';
|
4
4
|
declare const _default: {
|
5
5
|
title: string;
|
6
|
-
component: ({ onChange, value, placeholder, options, disabled, optionsPresentation, isError, selectInternalConfig, isRichText, }:
|
6
|
+
component: ({ ref, onBlur, onChange, value, placeholder, options, disabled, optionsPresentation, isError, selectInternalConfig, isRichText, }: Partial<{
|
7
|
+
ref: import("react-hook-form").RefCallBack;
|
8
|
+
onBlur: import("../../typescript").Callback;
|
9
|
+
value: string;
|
10
|
+
optionsPresentation: boolean;
|
11
|
+
onChange: (value: string) => void;
|
12
|
+
placeholder: string;
|
13
|
+
disabled: boolean;
|
14
|
+
options: import("./Select").SelectOption[];
|
15
|
+
isError: boolean;
|
16
|
+
isEditMode: boolean;
|
17
|
+
selectInternalConfig: import("./Select").SelectInternalConfigurationOptions;
|
18
|
+
isRichText: boolean;
|
19
|
+
}>) => JSX.Element;
|
7
20
|
};
|
8
21
|
export default _default;
|
9
22
|
export declare const Select: StoryFn<SelectProps>;
|
@@ -1,8 +1,9 @@
|
|
1
1
|
/// <reference types="react" />
|
2
|
-
import { Molecule } from 'containers';
|
2
|
+
import { FileObjectDTO, 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: (fileData: FileObjectDTO) => 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,13 +1,57 @@
|
|
1
1
|
import { SelectOption } from 'atoms';
|
2
|
-
import { ButtonProps, CheckboxFieldProps, ImageProps, InputFieldProps, RadioButtonFieldProps, SelectFieldProps, TabGroupProps, TextMoleculeProps } from 'molecules';
|
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'>>;
|
@@ -94,14 +147,8 @@ export interface TabGroupMolecule extends BaseMolecule {
|
|
94
147
|
type: 'header_tab_group';
|
95
148
|
config: {
|
96
149
|
props: TabGroupProps;
|
97
|
-
wide:
|
98
|
-
|
99
|
-
containerProps?: Record<string, unknown>;
|
100
|
-
};
|
101
|
-
compact: {
|
102
|
-
containerStyle?: CSSProperties;
|
103
|
-
containerProps?: Record<string, unknown>;
|
104
|
-
};
|
150
|
+
wide: AdditionalTabContainerProps;
|
151
|
+
compact: AdditionalTabContainerProps;
|
105
152
|
};
|
106
153
|
}
|
107
154
|
export interface TextInputMolecule extends BaseMolecule {
|
@@ -159,3 +206,4 @@ export interface CheckboxFieldMolecule extends BaseMolecule {
|
|
159
206
|
export declare type Molecule = StrictUnion<ImageMolecule | TextMoleculeType | ButtonMolecule | VideoMolecule | TabGroupMolecule | TextInputMolecule | SelectFieldMolecule | RadioButtonFieldMolecule | CheckboxFieldMolecule> & {
|
160
207
|
form?: UseFormReturn<any>;
|
161
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<{
|
@@ -1,7 +1,11 @@
|
|
1
1
|
/// <reference types="react" />
|
2
|
+
import { RefCallBack } from 'react-hook-form/dist/types';
|
3
|
+
import type { Callback } from 'typescript';
|
2
4
|
import { CheckboxesProps } from './CheckboxField';
|
3
5
|
export declare type CheckboxGroupProps = Partial<{
|
6
|
+
ref: RefCallBack;
|
7
|
+
onBlur: Callback;
|
4
8
|
onChange: (checkedIds: string[]) => void;
|
5
9
|
checkboxesProps: CheckboxesProps;
|
6
10
|
}>;
|
7
|
-
export declare const CheckboxGroup: ({ onChange, checkboxesProps }: CheckboxGroupProps) => JSX.Element;
|
11
|
+
export declare const CheckboxGroup: ({ ref, onBlur, onChange, checkboxesProps }: CheckboxGroupProps) => JSX.Element;
|
@@ -1,35 +1,60 @@
|
|
1
1
|
/// <reference types="react" />
|
2
|
-
import { RadioButtonsProps } from 'atoms';
|
2
|
+
import { RadioButtonInternalConfigProps, RadioButtonsProps } from 'atoms';
|
3
3
|
import { Control, ControllerProps } from 'react-hook-form/dist/types';
|
4
|
-
import {
|
4
|
+
import type { StylesType } from 'typescript';
|
5
5
|
import { FieldLabelsProps } from '../FieldLabels/FieldLabels';
|
6
6
|
export declare type RadioButtonFieldProps<T extends string> = Partial<{
|
7
7
|
name: string;
|
8
|
-
control: Control<any>;
|
9
8
|
rules: ControllerProps['rules'];
|
10
|
-
|
9
|
+
styles: StylesType;
|
10
|
+
control: Control<any>;
|
11
11
|
optional: boolean;
|
12
|
+
required: boolean;
|
13
|
+
labelsProps: FieldLabelsProps;
|
12
14
|
defaultValue: string;
|
13
|
-
styles: CSSProperties;
|
14
15
|
radioButtonsProps: RadioButtonsProps<T>;
|
15
|
-
|
16
|
+
internalConfig: RadioButtonInternalConfigProps;
|
16
17
|
}>;
|
17
|
-
export declare const RadioButtonField: <T extends string>({
|
18
|
+
export declare const RadioButtonField: <T extends string>({ name, rules, styles, control, optional, required, labelsProps, defaultValue, radioButtonsProps, }: Partial<{
|
18
19
|
name: string;
|
19
|
-
control: Control<any>;
|
20
20
|
rules: ControllerProps['rules'];
|
21
|
-
|
21
|
+
styles: import("styled-components").FlattenInterpolation<import("styled-components").ThemedStyledProps<object, import("styled-components").DefaultTheme>>;
|
22
|
+
control: Control<any>;
|
22
23
|
optional: boolean;
|
24
|
+
required: boolean;
|
25
|
+
labelsProps: FieldLabelsProps;
|
23
26
|
defaultValue: string;
|
24
|
-
styles: CSSProperties;
|
25
27
|
radioButtonsProps: Partial<{
|
26
|
-
|
27
|
-
|
28
|
+
ref: import("react-hook-form").RefCallBack;
|
29
|
+
name: string;
|
28
30
|
value: T;
|
31
|
+
options: import("atoms").SelectOption[];
|
32
|
+
onBlur: import("typescript").Callback;
|
33
|
+
onChange: (value: T) => void;
|
29
34
|
isRow: boolean;
|
30
|
-
|
31
|
-
|
32
|
-
|
35
|
+
isError: boolean;
|
36
|
+
disabled: boolean;
|
37
|
+
isEditMode: boolean;
|
38
|
+
isRichText: boolean;
|
39
|
+
internalConfig: Partial<{
|
40
|
+
selectedRadioOptionBackgroundColor: string;
|
41
|
+
selectedRadioOptionIndicatorColor: string;
|
42
|
+
buttonPadding: number;
|
43
|
+
textPadding: number;
|
44
|
+
styles: import("styled-components").FlattenInterpolation<import("styled-components").ThemedStyledProps<object, import("styled-components").DefaultTheme>>;
|
45
|
+
wrapperStyles: import("styled-components").FlattenInterpolation<import("styled-components").ThemedStyledProps<object, import("styled-components").DefaultTheme>>;
|
46
|
+
buttonOptionSpacing: import("../..").SizesTypes;
|
47
|
+
radioGroupWrapperStyles: import("styled-components").FlattenInterpolation<import("styled-components").ThemedStyledProps<object, import("styled-components").DefaultTheme>>;
|
48
|
+
}>;
|
49
|
+
}>;
|
50
|
+
internalConfig: Partial<{
|
51
|
+
selectedRadioOptionBackgroundColor: string;
|
52
|
+
selectedRadioOptionIndicatorColor: string;
|
53
|
+
buttonPadding: number;
|
54
|
+
textPadding: number;
|
55
|
+
styles: import("styled-components").FlattenInterpolation<import("styled-components").ThemedStyledProps<object, import("styled-components").DefaultTheme>>;
|
56
|
+
wrapperStyles: import("styled-components").FlattenInterpolation<import("styled-components").ThemedStyledProps<object, import("styled-components").DefaultTheme>>;
|
57
|
+
buttonOptionSpacing: import("../..").SizesTypes;
|
58
|
+
radioGroupWrapperStyles: import("styled-components").FlattenInterpolation<import("styled-components").ThemedStyledProps<object, import("styled-components").DefaultTheme>>;
|
33
59
|
}>;
|
34
|
-
labelsProps: FieldLabelsProps;
|
35
60
|
}>) => JSX.Element;
|
@@ -3,24 +3,48 @@ import type { ComponentStory } from '@storybook/react';
|
|
3
3
|
import { RadioButtonField as RadioButtonFieldComponent } from './RadioButtonField';
|
4
4
|
declare const _default: {
|
5
5
|
title: string;
|
6
|
-
component: <T extends string>({
|
6
|
+
component: <T extends string>({ name, rules, styles, control, optional, required, labelsProps, defaultValue, radioButtonsProps, }: Partial<{
|
7
7
|
name: string;
|
8
|
-
control: import("react-hook-form").Control<any, any>;
|
9
8
|
rules: Omit<import("react-hook-form").RegisterOptions<import("react-hook-form").FieldValues, string>, "disabled" | "valueAsNumber" | "valueAsDate" | "setValueAs"> | undefined;
|
10
|
-
|
9
|
+
styles: import("styled-components").FlattenInterpolation<import("styled-components").ThemedStyledProps<object, import("styled-components").DefaultTheme>>;
|
10
|
+
control: import("react-hook-form").Control<any, any>;
|
11
11
|
optional: boolean;
|
12
|
+
required: boolean;
|
13
|
+
labelsProps: import("..").FieldLabelsProps;
|
12
14
|
defaultValue: string;
|
13
|
-
styles: import("styled-components").CSSProperties;
|
14
15
|
radioButtonsProps: Partial<{
|
15
|
-
|
16
|
-
|
16
|
+
ref: import("react-hook-form").RefCallBack;
|
17
|
+
name: string;
|
17
18
|
value: T;
|
19
|
+
options: import("../..").SelectOption[];
|
20
|
+
onBlur: import("typescript").Callback;
|
21
|
+
onChange: (value: T) => void;
|
18
22
|
isRow: boolean;
|
19
|
-
|
20
|
-
|
21
|
-
|
23
|
+
isError: boolean;
|
24
|
+
disabled: boolean;
|
25
|
+
isEditMode: boolean;
|
26
|
+
isRichText: boolean;
|
27
|
+
internalConfig: Partial<{
|
28
|
+
selectedRadioOptionBackgroundColor: string;
|
29
|
+
selectedRadioOptionIndicatorColor: string;
|
30
|
+
buttonPadding: number;
|
31
|
+
textPadding: number;
|
32
|
+
styles: import("styled-components").FlattenInterpolation<import("styled-components").ThemedStyledProps<object, import("styled-components").DefaultTheme>>;
|
33
|
+
wrapperStyles: import("styled-components").FlattenInterpolation<import("styled-components").ThemedStyledProps<object, import("styled-components").DefaultTheme>>;
|
34
|
+
buttonOptionSpacing: import("theme").SizesTypes;
|
35
|
+
radioGroupWrapperStyles: import("styled-components").FlattenInterpolation<import("styled-components").ThemedStyledProps<object, import("styled-components").DefaultTheme>>;
|
36
|
+
}>;
|
37
|
+
}>;
|
38
|
+
internalConfig: Partial<{
|
39
|
+
selectedRadioOptionBackgroundColor: string;
|
40
|
+
selectedRadioOptionIndicatorColor: string;
|
41
|
+
buttonPadding: number;
|
42
|
+
textPadding: number;
|
43
|
+
styles: import("styled-components").FlattenInterpolation<import("styled-components").ThemedStyledProps<object, import("styled-components").DefaultTheme>>;
|
44
|
+
wrapperStyles: import("styled-components").FlattenInterpolation<import("styled-components").ThemedStyledProps<object, import("styled-components").DefaultTheme>>;
|
45
|
+
buttonOptionSpacing: import("theme").SizesTypes;
|
46
|
+
radioGroupWrapperStyles: import("styled-components").FlattenInterpolation<import("styled-components").ThemedStyledProps<object, import("styled-components").DefaultTheme>>;
|
22
47
|
}>;
|
23
|
-
labelsProps: import("..").FieldLabelsProps;
|
24
48
|
}>) => JSX.Element;
|
25
49
|
};
|
26
50
|
export default _default;
|