@teselagen/ui 0.7.33-beta.6 → 0.7.33-beta.7

package/index.cjs.js

@@ -2951,7 +2951,18 @@ let clearMe;
         document.querySelectorAll(`.${id}`).forEach((elem) => {
           elem.classList.remove(id);
         });
-        el2.classList.add(id);
+        let targetEl = el2;
+        if (targetEl.disabled || targetEl.getAttribute("disabled") !== null) {
+          const parent2 = targetEl.parentElement;
+          if (parent2) {
+            parent2.classList.add(id);
+            targetEl = parent2;
+          } else {
+            el2.classList.add(id);
+          }
+        } else {
+          el2.classList.add(id);
+        }
         const inst = tippy(`.${id}`, __spreadValues(__spreadProps(__spreadValues({
           theme: "teselagen",
           plugins: [followCursor],
@@ -19563,7 +19574,11 @@ function tableQueryParamsToHasuraClauses({
             ]
           };
         case "equalTo":
-          return { [filterOn]: { _eq: parseFloat(filterValue) } };
+          return {
+            [filterOn]: {
+              _eq: type2 === "number" || type2 === "integer" ? parseFloat(filterValue) : filterValue
+            }
+          };
         case "regex":
           return { [filterOn]: { _regex: filterValue } };
         default:
@@ -50993,10 +51008,10 @@ const RenderCell = /* @__PURE__ */ __name(({
       return (_c = (_b = (_a2 = state.form) == null ? void 0 : _a2[formName]) == null ? void 0 : _b.values) == null ? void 0 : _c.reduxFormEditingCell;
     }
   );
-  const initialValue = reactRedux.useSelector(
+  const shouldEditableCellInputBeCleared = reactRedux.useSelector(
     (state) => {
       var _a2, _b, _c;
-      return (_c = (_b = (_a2 = state.form) == null ? void 0 : _a2[formName]) == null ? void 0 : _b.values) == null ? void 0 : _c.reduxFormInitialValue;
+      return (_c = (_b = (_a2 = state.form) == null ? void 0 : _a2[formName]) == null ? void 0 : _b.values) == null ? void 0 : _c.shouldEditableCellInputBeCleared;
     }
   );
   const [row] = args;
@@ -51049,7 +51064,7 @@ const RenderCell = /* @__PURE__ */ __name(({
           dataTest,
           cancelEdit: cancelCellEdit,
           isNumeric: column.type === "number",
-          initialValue: initialValue || text2,
+          initialValue: shouldEditableCellInputBeCleared ? void 0 : text2,
           finishEdit: /* @__PURE__ */ __name((newVal) => {
             finishCellEdit(cellId, newVal);
           }, "finishEdit")
@@ -56907,8 +56922,12 @@ const DataTable = /* @__PURE__ */ __name((_I) => {
     }
   }, [selectedCells]);
   const startCellEdit = React.useCallback(
-    (cellId, initialValue) => {
-      change("reduxFormInitialValue", initialValue);
+    (cellId, shouldClear) => {
+      if (shouldClear) {
+        change("shouldEditableCellInputBeCleared", true);
+      } else {
+        change("shouldEditableCellInputBeCleared", false);
+      }
       change("reduxFormEditingCell", (prev) => {
         if (prev === cellId) return cellId;
         setSelectedCells((prev2) => {
@@ -58569,12 +58588,30 @@ const DataTable = /* @__PURE__ */ __name((_I) => {
           const rowDisabled = isEntityDisabled(entity);
           const isNum = (_g = e.code) == null ? void 0 : _g.startsWith("Digit");
           const isLetter = (_h = e.code) == null ? void 0 : _h.startsWith("Key");
-          if (!isNum && !isLetter) {
+          const allowedSpecialChars = [
+            "Minus",
+            "Equal",
+            "Backquote",
+            "BracketLeft",
+            "BracketRight",
+            "Backslash",
+            "IntlBackslash",
+            "Semicolon",
+            "Quote",
+            "Comma",
+            "Period",
+            "Slash",
+            "IntlRo",
+            "IntlYen",
+            "Space"
+          ];
+          const isSpecialChar = allowedSpecialChars.includes(e.code);
+          if (!isNum && !isLetter && !isSpecialChar) {
             return;
           }
           if (rowDisabled) return;
           e.stopPropagation();
-          startCellEdit(primarySelectedCellId, e.key);
+          startCellEdit(primarySelectedCellId, true);
         }, "onKeyDown")
       }),
       isCellEditable && entities.length > 50 && // test for this!!

package/index.es.js

@@ -2933,7 +2933,18 @@ let clearMe;
         document.querySelectorAll(`.${id}`).forEach((elem) => {
           elem.classList.remove(id);
         });
-        el2.classList.add(id);
+        let targetEl = el2;
+        if (targetEl.disabled || targetEl.getAttribute("disabled") !== null) {
+          const parent2 = targetEl.parentElement;
+          if (parent2) {
+            parent2.classList.add(id);
+            targetEl = parent2;
+          } else {
+            el2.classList.add(id);
+          }
+        } else {
+          el2.classList.add(id);
+        }
         const inst = tippy(`.${id}`, __spreadValues(__spreadProps(__spreadValues({
           theme: "teselagen",
           plugins: [followCursor],
@@ -19545,7 +19556,11 @@ function tableQueryParamsToHasuraClauses({
             ]
           };
         case "equalTo":
-          return { [filterOn]: { _eq: parseFloat(filterValue) } };
+          return {
+            [filterOn]: {
+              _eq: type2 === "number" || type2 === "integer" ? parseFloat(filterValue) : filterValue
+            }
+          };
         case "regex":
           return { [filterOn]: { _regex: filterValue } };
         default:
@@ -50975,10 +50990,10 @@ const RenderCell = /* @__PURE__ */ __name(({
       return (_c = (_b = (_a2 = state.form) == null ? void 0 : _a2[formName]) == null ? void 0 : _b.values) == null ? void 0 : _c.reduxFormEditingCell;
     }
   );
-  const initialValue = useSelector(
+  const shouldEditableCellInputBeCleared = useSelector(
     (state) => {
       var _a2, _b, _c;
-      return (_c = (_b = (_a2 = state.form) == null ? void 0 : _a2[formName]) == null ? void 0 : _b.values) == null ? void 0 : _c.reduxFormInitialValue;
+      return (_c = (_b = (_a2 = state.form) == null ? void 0 : _a2[formName]) == null ? void 0 : _b.values) == null ? void 0 : _c.shouldEditableCellInputBeCleared;
     }
   );
   const [row] = args;
@@ -51031,7 +51046,7 @@ const RenderCell = /* @__PURE__ */ __name(({
           dataTest,
           cancelEdit: cancelCellEdit,
           isNumeric: column.type === "number",
-          initialValue: initialValue || text2,
+          initialValue: shouldEditableCellInputBeCleared ? void 0 : text2,
           finishEdit: /* @__PURE__ */ __name((newVal) => {
             finishCellEdit(cellId, newVal);
           }, "finishEdit")
@@ -56889,8 +56904,12 @@ const DataTable = /* @__PURE__ */ __name((_I) => {
     }
   }, [selectedCells]);
   const startCellEdit = useCallback(
-    (cellId, initialValue) => {
-      change$1("reduxFormInitialValue", initialValue);
+    (cellId, shouldClear) => {
+      if (shouldClear) {
+        change$1("shouldEditableCellInputBeCleared", true);
+      } else {
+        change$1("shouldEditableCellInputBeCleared", false);
+      }
       change$1("reduxFormEditingCell", (prev) => {
         if (prev === cellId) return cellId;
         setSelectedCells((prev2) => {
@@ -58551,12 +58570,30 @@ const DataTable = /* @__PURE__ */ __name((_I) => {
           const rowDisabled = isEntityDisabled(entity);
           const isNum = (_g = e.code) == null ? void 0 : _g.startsWith("Digit");
           const isLetter = (_h = e.code) == null ? void 0 : _h.startsWith("Key");
-          if (!isNum && !isLetter) {
+          const allowedSpecialChars = [
+            "Minus",
+            "Equal",
+            "Backquote",
+            "BracketLeft",
+            "BracketRight",
+            "Backslash",
+            "IntlBackslash",
+            "Semicolon",
+            "Quote",
+            "Comma",
+            "Period",
+            "Slash",
+            "IntlRo",
+            "IntlYen",
+            "Space"
+          ];
+          const isSpecialChar = allowedSpecialChars.includes(e.code);
+          if (!isNum && !isLetter && !isSpecialChar) {
             return;
           }
           if (rowDisabled) return;
           e.stopPropagation();
-          startCellEdit(primarySelectedCellId, e.key);
+          startCellEdit(primarySelectedCellId, true);
         }, "onKeyDown")
       }),
       isCellEditable && entities.length > 50 && // test for this!!

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@teselagen/ui",
-  "version": "0.7.33-beta.6",
+  "version": "0.7.33-beta.7",
   "main": "./src/index.js",
   "type": "module",
   "exports": {

package/src/DataTable/RenderCell.js

@@ -32,8 +32,8 @@ export const RenderCell = ({
   const editingCell = useSelector(
     state => state.form?.[formName]?.values?.reduxFormEditingCell
   );
-  const initialValue = useSelector(
-    state => state.form?.[formName]?.values?.reduxFormInitialValue
+  const shouldEditableCellInputBeCleared = useSelector(
+    state => state.form?.[formName]?.values?.shouldEditableCellInputBeCleared
   );
 
   const [row] = args;
@@ -85,7 +85,7 @@ export const RenderCell = ({
           dataTest={dataTest}
           cancelEdit={cancelCellEdit}
           isNumeric={column.type === "number"}
-          initialValue={initialValue || text}
+          initialValue={shouldEditableCellInputBeCleared ? undefined : text}
           finishEdit={newVal => {
             finishCellEdit(cellId, newVal);
           }}

package/src/DataTable/index.js

@@ -1075,11 +1075,17 @@ const DataTable = ({
   }, [selectedCells]);
 
   const startCellEdit = useCallback(
-    (cellId, initialValue) => {
+    (cellId, shouldClear) => {
+      // console.log(`startCellEdit initialValue:`, initialValue)
       // This initial value is not needed if the event is propagated accordingly.
       // This is directly connected to the RenderCell component, which does set
       // the initial value.
-      change("reduxFormInitialValue", initialValue);
+      // change("shouldEditableCellInputBeCleared", undefined);
+      if (shouldClear) {
+        change("shouldEditableCellInputBeCleared", true);
+      } else {
+        change("shouldEditableCellInputBeCleared", false);
+      }
       change("reduxFormEditingCell", prev => {
         //check if the cell is already selected and editing and if so, don't change it
         if (prev === cellId) return cellId;
@@ -2955,12 +2961,30 @@ const DataTable = ({
               const rowDisabled = isEntityDisabled(entity);
               const isNum = e.code?.startsWith("Digit");
               const isLetter = e.code?.startsWith("Key");
-              if (!isNum && !isLetter) {
+              const allowedSpecialChars = [
+                "Minus",
+                "Equal",
+                "Backquote",
+                "BracketLeft",
+                "BracketRight",
+                "Backslash",
+                "IntlBackslash",
+                "Semicolon",
+                "Quote",
+                "Comma",
+                "Period",
+                "Slash",
+                "IntlRo",
+                "IntlYen",
+                "Space"
+              ];
+              const isSpecialChar = allowedSpecialChars.includes(e.code);
+              if (!isNum && !isLetter && !isSpecialChar) {
                 return;
               }
               if (rowDisabled) return;
               e.stopPropagation();
-              startCellEdit(primarySelectedCellId, e.key);
+              startCellEdit(primarySelectedCellId, true);
             }
           })}
         >

package/src/DataTable/utils/tableQueryParamsToHasuraClauses.js

@@ -190,7 +190,14 @@ export function tableQueryParamsToHasuraClauses({
               ]
             };
           case "equalTo":
-            return { [filterOn]: { _eq: parseFloat(filterValue) } };
+            return {
+              [filterOn]: {
+                _eq:
+                  type === "number" || type === "integer"
+                    ? parseFloat(filterValue)
+                    : filterValue
+              }
+            };
           case "regex":
             return { [filterOn]: { _regex: filterValue } };
           default:

package/src/autoTooltip.js

@@ -52,7 +52,23 @@ let clearMe;
           elem.classList.remove(id);
         });
 
-        el.classList.add(id);
+        // Check if element is disabled, if so use parent instead
+        let targetEl = el;
+        if (targetEl.disabled || targetEl.getAttribute("disabled") !== null) {
+          const parent = targetEl.parentElement;
+          if (parent) {
+            // Use the parent as the tooltip target
+            parent.classList.add(id);
+            targetEl = parent; // Change the tooltip target to parent
+          } else {
+            // No parent, keep using the original element
+            el.classList.add(id);
+          }
+        } else {
+          // Element not disabled, use it directly
+          el.classList.add(id);
+        }
+
         const inst = tippy(`.${id}`, {
           theme: "teselagen",
           plugins: [followCursor],
@@ -84,19 +100,12 @@ let clearMe;
                   requires: ["computeStyles"],
                   requiresIfExists: ["offset"],
                   fn({ state }) {
-                    // console.log(`state:`, state);
-                    // state.styles.popper.bottom = 20 + "px";
                     const customBoundary =
                       document.querySelector(dataAvoid) ||
                       document.querySelector(dataAvoidBackup);
 
                     if (!customBoundary) return;
                     const a = customBoundary.getBoundingClientRect();
-                    // console.log(
-                    //   `state.rects.reference.y:`,
-                    //   state.rects.reference.y
-                    // );
-                    // console.log(`a.top:`, a.top);
 
                     if (a.top < state.rects.reference.y) {
                       const b = Math.abs(
@@ -104,16 +113,6 @@ let clearMe;
                       );
                       state.styles.popper.bottom = b + "px";
                     }
-
-                    // const overflow = detectOverflow(state, {
-                    //   boundary: customBoundary,
-                    //   altBoundary: true
-                    // });
-                    // console.log(`overflow:`, overflow);
-                    // if (overflow.bottom > 0) {
-                    //   const a = Math.abs(overflow.bottom);
-                    //   state.styles.popper.bottom = a + "px";
-                    // }
                   }
                 }
               ]
@@ -199,3 +198,6 @@ function parentIncludesNoChildDataTip(el, count) {
   if (el.getAttribute("data-no-child-data-tip")) return true;
   return parentIncludesNoChildDataTip(el.parentElement, count + 1);
 }
+
+// Export the function to clear parent tooltips so it can be used elsewhere
+// export { clearParentTooltips };

package/src/utils/isBeingCalledExcessively.js

@@ -1,4 +1,5 @@
 const keyCount = {};
+// if this function is hit more than 20 times in a row in 2 seconds with the same uniqName then throw an error
 export const isBeingCalledExcessively = ({ uniqName }) => {
   if (process.env.NODE_ENV !== "development") {
     return;
@@ -6,19 +7,25 @@ export const isBeingCalledExcessively = ({ uniqName }) => {
   if (!uniqName) {
     throw new Error("uniqName is required");
   }
-  // if this function is hit more than 10 times in a row in 2 seconds with the same uniqName then throw an error
-  if (keyCount[uniqName + "_timeout"]) {
-    clearTimeout(keyCount[uniqName + "_timeout"]);
-  }
+  // Initialize the count if it doesn't exist
   keyCount[uniqName] = keyCount[uniqName] || 0;
   keyCount[uniqName]++;
 
-  keyCount[uniqName + "_timeout"] = setTimeout(() => {
-    keyCount[uniqName] = 0;
-  }, 2000);
+  // Only set the timeout if it doesn't exist already to ensure it runs exactly once every 2 seconds
+  if (!keyCount[uniqName + "_timeout"]) {
+    keyCount[uniqName + "_timeout"] = setTimeout(() => {
+      keyCount[uniqName] = 0;
+      keyCount[uniqName + "_timeout"] = null;
+    }, 2000);
+  }
 
   if (keyCount[uniqName] > 20) {
     keyCount[uniqName] = 0;
+    // Also clear the timeout when throwing an error
+    if (keyCount[uniqName + "_timeout"]) {
+      clearTimeout(keyCount[uniqName + "_timeout"]);
+      keyCount[uniqName + "_timeout"] = null;
+    }
     throw new Error(`isBeingCalledExcessively: ${uniqName}`);
   }
 };