@pie-lib/graphing 2.14.22 → 2.15.0-beta.1

package/src/tools/shared/__tests__/__snapshots__/arrow-head.test.jsx.snap

@@ -0,0 +1,27 @@
+// Jest Snapshot v1, https://goo.gl/fbAQLP
+
+exports[`ArrowHead snapshot renders 1`] = `
+<polygon
+  points="0,0 10,5 0,10"
+  transform=""
+/>
+`;
+
+exports[`ArrowMarker snapshot renders 1`] = `
+<marker
+  className="className"
+  id="id"
+  markerHeight={10}
+  markerWidth={10}
+  orient="auto-start-reverse"
+  refX={5}
+  refY={5}
+  viewBox="0 0 10 10"
+>
+  <ArrowHead
+    points=""
+    size={10}
+    transform=""
+  />
+</marker>
+`;

package/src/tools/shared/__tests__/arrow-head.test.jsx

@@ -0,0 +1,34 @@
+import { shallow } from 'enzyme';
+import React from 'react';
+import { ArrowHead, ArrowMarker } from '../arrow-head';
+describe('ArrowHead', () => {
+  let w;
+  let onChange = jest.fn();
+  const wrapper = (extras) => {
+    const defaults = { size: 10, transform: '' };
+    const props = { ...defaults, ...extras };
+    return shallow(<ArrowHead {...props} />);
+  };
+  describe('snapshot', () => {
+    it('renders', () => {
+      const w = wrapper();
+      expect(w).toMatchSnapshot();
+    });
+  });
+});
+
+describe('ArrowMarker', () => {
+  let w;
+  let onChange = jest.fn();
+  const wrapper = (extras) => {
+    const defaults = { id: 'id', size: 10, className: 'className' };
+    const props = { ...defaults, ...extras };
+    return shallow(<ArrowMarker {...props} />);
+  };
+  describe('snapshot', () => {
+    it('renders', () => {
+      const w = wrapper();
+      expect(w).toMatchSnapshot();
+    });
+  });
+});

package/src/tools/shared/icons/CorrectSVG.jsx

@@ -0,0 +1,22 @@
+import React from 'react';
+
+const CorrectSVG = ({ scale, x, y }) => (
+  <svg
+    width="11"
+    height="13"
+    viewBox="0 0 14 14"
+    fill="none"
+    stroke="#ffffff"
+    x={scale.x(x) - 5}
+    y={scale.y(y) - 6}
+    style={{ pointerEvents: 'none' }}
+    xmlns="http://www.w3.org/2000/svg"
+  >
+    <path
+      d="M10.1953 2.46875C10.3125 2.35156 10.5 2.35156 10.5938 2.46875L11.2734 3.125C11.3672 3.24219 11.3672 3.42969 11.2734 3.52344L4.24219 10.5547C4.125 10.6719 3.96094 10.6719 3.84375 10.5547L0.703125 7.4375C0.609375 7.32031 0.609375 7.13281 0.703125 7.03906L1.38281 6.35938C1.47656 6.26562 1.66406 6.26562 1.78125 6.35938L4.03125 8.63281L10.1953 2.46875Z"
+      fill="white"
+    />
+  </svg>
+);
+
+export default CorrectSVG;

package/src/tools/shared/icons/IncorrectSVG.jsx

@@ -0,0 +1,20 @@
+import React from 'react';
+
+const IncorrectSVG = ({ scale, x, y }) => (
+  <svg
+    width="14px"
+    height="14px"
+    viewBox="0 0 24 24"
+    fill="none"
+    stroke="#ffffff"
+    strokeWidth="2"
+    x={scale.x(x) - 7}
+    y={scale.y(y) - 7}
+    style={{ pointerEvents: 'none' }}
+    xmlns="http://www.w3.org/2000/svg"
+  >
+    <path d="M17.705 7.705l-1.41-1.41L12 10.59 7.705 6.295l-1.41 1.41L10.59 12l-4.295 4.295 1.41 1.41L12 13.41l4.295 4.295 1.41-1.41L13.41 12l4.295-4.295z"></path>
+  </svg>
+);
+
+export default IncorrectSVG;

package/src/tools/shared/icons/MissingSVG.jsx

@@ -0,0 +1,21 @@
+import React from 'react';
+
+const MissingSVG = ({ scale, x, y }) => (
+  <svg
+    width="9"
+    height="10"
+    viewBox="0 0 9 10"
+    fill="none"
+    xmlns="http://www.w3.org/2000/svg"
+    x={scale.x(x) - 4.5}
+    y={scale.y(y) - 5}
+    style={{ pointerEvents: 'none' }}
+  >
+    <path
+      d="M0.125 3.76562V1.34375C0.125 1.08984 0.320312 0.875 0.59375 0.875H3.01562C3.13281 0.875 3.25 0.992188 3.25 1.10938V1.89062C3.25 2.02734 3.13281 2.125 3.01562 2.125H1.375V3.76562C1.375 3.90234 1.25781 4 1.14062 4H0.359375C0.222656 4 0.125 3.90234 0.125 3.76562ZM5.75 1.10938C5.75 0.992188 5.84766 0.875 5.98438 0.875H8.40625C8.66016 0.875 8.875 1.08984 8.875 1.34375V3.76562C8.875 3.90234 8.75781 4 8.64062 4H7.85938C7.72266 4 7.625 3.90234 7.625 3.76562V2.125H5.98438C5.84766 2.125 5.75 2.02734 5.75 1.89062V1.10938ZM8.64062 6.5C8.75781 6.5 8.875 6.61719 8.875 6.73438V9.15625C8.875 9.42969 8.66016 9.625 8.40625 9.625H5.98438C5.84766 9.625 5.75 9.52734 5.75 9.39062V8.60938C5.75 8.49219 5.84766 8.375 5.98438 8.375H7.625V6.73438C7.625 6.61719 7.72266 6.5 7.85938 6.5H8.64062ZM3.25 9.39062C3.25 9.52734 3.13281 9.625 3.01562 9.625H0.59375C0.320312 9.625 0.125 9.42969 0.125 9.15625V6.73438C0.125 6.61719 0.222656 6.5 0.359375 6.5H1.14062C1.25781 6.5 1.375 6.61719 1.375 6.73438V8.375H3.01562C3.13281 8.375 3.25 8.49219 3.25 8.60938V9.39062Z"
+      fill="white"
+    />
+  </svg>
+);
+
+export default MissingSVG;

package/src/tools/shared/line/__tests__/__snapshots__/index.test.jsx.snap

@@ -0,0 +1,360 @@
+// Jest Snapshot v1, https://goo.gl/fbAQLP
+
+exports[`lineBase render renders 1`] = `
+<g>
+  <GridDraggable
+    from={
+      Object {
+        "x": 0,
+        "y": 0,
+      }
+    }
+    graphProps={
+      Object {
+        "domain": Object {
+          "max": 1,
+          "min": 0,
+          "step": 1,
+        },
+        "range": Object {
+          "max": 1,
+          "min": 0,
+          "step": 1,
+        },
+        "scale": Object {
+          "x": [MockFunction],
+          "y": [MockFunction],
+        },
+        "size": Object {
+          "height": 400,
+          "width": 400,
+        },
+        "snap": Object {
+          "x": [MockFunction],
+          "y": [MockFunction],
+        },
+      }
+    }
+    onClick={[Function]}
+    onDrag={[Function]}
+    to={
+      Object {
+        "x": 1,
+        "y": 1,
+      }
+    }
+  />
+  <WithStyles(GridDraggable)
+    graphProps={
+      Object {
+        "domain": Object {
+          "max": 1,
+          "min": 0,
+          "step": 1,
+        },
+        "range": Object {
+          "max": 1,
+          "min": 0,
+          "step": 1,
+        },
+        "scale": Object {
+          "x": [MockFunction],
+          "y": [MockFunction],
+        },
+        "size": Object {
+          "height": 400,
+          "width": 400,
+        },
+        "snap": Object {
+          "x": [MockFunction],
+          "y": [MockFunction],
+        },
+      }
+    }
+    onClick={[Function]}
+    onDrag={[Function]}
+    x={0}
+    y={0}
+  />
+  <WithStyles(GridDraggable)
+    angle={45}
+    graphProps={
+      Object {
+        "domain": Object {
+          "max": 1,
+          "min": 0,
+          "step": 1,
+        },
+        "range": Object {
+          "max": 1,
+          "min": 0,
+          "step": 1,
+        },
+        "scale": Object {
+          "x": [MockFunction],
+          "y": [MockFunction],
+        },
+        "size": Object {
+          "height": 400,
+          "width": 400,
+        },
+        "snap": Object {
+          "x": [MockFunction],
+          "y": [MockFunction],
+        },
+      }
+    }
+    onClick={[Function]}
+    onDrag={[Function]}
+    x={1}
+    y={1}
+  />
+</g>
+`;
+
+exports[`lineBase render renders with labels 1`] = `
+<g>
+  <GridDraggable
+    from={
+      Object {
+        "label": "A",
+        "x": 0,
+        "y": 0,
+      }
+    }
+    graphProps={
+      Object {
+        "domain": Object {
+          "max": 1,
+          "min": 0,
+          "step": 1,
+        },
+        "range": Object {
+          "max": 1,
+          "min": 0,
+          "step": 1,
+        },
+        "scale": Object {
+          "x": [MockFunction],
+          "y": [MockFunction],
+        },
+        "size": Object {
+          "height": 400,
+          "width": 400,
+        },
+        "snap": Object {
+          "x": [MockFunction],
+          "y": [MockFunction],
+        },
+      }
+    }
+    onClick={[Function]}
+    onDrag={[Function]}
+    to={
+      Object {
+        "label": "B",
+        "x": 1,
+        "y": 1,
+      }
+    }
+  />
+  <WithStyles(GridDraggable)
+    graphProps={
+      Object {
+        "domain": Object {
+          "max": 1,
+          "min": 0,
+          "step": 1,
+        },
+        "range": Object {
+          "max": 1,
+          "min": 0,
+          "step": 1,
+        },
+        "scale": Object {
+          "x": [MockFunction],
+          "y": [MockFunction],
+        },
+        "size": Object {
+          "height": 400,
+          "width": 400,
+        },
+        "snap": Object {
+          "x": [MockFunction],
+          "y": [MockFunction],
+        },
+      }
+    }
+    labelNode={<foreignobject />}
+    onClick={[Function]}
+    onDrag={[Function]}
+    x={0}
+    y={0}
+  />
+  <Portal
+    containerInfo={<foreignobject />}
+  >
+    <WithStyles(MarkLabel)
+      disabled={true}
+      graphProps={
+        Object {
+          "domain": Object {
+            "max": 1,
+            "min": 0,
+            "step": 1,
+          },
+          "range": Object {
+            "max": 1,
+            "min": 0,
+            "step": 1,
+          },
+          "scale": Object {
+            "x": [MockFunction],
+            "y": [MockFunction],
+          },
+          "size": Object {
+            "height": 400,
+            "width": 400,
+          },
+          "snap": Object {
+            "x": [MockFunction],
+            "y": [MockFunction],
+          },
+        }
+      }
+      inputRef={[Function]}
+      mark={
+        Object {
+          "label": "A",
+          "x": 0,
+          "y": 0,
+        }
+      }
+      onChange={[Function]}
+    />
+  </Portal>
+  <WithStyles(GridDraggable)
+    angle={45}
+    graphProps={
+      Object {
+        "domain": Object {
+          "max": 1,
+          "min": 0,
+          "step": 1,
+        },
+        "range": Object {
+          "max": 1,
+          "min": 0,
+          "step": 1,
+        },
+        "scale": Object {
+          "x": [MockFunction],
+          "y": [MockFunction],
+        },
+        "size": Object {
+          "height": 400,
+          "width": 400,
+        },
+        "snap": Object {
+          "x": [MockFunction],
+          "y": [MockFunction],
+        },
+      }
+    }
+    labelNode={<foreignobject />}
+    onClick={[Function]}
+    onDrag={[Function]}
+    x={1}
+    y={1}
+  />
+  <Portal
+    containerInfo={<foreignobject />}
+  >
+    <WithStyles(MarkLabel)
+      disabled={true}
+      graphProps={
+        Object {
+          "domain": Object {
+            "max": 1,
+            "min": 0,
+            "step": 1,
+          },
+          "range": Object {
+            "max": 1,
+            "min": 0,
+            "step": 1,
+          },
+          "scale": Object {
+            "x": [MockFunction],
+            "y": [MockFunction],
+          },
+          "size": Object {
+            "height": 400,
+            "width": 400,
+          },
+          "snap": Object {
+            "x": [MockFunction],
+            "y": [MockFunction],
+          },
+        }
+      }
+      inputRef={[Function]}
+      mark={
+        Object {
+          "label": "B",
+          "x": 1,
+          "y": 1,
+        }
+      }
+      onChange={[Function]}
+    />
+  </Portal>
+</g>
+`;
+
+exports[`lineToolComponent snapshot renders 1`] = `
+<Component
+  changeMarkProps={[Function]}
+  from={
+    Object {
+      "x": 0,
+      "y": 0,
+    }
+  }
+  graphProps={
+    Object {
+      "domain": Object {
+        "max": 1,
+        "min": 0,
+        "step": 1,
+      },
+      "range": Object {
+        "max": 1,
+        "min": 0,
+        "step": 1,
+      },
+      "scale": Object {
+        "x": [MockFunction],
+        "y": [MockFunction],
+      },
+      "size": Object {
+        "height": 400,
+        "width": 400,
+      },
+      "snap": Object {
+        "x": [MockFunction],
+        "y": [MockFunction],
+      },
+    }
+  }
+  onChange={[Function]}
+  onDragStart={[Function]}
+  onDragStop={[Function]}
+  to={
+    Object {
+      "x": 1,
+      "y": 1,
+    }
+  }
+/>
+`;

package/src/tools/shared/line/__tests__/__snapshots__/line-path.test.jsx.snap

@@ -0,0 +1,58 @@
+// Jest Snapshot v1, https://goo.gl/fbAQLP
+
+exports[`LinePath snapshot renders 1`] = `
+<RawLinePath
+  className="className"
+  classes={
+    Object {
+      "correct": "RawLinePath-correct-6",
+      "disabled": "RawLinePath-disabled-4",
+      "disabledSecondary": "RawLinePath-disabledSecondary-5",
+      "dragging": "RawLinePath-dragging-3",
+      "drawLine": "RawLinePath-drawLine-1",
+      "incorrect": "RawLinePath-incorrect-7",
+      "line": "RawLinePath-line-2",
+      "missing": "RawLinePath-missing-8",
+    }
+  }
+  from={
+    Object {
+      "x": 0,
+      "y": 0,
+    }
+  }
+  graphProps={
+    Object {
+      "domain": Object {
+        "max": 1,
+        "min": 0,
+        "step": 1,
+      },
+      "range": Object {
+        "max": 1,
+        "min": 0,
+        "step": 1,
+      },
+      "scale": Object {
+        "x": [MockFunction],
+        "y": [MockFunction],
+      },
+      "size": Object {
+        "height": 400,
+        "width": 400,
+      },
+      "snap": Object {
+        "x": [MockFunction],
+        "y": [MockFunction],
+      },
+    }
+  }
+  onChange={[MockFunction]}
+  to={
+    Object {
+      "x": 1,
+      "y": 1,
+    }
+  }
+/>
+`;

package/src/tools/shared/line/__tests__/__snapshots__/with-root-edge.test.jsx.snap

@@ -0,0 +1,63 @@
+// Jest Snapshot v1, https://goo.gl/fbAQLP
+
+exports[`rootEdgeComponent snapshot renders 1`] = `
+<Component
+  graphProps={
+    Object {
+      "domain": Object {
+        "max": 1,
+        "min": 0,
+        "step": 1,
+      },
+      "range": Object {
+        "max": 1,
+        "min": 0,
+        "step": 1,
+      },
+      "scale": Object {
+        "x": [MockFunction],
+        "y": [MockFunction],
+      },
+      "size": Object {
+        "height": 400,
+        "width": 400,
+      },
+      "snap": Object {
+        "x": [MockFunction],
+        "y": [MockFunction],
+      },
+    }
+  }
+  mark={
+    Object {
+      "from": Object {
+        "x": 0,
+        "y": 0,
+      },
+      "to": Object {
+        "x": 1,
+        "y": 1,
+      },
+    }
+  }
+  onChange={[Function]}
+/>
+`;
+
+exports[`rootEdgeToToFromWRapper renders 1`] = `
+<Component
+  mark={
+    Object {
+      "from": Object {
+        "x": 1,
+        "y": 1,
+      },
+      "to": Object {
+        "x": 2,
+        "y": 2,
+      },
+    }
+  }
+  onChange={[Function]}
+/>
+`;