@lincle/react-web-minimap 0.4.0-next.7 → 0.4.0-next.9

package/dist/MiniMap/index.js

@@ -8,12 +8,17 @@ const MiniMapPlain_1 = __importDefault(require("../MiniMapPlain"));
 const react_1 = require("react");
 const react_resize_detector_1 = require("react-resize-detector");
 const displayName = 'LincleMiniMap';
-const MiniMap = ({ gutter, height, node, width }) => {
+const MiniMap = ({ className: givenClassname, gutter, height, node, style, width }) => {
     const { height: lincleHeight = 0, ref, width: lincleWidth = 0 } = (0, react_resize_detector_1.useResizeDetector)({
         refreshMode: 'debounce',
         refreshRate: 16
     });
-    return ((0, jsx_runtime_1.jsx)("div", { className: 'lincle-minimap', ref: ref, children: (0, jsx_runtime_1.jsx)(MiniMapPlain_1.default, { className: 'lincle-minimap-container', gutter: gutter, height: height, lincleHeight: lincleHeight, lincleWidth: lincleWidth, node: node, width: width }) }));
+    const className = (0, react_1.useMemo)(() => {
+        return `lincle-minimap ${givenClassname}`;
+    }, [
+        givenClassname
+    ]);
+    return ((0, jsx_runtime_1.jsx)("div", { className: className, ref: ref, style: style, children: (0, jsx_runtime_1.jsx)(MiniMapPlain_1.default, { className: 'lincle-minimap-container', gutter: gutter, height: height, lincleHeight: lincleHeight, lincleWidth: lincleWidth, node: node, width: width }) }));
 };
 MiniMap.displayName = displayName;
 exports.default = (0, react_1.memo)(MiniMap);

package/dist/MiniMapPlain/index.js

@@ -7,8 +7,8 @@ const jsx_runtime_1 = require("react/jsx-runtime");
 const MiniMapNode_1 = __importDefault(require("../MiniMapNode"));
 const react_web_interactive_1 = require("@lincle/react-web-interactive");
 const react_1 = require("react");
-const displayName = 'LincleMiniMap';
-const MiniMap = ({ className, gutter: givenGutter = 8, height: givenMapHeight, lincleHeight = 0, lincleWidth = 0, node: nodeFunction, width: givenMapWidth }) => {
+const displayName = 'LincleMiniMapPlain';
+const MiniMapPlain = ({ className, gutter: givenGutter = 8, height: givenMapHeight, lincleHeight = 0, lincleWidth = 0, node: nodeFunction, width: givenMapWidth }) => {
     const nodePositions = (0, react_web_interactive_1.useNodePositions)();
     const { x: translateX, y: translateY } = (0, react_web_interactive_1.useTranslate)();
     const scale = (0, react_web_interactive_1.useScale)();
@@ -142,5 +142,5 @@ const MiniMap = ({ className, gutter: givenGutter = 8, height: givenMapHeight, l
         null :
         ((0, jsx_runtime_1.jsxs)("svg", { className: `lincle-minimap-svg ${className}`, height: map.height, viewBox: viewBox, width: map.width, children: [Nodes, (0, jsx_runtime_1.jsx)("path", { d: d, fill: 'rgba(238, 238, 238, 0.65)', fillRule: 'evenodd' })] }));
 };
-MiniMap.displayName = displayName;
-exports.default = (0, react_1.memo)(MiniMap);
+MiniMapPlain.displayName = displayName;
+exports.default = (0, react_1.memo)(MiniMapPlain);

package/dist/styles.g.css

@@ -7,7 +7,7 @@
 .lincle-minimap-container {
 	position: absolute;
 	right: 16px;
-	bottom: 32px;
+	bottom: 16px;
 }
 
 .lincle-minimap-pad {

package/dist/types.d.ts

@@ -1,20 +1,22 @@
 import { type Dimensions, type Shape } from '@lincle/react-shared';
-import { type ReactElement } from 'react';
+import { type CSSProperties, type ReactElement } from 'react';
 export type MiniMapProps = {
-    gutter?: number;
-    height?: number;
-    node?: (dimensions: Dimensions) => ReactElement;
-    width?: number;
+    readonly className?: string;
+    readonly gutter?: number;
+    readonly height?: number;
+    readonly node?: (dimensions: Dimensions) => ReactElement;
+    readonly style?: CSSProperties;
+    readonly width?: number;
 };
 export type MiniMapPlainProps = MiniMapProps & {
-    className: string;
-    lincleHeight: number;
-    lincleWidth: number;
+    readonly className: string;
+    readonly lincleHeight: number;
+    readonly lincleWidth: number;
 };
 export type MiniMapNodeProps = {
-    height: number;
-    shape?: Shape;
-    width: number;
-    x: number;
-    y: number;
+    readonly height: number;
+    readonly shape?: Shape;
+    readonly width: number;
+    readonly x: number;
+    readonly y: number;
 };

package/package.json

@@ -2,7 +2,7 @@
 	"name": "@lincle/react-web-minimap",
 	"title": "lincle react web minimap",
 	"license": "LGPL-3.0-or-later",
-	"version": "0.4.0-next.7",
+	"version": "0.4.0-next.9",
 	"private": false,
 	"description": "A 'reactive' React node and edge generator",
 	"author": "wallzero @wallzeroblog (http://wallzero.com)",
@@ -68,8 +68,8 @@
 		"rimraf": "^6.0.1"
 	},
 	"dependencies": {
-		"@lincle/react-shared": "^0.4.0-next.7",
-		"@lincle/react-web-interactive": "^0.4.0-next.7",
+		"@lincle/react-shared": "^0.4.0-next.9",
+		"@lincle/react-web-interactive": "^0.4.0-next.9",
 		"react-resize-detector": "^11.0.1"
 	},
 	"peerDependencies": {
@@ -91,5 +91,5 @@
 		"acyclical graph",
 		"cyclical graph"
 	],
-	"gitHead": "4457d7dd7df752f71d0559c5db389177a008252e"
+	"gitHead": "d7fa7e864236834436e54af196d3836e9c46ab23"
 }