Skip to content

Releases: pierpo/react-archer

Release 3.2.2

14 Jun 10:30
Compare
Choose a tag to compare

Fixes

Release 3.2.1

19 May 22:55
Compare
Choose a tag to compare

Fixes

  • Add missing typescript definition: noCurves property for ArcherContainer was missing

Release 3.2.0

13 May 08:45
Compare
Choose a tag to compare

Features

Release 3.1.0

22 Apr 23:48
Compare
Choose a tag to compare

Features

  • Add React 17 support
  • Add a new option to draw straight lines (many thanks to @oskari for the amazing job! #135)
  • Add a new option to draw arrow markers on both ends of the arrow (thanks @oskari again! #134)

image

Release 3.0.0

06 Oct 21:26
Compare
Choose a tag to compare

New features

  • You can now use circles as arrow ends! Many thanks to @damonbauer for his amazing contribution! #111
  • pointer-events are now set to none as default so that you can click through the SVG containers. Thank you @viztor! #107

Breaking changes

  • If you've been using the default pointer-events value in your ArcherContainers, you may want to put back the previous default value:
 <ArcherContainer
+   svgContainerStyle={{ pointerEvents: 'auto' }}
 >
   {/* stuff */}
 </ArcherContainer>
  • The arrow end styling API has changed. You should update them to fit the new API 😊
 <ArcherElement
   id="root"
   relations={[
     {
       ...
       style: {
         strokeDasharray: "5,5",
-        arrowLength: 10,
-        arrowThickness: 20
+        endShape: {
+          arrow: {
+            arrowLength: 10,
+            arrowThickness: 20
+          }
         }
       }
     }
   ]}
>
  <div style={boxStyle}>Root</div>
</ArcherElement>;

v2.0.2

15 Jun 17:00
Compare
Choose a tag to compare

Bugfixes/features

  • You can now retrieve the Archer Context to have Archer Elements in an out-of-context component (it happens in some render functions). Many thanks to @jfo84 for this. Solves #100

Release 2.0.1

09 May 22:11
Compare
Choose a tag to compare

Typescript

  • Updated types

Release 2.0.0

29 Apr 17:07
Compare
Choose a tag to compare

Breaking changes

⚠️ Do not worry, you can put everything back to something strictly equivalent at what was here before.

No more multiple children to ArcherElement

You can no longer use multiple children elements for ArcherElement.

  • If you really need multiple children, then you need to wrap them in a <div />. It used to be done like this internally but this was causing drawing issues, so now to achieve the same as before you should now wrap your elements yourself.

If your layout broke, try the following. We used to add an artificial div internally with ArcherElement, which has been removed. A quick fix is to add back the div yourself:

<ArcherElement>
-  <Content />
+  <div>
+    <Content />
+  </div>
</ArcherElement>

No more custom components as direct children of ArcherElement without tweaking

  • You can no longer use custom components as a direct child of ArcherElement out of the box. Two fixes possible:
    • wrap it in a div, as mentioned above. Ok if it doesn't break your layout.
    • forward the reference of your component to the DOM element in your component that will act as a drawing reference. See below:
- const MyComponent = (props) => {
+ const MyComponent = React.forwardRef((props, ref) => {
   return (
-    <div>
+    <div ref={ref}>
       <span>fixed</span>
     </div>
   );
- };
+ });

// ...

<ArcherElement><MyComponent /></ArcherElement>

Bugfixes

  • Solved an issue with arrows not drawing to the proper element #93
    • This was probably the root of many problems. If you had problems with arrows not drawing properly, try this new release πŸ˜‰

Release 1.6.0

25 Apr 10:53
Compare
Choose a tag to compare

Renamed to release 2.0.0.

Release 1.5.1

19 Apr 18:16
Compare
Choose a tag to compare

Bugfixes

  • Fix Failed to execute 'unobserve' on 'ResizeObserver' error (#84)
  • Fix arrowLength not working properly when value is 0