@industry-theme/principal-view-panels 0.12.110 → 0.12.112

package/dist/panels.bundle.js

@@ -86784,17 +86784,6 @@ function useNodeBehavior(options) {
     handleResizeEnd
   };
 }
-function hexToLightColor$5(hexColor, lightness = 0.88) {
-  const hex2 = hexColor.replace("#", "");
-  const r2 = parseInt(hex2.substring(0, 2), 16);
-  const g = parseInt(hex2.substring(2, 4), 16);
-  const b = parseInt(hex2.substring(4, 6), 16);
-  const newR = Math.round(r2 + (255 - r2) * lightness);
-  const newG = Math.round(g + (255 - g) * lightness);
-  const newB = Math.round(b + (255 - b) * lightness);
-  const toHex = (n) => n.toString(16).padStart(2, "0");
-  return `#${toHex(newR)}${toHex(newG)}${toHex(newB)}`;
-}
 const OtelSpanConventionNode = ({ data, selected: selected2, dragging }) => {
   var _a2, _b2, _c, _d;
   const { theme: theme2 } = useTheme();
@@ -86863,7 +86852,7 @@ const OtelSpanConventionNode = ({ data, selected: selected2, dragging }) => {
     right: hexagonBorderWidth,
     bottom: hexagonBorderWidth,
     clipPath: hexagonClipPath,
-    backgroundColor: hexToLightColor$5(fillColor),
+    backgroundColor: fillColor,
     color: "#000",
     display: "flex",
     flexDirection: "column",
@@ -86898,17 +86887,6 @@ const OtelSpanConventionNode = ({ data, selected: selected2, dragging }) => {
     transition: "box-shadow 0.2s ease"
   }, onMouseDown: handleMouseDown, onMouseEnter: handleMouseEnter, onMouseLeave: handleMouseLeave, children: [jsx(NodeBadges, { shape: "hexagon", status, sourceFiles, references, opacity: nodeOpacity }), jsx("div", { style: hexagonBorderStyle, className: getAnimationClass(), children: jsx("div", { style: hexagonInnerStyle, children: jsx(NodeContent, { displayName, identifier: identifier2, icon, state, stateDefinitions, hasViolations, workflowChips, onWorkflowChipClick, selectedWorkflowId }) }) }), tooltipsEnabled && jsx(NodeTooltip, { description, otel: nodeData.otel, sources: nodeData.sources, references, visible: showTooltip, nodeRef })] }), jsx(Handle, { type: "source", position: Position.Top, id: "top-out", style: handleStyle }), jsx(Handle, { type: "source", position: Position.Bottom, id: "bottom-out", style: handleStyle }), jsx(Handle, { type: "source", position: Position.Left, id: "left-out", style: handleStyle }), jsx(Handle, { type: "source", position: Position.Right, id: "right-out", style: handleStyle })] });
 };
-function hexToLightColor$4(hexColor, lightness = 0.88) {
-  const hex2 = hexColor.replace("#", "");
-  const r2 = parseInt(hex2.substring(0, 2), 16);
-  const g = parseInt(hex2.substring(2, 4), 16);
-  const b = parseInt(hex2.substring(4, 6), 16);
-  const newR = Math.round(r2 + (255 - r2) * lightness);
-  const newG = Math.round(g + (255 - g) * lightness);
-  const newB = Math.round(b + (255 - b) * lightness);
-  const toHex = (n) => n.toString(16).padStart(2, "0");
-  return `#${toHex(newR)}${toHex(newG)}${toHex(newB)}`;
-}
 const OtelEventNode = ({ data, selected: selected2, dragging }) => {
   var _a2, _b2, _c;
   const { theme: theme2 } = useTheme();
@@ -86918,8 +86896,7 @@ const OtelEventNode = ({ data, selected: selected2, dragging }) => {
   const nodeOpacity = isHidden ? 0.4 : isActive ? 1 : 0.1;
   const scopeColor = nodeData.scopeColor;
   const spanColor = nodeData.spanColor;
-  const nodeDataColor = nodeData.color;
-  const baseFillColor = nodeDataColor || scopeColor || typeDefinition.color || "#3b82f6";
+  const baseFillColor = scopeColor || typeDefinition.color || "#3b82f6";
   const fillColor = baseFillColor;
   const nodeDataStroke = nodeData.stroke;
   const strokeColor = nodeDataStroke || spanColor || fillColor;
@@ -86949,7 +86926,7 @@ const OtelEventNode = ({ data, selected: selected2, dragging }) => {
   const borderStyle = status === "draft" ? "dotted" : status === "approved" ? "dashed" : "solid";
   const rectangleStyle = {
     padding: "12px 16px",
-    backgroundColor: hexToLightColor$4(fillColor),
+    backgroundColor: fillColor,
     color: "#000",
     border: `2px ${borderStyle} ${hasViolations ? "#D0021B" : strokeColor}`,
     fontSize: theme2.fontSizes[0],
@@ -86974,17 +86951,6 @@ const OtelEventNode = ({ data, selected: selected2, dragging }) => {
   const handleStyle = editable ? { background: fillColor, width: 12, height: 12, border: "2px solid white", boxShadow: "0 0 0 1px " + fillColor } : { background: fillColor, width: 8, height: 8, opacity: 0, pointerEvents: "none" };
   return jsxs(Fragment, { children: [editable && jsx(NodeResizer, { color: strokeColor, isVisible: selected2, minWidth: 40, minHeight: 30, onResizeEnd: handleResizeEnd, handleStyle: { width: 8, height: 8, borderRadius: 2, zIndex: 20 }, lineStyle: { borderWidth: 1, zIndex: 20 } }), jsx(Handle, { type: "target", position: Position.Top, id: "top", style: handleStyle }), jsx(Handle, { type: "target", position: Position.Bottom, id: "bottom", style: handleStyle }), jsx(Handle, { type: "target", position: Position.Left, id: "left", style: handleStyle }), jsx(Handle, { type: "target", position: Position.Right, id: "right", style: handleStyle }), jsxs("div", { ref: nodeRef, style: { position: "relative", width: "100%", height: "100%" }, onMouseDown: handleMouseDown, onMouseEnter: handleMouseEnter, onMouseLeave: handleMouseLeave, children: [jsx(NodeBadges, { shape: "rectangle", status, sourceFiles, references, opacity: nodeOpacity }), jsx("div", { style: rectangleStyle, className: getAnimationClass(), children: jsx(NodeContent, { displayName, identifier: identifier2, icon, state, stateDefinitions, hasViolations }) }), tooltipsEnabled && jsx(NodeTooltip, { description, otel: nodeData.otel, sources: nodeData.sources, references, visible: showTooltip, nodeRef })] }), jsx(Handle, { type: "source", position: Position.Top, id: "top-out", style: handleStyle }), jsx(Handle, { type: "source", position: Position.Bottom, id: "bottom-out", style: handleStyle }), jsx(Handle, { type: "source", position: Position.Left, id: "left-out", style: handleStyle }), jsx(Handle, { type: "source", position: Position.Right, id: "right-out", style: handleStyle })] });
 };
-function hexToLightColor$3(hexColor, lightness = 0.88) {
-  const hex2 = hexColor.replace("#", "");
-  const r2 = parseInt(hex2.substring(0, 2), 16);
-  const g = parseInt(hex2.substring(2, 4), 16);
-  const b = parseInt(hex2.substring(4, 6), 16);
-  const newR = Math.round(r2 + (255 - r2) * lightness);
-  const newG = Math.round(g + (255 - g) * lightness);
-  const newB = Math.round(b + (255 - b) * lightness);
-  const toHex = (n) => n.toString(16).padStart(2, "0");
-  return `#${toHex(newR)}${toHex(newG)}${toHex(newB)}`;
-}
 const OtelScopeNode = ({ data, selected: selected2, dragging }) => {
   var _a2, _b2;
   const { theme: theme2 } = useTheme();
@@ -87025,7 +86991,7 @@ const OtelScopeNode = ({ data, selected: selected2, dragging }) => {
   const borderStyle = status === "draft" ? "dotted" : status === "approved" ? "dashed" : "solid";
   const circleStyle = {
     padding: "8px",
-    backgroundColor: hexToLightColor$3(fillColor),
+    backgroundColor: fillColor,
     color: "#000",
     border: `2px ${borderStyle} ${hasViolations ? "#D0021B" : strokeColor}`,
     fontSize: theme2.fontSizes[0],
@@ -87045,22 +87011,11 @@ const OtelScopeNode = ({ data, selected: selected2, dragging }) => {
     transition: "box-shadow 0.2s ease, opacity 0.3s ease",
     animationDuration: animationType ? `${animationDuration}ms` : void 0,
     boxSizing: "border-box",
-    borderRadius: "50%"
+    borderRadius: "12px"
   };
   const handleStyle = editable ? { background: fillColor, width: 12, height: 12, border: "2px solid white", boxShadow: "0 0 0 1px " + fillColor } : { background: fillColor, width: 8, height: 8, opacity: 0, pointerEvents: "none" };
-  return jsxs(Fragment, { children: [editable && jsx(NodeResizer, { color: strokeColor, isVisible: selected2, minWidth: 40, minHeight: 40, keepAspectRatio: true, onResizeEnd: handleResizeEnd, handleStyle: { width: 8, height: 8, borderRadius: 2, zIndex: 20 }, lineStyle: { borderWidth: 1, zIndex: 20 } }), jsx(Handle, { type: "target", position: Position.Top, id: "top", style: handleStyle }), jsx(Handle, { type: "target", position: Position.Bottom, id: "bottom", style: handleStyle }), jsx(Handle, { type: "target", position: Position.Left, id: "left", style: handleStyle }), jsx(Handle, { type: "target", position: Position.Right, id: "right", style: handleStyle }), jsxs("div", { ref: nodeRef, style: { position: "relative", width: "100%", height: "100%" }, onMouseDown: handleMouseDown, onMouseEnter: handleMouseEnter, onMouseLeave: handleMouseLeave, children: [jsx(NodeBadges, { shape: "circle", status, sourceFiles, references, opacity: nodeOpacity }), jsx("div", { style: circleStyle, className: getAnimationClass(), children: jsx(NodeContent, { displayName, identifier: identifier2, icon, state, stateDefinitions, hasViolations }) }), tooltipsEnabled && jsx(NodeTooltip, { description, otel: nodeData.otel, sources: nodeData.sources, references, visible: showTooltip, nodeRef })] }), jsx(Handle, { type: "source", position: Position.Top, id: "top-out", style: handleStyle }), jsx(Handle, { type: "source", position: Position.Bottom, id: "bottom-out", style: handleStyle }), jsx(Handle, { type: "source", position: Position.Left, id: "left-out", style: handleStyle }), jsx(Handle, { type: "source", position: Position.Right, id: "right-out", style: handleStyle })] });
+  return jsxs(Fragment, { children: [editable && jsx(NodeResizer, { color: strokeColor, isVisible: selected2, minWidth: 40, minHeight: 40, keepAspectRatio: false, onResizeEnd: handleResizeEnd, handleStyle: { width: 8, height: 8, borderRadius: 2, zIndex: 20 }, lineStyle: { borderWidth: 1, zIndex: 20 } }), jsx(Handle, { type: "target", position: Position.Top, id: "top", style: handleStyle }), jsx(Handle, { type: "target", position: Position.Bottom, id: "bottom", style: handleStyle }), jsx(Handle, { type: "target", position: Position.Left, id: "left", style: handleStyle }), jsx(Handle, { type: "target", position: Position.Right, id: "right", style: handleStyle }), jsxs("div", { ref: nodeRef, style: { position: "relative", width: "100%", height: "100%" }, onMouseDown: handleMouseDown, onMouseEnter: handleMouseEnter, onMouseLeave: handleMouseLeave, children: [jsx(NodeBadges, { shape: "rectangle", status, sourceFiles, references, opacity: nodeOpacity }), jsx("div", { style: circleStyle, className: getAnimationClass(), children: jsx(NodeContent, { displayName, identifier: identifier2, icon, state, stateDefinitions, hasViolations }) }), tooltipsEnabled && jsx(NodeTooltip, { description, otel: nodeData.otel, sources: nodeData.sources, references, visible: showTooltip, nodeRef })] }), jsx(Handle, { type: "source", position: Position.Top, id: "top-out", style: handleStyle }), jsx(Handle, { type: "source", position: Position.Bottom, id: "bottom-out", style: handleStyle }), jsx(Handle, { type: "source", position: Position.Left, id: "left-out", style: handleStyle }), jsx(Handle, { type: "source", position: Position.Right, id: "right-out", style: handleStyle })] });
 };
-function hexToLightColor$2(hexColor, lightness = 0.88) {
-  const hex2 = hexColor.replace("#", "");
-  const r2 = parseInt(hex2.substring(0, 2), 16);
-  const g = parseInt(hex2.substring(2, 4), 16);
-  const b = parseInt(hex2.substring(4, 6), 16);
-  const newR = Math.round(r2 + (255 - r2) * lightness);
-  const newG = Math.round(g + (255 - g) * lightness);
-  const newB = Math.round(b + (255 - b) * lightness);
-  const toHex = (n) => n.toString(16).padStart(2, "0");
-  return `#${toHex(newR)}${toHex(newG)}${toHex(newB)}`;
-}
 const OtelResourceNode = ({ data, selected: selected2, dragging }) => {
   var _a2, _b2;
   const { theme: theme2 } = useTheme();
@@ -87127,7 +87082,7 @@ const OtelResourceNode = ({ data, selected: selected2, dragging }) => {
     right: diamondBorderWidth,
     bottom: diamondBorderWidth,
     clipPath: diamondClipPath,
-    backgroundColor: hexToLightColor$2(fillColor),
+    backgroundColor: fillColor,
     color: "#000",
     display: "flex",
     flexDirection: "column",
@@ -87148,17 +87103,6 @@ const OtelResourceNode = ({ data, selected: selected2, dragging }) => {
     transition: "box-shadow 0.2s ease"
   }, onMouseDown: handleMouseDown, onMouseEnter: handleMouseEnter, onMouseLeave: handleMouseLeave, children: [jsx(NodeBadges, { shape: "diamond", status, sourceFiles, references, opacity: nodeOpacity }), jsx("div", { style: diamondBorderStyle, className: getAnimationClass(), children: jsx("div", { style: diamondInnerStyle, children: jsx(NodeContent, { displayName, identifier: identifier2, icon, state, stateDefinitions, hasViolations }) }) }), tooltipsEnabled && jsx(NodeTooltip, { description, otel: nodeData.otel, sources: nodeData.sources, references, visible: showTooltip, nodeRef })] }), jsx(Handle, { type: "source", position: Position.Top, id: "top-out", style: handleStyle }), jsx(Handle, { type: "source", position: Position.Bottom, id: "bottom-out", style: handleStyle }), jsx(Handle, { type: "source", position: Position.Left, id: "left-out", style: handleStyle }), jsx(Handle, { type: "source", position: Position.Right, id: "right-out", style: handleStyle })] });
 };
-function hexToLightColor$1(hexColor, lightness = 0.88) {
-  const hex2 = hexColor.replace("#", "");
-  const r2 = parseInt(hex2.substring(0, 2), 16);
-  const g = parseInt(hex2.substring(2, 4), 16);
-  const b = parseInt(hex2.substring(4, 6), 16);
-  const newR = Math.round(r2 + (255 - r2) * lightness);
-  const newG = Math.round(g + (255 - g) * lightness);
-  const newB = Math.round(b + (255 - b) * lightness);
-  const toHex = (n) => n.toString(16).padStart(2, "0");
-  return `#${toHex(newR)}${toHex(newG)}${toHex(newB)}`;
-}
 const OtelBoundaryNode = ({ data, selected: selected2, dragging }) => {
   var _a2, _b2, _c;
   const { theme: theme2 } = useTheme();
@@ -87199,7 +87143,7 @@ const OtelBoundaryNode = ({ data, selected: selected2, dragging }) => {
   const borderStyle = status === "draft" ? "dotted" : status === "approved" ? "dashed" : "solid";
   const boundaryStyle = {
     padding: "12px 16px",
-    backgroundColor: hexToLightColor$1(fillColor),
+    backgroundColor: fillColor,
     color: "#000",
     border: `2px ${borderStyle} ${hasViolations ? "#D0021B" : strokeColor}`,
     fontSize: theme2.fontSizes[0],
@@ -87225,17 +87169,6 @@ const OtelBoundaryNode = ({ data, selected: selected2, dragging }) => {
   const handleStyle = editable ? { background: fillColor, width: 12, height: 12, border: "2px solid white", boxShadow: "0 0 0 1px " + fillColor } : { background: fillColor, width: 8, height: 8, opacity: 0, pointerEvents: "none" };
   return jsxs(Fragment, { children: [editable && jsx(NodeResizer, { color: strokeColor, isVisible: selected2, minWidth: 40, minHeight: 30, onResizeEnd: handleResizeEnd, handleStyle: { width: 8, height: 8, borderRadius: 2, zIndex: 20 }, lineStyle: { borderWidth: 1, zIndex: 20 } }), jsx(Handle, { type: "target", position: Position.Top, id: "top", style: handleStyle }), jsx(Handle, { type: "target", position: Position.Bottom, id: "bottom", style: handleStyle }), jsx(Handle, { type: "target", position: Position.Left, id: "left", style: handleStyle }), jsx(Handle, { type: "target", position: Position.Right, id: "right", style: handleStyle }), jsxs("div", { ref: nodeRef, style: { position: "relative", width: "100%", height: "100%" }, onMouseDown: handleMouseDown, onMouseEnter: handleMouseEnter, onMouseLeave: handleMouseLeave, children: [jsx(NodeBadges, { shape: "rectangle", status, sourceFiles, references, boundary: boundaryData, opacity: nodeOpacity }), jsx("div", { style: boundaryStyle, className: getAnimationClass(), children: jsx(NodeContent, { displayName, identifier: identifier2, icon, state, stateDefinitions, hasViolations }) }), tooltipsEnabled && jsx(NodeTooltip, { description, otel: nodeData.otel, sources: nodeData.sources, references, visible: showTooltip, nodeRef })] }), jsx(Handle, { type: "source", position: Position.Top, id: "top-out", style: handleStyle }), jsx(Handle, { type: "source", position: Position.Bottom, id: "bottom-out", style: handleStyle }), jsx(Handle, { type: "source", position: Position.Left, id: "left-out", style: handleStyle }), jsx(Handle, { type: "source", position: Position.Right, id: "right-out", style: handleStyle })] });
 };
-function hexToLightColor(hexColor, lightness = 0.88) {
-  const hex2 = hexColor.replace("#", "");
-  const r2 = parseInt(hex2.substring(0, 2), 16);
-  const g = parseInt(hex2.substring(2, 4), 16);
-  const b = parseInt(hex2.substring(4, 6), 16);
-  const newR = Math.round(r2 + (255 - r2) * lightness);
-  const newG = Math.round(g + (255 - g) * lightness);
-  const newB = Math.round(b + (255 - b) * lightness);
-  const toHex = (n) => n.toString(16).padStart(2, "0");
-  return `#${toHex(newR)}${toHex(newG)}${toHex(newB)}`;
-}
 const CustomNode = (props) => {
   var _a2, _b2, _c, _d, _e4, _f, _g, _h, _i, _j, _k, _l, _m, _n, _o, _p;
   const { data, selected: selected2, dragging } = props;
@@ -87561,7 +87494,7 @@ const CustomNode = (props) => {
     const borderStyle = status === "draft" ? "dotted" : status === "approved" ? "dashed" : "solid";
     const baseStyles = {
       padding: "12px 16px",
-      backgroundColor: isGroup ? "rgba(255, 255, 255, 0.7)" : hexToLightColor(fillColor),
+      backgroundColor: isGroup ? "rgba(255, 255, 255, 0.7)" : fillColor,
       color: "#000",
       border: `2px ${borderStyle} ${hasViolations ? "#D0021B" : strokeColor}`,
       fontSize: theme2.fontSizes[0],
@@ -87656,7 +87589,7 @@ const CustomNode = (props) => {
     right: hexagonBorderWidth,
     bottom: hexagonBorderWidth,
     clipPath: hexagonClipPath,
-    backgroundColor: hexToLightColor(fillColor),
+    backgroundColor: fillColor,
     color: "#000",
     display: "flex",
     flexDirection: "column",
@@ -87690,7 +87623,7 @@ const CustomNode = (props) => {
     right: diamondBorderWidth,
     bottom: diamondBorderWidth,
     clipPath: diamondClipPath,
-    backgroundColor: hexToLightColor(fillColor),
+    backgroundColor: fillColor,
     color: "#000",
     display: "flex",
     flexDirection: "column",