@kwantis-id3/frontend-library 1.0.0-rc.4 → 1.0.0-rc.40

package/dist/esm/types/components/Accordion/Accordion.d.ts

@@ -1,37 +1,3 @@
-/** @jsxImportSource @emotion/react */
-import { Interpolation } from "@emotion/styled";
-import React from "react";
-import { Theme } from "@emotion/react";
-export type AccordionProps = {
-    /** Text of the accordion trigger */
-    title: string;
-    /** Content of the accordion */
-    children: React.ReactNode;
-    /** Custom trigger component */
-    customTrigger?: React.ReactNode;
-    /** Works only if uncontrolled (isOpen props is not present) */
-    defaultOpen?: boolean;
-    /** Color of the accordion */
-    color?: string;
-    /** Color of the icon */
-    iconColor?: string;
-    /** Color of the divider */
-    dividerColor?: string;
-    /** Hide the icon */
-    hideIcon?: boolean;
-    /** Hide the divider */
-    hideDivider?: boolean;
-    /** Pass your state value here if the Accordion needs to be Controlled */
-    isOpen?: boolean;
-    /** Lazy render the content of the accordion */
-    isLazy?: boolean;
-    /** onClick handler */
-    onClick?: () => void;
-    /** onOpen handler */
-    onOpen?: () => void;
-    /** onClose handler */
-    onClose?: () => void;
-    /** Custom styles */
-    sx?: Interpolation<Theme>;
-};
-export declare const Accordion: (props: AccordionProps) => import("@emotion/react/jsx-runtime").JSX.Element;
+import { FC } from "react";
+import { TAccordionProps } from "./AccordionInterfaces";
+export declare const Accordion: FC<TAccordionProps>;

package/dist/esm/types/components/Accordion/AccordionInterfaces.d.ts

@@ -0,0 +1,21 @@
+import { PropsWithChildren } from "react";
+export type TAccordionProps = PropsWithChildren & {
+    /** Title to be used if no custom trigger is passed */
+    title: string;
+    /** Pass your state value here if the Accordion needs to be Controlled */
+    isOpen?: boolean;
+    /** Default open state if the accordion is Uncontrolled */
+    defaultOpen?: boolean;
+    /** Callback function to be called when the Accordion is clicked */
+    onClick?: () => void;
+    /** Callback function to be called when the Accordion opens */
+    onOpen?: () => void;
+    /** Callback function to be called when the Accordion closes */
+    onClose?: () => void;
+    /** Custom trigger element */
+    trigger?: (isOpen: boolean) => React.ReactNode;
+    /** Variant of the Accordion. Default has everything wrapped in borders, while light just renders the content and the title without setting colors
+     * @default "default"
+     */
+    variant?: "default" | "light";
+};

package/dist/esm/types/components/Accordion/AccordionStyled.d.ts

@@ -1,23 +1,34 @@
-export declare const Divider: import("@emotion/styled").StyledComponent<{
+export declare const AccordionGroup: import("@emotion/styled").StyledComponent<{
     theme?: import("@emotion/react").Theme;
     as?: React.ElementType;
 } & {
-    $color: string;
+    $variant: "default" | "light";
 }, import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, {}>;
-export declare const TitleDiv: import("@emotion/styled").StyledComponent<{
+export declare const StyledAccordion: import("@emotion/styled").StyledComponent<{
     theme?: import("@emotion/react").Theme;
     as?: React.ElementType;
 } & {
-    $color: string;
-    $textColor: string;
+    $variant: "default" | "light";
+    $isOpen: boolean;
 }, import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, {}>;
-export declare const IconContainer: import("@emotion/styled").StyledComponent<{
+export declare const StyledAccordionHeader: import("@emotion/styled").StyledComponent<{
     theme?: import("@emotion/react").Theme;
     as?: React.ElementType;
 } & {
-    $iconColor: string;
+    $variant: "default" | "light";
+    $isOpen: boolean;
+}, import("react").DetailedHTMLProps<import("react").ButtonHTMLAttributes<HTMLButtonElement>, HTMLButtonElement>, {}>;
+export declare const StyledAccordionContent: import("@emotion/styled").StyledComponent<{
+    theme?: import("@emotion/react").Theme;
+    as?: React.ElementType;
+} & {
+    $isOpen: boolean;
+    $variant: "default" | "light";
+    $defaultHeight: string;
 }, import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, {}>;
-export declare const TitleH2: import("@emotion/styled").StyledComponent<{
+export declare const Icon: import("@emotion/styled").StyledComponent<{
     theme?: import("@emotion/react").Theme;
     as?: React.ElementType;
-}, import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLHeadingElement>, HTMLHeadingElement>, {}>;
+} & {
+    $isOpen: boolean;
+}, import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLSpanElement>, HTMLSpanElement>, {}>;

package/dist/esm/types/components/Accordion/index.d.ts

@@ -1 +1,4 @@
-export { Accordion, AccordionProps } from "./Accordion";
+import { AccordionGroup } from "./AccordionStyled";
+export * from "./Accordion";
+export * from "./AccordionInterfaces";
+export { AccordionGroup };

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

@@ -1,25 +1,3 @@
 /** @jsxImportSource @emotion/react */
-import * as React from "react";
-import { Interpolation } from "@emotion/styled";
-import { Theme } from "@emotion/react";
-export type ButtonVariants = "contained" | "outlined" | "text";
-export type ButtonProps = {
-    /** Color of the button */
-    color?: string;
-    /** Type of the button */
-    type?: "button" | "submit" | "reset";
-    /** Custom styles */
-    sx?: Interpolation<Theme>;
-    /** Variant of the button, either `contained`, `outlined` or `text` */
-    variant?: ButtonVariants;
-    /** onClick handler */
-    onClick?: () => void;
-    className?: string;
-    /** HTML id */
-    htmlId?: string;
-    /** Disabled state */
-    disabled?: boolean;
-    /** Elements to render as children */
-    children?: React.ReactNode;
-};
-export declare const Button: (props: ButtonProps) => import("@emotion/react/jsx-runtime").JSX.Element;
+import { TButtonProps } from "./ButtonInterfaces";
+export declare const Button: (props: TButtonProps) => import("@emotion/react/jsx-runtime").JSX.Element;

package/dist/esm/types/components/Button/ButtonInterfaces.d.ts

@@ -0,0 +1,24 @@
+import { Interpolation } from "@emotion/react";
+import { Theme } from "@emotion/react/dist/declarations/src";
+export type TButtonVariants = "contained" | "outlined" | "text";
+export type TButtonProps = {
+    /** Color of the button */
+    color?: string;
+    /** Type of the button */
+    type?: "button" | "submit" | "reset";
+    /** Custom styles */
+    sx?: Interpolation<Theme>;
+    /** Variant of the button, either `contained`, `outlined` or `text` */
+    variant?: TButtonVariants;
+    /** The button size; either "large" or "small" */
+    size?: "small" | "large";
+    /** onClick handler */
+    onClick?: () => void;
+    className?: string;
+    /** HTML id */
+    htmlId?: string;
+    /** Disabled state */
+    disabled?: boolean;
+    /** Elements to render as children */
+    children?: React.ReactNode;
+};

package/dist/esm/types/components/Button/ButtonStyled.d.ts

@@ -0,0 +1,41 @@
+export declare const StylishButton: import("@emotion/styled").StyledComponent<{
+    theme?: import("@emotion/react").Theme;
+    as?: React.ElementType;
+} & {
+    $size: "small" | "large";
+    $disabled?: boolean;
+}, import("react").DetailedHTMLProps<import("react").ButtonHTMLAttributes<HTMLButtonElement>, HTMLButtonElement>, {}>;
+export declare const ContainedButton: import("@emotion/styled").StyledComponent<{
+    theme?: import("@emotion/react").Theme;
+    as?: React.ElementType;
+} & {
+    $size: "small" | "large";
+    $disabled?: boolean;
+} & import("react").ClassAttributes<HTMLButtonElement> & import("react").ButtonHTMLAttributes<HTMLButtonElement> & {
+    theme?: import("@emotion/react").Theme;
+} & {
+    $color: string;
+    $textColor: string;
+}, {}, {}>;
+export declare const OutlinedButton: import("@emotion/styled").StyledComponent<{
+    theme?: import("@emotion/react").Theme;
+    as?: React.ElementType;
+} & {
+    $size: "small" | "large";
+    $disabled?: boolean;
+} & import("react").ClassAttributes<HTMLButtonElement> & import("react").ButtonHTMLAttributes<HTMLButtonElement> & {
+    theme?: import("@emotion/react").Theme;
+} & {
+    $color: string;
+}, {}, {}>;
+export declare const TextButton: import("@emotion/styled").StyledComponent<{
+    theme?: import("@emotion/react").Theme;
+    as?: React.ElementType;
+} & {
+    $size: "small" | "large";
+    $disabled?: boolean;
+} & import("react").ClassAttributes<HTMLButtonElement> & import("react").ButtonHTMLAttributes<HTMLButtonElement> & {
+    theme?: import("@emotion/react").Theme;
+} & {
+    $color: string;
+}, {}, {}>;

package/dist/esm/types/components/Button/index.d.ts

@@ -1 +1,2 @@
-export { Button, ButtonProps } from "./Button";
+export * from "./Button";
+export * from "./ButtonInterfaces";

package/dist/esm/types/components/Card/CardInterfaces.d.ts

@@ -1,5 +1,5 @@
 import { Interpolation, Theme } from "@emotion/react";
-import React, { PropsWithChildren } from "react";
+import { PropsWithChildren } from "react";
 export type TCardSectionProps = PropsWithChildren & {
     sx?: Interpolation<Theme>;
     onClick?: (e: React.MouseEvent<HTMLElement>) => void;

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

@@ -1,2 +1,2 @@
-export { Card, CardHeader, CardContent, CardFooter, CardIndicators, CardMediaSection, } from "./Card";
-export { TCardSectionProps } from "./CardInterfaces";
+export * from "./Card";
+export * from "./CardInterfaces";

package/dist/esm/types/components/Checkbox/Checkbox.d.ts

@@ -0,0 +1,3 @@
+/** @jsxImportSource @emotion/react */
+import { TCheckboxProps } from "./CheckboxInterfaces";
+export declare const Checkbox: ({ label, htmlId, checked, defaultChecked, onChange, indeterminate, disabled, className, sx, name, size, }: TCheckboxProps) => import("@emotion/react/jsx-runtime").JSX.Element;

package/dist/esm/types/components/Checkbox/CheckboxInterfaces.d.ts

@@ -0,0 +1,24 @@
+import { Interpolation } from "@emotion/react";
+import { Theme } from "@emotion/react/dist/declarations/src";
+export type TCheckboxProps = {
+    /** Lable of the checkbox */
+    label?: string;
+    /** HTML id */
+    htmlId?: string;
+    name?: string;
+    /** Controlled checked state */
+    checked?: boolean;
+    /** Uncontrolled default checked state */
+    defaultChecked?: boolean;
+    /** onChange handler */
+    onChange?: (checked: boolean) => void;
+    /** Mixed state in its children checkboxes */
+    indeterminate?: boolean;
+    /** Disabled state */
+    disabled?: boolean;
+    className?: string;
+    /** Custom styles */
+    sx?: Interpolation<Theme>;
+    /** Checkbox sizes */
+    size?: "small" | "medium" | "large";
+};

package/dist/esm/types/components/Checkbox/CheckboxStyled.d.ts

@@ -0,0 +1,32 @@
+export declare const StyledLabel: import("@emotion/styled").StyledComponent<{
+    theme?: import("@emotion/react").Theme;
+    as?: React.ElementType;
+} & {
+    $disabled?: boolean;
+}, import("react").DetailedHTMLProps<import("react").LabelHTMLAttributes<HTMLLabelElement>, HTMLLabelElement>, {}>;
+export declare const StyledCheckboxInput: import("@emotion/styled").StyledComponent<{
+    theme?: import("@emotion/react").Theme;
+    as?: React.ElementType;
+}, import("react").DetailedHTMLProps<import("react").InputHTMLAttributes<HTMLInputElement>, HTMLInputElement>, {}>;
+export declare const StyledCheckboxBox: import("@emotion/styled").StyledComponent<{
+    theme?: import("@emotion/react").Theme;
+    as?: React.ElementType;
+} & {
+    $checked: boolean;
+    $indeterminate: boolean;
+    $disabled?: boolean;
+    $backgroundColor?: string;
+    $checkmarkColor?: string;
+    $borderColor?: string;
+    $size?: "small" | "medium" | "large";
+}, import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLSpanElement>, HTMLSpanElement>, {}>;
+export declare const StyledIconWrapper: import("@emotion/styled").StyledComponent<{
+    theme?: import("@emotion/react").Theme;
+    as?: React.ElementType;
+}, import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLSpanElement>, HTMLSpanElement>, {}>;
+export declare const StyledLabelText: import("@emotion/styled").StyledComponent<{
+    theme?: import("@emotion/react").Theme;
+    as?: React.ElementType;
+} & {
+    $disabled?: boolean;
+}, import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLSpanElement>, HTMLSpanElement>, {}>;

package/dist/esm/types/components/Checkbox/index.d.ts

@@ -0,0 +1,2 @@
+export * from "./Checkbox";
+export * from "./CheckboxInterfaces";

package/dist/esm/types/components/DataGrid/DataGrid.d.ts

@@ -0,0 +1,3 @@
+import { TCellValues } from "../Table";
+import { TDataGridProps, TDataGridRow } from "./DataGridInterfaces";
+export declare const DataGrid: <Cell extends TCellValues, Row extends TDataGridRow<Cell>>(props: TDataGridProps<Cell, Row>) => import("@emotion/react/jsx-runtime").JSX.Element;

package/dist/esm/types/components/DataGrid/DataGridInterfaces.d.ts

@@ -0,0 +1,9 @@
+import { ColumnDef } from "@tanstack/react-table";
+import { TCellValues } from "../Table";
+export type TDataGridProps<Cell extends TCellValues, Row extends TDataGridRow<Cell>> = {
+    columns: ColumnDef<TDataGridRow<Cell>, Cell>[];
+    data: Row[] | undefined;
+};
+export type TDataGridRow<Cell extends TCellValues> = {
+    [key: string]: Cell;
+};

package/dist/esm/types/components/DataGrid/index.d.ts

@@ -0,0 +1,2 @@
+export * from "./DataGrid";
+export * from "./DataGridInterfaces";

package/dist/esm/types/components/Drawer/Drawer.d.ts

@@ -0,0 +1,3 @@
+/** @jsxImportSource @emotion/react */
+import { TDrawerProps } from "./DrawerInterfaces";
+export declare const Drawer: ({ anchor, isOpen: isOpenProp, openContent, closedContent, openTrigger, closedTrigger, minOpen, maxOpen, bgColor, triggerColor, triggerHoverColor, onOpen, onClose, zIndex, hideTrigger, keepMounted, sx, }: TDrawerProps) => import("@emotion/react/jsx-runtime").JSX.Element;

package/dist/esm/types/components/Drawer/DrawerInterfaces.d.ts

@@ -0,0 +1,35 @@
+import { Interpolation, Theme } from "@emotion/react";
+import { ReactNode } from "react";
+export type TDrawerProps = {
+    /** Position of the drawer */
+    anchor: "top" | "right" | "bottom" | "left";
+    /** Optional state value to control the component */
+    isOpen?: boolean;
+    /** Trigger showed when drawer is closed */
+    closedTrigger?: ReactNode;
+    /** Trigger showed when drawer is open */
+    openTrigger?: ReactNode;
+    /** Component to be rendered when Drawer is open */
+    openContent?: ReactNode;
+    /** Component to be rendered when Drawer is closed */
+    closedContent?: ReactNode;
+    /** Min open of the drawer as number of pixels. If not defined the minOpen will be the height of closedContent if present, otherwise 0px */
+    minOpen?: number;
+    /** Max open of the drawer as number of pixels. If not defined the maxOpen will be the height of openContent with limit at 90vh/vw */
+    maxOpen?: number;
+    /** Background color */
+    bgColor?: string;
+    /** Trigger Color */
+    triggerColor?: string;
+    /** Trigger hover color */
+    triggerHoverColor?: string;
+    /** Hide the default thumb trigger */
+    hideTrigger?: boolean;
+    /** Keep rendered when closed to preserve state */
+    keepMounted?: boolean;
+    /** Set a custom z-index */
+    zIndex?: number;
+    sx?: Interpolation<Theme>;
+    onOpen?: () => void;
+    onClose?: () => void;
+};

package/dist/esm/types/components/Drawer/DrawerStyled.d.ts

@@ -0,0 +1,28 @@
+export declare const DrawerBody: import("@emotion/styled").StyledComponent<{
+    theme?: import("@emotion/react").Theme;
+    as?: React.ElementType;
+} & {
+    $anchor: "top" | "right" | "bottom" | "left";
+    $isOpen: boolean;
+    $minOpen?: string;
+    $maxOpen?: string;
+    $bgColor?: string;
+    $zIndex?: number;
+}, import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, {}>;
+export declare const DrawerContent: import("@emotion/styled").StyledComponent<{
+    theme?: import("@emotion/react").Theme;
+    as?: React.ElementType;
+} & {
+    $anchor: "top" | "right" | "bottom" | "left";
+    $isOpen: boolean;
+}, import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, {}>;
+export declare const Trigger: import("@emotion/styled").StyledComponent<{
+    theme?: import("@emotion/react").Theme;
+    as?: React.ElementType;
+} & {
+    $anchor: "top" | "right" | "bottom" | "left";
+    $bgColor?: string;
+    $triggerColor?: string;
+    $triggerHoverColor?: string;
+    $hideTrigger: boolean;
+}, import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, {}>;

package/dist/esm/types/components/Drawer/index.d.ts

@@ -0,0 +1,2 @@
+export * from "./Drawer";
+export * from "./DrawerInterfaces";

package/dist/esm/types/components/Dropdown/Dropdown.d.ts

@@ -1,43 +1,2 @@
-/** @jsxImportSource @emotion/react */
-import React from "react";
-/**
- * @property {string} value - The value displayed in the dropdown item
- * @property {string} color - The color of the dropdown item
- * @property {string} textColor - The text color of the dropdown item
- * @property {DropdownItem[]} children - The children of the dropdown item
- * @property {() => void} onClick - The onClick handler of the dropdown item
- */
-export type DropdownItem = {
-    /** The value displayed in the item */
-    value: string;
-    /** The color of the item */
-    bgColor?: string;
-    /** The text color of the item */
-    textColor?: string;
-    /** The hover color of the item */
-    hoverColor?: string;
-    /** The children of the item */
-    children?: DropdownItem[];
-    /** Wether the item is hidden or not */
-    isHidden?: boolean;
-    /** Wether the dropdown should close when the item is clicked */
-    closeOnClick?: boolean;
-    /** The onClick handler of the item */
-    onClick?: () => void;
-};
-export type DropdownProps = {
-    /** The content of the dropdown */
-    content: DropdownItem[];
-    /** The trigger element of the dropdown. Clicking on this item will open the dropdown */
-    trigger: React.ReactNode;
-    /** The color of the dropdown */
-    bgColor?: string;
-    /** The hover color of the dropdown */
-    hoverColor?: string;
-    /** Controls wether the dropdown should extend towards the left or the right */
-    direction?: "left" | "right";
-    /** The mobile breakpoint, by default it's 768px */
-    mobileBreakpoint?: number;
-};
-export declare const DropdownDesktop: (props: DropdownProps) => import("@emotion/react/jsx-runtime").JSX.Element;
-export declare const Dropdown: (props: DropdownProps) => import("@emotion/react/jsx-runtime").JSX.Element;
+import { TDropdownProps } from "./DropdownInterfaces";
+export declare const Dropdown: (props: TDropdownProps) => import("@emotion/react/jsx-runtime").JSX.Element;

package/dist/esm/types/components/Dropdown/DropdownInterfaces.d.ts

@@ -0,0 +1,52 @@
+/**
+ * @property {string} value - The value displayed in the dropdown item
+ * @property {string} color - The color of the dropdown item
+ * @property {string} textColor - The text color of the dropdown item
+ * @property {DropdownItem[]} children - The children of the dropdown item
+ * @property {() => void} onClick - The onClick handler of the dropdown item
+ */
+export type TDropdownItem = {
+    /** The value displayed in the item */
+    value: string;
+    /** The color of the item */
+    bgColor?: string;
+    /** The text color of the item */
+    textColor?: string;
+    /** The hover color of the item */
+    hoverColor?: string;
+    /** The children of the item */
+    children?: TDropdownItem[];
+    /** Wether the item is hidden or not */
+    isHidden?: boolean;
+    /** Wether the dropdown should close when the item is clicked */
+    closeOnClick?: boolean;
+    /** The onClick handler of the item */
+    onClick?: () => void;
+};
+export type TDropdownProps = {
+    /** The content of the dropdown */
+    content: TDropdownItem[];
+    /** The trigger element of the dropdown. Clicking on this item will open the dropdown */
+    trigger: React.ReactNode;
+    /** The color of the dropdown */
+    bgColor?: string;
+    /** The hover color of the dropdown */
+    hoverColor?: string;
+    /** The border color */
+    borderColor?: string;
+    /** The border width */
+    borderWidth?: string;
+    /** Controls wether the dropdown should extend towards the left or the right */
+    direction?: "left" | "right";
+    /** Controls whether the dropdown body should have absolute or fixed position
+     * By default, it is set to absolute, which means the dropdown will be positioned relative to its parent element.
+     * Use fixed if you want the body to be above the entire page, regardless of the parent element.
+     */
+    menuPosition?: "absolute" | "fixed";
+    /** The mobile breakpoint, by default it's 768px */
+    mobileBreakpoint?: number;
+};
+export type TDropdownItemProps = TDropdownItem & {
+    direction?: string;
+    closeBody: () => void;
+};

package/dist/esm/types/components/Dropdown/DropdownStyled.d.ts

@@ -13,6 +13,7 @@ export declare const DropdownBody: import("@emotion/styled").StyledComponent<{
     $direction: string;
     $isOpen: boolean;
     $bgColor: string;
+    $position: "absolute" | "fixed";
 }, import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, {}>;
 export declare const DropdownItemInnerContainer: import("@emotion/styled").StyledComponent<{
     theme?: import("@emotion/react").Theme;

package/dist/esm/types/components/Dropdown/index.d.ts

@@ -1 +1,2 @@
-export { Dropdown, DropdownProps, DropdownItem } from "./Dropdown";
+export * from "./Dropdown";
+export * from "./DropdownInterfaces";

package/dist/esm/types/components/Indicator/IndicatorInterfaces.d.ts

@@ -8,4 +8,4 @@ export type TIndicatorInstanceProps = {
 export type TIndicatorProps = {
     variant: TIndicatorVariants;
 } & TIndicatorInstanceProps;
-export type TIndicatorVariants = "live" | "success" | "warning" | "error";
+export type TIndicatorVariants = "live" | "success" | "warning" | "error" | "neutral";

package/dist/esm/types/components/Indicator/NeutralIndicator.d.ts

@@ -0,0 +1,3 @@
+import { FC } from "react";
+import { TIndicatorInstanceProps } from "./IndicatorInterfaces";
+export declare const NeutralIndicator: FC<TIndicatorInstanceProps>;

package/dist/esm/types/components/Indicator/index.d.ts

@@ -1,2 +1,2 @@
-export { TIndicatorProps, TIndicatorVariants } from "./IndicatorInterfaces";
-export { Indicator } from "./Indicator";
+export * from "./IndicatorInterfaces";
+export * from "./Indicator";

package/dist/esm/types/components/InputField/InputField.d.ts

@@ -1,13 +1,5 @@
-import React from "react";
-interface TextFieldProps extends React.InputHTMLAttributes<HTMLInputElement> {
-    /** Classname given to the container div */
+export declare const InputField: import("react").ForwardRefExoticComponent<import("react").InputHTMLAttributes<HTMLInputElement> & {
     containerClassName?: string;
-    /** Disables the input */
-    isDisabled?: boolean;
-    /** The color of the input */
     color?: string;
-    /** Change the styles of the input field */
-    sx?: React.CSSProperties;
-}
-export declare const InputField: React.ForwardRefExoticComponent<TextFieldProps & React.RefAttributes<HTMLInputElement>>;
-export {};
+    sx?: import("@emotion/react").Interpolation<import("@emotion/react").Theme>;
+} & import("react").RefAttributes<HTMLInputElement>>;

package/dist/esm/types/components/InputField/InputFieldInterfaces.d.ts

@@ -0,0 +1,9 @@
+import { Interpolation, Theme } from "@emotion/react";
+export type TTextFieldProps = React.InputHTMLAttributes<HTMLInputElement> & {
+    /** Classname given to the container div */
+    containerClassName?: string;
+    /** The color of the input */
+    color?: string;
+    /** Change the styles of the input field */
+    sx?: Interpolation<Theme>;
+};

package/dist/esm/types/components/InputField/index.d.ts

@@ -1 +1,2 @@
-export { InputField } from "./InputField";
+export * from "./InputField";
+export * from "./InputFieldInterfaces";

package/dist/esm/types/components/Modal/Modal.d.ts

@@ -1,19 +1,3 @@
-import React from "react";
-interface ModalProps {
-    /** The content of the modal */
-    children: React.ReactNode;
-    /** Cointrols whether the modal should be open or not. */
-    isOpen: boolean;
-    /** The handler to be called when the modal is closed */
-    onClose: () => void;
-    /** The handler to be called when the modal is opened */
-    onOpen?: () => void;
-    /** custom width */
-    width?: string;
-    /** custom height */
-    height?: string;
-    /** custom css */
-    sx?: React.CSSProperties;
-}
-declare const Modal: React.FC<ModalProps>;
-export default Modal;
+import { FC } from "react";
+import { TModalProps } from "./ModalInterfaces";
+export declare const Modal: FC<TModalProps>;

package/dist/esm/types/components/Modal/ModalInterfaces.d.ts

@@ -0,0 +1,16 @@
+export type TModalProps = {
+    /** The content of the modal */
+    children: React.ReactNode;
+    /** Cointrols whether the modal should be open or not. */
+    isOpen: boolean;
+    /** The handler to be called when the modal is closed */
+    onClose: () => void;
+    /** The handler to be called when the modal is opened */
+    onOpen?: () => void;
+    /** custom width */
+    width?: string;
+    /** custom height */
+    height?: string;
+    /** custom css */
+    sx?: React.CSSProperties;
+};

package/dist/esm/types/components/Modal/index.d.ts

@@ -1,2 +1,2 @@
-import Modal from "./Modal";
-export { Modal };
+export * from "./Modal";
+export * from "./ModalInterfaces";

package/dist/esm/types/components/MultiViewList/MultiViewGrid.d.ts

@@ -0,0 +1,5 @@
+/** @jsxImportSource @emotion/react */
+import { TMultiViewGridProps } from "./MultiViewListInterfaces";
+import { TCellValues } from "../Table";
+import { TDataGridRow } from "../DataGrid";
+export declare const MultiViewGrid: <Cell extends TCellValues, Row extends TDataGridRow<Cell>>(props: TMultiViewGridProps<Cell, Row>) => import("@emotion/react/jsx-runtime").JSX.Element;

package/dist/esm/types/components/MultiViewList/MultiViewList.d.ts

@@ -1,3 +1,4 @@
+/** @jsxImportSource @emotion/react */
 import { TMultiViewListProps } from "./MultiViewListInterfaces";
 import { TCellValues, TTableRow } from "../Table";
 export declare const MultiViewList: <Cell extends TCellValues, Row extends TTableRow<Cell>>(props: TMultiViewListProps<Cell, Row>) => import("@emotion/react/jsx-runtime").JSX.Element;