pixelize-design-library 2.1.18 → 2.1.20

package/src/index.ts

@@ -0,0 +1,146 @@
+// Core Components
+import Accordian from "./Components/Accordion/Accordion";
+import AlertDialog from "./Components/AlertDialog/AlertDialog";
+import ApexBarChart from "./Components/Apexcharts/ApexBarChart/ApexBarChart";
+import ApexPieChart from "./Components/Apexcharts/ApexPieChart/ApexPieChart";
+import Breadcrumbs from "./Components/Breadcrumbs/Breadcrumbs";
+import Button from "./Components/Button/Button";
+import ButtonGroupIcon from "./Components/ButtonGroupIcon/ButtonGroupIcon";
+import Card from "./Components/Card/Card";
+import Checkbox from "./Components/Checkbox/Checkbox";
+import ContactForm from "./Components/ContactForm/ContactForm";
+import DatePicker from "./Components/DatePicker/DatePicker";
+import Drawer, {
+  DrawerHeader,
+  DrawerBody,
+  DrawerFooter,
+} from "./Components/Drawer/Drawer";
+import Dropdown from "./Components/Dropdown/DropDown";
+import Editor from "./Components/Editor/Editor";
+import FileUpload from "./Components/FileUpload/FileUpload";
+import FormWrapper from "./Components/Form/FormWrapper";
+import Header from "./Components/Header/Header";
+import HeaderActions from "./Components/Header/HeaderActions";
+import InputTextArea from "./Components/InputTextArea/InputTextArea";
+import KanbanBoard from "./Components/KanbanBoard/KanbanBoard";
+import Loading from "./Components/Loading/Loading";
+import Modal, {
+  ModalHeader,
+  ModalBody,
+  ModalFooter,
+} from "./Components/Modal/Modal";
+import MultiSelect from "./Components/MultiSelect/MultiSelect";
+import NavigationBar from "./Components/NavigationBar/NavigationBar";
+import NoteTextArea from "./Components/NoteTextArea/NoteTextArea";
+import NumberInput from "./Components/NumberInput/NumberInput";
+import PinInput from "./Components/PinInput/PinInput";
+import ProfileCard, {
+  ProfileCardHeader,
+  ProfileCardBody,
+  ProfileCardFooter,
+} from "./Components/ProfileCard/ProfileCard";
+import ProfilePhotoViewer from "./Components/ProfilePhotoViewer/ProfilePhotoViewer";
+import ProgressBar from "./Components/ProgressBar/ProgressBar";
+import {
+  RadioButton,
+  RadioButtonGroup,
+} from "./Components/RadioButton/RadioButton";
+import Reorder from "./Components/Reorder/Reorder";
+import Search from "./Components/Search/Search";
+import Select from "./Components/Select/Select";
+import SearchSelect from "./Components/SearchSelect/SearchSelect";
+import SelectSearch from "./Components/SelectSearch/SelectSearch";
+import SideBar from "./Components/SideBar/SideBar";
+import Slider from "./Components/Slider/Slider";
+import Skeletons from "./Components/Skeletons/Skeletons";
+import Switch from "./Components/Switch/Switch";
+import Table from "./Components/Table/Table";
+import Tag from "./Components/Tag/Tag";
+import TextInput from "./Components/Input/TextInput";
+import Timeline from "./Components/Timeline/Timeline";
+import Toaster, { useToaster } from "./Components/Toaster/Toaster";
+import ToolTip from "./Components/ToolTip/ToolTip";
+import VerifyEmailOtp from "./Components/EmailCards/VerifyEmailOtp/VerifyEmailOtp";
+import TableToggle from "./Components/Toggle/TableToggle";
+import ProductCard from "./Components/ProductCard/ProductCard";
+
+// Theme System
+import withTheme from "./withTheme";
+import { useCustomTheme } from "./Theme/useCustomTheme";
+import { ThemesList } from "./Theme";
+
+// Utilities
+import { debounce } from "./Utils/table";
+
+export {
+  // components
+  Accordian,
+  AlertDialog,
+  ApexBarChart,
+  ApexPieChart,
+  Breadcrumbs,
+  Button,
+  ButtonGroupIcon,
+  Card,
+  Checkbox,
+  ContactForm,
+  DatePicker,
+  Drawer,
+  DrawerHeader,
+  DrawerBody,
+  DrawerFooter,
+  Dropdown,
+  Editor,
+  FileUpload,
+  FormWrapper,
+  Header,
+  HeaderActions,
+  InputTextArea,
+  KanbanBoard,
+  Loading,
+  Modal,
+  ModalHeader,
+  ModalBody,
+  ModalFooter,
+  NavigationBar,
+  NoteTextArea,
+  MultiSelect,
+  NumberInput,
+  PinInput,
+  ProductCard,
+  ProfileCard,
+  ProfileCardHeader,
+  ProfileCardBody,
+  ProfileCardFooter,
+  ProfilePhotoViewer,
+  ProgressBar,
+  RadioButton,
+  RadioButtonGroup,
+  Reorder,
+  Search,
+  Select,
+  SearchSelect,
+  SelectSearch,
+  SideBar,
+  Slider,
+  Skeletons,
+  Switch,
+  Table,
+  TableToggle,
+  Tag,
+  TextInput,
+  Timeline,
+  Toaster,
+  ToolTip,
+  useToaster,
+  VerifyEmailOtp,
+
+  // themes
+  useCustomTheme,
+  ThemesList,
+
+  // functions
+  debounce,
+};
+
+export default withTheme;

package/src/types/pixelize-design-library.d.ts

@@ -0,0 +1,4 @@
+declare module "pixelize-design-library" {
+  const content: any;
+  export default content;
+}

package/src/withTheme.tsx

@@ -0,0 +1,20 @@
+import React from "react";
+import { ChakraProvider, ColorModeScript } from "@chakra-ui/react";
+import { lavender } from "./Theme"; // Import your custom theme
+import ToasterProvider from "./Components/Toaster/Toaster";
+
+const withTheme = (Component: React.ComponentType, theme?: any) => {
+  const customTheme = theme ?? lavender;
+  return (props: any) => (
+    <ChakraProvider theme={customTheme}>
+      <ToasterProvider>
+        <ColorModeScript
+          initialColorMode={customTheme.config.initialColorMode}
+        />
+        <Component {...props} />
+      </ToasterProvider>
+    </ChakraProvider>
+  );
+};
+
+export default withTheme;

package/tsconfig.json

@@ -0,0 +1,23 @@
+{
+  "compilerOptions": {
+    "target": "es5",
+    "module": "CommonJS",
+    "lib": ["dom", "dom.iterable", "esnext"],
+    "allowJs": true,
+    "skipLibCheck": true,
+    "esModuleInterop": true,
+    "allowSyntheticDefaultImports": true,
+    "strict": true,
+    "forceConsistentCasingInFileNames": true,
+    "noFallthroughCasesInSwitch": true,
+    "moduleResolution": "node",
+    "resolveJsonModule": true,
+    "isolatedModules": true,
+    "noEmit": false,
+    "jsx": "react",
+    "outDir": "./dist",
+    "typeRoots": ["./node_modules/@types", "./src/types"],
+    "declaration": true
+  },
+  "include": ["src"]
+}

package/dist/App.d.ts

@@ -1,4 +0,0 @@
-import React from "react";
-import './global.css';
-declare function App(): React.JSX.Element;
-export default App;

package/dist/App.js

@@ -1,158 +0,0 @@
-"use strict";
-var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
-    if (k2 === undefined) k2 = k;
-    var desc = Object.getOwnPropertyDescriptor(m, k);
-    if (!desc || ("get" in desc ? !m.__esModule : desc.writable || desc.configurable)) {
-      desc = { enumerable: true, get: function() { return m[k]; } };
-    }
-    Object.defineProperty(o, k2, desc);
-}) : (function(o, m, k, k2) {
-    if (k2 === undefined) k2 = k;
-    o[k2] = m[k];
-}));
-var __setModuleDefault = (this && this.__setModuleDefault) || (Object.create ? (function(o, v) {
-    Object.defineProperty(o, "default", { enumerable: true, value: v });
-}) : function(o, v) {
-    o["default"] = v;
-});
-var __importStar = (this && this.__importStar) || function (mod) {
-    if (mod && mod.__esModule) return mod;
-    var result = {};
-    if (mod != null) for (var k in mod) if (k !== "default" && Object.prototype.hasOwnProperty.call(mod, k)) __createBinding(result, mod, k);
-    __setModuleDefault(result, mod);
-    return result;
-};
-var __importDefault = (this && this.__importDefault) || function (mod) {
-    return (mod && mod.__esModule) ? mod : { "default": mod };
-};
-Object.defineProperty(exports, "__esModule", { value: true });
-var react_1 = __importStar(require("react"));
-var react_2 = require("@chakra-ui/react");
-var Loading_1 = __importDefault(require("./Components/Loading/Loading"));
-var SideBar_1 = __importDefault(require("./Components/SideBar/SideBar"));
-var NavigationBar_1 = __importDefault(require("./Components/NavigationBar/NavigationBar"));
-var Breadcrumbs_1 = __importDefault(require("./Components/Breadcrumbs/Breadcrumbs"));
-var Layout_1 = __importDefault(require("./Layout"));
-var lucide_react_1 = require("lucide-react");
-require("./global.css");
-function App() {
-    function useWindowSize() {
-        var _a = (0, react_1.useState)({
-            width: 0,
-            height: 0,
-        }), windowSize = _a[0], setWindowSize = _a[1];
-        (0, react_1.useEffect)(function () {
-            function handleResize() {
-                setWindowSize({
-                    width: window.innerWidth,
-                    height: window.innerHeight,
-                });
-            }
-            window.addEventListener("resize", handleResize);
-            handleResize();
-            return function () { return window.removeEventListener("resize", handleResize); };
-        }, []);
-        return windowSize;
-    }
-    var _a = useWindowSize(), width = _a.width, height = _a.height;
-    var breadcrumbItems = [
-        { path: "/home", label: "Home" },
-        { path: "/about", label: "About" },
-        { path: "/contact", label: "Contact" },
-    ];
-    var handleClick = function (path) {
-        console.log("Navigating to ".concat(path));
-    };
-    var menu = [
-        { id: 1, title: "Dashboard", icon: lucide_react_1.House, url: "dashboard" },
-        { id: 2, title: "Calendar", icon: lucide_react_1.Calendar, url: "calendar" },
-        { id: 3, title: "Reports", icon: lucide_react_1.Calendar, url: "reports" },
-        { id: 4, title: "Settings", icon: lucide_react_1.Calendar, url: "settings" },
-        { id: 5, title: "Users", icon: lucide_react_1.Calendar, url: "users" },
-        {
-            id: 6,
-            title: "Notifications notifications notifications notifications notifications",
-            icon: lucide_react_1.Calendar,
-            url: "notifications",
-        },
-        { id: 7, title: "Analytics", icon: lucide_react_1.Calendar, url: "analytics" },
-        {
-            id: 8,
-            title: "Projects",
-            icon: lucide_react_1.Calendar,
-            url: "projects",
-            subMenu: [
-                {
-                    id: 21,
-                    title: "submenu1hghvhvkhvkhvkhvh",
-                    icon: lucide_react_1.Calendar,
-                    url: "submenu1",
-                },
-                {
-                    id: 22,
-                    title: "submenu2",
-                    icon: lucide_react_1.Calendar,
-                    url: "submenu2",
-                },
-            ],
-        },
-        { id: 9, title: "Tasks", icon: lucide_react_1.Calendar, url: "tasks" },
-        { id: 10, title: "Teams", icon: lucide_react_1.Calendar, url: "teams" },
-        { id: 11, title: "Clients", icon: lucide_react_1.Calendar, url: "clients" },
-        { id: 12, title: "Invoices", icon: lucide_react_1.Calendar, url: "invoices" },
-        { id: 13, title: "Payments", icon: lucide_react_1.Calendar, url: "payments" },
-        { id: 14, title: "Leads", icon: lucide_react_1.Calendar, url: "leads" },
-        { id: 15, title: "Opportunities", icon: lucide_react_1.Calendar, url: "opportunities" },
-        { id: 16, title: "Campaigns", icon: lucide_react_1.Calendar, url: "campaigns" },
-        { id: 17, title: "Documents", icon: lucide_react_1.Calendar, url: "documents" },
-        { id: 18, title: "Files", icon: lucide_react_1.Calendar, url: "files" },
-        { id: 19, title: "Support", icon: lucide_react_1.Calendar, url: "support" },
-        { id: 20, title: "Integrations", icon: lucide_react_1.Calendar, url: "integrations" },
-    ];
-    var _b = (0, react_1.useState)(true), toggle = _b[0], changeToggle = _b[1];
-    var _c = (0, react_1.useState)(""), activeMenu = _c[0], setActiveMenu = _c[1];
-    var handleMenuClick = function (menu) {
-        setActiveMenu(menu === null || menu === void 0 ? void 0 : menu.title);
-    };
-    var navmenus = [
-        { title: "Account Settings", url: "myaccount" },
-        { title: "Resetpassword", url: "resetpassword" },
-    ];
-    var handleNavOnClick = function (title) { };
-    var handleLogout = function () { };
-    // return (
-    //   <Box height={"90%"}>
-    //     <Slider
-    //       images={[
-    //         "https://picsum.photos/id/1011/600/400",
-    //         "https://picsum.photos/id/1012/600/400",
-    //         "https://picsum.photos/id/1013/600/400",
-    //         "https://encrypted-tbn0.gstatic.com/images?q=tbn:ANd9GcSUgffoihYPEcEZH4D24OA-1Hnwz-SRN4DOmcABM6nro6l2D_yLYjNNFy_pOpOC9ABjXY2_",
-    //         "https://beam-images.warnermediacdn.com/BEAM_LWM_DELIVERABLES/4f6b4985-2dc9-4ab6-ac79-d60f0860b0ac/87240dbd-5c19-11f0-b655-025327c09033?host=wbd-images.prod-vod.h264.io&partner=beamcom",
-    //       ]}
-    //     />
-    //   </Box>
-    // );
-    return (react_1.default.createElement("div", { className: "App" },
-        react_1.default.createElement(react_2.Box, { minH: "100vh", bg: "gray.100", overflow: "hidden" },
-            react_1.default.createElement(Loading_1.default, { text: "PIXELIZE CRM", isLoading: false, onlytext: true }),
-            react_1.default.createElement(react_2.Flex, null,
-                react_1.default.createElement(react_2.Box, null,
-                    react_1.default.createElement(SideBar_1.default, { menus: menu, activeMenu: activeMenu, handleMenuClick: handleMenuClick, toggle: toggle, changeToggle: function () { return changeToggle(!toggle); }, 
-                        // logo={
-                        //   "https://play-lh.googleusercontent.com/Fro4e_osoDhhrjgiZ_Y2C5FNXBMWvrb4rGpmkM1PDAcUPXeiAlPCq7NeaT4Q6NRUxRqo"
-                        // }
-                        companyName: "PIXELIZE" })),
-                react_1.default.createElement(react_2.Box, { flex: "1", maxWidth: width, overflow: "hidden" },
-                    react_1.default.createElement(NavigationBar_1.default, { userAvathar: "https://bit.ly/dan-abramo", userName: "PIXELIZE", navMenu: navmenus, handleNavOnClick: handleNavOnClick, handleLogout: handleLogout, logoutText: "Logout", key: "navbar", navigationBarText: {
-                            text: "Dashboard",
-                            onIconClick: function () {
-                                console.log("Back icon clicked");
-                            },
-                        }, moreIcon: react_1.default.createElement(lucide_react_1.Calendar, null) }),
-                    react_1.default.createElement("br", null),
-                    react_1.default.createElement(Breadcrumbs_1.default, { separator: react_1.default.createElement(lucide_react_1.ChevronRight, { color: "gray.500" }), items: breadcrumbItems, handleClick: handleClick }),
-                    react_1.default.createElement(react_2.Box, { p: "50px", height: height - 160, overflowY: "scroll", width: width - 75 },
-                        react_1.default.createElement(Layout_1.default, null)))))));
-}
-exports.default = App;

package/dist/Assets/defaultLogo.d.ts

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

package/dist/Assets/defaultLogo.js

@@ -1,15 +0,0 @@
-"use strict";
-var __importDefault = (this && this.__importDefault) || function (mod) {
-    return (mod && mod.__esModule) ? mod : { "default": mod };
-};
-Object.defineProperty(exports, "__esModule", { value: true });
-var react_1 = __importDefault(require("react"));
-var useCustomTheme_1 = require("../Theme/useCustomTheme");
-var DefaultLogo = function () {
-    var theme = (0, useCustomTheme_1.useCustomTheme)();
-    return (react_1.default.createElement("svg", { width: "12.09", height: "15.95", viewBox: "0 0 31 29", fill: "none", xmlns: "http://www.w3.org/2000/svg" },
-        react_1.default.createElement("path", { d: "M30.4999 6.26137V7.81058H15.9761H14.8787V22.8508V28.8862H12.5226C9.6824 28.8862 7.32632 26.4656 7.06812 23.3995C7.06812 23.2381 7.06812 23.0444 7.06812 22.8508V18.3323C7.06812 18.2677 7.06812 18.2032 7.06812 18.1063V15.5889V6.2291C7.06812 2.80793 9.84378 -5.72205e-06 13.2972 -5.72205e-06H24.8517C28.0147 0.355021 30.4676 3.00158 30.4676 6.2291L30.4999 6.26137Z", fill: theme.colors.black }),
-        react_1.default.createElement("path", { d: "M7.10053 23.3672H7.03598C5.16402 23.2381 3.48571 22.4635 2.25926 21.3338C0.871428 20.0428 0 18.2677 0 16.3312V15.6211H7.06825V18.1386C7.06825 18.2032 7.06825 18.2677 7.06825 18.3645V22.883C7.06825 23.0767 7.06825 23.2381 7.06825 23.4317L7.10053 23.3672Z", fill: theme.colors.black }),
-        react_1.default.createElement("path", { d: "M30.4678 12.0063V15.6211V17.1703C30.4678 20.6238 26.272 23.3994 21.0757 23.3994H14.8789V22.8508V15.6211H22.6572V7.81056C22.6895 7.81056 30.5001 7.81056 30.5001 7.81056V11.5868C30.5001 11.7159 30.5001 11.8772 30.5001 12.0063H30.4678Z", fill: theme.colors.black })));
-};
-exports.default = DefaultLogo;

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

@@ -1,4 +0,0 @@
-import React from "react";
-import { AccordionProps } from "./AccordionProps";
-declare const Accordion: ({ allowMultiple, allowToggle, index, onChange, reduceMotion, items, ...rest }: AccordionProps) => React.JSX.Element;
-export default Accordion;

package/dist/Components/Accordion/Accordion.js

@@ -1,40 +0,0 @@
-"use strict";
-var __assign = (this && this.__assign) || function () {
-    __assign = Object.assign || function(t) {
-        for (var s, i = 1, n = arguments.length; i < n; i++) {
-            s = arguments[i];
-            for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p))
-                t[p] = s[p];
-        }
-        return t;
-    };
-    return __assign.apply(this, arguments);
-};
-var __rest = (this && this.__rest) || function (s, e) {
-    var t = {};
-    for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0)
-        t[p] = s[p];
-    if (s != null && typeof Object.getOwnPropertySymbols === "function")
-        for (var i = 0, p = Object.getOwnPropertySymbols(s); i < p.length; i++) {
-            if (e.indexOf(p[i]) < 0 && Object.prototype.propertyIsEnumerable.call(s, p[i]))
-                t[p[i]] = s[p[i]];
-        }
-    return t;
-};
-var __importDefault = (this && this.__importDefault) || function (mod) {
-    return (mod && mod.__esModule) ? mod : { "default": mod };
-};
-Object.defineProperty(exports, "__esModule", { value: true });
-var react_1 = __importDefault(require("react"));
-var react_2 = require("@chakra-ui/react");
-var Accordion = function (_a) {
-    var allowMultiple = _a.allowMultiple, allowToggle = _a.allowToggle, index = _a.index, onChange = _a.onChange, reduceMotion = _a.reduceMotion, items = _a.items, rest = __rest(_a, ["allowMultiple", "allowToggle", "index", "onChange", "reduceMotion", "items"]);
-    return (react_1.default.createElement(react_2.Accordion, __assign({ allowMultiple: allowMultiple, allowToggle: allowToggle, index: index, onChange: onChange, reduceMotion: reduceMotion }, rest), items.map(function (item, idx) {
-        var _a, _b, _c, _d;
-        return (react_1.default.createElement(react_2.AccordionItem, __assign({ key: idx }, item.itemProps, { sx: (_a = item.customStyles) === null || _a === void 0 ? void 0 : _a.itemStyle }),
-            react_1.default.createElement("h2", null,
-                react_1.default.createElement(react_2.AccordionButton, __assign({}, item.buttonProps, { sx: __assign(__assign({}, (_b = item.customStyles) === null || _b === void 0 ? void 0 : _b.buttonStyle), { '&:hover': __assign({}, (_c = item.customStyles) === null || _c === void 0 ? void 0 : _c.hoverbuttonStyle) }) }), item.header)),
-            react_1.default.createElement(react_2.AccordionPanel, __assign({}, item.panelProps, { sx: (_d = item.customStyles) === null || _d === void 0 ? void 0 : _d.panelStyle }), item.content)));
-    })));
-};
-exports.default = Accordion;

package/dist/Components/Accordion/AccordionProps.d.ts

@@ -1,17 +0,0 @@
-/// <reference types="react" />
-import { AccordionProps as ChakraAccordionProps, AccordionItemProps, AccordionButtonProps, AccordionPanelProps } from "@chakra-ui/react";
-export type AccordionProps = ChakraAccordionProps & {
-    items: {
-        header: React.ReactNode;
-        content: React.ReactNode;
-        buttonProps?: AccordionButtonProps;
-        panelProps?: AccordionPanelProps;
-        itemProps?: AccordionItemProps;
-        customStyles?: {
-            buttonStyle?: React.CSSProperties;
-            hoverbuttonStyle?: React.CSSProperties;
-            panelStyle?: React.CSSProperties;
-            itemStyle?: React.CSSProperties;
-        };
-    }[];
-};

package/dist/Components/Accordion/AccordionProps.js

@@ -1,2 +0,0 @@
-"use strict";
-Object.defineProperty(exports, "__esModule", { value: true });

package/dist/Components/AlertDialog/AlertDialog.d.ts

@@ -1,4 +0,0 @@
-import React from "react";
-import { AlertDialogsProps } from "./AlertDialogProps";
-declare const AlertDialog: ({ isOpen, onClose, leastDestructiveRef, content, title, confirmButtonText, cancelButtonText, isConfirmLoading, onConfirm, ContentStyle, headerStyle, bodyStyle, footerStyle, closeButtonStyle, button1Style, button2Style, isCentered, confirmButtonColor, key, }: AlertDialogsProps) => React.JSX.Element;
-export default AlertDialog;

package/dist/Components/AlertDialog/AlertDialog.js

@@ -1,20 +0,0 @@
-"use strict";
-var __importDefault = (this && this.__importDefault) || function (mod) {
-    return (mod && mod.__esModule) ? mod : { "default": mod };
-};
-Object.defineProperty(exports, "__esModule", { value: true });
-var react_1 = require("@chakra-ui/react");
-var react_2 = __importDefault(require("react"));
-var AlertDialog = function (_a) {
-    var isOpen = _a.isOpen, onClose = _a.onClose, leastDestructiveRef = _a.leastDestructiveRef, content = _a.content, title = _a.title, _b = _a.confirmButtonText, confirmButtonText = _b === void 0 ? "Yes" : _b, _c = _a.cancelButtonText, cancelButtonText = _c === void 0 ? "No" : _c, isConfirmLoading = _a.isConfirmLoading, onConfirm = _a.onConfirm, ContentStyle = _a.ContentStyle, headerStyle = _a.headerStyle, bodyStyle = _a.bodyStyle, footerStyle = _a.footerStyle, closeButtonStyle = _a.closeButtonStyle, button1Style = _a.button1Style, button2Style = _a.button2Style, isCentered = _a.isCentered, _d = _a.confirmButtonColor, confirmButtonColor = _d === void 0 ? "red" : _d, key = _a.key;
-    return (react_2.default.createElement(react_1.AlertDialog, { motionPreset: "slideInBottom", leastDestructiveRef: leastDestructiveRef, onClose: onClose, isOpen: isOpen, isCentered: isCentered, key: key },
-        react_2.default.createElement(react_1.AlertDialogOverlay, null),
-        react_2.default.createElement(react_1.AlertDialogContent, { sx: ContentStyle },
-            react_2.default.createElement(react_1.AlertDialogHeader, { sx: headerStyle }, title),
-            react_2.default.createElement(react_1.AlertDialogCloseButton, { sx: closeButtonStyle }),
-            react_2.default.createElement(react_1.AlertDialogBody, { sx: bodyStyle }, content),
-            react_2.default.createElement(react_1.AlertDialogFooter, { sx: footerStyle },
-                react_2.default.createElement(react_1.Button, { ref: null, onClick: onClose, size: "sm", sx: button1Style }, cancelButtonText),
-                react_2.default.createElement(react_1.Button, { colorScheme: confirmButtonColor, onClick: onConfirm, isLoading: isConfirmLoading, ml: 3, size: "sm", sx: button2Style }, confirmButtonText)))));
-};
-exports.default = AlertDialog;

package/dist/Components/AlertDialog/AlertDialogProps.js

@@ -1,2 +0,0 @@
-"use strict";
-Object.defineProperty(exports, "__esModule", { value: true });

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

@@ -1,3 +0,0 @@
-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.js

@@ -1,64 +0,0 @@
-"use strict";
-var __importDefault = (this && this.__importDefault) || function (mod) {
-    return (mod && mod.__esModule) ? mod : { "default": mod };
-};
-Object.defineProperty(exports, "__esModule", { value: true });
-var react_1 = __importDefault(require("react"));
-var react_apexcharts_1 = __importDefault(require("react-apexcharts"));
-function ApexBarChart(_a) {
-    var data = _a.data, labels = _a.labels, title = _a.title, titlePosition = _a.titlePosition, _b = _a.height, height = _b === void 0 ? 400 : _b, _c = _a.width, width = _c === void 0 ? 500 : _c, _d = _a.barColor, barColor = _d === void 0 ? ["#3182ce"] : _d, _e = _a.xAxisStyle, xAxisStyle = _e === void 0 ? {
-        color: "#ffffff",
-    } : _e, _f = _a.yAxisStyle, yAxisStyle = _f === void 0 ? {
-        color: "#ffffff",
-    } : _f, _g = _a.titleStyle, titleStyle = _g === void 0 ? {
-        color: "#3182ce",
-        fontSize: "16px",
-        fontWeight: 600,
-        fontFamily: "Arial",
-    } : _g;
-    var options = {
-        chart: {
-            type: "bar",
-            height: 350,
-        },
-        plotOptions: {
-            bar: {
-                borderRadius: 4,
-                horizontal: false,
-            },
-        },
-        dataLabels: {
-            enabled: false,
-            style: {
-                fontSize: "12px",
-                colors: ["#00E396"], //data label color
-            },
-        },
-        xaxis: {
-            categories: labels,
-            labels: {
-                style: xAxisStyle,
-            },
-        },
-        yaxis: {
-            labels: {
-                style: yAxisStyle,
-            },
-        },
-        title: {
-            text: title,
-            align: titlePosition,
-            style: titleStyle,
-        },
-        colors: barColor, //bar color
-    };
-    var series = [
-        {
-            name: "Data",
-            data: data,
-        },
-    ];
-    return (react_1.default.createElement("div", null,
-        react_1.default.createElement(react_apexcharts_1.default, { options: options, series: series, type: "bar", height: height, width: width })));
-}
-exports.default = ApexBarChart;

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

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

package/dist/Components/Apexcharts/ApexBarChart/ApexBarChart.stories.js

@@ -1,6 +0,0 @@
-"use strict";
-// import React from 'react';
-// import { StoryFn, Meta } from '@storybook/react';
-// import ApexBarChart from './ApexBarChart';
-// import { ApexBarChartProps } from './ApexBarChartProps';
-Object.defineProperty(exports, "__esModule", { value: true });

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

@@ -1,19 +0,0 @@
-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/ApexBarChart/ApexBarChartProps.js

@@ -1,2 +0,0 @@
-"use strict";
-Object.defineProperty(exports, "__esModule", { value: true });

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

@@ -1,3 +0,0 @@
-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.js

@@ -1,29 +0,0 @@
-"use strict";
-var __importDefault = (this && this.__importDefault) || function (mod) {
-    return (mod && mod.__esModule) ? mod : { "default": mod };
-};
-Object.defineProperty(exports, "__esModule", { value: true });
-var react_1 = __importDefault(require("react"));
-var react_apexcharts_1 = __importDefault(require("react-apexcharts"));
-function ApexPieChart(_a) {
-    var data = _a.data, labels = _a.labels, title = _a.title, titlePosition = _a.titlePosition, _b = _a.height, height = _b === void 0 ? 400 : _b, _c = _a.width, width = _c === void 0 ? 500 : _c, chartColor = _a.chartColor, _d = _a.titleStyle, titleStyle = _d === void 0 ? {
-        color: "#3182ce",
-    } : _d;
-    var options = {
-        chart: {
-            type: "pie",
-            height: 350,
-        },
-        labels: labels,
-        title: {
-            text: title,
-            align: titlePosition,
-            style: titleStyle,
-        },
-        colors: chartColor,
-    };
-    var series = data;
-    return (react_1.default.createElement("div", null,
-        react_1.default.createElement(react_apexcharts_1.default, { options: options, series: series, type: "pie", height: height, width: width })));
-}
-exports.default = ApexPieChart;

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

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

package/dist/Components/Apexcharts/ApexPieChart/ApexPieChart.stories.js

@@ -1,6 +0,0 @@
-"use strict";
-// import React from 'react';
-// import { StoryFn, Meta } from '@storybook/react';
-// import ApexPieChart from './ApexPieChart';
-// import { ApexPieChartProps } from './ApexPieChartProps';
-Object.defineProperty(exports, "__esModule", { value: true });