dfh-ui-library 1.1.7 → 1.1.8

package/dist/cjs/types/components/Button/Button.d.ts

@@ -1,4 +1,4 @@
 import React from "react";
-import { ButtonProps } from "../../shared/models/components/base.model";
-declare const Button: ({ type, isDisabled, buttonLabel, iconType, iconColor, iconAlignment, isIconEnabled, variants, additionalClasses, iconClass, onClick, }: ButtonProps) => React.JSX.Element;
+import { IButtonProps } from "../../shared/models/components/base.model";
+declare const Button: ({ type, isDisabled, buttonLabel, iconType, iconColor, iconAlignment, isIconEnabled, variants, additionalClasses, iconClass, onClick, }: IButtonProps) => React.JSX.Element;
 export default Button;

package/dist/cjs/types/components/Card/Card.d.ts

@@ -0,0 +1,7 @@
+import React from "react";
+import { ICardProps } from "../../shared/models/components/base.model";
+/**
+ * Primary UI component for user interaction
+ */
+declare const Card: React.FC<ICardProps>;
+export default Card;

package/dist/cjs/types/components/Card/Card.test.d.ts

@@ -0,0 +1 @@
+export {};

package/dist/cjs/types/components/Card/index.d.ts

@@ -0,0 +1 @@
+export { default } from "./Card";

package/dist/cjs/types/components/FormElements/CheckBox/CheckBox.d.ts

@@ -1,4 +1,4 @@
 import React from "react";
-import { CheckboxProps } from "../../../shared/models/components/base.model";
-declare const Checkbox: React.FC<CheckboxProps>;
+import { ICheckboxProps } from "../../../shared/models/components/base.model";
+declare const Checkbox: React.FC<ICheckboxProps>;
 export default Checkbox;

package/dist/cjs/types/components/FormElements/Input/Input.d.ts

@@ -1,7 +1,7 @@
 import { FC } from "react";
-import { HookFormsInputProps } from "../../../shared/models/components/base.model";
+import { IHookFormsInputProps } from "../../../shared/models/components/base.model";
 /**
  * Primary UI component for user interaction
  */
-declare const Input: FC<HookFormsInputProps>;
+declare const Input: FC<IHookFormsInputProps>;
 export default Input;

package/dist/cjs/types/components/FormElements/InputValidation/InputValidation.d.ts

@@ -1,16 +1,7 @@
 import React from "react";
-interface InputValidationProps {
-    /**
-     * Set validation message
-     */
-    message?: string | undefined;
-    /**
-     * Optional for additional classes
-     */
-    additionalClasses?: string | undefined;
-}
+import { IInputValidationProps } from "../../../shared/models/components/common.model";
 /**
  * Primary UI component for user interaction
  */
-declare const InputValidation: React.FC<InputValidationProps>;
+declare const InputValidation: React.FC<IInputValidationProps>;
 export default InputValidation;

package/dist/cjs/types/components/FormElements/Label/Label.d.ts

@@ -1,7 +1,7 @@
 import React from "react";
-import { LabelProps } from "../../../shared/models/components/base.model";
+import { ILabelProps } from "../../../shared/models/components/base.model";
 /**
  * Primary UI component for user interaction
  */
-declare const Label: React.FC<LabelProps>;
+declare const Label: React.FC<ILabelProps>;
 export default Label;

package/dist/cjs/types/components/FormElements/RadioButton/RadioButton.d.ts

@@ -1,7 +1,7 @@
 import React from "react";
-import { RadioProps } from "../../../shared/models/components/base.model";
+import { IRadioProps } from "../../../shared/models/components/base.model";
 /**
  * Primary UI component for user interaction
  */
-declare const RadioButton: React.FC<RadioProps>;
+declare const RadioButton: React.FC<IRadioProps>;
 export default RadioButton;

package/dist/cjs/types/components/FormElements/Select/Select.d.ts

@@ -1,7 +1,7 @@
 import React from "react";
-import { SelectProps } from "../../../shared/models/components/base.model";
+import { ISelectProps } from "../../../shared/models/components/base.model";
 /**
  * Primary UI component for user interaction
  */
-declare const Select: React.FC<SelectProps>;
+declare const Select: React.FC<ISelectProps>;
 export default Select;

package/dist/cjs/types/components/FormElements/Select/Select.handler.d.ts

@@ -0,0 +1,3 @@
+import { SelectClasses } from "../../../shared/configs/customClasses";
+import { selectType } from "../../../shared/models/components/base.model";
+export declare const handleSelectClasses: (selType?: selectType) => SelectClasses.default | SelectClasses.small;

package/dist/cjs/types/components/FormElements/Textarea/Textarea.d.ts

@@ -1,49 +1,7 @@
-import React, { TextareaHTMLAttributes } from "react";
-type InputType = "text" | "email" | "password" | "name";
-interface InputProps extends TextareaHTMLAttributes<HTMLTextAreaElement> {
-    /**
-     * Set Input type
-     */
-    type?: InputType;
-    /**
-     * Set Input name
-     */
-    name: string;
-    /**
-     * Set the Label Type
-     */
-    labelType?: "default" | "black" | "smallSelect";
-    /**
-     * Set Input label name
-     */
-    label?: string | undefined;
-    /**
-     * Ser Error message
-     */
-    error?: string;
-    /**
-     * Set Wrapper classes, new classes will overide the existing default classes
-     */
-    wrapperClass?: string | undefined;
-    /**
-     * Optional for additional classes
-     */
-    additionalClasses?: string | undefined;
-    /**
-     * Enable read only
-     */
-    readonly?: boolean;
-    /**
-     * LabelClasses
-     */
-    labelClasses?: string;
-    /**
-     * Set label only
-     */
-    onlyLabel?: boolean;
-}
+import React from "react";
+import { IInputProps } from "../../../shared/models/components/base.model";
 /**
  * Primary UI component for user interaction
  */
-declare const Textarea: React.FC<InputProps>;
+declare const Textarea: React.FC<IInputProps>;
 export default Textarea;

package/dist/cjs/types/components/Media/Icon/Icon.d.ts

@@ -1,5 +1,5 @@
 import React from "react";
-import { IconProps } from "../../../shared/models/components/base.model";
+import { IIconProps } from "../../../shared/models/components/base.model";
 /**
  * Primary UI component for user interaction
  *
@@ -7,5 +7,5 @@ import { IconProps } from "../../../shared/models/components/base.model";
  *
  * File Path : "src/components/core/Media/Icons/Icons.tsx"
  */
-declare const Icon: React.FC<IconProps>;
+declare const Icon: React.FC<IIconProps>;
 export default Icon;

package/dist/cjs/types/components/Typho/Typho.d.ts

@@ -0,0 +1,37 @@
+import React from "react";
+type TyphoTypes = "p" | "span" | "strong" | "em" | "div" | undefined;
+type TyphoColorTypes = "white" | "gray" | "gray720" | "black" | "black650" | "blue" | "inherit" | string;
+type TyphoFontSizeTypes = "h1" | "14s" | "8s" | "9s" | "10s" | "11s" | "12s" | "16s" | "17s" | "18s" | "20s" | "24s" | "26s" | "32s" | "42s" | "48s" | "54s" | "80s" | undefined;
+type TyhoFontWeightTypes = "thin" | "extralight" | "light" | "normal" | "medium" | "semibold" | "bold" | "extrabold" | "black";
+interface ITyphoProps {
+    title?: string;
+    /**
+     * Set element node of the content wrapper
+     */
+    type?: TyphoTypes;
+    /**
+     * Set font-color of the content
+     */
+    color?: TyphoColorTypes;
+    /**
+     * Set font-size of the content
+     */
+    size?: TyphoFontSizeTypes;
+    /**
+     * Set font-weight of the content
+     */
+    weight?: TyhoFontWeightTypes;
+    /**
+     * Optional for additional classes
+     */
+    additionalClasses?: string | undefined;
+    /**
+     * Set content and child nodes
+     */
+    children?: React.ReactNode;
+}
+/**
+ * Primary UI component for user interaction
+ */
+declare const Typho: React.FC<ITyphoProps>;
+export default Typho;

package/dist/cjs/types/components/Typhography/Typhography.d.ts

@@ -1,7 +1,7 @@
 import React from "react";
-import { TyphographyProps } from "../../shared/models/components/base.model";
+import { ITyphographyProps } from "../../shared/models/components/base.model";
 /**
  * Primary UI component
  */
-declare const Typhography: ({ type, component, color, additionalClasses, children, onClick, ...rest }: TyphographyProps) => React.JSX.Element;
+declare const Typhography: ({ type, component, color, additionalClasses, children, onClick, ...rest }: ITyphographyProps) => React.JSX.Element;
 export default Typhography;

package/dist/cjs/types/components/index.d.ts

@@ -1,4 +1,5 @@
 import "../index.css";
 export { default as Button } from "./Button";
 export { default as Typhography } from "./Typhography";
-export { Input, Select, CheckBox, Label, InputValidation, Textarea, } from "./FormElements";
+export { Input, Select, CheckBox, Label, InputValidation, Textarea, RadioButton, } from "./FormElements";
+export { default as Card } from "./Card";

package/dist/cjs/types/constants/index.d.ts

@@ -0,0 +1,3 @@
+export declare const DEFAULT_OPTIONS: {
+    displayName: string;
+}[];

package/dist/cjs/types/shared/configs/customClasses.d.ts

@@ -0,0 +1,83 @@
+export declare const Classes: {
+    wrapper: {
+        default: string;
+    };
+    heading: {
+        white: string;
+        gray: string;
+        dark: string;
+        h1: string;
+        h2: string;
+        h3: string;
+        h4: string;
+        h5: string;
+        h6: string;
+    };
+    message: {
+        common: string;
+        error: string;
+        success: string;
+        warning: string;
+        neutral: string;
+        highlight: string;
+    };
+    card: {
+        common: string;
+        lightGray: string;
+        lightGrayHalf: string;
+        gray: string;
+        white: string;
+        black: string;
+        whiteBorder: string;
+    };
+    button: {
+        default: string;
+        common: string;
+        disabled: string;
+        blackLarge: string;
+        blackMedium: string;
+        blackMediumH36: string;
+        blackSmall: string;
+        blackExtraSmall: string;
+        sentButton: string;
+        smallButtonGray: string;
+    };
+    inputValidation: {
+        error: string;
+    };
+    image: {
+        default: string;
+    };
+    icon: {
+        white: string;
+        black: string;
+    };
+};
+export declare enum LableClasses {
+    default = "text-black-600 text-14s font-normal",
+    black = "text-black-900 text-14s font-normal",
+    blackSmall = "text-black-960 text-12s font-normal",
+    smallSelect = "text-14s font-normal text-black-900"
+}
+export declare enum SelectClasses {
+    default = "form-select h-40 border border-solid border-gray-180 rounded-lg text-black appearence-none placeholderColor-gray shadow-input",
+    small = "form-select h-8 border border-gray-160 border-solid text-13s text-black-760 rounded-[3px] appearence-none placeholderColor-gray shadow-none",
+    wrapper = "flex w-full flex-col relative",
+    error = "absolute top-[100%]"
+}
+export declare enum InputClasses {
+    default = "form-input h-[42px] border border-solid border-grey-100 rounded-lg text-black placeholderColor-gray  text-14s text-grey-900 px-4",
+    readonly = "form-input text-black opacity-60 !outline-0 !border-none",
+    wrapper = "flex w-full flex-col relative mb-4",
+    error = "relative pt-1",
+    large = "form-input w-full h-14 border border-solid border-black-925 rounded-lg text-black placeholderColor-gray350 text-base shadow-none font-normal"
+}
+export declare enum TypoClasess {
+    white = "text-white",
+    black = "text-black-900",
+    blue = "text-blue",
+    gray = "text-gray-220",
+    gray720 = "text-gray-720",
+    black650 = "text-black-650",
+    inherit = "text-inherit"
+}

package/dist/cjs/types/shared/models/components/base.model.d.ts

@@ -1,6 +1,6 @@
-import { InputHTMLAttributes, SelectHTMLAttributes } from "react";
-import { AdditionalClassesProp, ChildrenProp, IconTypeProp, AlignmentType, OnClickEventProps, TyphoTypes, TyphoComponents, IconHoverColorTypes } from "./common.model";
-export interface ButtonProps extends ChildrenProp, AdditionalClassesProp, IconTypeProp, OnClickEventProps {
+import { InputHTMLAttributes, SelectHTMLAttributes, TextareaHTMLAttributes } from "react";
+import { IAdditionalClassesProp, IChildrenProp, IIconTypeProp, AlignmentType, IOnClickEventProps, TyphoTypes, TyphoComponents, IconHoverColorTypes, MessageTypes } from "./common.model";
+export interface IButtonProps extends IChildrenProp, IAdditionalClassesProp, IIconTypeProp, IOnClickEventProps {
     /**
      * Set the button type
      */
@@ -30,7 +30,7 @@ export interface ButtonProps extends ChildrenProp, AdditionalClassesProp, IconTy
      */
     iconClass?: string;
 }
-export interface TyphographyProps extends ChildrenProp, AdditionalClassesProp {
+export interface ITyphographyProps extends IChildrenProp, IAdditionalClassesProp {
     /**
      * Set element type
      */
@@ -45,7 +45,7 @@ export interface TyphographyProps extends ChildrenProp, AdditionalClassesProp {
     color?: string;
     onClick?: () => void;
 }
-export interface IconProps extends AdditionalClassesProp, IconTypeProp {
+export interface IIconProps extends IAdditionalClassesProp, IIconTypeProp {
     /**
      * Optional | Set Icon Text
      */
@@ -65,7 +65,7 @@ export interface IconProps extends AdditionalClassesProp, IconTypeProp {
     onClick?: any;
 }
 type InputType = "text" | "email" | "password" | "name" | "date";
-export interface HookFormsInputProps extends InputHTMLAttributes<HTMLInputElement> {
+export interface IHookFormsInputProps extends InputHTMLAttributes<HTMLInputElement> {
     /**
      * Set Input type
      */
@@ -131,14 +131,14 @@ export interface HookFormsInputProps extends InputHTMLAttributes<HTMLInputElemen
     isAdditionalErrorInput?: boolean;
     fullError?: boolean;
 }
-export interface CheckboxProps {
+export interface ICheckboxProps {
     onChange?: (checked: boolean) => void;
     checked?: boolean;
     id?: any;
     label?: string;
 }
 export type LABELTYPE = "default" | "black" | "smallSelect" | "blackSmall" | undefined;
-export interface LabelProps {
+export interface ILabelProps {
     /**
      * Set the Label Type
      */
@@ -164,7 +164,7 @@ export interface LabelProps {
      */
     labelSpanClasses?: string;
 }
-export interface RadioProps extends InputHTMLAttributes<HTMLInputElement> {
+export interface IRadioProps extends InputHTMLAttributes<HTMLInputElement> {
     /**
      * Set Input name
      */
@@ -181,15 +181,19 @@ export interface RadioProps extends InputHTMLAttributes<HTMLInputElement> {
     onChange?: (e: React.ChangeEvent<HTMLInputElement>) => void;
     isDeafult?: boolean;
 }
-export interface SelectProps extends SelectHTMLAttributes<HTMLSelectElement> {
+interface IOption {
+    displayName: string;
+}
+export type selectType = "small" | "medium";
+export interface ISelectProps extends SelectHTMLAttributes<HTMLSelectElement> {
     /**
      * Type
      */
-    selectType?: "small" | "medium";
+    selectType?: selectType;
     /**
      * Set Input type
      */
-    options?: (string | number)[];
+    options?: IOption[];
     /**
      * Set Input name
      */
@@ -225,4 +229,74 @@ export interface SelectProps extends SelectHTMLAttributes<HTMLSelectElement> {
     updateInputValue?: (e: React.ChangeEvent<HTMLSelectElement>) => void;
     defaultValue?: string;
 }
+export interface IMessageProps extends IChildrenProp, IAdditionalClassesProp, IOnClickEventProps {
+    /**
+     * Message title
+     */
+    title?: string;
+    /**
+     * Select message type
+     */
+    type?: MessageTypes;
+    /**
+     * Button Label
+     */
+    buttonLabel?: string;
+}
+export interface IInputProps extends TextareaHTMLAttributes<HTMLTextAreaElement> {
+    /**
+     * Set Input type
+     */
+    type?: InputType;
+    /**
+     * Set Input name
+     */
+    name: string;
+    /**
+     * Set the Label Type
+     */
+    labelType?: "default" | "black" | "smallSelect";
+    /**
+     * Set Input label name
+     */
+    label?: string | undefined;
+    /**
+     * Ser Error message
+     */
+    error?: string;
+    /**
+     * Set Wrapper classes, new classes will overide the existing default classes
+     */
+    wrapperClass?: string | undefined;
+    /**
+     * Optional for additional classes
+     */
+    additionalClasses?: string | undefined;
+    /**
+     * Enable read only
+     */
+    readonly?: boolean;
+    /**
+     * LabelClasses
+     */
+    labelClasses?: string;
+    /**
+     * Set label only
+     */
+    onlyLabel?: boolean;
+}
+export interface ICardProps {
+    /**
+     * Set button type
+     */
+    cardType?: "lightGray" | "lightGrayHalf" | "gray" | "white" | "black" | "whiteBorder";
+    /**
+     * Optional for additional classes
+     */
+    additionalClasses?: string | undefined;
+    /**
+     * Nested child elements and contents
+     */
+    children?: React.ReactNode;
+}
 export {};

package/dist/cjs/types/shared/models/components/common.model.d.ts

@@ -3,13 +3,13 @@ export type AlignmentType = "center" | "left" | "right";
 export type IconColorTypes = "white" | "black-900" | "gray-220" | "gray-720" | "inherit" | "gray-300" | string;
 export type IconHoverColorTypes = "white" | "black-900" | "gray-220" | "inherit";
 export type IconType = "Home" | "Info" | "Email" | "RightArrow" | "DropDown" | "DropDownArrow" | "WhiteArrow" | "TrashIcon" | "AddNewitemIcon" | "OkIcon" | "EditIcon" | "Delete" | "AddIcon" | "RemoveTrashIcon" | "RoundTickIcon" | "ValidationWarningIcon" | "WarningIcon" | "NeturalIcon" | "SuccessIcon" | string;
-export interface ChildrenProp {
+export interface IChildrenProp {
     /**
      * Se the child node and element;
      */
     children?: React.ReactNode;
 }
-export interface IconTypeProp {
+export interface IIconTypeProp {
     /**
      * Set icon type
      */
@@ -19,21 +19,31 @@ export interface IconTypeProp {
      */
     iconColor?: IconColorTypes;
 }
-export interface AdditionalClassesProp {
+export interface IAdditionalClassesProp {
     /**
      * Optional | Set the additional classes
      */
     additionalClasses?: string | undefined;
 }
-export interface DataTestIdProp {
+export interface IDataTestIdProp {
     /**
      * Set the id for unti testing
      */
     data_testid?: string;
 }
-export interface OnClickEventProps {
+export interface IOnClickEventProps {
     onClick?: () => void;
 }
-export type TyphoTypes = "h1" | "h1Bold" | "h1ExtraBold" | "h2" | "h2Bold" | "h2ExtraBold" | "h10" | "h10Bold" | "h10ExtraBold" | "h6" | "h6Bold" | "h6ExtraBold" | "header1" | "header2" | "label1" | "label2";
+export type TyphoTypes = "h1" | "h1Bold" | "h1ExtraBold" | "h2" | "h2Bold" | "h2ExtraBold" | "h10" | "h10Bold" | "h10ExtraBold" | "h6" | "h6Bold" | "h6ExtraBold" | "header1" | "header2" | "label1" | "label2" | "p";
 export type TyphoComponents = "p" | "span" | "em" | "div" | undefined;
 export type MessageTypes = "warning" | "success" | "error" | "disabled" | "highlight" | "nutral";
+export interface IInputValidationProps {
+    /**
+     * Set validation message
+     */
+    message?: string | undefined;
+    /**
+     * Optional for additional classes
+     */
+    additionalClasses?: string | undefined;
+}