@rfkit/charts 1.2.7 → 1.2.9

package/components/StationAllocation/SegmentContainer.d.ts

@@ -6,6 +6,9 @@ interface StationPosition {
         left: string;
         width: string;
     };
+    signalColor?: string;
+    signalTypeName?: string;
+    tooltip: string;
 }
 interface SegmentContainerProps {
     style: React.CSSProperties;

package/components/StationAllocation/type.d.ts

@@ -0,0 +1,16 @@
+export declare enum SignalType {
+    LEGITIMATE = "Legitimate",
+    KNOWN = "Know",
+    UNKNOWN = "UnKnown",
+    ILLEGAL = "Illegal"
+}
+export declare const SIGNAL_TYPE_MAP: Record<string, {
+    name: string;
+    color: string;
+    isLegitimate: boolean;
+}>;
+export declare const signalTypeMap: Record<string, {
+    name: string;
+    color: string;
+    isLegitimate: boolean;
+}>;

package/index.js

@@ -2729,9 +2729,11 @@ var __webpack_modules__ = {
   height: 100%;
   color: var(--theme-color-base);
   opacity: .68;
+  pointer-events: auto;
   justify-content: center;
   align-items: center;
-  height: 4px;
+  min-width: 1px;
+  height: 8px;
   font-size: 12px;
   display: flex;
   position: absolute;
@@ -2742,7 +2744,7 @@ var __webpack_modules__ = {
 .segmentContainer-gDwnhB .item-ybDTIt:after {
   content: "";
   opacity: .32;
-  background: var(--theme-color-base);
+  background: var(--station-bg-color, var(--theme-color-base));
   width: 100%;
   height: 100%;
   position: absolute;
@@ -2757,7 +2759,7 @@ var __webpack_modules__ = {
 
 .segmentContainer-gDwnhB .item-ybDTIt.active-qDPFJm:after {
   opacity: .68;
-  background: var(--theme-color-primary);
+  background: var(--station-bg-color, var(--theme-color-primary));
 }
 
 .segmentContainer-gDwnhB .item-ybDTIt:hover {
@@ -7857,6 +7859,28 @@ function useFilteredSeries(globalID, filter) {
     ]);
     return filteredData;
 }
+const SIGNAL_TYPE_MAP = {
+    Legitimate: {
+        name: "\u5408\u6CD5",
+        color: '#52c41a',
+        isLegitimate: true
+    },
+    Know: {
+        name: "\u5DF2\u77E5",
+        color: '#ff9900',
+        isLegitimate: true
+    },
+    UnKnown: {
+        name: "\u672A\u77E5",
+        color: '#bfbfbf',
+        isLegitimate: false
+    },
+    Illegal: {
+        name: "\u4E0D\u5408\u6CD5",
+        color: '#f5222d',
+        isLegitimate: false
+    }
+};
 var StationInfo_styles_module = __webpack_require__("../../../../node_modules/.pnpm/@rsbuild+core@1.3.18/node_modules/@rsbuild/core/compiled/css-loader/index.js??ruleSet[1].rules[11].use[1]!builtin:lightningcss-loader??ruleSet[1].rules[11].use[2]!../../../../node_modules/.pnpm/@rsbuild+plugin-less@1.5.0_@rsbuild+core@1.6.0/node_modules/@rsbuild/plugin-less/compiled/less-loader/index.js??ruleSet[1].rules[11].use[3]!./src/components/FrequencyDataBoard/StationInfo/styles.module.less");
 var StationInfo_styles_module_options = {};
 StationInfo_styles_module_options.styleTagTransform = styleTagTransform_default();
@@ -7866,7 +7890,15 @@ StationInfo_styles_module_options.domAPI = styleDomAPI_default();
 StationInfo_styles_module_options.insertStyleElement = insertStyleElement_default();
 injectStylesIntoStyleTag_default()(StationInfo_styles_module.Z, StationInfo_styles_module_options);
 const FrequencyDataBoard_StationInfo_styles_module = StationInfo_styles_module.Z && StationInfo_styles_module.Z.locals ? StationInfo_styles_module.Z.locals : void 0;
-const StationInfo = ({ stationInfo })=>{
+const StationInfo_StationInfo = ({ stationInfo })=>{
+    const signalTypeInfo = (0, __WEBPACK_EXTERNAL_MODULE_react__.useMemo)(()=>{
+        if (!stationInfo?.signalType) return null;
+        return SIGNAL_TYPE_MAP[stationInfo.signalType];
+    }, [
+        stationInfo?.signalType
+    ]);
+    const signalColor = signalTypeInfo?.color;
+    const signalTypeName = signalTypeInfo?.name || stationInfo?.signalType;
     if (!stationInfo) return null;
     return /*#__PURE__*/ (0, __WEBPACK_EXTERNAL_MODULE_react_jsx_runtime_225474f2__.jsxs)("div", {
         className: FrequencyDataBoard_StationInfo_styles_module.stationInfo,
@@ -7903,10 +7935,15 @@ const StationInfo = ({ stationInfo })=>{
                     stationInfo.modulation
                 ]
             }),
-            /*#__PURE__*/ (0, __WEBPACK_EXTERNAL_MODULE_react_jsx_runtime_225474f2__.jsxs)("div", {
+            signalTypeName && /*#__PURE__*/ (0, __WEBPACK_EXTERNAL_MODULE_react_jsx_runtime_225474f2__.jsxs)("div", {
                 children: [
-                    "\u72B6\u6001\uFF1A",
-                    stationInfo.signalType
+                    "\u7C7B\u578B\uFF1A",
+                    /*#__PURE__*/ (0, __WEBPACK_EXTERNAL_MODULE_react_jsx_runtime_225474f2__.jsx)("span", {
+                        style: {
+                            color: signalColor
+                        },
+                        children: signalTypeName
+                    })
                 ]
             }),
             stationInfo.remark && /*#__PURE__*/ (0, __WEBPACK_EXTERNAL_MODULE_react_jsx_runtime_225474f2__.jsxs)("div", {
@@ -7918,7 +7955,7 @@ const StationInfo = ({ stationInfo })=>{
         ]
     });
 };
-const FrequencyDataBoard_StationInfo = /*#__PURE__*/ __WEBPACK_EXTERNAL_MODULE_react__["default"].memo(StationInfo);
+const StationInfo = /*#__PURE__*/ __WEBPACK_EXTERNAL_MODULE_react__["default"].memo(StationInfo_StationInfo);
 var FrequencyDataBoard_styles_module = __webpack_require__("../../../node_modules/.pnpm/@rsbuild+core@1.3.18/node_modules/@rsbuild/core/compiled/css-loader/index.js??ruleSet[1].rules[11].use[1]!builtin:lightningcss-loader??ruleSet[1].rules[11].use[2]!../../../node_modules/.pnpm/@rsbuild+plugin-less@1.5.0_@rsbuild+core@1.6.0/node_modules/@rsbuild/plugin-less/compiled/less-loader/index.js??ruleSet[1].rules[11].use[3]!./src/components/FrequencyDataBoard/styles.module.less");
 var FrequencyDataBoard_styles_module_options = {};
 FrequencyDataBoard_styles_module_options.styleTagTransform = styleTagTransform_default();
@@ -8034,7 +8071,7 @@ const FrequencyDataBoard = ({ left, updateKey, onChange })=>{
                 ]
             }),
             value,
-            /*#__PURE__*/ (0, __WEBPACK_EXTERNAL_MODULE_react_jsx_runtime_225474f2__.jsx)(FrequencyDataBoard_StationInfo, {
+            /*#__PURE__*/ (0, __WEBPACK_EXTERNAL_MODULE_react_jsx_runtime_225474f2__.jsx)(StationInfo, {
                 stationInfo: sf
             })
         ]
@@ -8631,7 +8668,7 @@ Area_styles_module_options.insertStyleElement = insertStyleElement_default();
 injectStylesIntoStyleTag_default()(Area_styles_module.Z, Area_styles_module_options);
 const HeatmapCapture_Area_styles_module = Area_styles_module.Z && Area_styles_module.Z.locals ? Area_styles_module.Z.locals : void 0;
 const Area_COMPONENT_KEY = constants_ToolType.HeatmapCapture;
-const Area = (props)=>{
+const Area_Area = (props)=>{
     const { state: { heatmapCapture, segments, axisX: { frequencyFormat, unit }, system, globalID } } = useStore_useStore();
     const { id } = props;
     const { type, show, sync, onChange } = heatmapCapture;
@@ -8798,7 +8835,7 @@ const Area = (props)=>{
         ]
     });
 };
-const HeatmapCapture_Area = Area;
+const Area = Area_Area;
 var RowIndex_styles_module = __webpack_require__("../../../../node_modules/.pnpm/@rsbuild+core@1.3.18/node_modules/@rsbuild/core/compiled/css-loader/index.js??ruleSet[1].rules[11].use[1]!builtin:lightningcss-loader??ruleSet[1].rules[11].use[2]!../../../../node_modules/.pnpm/@rsbuild+plugin-less@1.5.0_@rsbuild+core@1.6.0/node_modules/@rsbuild/plugin-less/compiled/less-loader/index.js??ruleSet[1].rules[11].use[3]!./src/components/HeatmapCapture/RowIndex/styles.module.less");
 var RowIndex_styles_module_options = {};
 RowIndex_styles_module_options.styleTagTransform = styleTagTransform_default();
@@ -9182,7 +9219,7 @@ const HeatmapCapture_HeatmapCapture = (props)=>{
         ...props
     }) : type === store_HeatmapCaptureType.RowIndex ? /*#__PURE__*/ (0, __WEBPACK_EXTERNAL_MODULE_react_jsx_runtime_225474f2__.jsx)(HeatmapCapture_RowIndex, {
         ...props
-    }) : /*#__PURE__*/ (0, __WEBPACK_EXTERNAL_MODULE_react_jsx_runtime_225474f2__.jsx)(HeatmapCapture_Area, {
+    }) : /*#__PURE__*/ (0, __WEBPACK_EXTERNAL_MODULE_react_jsx_runtime_225474f2__.jsx)(Area, {
         ...props
     });
 };
@@ -14655,16 +14692,21 @@ const components_StationAllocation_styles_module = StationAllocation_styles_modu
 const StationAllocation_SegmentContainer_SegmentContainer = /*#__PURE__*/ (0, __WEBPACK_EXTERNAL_MODULE_react__.memo)(({ style, stationPositions, currentFrequency, segmentIndex, isCurrentSegment, onStationMouseEnter, onStationMouseLeave, isStationInHoverRange })=>/*#__PURE__*/ (0, __WEBPACK_EXTERNAL_MODULE_react_jsx_runtime_225474f2__.jsx)("div", {
         className: components_StationAllocation_styles_module.segmentContainer,
         style: style,
-        children: stationPositions.map(({ station, position }, index)=>{
+        children: stationPositions.map(({ station, position, signalColor, tooltip }, index)=>{
             const isActive = isCurrentSegment && currentFrequency >= station.startFrequency && currentFrequency <= station.stopFrequency;
             const isHovered = isStationInHoverRange(station);
+            const className = `${components_StationAllocation_styles_module.item}${isActive ? ` ${components_StationAllocation_styles_module.active}` : ''}${isHovered ? ` ${components_StationAllocation_styles_module.hovered}` : ''}`;
+            const itemStyle = {
+                left: position.left,
+                width: position.width,
+                ...signalColor && {
+                    '--station-bg-color': signalColor
+                }
+            };
             return /*#__PURE__*/ (0, __WEBPACK_EXTERNAL_MODULE_react_jsx_runtime_225474f2__.jsx)("div", {
-                className: `${components_StationAllocation_styles_module.item} ${isActive ? components_StationAllocation_styles_module.active : ''} ${isHovered ? components_StationAllocation_styles_module.hovered : ''}`,
-                style: {
-                    left: position.left,
-                    width: position.width
-                },
-                title: `${station.signalName} - ${station.frequency}${station.orgName ? ` (${station.orgName})` : ''}`,
+                className: className,
+                style: itemStyle,
+                title: tooltip,
                 onMouseEnter: ()=>onStationMouseEnter(station),
                 onMouseLeave: onStationMouseLeave
             }, `segment-${segmentIndex}-station-${station.signalName}-${station.frequency}-${index}`);
@@ -14673,14 +14715,14 @@ const StationAllocation_SegmentContainer_SegmentContainer = /*#__PURE__*/ (0, __
 const StationAllocation_SegmentContainer = StationAllocation_SegmentContainer_SegmentContainer;
 const StationAllocation_StationAllocation = ({ show = true, display = true })=>{
     const [hoveredFrequencyRange, setHoveredFrequencyRange] = (0, __WEBPACK_EXTERNAL_MODULE_react__.useState)(null);
-    const { state: { segments, axisX: { frequencyFormat }, zoom: { style: zoomOffStyle }, cursor: { coord: { left } }, stationInfo } } = useStore_useStore();
+    const { state: { segments, axisX: { frequencyFormat }, zoom: { style: zoomOffStyle }, cursor: { coord: { left } }, stationInfo, system: { width: containerWidth } } } = useStore_useStore();
     const stationData = stationInfo.data;
     const shouldDisplay = stationInfo.show && display;
     const currentFrequency = (0, __WEBPACK_EXTERNAL_MODULE_react__.useMemo)(()=>Number(frequencyFormat(left)), [
         left,
         frequencyFormat
     ]);
-    const handleStationMouseEnter = (station)=>{
+    const handleStationMouseEnter = (0, __WEBPACK_EXTERNAL_MODULE_react__.useCallback)((station)=>{
         const yian = station.bandwidth / 2 / 1000;
         const startFreq = station.frequency - yian;
         const stopFreq = station.frequency + yian;
@@ -14688,17 +14730,19 @@ const StationAllocation_StationAllocation = ({ show = true, display = true })=>{
             start: startFreq,
             stop: stopFreq
         });
-    };
-    const handleStationMouseLeave = ()=>{
+    }, []);
+    const handleStationMouseLeave = (0, __WEBPACK_EXTERNAL_MODULE_react__.useCallback)(()=>{
         setHoveredFrequencyRange(null);
-    };
-    const isStationInHoverRange = (station)=>{
+    }, []);
+    const isStationInHoverRange = (0, __WEBPACK_EXTERNAL_MODULE_react__.useCallback)((station)=>{
         if (!hoveredFrequencyRange) return false;
         const yian = station.bandwidth / 2 / 1000;
         const startFreq = station.frequency - yian;
         const stopFreq = station.frequency + yian;
         return !(stopFreq < hoveredFrequencyRange.start || startFreq > hoveredFrequencyRange.stop);
-    };
+    }, [
+        hoveredFrequencyRange
+    ]);
     const currentSegmentIndex = (0, __WEBPACK_EXTERNAL_MODULE_react__.useMemo)(()=>{
         if (!segments?.length) return -1;
         let totalPoints = 0;
@@ -14716,6 +14760,7 @@ const StationAllocation_StationAllocation = ({ show = true, display = true })=>{
     ]);
     const segmentData = (0, __WEBPACK_EXTERNAL_MODULE_react__.useMemo)(()=>{
         if (!segments?.length || !stationData.length) return [];
+        const MIN_WIDTH_THRESHOLD = 1 / containerWidth * 100;
         return segments.map((segment, segmentIndex)=>{
             const segmentStations = stationData.filter((station)=>{
                 const yian = station.bandwidth / 2 / 1000;
@@ -14749,8 +14794,19 @@ const StationAllocation_StationAllocation = ({ show = true, display = true })=>{
                 }
                 startIndex = Math.max(bestStartIndex, 0);
                 stopIndex = Math.min(bestStopIndex, segment.point - 1);
-                const width = (stopIndex - startIndex + 1) / segment.point * 100;
+                const calculatedWidth = (stopIndex - startIndex + 1) / segment.point * 100;
                 const leftPos = startIndex / segment.point * 100;
+                const width = calculatedWidth < MIN_WIDTH_THRESHOLD ? '1px' : `${calculatedWidth}%`;
+                const signalType = station.signalType;
+                const signalTypeInfo = SIGNAL_TYPE_MAP[signalType];
+                const signalColor = signalTypeInfo?.color;
+                const signalTypeName = signalTypeInfo?.name || station.signalType;
+                const tooltip = [
+                    station.signalName,
+                    `${station.frequency}MHz`,
+                    station.orgName && `\u{5355}\u{4F4D}: ${station.orgName}`,
+                    signalTypeName && `\u{7C7B}\u{578B}: ${signalTypeName}`
+                ].filter(Boolean).join(' | ');
                 return {
                     station: {
                         ...station,
@@ -14759,8 +14815,11 @@ const StationAllocation_StationAllocation = ({ show = true, display = true })=>{
                     },
                     position: {
                         left: `${leftPos}%`,
-                        width: `${width}%`
-                    }
+                        width
+                    },
+                    signalColor,
+                    signalTypeName,
+                    tooltip
                 };
             });
             const segmentWidth = segment.point / segments.reduce((sum, s)=>sum + s.point, 0) * 100;
@@ -14777,7 +14836,8 @@ const StationAllocation_StationAllocation = ({ show = true, display = true })=>{
         });
     }, [
         segments,
-        stationData
+        stationData,
+        containerWidth
     ]);
     if (!show || !shouldDisplay) return null;
     return /*#__PURE__*/ (0, __WEBPACK_EXTERNAL_MODULE_react_jsx_runtime_225474f2__.jsx)("div", {

package/package.json

@@ -5,6 +5,6 @@
   "types": "index.d.ts",
   "author": "Hxgh",
   "license": "MIT",
-  "version": "1.2.7",
+  "version": "1.2.9",
   "private": false
 }