@integrigo/integrigo-ui 1.6.13 → 1.6.14-a

package/lib/src/components/atoms/Icon/Icon.d.ts

@@ -1,42 +1,45 @@
-import React from 'react';
+import React from "react";
 export declare const iconHashMap: {
-    'angle-down': React.LazyExoticComponent<React.FCS<{}>>;
-    'arrow-left': React.LazyExoticComponent<React.FCS<{}>>;
-    bars: React.LazyExoticComponent<React.FCS<{}>>;
-    bell: React.LazyExoticComponent<React.FCS<{}>>;
-    'check-circle': React.LazyExoticComponent<React.FCS<{}>>;
-    'check-square': React.LazyExoticComponent<React.FCS<{}>>;
-    'clipboad-notes': React.LazyExoticComponent<React.FCS<{}>>;
-    close: React.LazyExoticComponent<React.FCS<{}>>;
-    'dice-five': React.LazyExoticComponent<React.FCS<{}>>;
-    edit: React.LazyExoticComponent<React.FCS<{}>>;
-    'ellipsis-horizontal': React.LazyExoticComponent<React.FCS<{}>>;
-    'ellipsis-vertical': React.LazyExoticComponent<React.FCS<{}>>;
-    envelope: React.LazyExoticComponent<React.FCS<{}>>;
-    'exclamation-circle': React.LazyExoticComponent<React.FCS<{}>>;
-    'exclamation-triangle': React.LazyExoticComponent<React.FCS<{}>>;
-    exit: React.LazyExoticComponent<React.FCS<{}>>;
-    facebook: React.LazyExoticComponent<React.FCS<{}>>;
-    home: React.LazyExoticComponent<React.FCS<{}>>;
-    'image-edit': React.LazyExoticComponent<React.FCS<{}>>;
-    instagram: React.LazyExoticComponent<React.FCS<{}>>;
-    linkedin: React.LazyExoticComponent<React.FCS<{}>>;
-    lock: React.LazyExoticComponent<React.FCS<{}>>;
-    minus: React.LazyExoticComponent<React.FCS<{}>>;
-    phone: React.LazyExoticComponent<React.FCS<{}>>;
-    plus: React.LazyExoticComponent<React.FCS<{}>>;
-    process: React.LazyExoticComponent<React.FCS<{}>>;
-    'points-circle': React.LazyExoticComponent<React.FCS<{}>>;
-    redo: React.LazyExoticComponent<React.FCS<{}>>;
-    setting: React.LazyExoticComponent<React.FCS<{}>>;
-    user: React.LazyExoticComponent<React.FCS<{}>>;
-    'user-circle': React.LazyExoticComponent<React.FCS<{}>>;
-    users: React.LazyExoticComponent<React.FCS<{}>>;
+    "angle-down": string;
+    "arrow-left": string;
+    "arrow-right": string;
+    bars: string;
+    bell: string;
+    "check-circle": string;
+    "check-square": string;
+    "clipboad-notes": string;
+    close: string;
+    "create-dashboard": string;
+    "dice-five": string;
+    edit: string;
+    "ellipsis-horizontal": string;
+    "ellipsis-vertical": string;
+    envelope: string;
+    "exclamation-circle": string;
+    "exclamation-triangle": string;
+    exit: string;
+    facebook: string;
+    home: string;
+    "image-edit": string;
+    instagram: string;
+    linkedin: string;
+    lock: string;
+    minus: string;
+    phone: string;
+    plus: string;
+    process: string;
+    "points-circle": string;
+    redo: string;
+    setting: string;
+    user: string;
+    "user-circle": string;
+    "user-plus": string;
+    users: string;
 };
 export declare type IconType = keyof typeof iconHashMap;
 declare type IconProps = React.SVGProps<SVGSVGElement> & {
     type: IconType;
-    size?: 'ultra-small' | 'small' | 'medium' | 'big' | {
+    size?: "ultra-small" | "small" | "medium" | "big" | {
         width: number;
         height: number;
     };

package/lib/src/components/atoms/Icon/Icon.stories.d.ts

@@ -1,7 +1,7 @@
 import React from 'react';
 import { ComponentStory, ComponentMeta } from '@storybook/react';
 declare const _default: ComponentMeta<React.FCS<React.SVGProps<SVGSVGElement> & {
-    type: "close" | "angle-down" | "arrow-left" | "bars" | "bell" | "check-circle" | "check-square" | "clipboad-notes" | "dice-five" | "edit" | "ellipsis-horizontal" | "ellipsis-vertical" | "envelope" | "exclamation-circle" | "exclamation-triangle" | "exit" | "facebook" | "home" | "image-edit" | "instagram" | "linkedin" | "lock" | "minus" | "phone" | "plus" | "process" | "points-circle" | "redo" | "setting" | "user" | "user-circle" | "users";
+    type: "close" | "angle-down" | "arrow-left" | "arrow-right" | "bars" | "bell" | "check-circle" | "check-square" | "clipboad-notes" | "create-dashboard" | "dice-five" | "edit" | "ellipsis-horizontal" | "ellipsis-vertical" | "envelope" | "exclamation-circle" | "exclamation-triangle" | "exit" | "facebook" | "home" | "image-edit" | "instagram" | "linkedin" | "lock" | "minus" | "phone" | "plus" | "process" | "points-circle" | "redo" | "setting" | "user" | "user-circle" | "user-plus" | "users";
     size?: "big" | "small" | "ultra-small" | "medium" | {
         width: number;
         height: number;
@@ -9,7 +9,7 @@ declare const _default: ComponentMeta<React.FCS<React.SVGProps<SVGSVGElement> &
 }>>;
 export default _default;
 export declare const SimpleIcon: ComponentStory<React.FCS<React.SVGProps<SVGSVGElement> & {
-    type: "close" | "angle-down" | "arrow-left" | "bars" | "bell" | "check-circle" | "check-square" | "clipboad-notes" | "dice-five" | "edit" | "ellipsis-horizontal" | "ellipsis-vertical" | "envelope" | "exclamation-circle" | "exclamation-triangle" | "exit" | "facebook" | "home" | "image-edit" | "instagram" | "linkedin" | "lock" | "minus" | "phone" | "plus" | "process" | "points-circle" | "redo" | "setting" | "user" | "user-circle" | "users";
+    type: "close" | "angle-down" | "arrow-left" | "arrow-right" | "bars" | "bell" | "check-circle" | "check-square" | "clipboad-notes" | "create-dashboard" | "dice-five" | "edit" | "ellipsis-horizontal" | "ellipsis-vertical" | "envelope" | "exclamation-circle" | "exclamation-triangle" | "exit" | "facebook" | "home" | "image-edit" | "instagram" | "linkedin" | "lock" | "minus" | "phone" | "plus" | "process" | "points-circle" | "redo" | "setting" | "user" | "user-circle" | "user-plus" | "users";
     size?: "big" | "small" | "ultra-small" | "medium" | {
         width: number;
         height: number;

package/lib/src/components/atoms/Icon/icons/ArrowRight.d.ts

@@ -0,0 +1,3 @@
+import React from "react";
+declare const ArrowRight: React.FCS;
+export default ArrowRight;

package/lib/src/components/atoms/Icon/icons/CheckSquare.d.ts

@@ -0,0 +1,3 @@
+import React from 'react';
+declare const CheckSquare: React.FCS;
+export default CheckSquare;

package/lib/src/components/atoms/Icon/icons/CreateDashboard.d.ts

@@ -0,0 +1,3 @@
+import React from "react";
+declare const CreateDashboard: React.FCS;
+export default CreateDashboard;

package/lib/src/components/atoms/Icon/icons/UserPlus.d.ts

@@ -0,0 +1,3 @@
+import React from "react";
+declare const UserPlus: React.FCS;
+export default UserPlus;

package/lib/src/components/molecules/Checkbox/Checkbox.stories.d.ts

@@ -1,19 +1,19 @@
 import React from 'react';
 import { ComponentStory, ComponentMeta } from '@storybook/react';
-declare const _default: ComponentMeta<React.ForwardRefExoticComponent<Omit<React.InputHTMLAttributes<HTMLInputElement>, "size" | "type"> & {
+declare const _default: ComponentMeta<React.ForwardRefExoticComponent<Omit<React.InputHTMLAttributes<HTMLInputElement>, "type" | "size"> & {
     size?: "s" | "m" | "l" | "xl" | undefined;
     label?: string | undefined;
 } & React.RefAttributes<HTMLInputElement>>>;
 export default _default;
-export declare const Basic: ComponentStory<React.ForwardRefExoticComponent<Omit<React.InputHTMLAttributes<HTMLInputElement>, "size" | "type"> & {
+export declare const Basic: ComponentStory<React.ForwardRefExoticComponent<Omit<React.InputHTMLAttributes<HTMLInputElement>, "type" | "size"> & {
     size?: "s" | "m" | "l" | "xl" | undefined;
     label?: string | undefined;
 } & React.RefAttributes<HTMLInputElement>>>;
-export declare const Controlled: ComponentStory<React.ForwardRefExoticComponent<Omit<React.InputHTMLAttributes<HTMLInputElement>, "size" | "type"> & {
+export declare const Controlled: ComponentStory<React.ForwardRefExoticComponent<Omit<React.InputHTMLAttributes<HTMLInputElement>, "type" | "size"> & {
     size?: "s" | "m" | "l" | "xl" | undefined;
     label?: string | undefined;
 } & React.RefAttributes<HTMLInputElement>>>;
-export declare const WithLabel: ComponentStory<React.ForwardRefExoticComponent<Omit<React.InputHTMLAttributes<HTMLInputElement>, "size" | "type"> & {
+export declare const WithLabel: ComponentStory<React.ForwardRefExoticComponent<Omit<React.InputHTMLAttributes<HTMLInputElement>, "type" | "size"> & {
     size?: "s" | "m" | "l" | "xl" | undefined;
     label?: string | undefined;
 } & React.RefAttributes<HTMLInputElement>>>;

package/lib/src/components/molecules/Input/Input.d.ts

@@ -13,7 +13,7 @@ export declare type InputProps = Omit<React.InputHTMLAttributes<HTMLInputElement
 export declare const Input: React.ForwardRefExoticComponent<Omit<React.InputHTMLAttributes<HTMLInputElement>, "size"> & FieldProps<any, any> & {
     label?: string | undefined;
     validationType?: ValidationType | undefined;
-    icon?: "angle-down" | "arrow-left" | "bars" | "bell" | "check-circle" | "check-square" | "clipboad-notes" | "close" | "dice-five" | "edit" | "ellipsis-horizontal" | "ellipsis-vertical" | "envelope" | "exclamation-circle" | "exclamation-triangle" | "exit" | "facebook" | "home" | "image-edit" | "instagram" | "linkedin" | "lock" | "minus" | "phone" | "plus" | "process" | "points-circle" | "redo" | "setting" | "user" | "user-circle" | "users" | undefined;
+    icon?: "angle-down" | "arrow-left" | "arrow-right" | "bars" | "bell" | "check-circle" | "check-square" | "clipboad-notes" | "close" | "create-dashboard" | "dice-five" | "edit" | "ellipsis-horizontal" | "ellipsis-vertical" | "envelope" | "exclamation-circle" | "exclamation-triangle" | "exit" | "facebook" | "home" | "image-edit" | "instagram" | "linkedin" | "lock" | "minus" | "phone" | "plus" | "process" | "points-circle" | "redo" | "setting" | "user" | "user-circle" | "user-plus" | "users" | undefined;
     size?: "xl" | "l" | "m" | "s" | undefined;
     direction?: "ltr" | "rtl" | undefined;
     onIconClick?: (() => void) | undefined;

package/lib/src/components/molecules/Input/Input.stories.d.ts

@@ -3,7 +3,7 @@ import { ComponentStory, ComponentMeta } from '@storybook/react';
 declare const _default: ComponentMeta<React.ForwardRefExoticComponent<Omit<React.InputHTMLAttributes<HTMLInputElement>, "size"> & import("formik").FieldProps<any, any> & {
     label?: string | undefined;
     validationType?: import("../../../types/validation").ValidationType | undefined;
-    icon?: "close" | "angle-down" | "arrow-left" | "bars" | "bell" | "check-circle" | "check-square" | "clipboad-notes" | "dice-five" | "edit" | "ellipsis-horizontal" | "ellipsis-vertical" | "envelope" | "exclamation-circle" | "exclamation-triangle" | "exit" | "facebook" | "home" | "image-edit" | "instagram" | "linkedin" | "lock" | "minus" | "phone" | "plus" | "process" | "points-circle" | "redo" | "setting" | "user" | "user-circle" | "users" | undefined;
+    icon?: "close" | "angle-down" | "arrow-left" | "arrow-right" | "bars" | "bell" | "check-circle" | "check-square" | "clipboad-notes" | "create-dashboard" | "dice-five" | "edit" | "ellipsis-horizontal" | "ellipsis-vertical" | "envelope" | "exclamation-circle" | "exclamation-triangle" | "exit" | "facebook" | "home" | "image-edit" | "instagram" | "linkedin" | "lock" | "minus" | "phone" | "plus" | "process" | "points-circle" | "redo" | "setting" | "user" | "user-circle" | "user-plus" | "users" | undefined;
     size?: "s" | "m" | "l" | "xl" | undefined;
     direction?: "rtl" | "ltr" | undefined;
     onIconClick?: (() => void) | undefined;
@@ -12,7 +12,7 @@ export default _default;
 export declare const Basic: ComponentStory<React.ForwardRefExoticComponent<Omit<React.InputHTMLAttributes<HTMLInputElement>, "size"> & import("formik").FieldProps<any, any> & {
     label?: string | undefined;
     validationType?: import("../../../types/validation").ValidationType | undefined;
-    icon?: "close" | "angle-down" | "arrow-left" | "bars" | "bell" | "check-circle" | "check-square" | "clipboad-notes" | "dice-five" | "edit" | "ellipsis-horizontal" | "ellipsis-vertical" | "envelope" | "exclamation-circle" | "exclamation-triangle" | "exit" | "facebook" | "home" | "image-edit" | "instagram" | "linkedin" | "lock" | "minus" | "phone" | "plus" | "process" | "points-circle" | "redo" | "setting" | "user" | "user-circle" | "users" | undefined;
+    icon?: "close" | "angle-down" | "arrow-left" | "arrow-right" | "bars" | "bell" | "check-circle" | "check-square" | "clipboad-notes" | "create-dashboard" | "dice-five" | "edit" | "ellipsis-horizontal" | "ellipsis-vertical" | "envelope" | "exclamation-circle" | "exclamation-triangle" | "exit" | "facebook" | "home" | "image-edit" | "instagram" | "linkedin" | "lock" | "minus" | "phone" | "plus" | "process" | "points-circle" | "redo" | "setting" | "user" | "user-circle" | "user-plus" | "users" | undefined;
     size?: "s" | "m" | "l" | "xl" | undefined;
     direction?: "rtl" | "ltr" | undefined;
     onIconClick?: (() => void) | undefined;
@@ -20,7 +20,7 @@ export declare const Basic: ComponentStory<React.ForwardRefExoticComponent<Omit<
 export declare const Success: ComponentStory<React.ForwardRefExoticComponent<Omit<React.InputHTMLAttributes<HTMLInputElement>, "size"> & import("formik").FieldProps<any, any> & {
     label?: string | undefined;
     validationType?: import("../../../types/validation").ValidationType | undefined;
-    icon?: "close" | "angle-down" | "arrow-left" | "bars" | "bell" | "check-circle" | "check-square" | "clipboad-notes" | "dice-five" | "edit" | "ellipsis-horizontal" | "ellipsis-vertical" | "envelope" | "exclamation-circle" | "exclamation-triangle" | "exit" | "facebook" | "home" | "image-edit" | "instagram" | "linkedin" | "lock" | "minus" | "phone" | "plus" | "process" | "points-circle" | "redo" | "setting" | "user" | "user-circle" | "users" | undefined;
+    icon?: "close" | "angle-down" | "arrow-left" | "arrow-right" | "bars" | "bell" | "check-circle" | "check-square" | "clipboad-notes" | "create-dashboard" | "dice-five" | "edit" | "ellipsis-horizontal" | "ellipsis-vertical" | "envelope" | "exclamation-circle" | "exclamation-triangle" | "exit" | "facebook" | "home" | "image-edit" | "instagram" | "linkedin" | "lock" | "minus" | "phone" | "plus" | "process" | "points-circle" | "redo" | "setting" | "user" | "user-circle" | "user-plus" | "users" | undefined;
     size?: "s" | "m" | "l" | "xl" | undefined;
     direction?: "rtl" | "ltr" | undefined;
     onIconClick?: (() => void) | undefined;
@@ -28,7 +28,7 @@ export declare const Success: ComponentStory<React.ForwardRefExoticComponent<Omi
 export declare const Error: ComponentStory<React.ForwardRefExoticComponent<Omit<React.InputHTMLAttributes<HTMLInputElement>, "size"> & import("formik").FieldProps<any, any> & {
     label?: string | undefined;
     validationType?: import("../../../types/validation").ValidationType | undefined;
-    icon?: "close" | "angle-down" | "arrow-left" | "bars" | "bell" | "check-circle" | "check-square" | "clipboad-notes" | "dice-five" | "edit" | "ellipsis-horizontal" | "ellipsis-vertical" | "envelope" | "exclamation-circle" | "exclamation-triangle" | "exit" | "facebook" | "home" | "image-edit" | "instagram" | "linkedin" | "lock" | "minus" | "phone" | "plus" | "process" | "points-circle" | "redo" | "setting" | "user" | "user-circle" | "users" | undefined;
+    icon?: "close" | "angle-down" | "arrow-left" | "arrow-right" | "bars" | "bell" | "check-circle" | "check-square" | "clipboad-notes" | "create-dashboard" | "dice-five" | "edit" | "ellipsis-horizontal" | "ellipsis-vertical" | "envelope" | "exclamation-circle" | "exclamation-triangle" | "exit" | "facebook" | "home" | "image-edit" | "instagram" | "linkedin" | "lock" | "minus" | "phone" | "plus" | "process" | "points-circle" | "redo" | "setting" | "user" | "user-circle" | "user-plus" | "users" | undefined;
     size?: "s" | "m" | "l" | "xl" | undefined;
     direction?: "rtl" | "ltr" | undefined;
     onIconClick?: (() => void) | undefined;
@@ -36,7 +36,7 @@ export declare const Error: ComponentStory<React.ForwardRefExoticComponent<Omit<
 export declare const Disabled: ComponentStory<React.ForwardRefExoticComponent<Omit<React.InputHTMLAttributes<HTMLInputElement>, "size"> & import("formik").FieldProps<any, any> & {
     label?: string | undefined;
     validationType?: import("../../../types/validation").ValidationType | undefined;
-    icon?: "close" | "angle-down" | "arrow-left" | "bars" | "bell" | "check-circle" | "check-square" | "clipboad-notes" | "dice-five" | "edit" | "ellipsis-horizontal" | "ellipsis-vertical" | "envelope" | "exclamation-circle" | "exclamation-triangle" | "exit" | "facebook" | "home" | "image-edit" | "instagram" | "linkedin" | "lock" | "minus" | "phone" | "plus" | "process" | "points-circle" | "redo" | "setting" | "user" | "user-circle" | "users" | undefined;
+    icon?: "close" | "angle-down" | "arrow-left" | "arrow-right" | "bars" | "bell" | "check-circle" | "check-square" | "clipboad-notes" | "create-dashboard" | "dice-five" | "edit" | "ellipsis-horizontal" | "ellipsis-vertical" | "envelope" | "exclamation-circle" | "exclamation-triangle" | "exit" | "facebook" | "home" | "image-edit" | "instagram" | "linkedin" | "lock" | "minus" | "phone" | "plus" | "process" | "points-circle" | "redo" | "setting" | "user" | "user-circle" | "user-plus" | "users" | undefined;
     size?: "s" | "m" | "l" | "xl" | undefined;
     direction?: "rtl" | "ltr" | undefined;
     onIconClick?: (() => void) | undefined;
@@ -44,7 +44,7 @@ export declare const Disabled: ComponentStory<React.ForwardRefExoticComponent<Om
 export declare const IconLTR: ComponentStory<React.ForwardRefExoticComponent<Omit<React.InputHTMLAttributes<HTMLInputElement>, "size"> & import("formik").FieldProps<any, any> & {
     label?: string | undefined;
     validationType?: import("../../../types/validation").ValidationType | undefined;
-    icon?: "close" | "angle-down" | "arrow-left" | "bars" | "bell" | "check-circle" | "check-square" | "clipboad-notes" | "dice-five" | "edit" | "ellipsis-horizontal" | "ellipsis-vertical" | "envelope" | "exclamation-circle" | "exclamation-triangle" | "exit" | "facebook" | "home" | "image-edit" | "instagram" | "linkedin" | "lock" | "minus" | "phone" | "plus" | "process" | "points-circle" | "redo" | "setting" | "user" | "user-circle" | "users" | undefined;
+    icon?: "close" | "angle-down" | "arrow-left" | "arrow-right" | "bars" | "bell" | "check-circle" | "check-square" | "clipboad-notes" | "create-dashboard" | "dice-five" | "edit" | "ellipsis-horizontal" | "ellipsis-vertical" | "envelope" | "exclamation-circle" | "exclamation-triangle" | "exit" | "facebook" | "home" | "image-edit" | "instagram" | "linkedin" | "lock" | "minus" | "phone" | "plus" | "process" | "points-circle" | "redo" | "setting" | "user" | "user-circle" | "user-plus" | "users" | undefined;
     size?: "s" | "m" | "l" | "xl" | undefined;
     direction?: "rtl" | "ltr" | undefined;
     onIconClick?: (() => void) | undefined;
@@ -52,7 +52,7 @@ export declare const IconLTR: ComponentStory<React.ForwardRefExoticComponent<Omi
 export declare const IconRTL: ComponentStory<React.ForwardRefExoticComponent<Omit<React.InputHTMLAttributes<HTMLInputElement>, "size"> & import("formik").FieldProps<any, any> & {
     label?: string | undefined;
     validationType?: import("../../../types/validation").ValidationType | undefined;
-    icon?: "close" | "angle-down" | "arrow-left" | "bars" | "bell" | "check-circle" | "check-square" | "clipboad-notes" | "dice-five" | "edit" | "ellipsis-horizontal" | "ellipsis-vertical" | "envelope" | "exclamation-circle" | "exclamation-triangle" | "exit" | "facebook" | "home" | "image-edit" | "instagram" | "linkedin" | "lock" | "minus" | "phone" | "plus" | "process" | "points-circle" | "redo" | "setting" | "user" | "user-circle" | "users" | undefined;
+    icon?: "close" | "angle-down" | "arrow-left" | "arrow-right" | "bars" | "bell" | "check-circle" | "check-square" | "clipboad-notes" | "create-dashboard" | "dice-five" | "edit" | "ellipsis-horizontal" | "ellipsis-vertical" | "envelope" | "exclamation-circle" | "exclamation-triangle" | "exit" | "facebook" | "home" | "image-edit" | "instagram" | "linkedin" | "lock" | "minus" | "phone" | "plus" | "process" | "points-circle" | "redo" | "setting" | "user" | "user-circle" | "user-plus" | "users" | undefined;
     size?: "s" | "m" | "l" | "xl" | undefined;
     direction?: "rtl" | "ltr" | undefined;
     onIconClick?: (() => void) | undefined;
@@ -60,7 +60,7 @@ export declare const IconRTL: ComponentStory<React.ForwardRefExoticComponent<Omi
 export declare const DisabledIcon: ComponentStory<React.ForwardRefExoticComponent<Omit<React.InputHTMLAttributes<HTMLInputElement>, "size"> & import("formik").FieldProps<any, any> & {
     label?: string | undefined;
     validationType?: import("../../../types/validation").ValidationType | undefined;
-    icon?: "close" | "angle-down" | "arrow-left" | "bars" | "bell" | "check-circle" | "check-square" | "clipboad-notes" | "dice-five" | "edit" | "ellipsis-horizontal" | "ellipsis-vertical" | "envelope" | "exclamation-circle" | "exclamation-triangle" | "exit" | "facebook" | "home" | "image-edit" | "instagram" | "linkedin" | "lock" | "minus" | "phone" | "plus" | "process" | "points-circle" | "redo" | "setting" | "user" | "user-circle" | "users" | undefined;
+    icon?: "close" | "angle-down" | "arrow-left" | "arrow-right" | "bars" | "bell" | "check-circle" | "check-square" | "clipboad-notes" | "create-dashboard" | "dice-five" | "edit" | "ellipsis-horizontal" | "ellipsis-vertical" | "envelope" | "exclamation-circle" | "exclamation-triangle" | "exit" | "facebook" | "home" | "image-edit" | "instagram" | "linkedin" | "lock" | "minus" | "phone" | "plus" | "process" | "points-circle" | "redo" | "setting" | "user" | "user-circle" | "user-plus" | "users" | undefined;
     size?: "s" | "m" | "l" | "xl" | undefined;
     direction?: "rtl" | "ltr" | undefined;
     onIconClick?: (() => void) | undefined;
@@ -68,7 +68,7 @@ export declare const DisabledIcon: ComponentStory<React.ForwardRefExoticComponen
 export declare const WithLabel: ComponentStory<React.ForwardRefExoticComponent<Omit<React.InputHTMLAttributes<HTMLInputElement>, "size"> & import("formik").FieldProps<any, any> & {
     label?: string | undefined;
     validationType?: import("../../../types/validation").ValidationType | undefined;
-    icon?: "close" | "angle-down" | "arrow-left" | "bars" | "bell" | "check-circle" | "check-square" | "clipboad-notes" | "dice-five" | "edit" | "ellipsis-horizontal" | "ellipsis-vertical" | "envelope" | "exclamation-circle" | "exclamation-triangle" | "exit" | "facebook" | "home" | "image-edit" | "instagram" | "linkedin" | "lock" | "minus" | "phone" | "plus" | "process" | "points-circle" | "redo" | "setting" | "user" | "user-circle" | "users" | undefined;
+    icon?: "close" | "angle-down" | "arrow-left" | "arrow-right" | "bars" | "bell" | "check-circle" | "check-square" | "clipboad-notes" | "create-dashboard" | "dice-five" | "edit" | "ellipsis-horizontal" | "ellipsis-vertical" | "envelope" | "exclamation-circle" | "exclamation-triangle" | "exit" | "facebook" | "home" | "image-edit" | "instagram" | "linkedin" | "lock" | "minus" | "phone" | "plus" | "process" | "points-circle" | "redo" | "setting" | "user" | "user-circle" | "user-plus" | "users" | undefined;
     size?: "s" | "m" | "l" | "xl" | undefined;
     direction?: "rtl" | "ltr" | undefined;
     onIconClick?: (() => void) | undefined;

package/lib/src/components/molecules/Radio/Radio.stories.d.ts

@@ -1,20 +1,20 @@
 import React from 'react';
 import { ComponentMeta, ComponentStory } from '@storybook/react';
 import { Size } from './Radio';
-declare const _default: ComponentMeta<React.ForwardRefExoticComponent<Omit<React.InputHTMLAttributes<HTMLInputElement>, "size" | "type"> & {
+declare const _default: ComponentMeta<React.ForwardRefExoticComponent<Omit<React.InputHTMLAttributes<HTMLInputElement>, "type" | "size"> & {
     size?: Size | undefined;
     label?: string | undefined;
 } & React.RefAttributes<HTMLInputElement>>>;
 export default _default;
-export declare const Basic: ComponentStory<React.ForwardRefExoticComponent<Omit<React.InputHTMLAttributes<HTMLInputElement>, "size" | "type"> & {
+export declare const Basic: ComponentStory<React.ForwardRefExoticComponent<Omit<React.InputHTMLAttributes<HTMLInputElement>, "type" | "size"> & {
     size?: Size | undefined;
     label?: string | undefined;
 } & React.RefAttributes<HTMLInputElement>>>;
-export declare const Controlled: ComponentStory<React.ForwardRefExoticComponent<Omit<React.InputHTMLAttributes<HTMLInputElement>, "size" | "type"> & {
+export declare const Controlled: ComponentStory<React.ForwardRefExoticComponent<Omit<React.InputHTMLAttributes<HTMLInputElement>, "type" | "size"> & {
     size?: Size | undefined;
     label?: string | undefined;
 } & React.RefAttributes<HTMLInputElement>>>;
-export declare const WithLabel: ComponentStory<React.ForwardRefExoticComponent<Omit<React.InputHTMLAttributes<HTMLInputElement>, "size" | "type"> & {
+export declare const WithLabel: ComponentStory<React.ForwardRefExoticComponent<Omit<React.InputHTMLAttributes<HTMLInputElement>, "type" | "size"> & {
     size?: Size | undefined;
     label?: string | undefined;
 } & React.RefAttributes<HTMLInputElement>>>;

package/package.json

@@ -3,7 +3,7 @@
   "publishConfig": {
     "registry": "https://npm.pkg.github.com/integrigo"
   },
-  "version": "1.6.13",
+  "version": "1.6.14a",
   "main": "lib/index.js",
   "module": "lib/index.esm.js",
   "types": "lib/index.d.ts",

package/src/components/atoms/Icon/Icon.tsx

@@ -1,76 +1,42 @@
-import React from 'react';
-import { Color } from '../../../styles';
-
-const AngleDown = React.lazy(() => import('./icons/AngleDown'));
-const ArrowLeft = React.lazy(() => import('./icons/ArrowLeft'));
-const Bars = React.lazy(() => import('./icons/Bars'));
-const Bell = React.lazy(() => import('./icons/Bell'));
-const CheckCircle = React.lazy(() => import('./icons/CheckCircle'));
-const CheckSquare = React.lazy(() => import('./icons/ChechSquare'));
-const ClipboardNotes = React.lazy(() => import('./icons/ClipboardNotes'));
-const Close = React.lazy(() => import('./icons/Close'));
-const DiceFive = React.lazy(() => import('./icons/DiceFive'));
-const Edit = React.lazy(() => import('./icons/Edit'));
-const EllipsisVertical = React.lazy(() => import('./icons/EllipsisVertical'));
-const EllipsisHorizontal = React.lazy(
-  () => import('./icons/EllipsisHorizontal'),
-);
-const Envelope = React.lazy(() => import('./icons/Envelope'));
-const ExclamationCircle = React.lazy(() => import('./icons/ExclamationCircle'));
-const ExclamationTriangle = React.lazy(
-  () => import('./icons/ExclamationTriangle'),
-);
-const Exit = React.lazy(() => import('./icons/Exit'));
-const Facebook = React.lazy(() => import('./icons/Facebook'));
-const Home = React.lazy(() => import('./icons/Home'));
-const ImageEdit = React.lazy(() => import('./icons/ImageEdit'));
-const Instagram = React.lazy(() => import('./icons/Instagram'));
-const Linkedin = React.lazy(() => import('./icons/Linkedin'));
-const Lock = React.lazy(() => import('./icons/Lock'));
-const Minus = React.lazy(() => import('./icons/Minus'));
-const Phone = React.lazy(() => import('./icons/Phone'));
-const Plus = React.lazy(() => import('./icons/Plus'));
-const PointsCircle = React.lazy(() => import('./icons/PointsCircle'));
-const Process = React.lazy(() => import('./icons/Process'));
-const Redo = React.lazy(() => import('./icons/Redo'));
-const Setting = React.lazy(() => import('./icons/Setting'));
-const User = React.lazy(() => import('./icons/User'));
-const UserCircle = React.lazy(() => import('./icons/UserCircle'));
-const Users = React.lazy(() => import('./icons/Users'));
+import React, { Suspense } from "react";
+import { Color } from "../../../styles";
 
 export const iconHashMap = {
-  'angle-down': AngleDown,
-  'arrow-left': ArrowLeft,
-  bars: Bars,
-  bell: Bell,
-  'check-circle': CheckCircle,
-  'check-square': CheckSquare,
-  'clipboad-notes': ClipboardNotes,
-  close: Close,
-  'dice-five': DiceFive,
-  edit: Edit,
-  'ellipsis-horizontal': EllipsisHorizontal,
-  'ellipsis-vertical': EllipsisVertical,
-  envelope: Envelope,
-  'exclamation-circle': ExclamationCircle,
-  'exclamation-triangle': ExclamationTriangle,
-  exit: Exit,
-  facebook: Facebook,
-  home: Home,
-  'image-edit': ImageEdit,
-  instagram: Instagram,
-  linkedin: Linkedin,
-  lock: Lock,
-  minus: Minus,
-  phone: Phone,
-  plus: Plus,
-  process: Process,
-  'points-circle': PointsCircle,
-  redo: Redo,
-  setting: Setting,
-  user: User,
-  'user-circle': UserCircle,
-  users: Users,
+  "angle-down": "AngleDown",
+  "arrow-left": "ArrowLeft",
+  "arrow-right": "ArrowRight",
+  bars: "Bars",
+  bell: "Bell",
+  "check-circle": "CheckCircle",
+  "check-square": "CheckSquare",
+  "clipboad-notes": "ClipboardNotes",
+  close: "Close",
+  "create-dashboard": "CreateDashboard",
+  "dice-five": "DiceFive",
+  edit: "Edit",
+  "ellipsis-horizontal": "EllipsisHorizontal",
+  "ellipsis-vertical": "EllipsisVertical",
+  envelope: "Envelope",
+  "exclamation-circle": "ExclamationCircle",
+  "exclamation-triangle": "ExclamationTriangle",
+  exit: "Exit",
+  facebook: "Facebook",
+  home: "Home",
+  "image-edit": "ImageEdit",
+  instagram: "Instagram",
+  linkedin: "Linkedin",
+  lock: "Lock",
+  minus: "Minus",
+  phone: "Phone",
+  plus: "Plus",
+  process: "Process",
+  "points-circle": "PointsCircle",
+  redo: "Redo",
+  setting: "Setting",
+  user: "User",
+  "user-circle": "UserCircle",
+  "user-plus": "UserPlus",
+  users: "Users",
 };
 
 export type IconType = keyof typeof iconHashMap;
@@ -78,15 +44,15 @@ export type IconType = keyof typeof iconHashMap;
 type IconProps = React.SVGProps<SVGSVGElement> & {
   type: IconType;
   size?:
-  | 'ultra-small'
-  | 'small'
-  | 'medium'
-  | 'big'
-  | { width: number; height: number };
+    | "ultra-small"
+    | "small"
+    | "medium"
+    | "big"
+    | { width: number; height: number };
 };
 
 const sizeHashMap = {
-  'ultra-small': {
+  "ultra-small": {
     width: 20,
     height: 20,
   },
@@ -107,13 +73,29 @@ const sizeHashMap = {
 export const Icon: React.FCS<IconProps> = ({
   className,
   type,
-  size = 'ultra-small',
+  size = "ultra-small",
   ...props
 }) => {
-  const Component = iconHashMap[type];
-  const sizes = typeof size === 'string' ? sizeHashMap[size] : size;
+  const Component = React.lazy(() => import("./icons/" + iconHashMap[type]));
+  const sizes = typeof size === "string" ? sizeHashMap[size] : size;
 
   return (
-    <Component className={className} fill={Color.Navy} {...sizes} {...props} />
+    <Suspense
+      fallback={
+        <svg
+          viewBox="0 0 24 24"
+          width="20"
+          height="20"
+          xmlns="http://www.w3.org/2000/svg"
+        />
+      }
+    >
+      <Component
+        className={className}
+        fill={Color.Navy}
+        {...sizes}
+        {...props}
+      />
+    </Suspense>
   );
 };

package/src/components/atoms/Icon/icons/ArrowRight.tsx

@@ -0,0 +1,9 @@
+import React from "react";
+
+const ArrowRight: React.FCS = (props) => (
+  <svg viewBox="0 0 24 24" xmlns="http://www.w3.org/2000/svg" {...props}>
+    <path d="M17.92 11.62C17.8724 11.4973 17.801 11.3851 17.71 11.29L12.71 6.29C12.6168 6.19676 12.5061 6.1228 12.3842 6.07234C12.2624 6.02188 12.1319 5.99591 12 5.99591C11.7337 5.99591 11.4783 6.1017 11.29 6.29C11.1968 6.38324 11.1228 6.49393 11.0723 6.61575C11.0219 6.73758 10.9959 6.86814 10.9959 7C10.9959 7.2663 11.1017 7.5217 11.29 7.71L14.59 11H7C6.73478 11 6.48043 11.1054 6.29289 11.2929C6.10536 11.4804 6 11.7348 6 12C6 12.2652 6.10536 12.5196 6.29289 12.7071C6.48043 12.8946 6.73478 13 7 13H14.59L11.29 16.29C11.1963 16.383 11.1219 16.4936 11.0711 16.6154C11.0203 16.7373 10.9942 16.868 10.9942 17C10.9942 17.132 11.0203 17.2627 11.0711 17.3846C11.1219 17.5064 11.1963 17.617 11.29 17.71C11.383 17.8037 11.4936 17.8781 11.6154 17.9289C11.7373 17.9797 11.868 18.0058 12 18.0058C12.132 18.0058 12.2627 17.9797 12.3846 17.9289C12.5064 17.8781 12.617 17.8037 12.71 17.71L17.71 12.71C17.801 12.6149 17.8724 12.5028 17.92 12.38C18.02 12.1365 18.02 11.8635 17.92 11.62Z" />
+  </svg>
+);
+
+export default ArrowRight;

package/src/components/atoms/Icon/icons/CreateDashboard.tsx

@@ -0,0 +1,9 @@
+import React from "react";
+
+const CreateDashboard: React.FCS = (props) => (
+  <svg viewBox="0 0 24 24" xmlns="http://www.w3.org/2000/svg" {...props}>
+    <path d="M10 13H4C3.73478 13 3.48043 13.1054 3.29289 13.2929C3.10536 13.4804 3 13.7348 3 14V20C3 20.2652 3.10536 20.5196 3.29289 20.7071C3.48043 20.8946 3.73478 21 4 21H10C10.2652 21 10.5196 20.8946 10.7071 20.7071C10.8946 20.5196 11 20.2652 11 20V14C11 13.7348 10.8946 13.4804 10.7071 13.2929C10.5196 13.1054 10.2652 13 10 13ZM9 19H5V15H9V19ZM20 3H14C13.7348 3 13.4804 3.10536 13.2929 3.29289C13.1054 3.48043 13 3.73478 13 4V10C13 10.2652 13.1054 10.5196 13.2929 10.7071C13.4804 10.8946 13.7348 11 14 11H20C20.2652 11 20.5196 10.8946 20.7071 10.7071C20.8946 10.5196 21 10.2652 21 10V4C21 3.73478 20.8946 3.48043 20.7071 3.29289C20.5196 3.10536 20.2652 3 20 3ZM19 9H15V5H19V9ZM20 16H18V14C18 13.7348 17.8946 13.4804 17.7071 13.2929C17.5196 13.1054 17.2652 13 17 13C16.7348 13 16.4804 13.1054 16.2929 13.2929C16.1054 13.4804 16 13.7348 16 14V16H14C13.7348 16 13.4804 16.1054 13.2929 16.2929C13.1054 16.4804 13 16.7348 13 17C13 17.2652 13.1054 17.5196 13.2929 17.7071C13.4804 17.8946 13.7348 18 14 18H16V20C16 20.2652 16.1054 20.5196 16.2929 20.7071C16.4804 20.8946 16.7348 21 17 21C17.2652 21 17.5196 20.8946 17.7071 20.7071C17.8946 20.5196 18 20.2652 18 20V18H20C20.2652 18 20.5196 17.8946 20.7071 17.7071C20.8946 17.5196 21 17.2652 21 17C21 16.7348 20.8946 16.4804 20.7071 16.2929C20.5196 16.1054 20.2652 16 20 16ZM10 3H4C3.73478 3 3.48043 3.10536 3.29289 3.29289C3.10536 3.48043 3 3.73478 3 4V10C3 10.2652 3.10536 10.5196 3.29289 10.7071C3.48043 10.8946 3.73478 11 4 11H10C10.2652 11 10.5196 10.8946 10.7071 10.7071C10.8946 10.5196 11 10.2652 11 10V4C11 3.73478 10.8946 3.48043 10.7071 3.29289C10.5196 3.10536 10.2652 3 10 3ZM9 9H5V5H9V9Z" />
+  </svg>
+);
+
+export default CreateDashboard;

package/src/components/atoms/Icon/icons/UserPlus.tsx

@@ -0,0 +1,9 @@
+import React from "react";
+
+const UserPlus: React.FCS = (props) => (
+  <svg viewBox="0 0 24 24" xmlns="http://www.w3.org/2000/svg" {...props}>
+    <path d="M21 10.5H20V9.5C20 9.23478 19.8946 8.98043 19.7071 8.79289C19.5196 8.60536 19.2652 8.5 19 8.5C18.7348 8.5 18.4804 8.60536 18.2929 8.79289C18.1054 8.98043 18 9.23478 18 9.5V10.5H17C16.7348 10.5 16.4804 10.6054 16.2929 10.7929C16.1054 10.9804 16 11.2348 16 11.5C16 11.7652 16.1054 12.0196 16.2929 12.2071C16.4804 12.3946 16.7348 12.5 17 12.5H18V13.5C18 13.7652 18.1054 14.0196 18.2929 14.2071C18.4804 14.3946 18.7348 14.5 19 14.5C19.2652 14.5 19.5196 14.3946 19.7071 14.2071C19.8946 14.0196 20 13.7652 20 13.5V12.5H21C21.2652 12.5 21.5196 12.3946 21.7071 12.2071C21.8946 12.0196 22 11.7652 22 11.5C22 11.2348 21.8946 10.9804 21.7071 10.7929C21.5196 10.6054 21.2652 10.5 21 10.5ZM13.3 12.22C13.8336 11.7581 14.2616 11.1869 14.5549 10.545C14.8482 9.90316 15 9.20571 15 8.5C15 7.17392 14.4732 5.90215 13.5355 4.96447C12.5979 4.02678 11.3261 3.5 10 3.5C8.67392 3.5 7.40215 4.02678 6.46447 4.96447C5.52678 5.90215 5 7.17392 5 8.5C4.99999 9.20571 5.1518 9.90316 5.44513 10.545C5.73845 11.1869 6.16642 11.7581 6.7 12.22C5.30014 12.8539 4.11247 13.8775 3.27898 15.1685C2.4455 16.4596 2.00147 17.9633 2 19.5C2 19.7652 2.10536 20.0196 2.29289 20.2071C2.48043 20.3946 2.73478 20.5 3 20.5C3.26522 20.5 3.51957 20.3946 3.70711 20.2071C3.89464 20.0196 4 19.7652 4 19.5C4 17.9087 4.63214 16.3826 5.75736 15.2574C6.88258 14.1321 8.4087 13.5 10 13.5C11.5913 13.5 13.1174 14.1321 14.2426 15.2574C15.3679 16.3826 16 17.9087 16 19.5C16 19.7652 16.1054 20.0196 16.2929 20.2071C16.4804 20.3946 16.7348 20.5 17 20.5C17.2652 20.5 17.5196 20.3946 17.7071 20.2071C17.8946 20.0196 18 19.7652 18 19.5C17.9985 17.9633 17.5545 16.4596 16.721 15.1685C15.8875 13.8775 14.6999 12.8539 13.3 12.22ZM10 11.5C9.40666 11.5 8.82664 11.3241 8.33329 10.9944C7.83994 10.6648 7.45542 10.1962 7.22836 9.64805C7.0013 9.09987 6.94189 8.49667 7.05764 7.91473C7.1734 7.33279 7.45912 6.79824 7.87868 6.37868C8.29824 5.95912 8.83279 5.6734 9.41473 5.55764C9.99667 5.44189 10.5999 5.5013 11.1481 5.72836C11.6962 5.95542 12.1648 6.33994 12.4944 6.83329C12.8241 7.32664 13 7.90666 13 8.5C13 9.29565 12.6839 10.0587 12.1213 10.6213C11.5587 11.1839 10.7956 11.5 10 11.5Z" />
+  </svg>
+);
+
+export default UserPlus;