@trackunit/react-map 0.2.26 → 0.2.28

package/index.cjs.js

@@ -1804,19 +1804,23 @@ const Button = ({ config, overlaySide = undefined, resolved }) => {
  * @internal
  */
 const Custom = ({ config, overlaySide = undefined, resolved, placement }) => {
-    if (!resolved.visible) {
+    const { autoTooltip, label, render } = config;
+    // ControlRenderer passes a new `resolved` ref each Controls pass — keep the last deep-equal value.
+    const [prevResolved, setPrevResolved] = react.useState(resolved);
+    const stableResolved = resolved !== prevResolved && !esToolkit.isEqual(resolved, prevResolved) ? resolved : prevResolved;
+    if (stableResolved !== prevResolved) {
+        setPrevResolved(stableResolved);
+    }
+    // Skip re-calling `render` when only the `resolved` object reference changed, or when the control is not visible.
+    const content = react.useMemo(() => (stableResolved.visible ? render({ resolved: stableResolved, placement }) : null), [placement, render, stableResolved]);
+    if (!stableResolved.visible) {
         return null;
     }
-    const context = {
-        resolved,
-        placement,
-    };
-    const content = config.render(context);
     // `Tooltip` uses Radix `Slot`, which forwards props (refs, data-testid) onto its child.
     // A Fragment cannot accept those props — use an inert wrapper with `contents` layout.
     const wrapped = jsxRuntime.jsx("span", { className: "contents", children: content });
-    const useStandaloneTooltip = placement === "standalone" && (config.autoTooltip ?? "standalone") === "standalone";
-    return useStandaloneTooltip ? (jsxRuntime.jsx(reactComponents.Tooltip, { delayed: true, label: config.label, placement: overlaySide === "right" ? RIGHT_CONTROL_TOOLTIP_PLACEMENT : undefined, children: wrapped })) : (wrapped);
+    const useStandaloneTooltip = placement === "standalone" && (autoTooltip ?? "standalone") === "standalone";
+    return useStandaloneTooltip ? (jsxRuntime.jsx(reactComponents.Tooltip, { delayed: true, label: label, placement: overlaySide === "right" ? RIGHT_CONTROL_TOOLTIP_PLACEMENT : undefined, children: wrapped })) : (wrapped);
 };
 
 /** Shared padding for interactive menu items (button, toggle, stepper, select, radioGroup). */

package/index.esm.js

@@ -1803,19 +1803,23 @@ const Button = ({ config, overlaySide = undefined, resolved }) => {
  * @internal
  */
 const Custom = ({ config, overlaySide = undefined, resolved, placement }) => {
-    if (!resolved.visible) {
+    const { autoTooltip, label, render } = config;
+    // ControlRenderer passes a new `resolved` ref each Controls pass — keep the last deep-equal value.
+    const [prevResolved, setPrevResolved] = useState(resolved);
+    const stableResolved = resolved !== prevResolved && !isEqual(resolved, prevResolved) ? resolved : prevResolved;
+    if (stableResolved !== prevResolved) {
+        setPrevResolved(stableResolved);
+    }
+    // Skip re-calling `render` when only the `resolved` object reference changed, or when the control is not visible.
+    const content = useMemo(() => (stableResolved.visible ? render({ resolved: stableResolved, placement }) : null), [placement, render, stableResolved]);
+    if (!stableResolved.visible) {
         return null;
     }
-    const context = {
-        resolved,
-        placement,
-    };
-    const content = config.render(context);
     // `Tooltip` uses Radix `Slot`, which forwards props (refs, data-testid) onto its child.
     // A Fragment cannot accept those props — use an inert wrapper with `contents` layout.
     const wrapped = jsx("span", { className: "contents", children: content });
-    const useStandaloneTooltip = placement === "standalone" && (config.autoTooltip ?? "standalone") === "standalone";
-    return useStandaloneTooltip ? (jsx(Tooltip, { delayed: true, label: config.label, placement: overlaySide === "right" ? RIGHT_CONTROL_TOOLTIP_PLACEMENT : undefined, children: wrapped })) : (wrapped);
+    const useStandaloneTooltip = placement === "standalone" && (autoTooltip ?? "standalone") === "standalone";
+    return useStandaloneTooltip ? (jsx(Tooltip, { delayed: true, label: label, placement: overlaySide === "right" ? RIGHT_CONTROL_TOOLTIP_PLACEMENT : undefined, children: wrapped })) : (wrapped);
 };
 
 /** Shared padding for interactive menu items (button, toggle, stepper, select, radioGroup). */

package/package.json

@@ -1,22 +1,22 @@
 {
   "name": "@trackunit/react-map",
-  "version": "0.2.26",
+  "version": "0.2.28",
   "repository": "https://github.com/Trackunit/manager",
   "license": "SEE LICENSE IN LICENSE.txt",
   "engines": {
     "node": ">=24.x"
   },
   "dependencies": {
-    "@trackunit/react-components": "2.2.22",
-    "@trackunit/css-class-variance-utilities": "1.13.79",
-    "@trackunit/react-form-components": "2.2.23",
-    "@trackunit/react-core-hooks": "1.18.20",
-    "@trackunit/geo-json-utils": "1.14.82",
-    "@trackunit/i18n-library-translation": "2.1.20",
+    "@trackunit/react-components": "2.2.23",
+    "@trackunit/css-class-variance-utilities": "1.13.80",
+    "@trackunit/react-form-components": "2.2.24",
+    "@trackunit/react-core-hooks": "1.18.21",
+    "@trackunit/geo-json-utils": "1.14.83",
+    "@trackunit/i18n-library-translation": "2.1.21",
     "react-minimal-pie-chart": "^8.4.0",
-    "@trackunit/react-map-adapter-shared": "0.0.63",
-    "@trackunit/react-map-color-utils": "0.0.48",
-    "@trackunit/ui-design-tokens": "1.13.78",
+    "@trackunit/react-map-adapter-shared": "0.0.64",
+    "@trackunit/react-map-color-utils": "0.0.49",
+    "@trackunit/ui-design-tokens": "1.13.79",
     "@floating-ui/react": "^0.26.25",
     "es-toolkit": "^1.39.10",
     "tailwind-merge": "^2.0.0",