pixelize-design-library 2.1.7 → 2.1.8

package/dist/Components/Table/TableToDo.js

@@ -1,291 +0,0 @@
-"use strict";
-// const [isPopoverOpen, setPopoverOpen] = useState(false);
-// const [activeHeader, setActiveHeader] = useState<string | null>(null);
-// const [searchTerms, setSearchTerms] = useState<Record<string, string>>({});
-// const [searchOperation, setSearchOperation] = useState<
-//   Record<string, string>
-// >({});
-// const [betweenValues, setBetweenValues] = useState<
-//   Record<string, { min: string; max: string }>
-// >({});
-var __importDefault = (this && this.__importDefault) || function (mod) {
-    return (mod && mod.__esModule) ? mod : { "default": mod };
-};
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.searchFeatures = void 0;
-// const sortedData = [...data].sort((a, b) => {
-//   if (!sortField) return 0;
-//   if (a[sortField] < b[sortField]) return sortDirection === "asc" ? -1 : 1;
-//   if (a[sortField] > b[sortField]) return sortDirection === "asc" ? 1 : -1;
-//   return 0;
-// });
-// const getValue = (header: string) => {
-//   const value = data.reduce((acc: (string | number)[], item: DataObject) => {
-//     const itemValue = item[header];
-//     if (
-//       itemValue !== undefined &&
-//       itemValue !== null &&
-//       !acc.includes(itemValue)
-//     ) {
-//       acc.push(itemValue);
-//     }
-//     return acc;
-//   }, []);
-//   return value;
-// };
-// const handleSearchOperation = (header: string, operation: string) => {
-//   // setSearchOperation((prev) => ({ ...prev, [header]: operation }));
-//   // const list_ofdata = getValue(header);
-//   // if (operation === "between") {
-//   //   const smallestValue = String(Math.min(Number(...list_ofdata)));
-//   //   const highestValue = String(Math.max(Number(...list_ofdata)));
-//   //   setBetweenValues((prev) => ({
-//   //     ...prev,
-//   //     [header]: { min: smallestValue, max: highestValue },
-//   //   }));
-//   //   setSearchTerms((prev) => ({ ...prev, [header]: "between" }));
-//   // } else {
-//   //   if (operation === "blank" || operation === "notBlank") {
-//   //     setSearchTerms((prev) => ({ ...prev, [header]: "" }));
-//   //   } else {
-//   //     setSearchTerms((prev) => ({
-//   //       ...prev,
-//   //       [header]: list_ofdata[0].toString(),
-//   //     }));
-//   //   }
-//   // }
-// };
-// const handleSearch = (field: string, term: string) => {
-//   // if (searchOperation[field] === "between") {
-//   //   setBetweenValues((prev) => ({
-//   //     ...prev,
-//   //     [field]: { min: term.split("-")[0], max: term.split("-")[1] },
-//   //   }));
-//   // } else {
-//   //   setSearchTerms((prev) => ({ ...prev, [field]: term }));
-//   // }
-// };
-// const handleHeaderClick = (header: string, search: boolean) => {
-//   // if (!search) {
-//   //   return;
-//   // }
-//   // setActiveHeader(header);
-//   // setPopoverOpen(true);
-// };
-// const closePopover = () => {
-//   // setPopoverOpen(false);
-// };
-// const filteredData = sortedData.filter((item) => {
-//   return Object.keys(searchTerms).every((key) => {
-//     const term = String(searchTerms[key]).toLowerCase();
-//     const value = String(item[key]).toLowerCase();
-//     const operation = searchOperation[key] || "notBlank";
-//     switch (operation) {
-//       case "contains":
-//         return value.includes(term);
-//       case "notContains":
-//         return !value.includes(term);
-//       case "equals":
-//         return value === term;
-//       case "notEquals":
-//         return value !== term;
-//       case "beginsWith":
-//         return value.startsWith(term);
-//       case "endsWith":
-//         return value.endsWith(term);
-//       case "greaterThan":
-//         return Number(value) > Number(term);
-//       case "greaterThanOrEqual":
-//         return Number(value) >= Number(term);
-//       case "lessThan":
-//         return Number(value) < Number(term);
-//       case "lessThanOrEqual":
-//         return Number(value) <= Number(term);
-//       case "between": {
-//         const { min, max } = betweenValues[key] || {};
-//         return Number(value) >= Number(min) && Number(value) <= Number(max);
-//       }
-//       case "blank":
-//         return value === "";
-//       case "notBlank":
-//         return value !== "";
-//       default:
-//         return true;
-//     }
-//   });
-// });
-var react_1 = __importDefault(require("react"));
-var searchFeatures = function (header) {
-    return react_1.default.createElement(react_1.default.Fragment, null, "hi");
-    // const fieldType = getFieldType(header, data);
-    // return (
-    //   <>
-    //     <Select
-    //       value={searchOperation[header] || "notBlank"}
-    //       onChange={(e) => handleSearchOperation(header, e.target.value)}
-    //       style={{ background: "#3182ce", color: "white" }}
-    //     >
-    //       <option value="equals">Equals</option>
-    //       <option value="notEquals">Does not equal</option>
-    //       {fieldType === "number" ? (
-    //         <>
-    //           <option value="greaterThan">Greater than</option>
-    //           <option value="greaterThanOrEqual">
-    //             Greater than or equal to
-    //           </option>
-    //           <option value="lessThan">Less than</option>
-    //           <option value="lessThanOrEqual">Less than or equal to</option>
-    //           <option value="between">Between</option>
-    //         </>
-    //       ) : (
-    //         <>
-    //           <option value="contains">Contains</option>
-    //           <option value="notContains">Does not contain</option>
-    //           <option value="beginsWith">Begins with</option>
-    //           <option value="endsWith">Ends with</option>
-    //         </>
-    //       )}
-    //       <option value="blank">Blank</option>
-    //       <option value="notBlank">Not blank</option>
-    //     </Select>
-    //     {searchOperation[header] !== undefined &&
-    //       searchOperation[header] === "between" &&
-    //       fieldType === "number" && (
-    //         <>
-    //           <br />
-    //           <Input
-    //             value={betweenValues[header]?.min || ""}
-    //             onChange={(e) => {
-    //               setBetweenValues((prev) => ({
-    //                 ...prev,
-    //                 [header]: { ...prev[header], min: e.target.value },
-    //               }));
-    //               setSearchTerms((prev) => ({ ...prev, [header]: "between" }));
-    //             }}
-    //             placeholder="Min..."
-    //             background="white"
-    //             color="black"
-    //           />
-    //           <br />
-    //           <br />
-    //           <Input
-    //             value={betweenValues[header]?.max || ""}
-    //             onChange={(e) => {
-    //               setBetweenValues((prev) => ({
-    //                 ...prev,
-    //                 [header]: { ...prev[header], max: e.target.value },
-    //               }));
-    //               setSearchTerms((prev) => ({ ...prev, [header]: "between" }));
-    //             }}
-    //             placeholder="Max..."
-    //             background="white"
-    //             color="black"
-    //           />
-    //         </>
-    //       )}
-    //     {searchOperation[header] !== undefined &&
-    //       searchOperation[header] !== "between" &&
-    //       searchOperation[header] !== "blank" &&
-    //       searchOperation[header] !== "notBlank" && (
-    //         <>
-    //           <br />
-    //           <Input
-    //             value={searchTerms[header] || ""}
-    //             onChange={(e) => handleSearch(header, e.target.value)}
-    //             placeholder="Search..."
-    //             background="white"
-    //             color="black"
-    //           />
-    //           {/* <br />
-    //                         <select onChange={(e) => console.log("option 1")} style={{ width: "100%", borderRadius: "2px", height: "30px" }}>
-    //                             <option value="">Select an option</option>
-    //                             <option value="option1">Option 1</option>
-    //                             <option value="option2">Option 2</option>
-    //                             <option value="option3">Option 3</option>
-    //                         </select> */}
-    //         </>
-    //       )}
-    //   </>
-    // );
-};
-exports.searchFeatures = searchFeatures;
-// const hasSelection = selection.length > 0;
-// const indeterminate = hasSelection && selection.length < data.length;
-// const handleMouseEnter = (index: number) => setHoveredHeaderIndex(index);
-// const handleMouseLeave = () => {
-//   setHoveredHeaderIndex(null);
-//   closePopover();
-// };
-// const removeSearchOptionTerm = (key: any) => {
-//   const newSearchTerms = { ...searchTerms };
-//   const newSearchOperation = { ...searchOperation };
-//   const newBetweenValues = { ...betweenValues };
-//   delete newSearchTerms[key];
-//   delete newSearchOperation[key];
-//   delete newBetweenValues[key];
-//   setSearchTerms(newSearchTerms);
-//   setSearchOperation(newSearchOperation);
-//   setBetweenValues(newBetweenValues);
-// };
-// const SearchOptions = () => {
-//   return (
-//     <Wrap>
-//       {searchOperation &&
-//         Object.keys(searchOperation).map((key, index) => {
-//           return (
-//             <Tag
-//               size="sm"
-//               key={index}
-//               borderRadius="full"
-//               variant="solid"
-//               colorScheme="gray"
-//               m={1}
-//             >
-//               <Box display="flex" alignItems="center">
-//                 <TagLabel>{key}</TagLabel>
-//                 <TagLabel mx={2}>{searchOperation[key]}</TagLabel>
-//                 {searchOperation[key] === "between" ? (
-//                   <TagLabel>
-//                     {betweenValues[key]?.min} - {betweenValues[key]?.max}
-//                   </TagLabel>
-//                 ) : (
-//                   <TagLabel>{searchTerms[key]}</TagLabel>
-//                 )}
-//               </Box>
-//               <TagCloseButton onClick={() => removeSearchOptionTerm(key)} />
-//             </Tag>
-//           );
-//         })}
-//     </Wrap>
-//   );
-// };
-// const Export = ({
-//   exportOptions,
-// }: {
-//   exportOptions: TableProps["exportOptions"];
-// }) => {
-//   return (
-//     <Select
-//       placeholder="Exports"
-//       width={160}
-//       onChange={(e) => {
-//         handleExportChange && handleExportChange(e.target.value);
-//       }}
-//       value={exportLabel}
-//       key={exportLabel}
-//     >
-//       {exportOptions?.map((option) => (
-//         <option key={option.id} value={option.id}>
-//           {option.label}
-//         </option>
-//       ))}
-//     </Select>
-//   );
-// };
-/* <Box display="flex" justifyContent="flex-end">
-        <SearchOptions />
-        {exportOptions && exportOptions.length > 0 && (
-          <Export exportOptions={exportOptions} />
-        )}
-      </Box> */
-//   <br />

package/dist/Components/Tag/Tag.js

@@ -1,21 +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_2 = require("@chakra-ui/react");
-var Tag = function (_a) {
-    var label = _a.label, _b = _a.colorScheme, colorScheme = _b === void 0 ? "primary" : _b, _c = _a.variant, variant = _c === void 0 ? "solid" : _c, _d = _a.size, size = _d === void 0 ? "md" : _d, icon = _a.icon, onTagClick = _a.onTagClick, onIconClick = _a.onIconClick;
-    return (react_1.default.createElement(react_2.Tag, { size: size, variant: variant, colorScheme: colorScheme, borderRadius: "full", cursor: "pointer", onClick: function () { return onTagClick === null || onTagClick === void 0 ? void 0 : onTagClick(); } },
-        react_1.default.createElement(react_2.TagLabel, null, label),
-        icon && (react_1.default.createElement(react_2.TagRightIcon, { as: icon, boxSize: "1em", ml: 1.5, cursor: onIconClick ? "pointer" : "default", onClick: function (e) {
-                e.stopPropagation();
-                onIconClick === null || onIconClick === void 0 ? void 0 : onIconClick();
-            }, transition: "all 0.2s ease", _hover: {
-                opacity: 0.8,
-                transform: "scale(1.05)",
-                cursor: onIconClick ? "pointer" : "default",
-            } }))));
-};
-exports.default = Tag;

package/dist/Components/Tag/Tag.styles.js

@@ -1,63 +0,0 @@
-"use strict";
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.Tag = void 0;
-exports.Tag = {
-    baseStyle: {
-        borderRadius: "full",
-        fontWeight: "bold",
-        px: 3,
-        py: 1,
-    },
-    sizes: {
-        sm: {
-            fontSize: "0.75rem",
-            px: 2,
-            py: 1,
-        },
-        md: {
-            fontSize: "0.875rem",
-            px: 3,
-            py: 1.5,
-        },
-        lg: {
-            fontSize: "1rem",
-            px: 4,
-            py: 2,
-        },
-    },
-    variants: {
-        solid: function (_a) {
-            var theme = _a.theme, _b = _a.colorScheme, colorScheme = _b === void 0 ? "primary" : _b;
-            return ({
-                bg: theme.colors[colorScheme][500],
-                color: theme.colors.white,
-                _hover: {
-                    bg: theme.colors[colorScheme][600],
-                },
-                _active: {
-                    bg: theme.colors[colorScheme][700],
-                },
-            });
-        },
-        outline: function (_a) {
-            var theme = _a.theme, _b = _a.colorScheme, colorScheme = _b === void 0 ? "primary" : _b;
-            return ({
-                border: "0.125rem solid",
-                borderColor: theme.colors[colorScheme][500],
-                color: theme.colors[colorScheme][500],
-                bg: "transparent",
-                _hover: {
-                    bg: theme.colors[colorScheme][50],
-                },
-                _active: {
-                    bg: theme.colors[colorScheme][100],
-                },
-            });
-        },
-    },
-    defaultProps: {
-        size: "md",
-        variant: "solid",
-        colorScheme: "primary",
-    },
-};

package/dist/Components/Timeline/Timeline.d.ts

@@ -1,4 +0,0 @@
-import React from "react";
-import { TimelineProps } from "./TimelineProps";
-declare const Timeline: ({ timelineEvents }: TimelineProps) => React.JSX.Element;
-export default Timeline;

package/dist/Components/Timeline/Timeline.js

@@ -1,166 +0,0 @@
-"use strict";
-var __makeTemplateObject = (this && this.__makeTemplateObject) || function (cooked, raw) {
-    if (Object.defineProperty) { Object.defineProperty(cooked, "raw", { value: raw }); } else { cooked.raw = raw; }
-    return cooked;
-};
-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 styled_1 = __importDefault(require("@emotion/styled"));
-var react_2 = require("@chakra-ui/react");
-var lucide_react_1 = require("lucide-react");
-var TimelineContainer = styled_1.default.div(templateObject_1 || (templateObject_1 = __makeTemplateObject(["\n  position: relative;\n  padding: 0px 24px;\n  margin: 0 auto;\n  width: 100%;\n  max-width: 800px;\n   @media (max-width: 768px) {\n    padding: 0px 16px;\n    max-width: 100%;\n  }\n"], ["\n  position: relative;\n  padding: 0px 24px;\n  margin: 0 auto;\n  width: 100%;\n  max-width: 800px;\n   @media (max-width: 768px) {\n    padding: 0px 16px;\n    max-width: 100%;\n  }\n"])));
-var Line = styled_1.default.div(templateObject_2 || (templateObject_2 = __makeTemplateObject(["\n  position: absolute;\n  left: 50%;\n  top: 0;\n  bottom: 0;\n  width: 2px;\n  background-color: #d2d9e0;\n  transform: translateX(-50%);\n  @media (max-width: 768px) {\n    left: 25px; /* Move the line towards the left */\n  }\n"], ["\n  position: absolute;\n  left: 50%;\n  top: 0;\n  bottom: 0;\n  width: 2px;\n  background-color: #d2d9e0;\n  transform: translateX(-50%);\n  @media (max-width: 768px) {\n    left: 25px; /* Move the line towards the left */\n  }\n"])));
-var EventContainer = styled_1.default.div(templateObject_3 || (templateObject_3 = __makeTemplateObject(["\n  display: flex;\n  justify-content: ", ";\n  width: 100%;\n  // padding: 1rem 0 1rem 0;\n  box-sizing: border-box;\n  position: relative;\n  margin-bottom: 24px;\n  align-items: center; /* Center alignment for dot and event content */\n  text-align: ", ";\n  @media (max-width: 768px) {\n    flex-direction: column;\n    text-align: left;\n    align-items: flex-start;\n  }\n"], ["\n  display: flex;\n  justify-content: ", ";\n  width: 100%;\n  // padding: 1rem 0 1rem 0;\n  box-sizing: border-box;\n  position: relative;\n  margin-bottom: 24px;\n  align-items: center; /* Center alignment for dot and event content */\n  text-align: ", ";\n  @media (max-width: 768px) {\n    flex-direction: column;\n    text-align: left;\n    align-items: flex-start;\n  }\n"])), function (_a) {
-    var isLeft = _a.isLeft;
-    return (isLeft ? "flex-end" : "flex-start");
-}, function (_a) {
-    var isLeft = _a.isLeft;
-    return (isLeft ? "left" : "right");
-});
-var Event = styled_1.default.div(templateObject_4 || (templateObject_4 = __makeTemplateObject(["\n  // background: white;\n  // padding: 16px;\n  // border: 1px solid #007bff;\n  // border-radius: 8px;\n  // width: 40%;\n  position: relative;\n  display: flex;\n  align-items: center;\n  cursor: pointer; /* Indicates that the event is clickable */\n"], ["\n  // background: white;\n  // padding: 16px;\n  // border: 1px solid #007bff;\n  // border-radius: 8px;\n  // width: 40%;\n  position: relative;\n  display: flex;\n  align-items: center;\n  cursor: pointer; /* Indicates that the event is clickable */\n"])));
-var Dot = styled_1.default.div(templateObject_5 || (templateObject_5 = __makeTemplateObject(["\n  position: absolute;\n  left: 50%;\n  width: 30px;\n  height: 30px;\n  background-color: #f4f7ff;\n  border-radius: 50%;\n  transform: translateX(-50%);\n  padding: 6px;\n  border: 1px solid #d2d9e0;\n   @media (max-width: 768px) {\n    left: 20px; /* Move dot closer to the left */\n    transform: translateX(0); /* Remove horizontal centering */\n  }\n"], ["\n  position: absolute;\n  left: 50%;\n  width: 30px;\n  height: 30px;\n  background-color: #f4f7ff;\n  border-radius: 50%;\n  transform: translateX(-50%);\n  padding: 6px;\n  border: 1px solid #d2d9e0;\n   @media (max-width: 768px) {\n    left: 20px; /* Move dot closer to the left */\n    transform: translateX(0); /* Remove horizontal centering */\n  }\n"])));
-// const Arrow = styled.div<{ isLeft: boolean }>`
-//   position: absolute;
-//   left: ${({ isLeft }) => (isLeft ? "-10px " : "100%")};
-//   width: 0;
-//   height: 0;
-//   border-style: solid;
-//   border-width: ${({ isLeft }) =>
-//     isLeft ? "10px 10px 10px 0" : "10px 10px 10px 10px"};
-//   border-color: transparent #007bff transparent transparent;
-//   transform: translateX(-50%);
-//   top: 50%;
-//   transform: translateY(-50%);
-//   transform: ${({ isLeft }) =>
-//     isLeft ? "translateY(-50%) " : "translateY(-50%) rotate(180deg)"};
-// `;
-var EventContent = styled_1.default.div(templateObject_6 || (templateObject_6 = __makeTemplateObject(["\n  // margin-left: 24px;\n"], ["\n  // margin-left: 24px;\n"])));
-var EventTitle = styled_1.default.h3(templateObject_7 || (templateObject_7 = __makeTemplateObject(["\n  margin: 0;\n"], ["\n  margin: 0;\n"])));
-// const EventDescription = styled.p`
-//   margin: 0;
-// `;
-var EventDate = styled_1.default.span(templateObject_8 || (templateObject_8 = __makeTemplateObject(["\n  display: block;\n  margin-top: 8px;\n  color: #6c757d;\n"], ["\n  display: block;\n  margin-top: 8px;\n  color: #6c757d;\n"])));
-var EventTime = styled_1.default.span(templateObject_9 || (templateObject_9 = __makeTemplateObject(["\n  left: ", ";\n  position: absolute;\n  color: #6c757d;\n  @media (max-width: 768px) {\n    position: relative;\n    left: auto;\n    margin-left: 40px;\n  }\n"], ["\n  left: ", ";\n  position: absolute;\n  color: #6c757d;\n  @media (max-width: 768px) {\n    position: relative;\n    left: auto;\n    margin-left: 40px;\n  }\n"])), function (_a) {
-    var isLeft = _a.isLeft;
-    return (isLeft ? "38% " : "53%");
-});
-var EventGroupDate = styled_1.default.div(templateObject_10 || (templateObject_10 = __makeTemplateObject(["\n  font-size: 1rem;\n  font-weight: 400;\n  color: #464f62;\n  box-sizing: border-box;\n  width: 180px;\n  padding: 5px 25px;\n  text-align: center;\n  background-color: #f4f7ff;\n  border: 1px solid #d2d9e0;\n  border-radius: 5px;\n  margin: 0 auto; /* Center horizontally */\n  display: flex;\n  align-items: center; /* Center vertically */\n  justify-content: center; /* Center horizontally */\n  @media (max-width: 768px) {\n    width: auto;\n    padding: 5px 10px;\n  }\n"], ["\n  font-size: 1rem;\n  font-weight: 400;\n  color: #464f62;\n  box-sizing: border-box;\n  width: 180px;\n  padding: 5px 25px;\n  text-align: center;\n  background-color: #f4f7ff;\n  border: 1px solid #d2d9e0;\n  border-radius: 5px;\n  margin: 0 auto; /* Center horizontally */\n  display: flex;\n  align-items: center; /* Center vertically */\n  justify-content: center; /* Center horizontally */\n  @media (max-width: 768px) {\n    width: auto;\n    padding: 5px 10px;\n  }\n"])));
-var EventGroupSeparator = styled_1.default.div(templateObject_11 || (templateObject_11 = __makeTemplateObject(["\n  width: 100%;\n"], ["\n  width: 100%;\n"])));
-var EventGroupHeader = styled_1.default.div(templateObject_12 || (templateObject_12 = __makeTemplateObject(["\n  position: relative;\n  margin-bottom: 24px;\n"], ["\n  position: relative;\n  margin-bottom: 24px;\n"])));
-// const FlexContainer = styled.div`
-//   display: flex;
-//   align-items: center;
-// `;
-var Timeline = function (_a) {
-    var timelineEvents = _a.timelineEvents;
-    var formatTimestamp = function (timestamp, type) {
-        var parsedTimestamp = parseInt(timestamp, 10);
-        var date = new Date(parsedTimestamp);
-        if (isNaN(date.getTime())) {
-            return "Invalid Date";
-        }
-        if (type === "date") {
-            var monthNames = [
-                "January",
-                "February",
-                "March",
-                "April",
-                "May",
-                "June",
-                "July",
-                "August",
-                "September",
-                "October",
-                "November",
-                "December",
-            ];
-            var month = monthNames[date.getMonth()];
-            var day = date.getDate();
-            var year = date.getFullYear();
-            return "".concat(month, " ").concat(day, ", ").concat(year);
-        }
-        else if (type === "time") {
-            // Convert to IST (UTC+5:30)
-            var istOffset = 5.5 * 60 * 60 * 1000; // 5 hours 30 minutes in milliseconds
-            var istDate = new Date(date.getTime() + istOffset);
-            var hours = istDate.getUTCHours();
-            var minutes = istDate.getUTCMinutes();
-            var ampm = hours >= 12 ? "PM" : "AM";
-            // Convert hours to 12-hour format
-            hours = hours % 12;
-            hours = hours ? hours : 12; // the hour '0' should be '12'
-            // Pad minutes with leading zero if needed
-            var minutesStr = minutes < 10 ? "0" + minutes : minutes;
-            return "".concat(hours, ":").concat(minutesStr, " ").concat(ampm);
-        }
-        return date.toLocaleString();
-    };
-    var getIcon = function (event) {
-        switch (event.action_from) {
-            case "Accounts":
-                return react_1.default.createElement(lucide_react_1.IndianRupee, { size: 17 });
-            case "Notes":
-                return react_1.default.createElement(lucide_react_1.FileText, { size: 17 });
-            default:
-                return react_1.default.createElement(lucide_react_1.Volleyball, { size: 17 });
-        }
-    };
-    var groupEventsByDate = function (events) {
-        return events.reduce(function (groups, event) {
-            var date = formatTimestamp(event.created_at, "date");
-            if (!groups[date]) {
-                groups[date] = [];
-            }
-            groups[date].push(event);
-            return groups;
-        }, {});
-    };
-    var groupedEvents = groupEventsByDate(timelineEvents);
-    var formatChanges = function (changes) {
-        if (changes === null) {
-            return "No Changes";
-        }
-        var result = Object.entries(JSON.parse(changes))
-            .map(function (_a) {
-            var key = _a[0], value = _a[1];
-            var changeRecord = value;
-            if (changeRecord.original === null ||
-                changeRecord.original === undefined) {
-                return "".concat(key, " changed from null to ").concat(changeRecord.updated);
-            }
-            else {
-                return "".concat(key, " updated to ").concat(changeRecord.updated);
-            }
-        })
-            .join("\n");
-        return result;
-    };
-    // console.log("groupedEvents", groupedEvents);
-    return (react_1.default.createElement(TimelineContainer, null,
-        react_1.default.createElement(Line, null),
-        Object.keys(groupedEvents).map(function (date) { return (react_1.default.createElement(EventGroupSeparator, { key: date },
-            react_1.default.createElement(EventGroupHeader, null,
-                react_1.default.createElement(EventGroupDate, null, date)),
-            groupedEvents[date].map(function (event, index) { return (react_1.default.createElement(EventContainer, { key: index, isLeft: index % 2 === 0 },
-                react_1.default.createElement(Dot, null, getIcon(event)),
-                react_1.default.createElement(EventTime, { isLeft: index % 2 === 0 }, formatTimestamp(event.created_at, "time")),
-                react_1.default.createElement(Event, null,
-                    react_1.default.createElement(EventContent, null,
-                        react_1.default.createElement("div", { style: {
-                                display: "flex",
-                                alignItems: "center",
-                                justifyContent: index % 2 === 0 ? "flex-start" : "flex-end",
-                            } },
-                            react_1.default.createElement(EventTitle, null, event.action_from + " " + event.title),
-                            react_1.default.createElement(react_2.Tooltip, { label: formatChanges(event.changes), shouldWrapChildren: true, placement: "top", hasArrow: true },
-                                react_1.default.createElement(lucide_react_1.Info, { style: { marginLeft: "5px" }, size: 17 }))),
-                        react_1.default.createElement(EventDate, null, " by " +
-                            event.action_by +
-                            " " +
-                            formatTimestamp(event.created_at, "date")))))); }))); })));
-};
-exports.default = Timeline;
-var templateObject_1, templateObject_2, templateObject_3, templateObject_4, templateObject_5, templateObject_6, templateObject_7, templateObject_8, templateObject_9, templateObject_10, templateObject_11, templateObject_12;

package/dist/Components/Timeline/TimelineProps.js

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

package/dist/Components/Toaster/Toaster.js

@@ -1,86 +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;
-};
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.useToaster = void 0;
-var react_1 = __importStar(require("react"));
-var react_2 = require("@chakra-ui/react");
-var ToasterContext = (0, react_1.createContext)(undefined);
-function ToasterProvider(_a) {
-    var children = _a.children;
-    var toast = (0, react_2.useToast)();
-    var theme = (0, react_2.useTheme)();
-    var showToast = function (_a) {
-        var _b, _c, _d, _e, _f, _g, _h, _j, _k, _l;
-        var title = _a.title, description = _a.description, _m = _a.status, status = _m === void 0 ? "info" : _m, _o = _a.duration, duration = _o === void 0 ? 5000 : _o, _p = _a.isClosable, isClosable = _p === void 0 ? true : _p, _q = _a.position, position = _q === void 0 ? "top-right" : _q, onClose = _a.onClose;
-        var statusColors = {
-            success: {
-                bg: (_b = theme.colors.green) === null || _b === void 0 ? void 0 : _b[50],
-                border: (_c = theme.colors.green) === null || _c === void 0 ? void 0 : _c[300],
-            },
-            error: {
-                bg: (_d = theme.colors.red) === null || _d === void 0 ? void 0 : _d[50],
-                border: (_e = theme.colors.red) === null || _e === void 0 ? void 0 : _e[300],
-            },
-            warning: {
-                bg: (_f = theme.colors.yellow) === null || _f === void 0 ? void 0 : _f[50],
-                border: (_g = theme.colors.yellow) === null || _g === void 0 ? void 0 : _g[300],
-            },
-            info: {
-                bg: (_h = theme.colors.blue) === null || _h === void 0 ? void 0 : _h[50],
-                border: (_j = theme.colors.blue) === null || _j === void 0 ? void 0 : _j[300],
-            },
-            loading: {
-                bg: (_k = theme.colors.gray) === null || _k === void 0 ? void 0 : _k[50],
-                border: (_l = theme.colors.gray) === null || _l === void 0 ? void 0 : _l[300],
-            },
-        };
-        var colors = statusColors[status];
-        toast({
-            duration: duration,
-            isClosable: isClosable,
-            position: position,
-            onCloseComplete: onClose,
-            render: function (_a) {
-                var onClose = _a.onClose;
-                return (react_1.default.createElement(react_2.Box, { bg: colors.bg, border: "0.063rem solid", borderColor: colors.border, boxShadow: "md", borderRadius: "md", p: 4, minW: "22.5rem" },
-                    react_1.default.createElement(react_2.Flex, { justify: "space-between", align: "flex-start" },
-                        react_1.default.createElement(react_2.Box, null,
-                            react_1.default.createElement(react_2.Text, { fontWeight: "semibold", mb: "0.25rem" }, title),
-                            react_1.default.createElement(react_2.Text, { fontSize: "sm" }, description)),
-                        isClosable && (react_1.default.createElement(react_2.CloseButton, { onClick: onClose, size: "sm", mt: 1, ml: 4 })))));
-            },
-        });
-    };
-    return (react_1.default.createElement(ToasterContext.Provider, { value: { showToast: showToast } }, children));
-}
-exports.default = ToasterProvider;
-var useToaster = function () {
-    var context = (0, react_1.useContext)(ToasterContext);
-    if (!context) {
-        throw new Error("useToaster must be used within a ToasterProvider");
-    }
-    return context;
-};
-exports.useToaster = useToaster;

package/dist/Components/Toaster/Toaster.stories.js

@@ -1,8 +0,0 @@
-"use strict";
-// // Toaster.stories.tsx
-// import React from 'react';
-// import { Meta, StoryFn } from '@storybook/react';
-// import ToasterProvider, { useToaster } from './Toaster';
-// import { Button, ChakraProvider } from '@chakra-ui/react';
-// import { ToasterToastProps } from './ToasterProps';
-Object.defineProperty(exports, "__esModule", { value: true });

package/dist/Components/Toaster/ToasterProps.js

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