@hellobetterdigitalnz/betterui 0.0.3-2 → 0.0.3-200

package/README.md

@@ -1,23 +1,23 @@
-# BetterUI
-
-A reusable Rect component library by [Hello Better](https://hellobetterdigital.com).
-
-We at Hello Better builds many web applications using React + Typescript and headless APIs. We make use of Figma design systems and have our own component library that we have shared here. 
-
-## Installation
-
-To install simply use
-
-```
-npm install @hellobetterdigitalnz/betteru
-```
-
-or if you are using yarn 
-
-```
-yarn add @hellobetterdigitalnz/betteru
-```
-
-## Using components
-
-Components are used from the libraries root entry. 
+# BetterUI
+
+A reusable Rect component library by [Hello Better](https://hellobetterdigital.com).
+
+We at Hello Better builds many web applications using React + Typescript and headless APIs. We make use of Figma design systems and have our own component library that we have shared here. 
+
+## Installation
+
+To install simply use
+
+```
+npm install @hellobetterdigitalnz/betteru
+```
+
+or if you are using yarn 
+
+```
+yarn add @hellobetterdigitalnz/betteru
+```
+
+## Using components
+
+Components are used from the libraries root entry. 

package/dist/Components/BetterUIProvider/BetterUIContext.d.ts

@@ -0,0 +1,9 @@
+import { ReactNode } from "react";
+interface BetterUIContextType {
+    modalStack: ReactNode[];
+    openModal: (modal: React.ReactNode) => void;
+    closeModal: () => void;
+    closeAllModals: () => void;
+}
+declare const BetterUIContext: import("react").Context<BetterUIContextType>;
+export default BetterUIContext;

package/dist/Components/BetterUIProvider/BetterUIProvider.d.ts

@@ -0,0 +1,6 @@
+import { FC, ReactNode } from "react";
+interface BetterUIProviderProps {
+    children: ReactNode;
+}
+declare const BetterUIProvider: FC<BetterUIProviderProps>;
+export default BetterUIProvider;

package/dist/Components/BetterUIProvider/index.d.ts

@@ -0,0 +1,2 @@
+export { default as BetterUIProvider } from './BetterUIProvider.tsx';
+export { default as BetterUIContext } from './BetterUIContext.tsx';

package/dist/Components/DataDisplay/Accordion/AccordionItemProps.d.ts

@@ -6,5 +6,8 @@ interface AccordionItemProps {
     onAfterOpened?: () => void;
     onAfterClosed?: () => void;
     onBeforeClosed?: () => boolean;
+    extraClass?: string;
+    accordionClass?: string;
+    icon?: ReactNode;
 }
 export default AccordionItemProps;

package/dist/Components/DataDisplay/Badge/Badge.d.ts

@@ -1,3 +1,3 @@
-import BadgeProps from "./BadgeProps.tsx";
+import BadgeProps from "./BadgeProps";
 declare const Badge: (props: BadgeProps) => import("react/jsx-runtime").JSX.Element;
 export default Badge;

package/dist/Components/DataDisplay/Badge/BadgeProps.d.ts

@@ -1,5 +1,6 @@
 interface BadgeProps {
-    status?: "pending" | "inProgress" | "complete";
+    status?: "pending" | "inProgress" | "complete" | 'draft' | "custom";
     label: string;
+    onClick?: () => void;
 }
 export default BadgeProps;

package/dist/Components/DataDisplay/Cards/BannerCard/BannerCard.d.ts

@@ -1,3 +1,4 @@
 import BannerCardInterface from "./BannerCardInterface.tsx";
+import './banner-card.scss';
 declare const BannerCard: (props: BannerCardInterface) => import("react/jsx-runtime").JSX.Element;
 export default BannerCard;

package/dist/Components/DataDisplay/Cards/PathwayCard/PathwayCard.d.ts

@@ -1,2 +1,4 @@
-import PathwayCardInterface from "./PathwayCardInterface.tsx";
-export declare const PathwayCard: (props: PathwayCardInterface) => import("react/jsx-runtime").JSX.Element;
+import PathwayCardProps from "./PathwayCardProps";
+import './pathway-card.scss';
+declare const PathwayCard: (props: PathwayCardProps) => import("react/jsx-runtime").JSX.Element;
+export default PathwayCard;

package/dist/Components/DataDisplay/Cards/PathwayCard/{PathwayCardInterface.d.ts → PathwayCardProps.d.ts}

@@ -1,5 +1,5 @@
 import React, { ReactNode } from "react";
-interface PathwayCardInterface {
+interface PathwayCardProps {
     title: string;
     btnTitle: string;
     description: string;
@@ -12,4 +12,4 @@ interface PathwayCardInterface {
     cardOnClick?: (e: React.MouseEvent<HTMLDivElement>) => void;
     btnOnClick?: () => void;
 }
-export default PathwayCardInterface;
+export default PathwayCardProps;

package/dist/Components/DataDisplay/Media/Media.d.ts

@@ -1,3 +1,3 @@
 import MediaProps from "./MediaProps.tsx";
-declare const Media: ({ type, videoSrc, imageSrc }: MediaProps) => import("react/jsx-runtime").JSX.Element;
+declare const Media: (props: MediaProps) => import("react/jsx-runtime").JSX.Element;
 export default Media;

package/dist/Components/DataDisplay/Modal/ModalActions.d.ts

@@ -1,2 +1,3 @@
-declare const ModalActions: () => void;
+import ModalActionsProps from "./ModalActionsProps.tsx";
+declare const ModalActions: (props: ModalActionsProps) => import("react/jsx-runtime").JSX.Element;
 export default ModalActions;

package/dist/Components/DataDisplay/Modal/ModalActionsLeft.d.ts

@@ -1,2 +1,3 @@
-declare const ModalActionsLeft: () => void;
+import ModalActionsLeftProps from "./ModalActionsLeftProps.tsx";
+declare const ModalActionsLeft: (props: ModalActionsLeftProps) => import("react/jsx-runtime").JSX.Element;
 export default ModalActionsLeft;

package/dist/Components/DataDisplay/Modal/ModalActionsLeftProps.d.ts

@@ -0,0 +1,6 @@
+import { ReactNode } from "react";
+interface ModalActionsLeftProps {
+    children?: ReactNode;
+    extraClass?: string;
+}
+export default ModalActionsLeftProps;

package/dist/Components/DataDisplay/Modal/ModalActionsProps.d.ts

@@ -0,0 +1,6 @@
+import { ReactNode } from "react";
+interface ModalActionsProps {
+    children?: ReactNode;
+    extraClass?: string;
+}
+export default ModalActionsProps;

package/dist/Components/DataDisplay/Modal/ModalActionsRight.d.ts

@@ -1,2 +1,3 @@
-declare const ModalActionsRight: () => void;
+import ModalActionsRightProps from "./ModalActionsRightProps.tsx";
+declare const ModalActionsRight: (props: ModalActionsRightProps) => import("react/jsx-runtime").JSX.Element;
 export default ModalActionsRight;

package/dist/Components/DataDisplay/Modal/ModalActionsRightProps.d.ts

@@ -0,0 +1,6 @@
+import { ReactNode } from "react";
+interface ModalActionsRightProps {
+    children?: ReactNode;
+    extraClass?: string;
+}
+export default ModalActionsRightProps;

package/dist/Components/DataDisplay/Modal/ModalBodyProps.d.ts

@@ -1,5 +1,6 @@
 import { ReactNode } from "react";
 interface ModalBodyProps {
     children?: ReactNode;
+    extraClass?: string;
 }
 export default ModalBodyProps;

package/dist/Components/DataDisplay/Modal/ModalCurtain.d.ts

@@ -1,2 +1,2 @@
-declare const ModalCurtain: () => void;
+declare const ModalCurtain: () => import("react/jsx-runtime").JSX.Element;
 export default ModalCurtain;

package/dist/Components/DataDisplay/Modal/ModalHeaderProps.d.ts

@@ -1,7 +1,9 @@
 interface ModalHeaderProps {
-    title: string;
+    title?: string;
     extraClass?: string;
     canClose?: boolean;
     canGoBack?: boolean;
+    closeOnclick?: (e: any) => void;
+    canGoBackOnclick?: () => void;
 }
 export default ModalHeaderProps;

package/dist/Components/DataDisplay/NotificationsPanel/NotificationProps.d.ts

@@ -4,7 +4,7 @@ interface NotificationProps {
     boldText?: string;
     regularText?: string;
     summaryText?: string;
-    notificatonItemOnClick?: () => void;
+    notificationItemOnClick?: () => void;
     closeOnClick?: () => void;
 }
 export default NotificationProps;

package/dist/Components/DataDisplay/Tab/Tab.d.ts

@@ -1,2 +1,3 @@
 import TabInterface from "./TabProps.tsx";
-export declare const Tab: ({ children, extraClass }: TabInterface) => import("react/jsx-runtime").JSX.Element;
+declare const Tab: ({ children, extraClass }: TabInterface) => import("react/jsx-runtime").JSX.Element;
+export default Tab;

package/dist/Components/DataDisplay/Tab/TabBody.d.ts

@@ -1,2 +1,3 @@
 import TabBodyProps from "./TabBodyProps.tsx";
-export declare const TabBody: ({ children, extraClass }: TabBodyProps) => import("react/jsx-runtime").JSX.Element;
+declare const TabBody: ({ children, extraClass }: TabBodyProps) => import("react/jsx-runtime").JSX.Element;
+export default TabBody;

package/dist/Components/DataDisplay/Tab/TabBodyContent.d.ts

@@ -1,2 +1,3 @@
 import TabBodyContentProps from "./TabBodyContentProps.tsx";
-export declare const TabBodyContent: ({ children, tabIndex, extraClass, }: TabBodyContentProps) => import("react/jsx-runtime").JSX.Element;
+declare const TabBodyContent: (props: TabBodyContentProps) => import("react/jsx-runtime").JSX.Element;
+export default TabBodyContent;

package/dist/Components/DataDisplay/Tab/TabNav.d.ts

@@ -1,2 +1,3 @@
 import TabNavProps from "./TabNavProps.tsx";
-export declare const TabNav: ({ children, extraClass }: TabNavProps) => import("react/jsx-runtime").JSX.Element;
+declare const TabNav: (props: TabNavProps) => import("react/jsx-runtime").JSX.Element;
+export default TabNav;

package/dist/Components/DataDisplay/Tab/TabNavItem.d.ts

@@ -1,2 +1,3 @@
 import TabNavItemProps from "./TabNavItemProps.tsx";
-export declare const TabNavItem: (props: TabNavItemProps) => import("react/jsx-runtime").JSX.Element;
+declare const TabNavItem: (props: TabNavItemProps) => import("react/jsx-runtime").JSX.Element;
+export default TabNavItem;

package/dist/Components/DataDisplay/Tab/TabNavItemProps.d.ts

@@ -1,5 +1,6 @@
 interface TabNavItemProps {
     title: string;
+    bilingualTitle?: string;
     tabIndex: any;
     onBeforeOpen?: Function;
     onAfterOpened?: Function;

package/dist/Components/DataDisplay/Table/TableFooter.d.ts

@@ -1,2 +1,3 @@
-declare const TableFooter: () => void;
+import TableFooterProps from "./TableFooterProps.tsx";
+declare const TableFooter: (props: TableFooterProps) => import("react/jsx-runtime").JSX.Element;
 export default TableFooter;

package/dist/Components/DataDisplay/Table/TableFooterProps.d.ts

@@ -0,0 +1,6 @@
+import { ReactNode } from "react";
+interface TableFooterProps {
+    children: ReactNode;
+    extraClass?: string;
+}
+export default TableFooterProps;

package/dist/Components/DataDisplay/Table/TableHeaderCellProps.d.ts

@@ -4,5 +4,6 @@ interface TableHeaderCellProps {
     extraClass?: string;
     rowspan?: number;
     colspan?: number;
+    onClick?: () => void;
 }
 export default TableHeaderCellProps;

package/dist/Components/DataDisplay/index.d.ts

@@ -10,3 +10,64 @@ export { default as Badge } from './Badge/Badge';
 export type { default as BadgeProps } from './Badge/BadgeProps';
 export { default as BannerCard } from './Cards/BannerCard/BannerCard';
 export type { default as BannerCardInterface } from './Cards/BannerCard/BannerCardInterface';
+export { default as PathwayCard } from './Cards/PathwayCard/PathwayCard';
+export type { default as PathwayCardProps } from './Cards/PathwayCard/PathwayCardProps';
+export { default as Media } from './Media/Media';
+export type { default as MediaProps } from './Media/MediaProps';
+export { default as Modal } from './Modal/Modal';
+export { default as ModalActions } from './Modal/ModalActions';
+export { default as ModalActionsLeft } from './Modal/ModalActionsLeft';
+export { default as ModalActionsRight } from './Modal/ModalActionsRight';
+export { default as ModalBody } from './Modal/ModalBody';
+export { default as ModalCurtain } from './Modal/ModalCurtain';
+export { default as ModalHeader } from './Modal/ModalHeader';
+export type { default as ModalProps } from './Modal/ModalProps';
+export type { default as ModalHeaderProps } from './Modal/ModalHeaderProps';
+export type { default as ModalBodyProps } from './Modal/ModalBodyProps';
+export type { default as ModalActionsProps } from './Modal/ModalActionsProps.tsx';
+export type { default as ModalActionsRightProps } from './Modal/ModalActionsRightProps.tsx';
+export type { default as ModalActionsLeftProps } from './Modal/ModalActionsLeftProps.tsx';
+export { default as NotificationsBell } from './NotificationsBell/NotificationsBell';
+export type { default as NotificationsBellProps } from './NotificationsBell/NotificationsBellProps';
+export { default as Notification } from './NotificationsPanel/Notification';
+export { default as NotificationsGroup } from './NotificationsPanel/NotificationsGroup';
+export { default as NotificationsGroups } from './NotificationsPanel/NotificationsGroups';
+export { default as NotificationsPanel } from './NotificationsPanel/NotificationsPanel';
+export { default as NotificationsHeader } from './NotificationsPanel/NotificationsHeader';
+export { default as NotificationsNone } from './NotificationsPanel/NotificationsNone';
+export type { default as NotificationProps } from './NotificationsPanel/NotificationProps';
+export type { default as NotificationsGroupProps } from './NotificationsPanel/NotificationsGroupProps';
+export type { default as NotificationsGroupsProps } from './NotificationsPanel/NotificationsGroupsProps';
+export type { default as NotificationsHeaderProps } from './NotificationsPanel/NotificationsHeaderProps';
+export type { default as NotificationsPanelProps } from './NotificationsPanel/NotificationsPanelProps';
+export { default as Tab } from './Tab/Tab';
+export { default as TabBody } from './Tab/TabBody';
+export { default as TabBodyContent } from './Tab/TabBodyContent';
+export { default as TabContext } from './Tab/TabContext';
+export { default as TabNav } from './Tab/TabNav';
+export { default as TabNavItem } from './Tab/TabNavItem';
+export type { default as TabBodyContentProps } from './Tab/TabBodyContentProps';
+export type { default as TabBodyProps } from './Tab/TabBodyProps';
+export type { default as TabContextProps } from './Tab/TabContextProps';
+export type { default as TabNavItemProps } from './Tab/TabNavItemProps';
+export type { default as TabNavProps } from './Tab/TabNavProps';
+export type { default as TabProps } from './Tab/TabProps';
+export { default as Table } from './Table/Table';
+export { default as TableBody } from './Table/TableBody';
+export { default as TableCell } from './Table/TableCell';
+export { default as TableCellAction } from './Table/TableCellAction';
+export { default as TableCellWithDesc } from './Table/TableCellWithDesc';
+export { default as TableCellWithImage } from './Table/TableCellWithImage';
+export { default as TableFooter } from './Table/TableFooter';
+export { default as TableHead } from './Table/TableHead';
+export { default as TableHeaderCell } from './Table/TableHeaderCell';
+export { default as TableRow } from './Table/TableRow';
+export type { default as TableBodyProps } from './Table/TableBodyProps';
+export type { default as TableCellActionProps } from './Table/TableCellActionProps';
+export type { default as TableCellProps } from './Table/TableCellProps';
+export type { default as TableCellWithDescProps } from './Table/TableCellWithDescProps';
+export type { default as TableCellWithImageProps } from './Table/TableCellWithImageProps';
+export type { default as TableHeaderCellProps } from './Table/TableHeaderCellProps';
+export type { default as TableHeadProps } from './Table/TableHeadProps';
+export type { default as TableProps } from './Table/TableProps';
+export type { default as TableRowProps } from './Table/TableRowProps';

package/dist/Components/Form/Button/ButtonProps.d.ts

@@ -7,6 +7,8 @@ interface ButtonProps {
     disabled?: boolean;
     primaryIcon?: ReactNode;
     secondaryIcon?: ReactNode;
+    loading?: boolean;
+    bilingualTitle?: string;
     label: string;
     onClick?: () => void;
     onHover?: () => void;

package/dist/Components/Form/Checkbox/CheckboxProps.d.ts

@@ -1,5 +1,6 @@
-import { FocusEvent, MouseEvent } from "react";
+import { ChangeEvent, FocusEvent, MouseEvent } from "react";
 interface CheckboxProps {
+    label?: string;
     name?: string;
     id?: string;
     value?: string;
@@ -13,7 +14,8 @@ interface CheckboxProps {
     ariaLabel?: string;
     ariaLabeledby?: string;
     ariaDescribedby?: string;
-    onChange?: (e: MouseEvent, checked?: boolean) => void;
+    onClick?: (e: MouseEvent, checked?: boolean) => void;
+    onChange?: (e: ChangeEvent<HTMLInputElement>) => void;
     onFocus?: (e: FocusEvent) => void;
     onBlur?: (e: FocusEvent) => void;
 }

package/dist/Components/Form/CurrencyField/CurrencyFieldProps.d.ts

@@ -2,5 +2,6 @@ import { ReactNode } from "react";
 import InputProps from "../InputProps";
 interface CurrencyFieldProps extends InputProps {
     currencyIcon?: ReactNode;
+    value?: string | number | any;
 }
 export default CurrencyFieldProps;

package/dist/Components/Form/DropdownBadge/DropdownBadgeItemProps.d.ts

@@ -2,7 +2,7 @@ import { MouseEvent } from "react";
 interface DropdownBadgeItemProps {
     label: string;
     value: string | number;
-    status?: "pending" | "inProgress" | "complete";
+    status?: "draft" | "pending" | "inProgress" | "complete" | "custom";
     handleSelect: (e: MouseEvent, value: string | number) => void;
 }
 export default DropdownBadgeItemProps;

package/dist/Components/Form/DropdownBadge/DropdownBadgeProps.d.ts

@@ -1,16 +1,18 @@
 import { MouseEvent, FocusEvent } from "react";
-interface NameValueInterface {
+interface BadgeNameValueInterface {
     label: string;
-    status?: "pending" | "inProgress" | "complete" | undefined;
+    status?: "draft" | "pending" | "inProgress" | "complete" | "custom" | undefined;
     value: string | number;
 }
 interface DropdownBadgeProps {
     name?: string;
     id?: string;
     value?: string;
-    options: (NameValueInterface | string)[];
-    status?: "pending" | "inProgress" | "complete" | undefined;
+    options: (BadgeNameValueInterface | string)[];
+    status?: "draft" | "pending" | "inProgress" | "complete" | "custom" | undefined;
+    lock?: boolean;
     extraClass?: string;
+    extraClassDropdown?: string;
     disabled?: boolean;
     readonly?: boolean;
     autoComplete?: boolean;
@@ -19,9 +21,9 @@ interface DropdownBadgeProps {
     ariaLabeledby?: string;
     ariaDescribedby?: string;
     onClick?: (e: MouseEvent) => void;
-    onChange?: (e: MouseEvent) => void;
+    onChange?: (e: React.MouseEvent, value: string | number) => void;
     onFocus?: (e: FocusEvent) => void;
     onBlur?: (e: FocusEvent) => void;
 }
-export type { NameValueInterface };
+export type { BadgeNameValueInterface };
 export default DropdownBadgeProps;

package/dist/Components/Form/DropdownBadge/DropdownBadgeSelectorProps.d.ts

@@ -1,5 +1,8 @@
 import { ReactNode } from "react";
 interface DropdownBadgeSelectorProps {
     children: ReactNode;
+    width?: string | any;
+    position?: string | any;
+    extraClassDropdown?: string;
 }
 export default DropdownBadgeSelectorProps;

package/dist/Components/Form/DropdownField/DropdownFieldItemProps.d.ts

@@ -1,7 +1,7 @@
 import { MouseEvent } from "react";
 interface DropdownFieldItemProps {
     label: string;
-    value: string | number;
-    handleSelect: (e: MouseEvent, value: string | number) => void;
+    value: string | number | undefined | null | boolean;
+    handleSelect: (e: MouseEvent, value: string | number | undefined | null | boolean) => void;
 }
 export default DropdownFieldItemProps;

package/dist/Components/Form/DropdownField/DropdownFieldProps.d.ts

@@ -1,7 +1,7 @@
 import { MouseEvent, FocusEvent } from "react";
 interface NameValueInterface {
     label: string;
-    value: string | number;
+    value: string | number | undefined | null | boolean;
 }
 interface DropdownFieldProps {
     name?: string;
@@ -10,6 +10,8 @@ interface DropdownFieldProps {
     options: NameValueInterface[] | string[];
     extraClass?: string;
     placeholder?: string;
+    emptyString?: string;
+    commentInDropdown?: string;
     error?: boolean;
     disabled?: boolean;
     readonly?: boolean;
@@ -21,7 +23,7 @@ interface DropdownFieldProps {
     ariaLabeledby?: string;
     ariaDescribedby?: string;
     onClick?: (e: MouseEvent) => void;
-    onChange?: (e: MouseEvent) => void;
+    onChange?: (e: React.MouseEvent, value: string | number | undefined | null | boolean) => void;
     onFocus?: (e: FocusEvent) => void;
     onBlur?: (e: FocusEvent) => void;
 }

package/dist/Components/Form/FormFieldHolder/FormFieldHolderProps.d.ts

@@ -1,10 +1,12 @@
 import { ReactNode } from "react";
 interface FormFieldHolderProps {
-    label?: string;
+    label?: string | any;
+    bilingualLabel?: string;
     description?: string | ReactNode;
     extraClass?: string;
     error?: boolean;
     children: ReactNode;
     icon?: ReactNode;
+    require?: boolean;
 }
 export default FormFieldHolderProps;

package/dist/Components/Form/IconButton/IconButtonProps.d.ts

@@ -6,6 +6,7 @@ interface IconButtonProps {
     scheme?: "primary" | "secondary" | "gray";
     disabled?: boolean;
     icon?: ReactNode;
+    loading?: boolean;
     onClick?: () => void;
     onHover?: () => void;
     onFocus?: () => void;

package/dist/Components/Form/InputProps.d.ts

@@ -2,7 +2,7 @@ import { FocusEvent, ChangeEvent, MouseEvent } from "react";
 interface InputProps {
     name?: string;
     id?: string;
-    value?: string;
+    value?: string | number | bigint | any;
     extraClass?: string;
     placeholder?: string;
     error?: boolean;
@@ -11,6 +11,8 @@ interface InputProps {
     autoComplete?: boolean;
     required?: boolean;
     ariaLabel?: string;
+    min?: string;
+    max?: string;
     minLength?: number;
     maxLength?: number;
     ariaLabeledby?: string;

package/dist/Components/Form/MultiSelectField/MultiSelectField.d.ts

@@ -1,2 +1,4 @@
-declare const MultiSelectField: () => void;
+import React from "react";
+import MultiSelectFieldProps from "./MultiSelectFieldProps";
+declare const MultiSelectField: React.FC<MultiSelectFieldProps>;
 export default MultiSelectField;

package/dist/Components/Form/MultiSelectField/MultiSelectFieldItem.d.ts

@@ -1,2 +1,3 @@
-declare const MultiSelectFieldItem: () => void;
+import MultiSelectFieldItemProps from "./MultiSelectFieldItemProps.tsx";
+declare const MultiSelectFieldItem: (props: MultiSelectFieldItemProps) => import("react/jsx-runtime").JSX.Element;
 export default MultiSelectFieldItem;

package/dist/Components/Form/MultiSelectField/MultiSelectFieldItemProps.d.ts

@@ -0,0 +1,11 @@
+/// <reference types="react" />
+interface MultiSelectFieldItemProps {
+    id?: number | string | undefined;
+    label?: string;
+    value?: string | number;
+    handleSelect: (e: React.MouseEvent, value: string | number | undefined) => void;
+    onMouseEnter?: () => void;
+    isSelected?: boolean;
+    isHighlighted?: boolean;
+}
+export default MultiSelectFieldItemProps;

package/dist/Components/Form/MultiSelectField/MultiSelectFieldProps.d.ts

@@ -0,0 +1,32 @@
+import { MouseEvent, FocusEvent } from "react";
+interface SelectOption {
+    label: string | any;
+    value: string | number | any;
+}
+interface MultiSelectFieldProps {
+    name?: string;
+    id?: string;
+    value?: SelectOption[];
+    options: SelectOption[];
+    extraClass?: string;
+    placeholder?: string;
+    error?: boolean;
+    disabled?: boolean;
+    readonly?: boolean;
+    autoComplete?: boolean;
+    minLength?: number;
+    maxLength?: number;
+    required?: boolean;
+    ariaLabel?: string;
+    ariaLabeledby?: string;
+    creatable?: boolean;
+    onCreateNew?: (option: string | number, e: any) => void;
+    ariaDescribedby?: string;
+    onClick?: (e: MouseEvent) => void;
+    onChange: (value: SelectOption[]) => void;
+    onFocus?: (e: FocusEvent) => void;
+    onBlur?: (e: FocusEvent) => void;
+    onSearch?: (keywords: any) => void;
+}
+export type { SelectOption };
+export default MultiSelectFieldProps;

package/dist/Components/Form/MultiSelectField/MultiSelectFieldTag.d.ts

@@ -1,2 +1,3 @@
-declare const MultiSelectFieldTag: () => void;
+import MultiSelectFieldTagProps from "./MultiSelectFieldTagProps.tsx";
+declare const MultiSelectFieldTag: (props: MultiSelectFieldTagProps) => import("react/jsx-runtime").JSX.Element;
 export default MultiSelectFieldTag;

package/dist/Components/Form/MultiSelectField/MultiSelectFieldTagProps.d.ts

@@ -0,0 +1,5 @@
+interface MultiSelectFieldTagProps {
+    label: string;
+    onRemove: (e: any) => void;
+}
+export default MultiSelectFieldTagProps;

package/dist/Components/Form/NumberField/NumberField.d.ts

@@ -0,0 +1,3 @@
+import NumberFieldProps from "./NumberFieldProps.tsx";
+declare const NumberField: (props: NumberFieldProps) => import("react/jsx-runtime").JSX.Element;
+export default NumberField;

package/dist/Components/Form/NumberField/NumberField.stories.d.ts

@@ -0,0 +1,13 @@
+import type { StoryObj } from "@storybook/react";
+import NumberField from "././NumberField.tsx";
+declare const meta: {
+    title: string;
+    component: (props: import("./NumberFieldProps.tsx").default) => import("react/jsx-runtime").JSX.Element;
+    parameters: {
+        layout: string;
+    };
+    tags: string[];
+};
+export default meta;
+type Story = StoryObj<typeof NumberField>;
+export declare const Example: Story;

package/dist/Components/Form/NumberField/NumberFieldProps.d.ts

@@ -0,0 +1,7 @@
+import InputProps from "../../Form/InputProps";
+interface NumberFieldProps extends InputProps {
+    numberValue?: number | string | any | undefined;
+    preventScrolling?: boolean;
+    formatter?: boolean;
+}
+export default NumberFieldProps;

package/dist/Components/Form/PhoneField/PhoneField.d.ts

@@ -0,0 +1,3 @@
+import inputProps from "../InputProps.tsx";
+declare const PhoneField: (props: inputProps) => import("react/jsx-runtime").JSX.Element;
+export default PhoneField;

package/dist/Components/Form/PhoneField/PhoneField.stories.d.ts

@@ -0,0 +1,13 @@
+import type { StoryObj } from "@storybook/react";
+import PhoneField from "./PhoneField.tsx";
+declare const meta: {
+    title: string;
+    component: (props: import("../InputProps.tsx").default) => import("react/jsx-runtime").JSX.Element;
+    parameters: {
+        layout: string;
+    };
+    tags: string[];
+};
+export default meta;
+type Story = StoryObj<typeof PhoneField>;
+export declare const Example: Story;