linear-react-components-ui 1.1.26-beta.16 → 1.1.26-beta.18

package/lib/tooltip/useTooltip.js

@@ -1,96 +1,128 @@
-import { c as q } from "../_virtual/compiler-runtime.js";
-import { useState as W, useRef as z, useEffect as k } from "react";
-const F = 40;
-function Q(G) {
-  const t = q.c(33), {
-    targetRef: V,
-    text: l,
-    width: O,
-    space: C,
-    position: H,
-    errorMessage: f,
-    onDeniedText: r
-  } = G, D = O === void 0 ? "auto" : O, c = C === void 0 ? 0 : C, h = H === void 0 ? "bottom" : H, [n, a] = W(h), [I, X] = W(""), [M, u] = W(!1);
-  let w;
-  t[0] !== D ? (w = {
-    width: D,
-    height: F
-  }, t[0] = D, t[1] = w) : w = t[1];
-  const [s, j] = W(w), o = V, P = z(null);
-  let g;
-  t[2] !== o.current ? (g = (m) => {
-    o.current && o.current.contains(m.target) ? u(!0) : u(!1);
-  }, t[2] = o.current, t[3] = g) : g = t[3];
-  const v = g;
-  let b;
-  t[4] === Symbol.for("react.memo_cache_sentinel") ? (b = () => {
-    u(!1);
-  }, t[4] = b) : b = t[4];
-  const A = b;
-  let x;
-  t[5] === Symbol.for("react.memo_cache_sentinel") ? (x = () => {
-    u(!1);
-  }, t[5] = x) : x = t[5];
-  const N = x;
-  let T;
-  t[6] !== f || t[7] !== r || t[8] !== v || t[9] !== o || t[10] !== l ? (T = () => ((l || r) && (f ? u(!0) : (u(!1), document.addEventListener("mouseover", v), document.addEventListener("scroll", N, !0), o && o.current && o.current.addEventListener("mouseout", A))), () => {
-    (l || r) && (document.removeEventListener("mouseover", v), document.removeEventListener("scroll", N, !0), o && o.current && o.current.removeEventListener("mouseout", A));
-  }), t[6] = f, t[7] = r, t[8] = v, t[9] = o, t[10] = l, t[11] = T) : T = t[11];
-  let E;
-  t[12] !== f || t[13] !== r || t[14] !== l ? (E = [f, l, r], t[12] = f, t[13] = r, t[14] = l, t[15] = E) : E = t[15], k(T, E);
-  let y;
-  t[16] !== c || t[17] !== n || t[18] !== o.current || t[19] !== s ? (y = () => {
-    if (o.current && P.current) {
-      const {
-        width: m,
-        height: p
-      } = s, i = o.current.getBoundingClientRect(), B = (i.top + i.bottom) / 2, d = P.current.clientWidth;
-      let e = `width: ${typeof m == "string" ? m : `${m}px`}`, Y = i.left + i.width / 2 - d / 2;
-      Y = Math.min(Y, document.body.clientWidth - d - c), e = e + `; left: ${Math.max(c, Y)}px`;
-      t: switch (n) {
-        case "top": {
-          i.top < p ? a("bottom") : e = e + `; top: ${i.top + window.scrollY - p - c - 5}px`;
-          break t;
-        }
-        case "bottom": {
-          window.innerHeight - i.bottom < p ? a("top") : e = e + `; top: ${i.top + window.scrollY + i.height + c + 5}px`;
-          break t;
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.useTooltip = useTooltip;
+var _react = require("react");
+const TOOLTIP_INITIAL_HEIGHT = 40;
+function useTooltip(_ref) {
+  let {
+    targetRef,
+    text,
+    width: widthProp = 'auto',
+    space = 0,
+    position: positionProp = 'bottom',
+    errorMessage,
+    onDeniedText
+  } = _ref;
+  const [stateTooltipPosition, setStateTooltipPosition] = (0, _react.useState)(positionProp);
+  const [tooltipStyle, setTooltipStyle] = (0, _react.useState)('');
+  const [showTooltip, setShowTooltip] = (0, _react.useState)(false);
+  const [tooltipDimensions, setTooltipDimensions] = (0, _react.useState)({
+    width: widthProp,
+    height: TOOLTIP_INITIAL_HEIGHT
+  });
+  const targetElement = targetRef;
+  const tooltipElement = (0, _react.useRef)(null);
+  const onMouseOver = e => {
+    if (targetElement.current && targetElement.current.contains(e.target)) {
+      setShowTooltip(true);
+    } else setShowTooltip(false);
+  };
+  const onMouseOut = () => {
+    setShowTooltip(false);
+  };
+  const onAnyScroll = () => {
+    setShowTooltip(false);
+  };
+  (0, _react.useEffect)(() => {
+    if (text || onDeniedText) {
+      if (errorMessage) {
+        setShowTooltip(true);
+      } else {
+        setShowTooltip(false);
+        document.addEventListener('mouseover', onMouseOver);
+        document.addEventListener('scroll', onAnyScroll, true);
+        if (targetElement && targetElement.current) {
+          targetElement.current.addEventListener('mouseout', onMouseOut);
         }
-        case "left": {
-          i.left < d ? window.innerWidth - i.right < d ? a("bottom") : a("right") : (e = e + `; top: ${B + window.scrollY - p / 2}px`, e = e + `; left: ${i.left - d - 6 - c}px`);
-          break t;
-        }
-        case "right": {
-          window.innerWidth - i.right < d ? a("left") : (e = e + `; top: ${B + window.scrollY - p / 2}px`, e = e + `; left: ${i.left + i.width + 5 + c}px`);
-          break t;
+      }
+    }
+    return () => {
+      if (text || onDeniedText) {
+        document.removeEventListener('mouseover', onMouseOver);
+        document.removeEventListener('scroll', onAnyScroll, true);
+        if (targetElement && targetElement.current) {
+          targetElement.current.removeEventListener('mouseout', onMouseOut);
         }
+      }
+    };
+  }, [errorMessage, text, onDeniedText]);
+  (0, _react.useEffect)(() => {
+    if (targetElement.current && tooltipElement.current) {
+      const {
+        width,
+        height
+      } = tooltipDimensions;
+      const targetDimensions = targetElement.current.getBoundingClientRect();
+      const targetVerticalCenter = (targetDimensions.top + targetDimensions.bottom) / 2;
+      const tooltipClientWidth = tooltipElement.current.clientWidth;
+      let style = `width: ${typeof width === 'string' ? width : `${width}px`}`;
+      let left = targetDimensions.left + targetDimensions.width / 2 - tooltipClientWidth / 2;
+      left = Math.min(left, document.body.clientWidth - tooltipClientWidth - space);
+      style += `; left: ${Math.max(space, left)}px`;
+      switch (stateTooltipPosition) {
+        case 'top':
+          if (targetDimensions.top < height) {
+            setStateTooltipPosition('bottom');
+          } else {
+            style += `; top: ${targetDimensions.top + window.scrollY - height - space - 5}px`;
+          }
+          break;
+        case 'bottom':
+          if (window.innerHeight - targetDimensions.bottom < height) {
+            setStateTooltipPosition('top');
+          } else {
+            style += `; top: ${targetDimensions.top + window.scrollY + targetDimensions.height + space + 5}px`;
+          }
+          break;
+        case 'left':
+          if (targetDimensions.left < tooltipClientWidth) {
+            if (window.innerWidth - targetDimensions.right < tooltipClientWidth) {
+              setStateTooltipPosition('bottom');
+            } else {
+              setStateTooltipPosition('right');
+            }
+          } else {
+            style += `; top: ${targetVerticalCenter + window.scrollY - height / 2}px`;
+            style += `; left: ${targetDimensions.left - tooltipClientWidth - 6 - space}px`;
+          }
+          break;
+        case 'right':
+          if (window.innerWidth - targetDimensions.right < tooltipClientWidth) {
+            setStateTooltipPosition('left');
+          } else {
+            style += `; top: ${targetVerticalCenter + window.scrollY - height / 2}px`;
+            style += `; left: ${targetDimensions.left + targetDimensions.width + 5 + space}px`;
+          }
+          break;
         default:
-          e = e + "";
+          style += '';
       }
-      X(e);
+      setTooltipStyle(style);
     }
-  }, t[16] = c, t[17] = n, t[18] = o.current, t[19] = s, t[20] = y) : y = t[20];
-  let S;
-  t[21] !== n || t[22] !== s ? (S = [s, n], t[21] = n, t[22] = s, t[23] = S) : S = t[23], k(y, S);
-  let $;
-  t[24] !== h ? ($ = () => {
-    a(h);
-  }, t[24] = h, t[25] = $) : $ = t[25];
-  let L;
-  t[26] === Symbol.for("react.memo_cache_sentinel") ? (L = [window.scrollY, window.scrollX, window.innerWidth], t[26] = L) : L = t[26], k($, L);
-  const R = r || l;
-  let _;
-  return t[27] !== M || t[28] !== n || t[29] !== R || t[30] !== s || t[31] !== I ? (_ = {
-    text: R,
-    tooltipRef: P,
-    style: I,
-    className: n,
-    handlerSetDimensions: j,
-    tooltipDimensions: s,
-    showTooltip: M
-  }, t[27] = M, t[28] = n, t[29] = R, t[30] = s, t[31] = I, t[32] = _) : _ = t[32], _;
-}
-export {
-  Q as useTooltip
-};
-//# sourceMappingURL=useTooltip.js.map
+  }, [tooltipDimensions, stateTooltipPosition]);
+  (0, _react.useEffect)(() => {
+    setStateTooltipPosition(positionProp);
+  }, [window.scrollY, window.scrollX, window.innerWidth]);
+  return {
+    text: onDeniedText || text,
+    tooltipRef: tooltipElement,
+    style: tooltipStyle,
+    className: stateTooltipPosition,
+    handlerSetDimensions: setTooltipDimensions,
+    tooltipDimensions: tooltipDimensions,
+    showTooltip
+  };
+}

package/lib/treetable/Body.d.ts

@@ -1,2 +1,3 @@
-declare const TreeTableBody: () => import("react/jsx-runtime").JSX.Element;
-export default TreeTableBody;
+declare const TreeTableBody: () => JSX.Element;
+
+export { TreeTableBody as default };

package/lib/treetable/Body.js

@@ -1,37 +1,34 @@
-import { jsx as c } from "react/jsx-runtime";
-import { c as d } from "../_virtual/compiler-runtime.js";
-import { useContext as w, useState as u, useEffect as R } from "react";
-import "../_virtual/lodash.js";
-import "../table/helpers.js";
-import T from "../table/Body.js";
-import '../assets/styles/table.css';import '../assets/styles/skeleton.css';import '../assets/styles/gridlayout.css';import '../assets/styles/tooltip.css';import '../assets/styles/icon.css';/* empty css                         */
-import "react-dom";
-/* empty css                            */
-/* empty css                               */
-/* empty css                             */
-/* empty css                          */
-import { TreeTableContext as x, searchRootElements as E } from "./helpers.js";
-import y from "./Row.js";
-const k = () => {
-  const o = d.c(11), {
-    data: e,
-    rootPropName: m,
-    stylesForRow: a,
-    parentPropName: f
-  } = w(x), [s, n] = u();
-  let i;
-  o[0] !== e || o[1] !== f ? (i = () => {
-    const t = E(e, f, 0);
-    n(t);
-  }, o[0] = e, o[1] = f, o[2] = i) : i = o[2];
-  let p;
-  o[3] !== e ? (p = [e], o[3] = e, o[4] = p) : p = o[4], R(i, p);
-  let r;
-  o[5] !== s || o[6] !== m || o[7] !== a ? (r = s && s.map((t) => /* @__PURE__ */ c(y, { dataRow: t, rowLevel: t.rowLevel ? t.rowLevel + 1 : 0, rowId: `${t[m]}`, style: a }, t[m])), o[5] = s, o[6] = m, o[7] = a, o[8] = r) : r = o[8];
-  let l;
-  return o[9] !== r ? (l = /* @__PURE__ */ c(T, { children: r }), o[9] = r, o[10] = l) : l = o[10], l;
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.default = void 0;
+var _react = _interopRequireWildcard(require("react"));
+var _table = require("../table");
+var _helpers = require("./helpers");
+var _Row = _interopRequireDefault(require("./Row"));
+function _interopRequireDefault(e) { return e && e.__esModule ? e : { default: e }; }
+function _getRequireWildcardCache(e) { if ("function" != typeof WeakMap) return null; var r = new WeakMap(), t = new WeakMap(); return (_getRequireWildcardCache = function (e) { return e ? t : r; })(e); }
+function _interopRequireWildcard(e, r) { if (!r && e && e.__esModule) return e; if (null === e || "object" != typeof e && "function" != typeof e) return { default: e }; var t = _getRequireWildcardCache(r); if (t && t.has(e)) return t.get(e); var n = { __proto__: null }, a = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var u in e) if ("default" !== u && {}.hasOwnProperty.call(e, u)) { var i = a ? Object.getOwnPropertyDescriptor(e, u) : null; i && (i.get || i.set) ? Object.defineProperty(n, u, i) : n[u] = e[u]; } return n.default = e, t && t.set(e, n), n; }
+const TreeTableBody = () => {
+  const {
+    data,
+    rootPropName,
+    stylesForRow,
+    parentPropName
+  } = (0, _react.useContext)(_helpers.TreeTableContext);
+  const [rootElements, setRootElements] = (0, _react.useState)();
+  (0, _react.useEffect)(() => {
+    const elements = (0, _helpers.searchRootElements)(data, parentPropName, 0);
+    setRootElements(elements);
+  }, [data]);
+  return /*#__PURE__*/_react.default.createElement(_table.TBody, null, rootElements && rootElements.map(element => /*#__PURE__*/_react.default.createElement(_Row.default, {
+    dataRow: element,
+    rowLevel: element.rowLevel ? element.rowLevel + 1 : 0,
+    key: element[rootPropName],
+    rowId: `${element[rootPropName]}`,
+    style: stylesForRow
+  })));
 };
-export {
-  k as default
-};
-//# sourceMappingURL=Body.js.map
+var _default = exports.default = TreeTableBody;

package/lib/treetable/Header.d.ts

@@ -1,2 +1,3 @@
-declare const TreeTableHeader: () => import("react/jsx-runtime").JSX.Element;
-export default TreeTableHeader;
+declare const TreeTableHeader: () => JSX.Element;
+
+export { TreeTableHeader as default };

package/lib/treetable/Header.js

@@ -1,31 +1,24 @@
-import { jsx as i } from "react/jsx-runtime";
-import { c as p } from "../_virtual/compiler-runtime.js";
-import { useContext as n } from "react";
-import "../_virtual/lodash.js";
-import a from "../table/Header.js";
-import s from "../table/Row.js";
-import "../table/helpers.js";
-import '../assets/styles/table.css';import '../assets/styles/skeleton.css';import '../assets/styles/gridlayout.css';/* empty css                               */
-/* empty css                             */
-import f from "../table/HeaderColumn.js";
-/* empty css                          */
-import { TreeTableContext as c } from "./helpers.js";
-import l from "../node_modules/uuid/dist/v1.js";
-const w = () => {
-  const e = p.c(5), {
-    dataColumns: m
-  } = n(c);
-  let r;
-  e[0] === Symbol.for("react.memo_cache_sentinel") ? (r = l(), e[0] = r) : r = e[0];
-  let t;
-  e[1] !== m ? (t = m.map(d), e[1] = m, e[2] = t) : t = e[2];
-  let o;
-  return e[3] !== t ? (o = /* @__PURE__ */ i(a, { children: /* @__PURE__ */ i(s, { children: t }, `tr-header-${r}`) }), e[3] = t, e[4] = o) : o = e[4], o;
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.default = void 0;
+var _react = _interopRequireWildcard(require("react"));
+var _uuid = require("uuid");
+var _table = require("../table");
+var _helpers = require("./helpers");
+function _getRequireWildcardCache(e) { if ("function" != typeof WeakMap) return null; var r = new WeakMap(), t = new WeakMap(); return (_getRequireWildcardCache = function (e) { return e ? t : r; })(e); }
+function _interopRequireWildcard(e, r) { if (!r && e && e.__esModule) return e; if (null === e || "object" != typeof e && "function" != typeof e) return { default: e }; var t = _getRequireWildcardCache(r); if (t && t.has(e)) return t.get(e); var n = { __proto__: null }, a = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var u in e) if ("default" !== u && {}.hasOwnProperty.call(e, u)) { var i = a ? Object.getOwnPropertyDescriptor(e, u) : null; i && (i.get || i.set) ? Object.defineProperty(n, u, i) : n[u] = e[u]; } return n.default = e, t && t.set(e, n), n; }
+const TreeTableHeader = () => {
+  const {
+    dataColumns
+  } = (0, _react.useContext)(_helpers.TreeTableContext);
+  return /*#__PURE__*/_react.default.createElement(_table.THeader, null, /*#__PURE__*/_react.default.createElement(_table.TRow, {
+    key: `tr-header-${(0, _uuid.v1)()}`
+  }, dataColumns.map(column => /*#__PURE__*/_react.default.createElement(_table.Th, {
+    key: `th-${column.name}-${(0, _uuid.v1)()}`,
+    style: column.style
+  }, column.title))));
 };
-function d(e) {
-  return /* @__PURE__ */ i(f, { style: e.style, children: e.title }, `th-${e.name}-${l()}`);
-}
-export {
-  w as default
-};
-//# sourceMappingURL=Header.js.map
+var _default = exports.default = TreeTableHeader;

package/lib/treetable/Row.d.ts

@@ -1,3 +1,9 @@
-import { ITreeTableRow } from './types';
-declare const TreeRow: (props: ITreeTableRow) => import("react/jsx-runtime").JSX.Element;
-export default TreeRow;
+import { I as ITreeTableRow } from '../types.d-b477e076.js';
+import 'react';
+import '../table/types.js';
+import '../tooltip/types.js';
+import '../@types/Position.js';
+
+declare const TreeRow: (props: ITreeTableRow) => JSX.Element;
+
+export { TreeRow as default };