@indico-data/design-system 2.56.0 → 2.57.0

package/lib/index.js

@@ -8,6 +8,7 @@ var ReactDOM = require('react-dom');
 var reactFontawesome = require('@fortawesome/react-fontawesome');
 var n = require('styled-components');
 var ReactSelect = require('react-select');
+var node_crypto = require('node:crypto');
 
 function _interopDefaultCompat (e) { return e && typeof e === 'object' && 'default' in e ? e : { default: e }; }
 
@@ -42899,6 +42900,57 @@ function BarSpinner(_a) {
     return (jsxRuntime.jsx("div", Object.assign({ className: `bar-spinner ${className}`, id: id, style: style }, rest, { children: jsxRuntime.jsx("span", {}) })));
 }
 
+const urlAlphabet =
+  'useandom-26T198340PX75pxJACKVERYMINDBUSHWOLF_GQZbfghjklqvwyzrict';
+
+const POOL_SIZE_MULTIPLIER = 128;
+let pool, poolOffset;
+function fillPool(bytes) {
+  if (!pool || pool.length < bytes) {
+    pool = Buffer.allocUnsafe(bytes * POOL_SIZE_MULTIPLIER);
+    node_crypto.webcrypto.getRandomValues(pool);
+    poolOffset = 0;
+  } else if (poolOffset + bytes > pool.length) {
+    node_crypto.webcrypto.getRandomValues(pool);
+    poolOffset = 0;
+  }
+  poolOffset += bytes;
+}
+function nanoid(size = 21) {
+  fillPool((size |= 0));
+  let id = '';
+  for (let i = poolOffset - size; i < poolOffset; i++) {
+    id += urlAlphabet[pool[i] & 63];
+  }
+  return id
+}
+
+const Truncate = (_a) => {
+    var { lineClamp = 0, truncateString, hasTooltip = true, tooltipId } = _a, rest = __rest(_a, ["lineClamp", "truncateString", "hasTooltip", "tooltipId"]);
+    const [isTruncated, setIsTruncated] = React.useState(false);
+    const id = (tooltipId !== null && tooltipId !== void 0 ? tooltipId : nanoid()).replace(/[^a-zA-Z0-9-_]/g, '_');
+    React.useEffect(() => {
+        const checkTruncation = () => {
+            const element = document.querySelector(`[data-tooltip-id="${id}"]`);
+            if (element) {
+                if (lineClamp === 0) {
+                    setIsTruncated(element.scrollWidth > element.clientWidth);
+                }
+                else {
+                    setIsTruncated(element.scrollHeight > element.clientHeight);
+                }
+            }
+        };
+        checkTruncation();
+        window.addEventListener('resize', checkTruncation);
+        return () => window.removeEventListener('resize', checkTruncation);
+    }, [id, lineClamp]);
+    const truncateStyle = {
+        '--line-clamp': lineClamp,
+    };
+    return (jsxRuntime.jsxs("div", { className: "truncate-wrapper", style: truncateStyle, children: [jsxRuntime.jsx("span", Object.assign({ "data-testid": `truncate-${id}-${isTruncated ? 'truncated' : 'not-truncated'}`, "data-tooltip-id": id, "data-tooltip-content": isTruncated ? truncateString : undefined, className: lineClamp > 0 ? 'truncate-clip' : 'truncate' }, rest, { children: truncateString })), isTruncated && truncateString && hasTooltip && (jsxRuntime.jsx(Tooltip, { "data-tooltip-delay-hide": 100, id: id, border: "solid 1px var(--pf-border-color)", children: truncateString }))] }));
+};
+
 exports.Badge = Badge;
 exports.BarSpinner = BarSpinner;
 exports.Button = Button$1;
@@ -42929,6 +42981,7 @@ exports.Textarea = LabeledTextarea;
 exports.TimePicker = TimePicker;
 exports.ToggleInput = Toggle;
 exports.Tooltip = Tooltip;
+exports.Truncate = Truncate;
 exports.arrow = arrow$2;
 exports.autoPlacement = autoPlacement;
 exports.autoUpdate = autoUpdate$1;