@teselagen/ui 0.5.19 → 0.5.20

package/src/index.js

@@ -18,11 +18,11 @@ export {
 } from "./DataTable/utils/withSelectedEntities";
 export {
   default as DataTable,
-  ConnectedPagingTool as PagingTool
+  ConnectedPagingTool as PagingTool,
+  removeCleanRows
 } from "./DataTable";
-export { removeCleanRows } from "./DataTable/utils";
 
-export { getIdOrCodeOrIndex } from "./DataTable/utils";
+export { default as getIdOrCodeOrIndex } from "./DataTable/utils/getIdOrCodeOrIndex";
 export { default as convertSchema } from "./DataTable/utils/convertSchema";
 export { default as Loading } from "./Loading";
 export { throwFormError } from "./throwFormError";

package/src/showDialogOnDocBody.js

@@ -1,4 +1,4 @@
-import { createRoot } from "react-dom/client";
+import ReactDOM from "react-dom";
 import React from "react";
 // import withDialog from "./enhancers/withDialog";
 import { Dialog } from "@blueprintjs/core";
@@ -19,15 +19,19 @@ export default function showDialogOnDocBody(DialogComp, options = {}) {
     DialogCompToUse = props => {
       return (
         <Dialog usePortal={false} title="pass a {title} prop" isOpen {...props}>
-          <DialogComp {...props} hideModal={onClose} onClose={onClose} />
+          <DialogComp
+            {...props}
+            hideModal={onClose}
+            onClose={onClose}
+          ></DialogComp>
         </Dialog>
       );
     };
   } else {
     DialogCompToUse = DialogComp;
   }
-  const root = createRoot(dialogHolder);
-  root.render(
-    <DialogCompToUse hideModal={onClose} onClose={onClose} {...options} />
+  ReactDOM.render(
+    <DialogCompToUse hideModal={onClose} onClose={onClose} {...options} />,
+    dialogHolder
   );
 }

package/src/useDialog.js

@@ -1,6 +1,6 @@
 import React, { useState } from "react";
 
-/*
+/* 
 
   const {toggleDialog, comp} = useDialog({
     ModalComponent: SimpleInsertData,
@@ -31,14 +31,12 @@ export const useDialog = ({ ModalComponent, ...rest }) => {
         ...rest?.dialogProps,
         ...additionalProps?.dialogProps
       }}
-    />
+    ></ModalComponent>
   );
-
   const toggleDialog = () => {
     setOpen(!isOpen);
   };
-
-  const showDialogPromise = async (handlerName, moreProps = {}) => {
+  async function showDialogPromise(handlerName, moreProps = {}) {
     return new Promise(resolve => {
       //return a promise that can be awaited
       setAdditionalProps({
@@ -61,7 +59,6 @@ export const useDialog = ({ ModalComponent, ...rest }) => {
       });
       setOpen(true); //open the dialog
     });
-  };
-
+  }
   return { comp, showDialogPromise, toggleDialog, setAdditionalProps };
 };

package/src/utils/renderOnDoc.js

@@ -1,32 +1,29 @@
-import { createRoot } from "react-dom/client";
+import ReactDOM from "react-dom";
 
 export function renderOnDoc(fn) {
   const elemDiv = document.createElement("div");
   elemDiv.style.cssText =
     "position:absolute;width:100%;height:100%;top:0px;opacity:0.3;z-index:0;";
   document.body.appendChild(elemDiv);
-  const root = createRoot(elemDiv);
   const handleClose = () => {
     setTimeout(() => {
-      root.unmount(elemDiv);
+      ReactDOM.unmountComponentAtNode(elemDiv);
       document.body.removeChild(elemDiv);
     });
   };
-  root.render(fn(handleClose));
+  return ReactDOM.render(fn(handleClose), elemDiv);
 }
-
 export function renderOnDocSimple(el) {
   const elemDiv = document.createElement("div");
   elemDiv.style.cssText =
     "position:absolute;width:100%;height:100%;top:0px;opacity:1;z-index:10000;";
   document.body.appendChild(elemDiv);
-  const root = createRoot(elemDiv);
-  root.render(el);
   const handleClose = () => {
     setTimeout(() => {
-      root.unmount();
+      ReactDOM.unmountComponentAtNode(elemDiv);
       document.body.removeChild(elemDiv);
     });
   };
+  ReactDOM.render(el, elemDiv);
   return handleClose;
 }

package/style.css

@@ -9085,13 +9085,6 @@ button:not(:disabled):active {
 .rg-celleditor input {
   border: none;
 }
-.bp3-popover.tg-info-helper-popover .bp3-popover-content {
-  max-width: 340px;
-}
-
-.info-helper-clickable .bp3-popover-target {
-  cursor: pointer;
-}
 .tg-select {
   width: 100%;
   min-width: 170px;
@@ -9153,6 +9146,13 @@ button:not(:disabled):active {
   max-height: 300px;
   overflow: auto;
 }
+.bp3-popover.tg-info-helper-popover .bp3-popover-content {
+  max-width: 340px;
+}
+
+.info-helper-clickable .bp3-popover-target {
+  cursor: pointer;
+}
 .ReactTable{position:relative;display:-ms-flexbox;display:flex;-ms-flex-direction:column;flex-direction:column;border:1px solid rgba(0,0,0,0.1);}.ReactTable *{box-sizing:border-box}.ReactTable .rt-table{-ms-flex:auto 1;flex:auto 1;display:-ms-flexbox;display:flex;-ms-flex-direction:column;flex-direction:column;-ms-flex-align:stretch;align-items:stretch;width:100%;border-collapse:collapse;overflow:auto}.ReactTable .rt-thead{-ms-flex:1 0 auto;flex:1 0 auto;display:-ms-flexbox;display:flex;-ms-flex-direction:column;flex-direction:column;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none;}.ReactTable .rt-thead.-headerGroups{background:rgba(0,0,0,0.03);border-bottom:1px solid rgba(0,0,0,0.05)}.ReactTable .rt-thead.-filters{border-bottom:1px solid rgba(0,0,0,0.05);}.ReactTable .rt-thead.-filters input,.ReactTable .rt-thead.-filters select{border:1px solid rgba(0,0,0,0.1);background:#fff;padding:5px 7px;font-size:inherit;border-radius:3px;font-weight:normal;outline-width:0}.ReactTable .rt-thead.-filters .rt-th{border-right:1px solid rgba(0,0,0,0.02)}.ReactTable .rt-thead.-header{box-shadow:0 2px 15px 0 rgba(0,0,0,0.15)}.ReactTable .rt-thead .rt-tr{text-align:center}.ReactTable .rt-thead .rt-th,.ReactTable .rt-thead .rt-td{padding:5px 5px;line-height:normal;position:relative;border-right:1px solid rgba(0,0,0,0.05);transition:box-shadow .3s cubic-bezier(.175,.885,.32,1.275);box-shadow:inset 0 0 0 0 transparent;}.ReactTable .rt-thead .rt-th.-sort-asc,.ReactTable .rt-thead .rt-td.-sort-asc{box-shadow:inset 0 3px 0 0 rgba(0,0,0,0.6)}.ReactTable .rt-thead .rt-th.-sort-desc,.ReactTable .rt-thead .rt-td.-sort-desc{box-shadow:inset 0 -3px 0 0 rgba(0,0,0,0.6)}.ReactTable .rt-thead .rt-th.-cursor-pointer,.ReactTable .rt-thead .rt-td.-cursor-pointer{cursor:pointer}.ReactTable .rt-thead .rt-th:last-child,.ReactTable .rt-thead .rt-td:last-child{border-right:0}.ReactTable .rt-thead .rt-th:focus{outline-width:0}.ReactTable .rt-thead .rt-resizable-header{overflow:visible;}.ReactTable .rt-thead .rt-resizable-header:last-child{overflow:hidden}.ReactTable .rt-thead .rt-resizable-header-content{overflow:hidden;text-overflow:ellipsis}.ReactTable .rt-thead .rt-header-pivot{border-right-color:#f7f7f7}.ReactTable .rt-thead .rt-header-pivot:after,.ReactTable .rt-thead .rt-header-pivot:before{left:100%;top:50%;border:solid transparent;content:" ";height:0;width:0;position:absolute;pointer-events:none}.ReactTable .rt-thead .rt-header-pivot:after{border-color:rgba(255,255,255,0);border-left-color:#fff;border-width:8px;margin-top:-8px}.ReactTable .rt-thead .rt-header-pivot:before{border-color:rgba(102,102,102,0);border-left-color:#f7f7f7;border-width:10px;margin-top:-10px}.ReactTable .rt-tbody{-ms-flex:99999 1 auto;flex:99999 1 auto;display:-ms-flexbox;display:flex;-ms-flex-direction:column;flex-direction:column;overflow:auto;}.ReactTable .rt-tbody .rt-tr-group{border-bottom:solid 1px rgba(0,0,0,0.05);}.ReactTable .rt-tbody .rt-tr-group:last-child{border-bottom:0}.ReactTable .rt-tbody .rt-td{border-right:1px solid rgba(0,0,0,0.02);}.ReactTable .rt-tbody .rt-td:last-child{border-right:0}.ReactTable .rt-tbody .rt-expandable{cursor:pointer;text-overflow:clip}.ReactTable .rt-tr-group{-ms-flex:1 0 auto;flex:1 0 auto;display:-ms-flexbox;display:flex;-ms-flex-direction:column;flex-direction:column;-ms-flex-align:stretch;align-items:stretch}.ReactTable .rt-tr{-ms-flex:1 0 auto;flex:1 0 auto;display:-ms-inline-flexbox;display:inline-flex}.ReactTable .rt-th,.ReactTable .rt-td{-ms-flex:1 0 0px;flex:1 0 0;white-space:nowrap;text-overflow:ellipsis;padding:7px 5px;overflow:hidden;transition:.3s ease;transition-property:width,min-width,padding,opacity;}.ReactTable .rt-th.-hidden,.ReactTable .rt-td.-hidden{width:0 !important;min-width:0 !important;padding:0 !important;border:0 !important;opacity:0 !important}.ReactTable .rt-expander{display:inline-block;position:relative;margin:0;color:transparent;margin:0 10px;}.ReactTable .rt-expander:after{content:'';position:absolute;width:0;height:0;top:50%;left:50%;transform:translate(-50%,-50%) rotate(-90deg);border-left:5.04px solid transparent;border-right:5.04px solid transparent;border-top:7px solid rgba(0,0,0,0.8);transition:all .3s cubic-bezier(.175,.885,.32,1.275);cursor:pointer}.ReactTable .rt-expander.-open:after{transform:translate(-50%,-50%) rotate(0)}.ReactTable .rt-resizer{display:inline-block;position:absolute;width:36px;top:0;bottom:0;right:-18px;cursor:col-resize;z-index:10}.ReactTable .rt-tfoot{-ms-flex:1 0 auto;flex:1 0 auto;display:-ms-flexbox;display:flex;-ms-flex-direction:column;flex-direction:column;box-shadow:0 0 15px 0 rgba(0,0,0,0.15);}.ReactTable .rt-tfoot .rt-td{border-right:1px solid rgba(0,0,0,0.05);}.ReactTable .rt-tfoot .rt-td:last-child{border-right:0}.ReactTable.-striped .rt-tr.-odd{background:rgba(0,0,0,0.03)}.ReactTable.-highlight .rt-tbody .rt-tr:not(.-padRow):hover{background:rgba(0,0,0,0.05)}.ReactTable .-pagination{z-index:1;display:-ms-flexbox;display:flex;-ms-flex-pack:justify;justify-content:space-between;-ms-flex-align:stretch;align-items:stretch;-ms-flex-wrap:wrap;flex-wrap:wrap;padding:3px;box-shadow:0 0 15px 0 rgba(0,0,0,0.1);border-top:2px solid rgba(0,0,0,0.1);}.ReactTable .-pagination input,.ReactTable .-pagination select{border:1px solid rgba(0,0,0,0.1);background:#fff;padding:5px 7px;font-size:inherit;border-radius:3px;font-weight:normal;outline-width:0}.ReactTable .-pagination .-btn{-webkit-appearance:none;-moz-appearance:none;appearance:none;display:block;width:100%;height:100%;border:0;border-radius:3px;padding:6px;font-size:1em;color:rgba(0,0,0,0.6);background:rgba(0,0,0,0.1);transition:all .1s ease;cursor:pointer;outline-width:0;}.ReactTable .-pagination .-btn[disabled]{opacity:.5;cursor:default}.ReactTable .-pagination .-btn:not([disabled]):hover{background:rgba(0,0,0,0.3);color:#fff}.ReactTable .-pagination .-previous,.ReactTable .-pagination .-next{-ms-flex:1;flex:1;text-align:center}.ReactTable .-pagination .-center{-ms-flex:1.5;flex:1.5;text-align:center;margin-bottom:0;display:-ms-flexbox;display:flex;-ms-flex-direction:row;flex-direction:row;-ms-flex-wrap:wrap;flex-wrap:wrap;-ms-flex-align:center;align-items:center;-ms-flex-pack:distribute;justify-content:space-around}.ReactTable .-pagination .-pageInfo{display:inline-block;margin:3px 10px;white-space:nowrap}.ReactTable .-pagination .-pageJump{display:inline-block;}.ReactTable .-pagination .-pageJump input{width:70px;text-align:center}.ReactTable .-pagination .-pageSizeOptions{margin:3px 10px}.ReactTable .rt-noData{display:block;position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);background:rgba(255,255,255,0.8);transition:all .3s ease;z-index:1;pointer-events:none;padding:20px;color:rgba(0,0,0,0.5)}.ReactTable .-loading{display:block;position:absolute;left:0;right:0;top:0;bottom:0;background:rgba(255,255,255,0.8);transition:all .3s ease;z-index:-1;opacity:0;pointer-events:none;}.ReactTable .-loading > div{position:absolute;display:block;text-align:center;width:100%;top:50%;left:0;font-size:15px;color:rgba(0,0,0,0.6);transform:translateY(-52%);transition:all .3s cubic-bezier(.25,.46,.45,.94)}.ReactTable .-loading.-active{opacity:1;z-index:2;pointer-events:all;}.ReactTable .-loading.-active > div{transform:translateY(50%)}.ReactTable .rt-resizing .rt-th,.ReactTable .rt-resizing .rt-td{transition:none !important;cursor:col-resize;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none}/* DataTable style.css */
 .custom-menu-item {
   text-overflow: ellipsis;

package/utils/renderOnDoc.d.ts

@@ -1,2 +1,2 @@
-export function renderOnDoc(fn: any): void;
+export function renderOnDoc(fn: any): Element;
 export function renderOnDocSimple(el: any): () => void;

package/src/ExcelCell.js

@@ -1,38 +0,0 @@
-/* eslint react/jsx-no-bind: 0 */
-import { Popover } from "@blueprintjs/core";
-import React, { useState } from "react";
-
-export default function ExcelCell() {
-  const [v, setV] = useState("");
-  const [isPopoverOpen, setIsPopoverOpen] = useState(false);
-  return (
-    <Popover
-      onClose={() => {
-        setIsPopoverOpen(false);
-      }}
-      isOpen={isPopoverOpen}
-      content={<div>Sum</div>}
-    >
-      <div
-        style={{
-          border: "1px solid #ccc",
-          padding: 5,
-          width: 100,
-          height: 30
-        }}
-        contentEditable
-        onInput={e => {
-          const text = e.currentTarget.textContent;
-
-          if (text === "=") {
-            // open a popover
-            setIsPopoverOpen(true);
-          }
-          setV(text);
-        }}
-      >
-        {v}
-      </div>
-    </Popover>
-  );
-}