pixelize-design-library 2.3.19 → 2.3.20

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
 
@@ -11,3 +11,11 @@ Modal, AlertDialog, ToolTip, Toaster (+ `useToaster` hook).
 ## Key rules
 
 - 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/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/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"}

package/dist/Hooks/useIsTruncated.js

@@ -0,0 +1,57 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.useIsTruncated = useIsTruncated;
+const react_1 = require("react");
+/**
+ * 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>
+ */
+function useIsTruncated(content, enabled = true) {
+    const ref = (0, react_1.useRef)(null);
+    const [isTruncated, setIsTruncated] = (0, react_1.useState)(false);
+    const measure = (0, react_1.useCallback)(() => {
+        const el = ref.current;
+        if (!el)
+            return;
+        setIsTruncated(el.scrollWidth > el.clientWidth || el.scrollHeight > el.clientHeight);
+    }, []);
+    (0, react_1.useEffect)(() => {
+        if (!enabled)
+            return;
+        measure();
+        const el = ref.current;
+        if (!el || typeof ResizeObserver === "undefined")
+            return;
+        const observer = new ResizeObserver(measure);
+        observer.observe(el);
+        return () => observer.disconnect();
+    }, [measure, content, enabled]);
+    return { ref, isTruncated };
+}
+exports.default = useIsTruncated;

package/dist/Utils/mergeRefs.d.ts

@@ -0,0 +1,11 @@
+import React from "react";
+/** Assign a value to a callback ref or a ref object. */
+export declare function setRef<T>(ref: React.Ref<T> | undefined, value: T | null): void;
+/**
+ * Combine multiple refs into a single callback ref, so a value flows to all of
+ * them. Useful when cloning an element to attach an internal ref while
+ * preserving a ref the caller already set.
+ */
+export declare function mergeRefs<T>(...refs: Array<React.Ref<T> | undefined>): (value: T | null) => void;
+export default mergeRefs;
+//# sourceMappingURL=mergeRefs.d.ts.map

package/dist/Utils/mergeRefs.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"mergeRefs.d.ts","sourceRoot":"","sources":["../../src/Utils/mergeRefs.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;AAE1B,wDAAwD;AACxD,wBAAgB,MAAM,CAAC,CAAC,EAAE,GAAG,EAAE,KAAK,CAAC,GAAG,CAAC,CAAC,CAAC,GAAG,SAAS,EAAE,KAAK,EAAE,CAAC,GAAG,IAAI,QAIvE;AAED;;;;GAIG;AACH,wBAAgB,SAAS,CAAC,CAAC,EACzB,GAAG,IAAI,EAAE,KAAK,CAAC,KAAK,CAAC,GAAG,CAAC,CAAC,CAAC,GAAG,SAAS,CAAC,GACvC,CAAC,KAAK,EAAE,CAAC,GAAG,IAAI,KAAK,IAAI,CAE3B;AAED,eAAe,SAAS,CAAC"}

package/dist/Utils/mergeRefs.js

@@ -0,0 +1,20 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.setRef = setRef;
+exports.mergeRefs = mergeRefs;
+/** Assign a value to a callback ref or a ref object. */
+function setRef(ref, value) {
+    if (typeof ref === "function")
+        ref(value);
+    else if (ref && typeof ref === "object")
+        ref.current = value;
+}
+/**
+ * Combine multiple refs into a single callback ref, so a value flows to all of
+ * them. Useful when cloning an element to attach an internal ref while
+ * preserving a ref the caller already set.
+ */
+function mergeRefs(...refs) {
+    return (value) => refs.forEach((r) => setRef(r, value));
+}
+exports.default = mergeRefs;

package/dist/index.d.ts

@@ -45,11 +45,13 @@ import TextInput from "./Components/Input/TextInput";
 import Timeline from "./Components/Timeline/Timeline";
 import Toaster, { useToaster } from "./Components/Toaster/Toaster";
 import ToolTip from "./Components/ToolTip/ToolTip";
+import OverflowToolTip from "./Components/ToolTip/OverflowToolTip";
 import VerifyEmailOtp from "./Components/EmailCards/VerifyEmailOtp/VerifyEmailOtp";
 import TableToggle from "./Components/Toggle/TableToggle";
 import withTheme from "./withTheme";
 import { useCustomTheme } from "./Theme/useCustomTheme";
 import { useSidebarPrefs } from "./Hooks/useSidebarPrefs";
+import { useIsTruncated } from "./Hooks/useIsTruncated";
 import { ThemesList } from "./Theme";
 import { debounce } from "./Utils/table";
 import ProductCard from "./Components/ProductCard/ProductCard";
@@ -78,7 +80,7 @@ import RolesPermission from "./Components/RolesPermission/RolesPermission";
 import CustomModulesTable from "./Components/CustomModulesTable/CustomModulesTable";
 import SignInActivityTable from "./Components/SignInActivityTable/SignInActivityTable";
 import OrganizationDetails from "./Components/OrganizationDetails/OrganizationDetails";
-export { Accordian, AlertDialog, ApexBarChart, ApexPieChart, ApexPolarChart, ApexLineChart, Breadcrumbs, Button, ButtonGroupIcon, Card, Checkbox, ContactForm, DatePicker, Drawer, DrawerHeader, DrawerBody, DrawerFooter, Dropdown, Editor, EmptyState, FieldSelectModal, FilePreview, FilePreviewTrigger, FileUpload, FileUploader, FilterSidebar, FormWrapper, LazyWrapper, MoreItems, PdfViewer, ScrollToTop, CopyButton, StageProgress, StageItem, OrgSwitcher, UpgradeButton, UserDetails, RolesPermission, CustomModulesTable, SignInActivityTable, OrganizationDetails, Header, HeaderActions, InputTextArea, InputSwitch, KanbanBoard, Loading, Modal, ModalHeader, ModalBody, ModalFooter, NavigationBar, Notification, NoteTextArea, MultiSelect, NumberInput, PaymentCard, PhoneNumberInput, PinInput, ProductCard, ProductDetails, ProfileCard, ProfileCardHeader, ProfileCardBody, ProfileCardFooter, ProfilePhotoViewer, ProgressBar, RadioButton, RadioButtonGroup, Reorder, Search, Select, SearchSelect, SelectSearch, SideBar, Slider, Skeletons, Switch, Table, TableToggle, Tag, TextInput, Timeline, Toaster, ToolTip, useToaster, VerifyEmailOtp, useSidebarPrefs, useCustomTheme, ThemesList, debounce, };
+export { Accordian, AlertDialog, ApexBarChart, ApexPieChart, ApexPolarChart, ApexLineChart, Breadcrumbs, Button, ButtonGroupIcon, Card, Checkbox, ContactForm, DatePicker, Drawer, DrawerHeader, DrawerBody, DrawerFooter, Dropdown, Editor, EmptyState, FieldSelectModal, FilePreview, FilePreviewTrigger, FileUpload, FileUploader, FilterSidebar, FormWrapper, LazyWrapper, MoreItems, PdfViewer, ScrollToTop, CopyButton, StageProgress, StageItem, OrgSwitcher, UpgradeButton, UserDetails, RolesPermission, CustomModulesTable, SignInActivityTable, OrganizationDetails, Header, HeaderActions, InputTextArea, InputSwitch, KanbanBoard, Loading, Modal, ModalHeader, ModalBody, ModalFooter, NavigationBar, Notification, NoteTextArea, MultiSelect, NumberInput, PaymentCard, PhoneNumberInput, PinInput, ProductCard, ProductDetails, ProfileCard, ProfileCardHeader, ProfileCardBody, ProfileCardFooter, ProfilePhotoViewer, ProgressBar, RadioButton, RadioButtonGroup, Reorder, Search, Select, SearchSelect, SelectSearch, SideBar, Slider, Skeletons, Switch, Table, TableToggle, Tag, TextInput, Timeline, Toaster, ToolTip, OverflowToolTip, useToaster, VerifyEmailOtp, useSidebarPrefs, useIsTruncated, useCustomTheme, ThemesList, debounce, };
 export default withTheme;
 export type { UserDetailsProps, UserDetailsLabels, UserListItem, SelectedUserDetail, UserDetailRow, RoleOption, AddUserFormValues, ChangeRoleSubmitPayload, } from "./Components/UserDetails/UserDetailsProps";
 export type { RolesPermissionProps, RolesPermissionLabels, RolesPermissionView, RolesPermissionMode, Permission, PermissionKey, RoleData, } from "./Components/RolesPermission/RolesPermissionProps";

package/dist/index.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../src/index.ts"],"names":[],"mappings":"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"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../src/index.ts"],"names":[],"mappings":"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"}

package/dist/index.js

@@ -38,7 +38,7 @@ var __importDefault = (this && this.__importDefault) || function (mod) {
 };
 Object.defineProperty(exports, "__esModule", { value: true });
 exports.ModalBody = exports.ModalHeader = exports.Modal = exports.Loading = exports.KanbanBoard = exports.InputSwitch = exports.InputTextArea = exports.HeaderActions = exports.Header = exports.OrganizationDetails = exports.SignInActivityTable = exports.CustomModulesTable = exports.RolesPermission = exports.UserDetails = exports.UpgradeButton = exports.OrgSwitcher = exports.StageItem = exports.StageProgress = exports.CopyButton = exports.ScrollToTop = exports.PdfViewer = exports.MoreItems = exports.LazyWrapper = exports.FormWrapper = exports.FilterSidebar = exports.FileUploader = exports.FileUpload = exports.FilePreviewTrigger = exports.FilePreview = exports.FieldSelectModal = exports.EmptyState = exports.Editor = exports.Dropdown = exports.DrawerFooter = exports.DrawerBody = exports.DrawerHeader = exports.Drawer = exports.DatePicker = exports.ContactForm = exports.Checkbox = exports.Card = exports.ButtonGroupIcon = exports.Button = exports.Breadcrumbs = exports.ApexLineChart = exports.ApexPolarChart = exports.ApexPieChart = exports.ApexBarChart = exports.AlertDialog = exports.Accordian = void 0;
-exports.debounce = exports.ThemesList = exports.useCustomTheme = exports.useSidebarPrefs = exports.VerifyEmailOtp = exports.useToaster = exports.ToolTip = exports.Toaster = exports.Timeline = exports.TextInput = exports.Tag = exports.TableToggle = exports.Table = exports.Switch = exports.Skeletons = exports.Slider = exports.SideBar = exports.SelectSearch = exports.SearchSelect = exports.Select = exports.Search = exports.Reorder = exports.RadioButtonGroup = exports.RadioButton = exports.ProgressBar = exports.ProfilePhotoViewer = exports.ProfileCardFooter = exports.ProfileCardBody = exports.ProfileCardHeader = exports.ProfileCard = exports.ProductDetails = exports.ProductCard = exports.PinInput = exports.PhoneNumberInput = exports.PaymentCard = exports.NumberInput = exports.MultiSelect = exports.NoteTextArea = exports.Notification = exports.NavigationBar = exports.ModalFooter = void 0;
+exports.debounce = exports.ThemesList = exports.useCustomTheme = exports.useIsTruncated = exports.useSidebarPrefs = exports.VerifyEmailOtp = exports.useToaster = exports.OverflowToolTip = exports.ToolTip = exports.Toaster = exports.Timeline = exports.TextInput = exports.Tag = exports.TableToggle = exports.Table = exports.Switch = exports.Skeletons = exports.Slider = exports.SideBar = exports.SelectSearch = exports.SearchSelect = exports.Select = exports.Search = exports.Reorder = exports.RadioButtonGroup = exports.RadioButton = exports.ProgressBar = exports.ProfilePhotoViewer = exports.ProfileCardFooter = exports.ProfileCardBody = exports.ProfileCardHeader = exports.ProfileCard = exports.ProductDetails = exports.ProductCard = exports.PinInput = exports.PhoneNumberInput = exports.PaymentCard = exports.NumberInput = exports.MultiSelect = exports.NoteTextArea = exports.Notification = exports.NavigationBar = exports.ModalFooter = void 0;
 const Accordion_1 = __importDefault(require("./Components/Accordion/Accordion"));
 exports.Accordian = Accordion_1.default;
 const AlertDialog_1 = __importDefault(require("./Components/AlertDialog/AlertDialog"));
@@ -145,6 +145,8 @@ exports.Toaster = Toaster_1.default;
 Object.defineProperty(exports, "useToaster", { enumerable: true, get: function () { return Toaster_1.useToaster; } });
 const ToolTip_1 = __importDefault(require("./Components/ToolTip/ToolTip"));
 exports.ToolTip = ToolTip_1.default;
+const OverflowToolTip_1 = __importDefault(require("./Components/ToolTip/OverflowToolTip"));
+exports.OverflowToolTip = OverflowToolTip_1.default;
 const VerifyEmailOtp_1 = __importDefault(require("./Components/EmailCards/VerifyEmailOtp/VerifyEmailOtp"));
 exports.VerifyEmailOtp = VerifyEmailOtp_1.default;
 const TableToggle_1 = __importDefault(require("./Components/Toggle/TableToggle"));
@@ -154,6 +156,8 @@ const useCustomTheme_1 = require("./Theme/useCustomTheme");
 Object.defineProperty(exports, "useCustomTheme", { enumerable: true, get: function () { return useCustomTheme_1.useCustomTheme; } });
 const useSidebarPrefs_1 = require("./Hooks/useSidebarPrefs");
 Object.defineProperty(exports, "useSidebarPrefs", { enumerable: true, get: function () { return useSidebarPrefs_1.useSidebarPrefs; } });
+const useIsTruncated_1 = require("./Hooks/useIsTruncated");
+Object.defineProperty(exports, "useIsTruncated", { enumerable: true, get: function () { return useIsTruncated_1.useIsTruncated; } });
 const Theme_1 = require("./Theme");
 Object.defineProperty(exports, "ThemesList", { enumerable: true, get: function () { return Theme_1.ThemesList; } });
 const table_1 = require("./Utils/table");

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "pixelize-design-library",
-  "version": "2.3.19",
+  "version": "2.3.20",
   "private": false,
   "main": "dist/index.js",
   "module": "dist/index.js",

package/dist/Assets/defaultLogo.tsx

@@ -1,30 +0,0 @@
-import { useCustomTheme } from "../Theme/useCustomTheme";
-
-const DefaultLogo = () => {
-  const theme = useCustomTheme();
-  return (
-    <svg
-      width="12.09"
-      height="15.95"
-      viewBox="0 0 31 29"
-      fill="none"
-      xmlns="http://www.w3.org/2000/svg"
-    >
-      <path
-        d="M30.4999 6.26137V7.81058H15.9761H14.8787V22.8508V28.8862H12.5226C9.6824 28.8862 7.32632 26.4656 7.06812 23.3995C7.06812 23.2381 7.06812 23.0444 7.06812 22.8508V18.3323C7.06812 18.2677 7.06812 18.2032 7.06812 18.1063V15.5889V6.2291C7.06812 2.80793 9.84378 -5.72205e-06 13.2972 -5.72205e-06H24.8517C28.0147 0.355021 30.4676 3.00158 30.4676 6.2291L30.4999 6.26137Z"
-        fill={theme.colors.black}
-      />
-      <path
-        d="M7.10053 23.3672H7.03598C5.16402 23.2381 3.48571 22.4635 2.25926 21.3338C0.871428 20.0428 0 18.2677 0 16.3312V15.6211H7.06825V18.1386C7.06825 18.2032 7.06825 18.2677 7.06825 18.3645V22.883C7.06825 23.0767 7.06825 23.2381 7.06825 23.4317L7.10053 23.3672Z"
-        fill={theme.colors.black}
-      />
-      <path
-        d="M30.4678 12.0063V15.6211V17.1703C30.4678 20.6238 26.272 23.3994 21.0757 23.3994H14.8789V22.8508V15.6211H22.6572V7.81056C22.6895 7.81056 30.5001 7.81056 30.5001 7.81056V11.5868C30.5001 11.7159 30.5001 11.8772 30.5001 12.0063H30.4678Z"
-        fill={theme.colors.black}
-      />
-    </svg>
-
-  )
-};
-
-export default DefaultLogo;

package/dist/Components/Input/textInputIconSize.test.d.ts

@@ -1 +0,0 @@
-export {};

package/dist/Components/Input/textInputIconSize.test.js

@@ -1,27 +0,0 @@
-"use strict";
-Object.defineProperty(exports, "__esModule", { value: true });
-var textInputIconSize_1 = require("./textInputIconSize");
-describe("getTextInputIconSizePx", function () {
-    it("maps Chakra input sizes to increasing pixel values", function () {
-        var xs = (0, textInputIconSize_1.getTextInputIconSizePx)("xs");
-        var sm = (0, textInputIconSize_1.getTextInputIconSizePx)("sm");
-        var md = (0, textInputIconSize_1.getTextInputIconSizePx)("md");
-        var lg = (0, textInputIconSize_1.getTextInputIconSizePx)("lg");
-        expect(xs).toBeLessThan(sm);
-        expect(sm).toBeLessThan(md);
-        expect(md).toBeLessThan(lg);
-    });
-    it("defaults to md for missing or unknown size", function () {
-        expect((0, textInputIconSize_1.getTextInputIconSizePx)(undefined)).toBe(18);
-        expect((0, textInputIconSize_1.getTextInputIconSizePx)("nope")).toBe(18);
-    });
-});
-describe("getTextInputIconWrapperSx", function () {
-    it("includes the resolved pixel size in svg rules for xs", function () {
-        var sx = (0, textInputIconSize_1.getTextInputIconWrapperSx)("xs");
-        var svg = sx["& > svg, & > * svg, & svg"];
-        expect(svg).toBeDefined();
-        expect(svg === null || svg === void 0 ? void 0 : svg.width).toContain("14");
-        expect(svg === null || svg === void 0 ? void 0 : svg.height).toContain("14");
-    });
-});

package/dist/Components/KanbanBoard/AccountCard.test.d.ts

@@ -1 +0,0 @@
-import "@testing-library/jest-dom";

package/dist/Components/KanbanBoard/AccountCard.test.js

@@ -1,68 +0,0 @@
-"use strict";
-var __assign = (this && this.__assign) || function () {
-    __assign = Object.assign || function(t) {
-        for (var s, i = 1, n = arguments.length; i < n; i++) {
-            s = arguments[i];
-            for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p))
-                t[p] = s[p];
-        }
-        return t;
-    };
-    return __assign.apply(this, arguments);
-};
-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("@testing-library/react");
-require("@testing-library/jest-dom");
-var react_3 = require("@chakra-ui/react");
-var AccountCard_1 = __importDefault(require("./AccountCard"));
-jest.mock("../../Theme/useCustomTheme", function () { return ({
-    useCustomTheme: function () { return ({
-        colors: {
-            background: { 50: "#fafafa", 100: "#f5f5f5", 500: "#fff" },
-            boxborder: { 300: "#e2e8f0" },
-            gray: { 200: "#eee", 700: "#333" },
-            primary: { 300: "#90cdf4", 500: "#3182ce" },
-            red: { 600: "#e53e3e" },
-            blue: { 600: "#3182ce" },
-            text: {},
-        },
-    }); },
-}); });
-var mockAccount = {
-    id: "1",
-    name: "Test Account",
-    email: "test@example.com",
-};
-var defaultProps = {
-    account: mockAccount,
-    index: 0,
-    onDelete: jest.fn(),
-    onOpen: jest.fn(),
-};
-var renderCard = function (ui) {
-    return (0, react_2.render)(react_1.default.createElement(react_3.ChakraProvider, null, ui));
-};
-describe("AccountCard – permissions", function () {
-    it("renders the delete icon when isDeletable is true (default)", function () {
-        renderCard(react_1.default.createElement(AccountCard_1.default, __assign({}, defaultProps)));
-        expect(react_2.screen.getByLabelText("Delete")).toBeInTheDocument();
-    });
-    it("hides the delete icon when isDeletable is false", function () {
-        renderCard(react_1.default.createElement(AccountCard_1.default, __assign({}, defaultProps, { isDeletable: false })));
-        expect(react_2.screen.queryByLabelText("Delete")).not.toBeInTheDocument();
-    });
-    it("renders the open (ExternalLink) icon regardless of isDeletable", function () {
-        renderCard(react_1.default.createElement(AccountCard_1.default, __assign({}, defaultProps, { isDeletable: false })));
-        expect(react_2.screen.getByLabelText("Open")).toBeInTheDocument();
-    });
-    it("calls onDelete when delete icon is clicked and isDeletable is true", function () {
-        var onDelete = jest.fn();
-        renderCard(react_1.default.createElement(AccountCard_1.default, __assign({}, defaultProps, { onDelete: onDelete, isDeletable: true })));
-        react_2.fireEvent.click(react_2.screen.getByLabelText("Delete"));
-        expect(onDelete).toHaveBeenCalledWith(mockAccount);
-    });
-});

package/dist/Components/KanbanBoard/KanbanActions/KanbanActions.test.d.ts

@@ -1 +0,0 @@
-import "@testing-library/jest-dom";

package/dist/Components/KanbanBoard/KanbanActions/KanbanActions.test.js

@@ -1,49 +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("@testing-library/react");
-require("@testing-library/jest-dom");
-var react_3 = require("@chakra-ui/react");
-var KanbanActions_1 = __importDefault(require("./KanbanActions"));
-jest.mock("../../../Theme/useCustomTheme", function () { return ({
-    useCustomTheme: function () { return ({
-        colors: {
-            text: { 500: "#555" },
-            primary: { 500: "#3182ce" },
-        },
-    }); },
-}); });
-jest.mock("../../Select/Select", function () { return ({
-    __esModule: true,
-    default: function (_a) {
-        var placeholder = _a.placeholder;
-        return react_1.default.createElement("div", { "data-testid": "mock-select" }, placeholder);
-    },
-}); });
-jest.mock("../../Divider/Divider", function () { return ({
-    __esModule: true,
-    default: function () { return react_1.default.createElement("div", { "data-testid": "mock-divider" }); },
-}); });
-var options = [{ id: "1", label: "Open" }];
-var renderActions = function (ui) {
-    return (0, react_2.render)(react_1.default.createElement(react_3.ChakraProvider, null, ui));
-};
-describe("KanbanActions", function () {
-    it("renders Edit Layout and Create New as buttons", function () {
-        renderActions(react_1.default.createElement(KanbanActions_1.default, { options: options, onEdit: jest.fn(), onCreate: jest.fn() }));
-        expect(react_2.screen.getByRole("button", { name: /edit layout/i })).toBeInTheDocument();
-        expect(react_2.screen.getByRole("button", { name: /create new/i })).toBeInTheDocument();
-    });
-    it("invokes onEdit and onCreate when buttons are clicked", function () {
-        var onEdit = jest.fn();
-        var onCreate = jest.fn();
-        renderActions(react_1.default.createElement(KanbanActions_1.default, { options: options, onEdit: onEdit, onCreate: onCreate }));
-        react_2.fireEvent.click(react_2.screen.getByRole("button", { name: /edit layout/i }));
-        react_2.fireEvent.click(react_2.screen.getByRole("button", { name: /create new/i }));
-        expect(onEdit).toHaveBeenCalledTimes(1);
-        expect(onCreate).toHaveBeenCalledTimes(1);
-    });
-});

package/dist/Components/KanbanBoard/KanbanBoard.test.d.ts

@@ -1 +0,0 @@
-import "@testing-library/jest-dom";