@teselagen/ui 0.7.34 → 0.7.36

package/src/enhancers/withDialog/index.js

@@ -1,196 +0,0 @@
-import React from "react";
-import { Dialog } from "@blueprintjs/core";
-import { connect } from "react-redux";
-import { lifecycle, compose } from "recompose";
-import { camelCase } from "lodash-es";
-import { nanoid } from "nanoid";
-import ResizableDraggableDialog from "../../ResizableDraggableDialog";
-
-/**
- * usage:
- * in container:
- * compose(
- *   withDialog({ title: "Select Aliquot(s) From", other bp dialog props here  })
- * )
- *
- *
- * in react component
- * import MyDialogEnhancedComponent from "./MyDialogEnhancedComponent"
- *
- * render() {
- *  return <div>
- *    <MyDialogEnhancedComponent
- *      dialogProps={} //bp dialog overrides can go here
- *      target={<button>Open Dialog</button> } //target can also be passed as a child component
- *      myRandomProp={'yuppp'} //pass any other props like normal to the component
- *
- *    />
- *  </div>
- * }
- */
-
-//  or programatically:
-// const ProgramaticDialog = withDialog({
-//   dialogName: "programaticDialog", //giving it a unique dialogName means you can
-//   title: "Programatic Dialog Demo"
-// })(DialogInner);
-//
-// add the no target dialog somewhere on the page
-// <ProgramaticDialog></ProgramaticDialog> //this just renders without any target
-//
-// somewhere else on the page:
-// <Button>Click To Open Dialog</Button>
-
-export default function withDialog(topLevelDialogProps) {
-  function dialogHoc(WrappedComponent) {
-    return class DialogWrapper extends React.Component {
-      componentWillUnmount() {
-        const { dispatch, dialogName, uniqueName } = this.props;
-        if (dialogName) {
-          dispatch({
-            type: "TG_UNREGISTER_MODAL",
-            name: dialogName,
-            uniqueName
-          });
-        }
-      }
-      render() {
-        const {
-          target,
-          noTarget,
-          isDialogOpen,
-          showModal,
-          dialogName,
-          onClickRename,
-          hideModal,
-          fetchPolicy = "network-only",
-          children,
-          onCloseHook,
-          dialogProps,
-          title,
-          isDraggable,
-          alreadyRendering,
-          ...rest
-        } = this.props;
-        const extraDialogProps = {
-          ...topLevelDialogProps,
-          ...dialogProps
-        };
-        const _onCloseHook = onCloseHook || extraDialogProps.onCloseHook;
-        const { noButtonClickPropagate } = {
-          ...this.props,
-          ...extraDialogProps
-        };
-        const isOpen = isDialogOpen || extraDialogProps.isOpen;
-        const targetEl = target || children;
-        // if (!targetEl && !dialogName)
-        //   throw new Error(
-        //     "withDialog error: Please provide a target or child element to the withDialog() enhanced component. If you really don't want a target, please pass a 'noTarget=true' prop"
-        //   );
-        const DialogToUse =
-          isDraggable || extraDialogProps.isDraggable
-            ? ResizableDraggableDialog
-            : Dialog;
-        return (
-          <React.Fragment>
-            {isOpen && (
-              <DialogToUse
-                onClose={function () {
-                  hideModal();
-                  _onCloseHook && _onCloseHook();
-                }}
-                className={dialogName || camelCase()}
-                title={title}
-                isOpen={isOpen}
-                canEscapeKeyClose={false}
-                canOutsideClickClose={false}
-                {...extraDialogProps}
-              >
-                <WrappedComponent
-                  {...{
-                    ...rest,
-                    fetchPolicy,
-                    ssr: false,
-                    hideModal
-                  }}
-                />
-              </DialogToUse>
-            )}
-            {targetEl &&
-              React.cloneElement(targetEl, {
-                [onClickRename || "onClick"]: e => {
-                  showModal();
-                  if (noButtonClickPropagate) {
-                    e.preventDefault();
-                    e.stopPropagation();
-                  }
-                }
-              })}
-          </React.Fragment>
-        );
-      }
-    };
-  }
-
-  return compose(
-    connect(({ tg_modalState }) => {
-      return { ...topLevelDialogProps, tg_modalState };
-    }),
-    lifecycle({
-      componentWillMount: function () {
-        const { dispatch, dialogName } = this.props;
-        const uniqueName = nanoid();
-        const nameToUse = dialogName || uniqueName;
-        this.setState({
-          nameToUse,
-          uniqueName
-        });
-        if (dialogName) {
-          dispatch({
-            type: "TG_REGISTER_MODAL",
-            name: dialogName,
-            uniqueName
-          });
-        }
-      }
-    }),
-    connect(
-      function ({ tg_modalState }, { nameToUse, uniqueName }) {
-        const dialogState = tg_modalState[nameToUse] || {};
-        const { open, __registeredAs, ...rest } = dialogState;
-        const newProps = {
-          ...rest,
-          isDialogOpen:
-            open &&
-            (__registeredAs
-              ? Object.keys(__registeredAs)[
-                  Object.keys(__registeredAs).length - 1
-                ] === uniqueName
-              : true)
-        };
-        return newProps;
-      },
-      function (dispatch, { nameToUse, hideModal, showModal }) {
-        return {
-          showModal:
-            showModal ||
-            function () {
-              dispatch({
-                type: "TG_SHOW_MODAL",
-                name: nameToUse
-              });
-            },
-          hideModal:
-            hideModal ||
-            function () {
-              dispatch({
-                type: "TG_HIDE_MODAL",
-                name: nameToUse
-              });
-            }
-        };
-      }
-    ),
-    dialogHoc
-  );
-}

package/src/enhancers/withDialog/tg_modalState.js

@@ -1,47 +0,0 @@
-import { omit } from "lodash-es";
-
-export default function tg_modalState(
-  state = {},
-  { type, name, uniqueName, props = {} }
-) {
-  const existingModalState = state[name] || {};
-  const { __registeredAs = {} } = existingModalState;
-  if (type === "TG_REGISTER_MODAL") {
-    return {
-      ...state,
-      [name]: {
-        ...existingModalState,
-        __registeredAs: { ...__registeredAs, [uniqueName]: true }
-      }
-    };
-  }
-  if (type === "TG_UNREGISTER_MODAL") {
-    return {
-      ...state,
-      [name]: {
-        ...existingModalState,
-        __registeredAs: omit(__registeredAs, uniqueName)
-      }
-    };
-  }
-  if (type === "TG_SHOW_MODAL") {
-    return {
-      ...state,
-      [name]: {
-        ...existingModalState,
-        ...props,
-        open: true
-      }
-    };
-  }
-  if (type === "TG_HIDE_MODAL") {
-    return {
-      ...state,
-      [name]: {
-        __registeredAs: existingModalState.__registeredAs,
-        open: false
-      }
-    };
-  }
-  return state;
-}

package/src/enhancers/withField.js

@@ -1,20 +0,0 @@
-import React from "react";
-import { Field } from "redux-form";
-import { fieldRequired } from "../FormComponents/utils";
-
-//simple enhancer that wraps a component in a redux <Field/> component
-//all options are passed as props to <Field/>
-export default function WithField(fieldProps) {
-  return function AddFieldHOC(Component) {
-    return function AddField({ isRequired, ...rest }) {
-      return (
-        <Field
-          {...(isRequired && { validate: fieldRequired })}
-          {...fieldProps}
-          {...rest}
-          component={Component}
-        />
-      );
-    };
-  };
-}

package/src/enhancers/withFields.js

@@ -1,11 +0,0 @@
-import React from "react";
-import { Fields } from "redux-form";
-//simple enhancer that wraps a component in a redux <Fields/> component
-//all options are passed as props to <Fields/>
-export default function WithFields(fieldsProps) {
-  return function AddFieldsHOC(Component) {
-    return function AddFields(props) {
-      return <Fields {...fieldsProps} {...props} component={Component} />;
-    };
-  };
-}

package/src/enhancers/withLocalStorage.js

@@ -1,11 +0,0 @@
-import React from "react";
-import { Field } from "redux-form";
-//simple enhancer that wraps a component in a redux <Field/> component
-//all options are passed as props to <Field/>
-export default function WithField(fieldProps) {
-  return function AddFieldHOC(Component) {
-    return function AddField(props) {
-      return <Field {...fieldProps} {...props} component={Component} />;
-    };
-  };
-}

package/src/index.js

@@ -1,88 +0,0 @@
-import "@blueprintjs/core/lib/css/blueprint.css";
-import "@blueprintjs/datetime/lib/css/blueprint-datetime.css";
-import "@blueprintjs/icons/lib/css/blueprint-icons.css";
-import "./style.css";
-import "./autoTooltip";
-export { LoadingDots } from "./FormComponents/LoadingDots";
-export { FormSeparator } from "./FormComponents/FormSeparator";
-export * from "./AssignDefaultsModeContext";
-export { default as Uploader } from "./FormComponents/Uploader";
-export { mergeSchemas } from "./DataTable/utils/convertSchema";
-export {
-  getCurrentParamsFromUrl,
-  setCurrentParamsOnUrl
-} from "./DataTable/utils/queryParams";
-export {
-  default as withSelectedEntities,
-  getSelectedEntities
-} from "./DataTable/utils/withSelectedEntities";
-export {
-  default as DataTable,
-  ConnectedPagingTool as PagingTool
-} from "./DataTable";
-export { removeCleanRows, useTableEntities } from "./DataTable/utils";
-
-export { useDeepEqualMemo } from "./utils/hooks";
-export { getIdOrCodeOrIndex } from "./DataTable/utils";
-export { default as convertSchema } from "./DataTable/utils/convertSchema";
-export { default as Loading } from "./Loading";
-export { throwFormError } from "./throwFormError";
-export { default as AdvancedOptions } from "./AdvancedOptions";
-export { default as TgSelect } from "./TgSelect";
-export { default as TgHTMLSelect } from "./TgHtmlSelect";
-export { default as wrapDialog } from "./wrapDialog";
-export { default as PromptUnsavedChanges } from "./PromptUnsavedChanges";
-export { default as BlueprintError } from "./BlueprintError";
-export { default as DropdownButton } from "./DropdownButton";
-export { default as DialogFooter } from "./DialogFooter";
-export { default as adHoc } from "./utils/adHoc";
-export { default as IntentText } from "./IntentText";
-export { default as popoverOverflowModifiers } from "./utils/popoverOverflowModifiers";
-export * from "./utils/tgFormValues";
-export { default as tgFormValues } from "./utils/tgFormValues";
-export { default as withStore } from "./utils/withStore";
-export {
-  default as withTableParams,
-  useTableParams
-} from "./DataTable/utils/withTableParams";
-export { default as InfoHelper } from "./InfoHelper";
-export { default as showConfirmationDialog } from "./showConfirmationDialog";
-export { default as showAppSpinner } from "./showAppSpinner";
-export { default as CollapsibleCard } from "./CollapsibleCard";
-export { default as ResizableDraggableDialog } from "./ResizableDraggableDialog";
-export { default as MenuBar } from "./MenuBar";
-export { default as rerenderOnWindowResize } from "./rerenderOnWindowResize";
-export { default as HotkeysDialog } from "./HotkeysDialog";
-export { default as FillWindow } from "./FillWindow";
-export { default as withFields } from "./enhancers/withFields";
-export { default as withField } from "./enhancers/withField";
-export { default as withDialog } from "./enhancers/withDialog";
-export { default as tg_modalState } from "./enhancers/withDialog/tg_modalState";
-export { default as Timeline, TimelineEvent } from "./Timeline";
-export * from "./FormComponents";
-export * from "./useDialog";
-export * from "./toastr";
-export * from "./showConfirmationDialog";
-export * from "./utils/handlerHelpers";
-export * from "./customIcons";
-export { default as basicHandleActionsWithFullState } from "./utils/basicHandleActionsWithFullState";
-export { default as combineReducersWithFullState } from "./utils/combineReducersWithFullState";
-export { default as withSelectTableRecords } from "./utils/withSelectTableRecords";
-export { default as pureNoFunc } from "./utils/pureNoFunc";
-export * from "./utils/tagUtils";
-export * from "./utils/hotkeyUtils";
-export * from "./utils/menuUtils";
-export * from "./utils/browserUtils";
-export * from "./utils/commandUtils";
-export * from "./utils/commandControls";
-export * from "./utils/useTraceUpdate";
-export * from "./utils/hooks/useStableReference";
-export { default as AsyncValidateFieldSpinner } from "./AsyncValidateFieldSpinner";
-export { default as showProgressToast } from "./utils/showProgressToast";
-export { default as getTextFromEl } from "./utils/getTextFromEl";
-export { default as ScrollToTop } from "./ScrollToTop";
-const noop = () => undefined;
-export { noop };
-export { default as showDialogOnDocBody } from "./showDialogOnDocBody";
-export { default as TableFormTrackerContext } from "./DataTable/TableFormTrackerContext";
-export { initializeHasuraWhereAndFilter } from "./DataTable/utils/initializeHasuraWhereAndFilter";

package/src/rerenderOnWindowResize.js

@@ -1,26 +0,0 @@
-import { throttle } from "lodash-es";
-// use like this within a react component:
-
-// constructor(props){
-//   super(props)
-//   rerenderOnWindowResize(this)
-// }
-
-export default function rerenderOnWindowResize(that) {
-  that.updateDimensions = throttle(() => {
-    if (that.props.disabled) return;
-    that.forceUpdate();
-  }, 250);
-  const componentDidMount = that.componentDidMount;
-  const componentWillUnmount = that.componentWillUnmount;
-
-  that.componentDidMount = (...args) => {
-    componentDidMount && componentDidMount.bind(that)(...args);
-    window.addEventListener("resize", that.updateDimensions);
-  };
-
-  that.componentWillUnmount = (...args) => {
-    componentWillUnmount && componentWillUnmount.bind(that)(...args);
-    window.removeEventListener("resize", that.updateDimensions);
-  };
-}

package/src/showAppSpinner.js

@@ -1,12 +0,0 @@
-import React from "react";
-import { Overlay } from "@blueprintjs/core";
-import { renderOnDocSimple } from "./utils/renderOnDoc";
-import Loading from "./Loading";
-
-export default function showAppSpinner() {
-  return renderOnDocSimple(
-    <Overlay isOpen={true}>
-      <Loading centeredInPage loading></Loading>
-    </Overlay>
-  );
-}

package/src/showConfirmationDialog/index.js

@@ -1,148 +0,0 @@
-import React, { Component } from "react";
-import { Button, Classes, Dialog, Intent } from "@blueprintjs/core";
-import { renderOnDoc } from "../utils/renderOnDoc";
-import DialogFooter from "../DialogFooter";
-
-// usage
-// const doAction = await showConfirmationDialog({
-//   text:
-//     "Are you sure you want to re-run this tool? Downstream tools with linked outputs will need to be re-run as well!",
-//     intent: Intent.DANGER, //applied to the right most confirm button
-//     confirmButtonText: "Yep!",
-//     cancelButtonText: "Nope",
-//     canEscapeKeyCancel: true //this is false by default
-// });
-// console.info("doAction:", doAction);
-
-// const doAction = await showConfirmationDialog({
-//   thirdButtonText: 'Click me'
-//   thirdButtonIntent: 'primary'
-// });
-// console.info("doAction:", doAction); //logs thirdButtonClicked
-//returns a promise that resolves with true or false depending on if the user cancels or not!
-export default function showConfirmationDialog(opts) {
-  return new Promise(resolve => {
-    renderOnDoc(handleClose => {
-      return <AlertWrapper {...{ ...opts, handleClose, resolve }} />;
-    });
-  });
-}
-
-export class AlertWrapper extends Component {
-  state = { isOpen: true };
-  render() {
-    const {
-      title,
-      handleClose,
-      text,
-      resolve,
-      noCancelButton,
-      content,
-      className,
-      thirdButtonNotMinimal,
-      thirdButtonClassName,
-      thirdButtonText,
-      thirdButtonIntent,
-      fourthButtonNotMinimal,
-      fourthButtonClassName,
-      fourthButtonText,
-      fourthButtonIntent,
-      handleSubmit,
-      canEscapeKeyCancel,
-      confirmButtonText = "OK",
-      cancelButtonText = "Cancel",
-      intent = Intent.PRIMARY,
-      ...rest
-    } = this.props;
-    const doClose = confirm => {
-      handleClose();
-      this.setState({ isOpen: false });
-      resolve(confirm);
-    };
-    return (
-      <Dialog
-        title={title}
-        className={(title ? "" : "bp3-alert") + ` ${className || ""}`}
-        isOpen={this.state.isOpen}
-        intent={intent}
-        cancelButtonText={cancelButtonText}
-        onCancel={cancelButtonText ? () => doClose(false) : undefined}
-        onConfirm={
-          handleSubmit ? handleSubmit(v => doClose(v)) : () => doClose(true)
-        }
-        {...rest}
-        {...(noCancelButton && {
-          onCancel: undefined,
-          cancelButtonText: undefined
-        })}
-      >
-        <div
-          className={title ? "bp3-dialog-body" : "bp3-alert-contents"}
-          style={{ padding: 5 }}
-        >
-          {content}
-          {text && <div style={{ marginBottom: 10 }}>{text}</div>}
-        </div>
-        <DialogFooter
-          {...{
-            onBackClick:
-              cancelButtonText && !noCancelButton
-                ? () => doClose(false)
-                : undefined,
-            onClick: handleSubmit
-              ? handleSubmit(v => doClose(v))
-              : () => doClose(true),
-            noCancel: true,
-            additionalButtons:
-              thirdButtonText || fourthButtonText ? (
-                <React.Fragment>
-                  {!!fourthButtonText && (
-                    <Button
-                      className={
-                        (!fourthButtonNotMinimal ? Classes.MINIMAL : "") +
-                        " " +
-                        fourthButtonClassName
-                      }
-                      intent={fourthButtonIntent}
-                      text={fourthButtonText}
-                      onClick={
-                        handleSubmit
-                          ? handleSubmit(v =>
-                              doClose({ ...v, fourthButtonClicked: true })
-                            )
-                          : () => doClose("fourthButtonClicked")
-                      }
-                    ></Button>
-                  )}
-                  {!!thirdButtonText && (
-                    <Button
-                      className={
-                        (!thirdButtonNotMinimal ? Classes.MINIMAL : "") +
-                        " " +
-                        thirdButtonClassName
-                      }
-                      intent={thirdButtonIntent}
-                      text={thirdButtonText}
-                      onClick={
-                        handleSubmit
-                          ? handleSubmit(v =>
-                              doClose({ ...v, thirdButtonClicked: true })
-                            )
-                          : () => {
-                              doClose("thirdButtonClicked");
-                            }
-                      }
-                    ></Button>
-                  )}
-                </React.Fragment>
-              ) : undefined,
-            containerClassname: title ? "" : "bp3-alert-footer",
-            backText: noCancelButton ? "" : cancelButtonText,
-            text: confirmButtonText,
-            intent
-          }}
-        ></DialogFooter>
-      </Dialog>
-    );
-  }
-}

package/src/showDialogOnDocBody.js

@@ -1,33 +0,0 @@
-import { createRoot } from "react-dom/client";
-import React from "react";
-// import withDialog from "./enhancers/withDialog";
-import { Dialog } from "@blueprintjs/core";
-import { nanoid } from "nanoid";
-
-//this is only really useful for unconnected standalone simple dialogs
-//remember to pass usePortal={false} to the <Dialog/> component so it will close properly
-export default function showDialogOnDocBody(DialogComp, options = {}) {
-  const dialogHolder = document.createElement("div");
-  const className = "myDialog" + nanoid();
-  dialogHolder.className = className;
-  document.body.appendChild(dialogHolder);
-  const onClose = () => {
-    document.querySelector("." + className).remove();
-  };
-  let DialogCompToUse;
-  if (options.addDialogContainer) {
-    DialogCompToUse = props => {
-      return (
-        <Dialog usePortal={false} title="pass a {title} prop" isOpen {...props}>
-          <DialogComp {...props} hideModal={onClose} onClose={onClose} />
-        </Dialog>
-      );
-    };
-  } else {
-    DialogCompToUse = DialogComp;
-  }
-  const root = createRoot(dialogHolder);
-  root.render(
-    <DialogCompToUse hideModal={onClose} onClose={onClose} {...options} />
-  );
-}