@zealicsolutions/web-ui 0.1.49 → 0.1.50
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.js +3 -3
- package/dist/cjs/index.js.map +1 -1
- package/dist/cjs/src/molecules/Stepper/Step.d.ts +13 -0
- package/dist/cjs/src/molecules/Stepper/Stepper.d.ts +11 -0
- package/dist/cjs/src/molecules/Stepper/styles.d.ts +19 -0
- package/dist/cjs/src/molecules/index.d.ts +1 -0
- package/dist/cjs/src/organisms/ProcessTracker/ProcessTracker.d.ts +14 -0
- package/dist/cjs/src/organisms/ProcessTracker/ProcessTracker.stories.d.ts +10 -0
- package/dist/cjs/src/organisms/index.d.ts +1 -0
- package/dist/cjs/src/templates/DefaultTemplate/DefaultTemplate.d.ts +3 -1
- package/dist/cjs/src/templates/DefaultTemplate/DefaultTemplate.stories.d.ts +1 -1
- package/dist/cjs/src/theme/types.d.ts +1 -1
- package/dist/esm/index.js +3 -3
- package/dist/esm/index.js.map +1 -1
- package/dist/esm/src/molecules/Stepper/Step.d.ts +13 -0
- package/dist/esm/src/molecules/Stepper/Stepper.d.ts +11 -0
- package/dist/esm/src/molecules/Stepper/styles.d.ts +19 -0
- package/dist/esm/src/molecules/index.d.ts +1 -0
- package/dist/esm/src/organisms/ProcessTracker/ProcessTracker.d.ts +14 -0
- package/dist/esm/src/organisms/ProcessTracker/ProcessTracker.stories.d.ts +10 -0
- package/dist/esm/src/organisms/index.d.ts +1 -0
- package/dist/esm/src/templates/DefaultTemplate/DefaultTemplate.d.ts +3 -1
- package/dist/esm/src/templates/DefaultTemplate/DefaultTemplate.stories.d.ts +1 -1
- package/dist/esm/src/theme/types.d.ts +1 -1
- package/dist/index.d.ts +29 -4
- package/package.json +1 -1
@@ -0,0 +1,13 @@
|
|
1
|
+
/// <reference types="react" />
|
2
|
+
import { OrientationType } from './Stepper';
|
3
|
+
export declare type StepProps = {
|
4
|
+
step: {
|
5
|
+
title?: string;
|
6
|
+
description?: string;
|
7
|
+
};
|
8
|
+
stepsNumber: number;
|
9
|
+
order: number;
|
10
|
+
orientation?: OrientationType;
|
11
|
+
active: number;
|
12
|
+
};
|
13
|
+
export declare const Step: ({ stepsNumber, step: { title, description }, orientation, order, active, }: StepProps) => JSX.Element;
|
@@ -0,0 +1,11 @@
|
|
1
|
+
/// <reference types="react" />
|
2
|
+
export declare type OrientationType = 'horizontal' | 'vertical';
|
3
|
+
export declare type StepperProps = {
|
4
|
+
steps: {
|
5
|
+
title?: string;
|
6
|
+
description?: string;
|
7
|
+
}[];
|
8
|
+
active: number;
|
9
|
+
orientation?: OrientationType;
|
10
|
+
};
|
11
|
+
export declare const Stepper: ({ active, steps, orientation }: StepperProps) => JSX.Element;
|
@@ -0,0 +1,19 @@
|
|
1
|
+
import { OrientationType } from 'molecules/Stepper/Stepper';
|
2
|
+
export declare const StepperWrapper: import("styled-components").StyledComponent<"ul", import("styled-components").DefaultTheme, {
|
3
|
+
orientation?: OrientationType | undefined;
|
4
|
+
}, never>;
|
5
|
+
export declare const StepWrapper: import("styled-components").StyledComponent<"li", import("styled-components").DefaultTheme, {
|
6
|
+
orientation?: OrientationType | undefined;
|
7
|
+
}, never>;
|
8
|
+
export declare const VerticalWrapper: import("styled-components").StyledComponent<"div", import("styled-components").DefaultTheme, {
|
9
|
+
orientation?: OrientationType | undefined;
|
10
|
+
isLastChild?: boolean | undefined;
|
11
|
+
}, never>;
|
12
|
+
export declare const CustomStep: import("styled-components").StyledComponent<"span", import("styled-components").DefaultTheme, {
|
13
|
+
done?: boolean | undefined;
|
14
|
+
current?: boolean | undefined;
|
15
|
+
orientation?: OrientationType | undefined;
|
16
|
+
}, never>;
|
17
|
+
export declare const ConnectionLine: import("styled-components").StyledComponent<"div", import("styled-components").DefaultTheme, {
|
18
|
+
orientation?: OrientationType | undefined;
|
19
|
+
}, never>;
|
@@ -0,0 +1,14 @@
|
|
1
|
+
/// <reference types="react" />
|
2
|
+
import { CSSProperties } from 'styled-components';
|
3
|
+
export declare type ProcessTrackerProps = {
|
4
|
+
title?: string;
|
5
|
+
description?: string;
|
6
|
+
isMobile?: boolean;
|
7
|
+
states?: {
|
8
|
+
title: string;
|
9
|
+
description: string;
|
10
|
+
}[];
|
11
|
+
activeStep?: number;
|
12
|
+
style?: CSSProperties;
|
13
|
+
};
|
14
|
+
export declare const ProcessTracker: ({ title, states, isMobile, description, activeStep, style, }: ProcessTrackerProps) => JSX.Element;
|
@@ -0,0 +1,10 @@
|
|
1
|
+
/// <reference types="react" />
|
2
|
+
import { ComponentStory } from '@storybook/react';
|
3
|
+
import { ProcessTracker as ProcessTrackerComponent, ProcessTrackerProps } from 'organisms';
|
4
|
+
declare const _default: {
|
5
|
+
title: string;
|
6
|
+
component: ({ title, states, isMobile, description, activeStep, style, }: ProcessTrackerProps) => JSX.Element;
|
7
|
+
};
|
8
|
+
export default _default;
|
9
|
+
export declare const ProcessTracker: ComponentStory<typeof ProcessTrackerComponent>;
|
10
|
+
export declare const processTrackerMockProps: ProcessTrackerProps;
|
@@ -1,9 +1,11 @@
|
|
1
1
|
/// <reference types="react" />
|
2
2
|
import { AlertProps } from 'molecules/Alert/Alert';
|
3
|
+
import { ProcessTrackerProps } from 'organisms';
|
3
4
|
export declare type DefaultTemplateProps = {
|
4
5
|
alerts?: AlertProps[];
|
6
|
+
processTracker?: ProcessTrackerProps;
|
5
7
|
header: React.ReactNode;
|
6
8
|
banner?: React.ReactNode;
|
7
9
|
content?: React.ReactNode;
|
8
10
|
};
|
9
|
-
export declare const DefaultTemplate: ({ header, banner, content, alerts }: DefaultTemplateProps) => JSX.Element;
|
11
|
+
export declare const DefaultTemplate: ({ header, banner, content, alerts, processTracker, }: DefaultTemplateProps) => JSX.Element;
|
@@ -3,7 +3,7 @@ import type { ComponentStory } from '@storybook/react';
|
|
3
3
|
import { DefaultTemplate as DefaultTemplateComponent } from './DefaultTemplate';
|
4
4
|
declare const _default: {
|
5
5
|
title: string;
|
6
|
-
component: ({ header, banner, content, alerts }: import("./DefaultTemplate").DefaultTemplateProps) => JSX.Element;
|
6
|
+
component: ({ header, banner, content, alerts, processTracker, }: import("./DefaultTemplate").DefaultTemplateProps) => JSX.Element;
|
7
7
|
};
|
8
8
|
export default _default;
|
9
9
|
export declare const DefaultTemplate: ComponentStory<typeof DefaultTemplateComponent>;
|
@@ -1,4 +1,4 @@
|
|
1
|
-
export declare type ThemeColors = 'primary' | 'secondary' | 'background' | 'gray1' | 'gray2' | 'gray3' | 'gray4' | 'gray5' | 'indigo' | 'blue' | 'white' | 'black' | 'indigoTint' | 'indigoTint2' | 'success' | 'error' | 'warning';
|
1
|
+
export declare type ThemeColors = 'primary' | 'secondary' | 'background' | 'gray1' | 'gray2' | 'gray3' | 'gray4' | 'gray5' | 'indigo' | 'blue' | 'white' | 'black' | 'indigoTint' | 'indigoTint2' | 'success' | 'error' | 'warning' | 'green';
|
2
2
|
export declare type SizesTypes = '2XL' | 'XL' | 'L' | 'M' | 'S' | 'XS';
|
3
3
|
export declare type FontSizesTypes = SizesTypes | 'H2';
|
4
4
|
export declare type BreakpointSizesTypes = 'xs' | 'sm' | 'md' | 'lg' | 'xl';
|
package/dist/index.d.ts
CHANGED
@@ -19,7 +19,7 @@ import { Control, ControllerProps } from 'react-hook-form/dist/types';
|
|
19
19
|
import { SelectOption as SelectOption$1 } from 'atoms/Select/types';
|
20
20
|
import { ControllerProps as ControllerProps$1, DeepPartial, FieldValues, FormState } from 'react-hook-form';
|
21
21
|
import { SetPasswordFields, MaxRuleValidation, MinRuleValidation } from 'organisms/SetPasswordForm/types';
|
22
|
-
import { ConsentProps as ConsentProps$1 } from 'organisms';
|
22
|
+
import { ConsentProps as ConsentProps$1, ProcessTrackerProps as ProcessTrackerProps$1 } from 'organisms';
|
23
23
|
import { FooterAProps } from 'organisms/Footer/FooterA';
|
24
24
|
import { FooterBProps } from 'organisms/Footer/FooterB';
|
25
25
|
import { FooterCProps } from 'organisms/Footer/FooterC';
|
@@ -393,7 +393,7 @@ declare const ZealThemeProvider: (props: PropsWithChildren<{
|
|
393
393
|
theme?: DefaultTheme;
|
394
394
|
}>) => JSX.Element;
|
395
395
|
|
396
|
-
declare type ThemeColors = 'primary' | 'secondary' | 'background' | 'gray1' | 'gray2' | 'gray3' | 'gray4' | 'gray5' | 'indigo' | 'blue' | 'white' | 'black' | 'indigoTint' | 'indigoTint2' | 'success' | 'error' | 'warning';
|
396
|
+
declare type ThemeColors = 'primary' | 'secondary' | 'background' | 'gray1' | 'gray2' | 'gray3' | 'gray4' | 'gray5' | 'indigo' | 'blue' | 'white' | 'black' | 'indigoTint' | 'indigoTint2' | 'success' | 'error' | 'warning' | 'green';
|
397
397
|
declare type SizesTypes = '2XL' | 'XL' | 'L' | 'M' | 'S' | 'XS';
|
398
398
|
declare type FontSizesTypes = SizesTypes | 'H2';
|
399
399
|
declare type BreakpointSizesTypes = 'xs' | 'sm' | 'md' | 'lg' | 'xl';
|
@@ -557,6 +557,17 @@ declare type AlertProps = {
|
|
557
557
|
};
|
558
558
|
declare const Alert: ({ logo, title, withCloseIcon, description, style, ...props }: AlertProps) => JSX.Element;
|
559
559
|
|
560
|
+
declare type OrientationType = 'horizontal' | 'vertical';
|
561
|
+
declare type StepperProps = {
|
562
|
+
steps: {
|
563
|
+
title?: string;
|
564
|
+
description?: string;
|
565
|
+
}[];
|
566
|
+
active: number;
|
567
|
+
orientation?: OrientationType;
|
568
|
+
};
|
569
|
+
declare const Stepper: ({ active, steps, orientation }: StepperProps) => JSX.Element;
|
570
|
+
|
560
571
|
declare type SetPasswordRuleValidation = {
|
561
572
|
label: string;
|
562
573
|
rule: MaxRuleValidation | MinRuleValidation;
|
@@ -736,13 +747,27 @@ declare type ConsentProps<T extends string = string> = {
|
|
736
747
|
};
|
737
748
|
declare const Consent: <T extends string>({ text, consentCaptureProps, containerStyles, clearStyles, }: ConsentProps<T>) => JSX.Element;
|
738
749
|
|
750
|
+
declare type ProcessTrackerProps = {
|
751
|
+
title?: string;
|
752
|
+
description?: string;
|
753
|
+
isMobile?: boolean;
|
754
|
+
states?: {
|
755
|
+
title: string;
|
756
|
+
description: string;
|
757
|
+
}[];
|
758
|
+
activeStep?: number;
|
759
|
+
style?: CSSProperties;
|
760
|
+
};
|
761
|
+
declare const ProcessTracker: ({ title, states, isMobile, description, activeStep, style, }: ProcessTrackerProps) => JSX.Element;
|
762
|
+
|
739
763
|
declare type DefaultTemplateProps = {
|
740
764
|
alerts?: AlertProps$1[];
|
765
|
+
processTracker?: ProcessTrackerProps$1;
|
741
766
|
header: React.ReactNode;
|
742
767
|
banner?: React.ReactNode;
|
743
768
|
content?: React.ReactNode;
|
744
769
|
};
|
745
|
-
declare const DefaultTemplate: ({ header, banner, content, alerts }: DefaultTemplateProps) => JSX.Element;
|
770
|
+
declare const DefaultTemplate: ({ header, banner, content, alerts, processTracker, }: DefaultTemplateProps) => JSX.Element;
|
746
771
|
|
747
772
|
interface Helpers {
|
748
773
|
goToNextStep: () => void;
|
@@ -782,4 +807,4 @@ declare type AnnotationsList = {
|
|
782
807
|
|
783
808
|
declare const useMlrRichTextViewerContext: () => contexts_MlrRichTextViewerContext_MlrRichTextViewerContext.MlrRichTextViewerContextType;
|
784
809
|
|
785
|
-
export { AcquisitionForm, AcquisitionFormProps, Alert, AlertProps, AnnotationsList, AuthMethod, Avatar, AvatarDropdown, AvatarDropdownProps, AvatarProps, BaseButtonProps, Body, BodyProps, BreakpointSizesTypes, Button, ButtonProps, CaretIconWrapper, CheckBoxProps, Checkbox, CheckboxField, CheckboxFieldProps, Circle, CircleBoxProps, ColumnItem, Columns, ColumnsProps, Consent, ConsentProps, CustomValidation, CustomValidationProps, CustomValidationRule, DefaultTemplate, DefaultTemplateProps, Divider, DividerProps, Drawer, EmphasizedText, EmphasizedTextProps, FieldLabels, FieldLabelsProps, FieldMapper, FieldMapperProps, FieldRuleLabelTypes, FieldSection, FieldSectionProps, FieldTypes, FontSizesTypes, Footer, FooterContentInfo, FooterLink, FooterProps, ForgotPasswordForm, ForgotPasswordFormProps, GoogleMap, GoogleMapProps, Header, HeaderProps, HeroImage, HeroImageAlignment, HeroImageProps, HorizontalPadding, HorizontalPaddingProps, ISI, ISIProps, Icon, IconNames, IconProps, Image, ImageProps, Input, InputField, InputFieldProps, InputFieldTypes, InputIconProps, InputProps, LinkButton, LinkButtonProps, LoginForm, LoginFormProps, MapPosition, MenuItem, MenuItems, MenuItemsProps, MenuNavigation, MenuNavigationProps, MlrRichTextViewerContext, MlrRichTextViewerContextType, MlrRichTextViewerProvider, MlrRichTextViewerProviderProps, ProfileInformation, ProfileInformationProps, RadioButtonField, RadioButtonFieldProps, RadioButtonType, RadioButtons, RadioButtonsProps, RichTextEditorProps, RichTextViewer, Select, SelectField, SelectFieldProps, SelectableCardGroup, SelectableCardGroupProps, SetPasswordForm, SetPasswordFormProps, SetPasswordRuleValidation, SizesTypes, Spacer, SpacerProps, Spinner, StyleWrapper, TabGroup, TabGroupProps, TextTypes, TextWrapper, TextWrapperProps, ThemeColors, ThemeColorsType, ThemeDevicesType, ThemeSizesType, ThemeTextType, Tooltip, TooltipProps, TouchableOpacity, TouchableOpacityProps, TwoFactorAuth, TwoFactorAuthProps, UICheckboxField, UIField, UIFields, UIInputField, UISelectField, ValidationTag, ValidationTagProps, ValidationTagStatus, VerticalPadding, ZealTheme, ZealThemeProvider, acquisitionFormMockFields, defaultTheme, getFieldPlaceholder, getFieldsFromFieldSections, getInitialValuesFromFields, isFormValid, loginMockFields, profileInformationMockForm, sectionMockFields, setPasswordMockFields, toast, toastStyles, useMediaQuery, useMlrRichTextViewerContext, useStep };
|
810
|
+
export { AcquisitionForm, AcquisitionFormProps, Alert, AlertProps, AnnotationsList, AuthMethod, Avatar, AvatarDropdown, AvatarDropdownProps, AvatarProps, BaseButtonProps, Body, BodyProps, BreakpointSizesTypes, Button, ButtonProps, CaretIconWrapper, CheckBoxProps, Checkbox, CheckboxField, CheckboxFieldProps, Circle, CircleBoxProps, ColumnItem, Columns, ColumnsProps, Consent, ConsentProps, CustomValidation, CustomValidationProps, CustomValidationRule, DefaultTemplate, DefaultTemplateProps, Divider, DividerProps, Drawer, EmphasizedText, EmphasizedTextProps, FieldLabels, FieldLabelsProps, FieldMapper, FieldMapperProps, FieldRuleLabelTypes, FieldSection, FieldSectionProps, FieldTypes, FontSizesTypes, Footer, FooterContentInfo, FooterLink, FooterProps, ForgotPasswordForm, ForgotPasswordFormProps, GoogleMap, GoogleMapProps, Header, HeaderProps, HeroImage, HeroImageAlignment, HeroImageProps, HorizontalPadding, HorizontalPaddingProps, ISI, ISIProps, Icon, IconNames, IconProps, Image, ImageProps, Input, InputField, InputFieldProps, InputFieldTypes, InputIconProps, InputProps, LinkButton, LinkButtonProps, LoginForm, LoginFormProps, MapPosition, MenuItem, MenuItems, MenuItemsProps, MenuNavigation, MenuNavigationProps, MlrRichTextViewerContext, MlrRichTextViewerContextType, MlrRichTextViewerProvider, MlrRichTextViewerProviderProps, OrientationType, ProcessTracker, ProcessTrackerProps, ProfileInformation, ProfileInformationProps, RadioButtonField, RadioButtonFieldProps, RadioButtonType, RadioButtons, RadioButtonsProps, RichTextEditorProps, RichTextViewer, Select, SelectField, SelectFieldProps, SelectableCardGroup, SelectableCardGroupProps, SetPasswordForm, SetPasswordFormProps, SetPasswordRuleValidation, SizesTypes, Spacer, SpacerProps, Spinner, Stepper, StepperProps, StyleWrapper, TabGroup, TabGroupProps, TextTypes, TextWrapper, TextWrapperProps, ThemeColors, ThemeColorsType, ThemeDevicesType, ThemeSizesType, ThemeTextType, Tooltip, TooltipProps, TouchableOpacity, TouchableOpacityProps, TwoFactorAuth, TwoFactorAuthProps, UICheckboxField, UIField, UIFields, UIInputField, UISelectField, ValidationTag, ValidationTagProps, ValidationTagStatus, VerticalPadding, ZealTheme, ZealThemeProvider, acquisitionFormMockFields, defaultTheme, getFieldPlaceholder, getFieldsFromFieldSections, getInitialValuesFromFields, isFormValid, loginMockFields, profileInformationMockForm, sectionMockFields, setPasswordMockFields, toast, toastStyles, useMediaQuery, useMlrRichTextViewerContext, useStep };
|