pixelize-design-library 2.3.19 → 2.3.21

package/.cursor/modules/overlays/MODULE.md

@@ -2,7 +2,7 @@
 
 ## Purpose
 
-Modal, AlertDialog, ToolTip, Toaster (+ `useToaster` hook).
+Modal, AlertDialog, ToolTip / OverflowToolTip, Toaster (+ `useToaster` hook).
 
 ## Key paths
 
@@ -10,4 +10,21 @@ Modal, AlertDialog, ToolTip, Toaster (+ `useToaster` hook).
 
 ## Key rules
 
+- **Toaster `showToast({ actions })`:** optional `actions?: (onClose) => ReactNode`
+  renders action buttons under the message (e.g. Jira-style "View" / "Copy link").
+  The render-prop receives the toast's own `onClose` so an action can dismiss it;
+  callers style the buttons with their app theme. Prefer this over a bespoke Chakra
+  `useToast` in a consumer app — a second `useToast` renders into a *different* toast
+  portal that a `Modal`'s overlay/focus-trap can hide, so the toast silently never
+  appears. The toast card slides in (framer tween), pulses the status icon once on
+  mount, and **pauses the auto-dismiss countdown on hover** so the user can read and
+  click an action before it dismisses.
 - Modal exports ModalHeader, ModalBody, ModalFooter subcomponents
+- **ToolTip `overflowOnly`:** pass `overflowOnly` to show the tooltip **only**
+  when the child text is actually truncated (ellipsis active) — no tooltip when
+  it fits. The child must be the single clamping element (e.g. `Text` with
+  `noOfLines`); its ref is managed internally. Works for single- and multi-line
+  clamps and combines with `isDisabled`. **`OverflowToolTip`** is sugar for
+  `<ToolTip overflowOnly>`. Powered by the `useIsTruncated` hook (see
+  `utils-hooks`). Inert unless `overflowOnly` is set — no measurement/observer
+  for ordinary tooltips, and it never measures on hover/scroll.

package/.cursor/modules/utils-hooks/MODULE.md

@@ -2,12 +2,22 @@
 
 ## Purpose
 
-Shared utilities and hooks: debounce, table helpers, preferences.
+Shared utilities and hooks: debounce, table helpers, preferences, ref merging,
+truncation detection.
 
 ## Key paths
 
-- `src/Utils/table.ts`, `src/Hooks/usePreferences.ts`, `src/services/feedback.ts`
+- `src/Utils/table.ts`, `src/Utils/mergeRefs.ts`, `src/Hooks/usePreferences.ts`,
+  `src/Hooks/useIsTruncated.ts`, `src/services/feedback.ts`
 
 ## Key rules
 
 - `debounce` exported from index.ts
+- **`useIsTruncated(content?, enabled?)`** (exported) — returns `{ ref, isTruncated }`;
+  attach `ref` to a clamped element to detect real overflow (`scrollWidth/Height`
+  vs `clientWidth/Height`, single- and multi-line). Re-measures on mount, element
+  resize (`ResizeObserver`), and `content` change — never on hover/scroll. Pass
+  `enabled=false` to make it fully inert. Powers `ToolTip overflowOnly` (see
+  `overlays`).
+- **`mergeRefs(...refs)`** (internal) — combine a caller ref with an injected one
+  when cloning an element.

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

@@ -1 +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"}
+{"version":3,"file":"Toaster.d.ts","sourceRoot":"","sources":["../../../src/Components/Toaster/Toaster.tsx"],"names":[],"mappings":"AAkBA,OAAO,EAAE,eAAe,EAAE,kBAAkB,EAAqB,MAAM,gBAAgB,CAAC;AAyKxF,MAAM,CAAC,OAAO,UAAU,eAAe,CAAC,EAAE,QAAQ,EAAE,EAAE,eAAe,2CAkEpE;AAED,eAAO,MAAM,UAAU,0BAMtB,CAAC"}

package/dist/Components/Toaster/Toaster.js

@@ -6,20 +6,68 @@ const jsx_runtime_1 = require("react/jsx-runtime");
 const react_1 = require("react");
 const react_2 = require("@chakra-ui/react");
 const react_3 = require("@emotion/react");
+const framer_motion_1 = require("framer-motion");
 const lucide_react_1 = require("lucide-react");
 const ToasterContext = (0, react_1.createContext)(undefined);
 const shrink = (0, react_3.keyframes) `
   from { transform: scaleX(1); }
   to { transform: scaleX(0); }
 `;
+// One-shot ring pulse on the status icon — a subtle "just happened" beat.
+const iconPulse = (0, react_3.keyframes) `
+  0%   { box-shadow: 0 0 0 0 var(--toast-pulse-color); }
+  70%  { box-shadow: 0 0 0 0.5rem transparent; }
+  100% { box-shadow: 0 0 0 0 transparent; }
+`;
+const MotionBox = (0, framer_motion_1.motion)(react_2.Box);
+/**
+ * Presentational toast card. Owns hover state so the auto-dismiss countdown
+ * pauses while the pointer is over the toast — the user can read and click an
+ * action without the toast vanishing mid-reach.
+ */
+function ToastCard({ onClose, title, description, actions, isClosable, duration, meta, colors: c, shadowLg, }) {
+    var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k, _l, _m, _o, _p, _q, _r, _s, _t, _u, _v, _w, _x, _y, _z, _0, _1, _2, _3, _4, _5, _6;
+    const [paused, setPaused] = (0, react_1.useState)(false);
+    const solid = (_d = (_b = (_a = meta.scale) === null || _a === void 0 ? void 0 : _a[500]) !== null && _b !== void 0 ? _b : (_c = c === null || c === void 0 ? void 0 : c.gray) === null || _c === void 0 ? void 0 : _c[500]) !== null && _d !== void 0 ? _d : "#718096";
+    const soft = (_h = (_f = (_e = meta.scale) === null || _e === void 0 ? void 0 : _e[50]) !== null && _f !== void 0 ? _f : (_g = c === null || c === void 0 ? void 0 : c.gray) === null || _g === void 0 ? void 0 : _g[50]) !== null && _h !== void 0 ? _h : "#f7fafc";
+    const accent = (_k = (_j = meta.scale) === null || _j === void 0 ? void 0 : _j[600]) !== null && _k !== void 0 ? _k : solid;
+    const ringTint = (_m = (_l = meta.scale) === null || _l === void 0 ? void 0 : _l[200]) !== null && _m !== void 0 ? _m : soft;
+    const showProgress = typeof duration === "number" && duration > 0;
+    return ((0, jsx_runtime_1.jsxs)(MotionBox
+    // Refined entrance — slides in from the right and settles, never a hard pop.
+    // framer owns ALL transform animation; the CSS transition below is limited to
+    // box-shadow so it never tweens the same `transform` framer is driving frame
+    // by frame (that double-drive is what caused the ~200ms entry flicker). A
+    // tween (not spring) lands on an exact end transform, so there's no residual
+    // sub-pixel settle to shimmer.
+    , { 
+        // Refined entrance — slides in from the right and settles, never a hard pop.
+        // framer owns ALL transform animation; the CSS transition below is limited to
+        // box-shadow so it never tweens the same `transform` framer is driving frame
+        // by frame (that double-drive is what caused the ~200ms entry flicker). A
+        // tween (not spring) lands on an exact end transform, so there's no residual
+        // sub-pixel settle to shimmer.
+        initial: { opacity: 0, x: 24 }, animate: { opacity: 1, x: 0 }, exit: { opacity: 0, x: 24 }, transition: { duration: 0.24, ease: [0.22, 1, 0.36, 1] }, onHoverStart: () => setPaused(true), onHoverEnd: () => setPaused(false), position: "relative", bg: (_o = c === null || c === void 0 ? void 0 : c.white) !== null && _o !== void 0 ? _o : "#fff", border: `0.063rem solid ${(_s = (_q = (_p = c === null || c === void 0 ? void 0 : c.boxborder) === null || _p === void 0 ? void 0 : _p[300]) !== null && _q !== void 0 ? _q : (_r = c === null || c === void 0 ? void 0 : c.gray) === null || _r === void 0 ? void 0 : _r[200]) !== null && _s !== void 0 ? _s : "#e2e8f0"}`, boxShadow: shadowLg !== null && shadowLg !== void 0 ? shadowLg : "lg", borderRadius: "0.875rem", overflow: "hidden", minW: "22.5rem", maxW: "26rem", willChange: "transform, opacity", sx: {
+            transition: "box-shadow 0.18s ease",
+            _hover: { boxShadow: "xl" },
+        }, children: [(0, jsx_runtime_1.jsxs)(react_2.Flex, { p: 3.5, gap: 3, align: actions ? "flex-start" : "center", children: [(0, jsx_runtime_1.jsx)(react_2.Flex, { align: "center", justify: "center", boxSize: "2rem", minW: "2rem", borderRadius: "full", bg: soft, color: accent, sx: {
+                            ["--toast-pulse-color"]: ringTint,
+                            animation: `${iconPulse} 900ms ease-out 1`,
+                        }, children: meta.icon }), (0, jsx_runtime_1.jsxs)(react_2.Box, { flex: "1", minW: 0, children: [title && ((0, jsx_runtime_1.jsx)(react_2.Text, { fontWeight: 600, fontSize: "0.875rem", lineHeight: "1.3", color: (_w = (_u = (_t = c === null || c === void 0 ? void 0 : c.text) === null || _t === void 0 ? void 0 : _t[800]) !== null && _u !== void 0 ? _u : (_v = c === null || c === void 0 ? void 0 : c.gray) === null || _v === void 0 ? void 0 : _v[800]) !== null && _w !== void 0 ? _w : "#2d3748", children: title })), description && ((0, jsx_runtime_1.jsx)(react_2.Text, { fontSize: "0.8125rem", lineHeight: "1.45", color: (_0 = (_y = (_x = c === null || c === void 0 ? void 0 : c.gray) === null || _x === void 0 ? void 0 : _x[600]) !== null && _y !== void 0 ? _y : (_z = c === null || c === void 0 ? void 0 : c.text) === null || _z === void 0 ? void 0 : _z[600]) !== null && _0 !== void 0 ? _0 : "#718096", mt: title ? "0.125rem" : 0, children: description })), actions && ((0, jsx_runtime_1.jsx)(react_2.Flex, { gap: 2, mt: 2.5, align: "center", wrap: "wrap", children: actions(onClose) }))] }), isClosable && ((0, jsx_runtime_1.jsx)(react_2.CloseButton, { onClick: onClose, size: "sm", color: (_2 = (_1 = c === null || c === void 0 ? void 0 : c.gray) === null || _1 === void 0 ? void 0 : _1[400]) !== null && _2 !== void 0 ? _2 : "#a0aec0", borderRadius: "md", alignSelf: "flex-start", _hover: {
+                            bg: (_4 = (_3 = c === null || c === void 0 ? void 0 : c.gray) === null || _3 === void 0 ? void 0 : _3[100]) !== null && _4 !== void 0 ? _4 : "#edf2f7",
+                            color: (_6 = (_5 = c === null || c === void 0 ? void 0 : c.gray) === null || _5 === void 0 ? void 0 : _5[700]) !== null && _6 !== void 0 ? _6 : "#4a5568",
+                        } }))] }), showProgress && ((0, jsx_runtime_1.jsx)(react_2.Box, { position: "absolute", bottom: 0, left: 0, right: 0, h: "0.1875rem", bg: solid, opacity: 0.85, transformOrigin: "left", sx: {
+                    animation: `${shrink} ${duration}ms linear forwards`,
+                    animationPlayState: paused ? "paused" : "running",
+                } }))] }));
+}
 function ToasterProvider({ children }) {
     var _a;
     const toast = (0, react_2.useToast)();
     const theme = (0, react_2.useTheme)();
     const c = (_a = theme.colors) !== null && _a !== void 0 ? _a : {};
-    const showToast = ({ title, description, status = "info", duration = 5000, isClosable = true, position = "top-right", onClose, }) => {
-        var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k, _l, _m, _o, _p, _q, _r;
-        // Status → semantic color scale + icon (falls back to legacy palettes).
+    const showToast = ({ title, description, status = "info", duration = 5000, isClosable = true, position = "top-right", onClose, actions, }) => {
+        var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k, _l;
         const statusConfig = {
             success: {
                 scale: (_b = (_a = c.semantic) === null || _a === void 0 ? void 0 : _a.success) !== null && _b !== void 0 ? _b : c.green,
@@ -42,21 +90,15 @@ function ToasterProvider({ children }) {
                 icon: (0, jsx_runtime_1.jsx)(react_2.Spinner, { size: "sm", thickness: "0.125rem", speed: "0.7s" }),
             },
         };
-        const { scale, icon } = (_l = statusConfig[status]) !== null && _l !== void 0 ? _l : statusConfig.info;
-        const solid = (_m = scale === null || scale === void 0 ? void 0 : scale[500]) !== null && _m !== void 0 ? _m : (_o = c.gray) === null || _o === void 0 ? void 0 : _o[500];
-        const soft = (_p = scale === null || scale === void 0 ? void 0 : scale[50]) !== null && _p !== void 0 ? _p : (_q = c.gray) === null || _q === void 0 ? void 0 : _q[50];
-        const accent = (_r = scale === null || scale === void 0 ? void 0 : scale[600]) !== null && _r !== void 0 ? _r : solid;
-        const showProgress = typeof duration === "number" && duration > 0;
+        const meta = (_l = statusConfig[status]) !== null && _l !== void 0 ? _l : statusConfig.info;
         toast({
             duration,
             isClosable,
             position,
             onCloseComplete: onClose,
             render: ({ onClose }) => {
-                var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k, _l, _m, _o, _p, _q;
-                return ((0, jsx_runtime_1.jsxs)(react_2.Box, { position: "relative", bg: (_a = c.white) !== null && _a !== void 0 ? _a : "#fff", border: `0.063rem solid ${(_c = (_b = c.boxborder) === null || _b === void 0 ? void 0 : _b[300]) !== null && _c !== void 0 ? _c : (_d = c.gray) === null || _d === void 0 ? void 0 : _d[200]}`, boxShadow: (_f = (_e = theme.shadows) === null || _e === void 0 ? void 0 : _e.lg) !== null && _f !== void 0 ? _f : "lg", borderRadius: "0.75rem", overflow: "hidden", minW: "22.5rem", maxW: "26rem", children: [(0, jsx_runtime_1.jsxs)(react_2.Flex, { p: 3.5, gap: 3, align: "center", children: [(0, jsx_runtime_1.jsx)(react_2.Flex, { align: "center", justify: "center", boxSize: "2rem", minW: "2rem", borderRadius: "full", bg: soft, color: accent, children: icon }), (0, jsx_runtime_1.jsxs)(react_2.Box, { flex: "1", minW: 0, children: [title && ((0, jsx_runtime_1.jsx)(react_2.Text, { fontWeight: 600, fontSize: "0.875rem", lineHeight: "1.3", color: (_h = (_g = c.text) === null || _g === void 0 ? void 0 : _g[800]) !== null && _h !== void 0 ? _h : (_j = c.gray) === null || _j === void 0 ? void 0 : _j[800], children: title })), description && ((0, jsx_runtime_1.jsx)(react_2.Text, { fontSize: "0.8125rem", lineHeight: "1.45", color: (_l = (_k = c.gray) === null || _k === void 0 ? void 0 : _k[600]) !== null && _l !== void 0 ? _l : (_m = c.text) === null || _m === void 0 ? void 0 : _m[600], mt: title ? "0.125rem" : 0, children: description }))] }), isClosable && ((0, jsx_runtime_1.jsx)(react_2.CloseButton, { onClick: onClose, size: "sm", color: (_o = c.gray) === null || _o === void 0 ? void 0 : _o[500], borderRadius: "md", _hover: { bg: (_p = c.gray) === null || _p === void 0 ? void 0 : _p[100], color: (_q = c.gray) === null || _q === void 0 ? void 0 : _q[700] } }))] }), showProgress && ((0, jsx_runtime_1.jsx)(react_2.Box, { position: "absolute", bottom: 0, left: 0, right: 0, h: "0.1875rem", bg: solid, transformOrigin: "left", sx: {
-                                animation: `${shrink} ${duration}ms linear forwards`,
-                            } }))] }));
+                var _a;
+                return ((0, jsx_runtime_1.jsx)(ToastCard, { onClose: onClose, title: title, description: description, actions: actions, isClosable: isClosable, duration: duration, meta: meta, colors: c, shadowLg: (_a = theme.shadows) === null || _a === void 0 ? void 0 : _a.lg }));
             },
         });
     };

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

@@ -3,6 +3,13 @@ import { ReactNode } from "react";
 export type ToasterToastProps = Pick<ToastProps, 'description' | 'title' | 'isClosable' | 'duration' | 'children' | 'onClose'> & {
     position?: "top" | "bottom" | "top-right" | "top-left" | "bottom-right" | "bottom-left";
     status?: "success" | "error" | "warning" | "info" | "loading";
+    /**
+     * Optional action buttons rendered under the message (Jira-style "View" /
+     * "Copy link" affordances). Receives the toast's own `onClose` so an action
+     * can dismiss the toast. Kept a render-prop so callers style buttons with
+     * their app theme; the Toaster only positions them.
+     */
+    actions?: (onClose: () => void) => ReactNode;
 };
 export interface ToasterContextType {
     showToast: (children: ToasterToastProps) => void;

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

@@ -1 +1 @@
-{"version":3,"file":"ToasterProps.d.ts","sourceRoot":"","sources":["../../../src/Components/Toaster/ToasterProps.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,UAAU,EAAE,MAAM,kBAAkB,CAAC;AAC9C,OAAO,EAAE,SAAS,EAAE,MAAM,OAAO,CAAC;AAElC,MAAM,MAAM,iBAAiB,GAAG,IAAI,CAAC,UAAU,EAAE,aAAa,GAAG,OAAO,GAAG,YAAY,GAAG,UAAU,GAAG,UAAU,GAAG,SAAS,CAAC,GAAG;IAC7H,QAAQ,CAAC,EAAE,KAAK,GAAG,QAAQ,GAAG,WAAW,GAAG,UAAU,GAAG,cAAc,GAAG,aAAa,CAAA;IACvF,MAAM,CAAC,EAAE,SAAS,GAAG,OAAO,GAAG,SAAS,GAAG,MAAM,GAAG,SAAS,CAAA;CAChE,CAAA;AAED,MAAM,WAAW,kBAAkB;IAC/B,SAAS,EAAE,CAAC,QAAQ,EAAE,iBAAiB,KAAK,IAAI,CAAA;CACnD;AAED,MAAM,WAAW,eAAe;IAC5B,QAAQ,EAAE,SAAS,CAAC;CACvB"}
+{"version":3,"file":"ToasterProps.d.ts","sourceRoot":"","sources":["../../../src/Components/Toaster/ToasterProps.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,UAAU,EAAE,MAAM,kBAAkB,CAAC;AAC9C,OAAO,EAAE,SAAS,EAAE,MAAM,OAAO,CAAC;AAElC,MAAM,MAAM,iBAAiB,GAAG,IAAI,CAAC,UAAU,EAAE,aAAa,GAAG,OAAO,GAAG,YAAY,GAAG,UAAU,GAAG,UAAU,GAAG,SAAS,CAAC,GAAG;IAC7H,QAAQ,CAAC,EAAE,KAAK,GAAG,QAAQ,GAAG,WAAW,GAAG,UAAU,GAAG,cAAc,GAAG,aAAa,CAAA;IACvF,MAAM,CAAC,EAAE,SAAS,GAAG,OAAO,GAAG,SAAS,GAAG,MAAM,GAAG,SAAS,CAAA;IAC7D;;;;;OAKG;IACH,OAAO,CAAC,EAAE,CAAC,OAAO,EAAE,MAAM,IAAI,KAAK,SAAS,CAAA;CAC/C,CAAA;AAED,MAAM,WAAW,kBAAkB;IAC/B,SAAS,EAAE,CAAC,QAAQ,EAAE,iBAAiB,KAAK,IAAI,CAAA;CACnD;AAED,MAAM,WAAW,eAAe;IAC5B,QAAQ,EAAE,SAAS,CAAC;CACvB"}

package/dist/Components/ToolTip/OverflowToolTip.d.ts

@@ -0,0 +1,18 @@
+import { ToolTipProps } from "./ToolTipProps";
+/**
+ * A tooltip that only appears when its child text is actually truncated
+ * (ellipsis active) — no tooltip when the text fully fits. Thin sugar over
+ * `<ToolTip overflowOnly>`; use it wherever you clamp text with `noOfLines` /
+ * ellipsis and want the full text revealed only when it's cut off.
+ *
+ * The child must be the single element that clamps the text (e.g. a Chakra
+ * `Text` with `noOfLines`); its ref is managed internally. Works for both
+ * single-line and multi-line clamps.
+ *
+ * @example
+ * <OverflowToolTip label={title}>
+ *   <Text noOfLines={1}>{title}</Text>
+ * </OverflowToolTip>
+ */
+export default function OverflowToolTip(props: ToolTipProps): import("react/jsx-runtime").JSX.Element;
+//# sourceMappingURL=OverflowToolTip.d.ts.map

package/dist/Components/ToolTip/OverflowToolTip.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"OverflowToolTip.d.ts","sourceRoot":"","sources":["../../../src/Components/ToolTip/OverflowToolTip.tsx"],"names":[],"mappings":"AACA,OAAO,EAAE,YAAY,EAAE,MAAM,gBAAgB,CAAC;AAE9C;;;;;;;;;;;;;;GAcG;AACH,MAAM,CAAC,OAAO,UAAU,eAAe,CAAC,KAAK,EAAE,YAAY,2CAE1D"}

package/dist/Components/ToolTip/OverflowToolTip.js

@@ -0,0 +1,26 @@
+"use strict";
+var __importDefault = (this && this.__importDefault) || function (mod) {
+    return (mod && mod.__esModule) ? mod : { "default": mod };
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.default = OverflowToolTip;
+const jsx_runtime_1 = require("react/jsx-runtime");
+const ToolTip_1 = __importDefault(require("./ToolTip"));
+/**
+ * A tooltip that only appears when its child text is actually truncated
+ * (ellipsis active) — no tooltip when the text fully fits. Thin sugar over
+ * `<ToolTip overflowOnly>`; use it wherever you clamp text with `noOfLines` /
+ * ellipsis and want the full text revealed only when it's cut off.
+ *
+ * The child must be the single element that clamps the text (e.g. a Chakra
+ * `Text` with `noOfLines`); its ref is managed internally. Works for both
+ * single-line and multi-line clamps.
+ *
+ * @example
+ * <OverflowToolTip label={title}>
+ *   <Text noOfLines={1}>{title}</Text>
+ * </OverflowToolTip>
+ */
+function OverflowToolTip(props) {
+    return (0, jsx_runtime_1.jsx)(ToolTip_1.default, { ...props, overflowOnly: true });
+}

package/dist/Components/ToolTip/ToolTip.d.ts

@@ -1,3 +1,3 @@
 import { ToolTipProps } from "./ToolTipProps";
-export default function ToolTip({ placement, label, children, hasArrow, fontSize, bg, color, isDisabled, isOpen, defaultIsOpen, openDelay, closeDelay, arrowSize, closeOnClick, size, width, height, arrowPadding, arrowShadowColor, direction, gutter, onClose, modifiers, closeOnPointerDown, styles, }: ToolTipProps): import("react/jsx-runtime").JSX.Element;
+export default function ToolTip({ placement, label, children, hasArrow, fontSize, bg, color, isDisabled, overflowOnly, isOpen, defaultIsOpen, openDelay, closeDelay, arrowSize, closeOnClick, size, width, height, arrowPadding, arrowShadowColor, direction, gutter, onClose, modifiers, closeOnPointerDown, styles, }: ToolTipProps): import("react/jsx-runtime").JSX.Element;
 //# sourceMappingURL=ToolTip.d.ts.map

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

@@ -1 +1 @@
-{"version":3,"file":"ToolTip.d.ts","sourceRoot":"","sources":["../../../src/Components/ToolTip/ToolTip.tsx"],"names":[],"mappings":"AACA,OAAO,EAAE,YAAY,EAAE,MAAM,gBAAgB,CAAC;AAE9C,MAAM,CAAC,OAAO,UAAU,OAAO,CAAC,EAC9B,SAAiB,EACjB,KAAK,EACL,QAAQ,EACR,QAAe,EACf,QAAiB,EACjB,EAAc,EACd,KAAe,EACf,UAAU,EACV,MAAM,EACN,aAAa,EACb,SAAa,EACb,UAAc,EACd,SAAc,EACd,YAAoB,EACpB,IAAI,EACJ,KAAK,EACL,MAAM,EACN,YAAY,EACZ,gBAAgB,EAChB,SAAS,EACT,MAAU,EACV,OAAO,EACP,SAAS,EACT,kBAAkB,EAClB,MAAM,GACP,EAAE,YAAY,2CAqCd"}
+{"version":3,"file":"ToolTip.d.ts","sourceRoot":"","sources":["../../../src/Components/ToolTip/ToolTip.tsx"],"names":[],"mappings":"AAEA,OAAO,EAAE,YAAY,EAAE,MAAM,gBAAgB,CAAC;AAI9C,MAAM,CAAC,OAAO,UAAU,OAAO,CAAC,EAC9B,SAAiB,EACjB,KAAK,EACL,QAAQ,EACR,QAAe,EACf,QAAiB,EACjB,EAAc,EACd,KAAe,EACf,UAAU,EACV,YAAoB,EACpB,MAAM,EACN,aAAa,EACb,SAAa,EACb,UAAc,EACd,SAAc,EACd,YAAoB,EACpB,IAAI,EACJ,KAAK,EACL,MAAM,EACN,YAAY,EACZ,gBAAgB,EAChB,SAAS,EACT,MAAU,EACV,OAAO,EACP,SAAS,EACT,kBAAkB,EAClB,MAAM,GACP,EAAE,YAAY,2CA4Dd"}

package/dist/Components/ToolTip/ToolTip.js

@@ -2,7 +2,25 @@
 Object.defineProperty(exports, "__esModule", { value: true });
 exports.default = ToolTip;
 const jsx_runtime_1 = require("react/jsx-runtime");
-const react_1 = require("@chakra-ui/react");
-function ToolTip({ placement = "top", label, children, hasArrow = true, fontSize = "14px", bg = "#12161B", color = "white", isDisabled, isOpen, defaultIsOpen, openDelay = 0, closeDelay = 0, arrowSize = 10, closeOnClick = false, size, width, height, arrowPadding, arrowShadowColor, direction, gutter = 8, onClose, modifiers, closeOnPointerDown, styles, }) {
-    return ((0, jsx_runtime_1.jsx)(react_1.Tooltip, { label: label, placement: placement, hasArrow: hasArrow, fontSize: fontSize, bg: bg, color: color, isDisabled: isDisabled, isOpen: isOpen, defaultIsOpen: defaultIsOpen, openDelay: openDelay, closeDelay: closeDelay, arrowSize: arrowSize, closeOnClick: closeOnClick, size: size, width: width, height: height, arrowPadding: arrowPadding, arrowShadowColor: arrowShadowColor, direction: direction, gutter: gutter, onClose: onClose, modifiers: modifiers, closeOnPointerDown: closeOnPointerDown, style: styles, px: 3, py: 2, borderRadius: "8px", fontWeight: "400", lineHeight: "1.5", maxW: "300px", children: children }));
+const react_1 = require("react");
+const react_2 = require("@chakra-ui/react");
+const useIsTruncated_1 = require("../../Hooks/useIsTruncated");
+const mergeRefs_1 = require("../../Utils/mergeRefs");
+function ToolTip({ placement = "top", label, children, hasArrow = true, fontSize = "14px", bg = "#12161B", color = "white", isDisabled, overflowOnly = false, isOpen, defaultIsOpen, openDelay = 0, closeDelay = 0, arrowSize = 10, closeOnClick = false, size, width, height, arrowPadding, arrowShadowColor, direction, gutter = 8, onClose, modifiers, closeOnPointerDown, styles, }) {
+    // Measure the child for `overflowOnly`. The hook is always called (Rules of
+    // Hooks) but is fully inert unless `overflowOnly` is set — no layout reads,
+    // no ResizeObserver, no re-renders for ordinary tooltips. Measurement never
+    // runs on hover/scroll, so showing the tooltip stays as cheap as before.
+    const { ref, isTruncated } = (0, useIsTruncated_1.useIsTruncated)(label, overflowOnly && (0, react_1.isValidElement)(children));
+    let content = children;
+    let effectiveDisabled = isDisabled;
+    if (overflowOnly && (0, react_1.isValidElement)(children)) {
+        const child = children;
+        const childRef = child.ref;
+        content = (0, react_1.cloneElement)(child, {
+            ref: (0, mergeRefs_1.mergeRefs)(ref, childRef),
+        });
+        effectiveDisabled = Boolean(isDisabled) || !isTruncated;
+    }
+    return ((0, jsx_runtime_1.jsx)(react_2.Tooltip, { label: label, placement: placement, hasArrow: hasArrow, fontSize: fontSize, bg: bg, color: color, isDisabled: effectiveDisabled, isOpen: isOpen, defaultIsOpen: defaultIsOpen, openDelay: openDelay, closeDelay: closeDelay, arrowSize: arrowSize, closeOnClick: closeOnClick, size: size, width: width, height: height, arrowPadding: arrowPadding, arrowShadowColor: arrowShadowColor, direction: direction, gutter: gutter, onClose: onClose, modifiers: modifiers, closeOnPointerDown: closeOnPointerDown, style: styles, px: 3, py: 2, borderRadius: "8px", fontWeight: "400", lineHeight: "1.5", maxW: "300px", children: content }));
 }

package/dist/Components/ToolTip/ToolTipProps.d.ts

@@ -2,6 +2,15 @@ import { TooltipProps as ChakraTooltip } from "@chakra-ui/react";
 export type ToolTipProps = Pick<ChakraTooltip, "placement" | "label" | "hasArrow" | "fontSize" | "bg" | "color" | "isDisabled" | "isOpen" | "defaultIsOpen" | "openDelay" | "closeDelay" | "arrowSize" | "closeOnClick" | "size" | "width" | "height" | "arrowPadding" | "arrowShadowColor" | "direction" | "gutter" | "onClose" | "modifiers" | "closeOnPointerDown"> & {
     children: React.ReactNode;
     styles?: React.CSSProperties;
+    /**
+     * When `true`, the tooltip is shown **only** while its child is actually
+     * truncated (ellipsis active) — no tooltip when the text fully fits. The
+     * child must be the single element that clamps the text (e.g. a `Text` with
+     * `noOfLines` / `isTruncated`); its ref is managed internally. Combines with
+     * `isDisabled` (either disabling condition hides the tooltip). Works for both
+     * single-line and multi-line clamps.
+     */
+    overflowOnly?: boolean;
     placement?: "auto" | "auto-start" | "auto-end" | "top" | "top-start" | "top-end" | "right" | "right-start" | "right-end" | "bottom" | "bottom-start" | "bottom-end" | "left" | "left-start" | "left-end";
 };
 //# sourceMappingURL=ToolTipProps.d.ts.map

package/dist/Components/ToolTip/ToolTipProps.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"ToolTipProps.d.ts","sourceRoot":"","sources":["../../../src/Components/ToolTip/ToolTipProps.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,YAAY,IAAI,aAAa,EAAE,MAAM,kBAAkB,CAAC;AACjE,MAAM,MAAM,YAAY,GAAG,IAAI,CAC7B,aAAa,EACX,WAAW,GACX,OAAO,GACP,UAAU,GACV,UAAU,GACV,IAAI,GACJ,OAAO,GACP,YAAY,GACZ,QAAQ,GACR,eAAe,GACf,WAAW,GACX,YAAY,GACZ,WAAW,GACX,cAAc,GACd,MAAM,GACN,OAAO,GACP,QAAQ,GACR,cAAc,GACd,kBAAkB,GAClB,WAAW,GACX,QAAQ,GACR,SAAS,GACT,WAAW,GACX,oBAAoB,CACvB,GAAG;IACF,QAAQ,EAAE,KAAK,CAAC,SAAS,CAAC;IAC1B,MAAM,CAAC,EAAE,KAAK,CAAC,aAAa,CAAC;IAC7B,SAAS,CAAC,EACN,MAAM,GACN,YAAY,GACZ,UAAU,GACV,KAAK,GACL,WAAW,GACX,SAAS,GACT,OAAO,GACP,aAAa,GACb,WAAW,GACX,QAAQ,GACR,cAAc,GACd,YAAY,GACZ,MAAM,GACN,YAAY,GACZ,UAAU,CAAC;CAChB,CAAC"}
+{"version":3,"file":"ToolTipProps.d.ts","sourceRoot":"","sources":["../../../src/Components/ToolTip/ToolTipProps.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,YAAY,IAAI,aAAa,EAAE,MAAM,kBAAkB,CAAC;AACjE,MAAM,MAAM,YAAY,GAAG,IAAI,CAC7B,aAAa,EACX,WAAW,GACX,OAAO,GACP,UAAU,GACV,UAAU,GACV,IAAI,GACJ,OAAO,GACP,YAAY,GACZ,QAAQ,GACR,eAAe,GACf,WAAW,GACX,YAAY,GACZ,WAAW,GACX,cAAc,GACd,MAAM,GACN,OAAO,GACP,QAAQ,GACR,cAAc,GACd,kBAAkB,GAClB,WAAW,GACX,QAAQ,GACR,SAAS,GACT,WAAW,GACX,oBAAoB,CACvB,GAAG;IACF,QAAQ,EAAE,KAAK,CAAC,SAAS,CAAC;IAC1B,MAAM,CAAC,EAAE,KAAK,CAAC,aAAa,CAAC;IAC7B;;;;;;;OAOG;IACH,YAAY,CAAC,EAAE,OAAO,CAAC;IACvB,SAAS,CAAC,EACN,MAAM,GACN,YAAY,GACZ,UAAU,GACV,KAAK,GACL,WAAW,GACX,SAAS,GACT,OAAO,GACP,aAAa,GACb,WAAW,GACX,QAAQ,GACR,cAAc,GACd,YAAY,GACZ,MAAM,GACN,YAAY,GACZ,UAAU,CAAC;CAChB,CAAC"}

package/dist/Components/WorkspaceWindow/WorkspaceTrayPreview.d.ts

@@ -0,0 +1,16 @@
+import type { WorkspaceTrayPreviewProps } from "./WorkspaceWindowProps";
+/**
+ * Presentational, app-agnostic hover-preview for a "workspace tray" pill (or any
+ * trigger). Headless of any data: the consumer passes the trigger as `children`
+ * and the card body as `preview` (node or render-prop receiving `close()`), so
+ * this can preview a ticket, a doc, a chat — anything — with the same intent-safe
+ * hover behavior.
+ *
+ * Intent-safe hover (hover-bridge): hovering the trigger opens the card after a
+ * short delay (anti-flash); a shared open/close timer + small gap let the cursor
+ * travel trigger ⇄ card without the card closing; leaving both (with a grace
+ * delay) closes it; Escape dismisses. Fetch/render the preview lazily via
+ * `onOpenChange`.
+ */
+export default function WorkspaceTrayPreview({ children, preview, enabled, openDelayMs, closeDelayMs, placement, onOpenChange, width, testId, }: WorkspaceTrayPreviewProps): import("react/jsx-runtime").JSX.Element;
+//# sourceMappingURL=WorkspaceTrayPreview.d.ts.map

package/dist/Components/WorkspaceWindow/WorkspaceTrayPreview.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"WorkspaceTrayPreview.d.ts","sourceRoot":"","sources":["../../../src/Components/WorkspaceWindow/WorkspaceTrayPreview.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,EAAE,yBAAyB,EAAE,MAAM,wBAAwB,CAAC;AAcxE;;;;;;;;;;;;GAYG;AACH,MAAM,CAAC,OAAO,UAAU,oBAAoB,CAAC,EAC3C,QAAQ,EACR,OAAO,EACP,OAAc,EACd,WAAiB,EACjB,YAAkB,EAClB,SAAqB,EACrB,YAAY,EACZ,KAAe,EACf,MAAiC,GAClC,EAAE,yBAAyB,2CAuG3B"}

package/dist/Components/WorkspaceWindow/WorkspaceTrayPreview.js

@@ -0,0 +1,83 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.default = WorkspaceTrayPreview;
+const jsx_runtime_1 = require("react/jsx-runtime");
+const react_1 = require("react");
+const react_2 = require("@chakra-ui/react");
+const PLACEMENT_STYLE = {
+    "top-end": { bottom: "100%", right: 0, marginBottom: "6px" },
+    "top-start": { bottom: "100%", left: 0, marginBottom: "6px" },
+    "bottom-end": { top: "100%", right: 0, marginTop: "6px" },
+    "bottom-start": { top: "100%", left: 0, marginTop: "6px" },
+};
+/**
+ * Presentational, app-agnostic hover-preview for a "workspace tray" pill (or any
+ * trigger). Headless of any data: the consumer passes the trigger as `children`
+ * and the card body as `preview` (node or render-prop receiving `close()`), so
+ * this can preview a ticket, a doc, a chat — anything — with the same intent-safe
+ * hover behavior.
+ *
+ * Intent-safe hover (hover-bridge): hovering the trigger opens the card after a
+ * short delay (anti-flash); a shared open/close timer + small gap let the cursor
+ * travel trigger ⇄ card without the card closing; leaving both (with a grace
+ * delay) closes it; Escape dismisses. Fetch/render the preview lazily via
+ * `onOpenChange`.
+ */
+function WorkspaceTrayPreview({ children, preview, enabled = true, openDelayMs = 350, closeDelayMs = 200, placement = "top-end", onOpenChange, width = "340px", testId = "workspace-tray-preview", }) {
+    const [open, setOpen] = (0, react_1.useState)(false);
+    const openTimer = (0, react_1.useRef)(null);
+    const closeTimer = (0, react_1.useRef)(null);
+    const setOpenState = (0, react_1.useCallback)((next) => {
+        setOpen(next);
+        onOpenChange === null || onOpenChange === void 0 ? void 0 : onOpenChange(next);
+    }, [onOpenChange]);
+    const clearOpenTimer = (0, react_1.useCallback)(() => {
+        if (openTimer.current) {
+            clearTimeout(openTimer.current);
+            openTimer.current = null;
+        }
+    }, []);
+    const clearCloseTimer = (0, react_1.useCallback)(() => {
+        if (closeTimer.current) {
+            clearTimeout(closeTimer.current);
+            closeTimer.current = null;
+        }
+    }, []);
+    const scheduleOpen = (0, react_1.useCallback)(() => {
+        if (!enabled)
+            return;
+        clearCloseTimer();
+        if (open || openTimer.current)
+            return;
+        openTimer.current = setTimeout(() => {
+            openTimer.current = null;
+            setOpenState(true);
+        }, openDelayMs);
+    }, [enabled, clearCloseTimer, open, openDelayMs, setOpenState]);
+    const scheduleClose = (0, react_1.useCallback)(() => {
+        clearOpenTimer();
+        if (closeTimer.current)
+            return;
+        closeTimer.current = setTimeout(() => {
+            closeTimer.current = null;
+            setOpenState(false);
+        }, closeDelayMs);
+    }, [clearOpenTimer, closeDelayMs, setOpenState]);
+    const closeNow = (0, react_1.useCallback)(() => {
+        clearOpenTimer();
+        clearCloseTimer();
+        setOpenState(false);
+    }, [clearOpenTimer, clearCloseTimer, setOpenState]);
+    (0, react_1.useEffect)(() => () => {
+        clearOpenTimer();
+        clearCloseTimer();
+    }, [clearOpenTimer, clearCloseTimer]);
+    return ((0, jsx_runtime_1.jsxs)(react_2.Box, { position: "relative", onMouseEnter: scheduleOpen, onMouseLeave: scheduleClose, onFocus: scheduleOpen, onBlur: scheduleClose, onKeyDown: (e) => {
+            if (e.key === "Escape" && open) {
+                e.stopPropagation();
+                closeNow();
+            }
+        }, children: [children, open && ((0, jsx_runtime_1.jsx)(react_2.Box, { position: "absolute", ...PLACEMENT_STYLE[placement], w: typeof width === "number" ? `${width}px` : width, maxW: "min(360px, calc(100vw - 2rem))", bg: "white", borderWidth: "1px", borderColor: "gray.200", borderRadius: "lg", boxShadow: "xl", zIndex: 1500, pointerEvents: "auto", p: 3, textAlign: "left", color: "gray.800", cursor: "default", onMouseEnter: clearCloseTimer, onMouseLeave: scheduleClose, "data-testid": testId, children: typeof preview === "function"
+                    ? preview({ close: closeNow })
+                    : preview }))] }));
+}

package/dist/Components/WorkspaceWindow/WorkspaceWindow.d.ts

@@ -0,0 +1,15 @@
+import type { WorkspaceTrayProps, WorkspaceWindowProps } from "./WorkspaceWindowProps";
+/**
+ * Presentational floating "workspace window" — a Jira-style dialog with
+ * minimize / close controls and an optional "open full page" affordance, at a
+ * single fixed size (no maximize/restore toggle). Headless of any state
+ * management: the parent owns the window state and passes callbacks. Render
+ * minimized windows with the companion WorkspaceTray.
+ */
+export default function WorkspaceWindow({ title, state, children, onMinimize, onClose, onOpenFullPage, headerActions, testId, }: WorkspaceWindowProps): import("react/jsx-runtime").JSX.Element | null;
+/**
+ * Bottom tray of restore pills for minimized WorkspaceWindows. Presentational —
+ * the parent supplies the minimized items and restore/close handlers.
+ */
+export declare function WorkspaceTray({ items, onRestore, onClose, testId, }: WorkspaceTrayProps): import("react/jsx-runtime").JSX.Element | null;
+//# sourceMappingURL=WorkspaceWindow.d.ts.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"WorkspaceWindow.d.ts","sourceRoot":"","sources":["../../../src/Components/WorkspaceWindow/WorkspaceWindow.tsx"],"names":[],"mappings":"AAYA,OAAO,KAAK,EACV,kBAAkB,EAClB,oBAAoB,EACrB,MAAM,wBAAwB,CAAC;AAOhC;;;;;;GAMG;AACH,MAAM,CAAC,OAAO,UAAU,eAAe,CAAC,EACtC,KAAK,EACL,KAAK,EACL,QAAQ,EACR,UAAU,EACV,OAAO,EACP,cAAc,EACd,aAAa,EACb,MAA2B,GAC5B,EAAE,oBAAoB,kDAqGtB;AAED;;;GAGG;AACH,wBAAgB,aAAa,CAAC,EAC5B,KAAK,EACL,SAAS,EACT,OAAO,EACP,MAAyB,GAC1B,EAAE,kBAAkB,kDAkEpB"}

package/dist/Components/WorkspaceWindow/WorkspaceWindow.js

@@ -0,0 +1,40 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.default = WorkspaceWindow;
+exports.WorkspaceTray = WorkspaceTray;
+const jsx_runtime_1 = require("react/jsx-runtime");
+const react_1 = require("@chakra-ui/react");
+const lucide_react_1 = require("lucide-react");
+// One in-between windowed size — wider than a cramped dialog but not near-full
+// screen. There is no maximize/restore toggle (removed by product decision); the
+// `onMedium`/`onMaximize` props are kept optional for back-compat but unused.
+const WINDOW_SIZE = { maxW: "88rem", h: "92vh" };
+/**
+ * Presentational floating "workspace window" — a Jira-style dialog with
+ * minimize / close controls and an optional "open full page" affordance, at a
+ * single fixed size (no maximize/restore toggle). Headless of any state
+ * management: the parent owns the window state and passes callbacks. Render
+ * minimized windows with the companion WorkspaceTray.
+ */
+function WorkspaceWindow({ title, state, children, onMinimize, onClose, onOpenFullPage, headerActions, testId = "workspace-window", }) {
+    if (state === "minimized")
+        return null;
+    const size = WINDOW_SIZE;
+    return ((0, jsx_runtime_1.jsxs)(react_1.Modal, { isOpen: true, onClose: () => onClose === null || onClose === void 0 ? void 0 : onClose(), size: "full", isCentered: true, scrollBehavior: "inside", 
+        // Don't discard unsaved work on an accidental overlay click / Esc — the
+        // parent decides via the explicit Close control.
+        closeOnOverlayClick: false, closeOnEsc: false, children: [(0, jsx_runtime_1.jsx)(react_1.ModalOverlay, { backdropFilter: "blur(3px)" }), (0, jsx_runtime_1.jsx)(react_1.ModalContent, { bg: "transparent", boxShadow: "none", m: 0, display: "flex", alignItems: "center", justifyContent: "center", children: (0, jsx_runtime_1.jsxs)(react_1.Box, { bg: "white", borderRadius: "0.75rem", boxShadow: "2xl", overflow: "hidden", w: "100%", maxW: size.maxW, h: size.h, display: "flex", flexDirection: "column", "data-testid": testId, "data-window-state": state, children: [(0, jsx_runtime_1.jsxs)(react_1.Flex, { align: "center", justify: "space-between", px: 3, py: 2, borderBottomWidth: "1px", borderColor: "gray.100", bg: "gray.50", flexShrink: 0, children: [(0, jsx_runtime_1.jsx)(react_1.Text, { fontSize: "sm", fontWeight: 600, color: "gray.700", noOfLines: 1, "data-testid": `${testId}-title`, children: title }), (0, jsx_runtime_1.jsxs)(react_1.HStack, { spacing: 1, children: [headerActions, onOpenFullPage ? ((0, jsx_runtime_1.jsx)(react_1.IconButton, { "aria-label": "Open full page", size: "xs", variant: "ghost", icon: (0, jsx_runtime_1.jsx)(lucide_react_1.ExternalLink, { size: 14 }), onClick: onOpenFullPage, "data-testid": `${testId}-fullpage` })) : null, onMinimize ? ((0, jsx_runtime_1.jsx)(react_1.IconButton, { "aria-label": "Minimize", size: "xs", variant: "ghost", icon: (0, jsx_runtime_1.jsx)(lucide_react_1.Minus, { size: 15 }), onClick: onMinimize, "data-testid": `${testId}-minimize` })) : null, onClose ? ((0, jsx_runtime_1.jsx)(react_1.IconButton, { "aria-label": "Close", size: "xs", variant: "ghost", colorScheme: "red", icon: (0, jsx_runtime_1.jsx)(lucide_react_1.X, { size: 15 }), onClick: onClose, "data-testid": `${testId}-close` })) : null] })] }), (0, jsx_runtime_1.jsx)(react_1.Box, { flex: "1", overflow: "auto", px: { base: 3, md: 5 }, py: 4, children: children })] }) })] }));
+}
+/**
+ * Bottom tray of restore pills for minimized WorkspaceWindows. Presentational —
+ * the parent supplies the minimized items and restore/close handlers.
+ */
+function WorkspaceTray({ items, onRestore, onClose, testId = "workspace-tray", }) {
+    if (!items.length)
+        return null;
+    return (
+    // Floating bottom-right cluster (Gmail/Jira minimized-window pattern) rather
+    // than a full-width docked bar, so it never covers the bottom strip of page
+    // content and needs no reserved page gutter. Pills wrap upward.
+    (0, jsx_runtime_1.jsx)(react_1.Flex, { position: "fixed", bottom: 4, right: 4, zIndex: 1400, direction: "row-reverse", wrap: "wrap-reverse", justify: "flex-start", gap: 2, maxW: { base: "calc(100vw - 2rem)", md: "36rem" }, "data-testid": testId, children: items.map((item) => ((0, jsx_runtime_1.jsxs)(react_1.HStack, { spacing: 1, pl: 3, pr: 1, py: 1, borderRadius: "full", bg: "blue.100", color: "blue.700", boxShadow: "md", borderWidth: "1px", borderColor: "blue.200", "data-testid": `${testId}-pill`, children: [(0, jsx_runtime_1.jsx)(react_1.Box, { as: "button", type: "button", fontSize: "sm", onClick: () => onRestore === null || onRestore === void 0 ? void 0 : onRestore(item.id), "data-testid": `${testId}-restore`, maxW: "16rem", overflow: "hidden", textOverflow: "ellipsis", whiteSpace: "nowrap", children: item.title }), onClose ? ((0, jsx_runtime_1.jsx)(react_1.IconButton, { "aria-label": "Close", size: "xs", variant: "ghost", borderRadius: "full", minW: "auto", h: "auto", p: 1, color: "inherit", icon: (0, jsx_runtime_1.jsx)(lucide_react_1.X, { size: 13 }), onClick: () => onClose(item.id), "data-testid": `${testId}-close` })) : null] }, item.id))) }));
+}

package/dist/Components/WorkspaceWindow/WorkspaceWindowProps.d.ts

@@ -0,0 +1,72 @@
+import type { ReactNode } from "react";
+/**
+ * Window state for a WorkspaceWindow.
+ * - "medium": default centered dialog (Jira-style)
+ * - "maximized": near-full-screen
+ * - "minimized": collapsed to a tray pill (rendered by WorkspaceTray, not the window)
+ */
+export type WorkspaceWindowState = "medium" | "maximized" | "minimized";
+export interface WorkspaceWindowProps {
+    /** Title shown in the window's control bar. */
+    title: ReactNode;
+    /** Current window state. When "minimized", the window renders nothing. */
+    state: WorkspaceWindowState;
+    /** Window body. */
+    children: ReactNode;
+    onMinimize?: () => void;
+    onMedium?: () => void;
+    onMaximize?: () => void;
+    onClose?: () => void;
+    /** Optional "pop out to full page" affordance; hidden when omitted. */
+    onOpenFullPage?: () => void;
+    /** Extra controls rendered in the control bar, left of the window buttons. */
+    headerActions?: ReactNode;
+    /** data-testid for the window container. */
+    testId?: string;
+}
+export interface WorkspaceTrayItem {
+    id: string;
+    title: ReactNode;
+}
+export interface WorkspaceTrayProps {
+    /** Minimized items rendered as restore pills along the bottom. */
+    items: WorkspaceTrayItem[];
+    onRestore?: (id: string) => void;
+    onClose?: (id: string) => void;
+    testId?: string;
+}
+export interface WorkspaceTrayPreviewProps {
+    /**
+     * The trigger markup (typically a tray pill). The preview + trigger share one
+     * open/close timer so the cursor can travel pill ⇄ preview without the card
+     * closing (hover-bridge pattern).
+     */
+    children: ReactNode;
+    /**
+     * The preview body, rendered inside the floating card. Headless: the consumer
+     * supplies whatever it wants to show (ticket summary, chips, actions, etc.).
+     * A render-prop form receives the card's own `close()` so an action inside
+     * the preview can dismiss it.
+     */
+    preview: ReactNode | ((api: {
+        close: () => void;
+    }) => ReactNode);
+    /** Whether the preview is enabled at all (e.g. disable on touch devices). */
+    enabled?: boolean;
+    /** ms before the card opens on hover/focus (anti-flash). Default 350. */
+    openDelayMs?: number;
+    /** ms grace before the card closes on leave (bridge). Default 200. */
+    closeDelayMs?: number;
+    /**
+     * Where the card opens relative to the trigger. Default "top-end" (above,
+     * right-aligned) — matches a bottom-right tray.
+     */
+    placement?: "top-start" | "top-end" | "bottom-start" | "bottom-end";
+    /** Fires when the card actually opens — use to lazy-load the preview data. */
+    onOpenChange?: (open: boolean) => void;
+    /** Card width. Default 340px, capped to the viewport on small screens. */
+    width?: string | number;
+    /** data-testid for the floating card. */
+    testId?: string;
+}
+//# sourceMappingURL=WorkspaceWindowProps.d.ts.map

package/dist/Components/WorkspaceWindow/WorkspaceWindowProps.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"WorkspaceWindowProps.d.ts","sourceRoot":"","sources":["../../../src/Components/WorkspaceWindow/WorkspaceWindowProps.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,SAAS,EAAE,MAAM,OAAO,CAAC;AAEvC;;;;;GAKG;AACH,MAAM,MAAM,oBAAoB,GAAG,QAAQ,GAAG,WAAW,GAAG,WAAW,CAAC;AAExE,MAAM,WAAW,oBAAoB;IACnC,+CAA+C;IAC/C,KAAK,EAAE,SAAS,CAAC;IACjB,0EAA0E;IAC1E,KAAK,EAAE,oBAAoB,CAAC;IAC5B,mBAAmB;IACnB,QAAQ,EAAE,SAAS,CAAC;IAEpB,UAAU,CAAC,EAAE,MAAM,IAAI,CAAC;IACxB,QAAQ,CAAC,EAAE,MAAM,IAAI,CAAC;IACtB,UAAU,CAAC,EAAE,MAAM,IAAI,CAAC;IACxB,OAAO,CAAC,EAAE,MAAM,IAAI,CAAC;IACrB,uEAAuE;IACvE,cAAc,CAAC,EAAE,MAAM,IAAI,CAAC;IAE5B,8EAA8E;IAC9E,aAAa,CAAC,EAAE,SAAS,CAAC;IAC1B,4CAA4C;IAC5C,MAAM,CAAC,EAAE,MAAM,CAAC;CACjB;AAED,MAAM,WAAW,iBAAiB;IAChC,EAAE,EAAE,MAAM,CAAC;IACX,KAAK,EAAE,SAAS,CAAC;CAClB;AAED,MAAM,WAAW,kBAAkB;IACjC,kEAAkE;IAClE,KAAK,EAAE,iBAAiB,EAAE,CAAC;IAC3B,SAAS,CAAC,EAAE,CAAC,EAAE,EAAE,MAAM,KAAK,IAAI,CAAC;IACjC,OAAO,CAAC,EAAE,CAAC,EAAE,EAAE,MAAM,KAAK,IAAI,CAAC;IAC/B,MAAM,CAAC,EAAE,MAAM,CAAC;CACjB;AAED,MAAM,WAAW,yBAAyB;IACxC;;;;OAIG;IACH,QAAQ,EAAE,SAAS,CAAC;IACpB;;;;;OAKG;IACH,OAAO,EAAE,SAAS,GAAG,CAAC,CAAC,GAAG,EAAE;QAAE,KAAK,EAAE,MAAM,IAAI,CAAA;KAAE,KAAK,SAAS,CAAC,CAAC;IACjE,6EAA6E;IAC7E,OAAO,CAAC,EAAE,OAAO,CAAC;IAClB,yEAAyE;IACzE,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB,sEAAsE;IACtE,YAAY,CAAC,EAAE,MAAM,CAAC;IACtB;;;OAGG;IACH,SAAS,CAAC,EAAE,WAAW,GAAG,SAAS,GAAG,cAAc,GAAG,YAAY,CAAC;IACpE,8EAA8E;IAC9E,YAAY,CAAC,EAAE,CAAC,IAAI,EAAE,OAAO,KAAK,IAAI,CAAC;IACvC,0EAA0E;IAC1E,KAAK,CAAC,EAAE,MAAM,GAAG,MAAM,CAAC;IACxB,yCAAyC;IACzC,MAAM,CAAC,EAAE,MAAM,CAAC;CACjB"}

package/dist/Components/WorkspaceWindow/WorkspaceWindowProps.js

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

package/dist/Hooks/useIsTruncated.d.ts

@@ -0,0 +1,36 @@
+/**
+ * Detects whether an element's text is *actually* visually truncated — i.e. the
+ * ellipsis is active. Works for both single-line clamps
+ * (`overflow: hidden; white-space: nowrap; text-overflow: ellipsis`) and
+ * multi-line clamps (`-webkit-line-clamp` / Chakra `noOfLines`), by comparing
+ * the scroll size against the visible client size.
+ *
+ * Attach the returned `ref` to the element that clamps the text, then read
+ * `isTruncated` to decide whether a tooltip is worth showing. Re-measures on
+ * element resize (via `ResizeObserver`) and whenever `content` changes.
+ *
+ * @param content Pass the rendered text (or anything that changes with it) so
+ *   the measurement re-runs when the content changes — the clamp box can keep
+ *   the same size while the text length changes, which a `ResizeObserver` alone
+ *   would not catch.
+ * @param enabled Set to `false` to fully disable measurement — no layout reads,
+ *   no `ResizeObserver`, no state updates. Use it to keep the hook cheap when
+ *   the caller isn't in truncation mode (`isTruncated` stays `false`).
+ *
+ * Performance: measurement runs only on mount, on element **resize**, and when
+ * `content` changes — never on hover, scroll, or re-render. Each run does a
+ * single batched layout read (four properties) on one element. When `enabled`
+ * is `false` the hook does nothing at all.
+ *
+ * @example
+ * const { ref, isTruncated } = useIsTruncated(title);
+ * <ToolTip label={title} isDisabled={!isTruncated}>
+ *   <Text ref={ref} noOfLines={1}>{title}</Text>
+ * </ToolTip>
+ */
+export declare function useIsTruncated<T extends HTMLElement = HTMLElement>(content?: unknown, enabled?: boolean): {
+    ref: React.MutableRefObject<T | null>;
+    isTruncated: boolean;
+};
+export default useIsTruncated;
+//# sourceMappingURL=useIsTruncated.d.ts.map

package/dist/Hooks/useIsTruncated.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"useIsTruncated.d.ts","sourceRoot":"","sources":["../../src/Hooks/useIsTruncated.ts"],"names":[],"mappings":"AAEA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GA6BG;AACH,wBAAgB,cAAc,CAAC,CAAC,SAAS,WAAW,GAAG,WAAW,EAChE,OAAO,CAAC,EAAE,OAAO,EACjB,OAAO,GAAE,OAAc,GACtB;IAAE,GAAG,EAAE,KAAK,CAAC,gBAAgB,CAAC,CAAC,GAAG,IAAI,CAAC,CAAC;IAAC,WAAW,EAAE,OAAO,CAAA;CAAE,CAuBjE;AAED,eAAe,cAAc,CAAC"}