pixelize-design-library 1.0.12 → 1.0.13

package/dist/App.d.ts

@@ -0,0 +1,3 @@
+import React from 'react';
+declare function App(): React.JSX.Element;
+export default App;

package/dist/Components/Apexcharts/ApexBarChart/ApexBarChart.d.ts

@@ -0,0 +1,3 @@
+import React from "react";
+import { ApexBarChartProps } from "./ApexBarChartProps";
+export default function ApexBarChart({ data, Labels, title, titlePosition, height, width, barColor, xAxisStyle, yAxisStyle, titleStyle, }: ApexBarChartProps): React.JSX.Element;

package/dist/Components/Apexcharts/ApexBarChart/ApexBarChart.stories.d.ts

@@ -0,0 +1,4 @@
+import { ApexBarChartProps } from './ApexBarChartProps';
+declare const _default: import("@storybook/types").ComponentAnnotations<import("@storybook/react/dist/types-bf5e6555").R, import("@storybook/types").Args>;
+export default _default;
+export declare const Primary: import("@storybook/types").AnnotatedStoryFn<import("@storybook/react/dist/types-bf5e6555").R, ApexBarChartProps>;

package/dist/Components/Apexcharts/ApexBarChart/ApexBarChartProps.d.ts

@@ -0,0 +1,19 @@
+export type ApexBarChartProps = {
+    data: number[];
+    Labels: string[];
+    title?: string;
+    titlePosition?: 'left' | 'center' | 'right';
+    height?: number;
+    width?: number;
+    barColor?: string[];
+    xAxisStyle?: StyleProps;
+    yAxisStyle?: StyleProps;
+    titleStyle?: StyleProps;
+};
+type StyleProps = {
+    fontSize?: string;
+    fontFamily?: string;
+    fontWeight?: string | number;
+    color?: string;
+};
+export {};

package/dist/Components/Apexcharts/ApexPieChart/ApexPieChart.d.ts

@@ -0,0 +1,3 @@
+import React from 'react';
+import { ApexPieChartProps } from "./ApexPieChartProps";
+export default function ApexPieChart({ data, labels, title, titlePosition, height, width, chartColor, titleStyle, }: ApexPieChartProps): React.JSX.Element;

package/dist/Components/Apexcharts/ApexPieChart/ApexPieChart.stories.d.ts

@@ -0,0 +1,4 @@
+import { ApexPieChartProps } from './ApexPieChartProps';
+declare const _default: import("@storybook/types").ComponentAnnotations<import("@storybook/react/dist/types-bf5e6555").R, import("@storybook/types").Args>;
+export default _default;
+export declare const Primary: import("@storybook/types").AnnotatedStoryFn<import("@storybook/react/dist/types-bf5e6555").R, ApexPieChartProps>;

package/dist/Components/Apexcharts/ApexPieChart/ApexPieChartProps.d.ts

@@ -0,0 +1,17 @@
+export type ApexPieChartProps = {
+    data: number[];
+    labels: string[];
+    title?: string;
+    titlePosition?: 'left' | 'center' | 'right';
+    height?: number;
+    width?: number;
+    chartColor?: string[];
+    titleStyle?: StyleProps;
+};
+type StyleProps = {
+    fontSize?: string;
+    fontFamily?: string;
+    fontWeight?: string | number;
+    color?: string;
+};
+export {};

package/dist/Components/Breadcrumbs/Breadcrumbs.d.ts

@@ -0,0 +1,3 @@
+import React from 'react';
+import { BreadcrumbsProps } from "./BreadcrumbsProps";
+export default function Breadcrumbs({ spacing, separator, fontWeight, fontSize, isCurrentPage, handleClick, items }: BreadcrumbsProps): React.JSX.Element;

package/dist/Components/Breadcrumbs/Breadcrumbs.stories.d.ts

@@ -0,0 +1,4 @@
+import { BreadcrumbsProps } from './BreadcrumbsProps';
+declare const _default: import("@storybook/types").ComponentAnnotations<import("@storybook/react/dist/types-bf5e6555").R, import("@storybook/types").Args>;
+export default _default;
+export declare const Default: import("@storybook/types").AnnotatedStoryFn<import("@storybook/react/dist/types-bf5e6555").R, BreadcrumbsProps>;

package/dist/Components/Breadcrumbs/BreadcrumbsProps.d.ts

@@ -0,0 +1,11 @@
+import { BreadcrumbProps } from "@chakra-ui/react";
+export type BreadcrumbsProps = Pick<BreadcrumbProps, "spacing" | "separator" | "fontWeight" | "fontSize"> & {
+    isCurrentPage?: boolean;
+    isLastChild?: boolean;
+    handleClick: (path: string) => void;
+    items: BreadcrumbItem[];
+};
+export type BreadcrumbItem = {
+    path: string;
+    label: string;
+};

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

@@ -0,0 +1,3 @@
+import React from 'react';
+import { ButtonProps } from './ButtonProps';
+export default function Button({ label, width, onClick, color, variant, leftIcon, rightIcon, size, isDisabled, isLoading, loadingText, type }: ButtonProps): React.JSX.Element;

package/dist/Components/Button/Button.stories.d.ts

@@ -0,0 +1,6 @@
+import { Meta, StoryObj } from '@storybook/react';
+import Button from './Button';
+declare const meta: Meta<typeof Button>;
+export default meta;
+type Story = StoryObj<typeof meta>;
+export declare const Primary: Story;

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

@@ -0,0 +1,9 @@
+import { ButtonProps as ChakraButtonProps } from "@chakra-ui/react";
+export type ButtonProps = Pick<ChakraButtonProps, "onClick" | "leftIcon" | "rightIcon" | "isDisabled" | "isLoading" | "loadingText" | "colorScheme" | "spinner"> & {
+    label?: string;
+    width?: string | number;
+    size?: "lg" | "md" | "sm" | "xs";
+    variant?: "solid" | "outline" | "ghost" | "link" | "unstyled";
+    color?: "gray" | "red" | "orange" | "yellow" | "green" | "teal" | "blue" | "cyan" | "purple" | "pink" | "whiteAlpha" | "blackAlpha";
+    type?: "button" | "submit" | "reset";
+};

package/dist/Components/ButtonGroupIcon/ButtonGoupIconProps.d.ts

@@ -0,0 +1,13 @@
+import { ReactElement } from "react";
+export type ButtonGroupIconProps = {
+    leftIcon?: ReactElement;
+    rightIcon?: ReactElement;
+    onLeftIconClick?: () => void;
+    onRightIconClick?: () => void;
+    buttonText: string;
+    onButtonClick?: () => void;
+    onButtongroupClick?: () => void;
+    size?: "lg" | "md" | "sm" | "xs";
+    variant?: "solid" | "outline" | "ghost" | "link" | "unstyled";
+    color?: "gray" | "red" | "orange" | "yellow" | "green" | "teal" | "blue" | "cyan" | "purple" | "pink" | "whiteAlpha" | "blackAlpha";
+};

package/dist/Components/ButtonGroupIcon/ButtonGroupIcon.d.ts

@@ -0,0 +1,3 @@
+import React from 'react';
+import { ButtonGroupIconProps } from "./ButtonGoupIconProps";
+export default function ButtonGroupIcon({ leftIcon, rightIcon, onLeftIconClick, onRightIconClick, buttonText, onButtonClick, onButtongroupClick, size, variant, color }: ButtonGroupIconProps): React.JSX.Element;

package/dist/Components/ButtonGroupIcon/ButtonGroupIcon.stories.d.ts

@@ -0,0 +1,4 @@
+import { ButtonGroupIconProps } from './ButtonGoupIconProps';
+declare const _default: import("@storybook/types").ComponentAnnotations<import("@storybook/react/dist/types-bf5e6555").R, import("@storybook/types").Args>;
+export default _default;
+export declare const Default: import("@storybook/types").AnnotatedStoryFn<import("@storybook/react/dist/types-bf5e6555").R, ButtonGroupIconProps>;

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

@@ -0,0 +1,4 @@
+import { FC } from 'react';
+import { CheckboxProps } from './CheckboxProps';
+declare const CheckBox: FC<CheckboxProps>;
+export default CheckBox;

package/dist/Components/Checkbox/Checkbox.stories.d.ts

@@ -0,0 +1,6 @@
+import { Meta, StoryObj } from '@storybook/react';
+import CheckBox from './Checkbox';
+declare const meta: Meta<typeof CheckBox>;
+export default meta;
+type Story = StoryObj<typeof meta>;
+export declare const Check_box: Story;

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

@@ -0,0 +1,8 @@
+import { CheckboxProps as ChakraButtonProps } from "@chakra-ui/react";
+export type CheckboxProps = Pick<ChakraButtonProps, 'spacing' | 'isInvalid' | 'size' | 'iconColor' | 'iconSize' | 'isChecked' | 'isIndeterminate' | 'onChange' | 'isDisabled' | 'value' | 'defaultChecked'> & {
+    label?: string;
+    width?: string | number;
+    variant?: "solid" | "outline" | "ghost" | "link" | "unstyled";
+    color?: "gray" | "red" | "orange" | "yellow" | "green" | "teal" | "blue" | "cyan" | "purple" | "pink" | "whiteAlpha" | "blackAlpha";
+    size?: "sm" | "md" | "lg";
+};

package/dist/Components/Input/TextInput.d.ts

@@ -0,0 +1,3 @@
+import { TextInputProps } from "./TextInputProps";
+import React from "react";
+export default function TextInput({ label, type, id, name, onChange, onBlur, onFocus, isDisabled, isReadOnly, isRequired, value, placeholder, width, error, errorMessage, helperText, onRightIconclick, inputRightIcon, inputGroupStyle, inputStyle, }: TextInputProps): React.JSX.Element;

package/dist/Components/Input/TextInput.stories.d.ts

@@ -0,0 +1,6 @@
+import type { Meta, StoryObj } from '@storybook/react';
+import TextInput from './TextInput';
+declare const meta: Meta<typeof TextInput>;
+export default meta;
+type Story = StoryObj<typeof meta>;
+export declare const Primary: Story;

package/dist/Components/Input/TextInputProps.d.ts

@@ -0,0 +1,14 @@
+/// <reference types="react" />
+import { InputProps } from "@chakra-ui/react";
+export type TextInputProps = Pick<InputProps, "value" | "type" | "onChange" | "placeholder" | "onBlur" | "onFocus" | "isDisabled" | "isRequired" | "isReadOnly" | "width" | "errorBorderColor"> & {
+    label?: string;
+    id?: string;
+    name?: string;
+    error?: boolean;
+    errorMessage?: string;
+    helperText?: string;
+    onRightIconclick?: () => void;
+    inputRightIcon?: JSX.Element | string;
+    inputStyle?: {};
+    inputGroupStyle?: {};
+};

package/dist/Components/InputTextArea/InputTextArea.d.ts

@@ -0,0 +1,3 @@
+import React from 'react';
+import { InputTextAreaProps } from './InputTextAreaProps';
+export default function InputTextArea({ label, placeholder, value, onChange, size, resize, width, isDisabled, errorBorderColor, focusBorderColor, isReadOnly, isRequired, error, errorMessage, helperText, rows, height }: InputTextAreaProps): React.JSX.Element;

package/dist/Components/InputTextArea/InputTextArea.stories.d.ts

@@ -0,0 +1,6 @@
+import type { Meta, StoryObj } from "@storybook/react/*";
+import InputTextArea from "./InputTextArea";
+declare const meta: Meta<typeof InputTextArea>;
+export default meta;
+type Story = StoryObj<typeof meta>;
+export declare const Primary: Story;

package/dist/Components/InputTextArea/InputTextAreaProps.d.ts

@@ -0,0 +1,10 @@
+import { TextareaProps } from "@chakra-ui/react";
+export type InputTextAreaProps = Pick<TextareaProps, "placeholder" | "value" | "onChange" | "size" | "resize" | "isDisabled" | "errorBorderColor" | "focusBorderColor" | "isReadOnly" | "isRequired" | "variant"> & {
+    label?: string;
+    error?: boolean;
+    errorMessage?: string;
+    helperText?: string;
+    width?: string | number;
+    rows?: number;
+    height?: string | number;
+};

package/dist/Components/Loading/Loading.d.ts

@@ -0,0 +1,3 @@
+import React from 'react';
+import { LoadingProps } from "./LoadingProps";
+export default function Loading({ text, isLoading }: LoadingProps): React.JSX.Element | null;

package/dist/Components/Loading/Loading.stories.d.ts

@@ -0,0 +1,4 @@
+import { LoadingProps } from './LoadingProps';
+declare const _default: import("@storybook/types").ComponentAnnotations<import("@storybook/react/dist/types-bf5e6555").R, import("@storybook/types").Args>;
+export default _default;
+export declare const Interactive: import("@storybook/types").AnnotatedStoryFn<import("@storybook/react/dist/types-bf5e6555").R, LoadingProps>;

package/dist/Components/Loading/LoadingProps.d.ts

@@ -0,0 +1,4 @@
+export type LoadingProps = {
+    text?: string;
+    isLoading: boolean;
+};

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

@@ -0,0 +1,3 @@
+import React from 'react';
+import { ChakraModelProps } from "./ModalProps";
+export default function Modal({ size, isOpen, onClose, title, footer, overlaybg, overlaybackdropFilter, overlaybackdropInvert, overlaybackdropBlur, isCentered, finalFocusRef, blockScrollOnMount, initialFocusRef, closeOnOverlayClick, motionPreset, scrollBehavior, children, }: ChakraModelProps): React.JSX.Element;

package/dist/Components/Modal/Modal.stories.d.ts

@@ -0,0 +1,8 @@
+import React from 'react';
+import { ChakraModelProps } from './ModalProps';
+declare const _default: import("@storybook/types").ComponentAnnotations<import("@storybook/react/dist/types-bf5e6555").R, import("@storybook/types").Args>;
+export default _default;
+interface StoryProps extends ChakraModelProps {
+    footer: React.ReactNode;
+}
+export declare const Default: import("@storybook/types").AnnotatedStoryFn<import("@storybook/react/dist/types-bf5e6555").R, StoryProps>;

package/dist/Components/Modal/ModalProps.d.ts

@@ -0,0 +1,11 @@
+import { ModalProps } from "@chakra-ui/react";
+export type ChakraModelProps = Pick<ModalProps, "isOpen" | "onClose" | "finalFocusRef" | "blockScrollOnMount" | "initialFocusRef" | "closeOnOverlayClick" | "isCentered" | "motionPreset" | "scrollBehavior"> & {
+    title?: string;
+    footer?: any;
+    overlaybg?: string;
+    overlaybackdropFilter?: string;
+    overlaybackdropInvert?: string;
+    overlaybackdropBlur?: string;
+    size: 'xs' | 'sm' | 'md' | 'lg' | 'xl' | 'full';
+    children?: any;
+};

package/dist/Components/NavigationBar/NavBar.stories.d.ts

@@ -0,0 +1,4 @@
+import { NavbarProps } from './NavigationBarProps';
+declare const _default: import("@storybook/types").ComponentAnnotations<import("@storybook/react/dist/types-bf5e6555").R, import("@storybook/types").Args>;
+export default _default;
+export declare const Default: import("@storybook/types").AnnotatedStoryFn<import("@storybook/react/dist/types-bf5e6555").R, NavbarProps>;

package/dist/Components/NavigationBar/NavigationBar.d.ts

@@ -0,0 +1,3 @@
+import React from 'react';
+import { NavbarProps } from "./NavigationBarProps";
+export default function NavBar({ userAvathar, userName, navMenu, handleNavOnClick, handleLogout, logoutText }: NavbarProps): React.JSX.Element;

package/dist/Components/NavigationBar/NavigationBarProps.d.ts

@@ -0,0 +1,12 @@
+export type NavbarProps = {
+    userAvathar: string;
+    userName: string;
+    navMenu: MenuProps[];
+    handleNavOnClick: (url: string) => void;
+    handleLogout: () => void;
+    logoutText: string;
+};
+export type MenuProps = {
+    title: string;
+    url: string;
+};

package/dist/Components/NumberInput/NumberInput.d.ts

@@ -0,0 +1,3 @@
+import React from 'react';
+import { NumberInputProps } from "./NumberInputProps";
+export default function NumberInput({ defaultValue, min, max, precision, step, clampValueOnBlur, keepWithinRange, value, onChange, size, maxW, allowMouseWheel, NumberIncrementStepperBg, NumberIncrementStepperActive, NumberIncrementStepperChildren, NumberDecrementStepperBg, NumberDecrementStepperChildren, NumberDecrementStepperActive }: NumberInputProps): React.JSX.Element;

package/dist/Components/NumberInput/NumberInput.stories.d.ts

@@ -0,0 +1,3 @@
+declare const _default: import("@storybook/types").ComponentAnnotations<import("@storybook/react/dist/types-bf5e6555").R, import("@storybook/types").Args>;
+export default _default;
+export declare const Default: import("@storybook/types").AnnotatedStoryFn<import("@storybook/react/dist/types-bf5e6555").R, import("@storybook/types").Args>;

package/dist/Components/NumberInput/NumberInputProps.d.ts

@@ -0,0 +1,12 @@
+import { NumberInputProps as chakraNumbetInpurProps } from "@chakra-ui/react";
+export type NumberInputProps = Pick<chakraNumbetInpurProps, "defaultValue" | "min" | "max" | "precision" | "step" | "clampValueOnBlur" | "keepWithinRange" | "value" | "onChange" | "size" | "maxW" | "allowMouseWheel"> & {
+    NumberIncrementStepperBg?: string;
+    NumberIncrementStepperActive?: ActiveStyle;
+    NumberIncrementStepperChildren?: string;
+    NumberDecrementStepperBg?: string;
+    NumberDecrementStepperChildren?: string;
+    NumberDecrementStepperActive?: ActiveStyle;
+};
+export type ActiveStyle = {
+    bg: string;
+};

package/dist/Components/PinInput/PinInput.d.ts

@@ -0,0 +1,3 @@
+import React from 'react';
+import { ChakraPinInputProps } from "./PinInputProps";
+export default function PinInputs({ otp, mask, defaultValue, placeholder, manageFocus, errorBorderColor, focusBorderColor, onChange, onComplete, type, color, variant, pins, label }: ChakraPinInputProps): React.JSX.Element;

package/dist/Components/PinInput/PinInput.stories.d.ts

@@ -0,0 +1,6 @@
+import { ChakraPinInputProps } from './PinInputProps';
+declare const _default: import("@storybook/types").ComponentAnnotations<import("@storybook/react/dist/types-bf5e6555").R, import("@storybook/types").Args>;
+export default _default;
+export declare const Default: import("@storybook/types").AnnotatedStoryFn<import("@storybook/react/dist/types-bf5e6555").R, ChakraPinInputProps>;
+export declare const Masked: import("@storybook/types").AnnotatedStoryFn<import("@storybook/react/dist/types-bf5e6555").R, ChakraPinInputProps>;
+export declare const SixPins: import("@storybook/types").AnnotatedStoryFn<import("@storybook/react/dist/types-bf5e6555").R, ChakraPinInputProps>;

package/dist/Components/PinInput/PinInputProps.d.ts

@@ -0,0 +1,9 @@
+import { PinInputProps } from "@chakra-ui/react";
+export type ChakraPinInputProps = Pick<PinInputProps, "otp" | "mask" | "defaultValue" | "placeholder" | "manageFocus" | "errorBorderColor" | "focusBorderColor" | "onChange" | "onComplete"> & {
+    type?: "alphanumeric" | "number";
+    size?: "xs" | "sm" | "md" | "lg";
+    variant?: "flushed" | "outline" | "filled" | "unstyled";
+    color?: "gray" | "red" | "orange" | "yellow" | "green" | "teal" | "blue" | "cyan" | "purple" | "pink" | "whiteAlpha" | "blackAlpha";
+    pins: number;
+    label?: string;
+};

package/dist/Components/ProfileCard/ProfileCard.d.ts

@@ -0,0 +1,3 @@
+import React from 'react';
+import { ProfileCardProps } from "./ProfileCardProps";
+export default function ProfileCard({ key, maxW, align, variant, direction, justify, header, footer, children, size, color, overflow, dividercolor, dividersize, dividervariant, }: ProfileCardProps): React.JSX.Element;

package/dist/Components/ProfileCard/ProfileCard.stories.d.ts

@@ -0,0 +1,4 @@
+import { ProfileCardProps } from './ProfileCardProps';
+declare const _default: import("@storybook/types").ComponentAnnotations<import("@storybook/react/dist/types-bf5e6555").R, import("@storybook/types").Args>;
+export default _default;
+export declare const Default: import("@storybook/types").AnnotatedStoryFn<import("@storybook/react/dist/types-bf5e6555").R, ProfileCardProps>;

package/dist/Components/ProfileCard/ProfileCardProps.d.ts

@@ -0,0 +1,14 @@
+/// <reference types="react" />
+import { CardProps } from "@chakra-ui/react";
+export type ProfileCardProps = Pick<CardProps, "direction" | "maxW" | "align" | "justify" | "overflow"> & {
+    header?: React.ReactNode;
+    footer?: React.ReactNode;
+    children: React.ReactNode;
+    variant?: "elevated" | "outlein" | "filled" | "unstyled";
+    size?: "sm" | "md" | "lg";
+    color?: "whiteAlpha" | "blackAlpha" | "gray" | "red" | "orange" | "yellow" | "green" | "teal" | "blue" | "cyan" | "purple" | "pink";
+    key?: string;
+    dividercolor?: "whiteAlpha" | "blackAlpha" | "gray" | "red" | "orange" | "yellow" | "green" | "teal" | "blue" | "cyan" | "purple" | "pink";
+    dividersize?: string;
+    dividervariant?: "solid" | "dashed";
+};

package/dist/Components/ProfilePhotoViewer/ProfilePhotoViewer.d.ts

@@ -0,0 +1,3 @@
+import React from 'react';
+import { ProfilePhotoViewerProps } from "./ProfilePhotoViewerProps";
+export default function ProfilePhotoViewer({ photoUrl, onPhotoChange, imageWidth, imageAlt, imageObjectFit, imageBorderRadius, editIconSize, editIconPositionRight, editIconPositionBottom, isRound, boxStyle }: ProfilePhotoViewerProps): React.JSX.Element;

package/dist/Components/ProfilePhotoViewer/ProfilePhotoViewer.stories.d.ts

@@ -0,0 +1,4 @@
+import { ProfilePhotoViewerProps } from './ProfilePhotoViewerProps';
+declare const _default: import("@storybook/types").ComponentAnnotations<import("@storybook/react/dist/types-bf5e6555").R, import("@storybook/types").Args>;
+export default _default;
+export declare const Default: import("@storybook/types").AnnotatedStoryFn<import("@storybook/react/dist/types-bf5e6555").R, ProfilePhotoViewerProps>;

package/dist/Components/ProfilePhotoViewer/ProfilePhotoViewerProps.d.ts

@@ -0,0 +1,14 @@
+/// <reference types="react" />
+export type ProfilePhotoViewerProps = {
+    photoUrl: string;
+    onPhotoChange: (photoUrl: File) => void;
+    imageWidth?: string;
+    imageAlt?: string;
+    imageObjectFit?: "cover" | "contain" | "fill" | "none" | "scale-down";
+    imageBorderRadius?: string;
+    editIconSize?: string;
+    editIconPositionRight?: string;
+    editIconPositionBottom?: string;
+    isRound?: boolean;
+    boxStyle?: React.CSSProperties;
+};

package/dist/Components/ProgressBar/ProgressBar.d.ts

@@ -0,0 +1,3 @@
+import React from 'react';
+import { ProgressBarProps } from "./ProgressBarProps";
+export default function ProgressBar({ size, isIndeterminate, color, hasStripe, height, value, isAnimated, max, min, variant, }: ProgressBarProps): React.JSX.Element;

package/dist/Components/ProgressBar/ProgressBar.stories.d.ts

@@ -0,0 +1,4 @@
+import { ProgressBarProps } from "./ProgressBarProps";
+declare const _default: import("@storybook/types").ComponentAnnotations<import("@storybook/react/dist/types-bf5e6555").R, import("@storybook/types").Args>;
+export default _default;
+export declare const Default: import("@storybook/types").AnnotatedStoryFn<import("@storybook/react/dist/types-bf5e6555").R, ProgressBarProps>;

package/dist/Components/ProgressBar/ProgressBarProps.d.ts

@@ -0,0 +1,6 @@
+import { ProgressProps } from "@chakra-ui/react";
+export type ProgressBarProps = Pick<ProgressProps, "size" | "isIndeterminate" | "value" | "height" | "hasStripe" | "isAnimated" | "max" | "min"> & {
+    color?: "gray" | "red" | "orange" | "yellow" | "green" | "teal" | "blue" | "cyan" | "purple" | "pink" | "whiteAlpha" | "blackAlpha";
+    variant?: "solid" | "outline" | "ghost" | "link" | "unstyled";
+    size?: "lg" | "md" | "sm" | "xs";
+};

package/dist/Components/RadioButton/RadioButton.d.ts

@@ -0,0 +1,5 @@
+import React from 'react';
+import { ChakraRadioProps, ChakraRadioGroupProps } from './RadioButtonProps';
+declare const RadioButton: ({ label, colorScheme, isChecked, onChange, isDisabled, size, value, defaultChecked, }: ChakraRadioProps) => React.JSX.Element;
+declare const RadioButtonGroup: ({ options, onChange, value, defaultValue, isDisabled, size, colorScheme, }: ChakraRadioGroupProps) => React.JSX.Element;
+export { RadioButton, RadioButtonGroup };

package/dist/Components/RadioButton/RadioButton.stories.d.ts

@@ -0,0 +1,14 @@
+declare const _default: import("@storybook/types").ComponentAnnotations<import("@storybook/react/dist/types-bf5e6555").R, Pick<import("@chakra-ui/radio/dist/radio").RadioProps, "isDisabled" | "colorScheme" | "value" | "defaultChecked" | "onChange" | "size" | "isChecked"> & {
+    label: string;
+}>;
+export default _default;
+export declare const SingleRadioButton: import("@storybook/types").AnnotatedStoryFn<import("@storybook/react/dist/types-bf5e6555").R, Pick<import("@chakra-ui/radio/dist/radio").RadioProps, "isDisabled" | "colorScheme" | "value" | "defaultChecked" | "onChange" | "size" | "isChecked"> & {
+    label: string;
+}>;
+export declare const RadioButtonGroupStory: import("@storybook/types").AnnotatedStoryFn<import("@storybook/react/dist/types-bf5e6555").R, Pick<import("@chakra-ui/radio/dist/radio-group").RadioGroupProps, "isDisabled" | "colorScheme" | "value" | "defaultValue" | "size"> & {
+    options: {
+        label: string;
+        value: string;
+    }[];
+    onChange?: ((value: string) => void) | undefined;
+}>;

package/dist/Components/RadioButton/RadioButtonProps.d.ts

@@ -0,0 +1,11 @@
+import { RadioProps, RadioGroupProps } from '@chakra-ui/react';
+export type ChakraRadioProps = Pick<RadioProps, "size" | "colorScheme" | "isChecked" | "onChange" | "isDisabled" | "value" | "defaultChecked"> & {
+    label: string;
+};
+export type ChakraRadioGroupProps = Pick<RadioGroupProps, "size" | "colorScheme" | "isDisabled" | "defaultValue" | "value"> & {
+    options: {
+        label: string;
+        value: string;
+    }[];
+    onChange?: (value: string) => void;
+};

package/dist/Components/Select/Select.d.ts

@@ -0,0 +1,3 @@
+import React from 'react';
+import { chakraSelectProps } from "./SelectProps";
+export default function Select({ placeholder, size, variant, icon, bg, borderColor, color, error, isRequired, label, errorMessage, helperText, options, value, onChange, width, }: chakraSelectProps): React.JSX.Element;

package/dist/Components/Select/Select.stories.d.ts

@@ -0,0 +1,6 @@
+import { Meta } from '@storybook/react';
+import Select from './Select';
+import { chakraSelectProps } from './SelectProps';
+declare const meta: Meta<typeof Select>;
+export default meta;
+export declare const Primary: import("@storybook/types").AnnotatedStoryFn<import("@storybook/react/dist/types-bf5e6555").R, chakraSelectProps>;

package/dist/Components/Select/SelectProps.d.ts

@@ -0,0 +1,13 @@
+import { SelectProps } from "@chakra-ui/react";
+export type chakraSelectProps = Pick<SelectProps, "placeholder" | "size" | "variant" | "icon" | "bg" | "borderColor" | "color" | "onChange" | "onBlur" | "onFocus" | "errorBorderColor" | "isDisabled" | "isReadOnly" | "isRequired" | "value"> & {
+    label?: string;
+    error?: boolean;
+    errorMessage?: string;
+    helperText?: string;
+    options: OptionProp[];
+    width?: string | number;
+};
+export type OptionProp = {
+    id: string | number;
+    label: string | number;
+};

package/dist/Components/SideBar/SideBar.d.ts

@@ -0,0 +1,3 @@
+import React from 'react';
+import { SidebarProps } from './SideBarProps';
+export default function Sidebar({ menus, activeMenu, handleMenuClick, toggle, changeToggle, logo, companyName }: SidebarProps): React.JSX.Element;

package/dist/Components/SideBar/SideBarProps.d.ts

@@ -0,0 +1,20 @@
+import { IconType } from "react-icons";
+export type SidebarProps = {
+    menus: Menu[];
+    activeMenu: string;
+    handleMenuClick: (title: string, url: string) => void;
+    toggle: boolean;
+    changeToggle: () => void;
+    logo: string;
+    companyName: string;
+};
+type Menu = {
+    title: string;
+    icon: IconType;
+    url: string;
+    subMenu?: {
+        title: string;
+        url: string;
+    }[];
+};
+export {};

package/dist/Components/SideBar/Sidebar.stories.d.ts

@@ -0,0 +1,4 @@
+import { SidebarProps } from './SideBarProps';
+declare const _default: import("@storybook/types").ComponentAnnotations<import("@storybook/react/dist/types-bf5e6555").R, import("@storybook/types").Args>;
+export default _default;
+export declare const Primary: import("@storybook/types").AnnotatedStoryFn<import("@storybook/react/dist/types-bf5e6555").R, SidebarProps>;

package/dist/Components/Skeletons/Skeleton.stories.d.ts

@@ -0,0 +1,6 @@
+import { SkeletonProps } from './SkeletonProps';
+declare const _default: import("@storybook/types").ComponentAnnotations<import("@storybook/react/dist/types-bf5e6555").R, import("@storybook/types").Args>;
+export default _default;
+export declare const DefaultSkeleton: import("@storybook/types").AnnotatedStoryFn<import("@storybook/react/dist/types-bf5e6555").R, SkeletonProps>;
+export declare const SkeletonCircle: import("@storybook/types").AnnotatedStoryFn<import("@storybook/react/dist/types-bf5e6555").R, SkeletonProps>;
+export declare const SkeletonText: import("@storybook/types").AnnotatedStoryFn<import("@storybook/react/dist/types-bf5e6555").R, SkeletonProps>;

package/dist/Components/Skeletons/SkeletonProps.d.ts

@@ -0,0 +1,4 @@
+import { SkeletonProps as ChakraSkeleton, SkeletonTextProps } from "@chakra-ui/react";
+export type SkeletonProps = Pick<ChakraSkeleton, "startColor" | "endColor" | "height" | "isLoaded" | "bg" | "color" | "fadeDuration" | "children" | "speed" | "size" | "mt" | "noOfLines" | "width"> & {
+    type: "skeleton" | "circle" | "text";
+} & Partial<Pick<SkeletonTextProps, "spacing" | "skeletonHeight">>;

package/dist/Components/Skeletons/Skeletons.d.ts

@@ -0,0 +1,3 @@
+import React from 'react';
+import { SkeletonProps } from "./SkeletonProps";
+export default function Skeletons({ startColor, endColor, height, isLoaded, bg, color, fadeDuration, children, type, speed, size, mt, noOfLines, spacing, skeletonHeight, width }: SkeletonProps): React.JSX.Element;

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

@@ -0,0 +1,3 @@
+import React from 'react';
+import { TableProps } from "./TableProps";
+export default function Table({ data, headers, tableHeaderBgColor, tableHeaderColor, handleExportChange, exportOptions, exportLabel, isLoading, loadingContaxt, loadingBoxStyle, }: TableProps): React.JSX.Element;

package/dist/Components/Table/Table.stories.d.ts

@@ -0,0 +1,4 @@
+import { TableProps } from './TableProps';
+declare const _default: import("@storybook/types").ComponentAnnotations<import("@storybook/react/dist/types-bf5e6555").R, import("@storybook/types").Args>;
+export default _default;
+export declare const Default: import("@storybook/types").AnnotatedStoryFn<import("@storybook/react/dist/types-bf5e6555").R, TableProps>;

package/dist/Components/Table/TableProps.d.ts

@@ -0,0 +1,33 @@
+import { ReactNode } from "react";
+export type TableProps = {
+    data: DataObject[];
+    headers: TableHeader[];
+    tableHeaderBgColor?: string;
+    tableHeaderColor?: string;
+    handleExportChange?: (value: string) => void | undefined;
+    exportOptions?: ExportOption[];
+    exportLabel?: string;
+    isLoading?: boolean;
+    loadingType?: 'skeleton' | 'spinner';
+    loadingContaxt?: ReactNode;
+    loadingBoxStyle?: React.CSSProperties;
+};
+export type DataObject = {
+    id: number;
+    name: string;
+    email: string;
+    role: string;
+    [key: string]: string | number;
+};
+export type TableHeader = {
+    label: string;
+    accessor_key: string;
+    sort?: boolean;
+    search?: boolean;
+    columnFreeze?: boolean;
+    accessor_function?: (data: string | number) => JSX.Element | string | number;
+};
+export type ExportOption = {
+    label: string;
+    value: string;
+};

package/dist/Components/Toaster/Toaster.d.ts

@@ -0,0 +1,4 @@
+import React from 'react';
+import { ToasterChildren, ToasterContextType } from './ToasterProps';
+export default function ToasterProvider({ children }: ToasterChildren): React.JSX.Element;
+export declare const useToaster: () => ToasterContextType;

package/dist/Components/Toaster/Toaster.stories.d.ts

@@ -0,0 +1,8 @@
+declare const _default: import("@storybook/types").ComponentAnnotations<import("@storybook/react/dist/types-bf5e6555").R, import("@storybook/types").Args>;
+export default _default;
+interface StoryProps {
+    title: string;
+    status: 'info' | 'warning' | 'success' | 'error';
+    position: 'top' | 'top-right' | 'top-left' | 'bottom' | 'bottom-right' | 'bottom-left';
+}
+export declare const Default: import("@storybook/types").AnnotatedStoryFn<import("@storybook/react/dist/types-bf5e6555").R, StoryProps>;

package/dist/Components/Toaster/ToasterProps.d.ts

@@ -0,0 +1,12 @@
+import { ToastProps } from "@chakra-ui/react";
+import { ReactNode } from "react";
+export type ToasterToastProps = Pick<ToastProps, 'description' | 'title' | 'isClosable' | 'duration' | 'children' | 'onClose'> & {
+    position?: "top" | "bottom" | "top-right" | "top-left" | "bottom-right" | "bottom-left";
+    status?: "success" | "error" | "warning" | "info" | "loading";
+};
+export interface ToasterContextType {
+    showToast: (children: ToasterToastProps) => void;
+}
+export interface ToasterChildren {
+    children: ReactNode;
+}

package/dist/Components/ToolTip/ToolTip.d.ts

@@ -0,0 +1,3 @@
+import React from 'react';
+import { ToolTipProps } from "./ToolTipProps";
+export default function ToolTip({ placement, label, children, hasArrow, fontSize, bg, color, isDisabled, isOpen, defaultIsOpen, openDelay, closeDelay, arrowSize, closeOnClick, size, width, height, arrowPadding, arrowShadowColor, direction, gutter, onClose, modifiers, closeOnPointerDown }: ToolTipProps): React.JSX.Element;

package/dist/Components/ToolTip/ToolTip.stories.d.ts

@@ -0,0 +1,5 @@
+import { ToolTipProps } from "./ToolTipProps";
+declare const _default: import("@storybook/types").ComponentAnnotations<import("@storybook/react/dist/types-bf5e6555").R, import("@storybook/types").Args>;
+export default _default;
+export declare const Default: import("@storybook/types").AnnotatedStoryFn<import("@storybook/react/dist/types-bf5e6555").R, ToolTipProps>;
+export declare const Customized: import("@storybook/types").AnnotatedStoryFn<import("@storybook/react/dist/types-bf5e6555").R, ToolTipProps>;

package/dist/Components/ToolTip/ToolTipProps.d.ts

@@ -0,0 +1,6 @@
+/// <reference types="react" />
+import { TooltipProps as ChakraTooltip } from "@chakra-ui/react";
+export type ToolTipProps = Pick<ChakraTooltip, "placement" | "label" | "hasArrow" | "fontSize" | "bg" | "color" | "isDisabled" | "isOpen" | "defaultIsOpen" | "openDelay" | "closeDelay" | "arrowSize" | "closeOnClick" | "size" | "width" | "height" | "arrowPadding" | "arrowShadowColor" | "direction" | "gutter" | "onClose" | "modifiers" | "closeOnPointerDown"> & {
+    children: React.ReactNode;
+    placement: "auto" | "auto-start" | "auto-end" | "top" | "top-start" | "top-end" | "right" | "right-start" | "right-end" | "bottom" | "bottom-start" | "bottom-end" | "left" | "left-start" | "left-end";
+};

package/dist/Layout.d.ts

@@ -0,0 +1,3 @@
+import React from "react";
+declare const Layout: () => React.JSX.Element;
+export default Layout;

package/dist/Theme/Dark/theme.d.ts

@@ -0,0 +1,2 @@
+declare const darkTheme: Record<string, any>;
+export default darkTheme;

package/dist/Theme/Default/theme.d.ts

@@ -0,0 +1,2 @@
+declare const theme: Record<string, any>;
+export default theme;

package/dist/Theme/index.d.ts

@@ -0,0 +1,3 @@
+import theme from "./Default/theme";
+import darkTheme from "./Dark/theme";
+export { theme as defaultTheme, darkTheme };

package/dist/bootstrap.d.ts

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

package/dist/index.d.ts

@@ -0,0 +1,2 @@
+export { default as Loading } from "./Components/Loading/Loading";
+export { default as ToolTip } from "./Components/ToolTip/ToolTip";

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "pixelize-design-library",
-  "version": "1.0.12",
+  "version": "1.0.13",
   "private": false,
   "main": "dist/index.ts",
   "module": "dist/index.js",

package/tsconfig.json

@@ -24,6 +24,7 @@
       "./node_modules/@types",
       "./src/types"
     ],
+    "declaration": true,
   },
   "include": [
     "src"