@cutting/svg 4.31.8 → 4.32.1

package/.turbo/turbo-build.log

@@ -1,7 +1,7 @@
-@cutting/svg:build: cache hit, replaying output 299ccd72637a36c2
+@cutting/svg:build: cache hit, replaying output f45568a3b5fc9294
 @cutting/svg:build: 
-@cutting/svg:build: > @cutting/svg@4.31.8 build /home/runner/work/cuttingedge/cuttingedge/packages/svg
-@cutting/svg:build: > NODE_ENV=development cutting rollup
+@cutting/svg:build: > @cutting/svg@4.32.1 build /home/runner/work/cuttingedge/cuttingedge/packages/svg
+@cutting/svg:build: > NODE_ENV=production cutting rollup
 @cutting/svg:build: 
 @cutting/svg:build:  DEBUG   using tsconfig.dist.json
 @cutting/svg:build:  WARNING  emptying dist /home/runner/work/cuttingedge/cuttingedge/packages/svg/dist

package/CHANGELOG.md

@@ -1,5 +1,34 @@
 # @cutting/svg
 
+## 4.32.1
+
+### Patch Changes
+
+- 0f3d2133: changesets fixes
+- Updated dependencies [0f3d2133]
+  - @cutting/use-get-parent-size@1.6.11
+  - @cutting/util@4.31.1
+
+## 4.32.0
+
+### Minor Changes
+
+- 3413251c: build in production
+
+### Patch Changes
+
+- Updated dependencies [3413251c]
+  - @cutting/util@4.31.0
+  - @cutting/use-get-parent-size@1.6.10
+
+## 4.31.9
+
+### Patch Changes
+
+- Updated dependencies [e6a06fa0]
+  - @cutting/util@4.30.0
+  - @cutting/use-get-parent-size@1.6.9
+
 ## 4.31.8
 
 ### Patch Changes

package/README.md

@@ -23,11 +23,10 @@ The `ParentsizeSVG` component takes an `elementRef` prop that should point to a
 ## usage
 
 ```ts
-import type { FC } from 'react';
 import { useRef } from 'react';
 import { ParentsizeSVG } from '@cutting/svg';
 
-export const App: FC = () => {
+export function App(): JSX.Element {
   const ref = useRef<HTMLDivElement>(null);
 
   return (

package/demo/App.tsx

@@ -11,17 +11,17 @@ export function App(): JSX.Element {
       <div className={styles.container} ref={ref}>
         <ParentsizeSVG elementRef={ref} options={{ debounceDelay: 10 }}>
           <rect
-            x="20%"
-            y="20%"
+            x="0"
+            y="0"
             width={'50%'}
             height={'50%'}
-            rx="20"
+            rx="0"
             style={{ fill: '#ff0000', stroke: '#000000', strokeWidth: '2px' }}
           />
 
           <rect
-            x="30%"
-            y="30%"
+            x="0"
+            y="0"
             width={'50%'}
             height={'50%'}
             rx="40"

package/demo/global.css.ts

@@ -1,7 +1,7 @@
 import { globalStyle, style } from '@vanilla-extract/css';
 
 export const container = style({
-  border: '1px solid yellow',
+  border: '10px solid yellow',
   background: 'grey',
   color: 'white',
   overflow: 'hidden',
@@ -12,6 +12,7 @@ export const container = style({
   justifyContent: 'center',
   alignItems: 'center',
   margin: '0 auto',
+  marginBottom: '10rem',
 });
 
 globalStyle('svg', {

package/demo/index.tsx

@@ -1,10 +1,9 @@
 import ReactDOM from 'react-dom';
-import type { FC } from 'react';
 import { App } from './App';
 
 export const root = document.getElementById('root');
 
-const render = (Component: FC) => {
+const render = (Component: typeof App) => {
   ReactDOM.render(<Component />, root);
 };
 

package/dist/cjs/components/Group/Group.d.ts

@@ -1,4 +1,3 @@
-import type { FC } from 'react';
 declare type GroupOnlyProps = {
     /** Top offset applied to `<g/>`. */
     y?: number;
@@ -11,6 +10,6 @@ declare type GroupOnlyProps = {
     innerRef?: React.Ref<SVGGElement>;
 };
 declare type GroupProps = GroupOnlyProps & Omit<React.SVGProps<SVGGElement>, keyof GroupOnlyProps>;
-export declare const Group: FC<GroupProps>;
+export declare function Group({ y, x, transform, className, children, innerRef, ...restProps }: GroupProps): JSX.Element;
 export {};
 //# sourceMappingURL=Group.d.ts.map

package/dist/cjs/components/Group/Group.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"Group.d.ts","sourceRoot":"","sources":["../../../../src/components/Group/Group.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,EAAE,EAAE,MAAM,OAAO,CAAC;AAGhC,aAAK,cAAc,GAAG;IACpB,oCAAoC;IACpC,CAAC,CAAC,EAAE,MAAM,CAAC;IACX,qCAAqC;IACrC,CAAC,CAAC,EAAE,MAAM,CAAC;IACX,qEAAqE;IACrE,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,QAAQ,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;IAC3B,QAAQ,CAAC,EAAE,KAAK,CAAC,GAAG,CAAC,WAAW,CAAC,CAAC;CACnC,CAAC;AAEF,aAAK,UAAU,GAAG,cAAc,GAAG,IAAI,CAAC,KAAK,CAAC,QAAQ,CAAC,WAAW,CAAC,EAAE,MAAM,cAAc,CAAC,CAAC;AAE3F,eAAO,MAAM,KAAK,EAAE,EAAE,CAAC,UAAU,CAmBhC,CAAC"}
+{"version":3,"file":"Group.d.ts","sourceRoot":"","sources":["../../../../src/components/Group/Group.tsx"],"names":[],"mappings":"AAEA,aAAK,cAAc,GAAG;IACpB,oCAAoC;IACpC,CAAC,CAAC,EAAE,MAAM,CAAC;IACX,qCAAqC;IACrC,CAAC,CAAC,EAAE,MAAM,CAAC;IACX,qEAAqE;IACrE,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,QAAQ,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;IAC3B,QAAQ,CAAC,EAAE,KAAK,CAAC,GAAG,CAAC,WAAW,CAAC,CAAC;CACnC,CAAC;AAEF,aAAK,UAAU,GAAG,cAAc,GAAG,IAAI,CAAC,KAAK,CAAC,QAAQ,CAAC,WAAW,CAAC,EAAE,MAAM,cAAc,CAAC,CAAC;AAE3F,wBAAgB,KAAK,CAAC,EACpB,CAAK,EACL,CAAK,EACL,SAAS,EACT,SAAS,EACT,QAAQ,EACR,QAAQ,EACR,GAAG,SAAS,EACb,EAAE,UAAU,GAAG,GAAG,CAAC,OAAO,CAW1B"}

package/dist/cjs/components/Line/Line.d.ts

@@ -1,5 +1,4 @@
-import type { FC } from 'react';
-import type { Point } from '../../types/types';
+import type { AddSVGProps, Point } from '../../types/types';
 export declare type LineProps = {
     className?: string;
     innerRef?: React.Ref<SVGLineElement>;
@@ -9,5 +8,5 @@ export declare type LineProps = {
     /** Ending x,y point of the line. */
     to?: Point;
 };
-export declare const Line: FC<LineProps>;
+export declare function Line({ from, to, fill, className, innerRef, ...restProps }: AddSVGProps<LineProps, SVGLineElement>): JSX.Element;
 //# sourceMappingURL=Line.d.ts.map

package/dist/cjs/components/Line/Line.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"Line.d.ts","sourceRoot":"","sources":["../../../../src/components/Line/Line.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,EAAE,EAAE,MAAM,OAAO,CAAC;AAEhC,OAAO,KAAK,EAAe,KAAK,EAAE,MAAM,mBAAmB,CAAC;AAE5D,oBAAY,SAAS,GAAG;IACtB,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,QAAQ,CAAC,EAAE,KAAK,CAAC,GAAG,CAAC,cAAc,CAAC,CAAC;IACrC,IAAI,CAAC,EAAE,MAAM,CAAC;IACd,sCAAsC;IACtC,IAAI,CAAC,EAAE,KAAK,CAAC;IACb,oCAAoC;IACpC,EAAE,CAAC,EAAE,KAAK,CAAC;CACZ,CAAC;AAEF,eAAO,MAAM,IAAI,EAAE,EAAE,CAAC,SAAS,CAuB9B,CAAC"}
+{"version":3,"file":"Line.d.ts","sourceRoot":"","sources":["../../../../src/components/Line/Line.tsx"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAE,WAAW,EAAE,KAAK,EAAE,MAAM,mBAAmB,CAAC;AAE5D,oBAAY,SAAS,GAAG;IACtB,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,QAAQ,CAAC,EAAE,KAAK,CAAC,GAAG,CAAC,cAAc,CAAC,CAAC;IACrC,IAAI,CAAC,EAAE,MAAM,CAAC;IACd,sCAAsC;IACtC,IAAI,CAAC,EAAE,KAAK,CAAC;IACb,oCAAoC;IACpC,EAAE,CAAC,EAAE,KAAK,CAAC;CACZ,CAAC;AAEF,wBAAgB,IAAI,CAAC,EACnB,IAAqB,EACrB,EAAmB,EACnB,IAAoB,EACpB,SAAS,EACT,QAAQ,EACR,GAAG,SAAS,EACb,EAAE,WAAW,CAAC,SAAS,EAAE,cAAc,CAAC,GAAG,GAAG,CAAC,OAAO,CAgBtD"}

package/dist/cjs/components/ParentsizeSVG/ParentsizeSVG.d.ts

@@ -2,7 +2,7 @@ import type { CSSProperties, PropsWithChildren, RefObject } from 'react';
 import type { UseParentSizeOptions } from '@cutting/use-get-parent-size';
 import type { ResponsiveSVGProps } from '../ResponsiveSVG/ResponsiveSVG';
 declare type Align = 'none' | 'center';
-export declare type ParentsizeSVGProps<E extends HTMLElement> = {
+export declare type ParentsizeSVGProps<E extends HTMLElement = HTMLElement> = {
     elementRef: RefObject<E>;
     style?: CSSProperties;
     align?: Align;

package/dist/cjs/components/ParentsizeSVG/ParentsizeSVG.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"ParentsizeSVG.d.ts","sourceRoot":"","sources":["../../../../src/components/ParentsizeSVG/ParentsizeSVG.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,aAAa,EAAE,iBAAiB,EAAE,SAAS,EAAE,MAAM,OAAO,CAAC;AAEzE,OAAO,KAAK,EAAE,oBAAoB,EAAE,MAAM,8BAA8B,CAAC;AAEzE,OAAO,KAAK,EAAE,kBAAkB,EAAE,MAAM,gCAAgC,CAAC;AAGzE,aAAK,KAAK,GAAG,MAAM,GAAG,QAAQ,CAAC;AAE/B,oBAAY,kBAAkB,CAAC,CAAC,SAAS,WAAW,IAAI;IACtD,UAAU,EAAE,SAAS,CAAC,CAAC,CAAC,CAAC;IACzB,KAAK,CAAC,EAAE,aAAa,CAAC;IACtB,KAAK,CAAC,EAAE,KAAK,CAAC;IACd,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,OAAO,CAAC,EAAE,OAAO,CAAC,oBAAoB,CAAC,CAAC;CACzC,GAAG,OAAO,CAAC,IAAI,CAAC,kBAAkB,EAAE,UAAU,GAAG,QAAQ,GAAG,QAAQ,CAAC,CAAC,CAAC;AAExE,eAAO,MAAM,YAAY,EAAE,aAOjB,CAAC;AAEX,wBAAgB,aAAa,CAAC,CAAC,SAAS,WAAW,EAAE,EACnD,UAAU,EACV,QAAQ,EACR,KAAoB,EACpB,KAAS,EACT,KAAc,EACd,OAAO,EAAE,EAAE,aAAkB,EAAE,GAAG,WAAW,EAAO,EACpD,GAAG,IAAI,EACR,EAAE,iBAAiB,CAAC,kBAAkB,CAAC,CAAC,CAAC,CAAC,GAAG,GAAG,CAAC,OAAO,GAAG,IAAI,CAsB/D"}
+{"version":3,"file":"ParentsizeSVG.d.ts","sourceRoot":"","sources":["../../../../src/components/ParentsizeSVG/ParentsizeSVG.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,aAAa,EAAE,iBAAiB,EAAE,SAAS,EAAE,MAAM,OAAO,CAAC;AAEzE,OAAO,KAAK,EAAE,oBAAoB,EAAE,MAAM,8BAA8B,CAAC;AAEzE,OAAO,KAAK,EAAE,kBAAkB,EAAE,MAAM,gCAAgC,CAAC;AAGzE,aAAK,KAAK,GAAG,MAAM,GAAG,QAAQ,CAAC;AAE/B,oBAAY,kBAAkB,CAAC,CAAC,SAAS,WAAW,GAAG,WAAW,IAAI;IACpE,UAAU,EAAE,SAAS,CAAC,CAAC,CAAC,CAAC;IACzB,KAAK,CAAC,EAAE,aAAa,CAAC;IACtB,KAAK,CAAC,EAAE,KAAK,CAAC;IACd,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,OAAO,CAAC,EAAE,OAAO,CAAC,oBAAoB,CAAC,CAAC;CACzC,GAAG,OAAO,CAAC,IAAI,CAAC,kBAAkB,EAAE,UAAU,GAAG,QAAQ,GAAG,QAAQ,CAAC,CAAC,CAAC;AAExE,eAAO,MAAM,YAAY,EAAE,aAOjB,CAAC;AAEX,wBAAgB,aAAa,CAAC,CAAC,SAAS,WAAW,EAAE,EACnD,UAAU,EACV,QAAQ,EACR,KAAoB,EACpB,KAAS,EACT,KAAc,EACd,OAAO,EAAE,EAAE,aAAkB,EAAE,GAAG,WAAW,EAAO,EACpD,GAAG,IAAI,EACR,EAAE,iBAAiB,CAAC,kBAAkB,CAAC,CAAC,CAAC,CAAC,GAAG,GAAG,CAAC,OAAO,GAAG,IAAI,CAwB/D"}

package/dist/cjs/components/ResponsiveSVG/ResponsiveSVG.d.ts

@@ -1,4 +1,4 @@
-import type { FC, Ref } from 'react';
+import type { ReactNode, Ref } from 'react';
 import type { PreserveAspectRatio } from '../../types/types';
 export interface Point {
     x: number;
@@ -12,6 +12,7 @@ export interface ResponsiveSVGProps {
     innerRef?: Ref<SVGSVGElement>;
     className?: string;
     hide?: boolean;
+    children: ReactNode;
 }
-export declare const ResponsiveSVG: FC<ResponsiveSVGProps>;
+export declare function ResponsiveSVG({ height, width, children, origin, preserveAspectRatio, innerRef, className, }: ResponsiveSVGProps): JSX.Element;
 //# sourceMappingURL=ResponsiveSVG.d.ts.map

package/dist/cjs/components/ResponsiveSVG/ResponsiveSVG.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"ResponsiveSVG.d.ts","sourceRoot":"","sources":["../../../../src/components/ResponsiveSVG/ResponsiveSVG.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,EAAE,EAAE,GAAG,EAAE,MAAM,OAAO,CAAC;AACrC,OAAO,KAAK,EAAE,mBAAmB,EAAE,MAAM,mBAAmB,CAAC;AAE7D,MAAM,WAAW,KAAK;IACpB,CAAC,EAAE,MAAM,CAAC;IACV,CAAC,EAAE,MAAM,CAAC;CACX;AAED,MAAM,WAAW,kBAAkB;IACjC,KAAK,EAAE,MAAM,CAAC;IACd,MAAM,EAAE,MAAM,CAAC;IACf,MAAM,CAAC,EAAE,KAAK,CAAC;IACf,mBAAmB,CAAC,EAAE,mBAAmB,CAAC;IAC1C,QAAQ,CAAC,EAAE,GAAG,CAAC,aAAa,CAAC,CAAC;IAC9B,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,IAAI,CAAC,EAAE,OAAO,CAAC;CAChB;AAED,eAAO,MAAM,aAAa,EAAE,EAAE,CAAC,kBAAkB,CAiChD,CAAC"}
+{"version":3,"file":"ResponsiveSVG.d.ts","sourceRoot":"","sources":["../../../../src/components/ResponsiveSVG/ResponsiveSVG.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,SAAS,EAAE,GAAG,EAAE,MAAM,OAAO,CAAC;AAC5C,OAAO,KAAK,EAAE,mBAAmB,EAAE,MAAM,mBAAmB,CAAC;AAE7D,MAAM,WAAW,KAAK;IACpB,CAAC,EAAE,MAAM,CAAC;IACV,CAAC,EAAE,MAAM,CAAC;CACX;AAED,MAAM,WAAW,kBAAkB;IACjC,KAAK,EAAE,MAAM,CAAC;IACd,MAAM,EAAE,MAAM,CAAC;IACf,MAAM,CAAC,EAAE,KAAK,CAAC;IACf,mBAAmB,CAAC,EAAE,mBAAmB,CAAC;IAC1C,QAAQ,CAAC,EAAE,GAAG,CAAC,aAAa,CAAC,CAAC;IAC9B,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,IAAI,CAAC,EAAE,OAAO,CAAC;IACf,QAAQ,EAAE,SAAS,CAAC;CACrB;AAED,wBAAgB,aAAa,CAAC,EAC5B,MAAM,EACN,KAAK,EACL,QAAQ,EACR,MAAuB,EACvB,mBAAqC,EACrC,QAAQ,EACR,SAAS,GACV,EAAE,kBAAkB,GAAG,GAAG,CAAC,OAAO,CAyBlC"}

package/dist/cjs/svg.cjs.development.js

@@ -17,19 +17,7 @@ var _objectSpread__default = /*#__PURE__*/_interopDefault(_objectSpread);
 var _objectWithoutProperties__default = /*#__PURE__*/_interopDefault(_objectWithoutProperties);
 var cx__default = /*#__PURE__*/_interopDefault(cx);
 
-(function() {
-    const env = {"NODE_ENV":"development"};
-    try {
-        if (process) {
-            process.env = Object.assign({}, process.env);
-            Object.assign(process.env, env);
-            return;
-        }
-    } catch (e) {} // avoid ReferenceError: process is not defined
-    globalThis.process = { env:env };
-})();
-
-var ResponsiveSVG = function ResponsiveSVG(_ref) {
+function ResponsiveSVG(_ref) {
   var height = _ref.height,
       width = _ref.width,
       children = _ref.children,
@@ -60,9 +48,9 @@ var ResponsiveSVG = function ResponsiveSVG(_ref) {
       viewBox: "".concat(origin.x, " ").concat(origin.y, " ").concat(width, " ").concat(adjustedHeight),
       ref: innerRef,
       children: children
-    }, void 0)
-  }, void 0);
-};
+    })
+  });
+}
 
 var _excluded$2 = ["debounceDelay"],
     _excluded2 = ["elementRef", "children", "style", "scale", "align", "options"];
@@ -111,7 +99,7 @@ function ParentsizeSVG(_ref) {
       elementRef.current.style[key] = value;
     }
   }, [elementRef, style]);
-  var transform = align === 'center' ? "translate(".concat(width / 2, ",").concat(height / 2 - 20, ") scale(").concat(scale, ")") : "0,0) scale(".concat(scale, ")");
+  var transform = align === 'center' ? "translate(".concat(width / 2, ",").concat(height / 2 - 20, ") scale(").concat(scale, ")") : "translate(0,0) scale(".concat(scale, ")");
   return jsxRuntime.jsx(ResponsiveSVG, _objectSpread__default["default"](_objectSpread__default["default"]({
     width: width,
     height: height
@@ -119,12 +107,12 @@ function ParentsizeSVG(_ref) {
     children: jsxRuntime.jsx("g", {
       transform: transform,
       children: children
-    }, void 0)
-  }), void 0);
+    })
+  }));
 }
 
 var _excluded$1 = ["y", "x", "transform", "className", "children", "innerRef"];
-var Group = function Group(_ref) {
+function Group(_ref) {
   var _ref$y = _ref.y,
       y = _ref$y === void 0 ? 0 : _ref$y,
       _ref$x = _ref.x,
@@ -141,11 +129,11 @@ var Group = function Group(_ref) {
     transform: transform || "translate(".concat(x, ", ").concat(y, ")")
   }, restProps), {}, {
     children: children
-  }), void 0);
-};
+  }));
+}
 
 var _excluded = ["from", "to", "fill", "className", "innerRef"];
-var Line = function Line(_ref) {
+function Line(_ref) {
   var _ref$from = _ref.from,
       from = _ref$from === void 0 ? {
     x: 0,
@@ -172,8 +160,8 @@ var Line = function Line(_ref) {
     y2: to.y,
     fill: fill,
     shapeRendering: isRectilinear ? 'crispEdges' : 'auto'
-  }, restProps), void 0);
-};
+  }, restProps));
+}
 
 exports.Group = Group;
 exports.Line = Line;

package/dist/cjs/svg.cjs.development.js.map

@@ -1 +1 @@
-{"version":3,"file":"svg.cjs.development.js","sources":["../../src/components/ResponsiveSVG/ResponsiveSVG.tsx","../../src/components/ParentsizeSVG/ParentsizeSVG.tsx","../../src/components/Group/Group.tsx","../../src/components/Line/Line.tsx"],"sourcesContent":["import type { FC, Ref } from 'react';\nimport type { PreserveAspectRatio } from '../../types/types';\n\nexport interface Point {\n  x: number;\n  y: number;\n}\n\nexport interface ResponsiveSVGProps {\n  width: number;\n  height: number;\n  origin?: Point;\n  preserveAspectRatio?: PreserveAspectRatio;\n  innerRef?: Ref<SVGSVGElement>;\n  className?: string;\n  hide?: boolean;\n}\n\nexport const ResponsiveSVG: FC<ResponsiveSVGProps> = ({\n  height,\n  width,\n  children,\n  origin = { x: 0, y: 0 },\n  preserveAspectRatio = 'xMaxYMid meet',\n  innerRef,\n  className,\n}) => {\n  const aspect = width / height;\n\n  const adjustedHeight = Math.ceil(width / aspect);\n\n  return (\n    <div\n      data-selector=\"cutting-svg-container\"\n      style={{\n        position: 'relative',\n        overflow: 'visible',\n        height: '1px',\n      }}\n    >\n      <svg\n        style={{ overflow: 'visible' }}\n        className={className}\n        preserveAspectRatio={preserveAspectRatio}\n        viewBox={`${origin.x} ${origin.y} ${width} ${adjustedHeight}`}\n        ref={innerRef}\n      >\n        {children}\n      </svg>\n    </div>\n  );\n};\n","import type { CSSProperties, PropsWithChildren, RefObject } from 'react';\nimport { useEffect } from 'react';\nimport type { UseParentSizeOptions } from '@cutting/use-get-parent-size';\nimport { useParentSize } from '@cutting/use-get-parent-size';\nimport type { ResponsiveSVGProps } from '../ResponsiveSVG/ResponsiveSVG';\nimport { ResponsiveSVG } from '../ResponsiveSVG/ResponsiveSVG';\n\ntype Align = 'none' | 'center';\n\nexport type ParentsizeSVGProps<E extends HTMLElement> = {\n  elementRef: RefObject<E>;\n  style?: CSSProperties;\n  align?: Align;\n  scale?: number;\n  options?: Partial<UseParentSizeOptions>;\n} & Partial<Omit<ResponsiveSVGProps, 'innerRef' | 'height' | 'height'>>;\n\nexport const DefaultStyle: CSSProperties = {\n  display: 'flex',\n  flexDirection: 'column',\n  flexGrow: 1,\n  flexShrink: 1,\n  flexBasis: '0%',\n  overflow: 'hidden',\n} as const;\n\nexport function ParentsizeSVG<E extends HTMLElement>({\n  elementRef,\n  children,\n  style = DefaultStyle,\n  scale = 1,\n  align = 'none',\n  options: { debounceDelay = 50, ...optionsRest } = {},\n  ...rest\n}: PropsWithChildren<ParentsizeSVGProps<E>>): JSX.Element | null {\n  const { width, height } = useParentSize(elementRef, { debounceDelay, ...optionsRest });\n\n  useEffect(() => {\n    if (!elementRef.current) {\n      return;\n    }\n\n    for (const [key, value] of Object.entries(style)) {\n      // eslint-disable-next-line @typescript-eslint/no-explicit-any\n      elementRef.current.style[key as any] = value;\n    }\n  }, [elementRef, style]);\n\n  const transform =\n    align === 'center' ? `translate(${width / 2},${height / 2 - 20}) scale(${scale})` : `0,0) scale(${scale})`;\n\n  return (\n    <ResponsiveSVG width={width} height={height} {...rest}>\n      <g transform={transform}>{children}</g>\n    </ResponsiveSVG>\n  );\n}\n","import type { FC } from 'react';\nimport cx from 'classnames';\n\ntype GroupOnlyProps = {\n  /** Top offset applied to `<g/>`. */\n  y?: number;\n  /** Left offset applied to `<g/>`. */\n  x?: number;\n  /** Override `x` and `y` to provide the entire `transform` string. */\n  transform?: string;\n  className?: string;\n  children?: React.ReactNode;\n  innerRef?: React.Ref<SVGGElement>;\n};\n\ntype GroupProps = GroupOnlyProps & Omit<React.SVGProps<SVGGElement>, keyof GroupOnlyProps>;\n\nexport const Group: FC<GroupProps> = ({\n  y = 0,\n  x = 0,\n  transform,\n  className,\n  children,\n  innerRef,\n  ...restProps\n}: GroupProps): JSX.Element => {\n  return (\n    <g\n      ref={innerRef}\n      className={cx('visx-group', className)}\n      transform={transform || `translate(${x}, ${y})`}\n      {...restProps}\n    >\n      {children}\n    </g>\n  );\n};\n","import type { FC } from 'react';\nimport cx from 'classnames';\nimport type { AddSVGProps, Point } from '../../types/types';\n\nexport type LineProps = {\n  className?: string;\n  innerRef?: React.Ref<SVGLineElement>;\n  fill?: string;\n  /** Starting x,y point of the line. */\n  from?: Point;\n  /** Ending x,y point of the line. */\n  to?: Point;\n};\n\nexport const Line: FC<LineProps> = ({\n  from = { x: 0, y: 0 },\n  to = { x: 1, y: 1 },\n  fill = 'transparent',\n  className,\n  innerRef,\n  ...restProps\n}: AddSVGProps<LineProps, SVGLineElement>): JSX.Element => {\n  const isRectilinear = from.x === to.x || from.y === to.y;\n\n  return (\n    <line\n      ref={innerRef}\n      className={cx('visx-line', className)}\n      x1={from.x}\n      y1={from.y}\n      x2={to.x}\n      y2={to.y}\n      fill={fill}\n      shapeRendering={isRectilinear ? 'crispEdges' : 'auto'}\n      {...restProps}\n    />\n  );\n};\n"],"names":["ResponsiveSVG","height","width","children","origin","x","y","preserveAspectRatio","innerRef","className","aspect","adjustedHeight","Math","ceil","_jsx","style","position","overflow","viewBox","ref","DefaultStyle","display","flexDirection","flexGrow","flexShrink","flexBasis","ParentsizeSVG","elementRef","scale","align","options","debounceDelay","optionsRest","rest","useParentSize","useEffect","current","Object","entries","key","value","transform","Group","restProps","cx","Line","from","to","fill","isRectilinear","x1","y1","x2","y2","shapeRendering"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;IAkBaA,aAAa,GAA2B,SAAxCA,aAAwC;MACnDC,cAAAA;MACAC,aAAAA;MACAC,gBAAAA;yBACAC;MAAAA,kCAAS;AAAEC,IAAAA,CAAC,EAAE,CAAL;AAAQC,IAAAA,CAAC,EAAE;AAAX;mCACTC;MAAAA,yDAAsB;MACtBC,gBAAAA;MACAC,iBAAAA;AAEA,MAAMC,MAAM,GAAGR,KAAK,GAAGD,MAAvB;AAEA,MAAMU,cAAc,GAAGC,IAAI,CAACC,IAAL,CAAUX,KAAK,GAAGQ,MAAlB,CAAvB;AAEA,SACEI;qBACgB;AACdC,IAAAA,KAAK,EAAE;AACLC,MAAAA,QAAQ,EAAE,UADL;AAELC,MAAAA,QAAQ,EAAE,SAFL;AAGLhB,MAAAA,MAAM,EAAE;AAHH;cAMPa;AACEC,MAAAA,KAAK,EAAE;AAAEE,QAAAA,QAAQ,EAAE;AAAZ;AACPR,MAAAA,SAAS,EAAEA;AACXF,MAAAA,mBAAmB,EAAEA;AACrBW,MAAAA,OAAO,YAAKd,MAAM,CAACC,CAAZ,cAAiBD,MAAM,CAACE,CAAxB,cAA6BJ,KAA7B,cAAsCS,cAAtC;AACPQ,MAAAA,GAAG,EAAEX;gBAEJL;;YAhBP;AAoBD;;;;AClCM,IAAMiB,YAAY,GAAkB;AACzCC,EAAAA,OAAO,EAAE,MADgC;AAEzCC,EAAAA,aAAa,EAAE,QAF0B;AAGzCC,EAAAA,QAAQ,EAAE,CAH+B;AAIzCC,EAAAA,UAAU,EAAE,CAJ6B;AAKzCC,EAAAA,SAAS,EAAE,IAL8B;AAMzCR,EAAAA,QAAQ,EAAE;AAN+B,CAApC;SASSS;MACdC,kBAAAA;MACAxB,gBAAAA;wBACAY;MAAAA,gCAAQK;wBACRQ;MAAAA,gCAAQ;wBACRC;MAAAA,gCAAQ;0BACRC;2CAAkD;;2CAAvCC;MAAAA,mDAAgB;MAAOC;MAC/BC;;AAEH,uBAA0BC,8BAAa,CAACP,UAAD;AAAeI,IAAAA,aAAa,EAAbA;AAAf,KAAiCC,WAAjC,EAAvC;AAAA,MAAQ9B,KAAR,kBAAQA,KAAR;AAAA,MAAeD,MAAf,kBAAeA,MAAf;;AAEAkC,EAAAA,eAAS,CAAC;AACR,QAAI,CAACR,UAAU,CAACS,OAAhB,EAAyB;AACvB;AACD;;AAED,uCAA2BC,MAAM,CAACC,OAAP,CAAevB,KAAf,CAA3B,qCAAkD;AAA7C;AAAA,UAAOwB,GAAP;AAAA,UAAYC,KAAZ;;AACH;AACAb,MAAAA,UAAU,CAACS,OAAX,CAAmBrB,KAAnB,CAAyBwB,GAAzB,IAAuCC,KAAvC;AACD;AACF,GATQ,EASN,CAACb,UAAD,EAAaZ,KAAb,CATM,CAAT;AAWA,MAAM0B,SAAS,GACbZ,KAAK,KAAK,QAAV,uBAAkC3B,KAAK,GAAG,CAA1C,cAA+CD,MAAM,GAAG,CAAT,GAAa,EAA5D,qBAAyE2B,KAAzE,8BAAkGA,KAAlG,MADF;AAGA,SACEd,eAACd;AAAcE,IAAAA,KAAK,EAAEA;AAAOD,IAAAA,MAAM,EAAEA;KAAYgC;cAC/CnB;AAAG2B,MAAAA,SAAS,EAAEA;gBAAYtC;;aAF9B;AAKD;;;ICvCYuC,KAAK,GAAmB,SAAxBA,KAAwB;oBACnCpC;MAAAA,wBAAI;oBACJD;MAAAA,wBAAI;MACJoC,iBAAAA;MACAhC,iBAAAA;MACAN,gBAAAA;MACAK,gBAAAA;MACGmC;;AAEH,SACE7B;AACEK,IAAAA,GAAG,EAAEX;AACLC,IAAAA,SAAS,EAAEmC,sBAAE,CAAC,YAAD,EAAenC,SAAf;AACbgC,IAAAA,SAAS,EAAEA,SAAS,wBAAiBpC,CAAjB,eAAuBC,CAAvB;KAChBqC;cAEHxC;aAPL;AAUD;;;ICtBY0C,IAAI,GAAkB,SAAtBA,IAAsB;uBACjCC;MAAAA,8BAAO;AAAEzC,IAAAA,CAAC,EAAE,CAAL;AAAQC,IAAAA,CAAC,EAAE;AAAX;qBACPyC;MAAAA,0BAAK;AAAE1C,IAAAA,CAAC,EAAE,CAAL;AAAQC,IAAAA,CAAC,EAAE;AAAX;uBACL0C;MAAAA,8BAAO;MACPvC,iBAAAA;MACAD,gBAAAA;MACGmC;;AAEH,MAAMM,aAAa,GAAGH,IAAI,CAACzC,CAAL,KAAW0C,EAAE,CAAC1C,CAAd,IAAmByC,IAAI,CAACxC,CAAL,KAAWyC,EAAE,CAACzC,CAAvD;AAEA,SACEQ;AACEK,IAAAA,GAAG,EAAEX;AACLC,IAAAA,SAAS,EAAEmC,sBAAE,CAAC,WAAD,EAAcnC,SAAd;AACbyC,IAAAA,EAAE,EAAEJ,IAAI,CAACzC;AACT8C,IAAAA,EAAE,EAAEL,IAAI,CAACxC;AACT8C,IAAAA,EAAE,EAAEL,EAAE,CAAC1C;AACPgD,IAAAA,EAAE,EAAEN,EAAE,CAACzC;AACP0C,IAAAA,IAAI,EAAEA;AACNM,IAAAA,cAAc,EAAEL,aAAa,GAAG,YAAH,GAAkB;KAC3CN,mBAVR;AAaD;;;;;;;"}
+{"version":3,"file":"svg.cjs.development.js","sources":["../../src/components/ResponsiveSVG/ResponsiveSVG.tsx","../../src/components/ParentsizeSVG/ParentsizeSVG.tsx","../../src/components/Group/Group.tsx","../../src/components/Line/Line.tsx"],"sourcesContent":["import type { ReactNode, Ref } from 'react';\nimport type { PreserveAspectRatio } from '../../types/types';\n\nexport interface Point {\n  x: number;\n  y: number;\n}\n\nexport interface ResponsiveSVGProps {\n  width: number;\n  height: number;\n  origin?: Point;\n  preserveAspectRatio?: PreserveAspectRatio;\n  innerRef?: Ref<SVGSVGElement>;\n  className?: string;\n  hide?: boolean;\n  children: ReactNode;\n}\n\nexport function ResponsiveSVG({\n  height,\n  width,\n  children,\n  origin = { x: 0, y: 0 },\n  preserveAspectRatio = 'xMaxYMid meet',\n  innerRef,\n  className,\n}: ResponsiveSVGProps): JSX.Element {\n  const aspect = width / height;\n\n  const adjustedHeight = Math.ceil(width / aspect);\n\n  return (\n    <div\n      data-selector=\"cutting-svg-container\"\n      style={{\n        position: 'relative',\n        overflow: 'visible',\n        height: '1px',\n      }}\n    >\n      <svg\n        style={{ overflow: 'visible' }}\n        className={className}\n        preserveAspectRatio={preserveAspectRatio}\n        viewBox={`${origin.x} ${origin.y} ${width} ${adjustedHeight}`}\n        ref={innerRef}\n      >\n        {children}\n      </svg>\n    </div>\n  );\n}\n","import type { CSSProperties, PropsWithChildren, RefObject } from 'react';\nimport { useEffect } from 'react';\nimport type { UseParentSizeOptions } from '@cutting/use-get-parent-size';\nimport { useParentSize } from '@cutting/use-get-parent-size';\nimport type { ResponsiveSVGProps } from '../ResponsiveSVG/ResponsiveSVG';\nimport { ResponsiveSVG } from '../ResponsiveSVG/ResponsiveSVG';\n\ntype Align = 'none' | 'center';\n\nexport type ParentsizeSVGProps<E extends HTMLElement = HTMLElement> = {\n  elementRef: RefObject<E>;\n  style?: CSSProperties;\n  align?: Align;\n  scale?: number;\n  options?: Partial<UseParentSizeOptions>;\n} & Partial<Omit<ResponsiveSVGProps, 'innerRef' | 'height' | 'height'>>;\n\nexport const DefaultStyle: CSSProperties = {\n  display: 'flex',\n  flexDirection: 'column',\n  flexGrow: 1,\n  flexShrink: 1,\n  flexBasis: '0%',\n  overflow: 'hidden',\n} as const;\n\nexport function ParentsizeSVG<E extends HTMLElement>({\n  elementRef,\n  children,\n  style = DefaultStyle,\n  scale = 1,\n  align = 'none',\n  options: { debounceDelay = 50, ...optionsRest } = {},\n  ...rest\n}: PropsWithChildren<ParentsizeSVGProps<E>>): JSX.Element | null {\n  const { width, height } = useParentSize(elementRef, { debounceDelay, ...optionsRest });\n\n  useEffect(() => {\n    if (!elementRef.current) {\n      return;\n    }\n\n    for (const [key, value] of Object.entries(style)) {\n      // eslint-disable-next-line @typescript-eslint/no-explicit-any\n      elementRef.current.style[key as any] = value;\n    }\n  }, [elementRef, style]);\n\n  const transform =\n    align === 'center'\n      ? `translate(${width / 2},${height / 2 - 20}) scale(${scale})`\n      : `translate(0,0) scale(${scale})`;\n\n  return (\n    <ResponsiveSVG width={width} height={height} {...rest}>\n      <g transform={transform}>{children}</g>\n    </ResponsiveSVG>\n  );\n}\n","import cx from 'classnames';\n\ntype GroupOnlyProps = {\n  /** Top offset applied to `<g/>`. */\n  y?: number;\n  /** Left offset applied to `<g/>`. */\n  x?: number;\n  /** Override `x` and `y` to provide the entire `transform` string. */\n  transform?: string;\n  className?: string;\n  children?: React.ReactNode;\n  innerRef?: React.Ref<SVGGElement>;\n};\n\ntype GroupProps = GroupOnlyProps & Omit<React.SVGProps<SVGGElement>, keyof GroupOnlyProps>;\n\nexport function Group({\n  y = 0,\n  x = 0,\n  transform,\n  className,\n  children,\n  innerRef,\n  ...restProps\n}: GroupProps): JSX.Element {\n  return (\n    <g\n      ref={innerRef}\n      className={cx('visx-group', className)}\n      transform={transform || `translate(${x}, ${y})`}\n      {...restProps}\n    >\n      {children}\n    </g>\n  );\n}\n","import cx from 'classnames';\nimport type { AddSVGProps, Point } from '../../types/types';\n\nexport type LineProps = {\n  className?: string;\n  innerRef?: React.Ref<SVGLineElement>;\n  fill?: string;\n  /** Starting x,y point of the line. */\n  from?: Point;\n  /** Ending x,y point of the line. */\n  to?: Point;\n};\n\nexport function Line({\n  from = { x: 0, y: 0 },\n  to = { x: 1, y: 1 },\n  fill = 'transparent',\n  className,\n  innerRef,\n  ...restProps\n}: AddSVGProps<LineProps, SVGLineElement>): JSX.Element {\n  const isRectilinear = from.x === to.x || from.y === to.y;\n\n  return (\n    <line\n      ref={innerRef}\n      className={cx('visx-line', className)}\n      x1={from.x}\n      y1={from.y}\n      x2={to.x}\n      y2={to.y}\n      fill={fill}\n      shapeRendering={isRectilinear ? 'crispEdges' : 'auto'}\n      {...restProps}\n    />\n  );\n}\n"],"names":["ResponsiveSVG","height","width","children","origin","x","y","preserveAspectRatio","innerRef","className","aspect","adjustedHeight","Math","ceil","_jsx","style","position","overflow","viewBox","ref","DefaultStyle","display","flexDirection","flexGrow","flexShrink","flexBasis","ParentsizeSVG","elementRef","scale","align","options","debounceDelay","optionsRest","_objectWithoutProperties","_excluded","rest","useParentSize","_objectSpread","useEffect","current","Object","entries","_slicedToArray","key","value","transform","Group","restProps","cx","Line","from","to","fill","isRectilinear","x1","y1","x2","y2","shapeRendering"],"mappings":"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"}

package/dist/cjs/svg.cjs.production.min.js

@@ -1,2 +1,2 @@
-"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("react/jsx-runtime"),r=require("@babel/runtime/helpers/slicedToArray"),t=require("@babel/runtime/helpers/objectSpread2"),i=require("@babel/runtime/helpers/objectWithoutProperties"),n=require("react"),s=require("@cutting/use-get-parent-size"),a=require("classnames");function o(e){return e&&e.__esModule?e:{default:e}}var l=o(r),c=o(t),d=o(i),u=o(a);!function(){const e={NODE_ENV:"production"};try{if(process)return process.env=Object.assign({},process.env),void Object.assign(process.env,e)}catch(e){}globalThis.process={env:e}}();var f=function(r){var t=r.width,i=r.children,n=r.origin,s=void 0===n?{x:0,y:0}:n,a=r.preserveAspectRatio,o=void 0===a?"xMaxYMid meet":a,l=r.innerRef,c=r.className,d=Math.ceil(t/(t/r.height));return e.jsx("div",{"data-selector":"cutting-svg-container",style:{position:"relative",overflow:"visible",height:"1px"},children:e.jsx("svg",{style:{overflow:"visible"},className:c,preserveAspectRatio:o,viewBox:"".concat(s.x," ").concat(s.y," ").concat(t," ").concat(d),ref:l,children:i},void 0)},void 0)},v=["debounceDelay"],x=["elementRef","children","style","scale","align","options"],p={display:"flex",flexDirection:"column",flexGrow:1,flexShrink:1,flexBasis:"0%",overflow:"hidden"},h=["y","x","transform","className","children","innerRef"],y=["from","to","fill","className","innerRef"];exports.Group=function(r){var t=r.y,i=void 0===t?0:t,n=r.x,s=void 0===n?0:n,a=r.transform,o=r.className,l=r.children,f=r.innerRef,v=d.default(r,h);return e.jsx("g",c.default(c.default({ref:f,className:u.default("visx-group",o),transform:a||"translate(".concat(s,", ").concat(i,")")},v),{},{children:l}),void 0)},exports.Line=function(r){var t=r.from,i=void 0===t?{x:0,y:0}:t,n=r.to,s=void 0===n?{x:1,y:1}:n,a=r.fill,o=void 0===a?"transparent":a,l=r.className,f=r.innerRef,v=d.default(r,y),x=i.x===s.x||i.y===s.y;return e.jsx("line",c.default({ref:f,className:u.default("visx-line",l),x1:i.x,y1:i.y,x2:s.x,y2:s.y,fill:o,shapeRendering:x?"crispEdges":"auto"},v),void 0)},exports.ParentsizeSVG=function(r){var t=r.elementRef,i=r.children,a=r.style,o=void 0===a?p:a,u=r.scale,h=void 0===u?1:u,y=r.align,m=void 0===y?"none":y,g=r.options,b=(g=void 0===g?{}:g).debounceDelay,j=void 0===b?50:b,R=d.default(g,v),N=d.default(r,x),w=s.useParentSize(t,c.default({debounceDelay:j},R)),q=w.width,D=w.height;n.useEffect((function(){if(t.current)for(var e=0,r=Object.entries(o);e<r.length;e++){var i=l.default(r[e],2);t.current.style[i[0]]=i[1]}}),[t,o]);var M="center"===m?"translate(".concat(q/2,",").concat(D/2-20,") scale(").concat(h,")"):"0,0) scale(".concat(h,")");return e.jsx(f,c.default(c.default({width:q,height:D},N),{},{children:e.jsx("g",{transform:M,children:i},void 0)}),void 0)},exports.ResponsiveSVG=f;
+"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("react/jsx-runtime"),r=require("@babel/runtime/helpers/slicedToArray"),t=require("@babel/runtime/helpers/objectSpread2"),i=require("@babel/runtime/helpers/objectWithoutProperties"),n=require("react"),a=require("@cutting/use-get-parent-size"),l=require("classnames");function s(e){return e&&e.__esModule?e:{default:e}}var o=s(r),c=s(t),d=s(i),u=s(l);function f(r){var t=r.width,i=r.children,n=r.origin,a=void 0===n?{x:0,y:0}:n,l=r.preserveAspectRatio,s=void 0===l?"xMaxYMid meet":l,o=r.innerRef,c=r.className,d=Math.ceil(t/(t/r.height));return e.jsx("div",{"data-selector":"cutting-svg-container",style:{position:"relative",overflow:"visible",height:"1px"},children:e.jsx("svg",{style:{overflow:"visible"},className:c,preserveAspectRatio:s,viewBox:"".concat(a.x," ").concat(a.y," ").concat(t," ").concat(d),ref:o,children:i})})}var v=["debounceDelay"],x=["elementRef","children","style","scale","align","options"],h={display:"flex",flexDirection:"column",flexGrow:1,flexShrink:1,flexBasis:"0%",overflow:"hidden"},p=["y","x","transform","className","children","innerRef"],m=["from","to","fill","className","innerRef"];exports.Group=function(r){var t=r.y,i=void 0===t?0:t,n=r.x,a=void 0===n?0:n,l=r.transform,s=r.className,o=r.children,f=r.innerRef,v=d.default(r,p);return e.jsx("g",c.default(c.default({ref:f,className:u.default("visx-group",s),transform:l||"translate(".concat(a,", ").concat(i,")")},v),{},{children:o}))},exports.Line=function(r){var t=r.from,i=void 0===t?{x:0,y:0}:t,n=r.to,a=void 0===n?{x:1,y:1}:n,l=r.fill,s=void 0===l?"transparent":l,o=r.className,f=r.innerRef,v=d.default(r,m),x=i.x===a.x||i.y===a.y;return e.jsx("line",c.default({ref:f,className:u.default("visx-line",o),x1:i.x,y1:i.y,x2:a.x,y2:a.y,fill:s,shapeRendering:x?"crispEdges":"auto"},v))},exports.ParentsizeSVG=function(r){var t=r.elementRef,i=r.children,l=r.style,s=void 0===l?h:l,u=r.scale,p=void 0===u?1:u,m=r.align,y=void 0===m?"none":m,g=r.options,b=(g=void 0===g?{}:g).debounceDelay,j=void 0===b?50:b,R=d.default(g,v),w=d.default(r,x),N=a.useParentSize(t,c.default({debounceDelay:j},R)),q=N.width,M=N.height;n.useEffect((function(){if(t.current)for(var e=0,r=Object.entries(s);e<r.length;e++){var i=o.default(r[e],2);t.current.style[i[0]]=i[1]}}),[t,s]);var S="center"===y?"translate(".concat(q/2,",").concat(M/2-20,") scale(").concat(p,")"):"translate(0,0) scale(".concat(p,")");return e.jsx(f,c.default(c.default({width:q,height:M},w),{},{children:e.jsx("g",{transform:S,children:i})}))},exports.ResponsiveSVG=f;
 //# sourceMappingURL=svg.cjs.production.min.js.map

package/dist/cjs/svg.cjs.production.min.js.map

@@ -1 +1 @@
-{"version":3,"file":"svg.cjs.production.min.js","sources":["../../src/components/ResponsiveSVG/ResponsiveSVG.tsx","../../src/components/ParentsizeSVG/ParentsizeSVG.tsx","../../src/components/Group/Group.tsx","../../src/components/Line/Line.tsx"],"sourcesContent":["import type { FC, Ref } from 'react';\nimport type { PreserveAspectRatio } from '../../types/types';\n\nexport interface Point {\n  x: number;\n  y: number;\n}\n\nexport interface ResponsiveSVGProps {\n  width: number;\n  height: number;\n  origin?: Point;\n  preserveAspectRatio?: PreserveAspectRatio;\n  innerRef?: Ref<SVGSVGElement>;\n  className?: string;\n  hide?: boolean;\n}\n\nexport const ResponsiveSVG: FC<ResponsiveSVGProps> = ({\n  height,\n  width,\n  children,\n  origin = { x: 0, y: 0 },\n  preserveAspectRatio = 'xMaxYMid meet',\n  innerRef,\n  className,\n}) => {\n  const aspect = width / height;\n\n  const adjustedHeight = Math.ceil(width / aspect);\n\n  return (\n    <div\n      data-selector=\"cutting-svg-container\"\n      style={{\n        position: 'relative',\n        overflow: 'visible',\n        height: '1px',\n      }}\n    >\n      <svg\n        style={{ overflow: 'visible' }}\n        className={className}\n        preserveAspectRatio={preserveAspectRatio}\n        viewBox={`${origin.x} ${origin.y} ${width} ${adjustedHeight}`}\n        ref={innerRef}\n      >\n        {children}\n      </svg>\n    </div>\n  );\n};\n","import type { CSSProperties, PropsWithChildren, RefObject } from 'react';\nimport { useEffect } from 'react';\nimport type { UseParentSizeOptions } from '@cutting/use-get-parent-size';\nimport { useParentSize } from '@cutting/use-get-parent-size';\nimport type { ResponsiveSVGProps } from '../ResponsiveSVG/ResponsiveSVG';\nimport { ResponsiveSVG } from '../ResponsiveSVG/ResponsiveSVG';\n\ntype Align = 'none' | 'center';\n\nexport type ParentsizeSVGProps<E extends HTMLElement> = {\n  elementRef: RefObject<E>;\n  style?: CSSProperties;\n  align?: Align;\n  scale?: number;\n  options?: Partial<UseParentSizeOptions>;\n} & Partial<Omit<ResponsiveSVGProps, 'innerRef' | 'height' | 'height'>>;\n\nexport const DefaultStyle: CSSProperties = {\n  display: 'flex',\n  flexDirection: 'column',\n  flexGrow: 1,\n  flexShrink: 1,\n  flexBasis: '0%',\n  overflow: 'hidden',\n} as const;\n\nexport function ParentsizeSVG<E extends HTMLElement>({\n  elementRef,\n  children,\n  style = DefaultStyle,\n  scale = 1,\n  align = 'none',\n  options: { debounceDelay = 50, ...optionsRest } = {},\n  ...rest\n}: PropsWithChildren<ParentsizeSVGProps<E>>): JSX.Element | null {\n  const { width, height } = useParentSize(elementRef, { debounceDelay, ...optionsRest });\n\n  useEffect(() => {\n    if (!elementRef.current) {\n      return;\n    }\n\n    for (const [key, value] of Object.entries(style)) {\n      // eslint-disable-next-line @typescript-eslint/no-explicit-any\n      elementRef.current.style[key as any] = value;\n    }\n  }, [elementRef, style]);\n\n  const transform =\n    align === 'center' ? `translate(${width / 2},${height / 2 - 20}) scale(${scale})` : `0,0) scale(${scale})`;\n\n  return (\n    <ResponsiveSVG width={width} height={height} {...rest}>\n      <g transform={transform}>{children}</g>\n    </ResponsiveSVG>\n  );\n}\n","import type { FC } from 'react';\nimport cx from 'classnames';\n\ntype GroupOnlyProps = {\n  /** Top offset applied to `<g/>`. */\n  y?: number;\n  /** Left offset applied to `<g/>`. */\n  x?: number;\n  /** Override `x` and `y` to provide the entire `transform` string. */\n  transform?: string;\n  className?: string;\n  children?: React.ReactNode;\n  innerRef?: React.Ref<SVGGElement>;\n};\n\ntype GroupProps = GroupOnlyProps & Omit<React.SVGProps<SVGGElement>, keyof GroupOnlyProps>;\n\nexport const Group: FC<GroupProps> = ({\n  y = 0,\n  x = 0,\n  transform,\n  className,\n  children,\n  innerRef,\n  ...restProps\n}: GroupProps): JSX.Element => {\n  return (\n    <g\n      ref={innerRef}\n      className={cx('visx-group', className)}\n      transform={transform || `translate(${x}, ${y})`}\n      {...restProps}\n    >\n      {children}\n    </g>\n  );\n};\n","import type { FC } from 'react';\nimport cx from 'classnames';\nimport type { AddSVGProps, Point } from '../../types/types';\n\nexport type LineProps = {\n  className?: string;\n  innerRef?: React.Ref<SVGLineElement>;\n  fill?: string;\n  /** Starting x,y point of the line. */\n  from?: Point;\n  /** Ending x,y point of the line. */\n  to?: Point;\n};\n\nexport const Line: FC<LineProps> = ({\n  from = { x: 0, y: 0 },\n  to = { x: 1, y: 1 },\n  fill = 'transparent',\n  className,\n  innerRef,\n  ...restProps\n}: AddSVGProps<LineProps, SVGLineElement>): JSX.Element => {\n  const isRectilinear = from.x === to.x || from.y === to.y;\n\n  return (\n    <line\n      ref={innerRef}\n      className={cx('visx-line', className)}\n      x1={from.x}\n      y1={from.y}\n      x2={to.x}\n      y2={to.y}\n      fill={fill}\n      shapeRendering={isRectilinear ? 'crispEdges' : 'auto'}\n      {...restProps}\n    />\n  );\n};\n"],"names":["ResponsiveSVG","width","children","origin","x","y","preserveAspectRatio","innerRef","className","adjustedHeight","Math","ceil","height","_jsx","style","position","overflow","viewBox","ref","DefaultStyle","display","flexDirection","flexGrow","flexShrink","flexBasis","transform","restProps","cx","from","to","fill","isRectilinear","x1","y1","x2","y2","shapeRendering","elementRef","scale","align","options","debounceDelay","optionsRest","rest","useParentSize","useEffect","current","Object","entries"],"mappings":"ymBAkBaA,EAAwC,gBAEnDC,IAAAA,MACAC,IAAAA,aACAC,OAAAA,aAAS,CAAEC,EAAG,EAAGC,EAAG,SACpBC,oBAAAA,aAAsB,kBACtBC,IAAAA,SACAC,IAAAA,UAIMC,EAAiBC,KAAKC,KAAKV,GAFlBA,IARfW,gBAaEC,6BACgB,wBACdC,MAAO,CACLC,SAAU,WACVC,SAAU,UACVJ,OAAQ,gBAGVC,aACEC,MAAO,CAAEE,SAAU,WACnBR,UAAWA,EACXF,oBAAqBA,EACrBW,kBAAYd,EAAOC,cAAKD,EAAOE,cAAKJ,cAASQ,GAC7CS,IAAKX,WAEJL,uGC9BIiB,EAA8B,CACzCC,QAAS,OACTC,cAAe,SACfC,SAAU,EACVC,WAAY,EACZC,UAAW,KACXR,SAAU,gICNyB,oBACnCX,EAAAA,aAAI,QACJD,EAAAA,aAAI,IACJqB,IAAAA,UACAjB,IAAAA,UACAN,IAAAA,SACAK,IAAAA,SACGmB,wBAGDb,+BACEK,IAAKX,EACLC,UAAWmB,UAAG,aAAcnB,GAC5BiB,UAAWA,uBAA0BrB,eAAMC,QACvCqB,gBAEHxB,0BCnB4B,oBACjC0B,KAAAA,aAAO,CAAExB,EAAG,EAAGC,EAAG,SAClBwB,GAAAA,aAAK,CAAEzB,EAAG,EAAGC,EAAG,SAChByB,KAAAA,aAAO,gBACPtB,IAAAA,UACAD,IAAAA,SACGmB,iBAEGK,EAAgBH,EAAKxB,IAAMyB,EAAGzB,GAAKwB,EAAKvB,IAAMwB,EAAGxB,SAGrDQ,wBACEK,IAAKX,EACLC,UAAWmB,UAAG,YAAanB,GAC3BwB,GAAIJ,EAAKxB,EACT6B,GAAIL,EAAKvB,EACT6B,GAAIL,EAAGzB,EACP+B,GAAIN,EAAGxB,EACPyB,KAAMA,EACNM,eAAgBL,EAAgB,aAAe,QAC3CL,kDFPRW,IAAAA,WACAnC,IAAAA,aACAY,MAAAA,aAAQK,QACRmB,MAAAA,aAAQ,QACRC,MAAAA,aAAQ,aACRC,wBAAkD,MAAvCC,cAAAA,aAAgB,KAAOC,iBAC/BC,mBAEuBC,gBAAcP,aAAcI,cAAAA,GAAkBC,IAAhEzC,IAAAA,MAAOW,IAAAA,OAEfiC,aAAU,cACHR,EAAWS,sBAIWC,OAAOC,QAAQlC,kBAAQ,yBAEhDuB,EAAWS,QAAQhC,oBAEpB,CAACuB,EAAYvB,QAEVW,EACM,WAAVc,sBAAkCtC,EAAQ,cAAKW,EAAS,EAAI,sBAAa0B,4BAAyBA,cAGlGzB,MAACb,uBAAcC,MAAOA,EAAOW,OAAQA,GAAY+B,gBAC/C9B,WAAGY,UAAWA,WAAYvB"}
+{"version":3,"file":"svg.cjs.production.min.js","sources":["../../src/components/ResponsiveSVG/ResponsiveSVG.tsx","../../src/components/ParentsizeSVG/ParentsizeSVG.tsx","../../src/components/Group/Group.tsx","../../src/components/Line/Line.tsx"],"sourcesContent":["import type { ReactNode, Ref } from 'react';\nimport type { PreserveAspectRatio } from '../../types/types';\n\nexport interface Point {\n  x: number;\n  y: number;\n}\n\nexport interface ResponsiveSVGProps {\n  width: number;\n  height: number;\n  origin?: Point;\n  preserveAspectRatio?: PreserveAspectRatio;\n  innerRef?: Ref<SVGSVGElement>;\n  className?: string;\n  hide?: boolean;\n  children: ReactNode;\n}\n\nexport function ResponsiveSVG({\n  height,\n  width,\n  children,\n  origin = { x: 0, y: 0 },\n  preserveAspectRatio = 'xMaxYMid meet',\n  innerRef,\n  className,\n}: ResponsiveSVGProps): JSX.Element {\n  const aspect = width / height;\n\n  const adjustedHeight = Math.ceil(width / aspect);\n\n  return (\n    <div\n      data-selector=\"cutting-svg-container\"\n      style={{\n        position: 'relative',\n        overflow: 'visible',\n        height: '1px',\n      }}\n    >\n      <svg\n        style={{ overflow: 'visible' }}\n        className={className}\n        preserveAspectRatio={preserveAspectRatio}\n        viewBox={`${origin.x} ${origin.y} ${width} ${adjustedHeight}`}\n        ref={innerRef}\n      >\n        {children}\n      </svg>\n    </div>\n  );\n}\n","import type { CSSProperties, PropsWithChildren, RefObject } from 'react';\nimport { useEffect } from 'react';\nimport type { UseParentSizeOptions } from '@cutting/use-get-parent-size';\nimport { useParentSize } from '@cutting/use-get-parent-size';\nimport type { ResponsiveSVGProps } from '../ResponsiveSVG/ResponsiveSVG';\nimport { ResponsiveSVG } from '../ResponsiveSVG/ResponsiveSVG';\n\ntype Align = 'none' | 'center';\n\nexport type ParentsizeSVGProps<E extends HTMLElement = HTMLElement> = {\n  elementRef: RefObject<E>;\n  style?: CSSProperties;\n  align?: Align;\n  scale?: number;\n  options?: Partial<UseParentSizeOptions>;\n} & Partial<Omit<ResponsiveSVGProps, 'innerRef' | 'height' | 'height'>>;\n\nexport const DefaultStyle: CSSProperties = {\n  display: 'flex',\n  flexDirection: 'column',\n  flexGrow: 1,\n  flexShrink: 1,\n  flexBasis: '0%',\n  overflow: 'hidden',\n} as const;\n\nexport function ParentsizeSVG<E extends HTMLElement>({\n  elementRef,\n  children,\n  style = DefaultStyle,\n  scale = 1,\n  align = 'none',\n  options: { debounceDelay = 50, ...optionsRest } = {},\n  ...rest\n}: PropsWithChildren<ParentsizeSVGProps<E>>): JSX.Element | null {\n  const { width, height } = useParentSize(elementRef, { debounceDelay, ...optionsRest });\n\n  useEffect(() => {\n    if (!elementRef.current) {\n      return;\n    }\n\n    for (const [key, value] of Object.entries(style)) {\n      // eslint-disable-next-line @typescript-eslint/no-explicit-any\n      elementRef.current.style[key as any] = value;\n    }\n  }, [elementRef, style]);\n\n  const transform =\n    align === 'center'\n      ? `translate(${width / 2},${height / 2 - 20}) scale(${scale})`\n      : `translate(0,0) scale(${scale})`;\n\n  return (\n    <ResponsiveSVG width={width} height={height} {...rest}>\n      <g transform={transform}>{children}</g>\n    </ResponsiveSVG>\n  );\n}\n","import cx from 'classnames';\n\ntype GroupOnlyProps = {\n  /** Top offset applied to `<g/>`. */\n  y?: number;\n  /** Left offset applied to `<g/>`. */\n  x?: number;\n  /** Override `x` and `y` to provide the entire `transform` string. */\n  transform?: string;\n  className?: string;\n  children?: React.ReactNode;\n  innerRef?: React.Ref<SVGGElement>;\n};\n\ntype GroupProps = GroupOnlyProps & Omit<React.SVGProps<SVGGElement>, keyof GroupOnlyProps>;\n\nexport function Group({\n  y = 0,\n  x = 0,\n  transform,\n  className,\n  children,\n  innerRef,\n  ...restProps\n}: GroupProps): JSX.Element {\n  return (\n    <g\n      ref={innerRef}\n      className={cx('visx-group', className)}\n      transform={transform || `translate(${x}, ${y})`}\n      {...restProps}\n    >\n      {children}\n    </g>\n  );\n}\n","import cx from 'classnames';\nimport type { AddSVGProps, Point } from '../../types/types';\n\nexport type LineProps = {\n  className?: string;\n  innerRef?: React.Ref<SVGLineElement>;\n  fill?: string;\n  /** Starting x,y point of the line. */\n  from?: Point;\n  /** Ending x,y point of the line. */\n  to?: Point;\n};\n\nexport function Line({\n  from = { x: 0, y: 0 },\n  to = { x: 1, y: 1 },\n  fill = 'transparent',\n  className,\n  innerRef,\n  ...restProps\n}: AddSVGProps<LineProps, SVGLineElement>): JSX.Element {\n  const isRectilinear = from.x === to.x || from.y === to.y;\n\n  return (\n    <line\n      ref={innerRef}\n      className={cx('visx-line', className)}\n      x1={from.x}\n      y1={from.y}\n      x2={to.x}\n      y2={to.y}\n      fill={fill}\n      shapeRendering={isRectilinear ? 'crispEdges' : 'auto'}\n      {...restProps}\n    />\n  );\n}\n"],"names":["ResponsiveSVG","_ref","height","width","children","_ref$origin","origin","x","y","_ref$preserveAspectRa","preserveAspectRatio","innerRef","className","adjustedHeight","Math","ceil","_jsx","style","position","overflow","viewBox","concat","ref","DefaultStyle","display","flexDirection","flexGrow","flexShrink","flexBasis","_ref$y","_ref$x","transform","restProps","_objectWithoutProperties","_excluded","_objectSpread","cx","_ref$from","from","_ref$to","to","_ref$fill","fill","isRectilinear","jsx","x1","y1","x2","y2","shapeRendering","elementRef","_ref$style","_ref$scale","scale","_ref$align","align","_ref$options","options","_ref$options$debounce","debounceDelay","optionsRest","rest","_excluded2","useParentSize","useEffect","current","_i","_Object$entries","Object","entries","length","_Object$entries$_i","_slicedToArray"],"mappings":"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"}

package/dist/esm/components/Group/Group.d.ts

@@ -1,4 +1,3 @@
-import type { FC } from 'react';
 declare type GroupOnlyProps = {
     /** Top offset applied to `<g/>`. */
     y?: number;
@@ -11,6 +10,6 @@ declare type GroupOnlyProps = {
     innerRef?: React.Ref<SVGGElement>;
 };
 declare type GroupProps = GroupOnlyProps & Omit<React.SVGProps<SVGGElement>, keyof GroupOnlyProps>;
-export declare const Group: FC<GroupProps>;
+export declare function Group({ y, x, transform, className, children, innerRef, ...restProps }: GroupProps): JSX.Element;
 export {};
 //# sourceMappingURL=Group.d.ts.map

package/dist/esm/components/Group/Group.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"Group.d.ts","sourceRoot":"","sources":["../../../../src/components/Group/Group.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,EAAE,EAAE,MAAM,OAAO,CAAC;AAGhC,aAAK,cAAc,GAAG;IACpB,oCAAoC;IACpC,CAAC,CAAC,EAAE,MAAM,CAAC;IACX,qCAAqC;IACrC,CAAC,CAAC,EAAE,MAAM,CAAC;IACX,qEAAqE;IACrE,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,QAAQ,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;IAC3B,QAAQ,CAAC,EAAE,KAAK,CAAC,GAAG,CAAC,WAAW,CAAC,CAAC;CACnC,CAAC;AAEF,aAAK,UAAU,GAAG,cAAc,GAAG,IAAI,CAAC,KAAK,CAAC,QAAQ,CAAC,WAAW,CAAC,EAAE,MAAM,cAAc,CAAC,CAAC;AAE3F,eAAO,MAAM,KAAK,EAAE,EAAE,CAAC,UAAU,CAmBhC,CAAC"}
+{"version":3,"file":"Group.d.ts","sourceRoot":"","sources":["../../../../src/components/Group/Group.tsx"],"names":[],"mappings":"AAEA,aAAK,cAAc,GAAG;IACpB,oCAAoC;IACpC,CAAC,CAAC,EAAE,MAAM,CAAC;IACX,qCAAqC;IACrC,CAAC,CAAC,EAAE,MAAM,CAAC;IACX,qEAAqE;IACrE,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,QAAQ,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;IAC3B,QAAQ,CAAC,EAAE,KAAK,CAAC,GAAG,CAAC,WAAW,CAAC,CAAC;CACnC,CAAC;AAEF,aAAK,UAAU,GAAG,cAAc,GAAG,IAAI,CAAC,KAAK,CAAC,QAAQ,CAAC,WAAW,CAAC,EAAE,MAAM,cAAc,CAAC,CAAC;AAE3F,wBAAgB,KAAK,CAAC,EACpB,CAAK,EACL,CAAK,EACL,SAAS,EACT,SAAS,EACT,QAAQ,EACR,QAAQ,EACR,GAAG,SAAS,EACb,EAAE,UAAU,GAAG,GAAG,CAAC,OAAO,CAW1B"}

package/dist/esm/components/Line/Line.d.ts

@@ -1,5 +1,4 @@
-import type { FC } from 'react';
-import type { Point } from '../../types/types';
+import type { AddSVGProps, Point } from '../../types/types';
 export declare type LineProps = {
     className?: string;
     innerRef?: React.Ref<SVGLineElement>;
@@ -9,5 +8,5 @@ export declare type LineProps = {
     /** Ending x,y point of the line. */
     to?: Point;
 };
-export declare const Line: FC<LineProps>;
+export declare function Line({ from, to, fill, className, innerRef, ...restProps }: AddSVGProps<LineProps, SVGLineElement>): JSX.Element;
 //# sourceMappingURL=Line.d.ts.map

package/dist/esm/components/Line/Line.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"Line.d.ts","sourceRoot":"","sources":["../../../../src/components/Line/Line.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,EAAE,EAAE,MAAM,OAAO,CAAC;AAEhC,OAAO,KAAK,EAAe,KAAK,EAAE,MAAM,mBAAmB,CAAC;AAE5D,oBAAY,SAAS,GAAG;IACtB,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,QAAQ,CAAC,EAAE,KAAK,CAAC,GAAG,CAAC,cAAc,CAAC,CAAC;IACrC,IAAI,CAAC,EAAE,MAAM,CAAC;IACd,sCAAsC;IACtC,IAAI,CAAC,EAAE,KAAK,CAAC;IACb,oCAAoC;IACpC,EAAE,CAAC,EAAE,KAAK,CAAC;CACZ,CAAC;AAEF,eAAO,MAAM,IAAI,EAAE,EAAE,CAAC,SAAS,CAuB9B,CAAC"}
+{"version":3,"file":"Line.d.ts","sourceRoot":"","sources":["../../../../src/components/Line/Line.tsx"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAE,WAAW,EAAE,KAAK,EAAE,MAAM,mBAAmB,CAAC;AAE5D,oBAAY,SAAS,GAAG;IACtB,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,QAAQ,CAAC,EAAE,KAAK,CAAC,GAAG,CAAC,cAAc,CAAC,CAAC;IACrC,IAAI,CAAC,EAAE,MAAM,CAAC;IACd,sCAAsC;IACtC,IAAI,CAAC,EAAE,KAAK,CAAC;IACb,oCAAoC;IACpC,EAAE,CAAC,EAAE,KAAK,CAAC;CACZ,CAAC;AAEF,wBAAgB,IAAI,CAAC,EACnB,IAAqB,EACrB,EAAmB,EACnB,IAAoB,EACpB,SAAS,EACT,QAAQ,EACR,GAAG,SAAS,EACb,EAAE,WAAW,CAAC,SAAS,EAAE,cAAc,CAAC,GAAG,GAAG,CAAC,OAAO,CAgBtD"}

package/dist/esm/components/ParentsizeSVG/ParentsizeSVG.d.ts

@@ -2,7 +2,7 @@ import type { CSSProperties, PropsWithChildren, RefObject } from 'react';
 import type { UseParentSizeOptions } from '@cutting/use-get-parent-size';
 import type { ResponsiveSVGProps } from '../ResponsiveSVG/ResponsiveSVG';
 declare type Align = 'none' | 'center';
-export declare type ParentsizeSVGProps<E extends HTMLElement> = {
+export declare type ParentsizeSVGProps<E extends HTMLElement = HTMLElement> = {
     elementRef: RefObject<E>;
     style?: CSSProperties;
     align?: Align;

package/dist/esm/components/ParentsizeSVG/ParentsizeSVG.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"ParentsizeSVG.d.ts","sourceRoot":"","sources":["../../../../src/components/ParentsizeSVG/ParentsizeSVG.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,aAAa,EAAE,iBAAiB,EAAE,SAAS,EAAE,MAAM,OAAO,CAAC;AAEzE,OAAO,KAAK,EAAE,oBAAoB,EAAE,MAAM,8BAA8B,CAAC;AAEzE,OAAO,KAAK,EAAE,kBAAkB,EAAE,MAAM,gCAAgC,CAAC;AAGzE,aAAK,KAAK,GAAG,MAAM,GAAG,QAAQ,CAAC;AAE/B,oBAAY,kBAAkB,CAAC,CAAC,SAAS,WAAW,IAAI;IACtD,UAAU,EAAE,SAAS,CAAC,CAAC,CAAC,CAAC;IACzB,KAAK,CAAC,EAAE,aAAa,CAAC;IACtB,KAAK,CAAC,EAAE,KAAK,CAAC;IACd,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,OAAO,CAAC,EAAE,OAAO,CAAC,oBAAoB,CAAC,CAAC;CACzC,GAAG,OAAO,CAAC,IAAI,CAAC,kBAAkB,EAAE,UAAU,GAAG,QAAQ,GAAG,QAAQ,CAAC,CAAC,CAAC;AAExE,eAAO,MAAM,YAAY,EAAE,aAOjB,CAAC;AAEX,wBAAgB,aAAa,CAAC,CAAC,SAAS,WAAW,EAAE,EACnD,UAAU,EACV,QAAQ,EACR,KAAoB,EACpB,KAAS,EACT,KAAc,EACd,OAAO,EAAE,EAAE,aAAkB,EAAE,GAAG,WAAW,EAAO,EACpD,GAAG,IAAI,EACR,EAAE,iBAAiB,CAAC,kBAAkB,CAAC,CAAC,CAAC,CAAC,GAAG,GAAG,CAAC,OAAO,GAAG,IAAI,CAsB/D"}
+{"version":3,"file":"ParentsizeSVG.d.ts","sourceRoot":"","sources":["../../../../src/components/ParentsizeSVG/ParentsizeSVG.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,aAAa,EAAE,iBAAiB,EAAE,SAAS,EAAE,MAAM,OAAO,CAAC;AAEzE,OAAO,KAAK,EAAE,oBAAoB,EAAE,MAAM,8BAA8B,CAAC;AAEzE,OAAO,KAAK,EAAE,kBAAkB,EAAE,MAAM,gCAAgC,CAAC;AAGzE,aAAK,KAAK,GAAG,MAAM,GAAG,QAAQ,CAAC;AAE/B,oBAAY,kBAAkB,CAAC,CAAC,SAAS,WAAW,GAAG,WAAW,IAAI;IACpE,UAAU,EAAE,SAAS,CAAC,CAAC,CAAC,CAAC;IACzB,KAAK,CAAC,EAAE,aAAa,CAAC;IACtB,KAAK,CAAC,EAAE,KAAK,CAAC;IACd,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,OAAO,CAAC,EAAE,OAAO,CAAC,oBAAoB,CAAC,CAAC;CACzC,GAAG,OAAO,CAAC,IAAI,CAAC,kBAAkB,EAAE,UAAU,GAAG,QAAQ,GAAG,QAAQ,CAAC,CAAC,CAAC;AAExE,eAAO,MAAM,YAAY,EAAE,aAOjB,CAAC;AAEX,wBAAgB,aAAa,CAAC,CAAC,SAAS,WAAW,EAAE,EACnD,UAAU,EACV,QAAQ,EACR,KAAoB,EACpB,KAAS,EACT,KAAc,EACd,OAAO,EAAE,EAAE,aAAkB,EAAE,GAAG,WAAW,EAAO,EACpD,GAAG,IAAI,EACR,EAAE,iBAAiB,CAAC,kBAAkB,CAAC,CAAC,CAAC,CAAC,GAAG,GAAG,CAAC,OAAO,GAAG,IAAI,CAwB/D"}

package/dist/esm/components/ResponsiveSVG/ResponsiveSVG.d.ts

@@ -1,4 +1,4 @@
-import type { FC, Ref } from 'react';
+import type { ReactNode, Ref } from 'react';
 import type { PreserveAspectRatio } from '../../types/types';
 export interface Point {
     x: number;
@@ -12,6 +12,7 @@ export interface ResponsiveSVGProps {
     innerRef?: Ref<SVGSVGElement>;
     className?: string;
     hide?: boolean;
+    children: ReactNode;
 }
-export declare const ResponsiveSVG: FC<ResponsiveSVGProps>;
+export declare function ResponsiveSVG({ height, width, children, origin, preserveAspectRatio, innerRef, className, }: ResponsiveSVGProps): JSX.Element;
 //# sourceMappingURL=ResponsiveSVG.d.ts.map

package/dist/esm/components/ResponsiveSVG/ResponsiveSVG.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"ResponsiveSVG.d.ts","sourceRoot":"","sources":["../../../../src/components/ResponsiveSVG/ResponsiveSVG.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,EAAE,EAAE,GAAG,EAAE,MAAM,OAAO,CAAC;AACrC,OAAO,KAAK,EAAE,mBAAmB,EAAE,MAAM,mBAAmB,CAAC;AAE7D,MAAM,WAAW,KAAK;IACpB,CAAC,EAAE,MAAM,CAAC;IACV,CAAC,EAAE,MAAM,CAAC;CACX;AAED,MAAM,WAAW,kBAAkB;IACjC,KAAK,EAAE,MAAM,CAAC;IACd,MAAM,EAAE,MAAM,CAAC;IACf,MAAM,CAAC,EAAE,KAAK,CAAC;IACf,mBAAmB,CAAC,EAAE,mBAAmB,CAAC;IAC1C,QAAQ,CAAC,EAAE,GAAG,CAAC,aAAa,CAAC,CAAC;IAC9B,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,IAAI,CAAC,EAAE,OAAO,CAAC;CAChB;AAED,eAAO,MAAM,aAAa,EAAE,EAAE,CAAC,kBAAkB,CAiChD,CAAC"}
+{"version":3,"file":"ResponsiveSVG.d.ts","sourceRoot":"","sources":["../../../../src/components/ResponsiveSVG/ResponsiveSVG.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,SAAS,EAAE,GAAG,EAAE,MAAM,OAAO,CAAC;AAC5C,OAAO,KAAK,EAAE,mBAAmB,EAAE,MAAM,mBAAmB,CAAC;AAE7D,MAAM,WAAW,KAAK;IACpB,CAAC,EAAE,MAAM,CAAC;IACV,CAAC,EAAE,MAAM,CAAC;CACX;AAED,MAAM,WAAW,kBAAkB;IACjC,KAAK,EAAE,MAAM,CAAC;IACd,MAAM,EAAE,MAAM,CAAC;IACf,MAAM,CAAC,EAAE,KAAK,CAAC;IACf,mBAAmB,CAAC,EAAE,mBAAmB,CAAC;IAC1C,QAAQ,CAAC,EAAE,GAAG,CAAC,aAAa,CAAC,CAAC;IAC9B,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,IAAI,CAAC,EAAE,OAAO,CAAC;IACf,QAAQ,EAAE,SAAS,CAAC;CACrB;AAED,wBAAgB,aAAa,CAAC,EAC5B,MAAM,EACN,KAAK,EACL,QAAQ,EACR,MAAuB,EACvB,mBAAqC,EACrC,QAAQ,EACR,SAAS,GACV,EAAE,kBAAkB,GAAG,GAAG,CAAC,OAAO,CAyBlC"}

package/dist/esm/index.js

@@ -1,2 +1,2 @@
-import{jsx as e}from"react/jsx-runtime";import r from"@babel/runtime/helpers/esm/slicedToArray";import i from"@babel/runtime/helpers/esm/objectSpread2";import o from"@babel/runtime/helpers/esm/objectWithoutProperties";import{useEffect as n}from"react";import{useParentSize as t}from"@cutting/use-get-parent-size";import s from"classnames";!function(){const e={NODE_ENV:"production"};try{if(process)return process.env=Object.assign({},process.env),void Object.assign(process.env,e)}catch(e){}globalThis.process={env:e}}();var c=function(r){var i=r.width,o=r.children,n=r.origin,t=void 0===n?{x:0,y:0}:n,s=r.preserveAspectRatio,c=void 0===s?"xMaxYMid meet":s,a=r.innerRef,l=r.className,d=Math.ceil(i/(i/r.height));return e("div",{"data-selector":"cutting-svg-container",style:{position:"relative",overflow:"visible",height:"1px"},children:e("svg",{style:{overflow:"visible"},className:l,preserveAspectRatio:c,viewBox:"".concat(t.x," ").concat(t.y," ").concat(i," ").concat(d),ref:a,children:o},void 0)},void 0)},a=["debounceDelay"],l=["elementRef","children","style","scale","align","options"],d={display:"flex",flexDirection:"column",flexGrow:1,flexShrink:1,flexBasis:"0%",overflow:"hidden"};function v(s){var v=s.elementRef,f=s.children,m=s.style,p=void 0===m?d:m,h=s.scale,u=void 0===h?1:h,x=s.align,y=void 0===x?"none":x,g=s.options,b=(g=void 0===g?{}:g).debounceDelay,N=void 0===b?50:b,R=o(g,a),w=o(s,l),j=t(v,i({debounceDelay:N},R)),D=j.width,O=j.height;n((function(){if(v.current)for(var e=0,i=Object.entries(p);e<i.length;e++){var o=r(i[e],2);v.current.style[o[0]]=o[1]}}),[v,p]);var A="center"===y?"translate(".concat(D/2,",").concat(O/2-20,") scale(").concat(u,")"):"0,0) scale(".concat(u,")");return e(c,i(i({width:D,height:O},w),{},{children:e("g",{transform:A,children:f},void 0)}),void 0)}var f=["y","x","transform","className","children","innerRef"],m=function(r){var n=r.y,t=void 0===n?0:n,c=r.x,a=void 0===c?0:c,l=r.transform,d=r.className,v=r.children,m=r.innerRef,p=o(r,f);return e("g",i(i({ref:m,className:s("visx-group",d),transform:l||"translate(".concat(a,", ").concat(t,")")},p),{},{children:v}),void 0)},p=["from","to","fill","className","innerRef"],h=function(r){var n=r.from,t=void 0===n?{x:0,y:0}:n,c=r.to,a=void 0===c?{x:1,y:1}:c,l=r.fill,d=void 0===l?"transparent":l,v=r.className,f=r.innerRef,m=o(r,p),h=t.x===a.x||t.y===a.y;return e("line",i({ref:f,className:s("visx-line",v),x1:t.x,y1:t.y,x2:a.x,y2:a.y,fill:d,shapeRendering:h?"crispEdges":"auto"},m),void 0)};export{m as Group,h as Line,v as ParentsizeSVG,c as ResponsiveSVG};
+import{jsx as e}from"react/jsx-runtime";import r from"@babel/runtime/helpers/esm/slicedToArray";import i from"@babel/runtime/helpers/esm/objectSpread2";import t from"@babel/runtime/helpers/esm/objectWithoutProperties";import{useEffect as n}from"react";import{useParentSize as o}from"@cutting/use-get-parent-size";import a from"classnames";function c(r){var i=r.width,t=r.children,n=r.origin,o=void 0===n?{x:0,y:0}:n,a=r.preserveAspectRatio,c=void 0===a?"xMaxYMid meet":a,l=r.innerRef,s=r.className,f=Math.ceil(i/(i/r.height));return e("div",{"data-selector":"cutting-svg-container",style:{position:"relative",overflow:"visible",height:"1px"},children:e("svg",{style:{overflow:"visible"},className:s,preserveAspectRatio:c,viewBox:"".concat(o.x," ").concat(o.y," ").concat(i," ").concat(f),ref:l,children:t})})}var l=["debounceDelay"],s=["elementRef","children","style","scale","align","options"],f={display:"flex",flexDirection:"column",flexGrow:1,flexShrink:1,flexBasis:"0%",overflow:"hidden"};function m(a){var m=a.elementRef,d=a.children,v=a.style,h=void 0===v?f:v,p=a.scale,u=void 0===p?1:p,x=a.align,y=void 0===x?"none":x,g=a.options,b=(g=void 0===g?{}:g).debounceDelay,R=void 0===b?50:b,w=t(g,l),N=t(a,s),j=o(m,i({debounceDelay:R},w)),D=j.width,A=j.height;n((function(){if(m.current)for(var e=0,i=Object.entries(h);e<i.length;e++){var t=r(i[e],2);m.current.style[t[0]]=t[1]}}),[m,h]);var M="center"===y?"translate(".concat(D/2,",").concat(A/2-20,") scale(").concat(u,")"):"translate(0,0) scale(".concat(u,")");return e(c,i(i({width:D,height:A},N),{},{children:e("g",{transform:M,children:d})}))}var d=["y","x","transform","className","children","innerRef"];function v(r){var n=r.y,o=void 0===n?0:n,c=r.x,l=void 0===c?0:c,s=r.transform,f=r.className,m=r.children,v=r.innerRef,h=t(r,d);return e("g",i(i({ref:v,className:a("visx-group",f),transform:s||"translate(".concat(l,", ").concat(o,")")},h),{},{children:m}))}var h=["from","to","fill","className","innerRef"];function p(r){var n=r.from,o=void 0===n?{x:0,y:0}:n,c=r.to,l=void 0===c?{x:1,y:1}:c,s=r.fill,f=void 0===s?"transparent":s,m=r.className,d=r.innerRef,v=t(r,h),p=o.x===l.x||o.y===l.y;return e("line",i({ref:d,className:a("visx-line",m),x1:o.x,y1:o.y,x2:l.x,y2:l.y,fill:f,shapeRendering:p?"crispEdges":"auto"},v))}export{v as Group,p as Line,m as ParentsizeSVG,c as ResponsiveSVG};
 //# sourceMappingURL=index.js.map

package/dist/esm/index.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.js","sources":["../../src/components/ResponsiveSVG/ResponsiveSVG.tsx","../../src/components/ParentsizeSVG/ParentsizeSVG.tsx","../../src/components/Group/Group.tsx","../../src/components/Line/Line.tsx"],"sourcesContent":["import type { FC, Ref } from 'react';\nimport type { PreserveAspectRatio } from '../../types/types';\n\nexport interface Point {\n  x: number;\n  y: number;\n}\n\nexport interface ResponsiveSVGProps {\n  width: number;\n  height: number;\n  origin?: Point;\n  preserveAspectRatio?: PreserveAspectRatio;\n  innerRef?: Ref<SVGSVGElement>;\n  className?: string;\n  hide?: boolean;\n}\n\nexport const ResponsiveSVG: FC<ResponsiveSVGProps> = ({\n  height,\n  width,\n  children,\n  origin = { x: 0, y: 0 },\n  preserveAspectRatio = 'xMaxYMid meet',\n  innerRef,\n  className,\n}) => {\n  const aspect = width / height;\n\n  const adjustedHeight = Math.ceil(width / aspect);\n\n  return (\n    <div\n      data-selector=\"cutting-svg-container\"\n      style={{\n        position: 'relative',\n        overflow: 'visible',\n        height: '1px',\n      }}\n    >\n      <svg\n        style={{ overflow: 'visible' }}\n        className={className}\n        preserveAspectRatio={preserveAspectRatio}\n        viewBox={`${origin.x} ${origin.y} ${width} ${adjustedHeight}`}\n        ref={innerRef}\n      >\n        {children}\n      </svg>\n    </div>\n  );\n};\n","import type { CSSProperties, PropsWithChildren, RefObject } from 'react';\nimport { useEffect } from 'react';\nimport type { UseParentSizeOptions } from '@cutting/use-get-parent-size';\nimport { useParentSize } from '@cutting/use-get-parent-size';\nimport type { ResponsiveSVGProps } from '../ResponsiveSVG/ResponsiveSVG';\nimport { ResponsiveSVG } from '../ResponsiveSVG/ResponsiveSVG';\n\ntype Align = 'none' | 'center';\n\nexport type ParentsizeSVGProps<E extends HTMLElement> = {\n  elementRef: RefObject<E>;\n  style?: CSSProperties;\n  align?: Align;\n  scale?: number;\n  options?: Partial<UseParentSizeOptions>;\n} & Partial<Omit<ResponsiveSVGProps, 'innerRef' | 'height' | 'height'>>;\n\nexport const DefaultStyle: CSSProperties = {\n  display: 'flex',\n  flexDirection: 'column',\n  flexGrow: 1,\n  flexShrink: 1,\n  flexBasis: '0%',\n  overflow: 'hidden',\n} as const;\n\nexport function ParentsizeSVG<E extends HTMLElement>({\n  elementRef,\n  children,\n  style = DefaultStyle,\n  scale = 1,\n  align = 'none',\n  options: { debounceDelay = 50, ...optionsRest } = {},\n  ...rest\n}: PropsWithChildren<ParentsizeSVGProps<E>>): JSX.Element | null {\n  const { width, height } = useParentSize(elementRef, { debounceDelay, ...optionsRest });\n\n  useEffect(() => {\n    if (!elementRef.current) {\n      return;\n    }\n\n    for (const [key, value] of Object.entries(style)) {\n      // eslint-disable-next-line @typescript-eslint/no-explicit-any\n      elementRef.current.style[key as any] = value;\n    }\n  }, [elementRef, style]);\n\n  const transform =\n    align === 'center' ? `translate(${width / 2},${height / 2 - 20}) scale(${scale})` : `0,0) scale(${scale})`;\n\n  return (\n    <ResponsiveSVG width={width} height={height} {...rest}>\n      <g transform={transform}>{children}</g>\n    </ResponsiveSVG>\n  );\n}\n","import type { FC } from 'react';\nimport cx from 'classnames';\n\ntype GroupOnlyProps = {\n  /** Top offset applied to `<g/>`. */\n  y?: number;\n  /** Left offset applied to `<g/>`. */\n  x?: number;\n  /** Override `x` and `y` to provide the entire `transform` string. */\n  transform?: string;\n  className?: string;\n  children?: React.ReactNode;\n  innerRef?: React.Ref<SVGGElement>;\n};\n\ntype GroupProps = GroupOnlyProps & Omit<React.SVGProps<SVGGElement>, keyof GroupOnlyProps>;\n\nexport const Group: FC<GroupProps> = ({\n  y = 0,\n  x = 0,\n  transform,\n  className,\n  children,\n  innerRef,\n  ...restProps\n}: GroupProps): JSX.Element => {\n  return (\n    <g\n      ref={innerRef}\n      className={cx('visx-group', className)}\n      transform={transform || `translate(${x}, ${y})`}\n      {...restProps}\n    >\n      {children}\n    </g>\n  );\n};\n","import type { FC } from 'react';\nimport cx from 'classnames';\nimport type { AddSVGProps, Point } from '../../types/types';\n\nexport type LineProps = {\n  className?: string;\n  innerRef?: React.Ref<SVGLineElement>;\n  fill?: string;\n  /** Starting x,y point of the line. */\n  from?: Point;\n  /** Ending x,y point of the line. */\n  to?: Point;\n};\n\nexport const Line: FC<LineProps> = ({\n  from = { x: 0, y: 0 },\n  to = { x: 1, y: 1 },\n  fill = 'transparent',\n  className,\n  innerRef,\n  ...restProps\n}: AddSVGProps<LineProps, SVGLineElement>): JSX.Element => {\n  const isRectilinear = from.x === to.x || from.y === to.y;\n\n  return (\n    <line\n      ref={innerRef}\n      className={cx('visx-line', className)}\n      x1={from.x}\n      y1={from.y}\n      x2={to.x}\n      y2={to.y}\n      fill={fill}\n      shapeRendering={isRectilinear ? 'crispEdges' : 'auto'}\n      {...restProps}\n    />\n  );\n};\n"],"names":["ResponsiveSVG","width","children","origin","x","y","preserveAspectRatio","innerRef","className","adjustedHeight","Math","ceil","height","_jsx","style","position","overflow","viewBox","ref","DefaultStyle","display","flexDirection","flexGrow","flexShrink","flexBasis","ParentsizeSVG","elementRef","scale","align","options","debounceDelay","optionsRest","rest","useParentSize","useEffect","current","Object","entries","transform","Group","restProps","cx","Line","from","to","fill","isRectilinear","x1","y1","x2","y2","shapeRendering"],"mappings":"6gBAkBaA,EAAwC,gBAEnDC,IAAAA,MACAC,IAAAA,aACAC,OAAAA,aAAS,CAAEC,EAAG,EAAGC,EAAG,SACpBC,oBAAAA,aAAsB,kBACtBC,IAAAA,SACAC,IAAAA,UAIMC,EAAiBC,KAAKC,KAAKV,GAFlBA,IARfW,gBAaEC,yBACgB,wBACdC,MAAO,CACLC,SAAU,WACVC,SAAU,UACVJ,OAAQ,gBAGVC,SACEC,MAAO,CAAEE,SAAU,WACnBR,UAAWA,EACXF,oBAAqBA,EACrBW,kBAAYd,EAAOC,cAAKD,EAAOE,cAAKJ,cAASQ,GAC7CS,IAAKX,WAEJL,uGC9BIiB,EAA8B,CACzCC,QAAS,OACTC,cAAe,SACfC,SAAU,EACVC,WAAY,EACZC,UAAW,KACXR,SAAU,mBAGIS,SACdC,IAAAA,WACAxB,IAAAA,aACAY,MAAAA,aAAQK,QACRQ,MAAAA,aAAQ,QACRC,MAAAA,aAAQ,aACRC,wBAAkD,MAAvCC,cAAAA,aAAgB,KAAOC,SAC/BC,WAEuBC,EAAcP,KAAcI,cAAAA,GAAkBC,IAAhE9B,IAAAA,MAAOW,IAAAA,OAEfsB,GAAU,cACHR,EAAWS,sBAIWC,OAAOC,QAAQvB,kBAAQ,iBAEhDY,EAAWS,QAAQrB,oBAEpB,CAACY,EAAYZ,QAEVwB,EACM,WAAVV,sBAAkC3B,EAAQ,cAAKW,EAAS,EAAI,sBAAae,4BAAyBA,cAGlGd,EAACb,OAAcC,MAAOA,EAAOW,OAAQA,GAAYoB,gBAC/CnB,OAAGyB,UAAWA,WAAYpC,mFCpCnBqC,EAAwB,oBACnClC,EAAAA,aAAI,QACJD,EAAAA,aAAI,IACJkC,IAAAA,UACA9B,IAAAA,UACAN,IAAAA,SACAK,IAAAA,SACGiC,gBAGD3B,WACEK,IAAKX,EACLC,UAAWiC,EAAG,aAAcjC,GAC5B8B,UAAWA,uBAA0BlC,eAAMC,QACvCmC,gBAEHtC,2DCnBMwC,EAAsB,oBACjCC,KAAAA,aAAO,CAAEvC,EAAG,EAAGC,EAAG,SAClBuC,GAAAA,aAAK,CAAExC,EAAG,EAAGC,EAAG,SAChBwC,KAAAA,aAAO,gBACPrC,IAAAA,UACAD,IAAAA,SACGiC,SAEGM,EAAgBH,EAAKvC,IAAMwC,EAAGxC,GAAKuC,EAAKtC,IAAMuC,EAAGvC,SAGrDQ,YACEK,IAAKX,EACLC,UAAWiC,EAAG,YAAajC,GAC3BuC,GAAIJ,EAAKvC,EACT4C,GAAIL,EAAKtC,EACT4C,GAAIL,EAAGxC,EACP8C,GAAIN,EAAGvC,EACPwC,KAAMA,EACNM,eAAgBL,EAAgB,aAAe,QAC3CN"}
+{"version":3,"file":"index.js","sources":["../../src/components/ResponsiveSVG/ResponsiveSVG.tsx","../../src/components/ParentsizeSVG/ParentsizeSVG.tsx","../../src/components/Group/Group.tsx","../../src/components/Line/Line.tsx"],"sourcesContent":["import type { ReactNode, Ref } from 'react';\nimport type { PreserveAspectRatio } from '../../types/types';\n\nexport interface Point {\n  x: number;\n  y: number;\n}\n\nexport interface ResponsiveSVGProps {\n  width: number;\n  height: number;\n  origin?: Point;\n  preserveAspectRatio?: PreserveAspectRatio;\n  innerRef?: Ref<SVGSVGElement>;\n  className?: string;\n  hide?: boolean;\n  children: ReactNode;\n}\n\nexport function ResponsiveSVG({\n  height,\n  width,\n  children,\n  origin = { x: 0, y: 0 },\n  preserveAspectRatio = 'xMaxYMid meet',\n  innerRef,\n  className,\n}: ResponsiveSVGProps): JSX.Element {\n  const aspect = width / height;\n\n  const adjustedHeight = Math.ceil(width / aspect);\n\n  return (\n    <div\n      data-selector=\"cutting-svg-container\"\n      style={{\n        position: 'relative',\n        overflow: 'visible',\n        height: '1px',\n      }}\n    >\n      <svg\n        style={{ overflow: 'visible' }}\n        className={className}\n        preserveAspectRatio={preserveAspectRatio}\n        viewBox={`${origin.x} ${origin.y} ${width} ${adjustedHeight}`}\n        ref={innerRef}\n      >\n        {children}\n      </svg>\n    </div>\n  );\n}\n","import type { CSSProperties, PropsWithChildren, RefObject } from 'react';\nimport { useEffect } from 'react';\nimport type { UseParentSizeOptions } from '@cutting/use-get-parent-size';\nimport { useParentSize } from '@cutting/use-get-parent-size';\nimport type { ResponsiveSVGProps } from '../ResponsiveSVG/ResponsiveSVG';\nimport { ResponsiveSVG } from '../ResponsiveSVG/ResponsiveSVG';\n\ntype Align = 'none' | 'center';\n\nexport type ParentsizeSVGProps<E extends HTMLElement = HTMLElement> = {\n  elementRef: RefObject<E>;\n  style?: CSSProperties;\n  align?: Align;\n  scale?: number;\n  options?: Partial<UseParentSizeOptions>;\n} & Partial<Omit<ResponsiveSVGProps, 'innerRef' | 'height' | 'height'>>;\n\nexport const DefaultStyle: CSSProperties = {\n  display: 'flex',\n  flexDirection: 'column',\n  flexGrow: 1,\n  flexShrink: 1,\n  flexBasis: '0%',\n  overflow: 'hidden',\n} as const;\n\nexport function ParentsizeSVG<E extends HTMLElement>({\n  elementRef,\n  children,\n  style = DefaultStyle,\n  scale = 1,\n  align = 'none',\n  options: { debounceDelay = 50, ...optionsRest } = {},\n  ...rest\n}: PropsWithChildren<ParentsizeSVGProps<E>>): JSX.Element | null {\n  const { width, height } = useParentSize(elementRef, { debounceDelay, ...optionsRest });\n\n  useEffect(() => {\n    if (!elementRef.current) {\n      return;\n    }\n\n    for (const [key, value] of Object.entries(style)) {\n      // eslint-disable-next-line @typescript-eslint/no-explicit-any\n      elementRef.current.style[key as any] = value;\n    }\n  }, [elementRef, style]);\n\n  const transform =\n    align === 'center'\n      ? `translate(${width / 2},${height / 2 - 20}) scale(${scale})`\n      : `translate(0,0) scale(${scale})`;\n\n  return (\n    <ResponsiveSVG width={width} height={height} {...rest}>\n      <g transform={transform}>{children}</g>\n    </ResponsiveSVG>\n  );\n}\n","import cx from 'classnames';\n\ntype GroupOnlyProps = {\n  /** Top offset applied to `<g/>`. */\n  y?: number;\n  /** Left offset applied to `<g/>`. */\n  x?: number;\n  /** Override `x` and `y` to provide the entire `transform` string. */\n  transform?: string;\n  className?: string;\n  children?: React.ReactNode;\n  innerRef?: React.Ref<SVGGElement>;\n};\n\ntype GroupProps = GroupOnlyProps & Omit<React.SVGProps<SVGGElement>, keyof GroupOnlyProps>;\n\nexport function Group({\n  y = 0,\n  x = 0,\n  transform,\n  className,\n  children,\n  innerRef,\n  ...restProps\n}: GroupProps): JSX.Element {\n  return (\n    <g\n      ref={innerRef}\n      className={cx('visx-group', className)}\n      transform={transform || `translate(${x}, ${y})`}\n      {...restProps}\n    >\n      {children}\n    </g>\n  );\n}\n","import cx from 'classnames';\nimport type { AddSVGProps, Point } from '../../types/types';\n\nexport type LineProps = {\n  className?: string;\n  innerRef?: React.Ref<SVGLineElement>;\n  fill?: string;\n  /** Starting x,y point of the line. */\n  from?: Point;\n  /** Ending x,y point of the line. */\n  to?: Point;\n};\n\nexport function Line({\n  from = { x: 0, y: 0 },\n  to = { x: 1, y: 1 },\n  fill = 'transparent',\n  className,\n  innerRef,\n  ...restProps\n}: AddSVGProps<LineProps, SVGLineElement>): JSX.Element {\n  const isRectilinear = from.x === to.x || from.y === to.y;\n\n  return (\n    <line\n      ref={innerRef}\n      className={cx('visx-line', className)}\n      x1={from.x}\n      y1={from.y}\n      x2={to.x}\n      y2={to.y}\n      fill={fill}\n      shapeRendering={isRectilinear ? 'crispEdges' : 'auto'}\n      {...restProps}\n    />\n  );\n}\n"],"names":["ResponsiveSVG","_ref","height","width","children","_ref$origin","origin","x","y","_ref$preserveAspectRa","preserveAspectRatio","innerRef","className","adjustedHeight","Math","ceil","_jsx","style","position","overflow","viewBox","concat","ref","DefaultStyle","display","flexDirection","flexGrow","flexShrink","flexBasis","ParentsizeSVG","elementRef","_ref$style","_ref$scale","scale","_ref$align","align","_ref$options","options","_ref$options$debounce","debounceDelay","optionsRest","_objectWithoutProperties","_excluded","rest","_excluded2","useParentSize","_objectSpread","useEffect","current","_i","_Object$entries","Object","entries","length","_Object$entries$_i","_slicedToArray","transform","Group","_ref$y","_ref$x","restProps","cx","Line","_ref$from","from","_ref$to","to","_ref$fill","fill","isRectilinear","x1","y1","x2","y2","shapeRendering"],"mappings":"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"}

package/dist/umd/components/Group/Group.d.ts

@@ -1,4 +1,3 @@
-import type { FC } from 'react';
 declare type GroupOnlyProps = {
     /** Top offset applied to `<g/>`. */
     y?: number;
@@ -11,6 +10,6 @@ declare type GroupOnlyProps = {
     innerRef?: React.Ref<SVGGElement>;
 };
 declare type GroupProps = GroupOnlyProps & Omit<React.SVGProps<SVGGElement>, keyof GroupOnlyProps>;
-export declare const Group: FC<GroupProps>;
+export declare function Group({ y, x, transform, className, children, innerRef, ...restProps }: GroupProps): JSX.Element;
 export {};
 //# sourceMappingURL=Group.d.ts.map

package/dist/umd/components/Group/Group.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"Group.d.ts","sourceRoot":"","sources":["../../../../src/components/Group/Group.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,EAAE,EAAE,MAAM,OAAO,CAAC;AAGhC,aAAK,cAAc,GAAG;IACpB,oCAAoC;IACpC,CAAC,CAAC,EAAE,MAAM,CAAC;IACX,qCAAqC;IACrC,CAAC,CAAC,EAAE,MAAM,CAAC;IACX,qEAAqE;IACrE,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,QAAQ,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;IAC3B,QAAQ,CAAC,EAAE,KAAK,CAAC,GAAG,CAAC,WAAW,CAAC,CAAC;CACnC,CAAC;AAEF,aAAK,UAAU,GAAG,cAAc,GAAG,IAAI,CAAC,KAAK,CAAC,QAAQ,CAAC,WAAW,CAAC,EAAE,MAAM,cAAc,CAAC,CAAC;AAE3F,eAAO,MAAM,KAAK,EAAE,EAAE,CAAC,UAAU,CAmBhC,CAAC"}
+{"version":3,"file":"Group.d.ts","sourceRoot":"","sources":["../../../../src/components/Group/Group.tsx"],"names":[],"mappings":"AAEA,aAAK,cAAc,GAAG;IACpB,oCAAoC;IACpC,CAAC,CAAC,EAAE,MAAM,CAAC;IACX,qCAAqC;IACrC,CAAC,CAAC,EAAE,MAAM,CAAC;IACX,qEAAqE;IACrE,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,QAAQ,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;IAC3B,QAAQ,CAAC,EAAE,KAAK,CAAC,GAAG,CAAC,WAAW,CAAC,CAAC;CACnC,CAAC;AAEF,aAAK,UAAU,GAAG,cAAc,GAAG,IAAI,CAAC,KAAK,CAAC,QAAQ,CAAC,WAAW,CAAC,EAAE,MAAM,cAAc,CAAC,CAAC;AAE3F,wBAAgB,KAAK,CAAC,EACpB,CAAK,EACL,CAAK,EACL,SAAS,EACT,SAAS,EACT,QAAQ,EACR,QAAQ,EACR,GAAG,SAAS,EACb,EAAE,UAAU,GAAG,GAAG,CAAC,OAAO,CAW1B"}

package/dist/umd/components/Line/Line.d.ts

@@ -1,5 +1,4 @@
-import type { FC } from 'react';
-import type { Point } from '../../types/types';
+import type { AddSVGProps, Point } from '../../types/types';
 export declare type LineProps = {
     className?: string;
     innerRef?: React.Ref<SVGLineElement>;
@@ -9,5 +8,5 @@ export declare type LineProps = {
     /** Ending x,y point of the line. */
     to?: Point;
 };
-export declare const Line: FC<LineProps>;
+export declare function Line({ from, to, fill, className, innerRef, ...restProps }: AddSVGProps<LineProps, SVGLineElement>): JSX.Element;
 //# sourceMappingURL=Line.d.ts.map

package/dist/umd/components/Line/Line.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"Line.d.ts","sourceRoot":"","sources":["../../../../src/components/Line/Line.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,EAAE,EAAE,MAAM,OAAO,CAAC;AAEhC,OAAO,KAAK,EAAe,KAAK,EAAE,MAAM,mBAAmB,CAAC;AAE5D,oBAAY,SAAS,GAAG;IACtB,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,QAAQ,CAAC,EAAE,KAAK,CAAC,GAAG,CAAC,cAAc,CAAC,CAAC;IACrC,IAAI,CAAC,EAAE,MAAM,CAAC;IACd,sCAAsC;IACtC,IAAI,CAAC,EAAE,KAAK,CAAC;IACb,oCAAoC;IACpC,EAAE,CAAC,EAAE,KAAK,CAAC;CACZ,CAAC;AAEF,eAAO,MAAM,IAAI,EAAE,EAAE,CAAC,SAAS,CAuB9B,CAAC"}
+{"version":3,"file":"Line.d.ts","sourceRoot":"","sources":["../../../../src/components/Line/Line.tsx"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAE,WAAW,EAAE,KAAK,EAAE,MAAM,mBAAmB,CAAC;AAE5D,oBAAY,SAAS,GAAG;IACtB,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,QAAQ,CAAC,EAAE,KAAK,CAAC,GAAG,CAAC,cAAc,CAAC,CAAC;IACrC,IAAI,CAAC,EAAE,MAAM,CAAC;IACd,sCAAsC;IACtC,IAAI,CAAC,EAAE,KAAK,CAAC;IACb,oCAAoC;IACpC,EAAE,CAAC,EAAE,KAAK,CAAC;CACZ,CAAC;AAEF,wBAAgB,IAAI,CAAC,EACnB,IAAqB,EACrB,EAAmB,EACnB,IAAoB,EACpB,SAAS,EACT,QAAQ,EACR,GAAG,SAAS,EACb,EAAE,WAAW,CAAC,SAAS,EAAE,cAAc,CAAC,GAAG,GAAG,CAAC,OAAO,CAgBtD"}

package/dist/umd/components/ParentsizeSVG/ParentsizeSVG.d.ts

@@ -2,7 +2,7 @@ import type { CSSProperties, PropsWithChildren, RefObject } from 'react';
 import type { UseParentSizeOptions } from '@cutting/use-get-parent-size';
 import type { ResponsiveSVGProps } from '../ResponsiveSVG/ResponsiveSVG';
 declare type Align = 'none' | 'center';
-export declare type ParentsizeSVGProps<E extends HTMLElement> = {
+export declare type ParentsizeSVGProps<E extends HTMLElement = HTMLElement> = {
     elementRef: RefObject<E>;
     style?: CSSProperties;
     align?: Align;

package/dist/umd/components/ParentsizeSVG/ParentsizeSVG.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"ParentsizeSVG.d.ts","sourceRoot":"","sources":["../../../../src/components/ParentsizeSVG/ParentsizeSVG.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,aAAa,EAAE,iBAAiB,EAAE,SAAS,EAAE,MAAM,OAAO,CAAC;AAEzE,OAAO,KAAK,EAAE,oBAAoB,EAAE,MAAM,8BAA8B,CAAC;AAEzE,OAAO,KAAK,EAAE,kBAAkB,EAAE,MAAM,gCAAgC,CAAC;AAGzE,aAAK,KAAK,GAAG,MAAM,GAAG,QAAQ,CAAC;AAE/B,oBAAY,kBAAkB,CAAC,CAAC,SAAS,WAAW,IAAI;IACtD,UAAU,EAAE,SAAS,CAAC,CAAC,CAAC,CAAC;IACzB,KAAK,CAAC,EAAE,aAAa,CAAC;IACtB,KAAK,CAAC,EAAE,KAAK,CAAC;IACd,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,OAAO,CAAC,EAAE,OAAO,CAAC,oBAAoB,CAAC,CAAC;CACzC,GAAG,OAAO,CAAC,IAAI,CAAC,kBAAkB,EAAE,UAAU,GAAG,QAAQ,GAAG,QAAQ,CAAC,CAAC,CAAC;AAExE,eAAO,MAAM,YAAY,EAAE,aAOjB,CAAC;AAEX,wBAAgB,aAAa,CAAC,CAAC,SAAS,WAAW,EAAE,EACnD,UAAU,EACV,QAAQ,EACR,KAAoB,EACpB,KAAS,EACT,KAAc,EACd,OAAO,EAAE,EAAE,aAAkB,EAAE,GAAG,WAAW,EAAO,EACpD,GAAG,IAAI,EACR,EAAE,iBAAiB,CAAC,kBAAkB,CAAC,CAAC,CAAC,CAAC,GAAG,GAAG,CAAC,OAAO,GAAG,IAAI,CAsB/D"}
+{"version":3,"file":"ParentsizeSVG.d.ts","sourceRoot":"","sources":["../../../../src/components/ParentsizeSVG/ParentsizeSVG.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,aAAa,EAAE,iBAAiB,EAAE,SAAS,EAAE,MAAM,OAAO,CAAC;AAEzE,OAAO,KAAK,EAAE,oBAAoB,EAAE,MAAM,8BAA8B,CAAC;AAEzE,OAAO,KAAK,EAAE,kBAAkB,EAAE,MAAM,gCAAgC,CAAC;AAGzE,aAAK,KAAK,GAAG,MAAM,GAAG,QAAQ,CAAC;AAE/B,oBAAY,kBAAkB,CAAC,CAAC,SAAS,WAAW,GAAG,WAAW,IAAI;IACpE,UAAU,EAAE,SAAS,CAAC,CAAC,CAAC,CAAC;IACzB,KAAK,CAAC,EAAE,aAAa,CAAC;IACtB,KAAK,CAAC,EAAE,KAAK,CAAC;IACd,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,OAAO,CAAC,EAAE,OAAO,CAAC,oBAAoB,CAAC,CAAC;CACzC,GAAG,OAAO,CAAC,IAAI,CAAC,kBAAkB,EAAE,UAAU,GAAG,QAAQ,GAAG,QAAQ,CAAC,CAAC,CAAC;AAExE,eAAO,MAAM,YAAY,EAAE,aAOjB,CAAC;AAEX,wBAAgB,aAAa,CAAC,CAAC,SAAS,WAAW,EAAE,EACnD,UAAU,EACV,QAAQ,EACR,KAAoB,EACpB,KAAS,EACT,KAAc,EACd,OAAO,EAAE,EAAE,aAAkB,EAAE,GAAG,WAAW,EAAO,EACpD,GAAG,IAAI,EACR,EAAE,iBAAiB,CAAC,kBAAkB,CAAC,CAAC,CAAC,CAAC,GAAG,GAAG,CAAC,OAAO,GAAG,IAAI,CAwB/D"}

package/dist/umd/components/ResponsiveSVG/ResponsiveSVG.d.ts

@@ -1,4 +1,4 @@
-import type { FC, Ref } from 'react';
+import type { ReactNode, Ref } from 'react';
 import type { PreserveAspectRatio } from '../../types/types';
 export interface Point {
     x: number;
@@ -12,6 +12,7 @@ export interface ResponsiveSVGProps {
     innerRef?: Ref<SVGSVGElement>;
     className?: string;
     hide?: boolean;
+    children: ReactNode;
 }
-export declare const ResponsiveSVG: FC<ResponsiveSVGProps>;
+export declare function ResponsiveSVG({ height, width, children, origin, preserveAspectRatio, innerRef, className, }: ResponsiveSVGProps): JSX.Element;
 //# sourceMappingURL=ResponsiveSVG.d.ts.map

package/dist/umd/components/ResponsiveSVG/ResponsiveSVG.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"ResponsiveSVG.d.ts","sourceRoot":"","sources":["../../../../src/components/ResponsiveSVG/ResponsiveSVG.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,EAAE,EAAE,GAAG,EAAE,MAAM,OAAO,CAAC;AACrC,OAAO,KAAK,EAAE,mBAAmB,EAAE,MAAM,mBAAmB,CAAC;AAE7D,MAAM,WAAW,KAAK;IACpB,CAAC,EAAE,MAAM,CAAC;IACV,CAAC,EAAE,MAAM,CAAC;CACX;AAED,MAAM,WAAW,kBAAkB;IACjC,KAAK,EAAE,MAAM,CAAC;IACd,MAAM,EAAE,MAAM,CAAC;IACf,MAAM,CAAC,EAAE,KAAK,CAAC;IACf,mBAAmB,CAAC,EAAE,mBAAmB,CAAC;IAC1C,QAAQ,CAAC,EAAE,GAAG,CAAC,aAAa,CAAC,CAAC;IAC9B,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,IAAI,CAAC,EAAE,OAAO,CAAC;CAChB;AAED,eAAO,MAAM,aAAa,EAAE,EAAE,CAAC,kBAAkB,CAiChD,CAAC"}
+{"version":3,"file":"ResponsiveSVG.d.ts","sourceRoot":"","sources":["../../../../src/components/ResponsiveSVG/ResponsiveSVG.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,SAAS,EAAE,GAAG,EAAE,MAAM,OAAO,CAAC;AAC5C,OAAO,KAAK,EAAE,mBAAmB,EAAE,MAAM,mBAAmB,CAAC;AAE7D,MAAM,WAAW,KAAK;IACpB,CAAC,EAAE,MAAM,CAAC;IACV,CAAC,EAAE,MAAM,CAAC;CACX;AAED,MAAM,WAAW,kBAAkB;IACjC,KAAK,EAAE,MAAM,CAAC;IACd,MAAM,EAAE,MAAM,CAAC;IACf,MAAM,CAAC,EAAE,KAAK,CAAC;IACf,mBAAmB,CAAC,EAAE,mBAAmB,CAAC;IAC1C,QAAQ,CAAC,EAAE,GAAG,CAAC,aAAa,CAAC,CAAC;IAC9B,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,IAAI,CAAC,EAAE,OAAO,CAAC;IACf,QAAQ,EAAE,SAAS,CAAC;CACrB;AAED,wBAAgB,aAAa,CAAC,EAC5B,MAAM,EACN,KAAK,EACL,QAAQ,EACR,MAAuB,EACvB,mBAAqC,EACrC,QAAQ,EACR,SAAS,GACV,EAAE,kBAAkB,GAAG,GAAG,CAAC,OAAO,CAyBlC"}

package/dist/umd/index.js

@@ -1,2 +1,2 @@
-!function(e,t){"object"==typeof exports&&"undefined"!=typeof module?t(exports,require("react/jsx-runtime"),require("@babel/runtime/helpers/slicedToArray"),require("@babel/runtime/helpers/objectSpread2"),require("@babel/runtime/helpers/objectWithoutProperties"),require("react"),require("@cutting/use-get-parent-size"),require("classnames")):"function"==typeof define&&define.amd?define(["exports","react/jsx-runtime","@babel/runtime/helpers/slicedToArray","@babel/runtime/helpers/objectSpread2","@babel/runtime/helpers/objectWithoutProperties","react","@cutting/use-get-parent-size","classnames"],t):t((e="undefined"!=typeof globalThis?globalThis:e||self)["@cutting/svg"]={},e.jsxRuntime,e._slicedToArray,e._objectSpread,e._objectWithoutProperties,e.React,e.useGetParentSize,e.cx)}(this,(function(e,t,r,i,n,s,a,o){"use strict";function c(e){return e&&e.__esModule?e:{default:e}}var l=c(r),d=c(i),u=c(n),f=c(o);!function(){const e={NODE_ENV:"production"};try{if(process)return process.env=Object.assign({},process.env),void Object.assign(process.env,e)}catch(e){}globalThis.process={env:e}}();var v=function(e){var r=e.width,i=e.children,n=e.origin,s=void 0===n?{x:0,y:0}:n,a=e.preserveAspectRatio,o=void 0===a?"xMaxYMid meet":a,c=e.innerRef,l=e.className,d=Math.ceil(r/(r/e.height));return t.jsx("div",{"data-selector":"cutting-svg-container",style:{position:"relative",overflow:"visible",height:"1px"},children:t.jsx("svg",{style:{overflow:"visible"},className:l,preserveAspectRatio:o,viewBox:"".concat(s.x," ").concat(s.y," ").concat(r," ").concat(d),ref:c,children:i},void 0)},void 0)},p=["debounceDelay"],h=["elementRef","children","style","scale","align","options"],x={display:"flex",flexDirection:"column",flexGrow:1,flexShrink:1,flexBasis:"0%",overflow:"hidden"},m=["y","x","transform","className","children","innerRef"],b=["from","to","fill","className","innerRef"];e.Group=function(e){var r=e.y,i=void 0===r?0:r,n=e.x,s=void 0===n?0:n,a=e.transform,o=e.className,c=e.children,l=e.innerRef,v=u.default(e,m);return t.jsx("g",d.default(d.default({ref:l,className:f.default("visx-group",o),transform:a||"translate(".concat(s,", ").concat(i,")")},v),{},{children:c}),void 0)},e.Line=function(e){var r=e.from,i=void 0===r?{x:0,y:0}:r,n=e.to,s=void 0===n?{x:1,y:1}:n,a=e.fill,o=void 0===a?"transparent":a,c=e.className,l=e.innerRef,v=u.default(e,b),p=i.x===s.x||i.y===s.y;return t.jsx("line",d.default({ref:l,className:f.default("visx-line",c),x1:i.x,y1:i.y,x2:s.x,y2:s.y,fill:o,shapeRendering:p?"crispEdges":"auto"},v),void 0)},e.ParentsizeSVG=function(e){var r=e.elementRef,i=e.children,n=e.style,o=void 0===n?x:n,c=e.scale,f=void 0===c?1:c,m=e.align,b=void 0===m?"none":m,y=e.options,g=(y=void 0===y?{}:y).debounceDelay,j=void 0===g?50:g,R=u.default(y,p),N=u.default(e,h),w=a.useParentSize(r,d.default({debounceDelay:j},R)),S=w.width,q=w.height;s.useEffect((function(){if(r.current)for(var e=0,t=Object.entries(o);e<t.length;e++){var i=l.default(t[e],2);r.current.style[i[0]]=i[1]}}),[r,o]);var P="center"===b?"translate(".concat(S/2,",").concat(q/2-20,") scale(").concat(f,")"):"0,0) scale(".concat(f,")");return t.jsx(v,d.default(d.default({width:S,height:q},N),{},{children:t.jsx("g",{transform:P,children:i},void 0)}),void 0)},e.ResponsiveSVG=v}));
+!function(e,t){"object"==typeof exports&&"undefined"!=typeof module?t(exports,require("react/jsx-runtime"),require("@babel/runtime/helpers/slicedToArray"),require("@babel/runtime/helpers/objectSpread2"),require("@babel/runtime/helpers/objectWithoutProperties"),require("react"),require("@cutting/use-get-parent-size"),require("classnames")):"function"==typeof define&&define.amd?define(["exports","react/jsx-runtime","@babel/runtime/helpers/slicedToArray","@babel/runtime/helpers/objectSpread2","@babel/runtime/helpers/objectWithoutProperties","react","@cutting/use-get-parent-size","classnames"],t):t((e="undefined"!=typeof globalThis?globalThis:e||self)["@cutting/svg"]={},e.jsxRuntime,e._slicedToArray,e._objectSpread,e._objectWithoutProperties,e.React,e.useGetParentSize,e.cx)}(this,(function(e,t,r,i,n,a,s,l){"use strict";function o(e){return e&&e.__esModule?e:{default:e}}var c=o(r),u=o(i),d=o(n),f=o(l);function h(e){var r=e.width,i=e.children,n=e.origin,a=void 0===n?{x:0,y:0}:n,s=e.preserveAspectRatio,l=void 0===s?"xMaxYMid meet":s,o=e.innerRef,c=e.className,u=Math.ceil(r/(r/e.height));return t.jsx("div",{"data-selector":"cutting-svg-container",style:{position:"relative",overflow:"visible",height:"1px"},children:t.jsx("svg",{style:{overflow:"visible"},className:c,preserveAspectRatio:l,viewBox:"".concat(a.x," ").concat(a.y," ").concat(r," ").concat(u),ref:o,children:i})})}var v=["debounceDelay"],p=["elementRef","children","style","scale","align","options"],x={display:"flex",flexDirection:"column",flexGrow:1,flexShrink:1,flexBasis:"0%",overflow:"hidden"},m=["y","x","transform","className","children","innerRef"],y=["from","to","fill","className","innerRef"];e.Group=function(e){var r=e.y,i=void 0===r?0:r,n=e.x,a=void 0===n?0:n,s=e.transform,l=e.className,o=e.children,c=e.innerRef,h=d.default(e,m);return t.jsx("g",u.default(u.default({ref:c,className:f.default("visx-group",l),transform:s||"translate(".concat(a,", ").concat(i,")")},h),{},{children:o}))},e.Line=function(e){var r=e.from,i=void 0===r?{x:0,y:0}:r,n=e.to,a=void 0===n?{x:1,y:1}:n,s=e.fill,l=void 0===s?"transparent":s,o=e.className,c=e.innerRef,h=d.default(e,y),v=i.x===a.x||i.y===a.y;return t.jsx("line",u.default({ref:c,className:f.default("visx-line",o),x1:i.x,y1:i.y,x2:a.x,y2:a.y,fill:l,shapeRendering:v?"crispEdges":"auto"},h))},e.ParentsizeSVG=function(e){var r=e.elementRef,i=e.children,n=e.style,l=void 0===n?x:n,o=e.scale,f=void 0===o?1:o,m=e.align,y=void 0===m?"none":m,b=e.options,g=(b=void 0===b?{}:b).debounceDelay,j=void 0===g?50:g,R=d.default(b,v),w=d.default(e,p),N=s.useParentSize(r,u.default({debounceDelay:j},R)),S=N.width,q=N.height;a.useEffect((function(){if(r.current)for(var e=0,t=Object.entries(l);e<t.length;e++){var i=c.default(t[e],2);r.current.style[i[0]]=i[1]}}),[r,l]);var P="center"===y?"translate(".concat(S/2,",").concat(q/2-20,") scale(").concat(f,")"):"translate(0,0) scale(".concat(f,")");return t.jsx(h,u.default(u.default({width:S,height:q},w),{},{children:t.jsx("g",{transform:P,children:i})}))},e.ResponsiveSVG=h}));
 //# sourceMappingURL=index.js.map

package/dist/umd/index.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.js","sources":["../../src/components/ResponsiveSVG/ResponsiveSVG.tsx","../../src/components/ParentsizeSVG/ParentsizeSVG.tsx","../../src/components/Group/Group.tsx","../../src/components/Line/Line.tsx"],"sourcesContent":["import type { FC, Ref } from 'react';\nimport type { PreserveAspectRatio } from '../../types/types';\n\nexport interface Point {\n  x: number;\n  y: number;\n}\n\nexport interface ResponsiveSVGProps {\n  width: number;\n  height: number;\n  origin?: Point;\n  preserveAspectRatio?: PreserveAspectRatio;\n  innerRef?: Ref<SVGSVGElement>;\n  className?: string;\n  hide?: boolean;\n}\n\nexport const ResponsiveSVG: FC<ResponsiveSVGProps> = ({\n  height,\n  width,\n  children,\n  origin = { x: 0, y: 0 },\n  preserveAspectRatio = 'xMaxYMid meet',\n  innerRef,\n  className,\n}) => {\n  const aspect = width / height;\n\n  const adjustedHeight = Math.ceil(width / aspect);\n\n  return (\n    <div\n      data-selector=\"cutting-svg-container\"\n      style={{\n        position: 'relative',\n        overflow: 'visible',\n        height: '1px',\n      }}\n    >\n      <svg\n        style={{ overflow: 'visible' }}\n        className={className}\n        preserveAspectRatio={preserveAspectRatio}\n        viewBox={`${origin.x} ${origin.y} ${width} ${adjustedHeight}`}\n        ref={innerRef}\n      >\n        {children}\n      </svg>\n    </div>\n  );\n};\n","import type { CSSProperties, PropsWithChildren, RefObject } from 'react';\nimport { useEffect } from 'react';\nimport type { UseParentSizeOptions } from '@cutting/use-get-parent-size';\nimport { useParentSize } from '@cutting/use-get-parent-size';\nimport type { ResponsiveSVGProps } from '../ResponsiveSVG/ResponsiveSVG';\nimport { ResponsiveSVG } from '../ResponsiveSVG/ResponsiveSVG';\n\ntype Align = 'none' | 'center';\n\nexport type ParentsizeSVGProps<E extends HTMLElement> = {\n  elementRef: RefObject<E>;\n  style?: CSSProperties;\n  align?: Align;\n  scale?: number;\n  options?: Partial<UseParentSizeOptions>;\n} & Partial<Omit<ResponsiveSVGProps, 'innerRef' | 'height' | 'height'>>;\n\nexport const DefaultStyle: CSSProperties = {\n  display: 'flex',\n  flexDirection: 'column',\n  flexGrow: 1,\n  flexShrink: 1,\n  flexBasis: '0%',\n  overflow: 'hidden',\n} as const;\n\nexport function ParentsizeSVG<E extends HTMLElement>({\n  elementRef,\n  children,\n  style = DefaultStyle,\n  scale = 1,\n  align = 'none',\n  options: { debounceDelay = 50, ...optionsRest } = {},\n  ...rest\n}: PropsWithChildren<ParentsizeSVGProps<E>>): JSX.Element | null {\n  const { width, height } = useParentSize(elementRef, { debounceDelay, ...optionsRest });\n\n  useEffect(() => {\n    if (!elementRef.current) {\n      return;\n    }\n\n    for (const [key, value] of Object.entries(style)) {\n      // eslint-disable-next-line @typescript-eslint/no-explicit-any\n      elementRef.current.style[key as any] = value;\n    }\n  }, [elementRef, style]);\n\n  const transform =\n    align === 'center' ? `translate(${width / 2},${height / 2 - 20}) scale(${scale})` : `0,0) scale(${scale})`;\n\n  return (\n    <ResponsiveSVG width={width} height={height} {...rest}>\n      <g transform={transform}>{children}</g>\n    </ResponsiveSVG>\n  );\n}\n","import type { FC } from 'react';\nimport cx from 'classnames';\n\ntype GroupOnlyProps = {\n  /** Top offset applied to `<g/>`. */\n  y?: number;\n  /** Left offset applied to `<g/>`. */\n  x?: number;\n  /** Override `x` and `y` to provide the entire `transform` string. */\n  transform?: string;\n  className?: string;\n  children?: React.ReactNode;\n  innerRef?: React.Ref<SVGGElement>;\n};\n\ntype GroupProps = GroupOnlyProps & Omit<React.SVGProps<SVGGElement>, keyof GroupOnlyProps>;\n\nexport const Group: FC<GroupProps> = ({\n  y = 0,\n  x = 0,\n  transform,\n  className,\n  children,\n  innerRef,\n  ...restProps\n}: GroupProps): JSX.Element => {\n  return (\n    <g\n      ref={innerRef}\n      className={cx('visx-group', className)}\n      transform={transform || `translate(${x}, ${y})`}\n      {...restProps}\n    >\n      {children}\n    </g>\n  );\n};\n","import type { FC } from 'react';\nimport cx from 'classnames';\nimport type { AddSVGProps, Point } from '../../types/types';\n\nexport type LineProps = {\n  className?: string;\n  innerRef?: React.Ref<SVGLineElement>;\n  fill?: string;\n  /** Starting x,y point of the line. */\n  from?: Point;\n  /** Ending x,y point of the line. */\n  to?: Point;\n};\n\nexport const Line: FC<LineProps> = ({\n  from = { x: 0, y: 0 },\n  to = { x: 1, y: 1 },\n  fill = 'transparent',\n  className,\n  innerRef,\n  ...restProps\n}: AddSVGProps<LineProps, SVGLineElement>): JSX.Element => {\n  const isRectilinear = from.x === to.x || from.y === to.y;\n\n  return (\n    <line\n      ref={innerRef}\n      className={cx('visx-line', className)}\n      x1={from.x}\n      y1={from.y}\n      x2={to.x}\n      y2={to.y}\n      fill={fill}\n      shapeRendering={isRectilinear ? 'crispEdges' : 'auto'}\n      {...restProps}\n    />\n  );\n};\n"],"names":["ResponsiveSVG","width","children","origin","x","y","preserveAspectRatio","innerRef","className","adjustedHeight","Math","ceil","height","_jsx","style","position","overflow","viewBox","ref","DefaultStyle","display","flexDirection","flexGrow","flexShrink","flexBasis","transform","restProps","cx","from","to","fill","isRectilinear","x1","y1","x2","y2","shapeRendering","elementRef","scale","align","options","debounceDelay","optionsRest","rest","useParentSize","useEffect","current","Object","entries"],"mappings":"wkCAkBaA,EAAwC,gBAEnDC,IAAAA,MACAC,IAAAA,aACAC,OAAAA,aAAS,CAAEC,EAAG,EAAGC,EAAG,SACpBC,oBAAAA,aAAsB,kBACtBC,IAAAA,SACAC,IAAAA,UAIMC,EAAiBC,KAAKC,KAAKV,GAFlBA,IARfW,gBAaEC,6BACgB,wBACdC,MAAO,CACLC,SAAU,WACVC,SAAU,UACVJ,OAAQ,gBAGVC,aACEC,MAAO,CAAEE,SAAU,WACnBR,UAAWA,EACXF,oBAAqBA,EACrBW,kBAAYd,EAAOC,cAAKD,EAAOE,cAAKJ,cAASQ,GAC7CS,IAAKX,WAEJL,uGC9BIiB,EAA8B,CACzCC,QAAS,OACTC,cAAe,SACfC,SAAU,EACVC,WAAY,EACZC,UAAW,KACXR,SAAU,0HCNyB,oBACnCX,EAAAA,aAAI,QACJD,EAAAA,aAAI,IACJqB,IAAAA,UACAjB,IAAAA,UACAN,IAAAA,SACAK,IAAAA,SACGmB,wBAGDb,+BACEK,IAAKX,EACLC,UAAWmB,UAAG,aAAcnB,GAC5BiB,UAAWA,uBAA0BrB,eAAMC,QACvCqB,gBAEHxB,oBCnB4B,oBACjC0B,KAAAA,aAAO,CAAExB,EAAG,EAAGC,EAAG,SAClBwB,GAAAA,aAAK,CAAEzB,EAAG,EAAGC,EAAG,SAChByB,KAAAA,aAAO,gBACPtB,IAAAA,UACAD,IAAAA,SACGmB,iBAEGK,EAAgBH,EAAKxB,IAAMyB,EAAGzB,GAAKwB,EAAKvB,IAAMwB,EAAGxB,SAGrDQ,wBACEK,IAAKX,EACLC,UAAWmB,UAAG,YAAanB,GAC3BwB,GAAIJ,EAAKxB,EACT6B,GAAIL,EAAKvB,EACT6B,GAAIL,EAAGzB,EACP+B,GAAIN,EAAGxB,EACPyB,KAAMA,EACNM,eAAgBL,EAAgB,aAAe,QAC3CL,4CFPRW,IAAAA,WACAnC,IAAAA,aACAY,MAAAA,aAAQK,QACRmB,MAAAA,aAAQ,QACRC,MAAAA,aAAQ,aACRC,wBAAkD,MAAvCC,cAAAA,aAAgB,KAAOC,iBAC/BC,mBAEuBC,gBAAcP,aAAcI,cAAAA,GAAkBC,IAAhEzC,IAAAA,MAAOW,IAAAA,OAEfiC,aAAU,cACHR,EAAWS,sBAIWC,OAAOC,QAAQlC,kBAAQ,yBAEhDuB,EAAWS,QAAQhC,oBAEpB,CAACuB,EAAYvB,QAEVW,EACM,WAAVc,sBAAkCtC,EAAQ,cAAKW,EAAS,EAAI,sBAAa0B,4BAAyBA,cAGlGzB,MAACb,uBAAcC,MAAOA,EAAOW,OAAQA,GAAY+B,gBAC/C9B,WAAGY,UAAWA,WAAYvB"}
+{"version":3,"file":"index.js","sources":["../../src/components/ResponsiveSVG/ResponsiveSVG.tsx","../../src/components/ParentsizeSVG/ParentsizeSVG.tsx","../../src/components/Group/Group.tsx","../../src/components/Line/Line.tsx"],"sourcesContent":["import type { ReactNode, Ref } from 'react';\nimport type { PreserveAspectRatio } from '../../types/types';\n\nexport interface Point {\n  x: number;\n  y: number;\n}\n\nexport interface ResponsiveSVGProps {\n  width: number;\n  height: number;\n  origin?: Point;\n  preserveAspectRatio?: PreserveAspectRatio;\n  innerRef?: Ref<SVGSVGElement>;\n  className?: string;\n  hide?: boolean;\n  children: ReactNode;\n}\n\nexport function ResponsiveSVG({\n  height,\n  width,\n  children,\n  origin = { x: 0, y: 0 },\n  preserveAspectRatio = 'xMaxYMid meet',\n  innerRef,\n  className,\n}: ResponsiveSVGProps): JSX.Element {\n  const aspect = width / height;\n\n  const adjustedHeight = Math.ceil(width / aspect);\n\n  return (\n    <div\n      data-selector=\"cutting-svg-container\"\n      style={{\n        position: 'relative',\n        overflow: 'visible',\n        height: '1px',\n      }}\n    >\n      <svg\n        style={{ overflow: 'visible' }}\n        className={className}\n        preserveAspectRatio={preserveAspectRatio}\n        viewBox={`${origin.x} ${origin.y} ${width} ${adjustedHeight}`}\n        ref={innerRef}\n      >\n        {children}\n      </svg>\n    </div>\n  );\n}\n","import type { CSSProperties, PropsWithChildren, RefObject } from 'react';\nimport { useEffect } from 'react';\nimport type { UseParentSizeOptions } from '@cutting/use-get-parent-size';\nimport { useParentSize } from '@cutting/use-get-parent-size';\nimport type { ResponsiveSVGProps } from '../ResponsiveSVG/ResponsiveSVG';\nimport { ResponsiveSVG } from '../ResponsiveSVG/ResponsiveSVG';\n\ntype Align = 'none' | 'center';\n\nexport type ParentsizeSVGProps<E extends HTMLElement = HTMLElement> = {\n  elementRef: RefObject<E>;\n  style?: CSSProperties;\n  align?: Align;\n  scale?: number;\n  options?: Partial<UseParentSizeOptions>;\n} & Partial<Omit<ResponsiveSVGProps, 'innerRef' | 'height' | 'height'>>;\n\nexport const DefaultStyle: CSSProperties = {\n  display: 'flex',\n  flexDirection: 'column',\n  flexGrow: 1,\n  flexShrink: 1,\n  flexBasis: '0%',\n  overflow: 'hidden',\n} as const;\n\nexport function ParentsizeSVG<E extends HTMLElement>({\n  elementRef,\n  children,\n  style = DefaultStyle,\n  scale = 1,\n  align = 'none',\n  options: { debounceDelay = 50, ...optionsRest } = {},\n  ...rest\n}: PropsWithChildren<ParentsizeSVGProps<E>>): JSX.Element | null {\n  const { width, height } = useParentSize(elementRef, { debounceDelay, ...optionsRest });\n\n  useEffect(() => {\n    if (!elementRef.current) {\n      return;\n    }\n\n    for (const [key, value] of Object.entries(style)) {\n      // eslint-disable-next-line @typescript-eslint/no-explicit-any\n      elementRef.current.style[key as any] = value;\n    }\n  }, [elementRef, style]);\n\n  const transform =\n    align === 'center'\n      ? `translate(${width / 2},${height / 2 - 20}) scale(${scale})`\n      : `translate(0,0) scale(${scale})`;\n\n  return (\n    <ResponsiveSVG width={width} height={height} {...rest}>\n      <g transform={transform}>{children}</g>\n    </ResponsiveSVG>\n  );\n}\n","import cx from 'classnames';\n\ntype GroupOnlyProps = {\n  /** Top offset applied to `<g/>`. */\n  y?: number;\n  /** Left offset applied to `<g/>`. */\n  x?: number;\n  /** Override `x` and `y` to provide the entire `transform` string. */\n  transform?: string;\n  className?: string;\n  children?: React.ReactNode;\n  innerRef?: React.Ref<SVGGElement>;\n};\n\ntype GroupProps = GroupOnlyProps & Omit<React.SVGProps<SVGGElement>, keyof GroupOnlyProps>;\n\nexport function Group({\n  y = 0,\n  x = 0,\n  transform,\n  className,\n  children,\n  innerRef,\n  ...restProps\n}: GroupProps): JSX.Element {\n  return (\n    <g\n      ref={innerRef}\n      className={cx('visx-group', className)}\n      transform={transform || `translate(${x}, ${y})`}\n      {...restProps}\n    >\n      {children}\n    </g>\n  );\n}\n","import cx from 'classnames';\nimport type { AddSVGProps, Point } from '../../types/types';\n\nexport type LineProps = {\n  className?: string;\n  innerRef?: React.Ref<SVGLineElement>;\n  fill?: string;\n  /** Starting x,y point of the line. */\n  from?: Point;\n  /** Ending x,y point of the line. */\n  to?: Point;\n};\n\nexport function Line({\n  from = { x: 0, y: 0 },\n  to = { x: 1, y: 1 },\n  fill = 'transparent',\n  className,\n  innerRef,\n  ...restProps\n}: AddSVGProps<LineProps, SVGLineElement>): JSX.Element {\n  const isRectilinear = from.x === to.x || from.y === to.y;\n\n  return (\n    <line\n      ref={innerRef}\n      className={cx('visx-line', className)}\n      x1={from.x}\n      y1={from.y}\n      x2={to.x}\n      y2={to.y}\n      fill={fill}\n      shapeRendering={isRectilinear ? 'crispEdges' : 'auto'}\n      {...restProps}\n    />\n  );\n}\n"],"names":["ResponsiveSVG","_ref","height","width","children","_ref$origin","origin","x","y","_ref$preserveAspectRa","preserveAspectRatio","innerRef","className","adjustedHeight","Math","ceil","_jsx","style","position","overflow","viewBox","concat","ref","DefaultStyle","display","flexDirection","flexGrow","flexShrink","flexBasis","_ref$y","_ref$x","transform","restProps","_objectWithoutProperties","_excluded","_objectSpread","cx","_ref$from","from","_ref$to","to","_ref$fill","fill","isRectilinear","jsx","x1","y1","x2","y2","shapeRendering","elementRef","_ref$style","_ref$scale","scale","_ref$align","align","_ref$options","options","_ref$options$debounce","debounceDelay","optionsRest","rest","_excluded2","useParentSize","useEffect","current","_i","_Object$entries","Object","entries","length","_Object$entries$_i","_slicedToArray"],"mappings":"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"}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@cutting/svg",
-  "version": "4.31.8",
+  "version": "4.32.1",
   "repository": {
     "type": "git",
     "url": "https://github.com/dagda1/cuttingedge.git"
@@ -15,26 +15,28 @@
   "types": "dist/esm/index.d.ts",
   "license": "MIT",
   "dependencies": {
-    "@cutting/use-get-parent-size": "1.6.8",
-    "@cutting/util": "4.29.8",
+    "@cutting/use-get-parent-size": "1.6.11",
+    "@cutting/util": "4.31.1",
     "classnames": "^2.3.1",
     "resize-observer-polyfill": "^1.5.1"
   },
   "devDependencies": {
-    "@babel/runtime": "^7.17.2",
-    "@cutting/component-library": "5.4.13",
-    "@cutting/devtools": "4.31.8",
-    "@cutting/eslint-config": "4.28.5",
-    "@cutting/tsconfig": "4.26.4",
-    "@cutting/useful-types": "4.25.9",
-    "@vanilla-extract/babel-plugin": "^1.1.4",
-    "@vanilla-extract/css": "^1.6.8",
-    "@vanilla-extract/sprinkles": "^1.3.3",
-    "@testing-library/jest-dom": "^5.16.2",
-    "eslint": "^8.9.0",
-    "react": "^17.0.2",
-    "react-dom": "^17.0.2",
-    "typescript": "^4.5.5"
+    "@babel/runtime": "7.17.8",
+    "@cutting/component-library": "5.5.1",
+    "@cutting/devtools": "4.32.1",
+    "@cutting/eslint-config": "4.29.1",
+    "@cutting/tsconfig": "4.26.5",
+    "@cutting/useful-types": "4.25.10",
+    "@jest/globals": "27.5.1",
+    "@testing-library/jest-dom": "5.16.2",
+    "@testing-library/react": "^12.1.4",
+    "@vanilla-extract/babel-plugin": "1.1.5",
+    "@vanilla-extract/css": "1.6.8",
+    "@vanilla-extract/sprinkles": "1.4.0",
+    "eslint": "8.11.0",
+    "react": "17.0.2",
+    "react-dom": "17.0.2",
+    "typescript": "4.6.2"
   },
   "peerDependencies": {
     "react": ">= 17.x.x",
@@ -56,11 +58,11 @@
     }
   },
   "scripts": {
-    "build": "NODE_ENV=development cutting rollup",
+    "build": "NODE_ENV=production cutting rollup",
     "lint": "eslint ./src/**/*.{ts,tsx} --fix",
     "start": "PORT=8888 NODE_ENV=development cutting devserver-start",
     "test": "NODE_ENV=test cutting test",
     "test:ci": "CI=true pnpm test"
   },
-  "readme": "# @cutting/svg - reusable svg components for SVG documents\n[![npm version](https://img.shields.io/npm/v/@cutting/svg.svg)](https://www.npmjs.com/package/@cutting/svg)\n[![code style: prettier](https://img.shields.io/badge/code_style-prettier-ff69b4.svg)](https://github.com/prettier/prettier)\n\n## install \n\n```sh\npnpm add @cutting/svg\n\n# or\n\nnpm install @cutting/svg\n```\n\n## ParentsizeSVG\n\nA react component that will resize and scale to the dimensions of the supplied react [ref object](https://reactjs.org/docs/refs-and-the-dom.html).\n\n![svg document resizing to scale when using the ParentsizeSVG component](./img/sizer.gif)\n\nThe `ParentsizeSVG` component takes an `elementRef` prop that should point to a valid HTML DOM element.\n\n## usage\n\n```ts\nimport type { FC } from 'react';\nimport { useRef } from 'react';\nimport { ParentsizeSVG } from '@cutting/svg';\n\nexport const App: FC = () => {\n  const ref = useRef<HTMLDivElement>(null);\n\n  return (\n    <div className={styles.container} ref={ref}>\n      <ParentsizeSVG ref={ref}>\n        <rect\n          x=\"20%\"\n          y=\"20%\"\n          width={'50%'}\n          height={'50%'}\n          rx=\"20\"\n          style={{ fill: '#ff0000', stroke: '#000000', strokeWidth: '2px' }}\n        />\n      </ParentsizeSVG>\n    </div>\n  );\n};\n```"
+  "readme": "# @cutting/svg - reusable svg components for SVG documents\n[![npm version](https://img.shields.io/npm/v/@cutting/svg.svg)](https://www.npmjs.com/package/@cutting/svg)\n[![code style: prettier](https://img.shields.io/badge/code_style-prettier-ff69b4.svg)](https://github.com/prettier/prettier)\n\n## install \n\n```sh\npnpm add @cutting/svg\n\n# or\n\nnpm install @cutting/svg\n```\n\n## ParentsizeSVG\n\nA react component that will resize and scale to the dimensions of the supplied react [ref object](https://reactjs.org/docs/refs-and-the-dom.html).\n\n![svg document resizing to scale when using the ParentsizeSVG component](./img/sizer.gif)\n\nThe `ParentsizeSVG` component takes an `elementRef` prop that should point to a valid HTML DOM element.\n\n## usage\n\n```ts\nimport { useRef } from 'react';\nimport { ParentsizeSVG } from '@cutting/svg';\n\nexport function App(): JSX.Element {\n  const ref = useRef<HTMLDivElement>(null);\n\n  return (\n    <div className={styles.container} ref={ref}>\n      <ParentsizeSVG ref={ref}>\n        <rect\n          x=\"20%\"\n          y=\"20%\"\n          width={'50%'}\n          height={'50%'}\n          rx=\"20\"\n          style={{ fill: '#ff0000', stroke: '#000000', strokeWidth: '2px' }}\n        />\n      </ParentsizeSVG>\n    </div>\n  );\n};\n```"
 }

package/src/components/Group/Group.tsx

@@ -1,4 +1,3 @@
-import type { FC } from 'react';
 import cx from 'classnames';
 
 type GroupOnlyProps = {
@@ -15,7 +14,7 @@ type GroupOnlyProps = {
 
 type GroupProps = GroupOnlyProps & Omit<React.SVGProps<SVGGElement>, keyof GroupOnlyProps>;
 
-export const Group: FC<GroupProps> = ({
+export function Group({
   y = 0,
   x = 0,
   transform,
@@ -23,7 +22,7 @@ export const Group: FC<GroupProps> = ({
   children,
   innerRef,
   ...restProps
-}: GroupProps): JSX.Element => {
+}: GroupProps): JSX.Element {
   return (
     <g
       ref={innerRef}
@@ -34,4 +33,4 @@ export const Group: FC<GroupProps> = ({
       {children}
     </g>
   );
-};
+}

package/src/components/Line/Line.tsx

@@ -1,4 +1,3 @@
-import type { FC } from 'react';
 import cx from 'classnames';
 import type { AddSVGProps, Point } from '../../types/types';
 
@@ -12,14 +11,14 @@ export type LineProps = {
   to?: Point;
 };
 
-export const Line: FC<LineProps> = ({
+export function Line({
   from = { x: 0, y: 0 },
   to = { x: 1, y: 1 },
   fill = 'transparent',
   className,
   innerRef,
   ...restProps
-}: AddSVGProps<LineProps, SVGLineElement>): JSX.Element => {
+}: AddSVGProps<LineProps, SVGLineElement>): JSX.Element {
   const isRectilinear = from.x === to.x || from.y === to.y;
 
   return (
@@ -35,4 +34,4 @@ export const Line: FC<LineProps> = ({
       {...restProps}
     />
   );
-};
+}

package/src/components/ParentsizeSVG/ParentSizeSVG.test.tsx

@@ -1,22 +1,22 @@
 import { describe, it, expect } from '@jest/globals';
-import type { FC } from 'react';
 import { render, screen } from '@testing-library/react';
 import { useParentSize } from '@cutting/use-get-parent-size';
 import { useRef } from 'react';
+import type { ParentsizeSVGProps } from './ParentsizeSVG';
 import { ParentsizeSVG } from './ParentsizeSVG';
 
-const TestEr: FC = () => {
+function TestEr(props: Partial<ParentsizeSVGProps>) {
   const ref = useRef<HTMLDivElement>(null);
   useParentSize(ref);
 
   return (
-    <ParentsizeSVG elementRef={ref}>
+    <ParentsizeSVG {...props} elementRef={ref}>
       <rect x="20%" y="20%" width="200px" height="200px" rx="20" />
     </ParentsizeSVG>
   );
-};
+}
 
-const wrap = () => render(<TestEr />);
+const wrap = (props: Partial<ParentsizeSVGProps> = {}) => render(<TestEr {...props} />);
 
 describe('useParentSize', () => {
   it('should set the svg viewBox attribute', () => {
@@ -28,4 +28,20 @@ describe('useParentSize', () => {
 
     screen.getByTestId('cutting-svg-container');
   });
+
+  it('should render a transform attribute when not aligned', () => {
+    wrap();
+
+    const svg = document.querySelector('svg') as SVGElement;
+
+    expect(svg.querySelector('g') as SVGGElement).toHaveAttribute('transform', 'translate(0,0) scale(1)');
+  });
+
+  it('should render a transform attribute when aligned', () => {
+    wrap({ align: 'center' });
+
+    const svg = document.querySelector('svg') as SVGElement;
+
+    expect(svg.querySelector('g') as SVGGElement).toHaveAttribute('transform', 'translate(0.5,-19.5) scale(1)');
+  });
 });

package/src/components/ParentsizeSVG/ParentsizeSVG.tsx

@@ -7,7 +7,7 @@ import { ResponsiveSVG } from '../ResponsiveSVG/ResponsiveSVG';
 
 type Align = 'none' | 'center';
 
-export type ParentsizeSVGProps<E extends HTMLElement> = {
+export type ParentsizeSVGProps<E extends HTMLElement = HTMLElement> = {
   elementRef: RefObject<E>;
   style?: CSSProperties;
   align?: Align;
@@ -47,7 +47,9 @@ export function ParentsizeSVG<E extends HTMLElement>({
   }, [elementRef, style]);
 
   const transform =
-    align === 'center' ? `translate(${width / 2},${height / 2 - 20}) scale(${scale})` : `0,0) scale(${scale})`;
+    align === 'center'
+      ? `translate(${width / 2},${height / 2 - 20}) scale(${scale})`
+      : `translate(0,0) scale(${scale})`;
 
   return (
     <ResponsiveSVG width={width} height={height} {...rest}>

package/src/components/ResponsiveSVG/ResponsiveSVG.test.tsx

@@ -1,5 +1,4 @@
 import { describe, it, expect, jest } from '@jest/globals';
-import type { FC } from 'react';
 import { render, screen } from '@testing-library/react';
 import { useParentSize } from '@cutting/use-get-parent-size';
 import { useRef } from 'react';
@@ -18,7 +17,7 @@ const resize = (width: number, height: number): void => {
   });
 };
 
-const TestEr: FC = () => {
+function TestEr(): JSX.Element {
   const ref = useRef<HTMLDivElement>(null);
   const { width, height } = useParentSize(ref);
 
@@ -29,7 +28,7 @@ const TestEr: FC = () => {
       </ResponsiveSVG>
     </div>
   );
-};
+}
 
 const wrap = () => render(<TestEr />);
 

package/src/components/ResponsiveSVG/ResponsiveSVG.tsx

@@ -1,4 +1,4 @@
-import type { FC, Ref } from 'react';
+import type { ReactNode, Ref } from 'react';
 import type { PreserveAspectRatio } from '../../types/types';
 
 export interface Point {
@@ -14,9 +14,10 @@ export interface ResponsiveSVGProps {
   innerRef?: Ref<SVGSVGElement>;
   className?: string;
   hide?: boolean;
+  children: ReactNode;
 }
 
-export const ResponsiveSVG: FC<ResponsiveSVGProps> = ({
+export function ResponsiveSVG({
   height,
   width,
   children,
@@ -24,7 +25,7 @@ export const ResponsiveSVG: FC<ResponsiveSVGProps> = ({
   preserveAspectRatio = 'xMaxYMid meet',
   innerRef,
   className,
-}) => {
+}: ResponsiveSVGProps): JSX.Element {
   const aspect = width / height;
 
   const adjustedHeight = Math.ceil(width / aspect);
@@ -49,4 +50,4 @@ export const ResponsiveSVG: FC<ResponsiveSVGProps> = ({
       </svg>
     </div>
   );
-};
+}