Remove unnecessary defs

* Bump version
* Update changelog

Author: MaybeJustJames

ChangeLog.md

@@ -7,6 +7,12 @@ and this project adheres to [Semantic Versioning](https://semver.org/spec/v2.0.0
 
 ## [Unreleased]
 
+## [1.0.2] - 2023-05-05
+
+### Removed
+
+- Unnecessary/unused `<defs>` in the `<svg>`.
+
 ## [1.0.1] - 2023-05-05
 
 ### Removed
@@ -17,6 +23,7 @@ and this project adheres to [Semantic Versioning](https://semver.org/spec/v2.0.0
 
 Initial release
 
-[unreleased]: https://github.com/vibbits/react-2d-molecule/compare/v1.0.1...HEAD
+[unreleased]: https://github.com/vibbits/react-2d-molecule/compare/v1.0.2...HEAD
+[1.0.2]: https://github.com/vibbits/react-2d-molecule/compare/v1.0.1...v1.0.2
 [1.0.1]: https://github.com/vibbits/react-2d-molecule/compare/v1.0.0...v1.0.1
 [1.0.0]: https://github.com/vibbits/react-2d-molecule/releases/tag/v1.0.0

README.md

@@ -31,11 +31,11 @@ const mol = {
   "width": 3.0,
   "height": 3.0,
   "atoms": [
-    {"x": 1.5, "y": -0.0, "element": "H"},
+    {"x": 1.5, "y": 0.0, "element": "H"},
     {"x": -1.5, "y": 0.0, "element": "H"},
     {"x": 0.0, "y": 1.5, "element": "H"},
-    {"x": 0.0, "y": -0.0, "element": "C"},
-    {"x": -0.0, "y": -1.5, "element": "H"}
+    {"x": 0.0, "y": 0.0, "element": "C"},
+    {"x": 0.0, "y": -1.5, "element": "H"}
   ],
   "bonds": 
     {"source": 3, "sink": 0, "bond": "SINGLE"},
@@ -56,12 +56,12 @@ export const ViewAMolecule = () => <Molecule molecule={mol} />;
 
 ### Optional
 
-* `translateX` Translate the whole image on the X axis (default: `0`).
-* `translateY` Translate the whole image on the Y axis (default: `0`).
-* `scale` Scale the whole image by some fraction (default: `1`).
-* `atomClicked` A callback function accepting the index of the clicked atom.
-* `atomStyle` A hook specifying CSS styles for the SVG `<circle>`.
-* `atomLabelStyle` A hook specifying CSS styles for the SVG `<text>`.
+* `translateX: number` Translate the whole image on the X axis (default: `0`).
+* `translateY: number` Translate the whole image on the Y axis (default: `0`).
+* `scale: number` Scale the whole image by some fraction (default: `1`).
+* `atomClicked: (index: number) => void` A callback function accepting the index of the clicked atom.
+* `atomStyle: (element: string, selected: boolean): React.CSSProperties` A hook specifying CSS styles for the SVG `<circle>`.
+* `atomLabelStyle: (element: string, selected: boolean): React.CSSProperties` A hook specifying CSS styles for the SVG `<text>`.
 
 ## Contributing
 

package.json

@@ -1,6 +1,6 @@
 {
   "name": "@vibbioinfocore/react-2d-molecule",
-  "version": "1.0.1",
+  "version": "1.0.2",
   "description": "A React component to display molecule structures in a 2D SVG",
   "browser": "dist/index.js",
   "type": "module",

src/index.tsx

@@ -279,14 +279,6 @@ export const Molecule: React.FC<MoleculeProps> = (props: MoleculeProps) => {
       )}`}
       style={{ pointerEvents: "none" }}
     >
-      <defs>
-        <pattern id="dashes" patternUnits="userSpaceOnUse" width="4" height="4">
-          <path d="M-1 1 1-1M0 4 4 0M3 5 5 3" />
-        </pattern>
-        <mask id="dashes-mask">
-          <rect height="100%" width="100%" style={{ fill: "url(#dashes)" }} />
-        </mask>
-      </defs>
       <g
         transform={`translate(${translateX}, ${translateY}) scale(${
           props.scale || 1