@zealicsolutions/web-ui 0.1.1 → 0.1.3

package/dist/esm/src/fieldsConfiguration/types.d.ts

@@ -1,4 +1,5 @@
 import { SelectOption } from 'atoms/Select/types';
+import { ControllerProps } from 'react-hook-form';
 export declare type InputFieldTypes = 'number' | 'text' | 'email' | 'password';
 export declare type FieldTypes = 'input' | 'select' | 'date-picker' | 'checkbox' | 'switch';
 export declare type UIField<T = string> = (UIInputField | UISelectField | UICheckboxField) & {
@@ -9,6 +10,7 @@ export declare type UIField<T = string> = (UIInputField | UISelectField | UIChec
     required?: boolean;
     optional?: boolean;
     tooltip?: string;
+    rules?: ControllerProps['rules'];
 };
 export declare type UIInputField = {
     type: 'input';

package/dist/esm/src/molecules/FieldMapper/FieldMapper.d.ts

@@ -7,4 +7,4 @@ export declare type FieldMapperProps<T extends object> = {
     control?: Control<T>;
     spacer?: number;
 };
-export declare const FieldMapper: <T extends object>({ field, isEditMode, spacer, control, }: FieldMapperProps<T>) => JSX.Element;
+export declare const FieldMapper: <T extends object>({ field, isEditMode, spacer, control, }: FieldMapperProps<T>) => JSX.Element | null;

package/dist/esm/src/molecules/InputField/InputField.d.ts

@@ -1,11 +1,12 @@
 /// <reference types="react" />
-import { Control } from 'react-hook-form/dist/types';
 import { CSSProperties } from 'styled-components';
-import { InputProps } from '../../atoms';
+import { Control, ControllerProps } from 'react-hook-form/dist/types';
+import { InputProps } from 'atoms';
 import { FieldLabelsProps } from '../FieldLabels/FieldLabels';
 export declare type InputFieldProps = {
     name: string;
     control?: Control<any>;
+    rules?: ControllerProps['rules'];
     required?: boolean;
     optional?: boolean;
     defaultValue?: string;
@@ -13,4 +14,4 @@ export declare type InputFieldProps = {
     styles?: CSSProperties;
     labelsProps?: FieldLabelsProps;
 };
-export declare const InputField: ({ control, name, inputProps, styles, labelsProps, defaultValue, optional, required, }: InputFieldProps) => JSX.Element;
+export declare const InputField: ({ control, name, inputProps, styles, labelsProps, defaultValue, optional, required, rules, }: InputFieldProps) => JSX.Element;

package/dist/esm/src/molecules/InputField/InputField.stories.d.ts

@@ -3,7 +3,7 @@ import type { ComponentStory } from '@storybook/react';
 import { InputField as InputFieldComponent } from './InputField';
 declare const _default: {
     title: string;
-    component: ({ control, name, inputProps, styles, labelsProps, defaultValue, optional, required, }: import("./InputField").InputFieldProps) => JSX.Element;
+    component: ({ control, name, inputProps, styles, labelsProps, defaultValue, optional, required, rules, }: import("./InputField").InputFieldProps) => JSX.Element;
 };
 export default _default;
 export declare const InputField: ComponentStory<typeof InputFieldComponent>;

package/dist/esm/src/molecules/SelectField/SelectField.d.ts

@@ -1,5 +1,5 @@
 /// <reference types="react" />
-import { Control } from 'react-hook-form/dist/types';
+import { Control, ControllerProps } from 'react-hook-form/dist/types';
 import { CSSProperties } from 'styled-components';
 import { SelectProps } from '../../atoms/Select/types';
 import { FieldLabelsProps } from '../FieldLabels/FieldLabels';
@@ -7,10 +7,11 @@ export declare type SelectFieldProps = {
     selectProps: SelectProps;
     labelsProps?: FieldLabelsProps;
     name: string;
+    rules?: ControllerProps['rules'];
     control?: Control<any>;
     required?: boolean;
     optional?: boolean;
     defaultValue?: string;
     styles?: CSSProperties;
 };
-export declare const SelectField: ({ selectProps, name, defaultValue, optional, required, control, styles, labelsProps, }: SelectFieldProps) => JSX.Element;
+export declare const SelectField: ({ selectProps, name, defaultValue, optional, required, control, styles, labelsProps, rules, }: SelectFieldProps) => JSX.Element;

package/dist/esm/src/molecules/SelectField/SelectField.stories.d.ts

@@ -3,7 +3,7 @@ import type { ComponentStory } from '@storybook/react';
 import { SelectField as SelectFieldComponent } from './SelectField';
 declare const _default: {
     title: string;
-    component: ({ selectProps, name, defaultValue, optional, required, control, styles, labelsProps, }: import("./SelectField").SelectFieldProps) => JSX.Element;
+    component: ({ selectProps, name, defaultValue, optional, required, control, styles, labelsProps, rules, }: import("./SelectField").SelectFieldProps) => JSX.Element;
 };
 export default _default;
 export declare const SelectField: ComponentStory<typeof SelectFieldComponent>;

package/dist/index.d.ts

@@ -11,12 +11,13 @@ import { SizesTypes as SizesTypes$2, ThemeColors as ThemeColors$2 } from 'theme'
 import { TooltipProps as TooltipProps$1 } from 'rc-tooltip/lib/Tooltip';
 import { WithGoogleMapProps } from 'react-google-maps/lib/withGoogleMap';
 import { WithScriptjsProps } from 'react-google-maps/lib/withScriptjs';
-import { Control } from 'react-hook-form/dist/types';
+import { Control, ControllerProps } from 'react-hook-form/dist/types';
+import { InputProps as InputProps$1 } from 'atoms';
 import { SelectOption as SelectOption$1 } from 'atoms/Select/types';
+import { ControllerProps as ControllerProps$1, DeepPartial, FieldValues, FormState } from 'react-hook-form';
 import { DrawerProps as DrawerProps$1 } from '@mui/material';
 import { SetPasswordFields, MaxRuleValidation, MinRuleValidation } from 'organisms/SetPasswordForm/types';
 import { FieldSectionProps as FieldSectionProps$1 } from 'molecules';
-import { DeepPartial, FieldValues, FormState } from 'react-hook-form';
 import { LoginFields as LoginFields$1 } from 'organisms/LoginForm/types';
 
 declare type BaseButtonProps = {
@@ -262,14 +263,15 @@ declare const FieldLabels: ({ label, isError, ruleLabel, tooltipText }: FieldLab
 declare type InputFieldProps = {
     name: string;
     control?: Control<any>;
+    rules?: ControllerProps['rules'];
     required?: boolean;
     optional?: boolean;
     defaultValue?: string;
-    inputProps: InputProps;
+    inputProps: InputProps$1;
     styles?: CSSProperties;
     labelsProps?: FieldLabelsProps;
 };
-declare const InputField: ({ control, name, inputProps, styles, labelsProps, defaultValue, optional, required, }: InputFieldProps) => JSX.Element;
+declare const InputField: ({ control, name, inputProps, styles, labelsProps, defaultValue, optional, required, rules, }: InputFieldProps) => JSX.Element;
 
 declare const getFieldPlaceholder: (type: FieldTypes$1, title?: string) => string;
 
@@ -283,6 +285,7 @@ declare type UIField<T = string> = (UIInputField | UISelectField | UICheckboxFie
     required?: boolean;
     optional?: boolean;
     tooltip?: string;
+    rules?: ControllerProps$1['rules'];
 };
 declare type UIInputField = {
     type: 'input';
@@ -318,7 +321,7 @@ declare type FieldMapperProps<T extends object> = {
     control?: Control<T>;
     spacer?: number;
 };
-declare const FieldMapper: <T extends object>({ field, isEditMode, spacer, control, }: FieldMapperProps<T>) => JSX.Element;
+declare const FieldMapper: <T extends object>({ field, isEditMode, spacer, control, }: FieldMapperProps<T>) => JSX.Element | null;
 
 declare type CheckboxFieldProps = {
     name: string;
@@ -332,13 +335,14 @@ declare type SelectFieldProps = {
     selectProps: SelectProps;
     labelsProps?: FieldLabelsProps;
     name: string;
+    rules?: ControllerProps['rules'];
     control?: Control<any>;
     required?: boolean;
     optional?: boolean;
     defaultValue?: string;
     styles?: CSSProperties;
 };
-declare const SelectField: ({ selectProps, name, defaultValue, optional, required, control, styles, labelsProps, }: SelectFieldProps) => JSX.Element;
+declare const SelectField: ({ selectProps, name, defaultValue, optional, required, control, styles, labelsProps, rules, }: SelectFieldProps) => JSX.Element;
 
 declare type CustomValidationRule<T = string> = {
     text: string;

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@zealicsolutions/web-ui",
-  "version": "0.1.1",
+  "version": "0.1.3",
   "repository": {
     "type": "git",
     "url": "git+ssh://git@bitbucket.org/Zealic_Solutions/zeal-ui-web.git"
@@ -26,10 +26,10 @@
     "storybook": "start-storybook -p 6006",
     "build-storybook": "build-storybook",
     "clean": "rimraf dist",
-    "lint-fix": "eslint --fix ./src/**/*.ts",
-    "pretty": "prettier --write ./src",
+    "lint:fix": "eslint --fix ./src/**/*.ts",
+    "format:fix": "prettier --write ./src",
     "prepare": "husky install",
-    "precommit": "yarn pretty && yarn lint-fix"
+    "precommit": "yarn format:fix && yarn lint:fix"
   },
   "devDependencies": {
     "@babel/core": "^7.19.0",
@@ -67,7 +67,6 @@
     "jest": "^29.0.2",
     "jest-environment-jsdom": "^29.0.2",
     "prettier": "^2.7.1",
-    "react": "^18.2.0",
     "rimraf": "^3.0.2",
     "rollup": "^2.79.0",
     "rollup-plugin-dts": "^4.2.2",
@@ -79,28 +78,29 @@
     "typescript": "^4.8.2"
   },
   "peerDependencies": {
-    "react": "*",
-    "react-dom": "*",
-    "styled-components": "*"
+    "react": "^18.2.0",
+    "react-dom": "^18.2.0",
+    "styled-components": "^5.3.5"
   },
   "dependencies": {
+    "react": "^18.2.0",
+    "react-dom": "^18.2.0",
+    "styled-components": "^5.3.5",
     "@mui/material": "^5.10.4",
     "@mui/styled-engine-sc": "npm:@mui/styled-engine-sc@latest",
     "@types/react-dom": "^18.0.6",
     "rc-dropdown": "^4.0.1",
     "rc-notification": "^4.6.0",
     "rc-tooltip": "^5.2.2",
-    "react-dom": "^18.2.0",
     "react-google-maps": "^9.4.5",
-    "react-hook-form": "^7.34.2",
-    "styled-components": "^5.3.5"
+    "react-hook-form": "^7.34.2"
   },
   "resolutions": {
     "@mui/styled-engine": "npm:@mui/styled-engine-sc@latest"
   },
   "husky": {
     "hooks": {
-      "precommit": "yarn pretty && yarn lint-fix && yarn test"
+      "precommit": "yarn format:fix && yarn lint:fix && yarn test"
     }
   },
   "bugs": {