@teselagen/ove 0.7.28 → 0.7.30-beta.1

package/ReflexElement.js

@@ -1,160 +0,0 @@
-///////////////////////////////////////////////////////////
-// ReflexElement
-// By Philippe Leefsma
-// December 2016
-//
-///////////////////////////////////////////////////////////
-import { throttle } from "lodash-es";
-import Measure from "react-measure";
-import PropTypes from "prop-types";
-import Browser from "./Browser";
-import React from "react";
-
-export default class ReflexElement extends React.Component {
-  /////////////////////////////////////////////////////////
-  //
-  //
-  /////////////////////////////////////////////////////////
-  static propTypes = {
-    renderOnResizeRate: PropTypes.number,
-    propagateDimensions: PropTypes.bool,
-    renderOnResize: PropTypes.bool,
-    resizeHeight: PropTypes.bool,
-    resizeWidth: PropTypes.bool,
-    className: PropTypes.string
-  };
-
-  /////////////////////////////////////////////////////////
-  //
-  //
-  /////////////////////////////////////////////////////////
-  static defaultProps = {
-    renderOnResize: Browser.isSafari(), // Safari is creepy ...
-    propagateDimensions: false,
-    renderOnResizeRate: 60,
-    resizeHeight: true,
-    resizeWidth: true,
-    className: ""
-  };
-
-  /////////////////////////////////////////////////////////
-  //
-  //
-  /////////////////////////////////////////////////////////
-  constructor(props) {
-    super(props);
-
-    this.onResize = this.onResize.bind(this);
-
-    this.setStateThrottled = throttle(state => {
-      this.setState(state);
-    }, this.props.renderOnResizeRate);
-
-    this.state = {
-      dimensions: {
-        height: "100%",
-        width: "100%"
-      }
-    };
-  }
-
-  /////////////////////////////////////////////////////////
-  //
-  //
-  /////////////////////////////////////////////////////////
-  async UNSAFE_componentWillReceiveProps(props) {
-    if (props.size !== this.props.size) {
-      const directions = this.toArray(props.direction);
-
-      for (const dir of directions) {
-        await this.props.events.emit("element.size", {
-          size: props.size,
-          direction: dir,
-          element: this
-        });
-      }
-    }
-  }
-
-  /////////////////////////////////////////////////////////
-  //
-  //
-  /////////////////////////////////////////////////////////
-  toArray(obj) {
-    return obj ? (Array.isArray(obj) ? obj : [obj]) : [];
-  }
-
-  /////////////////////////////////////////////////////////
-  //
-  //
-  /////////////////////////////////////////////////////////
-  onResize(rect) {
-    const { renderOnResize, resizeHeight, resizeWidth } = this.props;
-
-    if (renderOnResize) {
-      this.setStateThrottled({
-        dimensions: {
-          ...(resizeHeight && { height: Math.floor(rect.bounds.height) }),
-          ...(resizeWidth && { width: Math.floor(rect.bounds.width) })
-        }
-      });
-    }
-  }
-
-  /////////////////////////////////////////////////////////
-  //
-  //
-  /////////////////////////////////////////////////////////
-  renderChildren() {
-    if (this.props.propagateDimensions) {
-      return React.Children.map(this.props.children, child => {
-        const newProps = Object.assign({}, child.props, {
-          dimensions: this.state.dimensions
-        });
-
-        return React.cloneElement(child, newProps);
-      });
-    }
-
-    return this.props.children;
-  }
-
-  /////////////////////////////////////////////////////////
-  //
-  //
-  /////////////////////////////////////////////////////////
-  render() {
-    const classNames = ["reflex-element", ...this.props.className.split(" ")];
-
-    const className = classNames.join(" ");
-
-    const outerStyle = Object.assign(
-      {},
-      {
-        WebkitBoxFlex: this.props.flex,
-        FlexElement: this.props.flex,
-        MozBoxFlex: this.props.flex,
-        WebkitFlex: this.props.flex,
-        flex: this.props.flex
-      },
-      this.props.style
-    );
-
-    const innerStyle = {
-      height: this.state.dimensions.height,
-      width: this.state.dimensions.width
-    };
-
-    return (
-      <Measure bounds onResize={this.onResize}>
-        {({ measureRef }) => (
-          <div ref={measureRef} className={className} style={outerStyle}>
-            <div className="tg-reflex-element-inner" style={innerStyle}>
-              {this.renderChildren()}
-            </div>
-          </div>
-        )}
-      </Measure>
-    );
-  }
-}

package/ReflexEvents.js

@@ -1,77 +0,0 @@
-///////////////////////////////////////////////////////////
-// ReflexEvents
-// By Philippe Leefsma
-// December 2016
-//
-///////////////////////////////////////////////////////////
-class ReflexEvents {
-  /////////////////////////////////////////////////////////
-  //
-  //
-  /////////////////////////////////////////////////////////
-  constructor() {
-    this._events = {};
-  }
-
-  /////////////////////////////////////////////////////////
-  // Supports multiple events space-separated
-  //
-  /////////////////////////////////////////////////////////
-  on(events, fct) {
-    events.split(" ").forEach(event => {
-      this._events[event] = this._events[event] || [];
-      this._events[event].push(fct);
-    });
-
-    return this;
-  }
-
-  /////////////////////////////////////////////////////////
-  // Supports multiple events space-separated
-  //
-  /////////////////////////////////////////////////////////
-  off(events, fct) {
-    // eslint-disable-next-line eqeqeq
-    if (events == undefined) {
-      this._events = {};
-      return;
-    }
-
-    events.split(" ").forEach(event => {
-      if (event in this._events === false) return;
-
-      if (fct) {
-        this._events[event].splice(this._events[event].indexOf(fct), 1);
-      } else {
-        this._events[event] = [];
-      }
-    });
-
-    return this;
-  }
-
-  /////////////////////////////////////////////////////////
-  //
-  //
-  /////////////////////////////////////////////////////////
-  emit(event /* , args... */) {
-    if (this._events[event] === undefined) return;
-
-    const tmpArray = this._events[event].slice();
-
-    for (let i = 0; i < tmpArray.length; ++i) {
-      const result = tmpArray[i].apply(
-        this,
-        Array.prototype.slice.call(arguments, 1)
-      );
-
-      if (result !== undefined) {
-        return result;
-      }
-    }
-
-    return undefined;
-  }
-}
-
-export default ReflexEvents;

package/ReflexSplitter.js

@@ -1,205 +0,0 @@
-///////////////////////////////////////////////////////////
-// ReflexSplitter
-// By Philippe Leefsma
-// December 2016
-//
-///////////////////////////////////////////////////////////
-import PropTypes from "prop-types";
-import ReactDOM from "react-dom";
-import Browser from "./Browser";
-import React from "react";
-
-export default class ReflexSplitter extends React.Component {
-  /////////////////////////////////////////////////////////
-  //
-  //
-  /////////////////////////////////////////////////////////
-  static propTypes = {
-    children: PropTypes.oneOfType([
-      PropTypes.arrayOf(PropTypes.node),
-      PropTypes.node
-    ]),
-    onStartResize: PropTypes.func,
-    onStopResize: PropTypes.func,
-    className: PropTypes.string,
-    propagate: PropTypes.bool,
-    onResize: PropTypes.func,
-    style: PropTypes.object
-  };
-
-  /////////////////////////////////////////////////////////
-  //
-  //
-  /////////////////////////////////////////////////////////
-  static defaultProps = {
-    document: typeof document === "undefined" ? null : document,
-    onStartResize: null,
-    onStopResize: null,
-    propagate: false,
-    onResize: null,
-    className: "",
-    style: {}
-  };
-
-  /////////////////////////////////////////////////////////
-  //
-  //
-  /////////////////////////////////////////////////////////
-  constructor(props) {
-    super(props);
-
-    this.state = {
-      active: false
-    };
-
-    this.onMouseMove = this.onMouseMove.bind(this);
-    this.onMouseDown = this.onMouseDown.bind(this);
-    this.onMouseUp = this.onMouseUp.bind(this);
-
-    this.document = props.document;
-  }
-
-  /////////////////////////////////////////////////////////
-  //
-  //
-  /////////////////////////////////////////////////////////
-  componentDidMount() {
-    if (!this.document) {
-      return;
-    }
-
-    this.document.addEventListener("touchend", this.onMouseUp);
-
-    this.document.addEventListener("mouseup", this.onMouseUp);
-
-    this.document.addEventListener("mousemove", this.onMouseMove, {
-      passive: false
-    });
-
-    this.document.addEventListener("touchmove", this.onMouseMove, {
-      passive: false
-    });
-  }
-
-  /////////////////////////////////////////////////////////
-  //
-  //
-  /////////////////////////////////////////////////////////
-  componentWillUnmount() {
-    if (!this.document) {
-      return;
-    }
-
-    this.document.removeEventListener("mouseup", this.onMouseUp);
-
-    this.document.removeEventListener("touchend", this.onMouseUp);
-
-    this.document.removeEventListener("mousemove", this.onMouseMove);
-
-    this.document.removeEventListener("touchmove", this.onMouseMove);
-  }
-
-  /////////////////////////////////////////////////////////
-  //
-  //
-  /////////////////////////////////////////////////////////
-  onMouseMove(event) {
-    if (this.state.active) {
-      this.props.events.emit("splitter.resize", {
-        splitter: this,
-        event
-      });
-
-      if (this.props.onResize) {
-        this.props.onResize({
-          domElement: ReactDOM.findDOMNode(this),
-          component: this
-        });
-      }
-
-      event.stopPropagation();
-      event.preventDefault();
-    }
-  }
-
-  /////////////////////////////////////////////////////////
-  //
-  //
-  /////////////////////////////////////////////////////////
-  onMouseDown(event) {
-    this.setState({
-      active: true
-    });
-
-    if (this.props.onStartResize) {
-      // cancels resize from controller
-      // if needed by returning true
-      // to onStartResize
-      if (
-        this.props.onStartResize({
-          domElement: ReactDOM.findDOMNode(this),
-          component: this
-        })
-      ) {
-        return;
-      }
-    }
-
-    this.props.events.emit("splitter.startResize", {
-      splitter: this,
-      event
-    });
-  }
-
-  /////////////////////////////////////////////////////////
-  //
-  //
-  /////////////////////////////////////////////////////////
-  onMouseUp(event) {
-    if (this.state.active) {
-      this.setState({
-        active: false
-      });
-
-      if (this.props.onStopResize) {
-        this.props.onStopResize({
-          domElement: ReactDOM.findDOMNode(this),
-          component: this
-        });
-      }
-
-      this.props.events.emit("splitter.stopResize", {
-        splitter: this,
-        event
-      });
-    }
-  }
-
-  /////////////////////////////////////////////////////////
-  //
-  //
-  /////////////////////////////////////////////////////////
-  render() {
-    const classNames = ["reflex-splitter", ...this.props.className.split(" ")];
-
-    if (Browser.isMobile()) {
-      classNames.push("reflex-thin");
-    }
-
-    if (this.state.active) {
-      classNames.push("active");
-    }
-
-    return (
-      <div
-        className={classNames.join(" ")}
-        onTouchStart={this.onMouseDown}
-        onMouseDown={this.onMouseDown}
-        style={this.props.style}
-        id={this.props.id}
-      >
-        {this.props.children}
-      </div>
-    );
-  }
-}

package/RenameSequenceDialog.js

@@ -1,7 +0,0 @@
-import createSimpleDialog from "./createSimpleDialog";
-
-export default createSimpleDialog({
-  formName: "renameSequenceDialog",
-  fields: [{ name: "newName", isRequired: true }],
-  withDialogProps: { title: "Rename Sequence", height: 190 }
-});

package/RotateCircularViewSlider.js

@@ -1,93 +0,0 @@
-import React, { useEffect } from "react";
-import { useDebouncedCallback } from "use-debounce";
-import { SLIDER_NORM_WIDTH, SLIDER_SMALL_WIDTH } from "../constants/constants";
-
-import UncontrolledSliderWithPlusMinusBtns from "../helperComponents/UncontrolledSliderWithPlusMinusBtns";
-
-export function RotateCircularViewSlider({
-  setRotationRadians,
-  zoomLevel,
-  maxZoomLevel,
-  bindOutsideChangeHelper,
-  smallSlider,
-  editorName
-}) {
-  const mainSelector = editorName ? `.veEditor.${editorName}` : ".veEditor";
-  const target = React.useRef();
-  const svgEleRef = React.useRef();
-
-  useEffect(() => {
-    // use document.querySelector so that the code can still work after changing the parent node of this component
-    const svgEle = document
-      .querySelector(mainSelector)
-      ?.querySelector(".veCircularView .circularViewSvg");
-    svgEleRef.current = svgEle;
-  }, [editorName, mainSelector]);
-
-  const showLabelsDebounced = useDebouncedCallback(
-    el => {
-      try {
-        if (el) el.classList.remove("veHideLabels");
-        else {
-          console.error(`whoops we shouldn't be here`);
-        }
-      } catch (e) {
-        console.error(`error 92hf290fasd:`, e);
-      }
-    },
-    // delay in ms
-    300,
-    { leading: true }
-  );
-
-  const stepSize = Math.min(
-    3,
-    (3 / (zoomLevel / 2)) * (maxZoomLevel / (zoomLevel / 2))
-  );
-  return (
-    <div
-      style={{
-        zIndex: 900,
-        position: "absolute"
-      }}
-    >
-      <UncontrolledSliderWithPlusMinusBtns
-        bindOutsideChangeHelper={bindOutsideChangeHelper}
-        onChange={_val => {
-          const val = 360 - _val;
-          if (!svgEleRef.current) {
-            svgEleRef.current = document
-              .querySelector(mainSelector)
-              ?.querySelector(".veCircularView .circularViewSvg");
-          }
-          const el = svgEleRef.current;
-          if (!el) return;
-          const innerEl = el?.querySelector("g");
-          innerEl.style.transform = `rotate(${val}deg)`;
-          setRotationRadians((val * Math.PI) / 180);
-          if (zoomLevel <= 1) {
-            el.classList.add("veHideLabels");
-          }
-          showLabelsDebounced(el);
-        }}
-        smallSlider
-        passedRef={target}
-        showTrackFill={false}
-        leftIcon="arrow-left"
-        rightIcon="arrow-right"
-        title="Rotate"
-        style={{
-          paddingTop: "4px",
-          width: smallSlider ? SLIDER_SMALL_WIDTH : SLIDER_NORM_WIDTH
-        }}
-        className="veRotateCircularSlider ove-slider"
-        labelRenderer={false}
-        stepSize={stepSize}
-        justUpdateInitialValOnce
-        // initialValue={initialRotation || 0}
-        max={360}
-        min={0}
-      />
-    </div>
-  );
-}