pixelize-design-library 2.2.197 → 2.3.1-beta.1

package/dist/Pages/button.js

@@ -0,0 +1,46 @@
+"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 ButtonGroupIcon_1 = __importDefault(require("../Components/ButtonGroupIcon/ButtonGroupIcon"));
+var Button_1 = __importDefault(require("../Components/Button/Button"));
+var lucide_react_1 = require("lucide-react");
+var ButtonPage = function () {
+    return (react_1.default.createElement("div", null,
+        react_1.default.createElement(ButtonGroupIcon_1.default
+        // isLoading={true}
+        // leftIconLoading={true}
+        // RightIconLoading={true}
+        , { 
+            // isLoading={true}
+            // leftIconLoading={true}
+            // RightIconLoading={true}
+            buttonText: "ellipsis ellipsis ellipsis", rightIcon: react_1.default.createElement(lucide_react_1.House, null), leftIcon: react_1.default.createElement(lucide_react_1.House, null), size: "md", 
+            // variant="gradient"
+            color: "primary", rightIconDropdown: true, dropdownOptions: [
+                {
+                    label: "123",
+                    id: "1",
+                    image: react_1.default.createElement(lucide_react_1.House, null),
+                },
+                { label: "456", id: "2" },
+            ], onDropdownOptionClick: function (e, option) {
+                console.log(e, option);
+            } }),
+        react_1.default.createElement("br", null),
+        react_1.default.createElement("br", null),
+        react_1.default.createElement("br", null),
+        react_1.default.createElement(Button_1.default, { label: "Button", onClick: function () { }, variant: "solid", size: "xs" }),
+        react_1.default.createElement("br", null),
+        react_1.default.createElement("br", null),
+        react_1.default.createElement("div", { style: { display: "flex", gap: "1rem", alignItems: "center", flexWrap: "wrap" } },
+            react_1.default.createElement(Button_1.default, { label: "Gradient", onClick: function () { }, variant: "gradient", size: "md" }),
+            react_1.default.createElement(Button_1.default, { label: "Gradient XL", onClick: function () { }, variant: "gradient", size: "xl", leftIcon: react_1.default.createElement(lucide_react_1.House, null) }),
+            react_1.default.createElement(Button_1.default, { label: "Loading", onClick: function () { }, variant: "gradient", isLoading: true }),
+            react_1.default.createElement(Button_1.default, { label: "Disabled", onClick: function () { }, variant: "gradient", isDisabled: true }),
+            react_1.default.createElement(Button_1.default, { label: "Ghost", onClick: function () { }, variant: "ghost" }),
+            react_1.default.createElement(Button_1.default, { label: "Outline XL", onClick: function () { }, variant: "outline", size: "xl" }))));
+};
+exports.default = ButtonPage;

package/dist/Pages/card.d.ts

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

package/dist/Pages/card.js

@@ -0,0 +1,117 @@
+"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 });
+var react_1 = __importDefault(require("react"));
+var Card_1 = __importDefault(require("../Components/Card/Card"));
+var ProfileCard_1 = __importStar(require("../Components/ProfileCard/ProfileCard"));
+var react_2 = require("@chakra-ui/react");
+var lucide_react_1 = require("lucide-react");
+var PaymentCard_1 = __importDefault(require("../Components/Card/PaymentCard/PaymentCard"));
+var 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: react_1.default.createElement(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: react_1.default.createElement(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,
+    // },
+];
+var CardPage = function () {
+    var activePlanId = 1; // Example: current active plan
+    var nextUpgradeId = 2; // Example: suggest upgrade
+    var handleSelect = function (planId) {
+        console.log("Selected plan:", planId);
+    };
+    var handleHover = function (planId, type, state) {
+        console.log("".concat(type, " hover ").concat(state ? "enter" : "leave", " on plan"), planId);
+    };
+    // console.log(activePlanId,"activePlanId",nextUpgradeId,"nextUpgradeId");
+    return (react_1.default.createElement("div", null,
+        react_1.default.createElement(Card_1.default, null,
+            react_1.default.createElement("div", null, "hello")),
+        react_1.default.createElement("br", null),
+        react_1.default.createElement("br", null),
+        react_1.default.createElement("br", null),
+        react_1.default.createElement("br", null),
+        react_1.default.createElement(ProfileCard_1.default, null,
+            react_1.default.createElement(ProfileCard_1.ProfileCardHeader, null, "Customer dashboard"),
+            react_1.default.createElement(ProfileCard_1.ProfileCardBody, null,
+                react_1.default.createElement(react_2.Text, null, "View a summary of all your customers over the last month.")),
+            react_1.default.createElement(ProfileCard_1.ProfileCardFooter, null,
+                react_1.default.createElement(react_2.Button, { color: "blue" }, "View here"))),
+        react_1.default.createElement("br", null),
+        react_1.default.createElement("br", null),
+        react_1.default.createElement("br", null),
+        react_1.default.createElement(react_2.SimpleGrid, { columns: { base: 1, md: 2 }, spacing: 6 }, plans.map(function (plan) { return (react_1.default.createElement(PaymentCard_1.default, { key: plan.plan_id, plan: plan, billingCycle: "monthly", isActive: plan.plan_id === activePlanId, isNextUpgrade: plan.plan_id === nextUpgradeId, onSelect: handleSelect, onHover: handleHover, buttonLoading: 2 })); }))));
+};
+exports.default = CardPage;

package/dist/Pages/chart.d.ts

@@ -0,0 +1,4 @@
+import React from "react";
+/** Demo page: charts use theme-derived defaults unless a prop overrides styling. */
+declare const ChartPage: () => React.JSX.Element;
+export default ChartPage;

package/dist/Pages/chart.js

@@ -0,0 +1,40 @@
+"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 ApexBarChart_1 = __importDefault(require("../Components/Apexcharts/ApexBarChart/ApexBarChart"));
+var ApexPieChart_1 = __importDefault(require("../Components/Apexcharts/ApexPieChart/ApexPieChart"));
+var ApexLineChart_1 = __importDefault(require("../Components/Apexcharts/ApexLineChart/ApexLineChart"));
+var ApexPolarCharts_1 = __importDefault(require("../Components/Apexcharts/ApexPolarCharts/ApexPolarCharts"));
+/** Demo page: charts use theme-derived defaults unless a prop overrides styling. */
+var ChartPage = function () {
+    var data = Array.from({ length: 10 }, function () { return Math.floor(Math.random() * 100); });
+    var categories = data.map(function (_, index) { return "Category ".concat(index + 1); });
+    var data1 = Array.from({ length: 10 }, function () {
+        return Math.floor(Math.random() * 100);
+    });
+    var categories1 = data.map(function (_, index) { return "Category ".concat(index + 1); });
+    return (react_1.default.createElement("div", null,
+        react_1.default.createElement(ApexBarChart_1.default, { data: data, labels: categories, title: "Bar Chart", titlePosition: "left" }),
+        react_1.default.createElement(ApexPieChart_1.default, { data: data1, labels: categories1, title: "Pie Chart", titlePosition: "left", variant: "pie" }),
+        react_1.default.createElement(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,
+            } }),
+        react_1.default.createElement(ApexPieChart_1.default, { data: data1, labels: categories1, title: "update-donut", variant: "update-donut" }),
+        react_1.default.createElement(ApexPieChart_1.default, { data: data1, labels: categories1, title: "Monochrome Pie", variant: "monochrome-pie" }),
+        react_1.default.createElement(ApexPieChart_1.default, { data: data1, labels: categories1, title: "Gradient Donut", variant: "gradient-donut" }),
+        react_1.default.createElement(ApexPieChart_1.default, { data: data1, labels: categories1, title: "Semi Donut", variant: "semi-donut", titlePosition: "left" }),
+        react_1.default.createElement(ApexPieChart_1.default, { data: data1, labels: categories1, title: "donut-with-pattern", variant: "donut-with-pattern", titlePosition: "left" }),
+        react_1.default.createElement(ApexPieChart_1.default, { data: data1, labels: categories1, title: "pie-with-image", variant: "pie-with-image", titlePosition: "left", width: 300 }),
+        react_1.default.createElement(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%" }),
+        react_1.default.createElement(ApexLineChart_1.default, { variant: "realtime", data: [15, 25, 35], title: "Realtime Line Chart", height: 300, width: 600 }),
+        react_1.default.createElement(ApexPolarCharts_1.default, { data: [21, 23, 19, 14, 6], labels: ["Apple", "Mango", "Orange", "Watermelon", "Banana"], variant: "basic" }),
+        react_1.default.createElement(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 @@
+import React from "react";
+declare const CheckboxPage: () => React.JSX.Element;
+export default CheckboxPage;

package/dist/Pages/checkbox.js

@@ -0,0 +1,12 @@
+"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 Checkbox_1 = __importDefault(require("../Components/Checkbox/Checkbox"));
+var CheckboxPage = function () {
+    return (react_1.default.createElement("div", null,
+        react_1.default.createElement(Checkbox_1.default, { label: "hello world", isRequired: true, error: true, errorMessage: "dd" })));
+};
+exports.default = CheckboxPage;

package/dist/Pages/contactForm.d.ts

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

package/dist/Pages/contactForm.js

@@ -0,0 +1,16 @@
+"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 ContactForm_1 = __importDefault(require("../Components/ContactForm/ContactForm"));
+var contactForm = function () {
+    return (react_1.default.createElement("div", null,
+        react_1.default.createElement(ContactForm_1.default, { apiKey: "https://dev.api.pixelizetech.com/api/mks/sendSweet/", 
+            //  customFields={<>Product kjdhfkljh</>}
+            getCustomValues: function () { return ({
+            //  product: "empty",
+            }); }, customerId: 1, organizationId: 1 })));
+};
+exports.default = contactForm;

package/dist/Pages/datePick.d.ts

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

package/dist/Pages/datePick.js

@@ -0,0 +1,88 @@
+"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 });
+var react_1 = __importStar(require("react"));
+// import DatePicker from "../Components/DatePicker/DatePicker";
+var ThemeDatePicker_1 = __importDefault(require("../Components/DatePicker/ThemeDatePicker"));
+var DatePick = function () {
+    var _a = (0, react_1.useState)(), selectedDate = _a[0], setSelectedDate = _a[1];
+    // const [selectedDateTheme, setSelectedDateTheme] = useState<Date | null>();
+    var _b = (0, react_1.useState)(null), selectedTime = _b[0], setSelectedTime = _b[1];
+    var _c = (0, react_1.useState)(function () {
+        var now = new Date();
+        now.setHours(now.getHours() + 1);
+        return now;
+    }), selectedDateTime = _c[0], setSelectedDateTime = _c[1];
+    var _d = (0, react_1.useState)(null), selectedDateRange = _d[0], setSelectedDateRange = _d[1];
+    // const handleDateChange = (value: Date | null) => {
+    //   setSelectedDate(value);
+    //   console.log("Date selected:", value);
+    // };
+    // const handleTimeChange = (value: Date | null) => {
+    //   setSelectedTime(value);
+    //   console.log("Time selected:", value);
+    // };
+    // const handleDateTimeChange = (value: Date | null) => {
+    //   setSelectedDateTime(value);
+    //   console.log("DateTime selected:", value);
+    // };
+    var handleDateRangeChange = function (value) {
+        if (value && "from" in value && "to" in value) {
+            setSelectedDateRange(value);
+            console.log("Date range selected:", value.from, value.to);
+        }
+        else {
+            setSelectedDateRange(null);
+            console.log("Date range cleared");
+        }
+    };
+    console.log("Selected DateTime:", selectedDateTime);
+    return (react_1.default.createElement("div", null,
+        react_1.default.createElement("h2", null, "Single Date Picker"),
+        react_1.default.createElement("h2", null, "Date "),
+        react_1.default.createElement("h2", null, "Theme Date Picker"),
+        react_1.default.createElement(ThemeDatePicker_1.default, { selectedDate: selectedDate, onChange: setSelectedDate, dateFormat: "dd/MM/yyyy", pickerType: "date", label: "Select Date", 
+            // disableFutureDates
+            disablePastDates: true, 
+            // disableToday
+            width: "300px", size: "xs" }),
+        react_1.default.createElement(ThemeDatePicker_1.default, { selectedDate: selectedDateTime, onChange: setSelectedDateTime, dateFormat: "dd/MM/yyyy hh:mm a", pickerType: "datetime", label: "Select Date & Time", disablePastDates: true, isRequired: true, error: true, errorMessage: "Invalid date", size: "sm" }),
+        react_1.default.createElement(ThemeDatePicker_1.default, { isRange: true, selectedDate: selectedDateRange, onChange: handleDateRangeChange, dateFormat: "dd/MM/yyyy hh:mm a", pickerType: "date", label: "Select Date Range" }),
+        react_1.default.createElement(ThemeDatePicker_1.default, { selectedDate: selectedTime, onChange: setSelectedTime, dateFormat: "hh:mm a", pickerType: "time", label: "SelectTime", disablePastDates: true, isRequired: true, error: true, errorMessage: "Invalid time", informationMessage: "hh", isInformation: true, size: "md" })));
+};
+exports.default = DatePick;

package/dist/Pages/drawer.d.ts

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

package/dist/Pages/drawer.js

@@ -0,0 +1,58 @@
+"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 });
+var react_1 = __importStar(require("react"));
+var Button_1 = __importDefault(require("../Components/Button/Button"));
+var Drawer_1 = __importStar(require("../Components/Drawer/Drawer"));
+var DrawerPage = function () {
+    var _a = (0, react_1.useState)(false), drawerOpen = _a[0], setDrawerOpen = _a[1];
+    var handleOnclick3 = function () {
+        setDrawerOpen(true);
+    };
+    var handleOnclick4 = function () {
+        setDrawerOpen(false);
+    };
+    return (react_1.default.createElement("div", null,
+        react_1.default.createElement(Button_1.default, { label: "DrawerButton", onClick: handleOnclick3, width: 250, variant: "solid" }),
+        react_1.default.createElement("br", null),
+        react_1.default.createElement(Drawer_1.default, { isOpen: drawerOpen, onClose: handleOnclick4, size: "xl" },
+            react_1.default.createElement(Drawer_1.DrawerHeader, null, "Drawer Header"),
+            react_1.default.createElement(Drawer_1.DrawerBody, null, "Drawer Body"),
+            react_1.default.createElement(Drawer_1.DrawerFooter, null, "Drawer Footer"))));
+};
+exports.default = DrawerPage;

package/dist/Pages/dropdown.d.ts

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

package/dist/Pages/dropdown.js

@@ -0,0 +1,24 @@
+"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 DropDown_1 = __importDefault(require("../Components/Dropdown/DropDown"));
+var lucide_react_1 = require("lucide-react");
+var DropdownPage = function () {
+    var exportOptionss = [
+        { id: 1, label: "Upload file" },
+        { id: 2, label: "Documents", image: lucide_react_1.ChevronUp },
+        { id: 3, label: "CRM workDrive", image: lucide_react_1.ChevronUp },
+        { id: 4, label: "Other Cloud Drives", image: lucide_react_1.ChevronUp },
+        { id: 5, label: "Link(URL)", image: lucide_react_1.ChevronUp },
+    ];
+    return (react_1.default.createElement("div", null,
+        react_1.default.createElement(DropDown_1.default, { ButtonText: "hello", optionsSize: "sm", options: exportOptionss, 
+            // dropDownButtonStyle={{ color: "red" }}
+            DropdownIcon: react_1.default.createElement(lucide_react_1.Ellipsis, { color: "gray.500" }), dropdownType: "button", handleOptionSelect: function (id, label) {
+                console.log("optionid", id, label);
+            }, buttonProps: { variant: "solid", colorScheme: "red" }, isVisibleIconShow: true, divider: true })));
+};
+exports.default = DropdownPage;

package/dist/Pages/editor.d.ts

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

package/dist/Pages/editor.js

@@ -0,0 +1,14 @@
+"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 Editor_1 = __importDefault(require("../Components/Editor/Editor"));
+var EditorPage = function () {
+    return (react_1.default.createElement("div", null,
+        react_1.default.createElement(Editor_1.default, { value: "heeeeejhbjhvbjhvbhj jbhkjhbiubviu iuhiuhiuhiu", config: { readonly: false, width: "900px" }, onChange: function (val) {
+                //console.log(val);
+            } })));
+};
+exports.default = EditorPage;

package/dist/Pages/feedback.d.ts

@@ -0,0 +1,2 @@
+import React from "react";
+export default function FeedbackPage(): React.JSX.Element;

package/dist/Pages/feedback.js

@@ -0,0 +1,15 @@
+"use strict";
+var __importDefault = (this && this.__importDefault) || function (mod) {
+    return (mod && mod.__esModule) ? mod : { "default": mod };
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.default = FeedbackPage;
+var react_1 = __importDefault(require("react"));
+var react_2 = require("@chakra-ui/react");
+var FeedbackForm_1 = __importDefault(require("../Components/FeedbackForm/FeedbackForm"));
+function FeedbackPage() {
+    return (react_1.default.createElement(react_2.Container, { maxW: "4xl", py: 8 },
+        react_1.default.createElement(react_2.Heading, { size: "lg", mb: 6 }, "Feedback Form"),
+        react_1.default.createElement(react_2.Box, { bg: "white", p: 6, borderRadius: "md", boxShadow: "sm" },
+            react_1.default.createElement(FeedbackForm_1.default, { submitUrl: "/api/crm/feedback" }))));
+}

package/dist/Pages/fileUpload.d.ts

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

package/dist/Pages/fileUpload.js

@@ -0,0 +1,82 @@
+"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 __spreadArray = (this && this.__spreadArray) || function (to, from, pack) {
+    if (pack || arguments.length === 2) for (var i = 0, l = from.length, ar; i < l; i++) {
+        if (ar || !(i in from)) {
+            if (!ar) ar = Array.prototype.slice.call(from, 0, i);
+            ar[i] = from[i];
+        }
+    }
+    return to.concat(ar || Array.prototype.slice.call(from));
+};
+var __importDefault = (this && this.__importDefault) || function (mod) {
+    return (mod && mod.__esModule) ? mod : { "default": mod };
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.FileUploader = void 0;
+var react_1 = __importStar(require("react"));
+var Reorder_1 = __importDefault(require("../Components/Reorder/Reorder"));
+var FileUploader_1 = __importDefault(require("../Components/FileUploader/FileUploader"));
+var FileUpload_1 = __importDefault(require("../Components/FileUpload/FileUpload"));
+var imageList = [
+    { id: "1", previewUrl: "https://picsum.photos/id/1011/100", name: "Image 1" },
+    { id: "2", previewUrl: "https://picsum.photos/id/1012/100", name: "Image 2" },
+    { id: "3", previewUrl: "https://picsum.photos/id/1013/100", name: "Image 3" },
+    { id: "4", previewUrl: "https://picsum.photos/id/1011/100", name: "Image 1" },
+];
+var FileUploader = function () {
+    var _a = (0, react_1.useState)([]), file = _a[0], setFile = _a[1];
+    var _b = (0, react_1.useState)(imageList), list = _b[0], setList = _b[1];
+    var handleFiles = function (files) {
+        setFile(files);
+        var uploadedImages = files.map(function (f, i) { return ({
+            id: "".concat(i + 11),
+            name: f.name,
+            previewUrl: URL.createObjectURL(f),
+        }); });
+        setList(__spreadArray(__spreadArray([], imageList, true), uploadedImages, true));
+    };
+    var handleFilesChange = function (files) {
+        console.log('Uploaded files:', files);
+        // Handle the uploaded files here
+    };
+    return (react_1.default.createElement(react_1.default.Fragment, null,
+        react_1.default.createElement(FileUpload_1.default, { onFilesUploaded: function (files) { return handleFiles(files); }, uploadedFiles: file, onRemoveFile: function (file) { return console.log("SDFSDf", file); }, acceptTypes: [".webp", ".pdf", ".zip"], maxSizeKB: 512 }),
+        react_1.default.createElement("br", null),
+        react_1.default.createElement(Reorder_1.default, { items: list, onReorder: function (files) { return setList(files); }, label: "Reorder" }),
+        react_1.default.createElement("br", null),
+        react_1.default.createElement(FileUploader_1.default, { maxFiles: 10, maxTotalSize: 20, onFilesChange: handleFilesChange, acceptTypes: ["jpeg", "jpg", "png"] })));
+};
+exports.FileUploader = FileUploader;

package/dist/Pages/input.d.ts

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