pixelize-design-library 2.4.1-beta.11 → 2.4.1-beta.13

package/dist/Layout.js

@@ -0,0 +1,286 @@
+"use strict";
+var __importDefault = (this && this.__importDefault) || function (mod) {
+    return (mod && mod.__esModule) ? mod : { "default": mod };
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+const jsx_runtime_1 = require("react/jsx-runtime");
+const react_1 = require("@chakra-ui/react");
+const react_2 = require("react");
+const accordion_1 = __importDefault(require("./Pages/accordion"));
+const searchSelect_1 = __importDefault(require("./Pages/searchSelect"));
+const search_1 = __importDefault(require("./Pages/search"));
+const timeline_1 = __importDefault(require("./Pages/timeline"));
+const datePick_1 = __importDefault(require("./Pages/datePick"));
+const multiSelect_1 = __importDefault(require("./Pages/multiSelect"));
+const drawer_1 = __importDefault(require("./Pages/drawer"));
+const verifyEmail_1 = __importDefault(require("./Pages/verifyEmail"));
+const editor_1 = __importDefault(require("./Pages/editor"));
+const dropdown_1 = __importDefault(require("./Pages/dropdown"));
+const noteArea_1 = __importDefault(require("./Pages/noteArea"));
+const switch_1 = __importDefault(require("./Pages/switch"));
+const photoViewer_1 = __importDefault(require("./Pages/photoViewer"));
+const chart_1 = __importDefault(require("./Pages/chart"));
+const tooltip_1 = __importDefault(require("./Pages/tooltip"));
+const card_1 = __importDefault(require("./Pages/card"));
+const pinInputs_1 = __importDefault(require("./Pages/pinInputs"));
+const numberInput_1 = __importDefault(require("./Pages/numberInput"));
+const progressbar_1 = __importDefault(require("./Pages/progressbar"));
+const button_1 = __importDefault(require("./Pages/button"));
+const radioButton_1 = __importDefault(require("./Pages/radioButton"));
+const skeleton_1 = __importDefault(require("./Pages/skeleton"));
+const textArea_1 = __importDefault(require("./Pages/textArea"));
+const select_1 = __importDefault(require("./Pages/select"));
+const modal_1 = __importDefault(require("./Pages/modal"));
+const checkbox_1 = __importDefault(require("./Pages/checkbox"));
+const toster_1 = __importDefault(require("./Pages/toster"));
+const input_1 = __importDefault(require("./Pages/input"));
+const alertdialog_1 = __importDefault(require("./Pages/alertdialog"));
+const productCaard_1 = __importDefault(require("./Pages/productCaard"));
+const table_1 = require("./Pages/table");
+const TInput_1 = __importDefault(require("./Pages/TInput"));
+const kanbanboard_1 = __importDefault(require("./Pages/kanbanboard"));
+const tag_1 = __importDefault(require("./Pages/tag"));
+const Header_1 = __importDefault(require("./Components/Header/Header"));
+const fileUpload_1 = require("./Pages/fileUpload");
+// import SelectSelect from "./Pages/selectSearch";
+const Slider_1 = __importDefault(require("./Components/Slider/Slider"));
+const contactForm_1 = __importDefault(require("./Pages/contactForm"));
+const productDetailCard_1 = __importDefault(require("./Pages/productDetailCard"));
+const notification_1 = __importDefault(require("./Pages/notification"));
+const FeedbackForm_1 = __importDefault(require("./Components/FeedbackForm/FeedbackForm"));
+const productFilter_1 = __importDefault(require("./Pages/productFilter"));
+const tier1_1 = __importDefault(require("./Pages/tier1"));
+const stageProgress_1 = __importDefault(require("./Pages/stageProgress"));
+const orgSwitcher_1 = __importDefault(require("./Pages/orgSwitcher"));
+const upgradeButton_1 = __importDefault(require("./Pages/upgradeButton"));
+const userDetails_1 = __importDefault(require("./Pages/userDetails"));
+const rolesPermission_1 = __importDefault(require("./Pages/rolesPermission"));
+const customModulesTable_1 = __importDefault(require("./Pages/customModulesTable"));
+const signInActivityTable_1 = __importDefault(require("./Pages/signInActivityTable"));
+const organizationDetails_1 = __importDefault(require("./Pages/organizationDetails"));
+// All component demo routes — sorted alphabetically by label for the nav grid.
+const componentLinks = [
+    { label: "Accordion", path: "/accordion" },
+    { label: "Alert Dialog", path: "/alertdialog" },
+    { label: "Button", path: "/button" },
+    { label: "Card", path: "/card" },
+    { label: "Charts", path: "/charts" },
+    { label: "Checkbox", path: "/checkbox" },
+    { label: "Contact Form", path: "/contactForm" },
+    { label: "Datepicker", path: "/datepicker" },
+    { label: "Drawer", path: "/drawer" },
+    { label: "Dropdown", path: "/dropdown" },
+    { label: "Editor", path: "/editor" },
+    { label: "Feedback Form", path: "/feedbackForm" },
+    { label: "File Upload", path: "/upload" },
+    { label: "Header", path: "/header" },
+    { label: "Input", path: "/InputPage" },
+    { label: "Kanban", path: "/kanban" },
+    { label: "Modal", path: "/modal" },
+    { label: "Multiselect", path: "/multiselect" },
+    { label: "Note Area", path: "/notearea" },
+    { label: "Notification", path: "/notification" },
+    { label: "Number Input", path: "/numberinput" },
+    { label: "Photo Viewer", path: "/photoViewer" },
+    { label: "Pin Input", path: "/pininput" },
+    { label: "Product Card", path: "/productCard" },
+    { label: "Product Detail Card", path: "/productDetails" },
+    { label: "Product Filter", path: "/productFilter" },
+    { label: "Progressbar", path: "/progressbar" },
+    { label: "Radio Button", path: "/radio" },
+    { label: "Search", path: "/search" },
+    { label: "Search Select", path: "/searchSelect" },
+    { label: "Select", path: "/select" },
+    { label: "Skeleton", path: "/skeleton" },
+    { label: "Slider", path: "/slider" },
+    { label: "Switch", path: "/switch" },
+    { label: "Table", path: "/table" },
+    { label: "Tag", path: "/tag" },
+    { label: "Tier 1 (New)", path: "/tier1" },
+    { label: "Stage Progress", path: "/stageProgress" },
+    { label: "Org Switcher", path: "/orgSwitcher" },
+    { label: "Upgrade Button", path: "/upgradeButton" },
+    { label: "User Details", path: "/userDetails" },
+    { label: "Roles & Permissions", path: "/rolesPermission" },
+    { label: "Custom Modules", path: "/customModulesTable" },
+    { label: "Sign-in Activity", path: "/signInActivityTable" },
+    { label: "Organization Details", path: "/organizationDetails" },
+    { label: "Text Area", path: "/textarea" },
+    { label: "Timeline", path: "/timeline" },
+    { label: "Toaster", path: "/toster" },
+    { label: "Tooltip", path: "/tooltip" },
+    { label: "Verify Email", path: "/verifyEmail" },
+].sort((a, b) => a.label.localeCompare(b.label));
+const Layout = () => {
+    const [currentPath, setCurrentPath] = (0, react_2.useState)(window.location.pathname);
+    const navigate = (path) => {
+        window.history.pushState({}, "", path);
+        setCurrentPath(path);
+    };
+    (0, react_2.useEffect)(() => {
+        const handlePopState = () => {
+            setCurrentPath(window.location.pathname);
+        };
+        window.addEventListener("popstate", handlePopState);
+        return () => {
+            window.removeEventListener("popstate", handlePopState);
+        };
+    }, []);
+    const renderPage = () => {
+        switch (currentPath) {
+            case "/alertdialog":
+                return (0, jsx_runtime_1.jsx)(alertdialog_1.default, {});
+            case "/accordion":
+                return (0, jsx_runtime_1.jsx)(accordion_1.default, {});
+            case "/searchSelect":
+                return (0, jsx_runtime_1.jsx)(searchSelect_1.default, {});
+            case "/timeline":
+                return (0, jsx_runtime_1.jsx)(timeline_1.default, {});
+            case "/search":
+                return (0, jsx_runtime_1.jsx)(search_1.default, {});
+            case "/datepicker":
+                return (0, jsx_runtime_1.jsx)(datePick_1.default, {});
+            case "/multiselect":
+                return (0, jsx_runtime_1.jsx)(multiSelect_1.default, {});
+            case "/drawer":
+                return (0, jsx_runtime_1.jsx)(drawer_1.default, {});
+            case "/verifyEmail":
+                return (0, jsx_runtime_1.jsx)(verifyEmail_1.default, {});
+            case "/editor":
+                return (0, jsx_runtime_1.jsx)(editor_1.default, {});
+            case "/dropdown":
+                return (0, jsx_runtime_1.jsx)(dropdown_1.default, {});
+            case "/notearea":
+                return (0, jsx_runtime_1.jsx)(noteArea_1.default, {});
+            case "/notification":
+                return (0, jsx_runtime_1.jsx)(notification_1.default, {});
+            case "/switch":
+                return (0, jsx_runtime_1.jsx)(switch_1.default, {});
+            case "/photoViewer":
+                return (0, jsx_runtime_1.jsx)(photoViewer_1.default, {});
+            case "/charts":
+                return (0, jsx_runtime_1.jsx)(chart_1.default, {});
+            case "/tooltip":
+                return (0, jsx_runtime_1.jsx)(tooltip_1.default, {});
+            case "/card":
+                return (0, jsx_runtime_1.jsx)(card_1.default, {});
+            case "/pininput":
+                return (0, jsx_runtime_1.jsx)(pinInputs_1.default, {});
+            case "/numberinput":
+                return (0, jsx_runtime_1.jsx)(numberInput_1.default, {});
+            case "/progressbar":
+                return (0, jsx_runtime_1.jsx)(progressbar_1.default, {});
+            case "/button":
+                return (0, jsx_runtime_1.jsx)(button_1.default, {});
+            case "/radio":
+                return (0, jsx_runtime_1.jsx)(radioButton_1.default, {});
+            case "/skeleton":
+                return (0, jsx_runtime_1.jsx)(skeleton_1.default, {});
+            case "/textarea":
+                return (0, jsx_runtime_1.jsx)(textArea_1.default, {});
+            case "/select":
+                return (0, jsx_runtime_1.jsx)(select_1.default, {});
+            case "/modal":
+                return (0, jsx_runtime_1.jsx)(modal_1.default, {});
+            case "/checkbox":
+                return (0, jsx_runtime_1.jsx)(checkbox_1.default, {});
+            case "/toster":
+                return (0, jsx_runtime_1.jsx)(toster_1.default, {});
+            case "/InputPage":
+                return (0, jsx_runtime_1.jsx)(input_1.default, {});
+            case "/table":
+                return (0, jsx_runtime_1.jsx)(table_1.TableExample, {});
+            case "/tinput":
+                return (0, jsx_runtime_1.jsx)(TInput_1.default, {});
+            case "/kanban":
+                return (0, jsx_runtime_1.jsx)(kanbanboard_1.default, {});
+            case "/contactForm":
+                return (0, jsx_runtime_1.jsx)(contactForm_1.default, {});
+            case "/header":
+                return ((0, jsx_runtime_1.jsx)(Header_1.default, { logo: (0, jsx_runtime_1.jsx)(react_1.Box, { fontSize: "xl", fontWeight: "bold", children: "MyApp" }), 
+                    // colorScheme="gray"
+                    active: "/", menuItems: [
+                        { label: "Home", href: "/" },
+                        {
+                            label: "Products",
+                            // badge: {
+                            //   label: "new",
+                            //   colorScheme: "red",
+                            // },
+                            children: [
+                                {
+                                    label: "AI Tools",
+                                    href: "/products/ai",
+                                    badge: {
+                                        label: "new",
+                                        colorScheme: "blackAlpha",
+                                    },
+                                },
+                                {
+                                    label: "APIs",
+                                    href: "/products/apis",
+                                    badge: { label: "coming soon", colorScheme: "green" },
+                                },
+                            ],
+                        },
+                        {
+                            label: "Docs",
+                            href: "/docs",
+                            badge: { label: "updated", colorScheme: "yellow" },
+                        },
+                    ], rightSlot: (0, jsx_runtime_1.jsxs)(jsx_runtime_1.Fragment, { children: [(0, jsx_runtime_1.jsx)(react_1.Button, { variant: "ghost", colorScheme: "purple", children: "Login" }), (0, jsx_runtime_1.jsx)(react_1.Button, { colorScheme: "purple", children: "Sign Up" })] }) }));
+            case "/upload":
+                return (0, jsx_runtime_1.jsx)(fileUpload_1.FileUploader, {});
+            case "/slider":
+                return ((0, jsx_runtime_1.jsx)(Slider_1.default, { images: [
+                        {
+                            "id": 5,
+                            "previewUrl": "https://res.cloudinary.com/dcpnzaqtu/image/upload/v1766229935/main_sweets/1766229934288-Winter_Delghts.webp",
+                            "order": 1
+                        },
+                        {
+                            "id": 6,
+                            "previewUrl": "https://res.cloudinary.com/dcpnzaqtu/image/upload/v1766229935/main_sweets/1766229935008-Shree_M_-_Desktop_Banner_1.jpg",
+                            "order": 2
+                        },
+                        {
+                            "id": 7,
+                            "previewUrl": "https://res.cloudinary.com/dcpnzaqtu/image/upload/v1766649309/main_sweets/1766649308634-muthukavitha_laddu_banner_unde.jpg",
+                            "order": 3
+                        }
+                    ] }));
+            case "/productCard":
+                return (0, jsx_runtime_1.jsx)(productCaard_1.default, {});
+            case "/productDetails":
+                return (0, jsx_runtime_1.jsx)(productDetailCard_1.default, {});
+            case "/productFilter":
+                return (0, jsx_runtime_1.jsx)(productFilter_1.default, {});
+            case "/tier1":
+                return (0, jsx_runtime_1.jsx)(tier1_1.default, {});
+            case "/stageProgress":
+                return (0, jsx_runtime_1.jsx)(stageProgress_1.default, {});
+            case "/orgSwitcher":
+                return (0, jsx_runtime_1.jsx)(orgSwitcher_1.default, {});
+            case "/upgradeButton":
+                return (0, jsx_runtime_1.jsx)(upgradeButton_1.default, {});
+            case "/userDetails":
+                return (0, jsx_runtime_1.jsx)(userDetails_1.default, {});
+            case "/rolesPermission":
+                return (0, jsx_runtime_1.jsx)(rolesPermission_1.default, {});
+            case "/customModulesTable":
+                return (0, jsx_runtime_1.jsx)(customModulesTable_1.default, {});
+            case "/signInActivityTable":
+                return (0, jsx_runtime_1.jsx)(signInActivityTable_1.default, {});
+            case "/organizationDetails":
+                return (0, jsx_runtime_1.jsx)(organizationDetails_1.default, {});
+            case "/feedbackForm":
+                return (0, jsx_runtime_1.jsx)(FeedbackForm_1.default, {});
+            case "/tag":
+                return (0, jsx_runtime_1.jsx)(tag_1.default, {});
+            case "/":
+            default:
+        }
+    };
+    return ((0, jsx_runtime_1.jsxs)("div", { children: [(0, jsx_runtime_1.jsxs)(react_1.Box, { as: "nav", mb: 8, children: [(0, jsx_runtime_1.jsxs)(react_1.Text, { fontSize: "sm", fontWeight: 600, color: "gray.500", mb: 3, children: ["Components (", componentLinks.length, ")"] }), (0, jsx_runtime_1.jsxs)(react_1.SimpleGrid, { minChildWidth: "8rem", spacing: 2, children: [(0, jsx_runtime_1.jsx)(react_1.Button, { onClick: () => navigate("/"), variant: currentPath === "/" ? "solid" : "outline", size: "xs", w: "100%", children: "Home" }), componentLinks.map((link) => ((0, jsx_runtime_1.jsx)(react_1.Button, { onClick: () => navigate(link.path), variant: currentPath === link.path ? "solid" : "outline", size: "xs", w: "100%", children: link.label }, link.path)))] })] }), renderPage()] }));
+};
+exports.default = Layout;

package/dist/Pages/TInput.d.ts

@@ -0,0 +1,3 @@
+declare const TInput: () => import("react/jsx-runtime").JSX.Element;
+export default TInput;
+//# sourceMappingURL=TInput.d.ts.map

package/dist/Pages/TInput.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"TInput.d.ts","sourceRoot":"","sources":["../../src/Pages/TInput.tsx"],"names":[],"mappings":"AAKA,QAAA,MAAM,MAAM,+CAiCX,CAAA;AAED,eAAe,MAAM,CAAA"}

package/dist/Pages/TInput.js

@@ -0,0 +1,20 @@
+"use strict";
+var __importDefault = (this && this.__importDefault) || function (mod) {
+    return (mod && mod.__esModule) ? mod : { "default": mod };
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+const jsx_runtime_1 = require("react/jsx-runtime");
+const react_1 = require("react");
+const Input_1 = __importDefault(require("../Components/Input/Input/Input"));
+const Buttons_1 = __importDefault(require("../Components/Buttons/Buttons"));
+const PinInputs_1 = __importDefault(require("../Components/PinInputs/PinInputs"));
+const TInput = () => {
+    const [email, setEmail] = (0, react_1.useState)("");
+    const [password, setPassword] = (0, react_1.useState)("");
+    const [errors] = (0, react_1.useState)({
+        email: "ddd",
+        password: "",
+    });
+    return ((0, jsx_runtime_1.jsxs)("div", { children: [(0, jsx_runtime_1.jsx)(Input_1.default, { label: "Email Address", type: "email", value: email, onChange: setEmail, error: errors.email, placeholder: "Email Address", inputBoxClassName: "w-1/6" }), (0, jsx_runtime_1.jsx)(Input_1.default, { label: "Password", type: "password", value: password, onChange: setPassword, error: errors.password, placeholder: "Password", inputBoxClassName: "w-1/6" }), (0, jsx_runtime_1.jsx)(PinInputs_1.default, { length: 6, error: "", onComplete: (value) => { console.log(value, "value"); } }), (0, jsx_runtime_1.jsx)(Buttons_1.default, { label: "Sign In", onClick: () => { } })] }));
+};
+exports.default = TInput;

package/dist/Pages/accordion.d.ts

@@ -0,0 +1,3 @@
+declare const Accordions: () => import("react/jsx-runtime").JSX.Element;
+export default Accordions;
+//# sourceMappingURL=accordion.d.ts.map

package/dist/Pages/accordion.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"accordion.d.ts","sourceRoot":"","sources":["../../src/Pages/accordion.tsx"],"names":[],"mappings":"AAGA,QAAA,MAAM,UAAU,+CAsCf,CAAA;AAED,eAAe,UAAU,CAAA"}

package/dist/Pages/accordion.js

@@ -0,0 +1,21 @@
+"use strict";
+var __importDefault = (this && this.__importDefault) || function (mod) {
+    return (mod && mod.__esModule) ? mod : { "default": mod };
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+const jsx_runtime_1 = require("react/jsx-runtime");
+const Accordion_1 = __importDefault(require("../Components/Accordion/Accordion"));
+const react_1 = require("@chakra-ui/react");
+const Accordions = () => {
+    return ((0, jsx_runtime_1.jsx)(react_1.Box, { maxW: "40rem", mx: "auto", py: 6, px: 4, children: (0, jsx_runtime_1.jsx)(Accordion_1.default, { allowToggle: true, items: [
+                {
+                    header: "Section 1 title",
+                    content: ((0, jsx_runtime_1.jsxs)("div", { children: [(0, jsx_runtime_1.jsx)(react_1.Text, { children: "This is text inside Section 1." }), (0, jsx_runtime_1.jsx)(react_1.Box, { bg: "gray.100", borderRadius: "md", p: 4, mt: 2, children: "This is a box with more content inside Section 1." }), (0, jsx_runtime_1.jsxs)(react_1.Flex, { mt: 2, gap: 2, children: [(0, jsx_runtime_1.jsx)(react_1.Box, { flex: "1", bg: "blue.100", borderRadius: "md", p: 4, children: "Box 1" }), (0, jsx_runtime_1.jsx)(react_1.Box, { flex: "1", bg: "green.100", borderRadius: "md", p: 4, children: "Box 2" })] })] })),
+                },
+                {
+                    header: "Section 2 title",
+                    content: ((0, jsx_runtime_1.jsx)(react_1.Text, { children: "This is text inside Section 2. The chevron rotates and the header tints when the section is expanded." })),
+                },
+            ] }) }));
+};
+exports.default = Accordions;

package/dist/Pages/alertdialog.d.ts

@@ -0,0 +1,3 @@
+declare const AlertdialogBox: () => import("react/jsx-runtime").JSX.Element;
+export default AlertdialogBox;
+//# sourceMappingURL=alertdialog.d.ts.map

package/dist/Pages/alertdialog.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"alertdialog.d.ts","sourceRoot":"","sources":["../../src/Pages/alertdialog.tsx"],"names":[],"mappings":"AAIA,QAAA,MAAM,cAAc,+CA0BnB,CAAC;AAEF,eAAe,cAAc,CAAC"}

package/dist/Pages/alertdialog.js

@@ -0,0 +1,53 @@
+"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 () {
+    var ownKeys = function(o) {
+        ownKeys = Object.getOwnPropertyNames || function (o) {
+            var ar = [];
+            for (var k in o) if (Object.prototype.hasOwnProperty.call(o, k)) ar[ar.length] = k;
+            return ar;
+        };
+        return ownKeys(o);
+    };
+    return function (mod) {
+        if (mod && mod.__esModule) return mod;
+        var result = {};
+        if (mod != null) for (var k = ownKeys(mod), i = 0; i < k.length; i++) if (k[i] !== "default") __createBinding(result, mod, k[i]);
+        __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 });
+const jsx_runtime_1 = require("react/jsx-runtime");
+const react_1 = __importStar(require("react"));
+const AlertDialog_1 = __importDefault(require("../Components/AlertDialog/AlertDialog"));
+const react_2 = require("@chakra-ui/react");
+const AlertdialogBox = () => {
+    const [alertActive, setAlertActive] = (0, react_1.useState)(false);
+    const leastDestructiveRef = react_1.default.useRef();
+    const handleAlert = () => {
+        setAlertActive(!alertActive);
+    };
+    return ((0, jsx_runtime_1.jsxs)("div", { children: [(0, jsx_runtime_1.jsx)(react_2.Button, { onClick: () => {
+                    setAlertActive(true);
+                }, children: "AlertDialog" }), (0, jsx_runtime_1.jsx)(AlertDialog_1.default, { isOpen: alertActive, onClose: handleAlert, leastDestructiveRef: leastDestructiveRef, title: "hello", content: (0, jsx_runtime_1.jsx)("div", { style: { color: "red", height: "200px" }, children: "hellobody" }), onConfirm: () => handleAlert(), size: "500" })] }));
+};
+exports.default = AlertdialogBox;

package/dist/Pages/button.d.ts

@@ -0,0 +1,3 @@
+declare const ButtonPage: () => import("react/jsx-runtime").JSX.Element;
+export default ButtonPage;
+//# sourceMappingURL=button.d.ts.map

package/dist/Pages/button.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"button.d.ts","sourceRoot":"","sources":["../../src/Pages/button.tsx"],"names":[],"mappings":"AAIA,QAAA,MAAM,UAAU,+CA+Cf,CAAC;AAEF,eAAe,UAAU,CAAC"}

package/dist/Pages/button.js

@@ -0,0 +1,32 @@
+"use strict";
+var __importDefault = (this && this.__importDefault) || function (mod) {
+    return (mod && mod.__esModule) ? mod : { "default": mod };
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+const jsx_runtime_1 = require("react/jsx-runtime");
+const ButtonGroupIcon_1 = __importDefault(require("../Components/ButtonGroupIcon/ButtonGroupIcon"));
+const Button_1 = __importDefault(require("../Components/Button/Button"));
+const lucide_react_1 = require("lucide-react");
+const ButtonPage = () => {
+    return ((0, jsx_runtime_1.jsxs)("div", { children: [(0, jsx_runtime_1.jsx)(ButtonGroupIcon_1.default
+            // isLoading={true}
+            // leftIconLoading={true}
+            // RightIconLoading={true}
+            , { 
+                // isLoading={true}
+                // leftIconLoading={true}
+                // RightIconLoading={true}
+                buttonText: "ellipsis ellipsis ellipsis", rightIcon: (0, jsx_runtime_1.jsx)(lucide_react_1.House, {}), leftIcon: (0, jsx_runtime_1.jsx)(lucide_react_1.House, {}), size: "md", 
+                // variant="gradient"
+                color: "primary", rightIconDropdown: true, dropdownOptions: [
+                    {
+                        label: "123",
+                        id: "1",
+                        image: (0, jsx_runtime_1.jsx)(lucide_react_1.House, {}),
+                    },
+                    { label: "456", id: "2" },
+                ], onDropdownOptionClick: (e, option) => {
+                    console.log(e, option);
+                } }), (0, jsx_runtime_1.jsx)("br", {}), (0, jsx_runtime_1.jsx)("br", {}), (0, jsx_runtime_1.jsx)("br", {}), (0, jsx_runtime_1.jsx)(Button_1.default, { label: "Button", onClick: () => { }, variant: "solid", size: "xs" }), (0, jsx_runtime_1.jsx)("br", {}), (0, jsx_runtime_1.jsx)("br", {}), (0, jsx_runtime_1.jsxs)("div", { style: { display: "flex", gap: "1rem", alignItems: "center", flexWrap: "wrap" }, children: [(0, jsx_runtime_1.jsx)(Button_1.default, { label: "Gradient", onClick: () => { }, variant: "gradient", size: "md" }), (0, jsx_runtime_1.jsx)(Button_1.default, { label: "Gradient XL", onClick: () => { }, variant: "gradient", size: "xl", leftIcon: (0, jsx_runtime_1.jsx)(lucide_react_1.House, {}) }), (0, jsx_runtime_1.jsx)(Button_1.default, { label: "Loading", onClick: () => { }, variant: "gradient", isLoading: true }), (0, jsx_runtime_1.jsx)(Button_1.default, { label: "Disabled", onClick: () => { }, variant: "gradient", isDisabled: true }), (0, jsx_runtime_1.jsx)(Button_1.default, { label: "Ghost", onClick: () => { }, variant: "ghost" }), (0, jsx_runtime_1.jsx)(Button_1.default, { label: "Outline XL", onClick: () => { }, variant: "outline", size: "xl" })] })] }));
+};
+exports.default = ButtonPage;

package/dist/Pages/card.d.ts

@@ -0,0 +1,3 @@
+declare const CardPage: () => import("react/jsx-runtime").JSX.Element;
+export default CardPage;
+//# sourceMappingURL=card.d.ts.map

package/dist/Pages/card.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"card.d.ts","sourceRoot":"","sources":["../../src/Pages/card.tsx"],"names":[],"mappings":"AAwDA,QAAA,MAAM,QAAQ,+CA0Db,CAAC;AAEF,eAAe,QAAQ,CAAC"}

package/dist/Pages/card.js

@@ -0,0 +1,102 @@
+"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 () {
+    var ownKeys = function(o) {
+        ownKeys = Object.getOwnPropertyNames || function (o) {
+            var ar = [];
+            for (var k in o) if (Object.prototype.hasOwnProperty.call(o, k)) ar[ar.length] = k;
+            return ar;
+        };
+        return ownKeys(o);
+    };
+    return function (mod) {
+        if (mod && mod.__esModule) return mod;
+        var result = {};
+        if (mod != null) for (var k = ownKeys(mod), i = 0; i < k.length; i++) if (k[i] !== "default") __createBinding(result, mod, k[i]);
+        __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 });
+const jsx_runtime_1 = require("react/jsx-runtime");
+const Card_1 = __importDefault(require("../Components/Card/Card"));
+const ProfileCard_1 = __importStar(require("../Components/ProfileCard/ProfileCard"));
+const react_1 = require("@chakra-ui/react");
+const Button_1 = __importDefault(require("../Components/Button/Button"));
+const lucide_react_1 = require("lucide-react");
+const PaymentCard_1 = __importDefault(require("../Components/Card/PaymentCard/PaymentCard"));
+const plans = [
+    {
+        plan_id: 1,
+        name: "Free",
+        description: "Basic features for small teams",
+        monthlyPrice: 0,
+        yearlyPrice: 0,
+        billing: "per month",
+        tax: "+ GST",
+        features: ["User Management (1 User)", "Single Pipeline", "500 Records", "Contacts, Products & Activities Management", "Automations (3)"],
+        icon: (0, jsx_runtime_1.jsx)(lucide_react_1.Star, { size: 20 }),
+        buttonText: "Choose Starter",
+        buttonVariant: "solid",
+        priceDescription: "Ideal for individuals and small teams starting out.",
+    },
+    {
+        plan_id: 2,
+        name: "Pro",
+        description: "Perfect for small teams and growing businesses.",
+        monthlyPrice: 499,
+        yearlyPrice: 399,
+        billing: "per month",
+        tax: "+ GST",
+        features: ["User Management (5 User)", "Everything in Free Edition +", "Team Pipelines (3)", "50,000 Records", "Email & WhatsApp Business Integration", "Automations (30)", "Mass emails with email insights", "10 custom fields/module"],
+        icon: (0, jsx_runtime_1.jsx)(lucide_react_1.Zap, { size: 20 }),
+        buttonText: "Choose Pro",
+        buttonVariant: "outline",
+        popular: true,
+        priceDescription: "Ideal for individuals and small teams starting out.",
+    },
+    // {
+    //   plan_id: 3,
+    //   name: "Enterprise",
+    //   description: "Unlimited access for large organizations",
+    //   monthlyPrice: 1499,
+    //   yearlyPrice: 1399,
+    //   billing: "per month",
+    //   tax: "+ GST",
+    //   features: ["User Management (Unlimited Users)", "Everything in Premier Edition +", "Team Pipelines (15)","1 Million Records","Advanced Automation Rules (100)","File Cabinet pre-installed with 5 GB storage","50 custom fields/module","1000 mass mails/day","Highest limits for features"],
+    //   icon: <Gem size={20} />,
+    //   buttonText: "Contact Sales",
+    //   buttonVariant: "solid" as const,
+    // },
+];
+const CardPage = () => {
+    const activePlanId = 1; // Example: current active plan
+    const nextUpgradeId = 2; // Example: suggest upgrade
+    const handleSelect = (planId) => {
+        console.log("Selected plan:", planId);
+    };
+    const handleHover = (planId, type, state) => {
+        console.log(`${type} hover ${state ? "enter" : "leave"} on plan`, planId);
+    };
+    // console.log(activePlanId,"activePlanId",nextUpgradeId,"nextUpgradeId");
+    return ((0, jsx_runtime_1.jsxs)("div", { children: [(0, jsx_runtime_1.jsx)(Card_1.default, { children: (0, jsx_runtime_1.jsx)("div", { children: "hello" }) }), (0, jsx_runtime_1.jsx)("br", {}), (0, jsx_runtime_1.jsx)("br", {}), (0, jsx_runtime_1.jsx)("br", {}), (0, jsx_runtime_1.jsx)("br", {}), (0, jsx_runtime_1.jsxs)(ProfileCard_1.default, { children: [(0, jsx_runtime_1.jsx)(ProfileCard_1.ProfileCardHeader, { children: "Customer dashboard" }), (0, jsx_runtime_1.jsx)(ProfileCard_1.ProfileCardBody, { children: (0, jsx_runtime_1.jsx)(react_1.Text, { children: "View a summary of all your customers over the last month." }) }), (0, jsx_runtime_1.jsx)(ProfileCard_1.ProfileCardFooter, { children: (0, jsx_runtime_1.jsx)(Button_1.default, { colorScheme: "primary", children: "View here" }) })] }), (0, jsx_runtime_1.jsx)("br", {}), (0, jsx_runtime_1.jsx)("br", {}), (0, jsx_runtime_1.jsx)("br", {}), (0, jsx_runtime_1.jsx)(react_1.SimpleGrid, { columns: { base: 1, md: 2 }, spacing: 6, children: plans.map((plan) => ((0, jsx_runtime_1.jsx)(PaymentCard_1.default, { plan: plan, billingCycle: "monthly", isActive: plan.plan_id === activePlanId, isNextUpgrade: plan.plan_id === nextUpgradeId, onSelect: handleSelect, onHover: handleHover, buttonLoading: 2 }, plan.plan_id))) })] }));
+};
+exports.default = CardPage;

package/dist/Pages/chart.d.ts

@@ -0,0 +1,4 @@
+/** Demo page: charts use theme-derived defaults unless a prop overrides styling. */
+declare const ChartPage: () => import("react/jsx-runtime").JSX.Element;
+export default ChartPage;
+//# sourceMappingURL=chart.d.ts.map

package/dist/Pages/chart.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"chart.d.ts","sourceRoot":"","sources":["../../src/Pages/chart.tsx"],"names":[],"mappings":"AAKA,oFAAoF;AACpF,QAAA,MAAM,SAAS,+CAgHd,CAAC;AAEF,eAAe,SAAS,CAAC"}

package/dist/Pages/chart.js

@@ -0,0 +1,25 @@
+"use strict";
+var __importDefault = (this && this.__importDefault) || function (mod) {
+    return (mod && mod.__esModule) ? mod : { "default": mod };
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+const jsx_runtime_1 = require("react/jsx-runtime");
+const ApexBarChart_1 = __importDefault(require("../Components/Apexcharts/ApexBarChart/ApexBarChart"));
+const ApexPieChart_1 = __importDefault(require("../Components/Apexcharts/ApexPieChart/ApexPieChart"));
+const ApexLineChart_1 = __importDefault(require("../Components/Apexcharts/ApexLineChart/ApexLineChart"));
+const ApexPolarCharts_1 = __importDefault(require("../Components/Apexcharts/ApexPolarCharts/ApexPolarCharts"));
+/** Demo page: charts use theme-derived defaults unless a prop overrides styling. */
+const ChartPage = () => {
+    const data = Array.from({ length: 10 }, () => Math.floor(Math.random() * 100));
+    const categories = data.map((_, index) => `Category ${index + 1}`);
+    const data1 = Array.from({ length: 10 }, () => Math.floor(Math.random() * 100));
+    const categories1 = data.map((_, index) => `Category ${index + 1}`);
+    return ((0, jsx_runtime_1.jsxs)("div", { children: [(0, jsx_runtime_1.jsx)(ApexBarChart_1.default, { data: data, labels: categories, title: "Bar Chart", titlePosition: "left" }), (0, jsx_runtime_1.jsx)(ApexPieChart_1.default, { data: data1, labels: categories1, title: "Pie Chart", titlePosition: "left", variant: "pie" }), (0, jsx_runtime_1.jsx)(ApexPieChart_1.default, { data: data1, labels: categories1, title: "donut Chart", titlePosition: "left", variant: "donut", legendPosition: "bottom", legendStyle: {
+                    horizontalGap: 5,
+                    verticalGap: 3,
+                    markerSize: 10,
+                    markerOffsetX: -5,
+                    markerOffsetY: 0,
+                } }), (0, jsx_runtime_1.jsx)(ApexPieChart_1.default, { data: data1, labels: categories1, title: "update-donut", variant: "update-donut" }), (0, jsx_runtime_1.jsx)(ApexPieChart_1.default, { data: data1, labels: categories1, title: "Monochrome Pie", variant: "monochrome-pie" }), (0, jsx_runtime_1.jsx)(ApexPieChart_1.default, { data: data1, labels: categories1, title: "Gradient Donut", variant: "gradient-donut" }), (0, jsx_runtime_1.jsx)(ApexPieChart_1.default, { data: data1, labels: categories1, title: "Semi Donut", variant: "semi-donut", titlePosition: "left" }), (0, jsx_runtime_1.jsx)(ApexPieChart_1.default, { data: data1, labels: categories1, title: "donut-with-pattern", variant: "donut-with-pattern", titlePosition: "left" }), (0, jsx_runtime_1.jsx)(ApexPieChart_1.default, { data: data1, labels: categories1, title: "pie-with-image", variant: "pie-with-image", titlePosition: "left", width: 300 }), (0, jsx_runtime_1.jsx)(ApexLineChart_1.default, { variant: "basic", data: [10, 20, 30, 40, 50], labels: ["Jan", "Feb", "Mar", "Apr", "May"], series: ["basic 1", "basic 2", "basic 3", "basic 4", "basic 5"], title: "Basic Line Chart ghghjhgjkgkj kjhkjhkjhkjhkj", width: "25%" }), (0, jsx_runtime_1.jsx)(ApexLineChart_1.default, { variant: "realtime", data: [15, 25, 35], title: "Realtime Line Chart", height: 300, width: 600 }), (0, jsx_runtime_1.jsx)(ApexPolarCharts_1.default, { data: [21, 23, 19, 14, 6], labels: ["Apple", "Mango", "Orange", "Watermelon", "Banana"], variant: "basic" }), (0, jsx_runtime_1.jsx)(ApexPolarCharts_1.default, { data: [21, 23, 19, 14, 6], labels: ["Apple", "Mango", "Orange", "Watermelon", "Banana"], variant: "monochrome" })] }));
+};
+exports.default = ChartPage;

package/dist/Pages/checkbox.d.ts

@@ -0,0 +1,3 @@
+declare const CheckboxPage: () => import("react/jsx-runtime").JSX.Element;
+export default CheckboxPage;
+//# sourceMappingURL=checkbox.d.ts.map

package/dist/Pages/checkbox.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"checkbox.d.ts","sourceRoot":"","sources":["../../src/Pages/checkbox.tsx"],"names":[],"mappings":"AAEA,QAAA,MAAM,YAAY,+CAMjB,CAAC;AAEF,eAAe,YAAY,CAAC"}

package/dist/Pages/checkbox.js

@@ -0,0 +1,11 @@
+"use strict";
+var __importDefault = (this && this.__importDefault) || function (mod) {
+    return (mod && mod.__esModule) ? mod : { "default": mod };
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+const jsx_runtime_1 = require("react/jsx-runtime");
+const Checkbox_1 = __importDefault(require("../Components/Checkbox/Checkbox"));
+const CheckboxPage = () => {
+    return ((0, jsx_runtime_1.jsx)("div", { children: (0, jsx_runtime_1.jsx)(Checkbox_1.default, { label: "hello world", error: true, errorMessage: "dd" }) }));
+};
+exports.default = CheckboxPage;

package/dist/Pages/contactForm.d.ts

@@ -0,0 +1,3 @@
+declare const contactForm: () => import("react/jsx-runtime").JSX.Element;
+export default contactForm;
+//# sourceMappingURL=contactForm.d.ts.map