pixelize-design-library 2.3.6 → 2.3.8

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

@@ -4,11 +4,7 @@ exports.Tag = void 0;
 // Resolve a colorScheme key to a numeric swatch from the theme. All supported
 // colorScheme values (brand + global scales) expose a 50-900 scale; fall back to
 // gray so an unknown/missing key can never throw at render time.
-var swatch = function (theme, colorScheme) {
-    var _a, _b, _c, _d;
-    if (colorScheme === void 0) { colorScheme = "primary"; }
-    return (_d = (_b = (_a = theme.colors) === null || _a === void 0 ? void 0 : _a[colorScheme]) !== null && _b !== void 0 ? _b : (_c = theme.colors) === null || _c === void 0 ? void 0 : _c.gray) !== null && _d !== void 0 ? _d : {};
-};
+const swatch = (theme, colorScheme = "primary") => { var _a, _b, _c, _d; return (_d = (_b = (_a = theme.colors) === null || _a === void 0 ? void 0 : _a[colorScheme]) !== null && _b !== void 0 ? _b : (_c = theme.colors) === null || _c === void 0 ? void 0 : _c.gray) !== null && _d !== void 0 ? _d : {}; };
 // Chakra Tag is a multipart component (container / label / closeButton); styling
 // is keyed under those parts, so it needs a multi-style config with `parts`.
 exports.Tag = {
@@ -38,22 +34,20 @@ exports.Tag = {
         },
     },
     variants: {
-        solid: function (_a) {
-            var _b, _c;
-            var theme = _a.theme, _d = _a.colorScheme, colorScheme = _d === void 0 ? "primary" : _d;
-            var c = swatch(theme, colorScheme);
+        solid: ({ theme, colorScheme = "primary" }) => {
+            var _a, _b;
+            const c = swatch(theme, colorScheme);
             return {
                 container: {
                     bg: c[500],
-                    color: (_c = (_b = theme.colors) === null || _b === void 0 ? void 0 : _b.white) !== null && _c !== void 0 ? _c : "#fff",
+                    color: (_b = (_a = theme.colors) === null || _a === void 0 ? void 0 : _a.white) !== null && _b !== void 0 ? _b : "#fff",
                     _hover: { bg: c[600] },
                     _active: { bg: c[700] },
                 },
             };
         },
-        subtle: function (_a) {
-            var theme = _a.theme, _b = _a.colorScheme, colorScheme = _b === void 0 ? "primary" : _b;
-            var c = swatch(theme, colorScheme);
+        subtle: ({ theme, colorScheme = "primary" }) => {
+            const c = swatch(theme, colorScheme);
             return {
                 container: {
                     bg: c[50],
@@ -65,9 +59,8 @@ exports.Tag = {
                 },
             };
         },
-        outline: function (_a) {
-            var theme = _a.theme, _b = _a.colorScheme, colorScheme = _b === void 0 ? "primary" : _b;
-            var c = swatch(theme, colorScheme);
+        outline: ({ theme, colorScheme = "primary" }) => {
+            const c = swatch(theme, colorScheme);
             return {
                 container: {
                     border: "0.094rem solid",

package/dist/Components/Tag/TagProps.d.ts

@@ -11,3 +11,4 @@ export interface TagProps {
     size?: TagSize;
     variant?: TagVariant;
 }
+//# sourceMappingURL=TagProps.d.ts.map

package/dist/Components/Tag/TagProps.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"TagProps.d.ts","sourceRoot":"","sources":["../../../src/Components/Tag/TagProps.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,WAAW,EAAE,MAAM,OAAO,CAAC;AAEpC,MAAM,MAAM,cAAc,GACtB,SAAS,GACT,WAAW,GACX,UAAU,GACV,MAAM,GACN,KAAK,GACL,QAAQ,GACR,QAAQ,GACR,OAAO,GACP,MAAM,GACN,MAAM,GACN,MAAM,GACN,QAAQ,GACR,MAAM,CAAC;AAEX,MAAM,MAAM,OAAO,GAAG,IAAI,GAAG,IAAI,GAAG,IAAI,GAAG,IAAI,CAAC;AAEhD,MAAM,MAAM,UAAU,GAAG,OAAO,GAAG,SAAS,GAAG,QAAQ,CAAC;AAExD,MAAM,WAAW,QAAQ;IACvB,KAAK,EAAE,MAAM,CAAC;IACd,WAAW,CAAC,EAAE,MAAM,IAAI,CAAC;IACzB,UAAU,CAAC,EAAE,MAAM,IAAI,CAAC;IACxB,IAAI,CAAC,EAAE,WAAW,CAAC;IACnB,WAAW,CAAC,EAAE,cAAc,CAAC;IAC7B,IAAI,CAAC,EAAE,OAAO,CAAC;IACf,OAAO,CAAC,EAAE,UAAU,CAAC;CACtB"}

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

@@ -1,4 +1,4 @@
-import React from "react";
 import { TimelineProps } from "./TimelineProps";
-declare const Timeline: ({ timelineEvents, onEventClick }: TimelineProps) => React.JSX.Element;
+declare const Timeline: ({ timelineEvents, onEventClick }: TimelineProps) => import("react/jsx-runtime").JSX.Element;
 export default Timeline;
+//# sourceMappingURL=Timeline.d.ts.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"Timeline.d.ts","sourceRoot":"","sources":["../../../src/Components/Timeline/Timeline.tsx"],"names":[],"mappings":"AAgBA,OAAO,EAAkB,aAAa,EAAE,MAAM,iBAAiB,CAAC;AAIhE,QAAA,MAAM,QAAQ,GAAI,kCAAkC,aAAa,4CAmgBhE,CAAC;AAEF,eAAe,QAAQ,CAAC"}

package/dist/Components/Timeline/Timeline.js

@@ -1,43 +1,38 @@
 "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 lucide_react_1 = require("lucide-react");
-var useCustomTheme_1 = require("../../Theme/useCustomTheme");
-var functions_1 = require("../../Utils/functions");
-var Timeline = function (_a) {
-    var _b, _c, _d, _e, _f, _g, _h;
-    var timelineEvents = _a.timelineEvents, onEventClick = _a.onEventClick;
-    var theme = (0, useCustomTheme_1.useCustomTheme)();
-    var colors = (_b = theme.colors) !== null && _b !== void 0 ? _b : {};
-    var isMobile = (0, react_2.useBreakpointValue)({ base: true, md: false });
-    var formatTimestamp = function (timestamp, type) {
-        var parsedTimestamp;
+const jsx_runtime_1 = require("react/jsx-runtime");
+const react_1 = require("@chakra-ui/react");
+const lucide_react_1 = require("lucide-react");
+const useCustomTheme_1 = require("../../Theme/useCustomTheme");
+const functions_1 = require("../../Utils/functions");
+const Timeline = ({ timelineEvents, onEventClick }) => {
+    var _a, _b, _c, _d, _e, _f, _g;
+    const theme = (0, useCustomTheme_1.useCustomTheme)();
+    const colors = (_a = theme.colors) !== null && _a !== void 0 ? _a : {};
+    const isMobile = (0, react_1.useBreakpointValue)({ base: true, md: false });
+    const formatTimestamp = (timestamp, type) => {
         if (typeof timestamp === "string" && !timestamp.match(/^\d+$/)) {
-            var date_1 = new Date(timestamp);
-            if (!isNaN(date_1.getTime())) {
+            const date = new Date(timestamp);
+            if (!isNaN(date.getTime())) {
                 if (type === "date") {
-                    return date_1.toLocaleDateString("en-US", {
+                    return date.toLocaleDateString("en-US", {
                         month: "long",
                         day: "numeric",
                         year: "numeric",
                     });
                 }
                 else if (type === "time") {
-                    return date_1.toLocaleTimeString("en-US", {
+                    return date.toLocaleTimeString("en-US", {
                         hour: "numeric",
                         minute: "2-digit",
                         hour12: true,
                     });
                 }
-                return date_1.toLocaleString();
+                return date.toLocaleString();
             }
         }
-        parsedTimestamp = parseInt(timestamp, 10);
-        var date = new Date(parsedTimestamp);
+        const parsedTimestamp = parseInt(String(timestamp), 10);
+        const date = new Date(parsedTimestamp);
         if (isNaN(date.getTime())) {
             console.warn("Invalid timestamp:", timestamp);
             return "Invalid Date";
@@ -59,7 +54,7 @@ var Timeline = function (_a) {
         return date.toLocaleString();
     };
     // A semantic color scale chosen by the action title (created / updated / delete).
-    var getEventScale = function (title) {
+    const getEventScale = (title) => {
         var _a, _b, _c, _d, _e, _f;
         switch ((title || "").toLowerCase()) {
             case "created":
@@ -74,57 +69,54 @@ var Timeline = function (_a) {
         }
     };
     // Action-title icon (what happened); falls back to the source icon below.
-    var getActionIcon = function (title, size) {
+    const getActionIcon = (title, size) => {
         switch ((title || "").toLowerCase()) {
             case "created":
-                return react_1.default.createElement(lucide_react_1.Plus, { size: size });
+                return (0, jsx_runtime_1.jsx)(lucide_react_1.Plus, { size: size });
             case "updated":
-                return react_1.default.createElement(lucide_react_1.PencilLine, { size: size });
+                return (0, jsx_runtime_1.jsx)(lucide_react_1.PencilLine, { size: size });
             case "delete":
             case "deleted":
-                return react_1.default.createElement(lucide_react_1.Trash2, { size: size });
+                return (0, jsx_runtime_1.jsx)(lucide_react_1.Trash2, { size: size });
             default:
                 return null;
         }
     };
     // Source icon (where it came from) — preserves the original mapping.
-    var getSourceIcon = function (event, size) {
+    const getSourceIcon = (event, size) => {
         switch (event.action_from) {
             case "Accounts":
-                return react_1.default.createElement(lucide_react_1.IndianRupee, { size: size });
+                return (0, jsx_runtime_1.jsx)(lucide_react_1.IndianRupee, { size: size });
             case "Notes":
-                return react_1.default.createElement(lucide_react_1.FileText, { size: size });
+                return (0, jsx_runtime_1.jsx)(lucide_react_1.FileText, { size: size });
             default:
-                return react_1.default.createElement(lucide_react_1.Volleyball, { size: size });
+                return (0, jsx_runtime_1.jsx)(lucide_react_1.Volleyball, { size: size });
         }
     };
-    var getIcon = function (event, size) { var _a; return (_a = getActionIcon(event.title, size)) !== null && _a !== void 0 ? _a : getSourceIcon(event, size); };
-    var groupEventsByDate = function (events) {
-        return events.reduce(function (groups, event) {
-            var date = formatTimestamp(event.created_at, "date");
-            if (date !== "Invalid Date") {
-                if (!groups[date])
-                    groups[date] = [];
-                groups[date].push(event);
-            }
-            return groups;
-        }, {});
-    };
-    var groupedEvents = groupEventsByDate(timelineEvents);
-    var parseChanges = function (changes) {
+    const getIcon = (event, size) => { var _a; return (_a = getActionIcon(event.title, size)) !== null && _a !== void 0 ? _a : getSourceIcon(event, size); };
+    const groupEventsByDate = (events) => events.reduce((groups, event) => {
+        const date = formatTimestamp(event.created_at, "date");
+        if (date !== "Invalid Date") {
+            if (!groups[date])
+                groups[date] = [];
+            groups[date].push(event);
+        }
+        return groups;
+    }, {});
+    const groupedEvents = groupEventsByDate(timelineEvents);
+    const parseChanges = (changes) => {
         if (!changes || changes === "null")
             return [];
         try {
-            var parsed = typeof changes === "string" ? JSON.parse(changes) : changes;
+            const parsed = typeof changes === "string" ? JSON.parse(changes) : changes;
             if (typeof parsed !== "object" || parsed === null)
                 return [];
-            return Object.entries(parsed).map(function (_a) {
-                var _b;
-                var key = _a[0], value = _a[1];
-                var record = value;
+            return Object.entries(parsed).map(([key, value]) => {
+                var _a;
+                const record = value;
                 return {
                     field: key,
-                    from: (_b = record === null || record === void 0 ? void 0 : record.original) !== null && _b !== void 0 ? _b : null,
+                    from: (_a = record === null || record === void 0 ? void 0 : record.original) !== null && _a !== void 0 ? _a : null,
                     to: record === null || record === void 0 ? void 0 : record.updated,
                 };
             });
@@ -134,104 +126,61 @@ var Timeline = function (_a) {
             return [];
         }
     };
-    var initials = function (name) {
-        return (name || "")
-            .trim()
-            .split(/\s+/)
-            .map(function (p) { return p[0]; })
-            .slice(0, 2)
-            .join("")
-            .toUpperCase() || "?";
-    };
+    const initials = (name) => (name || "")
+        .trim()
+        .split(/\s+/)
+        .map((p) => p[0])
+        .slice(0, 2)
+        .join("")
+        .toUpperCase() || "?";
     if (!timelineEvents || timelineEvents.length === 0) {
-        return (react_1.default.createElement(react_2.Flex, { direction: "column", align: "center", justify: "center", py: 12, gap: 2, color: (_c = colors.gray) === null || _c === void 0 ? void 0 : _c[500] },
-            react_1.default.createElement(react_2.Box, { boxSize: "2.75rem", borderRadius: "full", bg: (_d = colors.gray) === null || _d === void 0 ? void 0 : _d[100], display: "flex", alignItems: "center", justifyContent: "center", color: (_e = colors.gray) === null || _e === void 0 ? void 0 : _e[400] },
-                react_1.default.createElement(lucide_react_1.Volleyball, { size: 20 })),
-            react_1.default.createElement(react_2.Text, { fontSize: "0.875rem", fontWeight: 500 }, "No timeline events to display")));
+        return ((0, jsx_runtime_1.jsxs)(react_1.Flex, { direction: "column", align: "center", justify: "center", py: 12, gap: 2, color: (_b = colors.gray) === null || _b === void 0 ? void 0 : _b[500], children: [(0, jsx_runtime_1.jsx)(react_1.Box, { boxSize: "2.75rem", borderRadius: "full", bg: (_c = colors.gray) === null || _c === void 0 ? void 0 : _c[100], display: "flex", alignItems: "center", justifyContent: "center", color: (_d = colors.gray) === null || _d === void 0 ? void 0 : _d[400], children: (0, jsx_runtime_1.jsx)(lucide_react_1.Volleyball, { size: 20 }) }), (0, jsx_runtime_1.jsx)(react_1.Text, { fontSize: "0.875rem", fontWeight: 500, children: "No timeline events to display" })] }));
     }
     // The colored event card (shared by both the desktop "tree" and mobile rail).
     // `accent` decides which edge carries the colored bar (pointing toward the spine).
-    var EventCard = function (_a) {
-        var _b, _c, _d, _e, _f, _g, _h, _j, _k, _l, _m, _o, _p, _q, _r, _s, _t, _u, _v, _w, _x, _y, _z;
-        var event = _a.event, index = _a.index, accent = _a.accent;
-        var scale = getEventScale(event.title);
-        var changes = parseChanges(event.changes);
-        var clickable = typeof onEventClick === "function";
-        return (react_1.default.createElement(react_2.Box, { position: "relative", zIndex: 1, bg: (_b = colors.white) !== null && _b !== void 0 ? _b : "#fff", border: "0.063rem solid ".concat((_d = (_c = colors.boxborder) === null || _c === void 0 ? void 0 : _c[300]) !== null && _d !== void 0 ? _d : (_e = colors.gray) === null || _e === void 0 ? void 0 : _e[200]), borderInlineStartWidth: accent === "left" ? "0.1875rem" : undefined, borderInlineEndWidth: accent === "right" ? "0.1875rem" : undefined, borderInlineStartColor: accent === "left" ? scale === null || scale === void 0 ? void 0 : scale[400] : undefined, borderInlineEndColor: accent === "right" ? scale === null || scale === void 0 ? void 0 : scale[400] : undefined, borderRadius: "0.625rem", px: 3.5, py: 2.5, transition: "all 0.15s ease", cursor: clickable ? "pointer" : "default", onClick: clickable ? function () { return onEventClick(event, index); } : undefined, _hover: {
-                borderColor: (_f = scale === null || scale === void 0 ? void 0 : scale[300]) !== null && _f !== void 0 ? _f : (_g = colors.gray) === null || _g === void 0 ? void 0 : _g[300],
-                boxShadow: (_h = theme.shadows) === null || _h === void 0 ? void 0 : _h.md,
+    const EventCard = ({ event, index, accent, }) => {
+        var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k, _l, _m, _o, _p, _q, _r, _s, _t, _u, _v, _w, _x, _y;
+        const scale = getEventScale(event.title);
+        const changes = parseChanges(event.changes);
+        const clickable = typeof onEventClick === "function";
+        return ((0, jsx_runtime_1.jsxs)(react_1.Box, { position: "relative", zIndex: 1, bg: (_a = colors.white) !== null && _a !== void 0 ? _a : "#fff", border: `0.063rem solid ${(_c = (_b = colors.boxborder) === null || _b === void 0 ? void 0 : _b[300]) !== null && _c !== void 0 ? _c : (_d = colors.gray) === null || _d === void 0 ? void 0 : _d[200]}`, borderInlineStartWidth: accent === "left" ? "0.1875rem" : undefined, borderInlineEndWidth: accent === "right" ? "0.1875rem" : undefined, borderInlineStartColor: accent === "left" ? scale === null || scale === void 0 ? void 0 : scale[400] : undefined, borderInlineEndColor: accent === "right" ? scale === null || scale === void 0 ? void 0 : scale[400] : undefined, borderRadius: "0.625rem", px: 3.5, py: 2.5, transition: "all 0.15s ease", cursor: clickable ? "pointer" : "default", onClick: clickable ? () => onEventClick(event, index) : undefined, _hover: {
+                borderColor: (_e = scale === null || scale === void 0 ? void 0 : scale[300]) !== null && _e !== void 0 ? _e : (_f = colors.gray) === null || _f === void 0 ? void 0 : _f[300],
+                boxShadow: (_g = theme.shadows) === null || _g === void 0 ? void 0 : _g.md,
                 transform: clickable ? "translateY(-1px)" : undefined,
-            } },
-            react_1.default.createElement(react_2.Flex, { align: "center", justify: "space-between", gap: 2, flexWrap: "wrap" },
-                react_1.default.createElement(react_2.Flex, { align: "center", gap: 2, minW: 0 },
-                    react_1.default.createElement(react_2.Text, { fontSize: "0.8125rem", fontWeight: 600, color: (_k = (_j = colors.text) === null || _j === void 0 ? void 0 : _j[800]) !== null && _k !== void 0 ? _k : (_l = colors.gray) === null || _l === void 0 ? void 0 : _l[800], noOfLines: 1 }, event.action_from),
-                    react_1.default.createElement(react_2.Box, { as: "span", fontSize: "0.6875rem", fontWeight: 600, lineHeight: "1", textTransform: "capitalize", color: (_m = scale === null || scale === void 0 ? void 0 : scale[700]) !== null && _m !== void 0 ? _m : scale === null || scale === void 0 ? void 0 : scale[600], bg: scale === null || scale === void 0 ? void 0 : scale[50], border: "0.063rem solid ".concat((_o = scale === null || scale === void 0 ? void 0 : scale[200]) !== null && _o !== void 0 ? _o : (_p = colors.gray) === null || _p === void 0 ? void 0 : _p[200]), borderRadius: "full", px: 2, py: 1 }, event.title)),
-                react_1.default.createElement(react_2.Text, { fontSize: "0.6875rem", color: (_q = colors.gray) === null || _q === void 0 ? void 0 : _q[500], whiteSpace: "nowrap" }, formatTimestamp(event.created_at, "time"))),
-            changes.length > 0 && (react_1.default.createElement(react_2.Flex, { direction: "column", gap: 1, mt: 2 }, changes.map(function (c, i) {
-                var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k, _l, _m, _o, _p;
-                return (react_1.default.createElement(react_2.Flex, { key: "".concat(c.field, "-").concat(i), align: "center", gap: 1.5, fontSize: "0.6875rem", lineHeight: "1.4", flexWrap: "wrap" },
-                    react_1.default.createElement(react_2.Text, { fontWeight: 600, color: (_b = (_a = colors.text) === null || _a === void 0 ? void 0 : _a[700]) !== null && _b !== void 0 ? _b : (_c = colors.gray) === null || _c === void 0 ? void 0 : _c[700] }, (0, functions_1.toWords)(c.field)),
-                    c.from !== null && c.from !== undefined && (react_1.default.createElement(react_1.default.Fragment, null,
-                        react_1.default.createElement(react_2.Box, { as: "span", color: (_d = colors.gray) === null || _d === void 0 ? void 0 : _d[500], bg: (_e = colors.gray) === null || _e === void 0 ? void 0 : _e[50], borderRadius: "0.25rem", px: 1.5, textDecoration: "line-through", maxW: "10rem", overflow: "hidden", textOverflow: "ellipsis", whiteSpace: "nowrap" }, String(c.from)),
-                        react_1.default.createElement(react_2.Box, { as: "span", color: (_f = colors.gray) === null || _f === void 0 ? void 0 : _f[400], display: "inline-flex" },
-                            react_1.default.createElement(lucide_react_1.ArrowRight, { size: 11 })))),
-                    react_1.default.createElement(react_2.Box, { as: "span", color: (_j = (_h = (_g = colors.semantic) === null || _g === void 0 ? void 0 : _g.success) === null || _h === void 0 ? void 0 : _h[700]) !== null && _j !== void 0 ? _j : (_k = colors.green) === null || _k === void 0 ? void 0 : _k[700], bg: (_o = (_m = (_l = colors.semantic) === null || _l === void 0 ? void 0 : _l.success) === null || _m === void 0 ? void 0 : _m[50]) !== null && _o !== void 0 ? _o : (_p = colors.green) === null || _p === void 0 ? void 0 : _p[50], borderRadius: "0.25rem", px: 1.5, maxW: "12rem", overflow: "hidden", textOverflow: "ellipsis", whiteSpace: "nowrap" }, String(c.to))));
-            }))),
-            react_1.default.createElement(react_2.Flex, { align: "center", gap: 2, mt: 2 },
-                react_1.default.createElement(react_2.Tooltip, { label: (0, functions_1.toWords)(event.action_by), placement: "top", hasArrow: true },
-                    react_1.default.createElement(react_2.Flex, { align: "center", justify: "center", boxSize: "1.25rem", minW: "1.25rem", borderRadius: "full", bg: (_t = (_s = (_r = colors.primary) === null || _r === void 0 ? void 0 : _r.opacity) === null || _s === void 0 ? void 0 : _s[16]) !== null && _t !== void 0 ? _t : (_u = colors.primary) === null || _u === void 0 ? void 0 : _u[50], color: (_v = colors.primary) === null || _v === void 0 ? void 0 : _v[600], fontSize: "0.5625rem", fontWeight: 700 }, initials((0, functions_1.toWords)(event.action_by)))),
-                react_1.default.createElement(react_2.Text, { fontSize: "0.6875rem", color: (_w = colors.gray) === null || _w === void 0 ? void 0 : _w[500] },
-                    "by",
-                    " ",
-                    react_1.default.createElement(react_2.Box, { as: "span", color: (_y = (_x = colors.text) === null || _x === void 0 ? void 0 : _x[700]) !== null && _y !== void 0 ? _y : (_z = colors.gray) === null || _z === void 0 ? void 0 : _z[700], fontWeight: 500 }, (0, functions_1.toWords)(event.action_by))))));
+            }, children: [(0, jsx_runtime_1.jsxs)(react_1.Flex, { align: "center", justify: "space-between", gap: 2, flexWrap: "wrap", children: [(0, jsx_runtime_1.jsxs)(react_1.Flex, { align: "center", gap: 2, minW: 0, children: [(0, jsx_runtime_1.jsx)(react_1.Text, { fontSize: "0.8125rem", fontWeight: 600, color: (_j = (_h = colors.text) === null || _h === void 0 ? void 0 : _h[800]) !== null && _j !== void 0 ? _j : (_k = colors.gray) === null || _k === void 0 ? void 0 : _k[800], noOfLines: 1, children: event.action_from }), (0, jsx_runtime_1.jsx)(react_1.Box, { as: "span", fontSize: "0.6875rem", fontWeight: 600, lineHeight: "1", textTransform: "capitalize", color: (_l = scale === null || scale === void 0 ? void 0 : scale[700]) !== null && _l !== void 0 ? _l : scale === null || scale === void 0 ? void 0 : scale[600], bg: scale === null || scale === void 0 ? void 0 : scale[50], border: `0.063rem solid ${(_m = scale === null || scale === void 0 ? void 0 : scale[200]) !== null && _m !== void 0 ? _m : (_o = colors.gray) === null || _o === void 0 ? void 0 : _o[200]}`, borderRadius: "full", px: 2, py: 1, children: event.title })] }), (0, jsx_runtime_1.jsx)(react_1.Text, { fontSize: "0.6875rem", color: (_p = colors.gray) === null || _p === void 0 ? void 0 : _p[500], whiteSpace: "nowrap", children: formatTimestamp(event.created_at, "time") })] }), changes.length > 0 && ((0, jsx_runtime_1.jsx)(react_1.Flex, { direction: "column", gap: 1, mt: 2, children: changes.map((c, i) => {
+                        var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k, _l, _m, _o, _p;
+                        return ((0, jsx_runtime_1.jsxs)(react_1.Flex, { align: "center", gap: 1.5, fontSize: "0.6875rem", lineHeight: "1.4", flexWrap: "wrap", children: [(0, jsx_runtime_1.jsx)(react_1.Text, { fontWeight: 600, color: (_b = (_a = colors.text) === null || _a === void 0 ? void 0 : _a[700]) !== null && _b !== void 0 ? _b : (_c = colors.gray) === null || _c === void 0 ? void 0 : _c[700], children: (0, functions_1.toWords)(c.field) }), c.from !== null && c.from !== undefined && ((0, jsx_runtime_1.jsxs)(jsx_runtime_1.Fragment, { children: [(0, jsx_runtime_1.jsx)(react_1.Box, { as: "span", color: (_d = colors.gray) === null || _d === void 0 ? void 0 : _d[500], bg: (_e = colors.gray) === null || _e === void 0 ? void 0 : _e[50], borderRadius: "0.25rem", px: 1.5, textDecoration: "line-through", maxW: "10rem", overflow: "hidden", textOverflow: "ellipsis", whiteSpace: "nowrap", children: String(c.from) }), (0, jsx_runtime_1.jsx)(react_1.Box, { as: "span", color: (_f = colors.gray) === null || _f === void 0 ? void 0 : _f[400], display: "inline-flex", children: (0, jsx_runtime_1.jsx)(lucide_react_1.ArrowRight, { size: 11 }) })] })), (0, jsx_runtime_1.jsx)(react_1.Box, { as: "span", color: (_j = (_h = (_g = colors.semantic) === null || _g === void 0 ? void 0 : _g.success) === null || _h === void 0 ? void 0 : _h[700]) !== null && _j !== void 0 ? _j : (_k = colors.green) === null || _k === void 0 ? void 0 : _k[700], bg: (_o = (_m = (_l = colors.semantic) === null || _l === void 0 ? void 0 : _l.success) === null || _m === void 0 ? void 0 : _m[50]) !== null && _o !== void 0 ? _o : (_p = colors.green) === null || _p === void 0 ? void 0 : _p[50], borderRadius: "0.25rem", px: 1.5, maxW: "12rem", overflow: "hidden", textOverflow: "ellipsis", whiteSpace: "nowrap", children: String(c.to) })] }, `${c.field}-${i}`));
+                    }) })), (0, jsx_runtime_1.jsxs)(react_1.Flex, { align: "center", gap: 2, mt: 2, children: [(0, jsx_runtime_1.jsx)(react_1.Tooltip, { label: (0, functions_1.toWords)(event.action_by), placement: "top", hasArrow: true, children: (0, jsx_runtime_1.jsx)(react_1.Flex, { align: "center", justify: "center", boxSize: "1.25rem", minW: "1.25rem", borderRadius: "full", bg: (_s = (_r = (_q = colors.primary) === null || _q === void 0 ? void 0 : _q.opacity) === null || _r === void 0 ? void 0 : _r[16]) !== null && _s !== void 0 ? _s : (_t = colors.primary) === null || _t === void 0 ? void 0 : _t[50], color: (_u = colors.primary) === null || _u === void 0 ? void 0 : _u[600], fontSize: "0.5625rem", fontWeight: 700, children: initials((0, functions_1.toWords)(event.action_by)) }) }), (0, jsx_runtime_1.jsxs)(react_1.Text, { fontSize: "0.6875rem", color: (_v = colors.gray) === null || _v === void 0 ? void 0 : _v[500], children: ["by", " ", (0, jsx_runtime_1.jsx)(react_1.Box, { as: "span", color: (_x = (_w = colors.text) === null || _w === void 0 ? void 0 : _w[700]) !== null && _x !== void 0 ? _x : (_y = colors.gray) === null || _y === void 0 ? void 0 : _y[700], fontWeight: 500, children: (0, functions_1.toWords)(event.action_by) })] })] })] }));
     };
-    var NODE = "1.875rem"; // 30px node, centered on the spine
-    var NODE_RADIUS = "0.9375rem";
-    var SPINE_GAP = "1.75rem"; // gap between spine and card edge
+    const NODE = "1.875rem"; // 30px node, centered on the spine
+    const NODE_RADIUS = "0.9375rem";
+    const SPINE_GAP = "1.75rem"; // gap between spine and card edge
     // -------------------------------------------------------------------------
     // Mobile: single left rail (alternating doesn't read well on narrow widths)
     // -------------------------------------------------------------------------
     if (isMobile) {
-        return (react_1.default.createElement(react_2.Box, { maxW: "100%", px: 2, py: 2 }, Object.keys(groupedEvents).map(function (date) {
-            var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k, _l;
-            return (react_1.default.createElement(react_2.Box, { key: date, mb: 2 },
-                react_1.default.createElement(react_2.Flex, { align: "center", gap: 3, mb: 4, mt: 2 },
-                    react_1.default.createElement(react_2.Text, { fontSize: "0.75rem", fontWeight: 600, textTransform: "uppercase", letterSpacing: "0.02em", color: (_a = colors.gray) === null || _a === void 0 ? void 0 : _a[500], bg: (_b = colors.gray) === null || _b === void 0 ? void 0 : _b[50], border: "0.063rem solid ".concat((_d = (_c = colors.boxborder) === null || _c === void 0 ? void 0 : _c[200]) !== null && _d !== void 0 ? _d : (_e = colors.gray) === null || _e === void 0 ? void 0 : _e[200]), borderRadius: "full", px: 3, py: 1, whiteSpace: "nowrap" }, date),
-                    react_1.default.createElement(react_2.Box, { flex: "1", h: "0.063rem", bg: (_g = (_f = colors.boxborder) === null || _f === void 0 ? void 0 : _f[200]) !== null && _g !== void 0 ? _g : (_h = colors.gray) === null || _h === void 0 ? void 0 : _h[200] })),
-                react_1.default.createElement(react_2.Box, { position: "relative" },
-                    react_1.default.createElement(react_2.Box, { position: "absolute", left: NODE_RADIUS, top: "0.5rem", bottom: "0.5rem", w: "0.1875rem", borderRadius: "full", bg: (_k = (_j = colors.gray) === null || _j === void 0 ? void 0 : _j[300]) !== null && _k !== void 0 ? _k : (_l = colors.boxborder) === null || _l === void 0 ? void 0 : _l[400], transform: "translateX(-50%)" }),
-                    groupedEvents[date].map(function (event, index) {
-                        var _a, _b, _c, _d;
-                        var scale = getEventScale(event.title);
-                        return (react_1.default.createElement(react_2.Flex, { key: "".concat((_a = event.logs_id) !== null && _a !== void 0 ? _a : date, "-").concat(index), align: "flex-start", gap: 3, mb: index === groupedEvents[date].length - 1 ? 0 : 3 },
-                            react_1.default.createElement(react_2.Flex, { align: "center", justify: "center", boxSize: NODE, minW: NODE, borderRadius: "full", bg: scale === null || scale === void 0 ? void 0 : scale[50], color: scale === null || scale === void 0 ? void 0 : scale[600], border: "0.125rem solid ".concat((_b = colors.white) !== null && _b !== void 0 ? _b : "#fff"), boxShadow: "0 0 0 0.063rem ".concat((_c = scale === null || scale === void 0 ? void 0 : scale[200]) !== null && _c !== void 0 ? _c : (_d = colors.gray) === null || _d === void 0 ? void 0 : _d[200]), zIndex: 1 }, getIcon(event, 14)),
-                            react_1.default.createElement(react_2.Box, { flex: "1", minW: 0 },
-                                react_1.default.createElement(EventCard, { event: event, index: index, accent: "left" }))));
-                    }))));
-        })));
+        return ((0, jsx_runtime_1.jsx)(react_1.Box, { maxW: "100%", px: 2, py: 2, children: Object.keys(groupedEvents).map((date) => {
+                var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k, _l;
+                return ((0, jsx_runtime_1.jsxs)(react_1.Box, { mb: 2, children: [(0, jsx_runtime_1.jsxs)(react_1.Flex, { align: "center", gap: 3, mb: 4, mt: 2, children: [(0, jsx_runtime_1.jsx)(react_1.Text, { fontSize: "0.75rem", fontWeight: 600, textTransform: "uppercase", letterSpacing: "0.02em", color: (_a = colors.gray) === null || _a === void 0 ? void 0 : _a[500], bg: (_b = colors.gray) === null || _b === void 0 ? void 0 : _b[50], border: `0.063rem solid ${(_d = (_c = colors.boxborder) === null || _c === void 0 ? void 0 : _c[200]) !== null && _d !== void 0 ? _d : (_e = colors.gray) === null || _e === void 0 ? void 0 : _e[200]}`, borderRadius: "full", px: 3, py: 1, whiteSpace: "nowrap", children: date }), (0, jsx_runtime_1.jsx)(react_1.Box, { flex: "1", h: "0.063rem", bg: (_g = (_f = colors.boxborder) === null || _f === void 0 ? void 0 : _f[200]) !== null && _g !== void 0 ? _g : (_h = colors.gray) === null || _h === void 0 ? void 0 : _h[200] })] }), (0, jsx_runtime_1.jsxs)(react_1.Box, { position: "relative", children: [(0, jsx_runtime_1.jsx)(react_1.Box, { position: "absolute", left: NODE_RADIUS, top: "0.5rem", bottom: "0.5rem", w: "0.1875rem", borderRadius: "full", bg: (_k = (_j = colors.gray) === null || _j === void 0 ? void 0 : _j[300]) !== null && _k !== void 0 ? _k : (_l = colors.boxborder) === null || _l === void 0 ? void 0 : _l[400], transform: "translateX(-50%)" }), groupedEvents[date].map((event, index) => {
+                                    var _a, _b, _c, _d;
+                                    const scale = getEventScale(event.title);
+                                    return ((0, jsx_runtime_1.jsxs)(react_1.Flex, { align: "flex-start", gap: 3, mb: index === groupedEvents[date].length - 1 ? 0 : 3, children: [(0, jsx_runtime_1.jsx)(react_1.Flex, { align: "center", justify: "center", boxSize: NODE, minW: NODE, borderRadius: "full", bg: scale === null || scale === void 0 ? void 0 : scale[50], color: scale === null || scale === void 0 ? void 0 : scale[600], border: `0.125rem solid ${(_a = colors.white) !== null && _a !== void 0 ? _a : "#fff"}`, boxShadow: `0 0 0 0.063rem ${(_b = scale === null || scale === void 0 ? void 0 : scale[200]) !== null && _b !== void 0 ? _b : (_c = colors.gray) === null || _c === void 0 ? void 0 : _c[200]}`, zIndex: 1, children: getIcon(event, 14) }), (0, jsx_runtime_1.jsx)(react_1.Box, { flex: "1", minW: 0, children: (0, jsx_runtime_1.jsx)(EventCard, { event: event, index: index, accent: "left" }) })] }, `${(_d = event.logs_id) !== null && _d !== void 0 ? _d : date}-${index}`));
+                                })] })] }, date));
+            }) }));
     }
     // -------------------------------------------------------------------------
     // Desktop: center spine with cards alternating left / right (the "tree")
     // -------------------------------------------------------------------------
-    return (react_1.default.createElement(react_2.Box, { position: "relative", maxW: "60rem", mx: "auto", px: 4, py: 2 },
-        react_1.default.createElement(react_2.Box, { position: "absolute", left: "50%", top: "0.5rem", bottom: "0.5rem", w: "0.015rem", borderRadius: "full", bg: (_g = (_f = colors.gray) === null || _f === void 0 ? void 0 : _f[300]) !== null && _g !== void 0 ? _g : (_h = colors.boxborder) === null || _h === void 0 ? void 0 : _h[400], transform: "translateX(-50%)" }),
-        Object.keys(groupedEvents).map(function (date) {
-            var _a, _b, _c, _d, _e, _f;
-            return (react_1.default.createElement(react_2.Box, { key: date, mb: 2 },
-                react_1.default.createElement(react_2.Flex, { justify: "center", mb: 5, mt: 3, position: "relative", zIndex: 2 },
-                    react_1.default.createElement(react_2.Text, { fontSize: "0.75rem", fontWeight: 600, textTransform: "uppercase", letterSpacing: "0.02em", color: (_a = colors.gray) === null || _a === void 0 ? void 0 : _a[600], bg: (_b = colors.white) !== null && _b !== void 0 ? _b : "#fff", border: "0.063rem solid ".concat((_d = (_c = colors.boxborder) === null || _c === void 0 ? void 0 : _c[300]) !== null && _d !== void 0 ? _d : (_e = colors.gray) === null || _e === void 0 ? void 0 : _e[200]), boxShadow: (_f = theme.shadows) === null || _f === void 0 ? void 0 : _f.xs, borderRadius: "full", px: 4, py: 1.5, whiteSpace: "nowrap" }, date)),
-                groupedEvents[date].map(function (event, index) {
-                    var _a, _b, _c, _d, _e, _f;
-                    var isLeft = index % 2 === 0;
-                    var scale = getEventScale(event.title);
-                    return (react_1.default.createElement(react_2.Box, { key: "".concat((_a = event.logs_id) !== null && _a !== void 0 ? _a : date, "-").concat(index), position: "relative", mb: index === groupedEvents[date].length - 1 ? 0 : 5, minH: NODE },
-                        react_1.default.createElement(react_2.Box, { position: "absolute", top: "1.375rem", h: "0.125rem", w: "0.8125rem", bg: (_b = scale === null || scale === void 0 ? void 0 : scale[300]) !== null && _b !== void 0 ? _b : (_c = colors.gray) === null || _c === void 0 ? void 0 : _c[300], left: isLeft
-                                ? "calc(50% - ".concat(SPINE_GAP, ")")
-                                : "calc(50% + ".concat(NODE_RADIUS, ")"), zIndex: 0 }),
-                        react_1.default.createElement(react_2.Flex, { position: "absolute", left: "50%", top: "0.5rem", transform: "translateX(-50%)", align: "center", justify: "center", boxSize: NODE, borderRadius: "full", bg: scale === null || scale === void 0 ? void 0 : scale[50], color: scale === null || scale === void 0 ? void 0 : scale[600], border: "0.125rem solid ".concat((_d = colors.white) !== null && _d !== void 0 ? _d : "#fff"), boxShadow: "0 0 0 0.063rem ".concat((_e = scale === null || scale === void 0 ? void 0 : scale[200]) !== null && _e !== void 0 ? _e : (_f = colors.gray) === null || _f === void 0 ? void 0 : _f[200]), zIndex: 2 }, getIcon(event, 15)),
-                        react_1.default.createElement(react_2.Box, { position: "relative", zIndex: 1, w: "calc(50% - ".concat(SPINE_GAP, ")"), ml: isLeft ? 0 : "calc(50% + ".concat(SPINE_GAP, ")") },
-                            react_1.default.createElement(EventCard, { event: event, index: index, accent: isLeft ? "right" : "left" }))));
-                })));
-        })));
+    return ((0, jsx_runtime_1.jsxs)(react_1.Box, { position: "relative", maxW: "60rem", mx: "auto", px: 4, py: 2, children: [(0, jsx_runtime_1.jsx)(react_1.Box, { position: "absolute", left: "50%", top: "0.5rem", bottom: "0.5rem", w: "0.015rem", borderRadius: "full", bg: (_f = (_e = colors.gray) === null || _e === void 0 ? void 0 : _e[300]) !== null && _f !== void 0 ? _f : (_g = colors.boxborder) === null || _g === void 0 ? void 0 : _g[400], transform: "translateX(-50%)" }), Object.keys(groupedEvents).map((date) => {
+                var _a, _b, _c, _d, _e, _f;
+                return ((0, jsx_runtime_1.jsxs)(react_1.Box, { mb: 2, children: [(0, jsx_runtime_1.jsx)(react_1.Flex, { justify: "center", mb: 5, mt: 3, position: "relative", zIndex: 2, children: (0, jsx_runtime_1.jsx)(react_1.Text, { fontSize: "0.75rem", fontWeight: 600, textTransform: "uppercase", letterSpacing: "0.02em", color: (_a = colors.gray) === null || _a === void 0 ? void 0 : _a[600], bg: (_b = colors.white) !== null && _b !== void 0 ? _b : "#fff", border: `0.063rem solid ${(_d = (_c = colors.boxborder) === null || _c === void 0 ? void 0 : _c[300]) !== null && _d !== void 0 ? _d : (_e = colors.gray) === null || _e === void 0 ? void 0 : _e[200]}`, boxShadow: (_f = theme.shadows) === null || _f === void 0 ? void 0 : _f.xs, borderRadius: "full", px: 4, py: 1.5, whiteSpace: "nowrap", children: date }) }), groupedEvents[date].map((event, index) => {
+                            var _a, _b, _c, _d, _e, _f;
+                            const isLeft = index % 2 === 0;
+                            const scale = getEventScale(event.title);
+                            return ((0, jsx_runtime_1.jsxs)(react_1.Box, { position: "relative", mb: index === groupedEvents[date].length - 1 ? 0 : 5, minH: NODE, children: [(0, jsx_runtime_1.jsx)(react_1.Box, { position: "absolute", top: "1.375rem", h: "0.125rem", w: "0.8125rem", bg: (_a = scale === null || scale === void 0 ? void 0 : scale[300]) !== null && _a !== void 0 ? _a : (_b = colors.gray) === null || _b === void 0 ? void 0 : _b[300], left: isLeft
+                                            ? `calc(50% - ${SPINE_GAP})`
+                                            : `calc(50% + ${NODE_RADIUS})`, zIndex: 0 }), (0, jsx_runtime_1.jsx)(react_1.Flex, { position: "absolute", left: "50%", top: "0.5rem", transform: "translateX(-50%)", align: "center", justify: "center", boxSize: NODE, borderRadius: "full", bg: scale === null || scale === void 0 ? void 0 : scale[50], color: scale === null || scale === void 0 ? void 0 : scale[600], border: `0.125rem solid ${(_c = colors.white) !== null && _c !== void 0 ? _c : "#fff"}`, boxShadow: `0 0 0 0.063rem ${(_d = scale === null || scale === void 0 ? void 0 : scale[200]) !== null && _d !== void 0 ? _d : (_e = colors.gray) === null || _e === void 0 ? void 0 : _e[200]}`, zIndex: 2, children: getIcon(event, 15) }), (0, jsx_runtime_1.jsx)(react_1.Box, { position: "relative", zIndex: 1, w: `calc(50% - ${SPINE_GAP})`, ml: isLeft ? 0 : `calc(50% + ${SPINE_GAP})`, children: (0, jsx_runtime_1.jsx)(EventCard, { event: event, index: index, accent: isLeft ? "right" : "left" }) })] }, `${(_f = event.logs_id) !== null && _f !== void 0 ? _f : date}-${index}`));
+                        })] }, date));
+            })] }));
 };
 exports.default = Timeline;

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

@@ -16,5 +16,6 @@ export interface TimelineEvents {
     action_from: string;
     action_by: string;
     created_at: number;
-    changes: any;
+    changes: unknown;
 }
+//# sourceMappingURL=TimelineProps.d.ts.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"TimelineProps.d.ts","sourceRoot":"","sources":["../../../src/Components/Timeline/TimelineProps.tsx"],"names":[],"mappings":"AAAA,MAAM,WAAW,aAAa;IAC5B,MAAM,CAAC,EAAE,aAAa,EAAE,CAAC;IACzB,cAAc,EAAE,cAAc,EAAE,CAAC;IACjC,YAAY,CAAC,EAAE,CAAC,KAAK,EAAE,cAAc,EAAE,KAAK,EAAE,MAAM,KAAK,IAAI,CAAC;CAC/D;AAED,MAAM,WAAW,aAAa;IAC5B,KAAK,EAAE,MAAM,CAAC;IACd,WAAW,EAAE,MAAM,CAAC;IACpB,IAAI,EAAE,MAAM,CAAC;CACd;AAED,MAAM,WAAW,cAAc;IAC7B,OAAO,EAAE,MAAM,CAAC;IAChB,KAAK,EAAE,MAAM,CAAC;IACd,UAAU,EAAE,MAAM,CAAC;IACnB,OAAO,EAAE,MAAM,CAAC;IAChB,WAAW,EAAE,MAAM,CAAC;IACpB,SAAS,EAAE,MAAM,CAAC;IAClB,UAAU,EAAE,MAAM,CAAC;IACnB,OAAO,EAAE,OAAO,CAAC;CAClB"}

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

@@ -1,4 +1,4 @@
-import React from "react";
 import { ToasterChildren, ToasterContextType } from "./ToasterProps";
-export default function ToasterProvider({ children }: ToasterChildren): React.JSX.Element;
+export default function ToasterProvider({ children }: ToasterChildren): import("react/jsx-runtime").JSX.Element;
 export declare const useToaster: () => ToasterContextType;
+//# sourceMappingURL=Toaster.d.ts.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"Toaster.d.ts","sourceRoot":"","sources":["../../../src/Components/Toaster/Toaster.tsx"],"names":[],"mappings":"AAiBA,OAAO,EAAE,eAAe,EAAE,kBAAkB,EAAE,MAAM,gBAAgB,CAAC;AAUrE,MAAM,CAAC,OAAO,UAAU,eAAe,CAAC,EAAE,QAAQ,EAAE,EAAE,eAAe,2CAyIpE;AAED,eAAO,MAAM,UAAU,0BAMtB,CAAC"}