@rfkit/charts 1.1.3 → 1.1.5

package/index.js

@@ -4,6 +4,449 @@ import * as __WEBPACK_EXTERNAL_MODULE__rfkit_theme_a11ca9cb__ from "@rfkit/theme
 import * as __WEBPACK_EXTERNAL_MODULE_react_dom_7136dc57__ from "react-dom";
 import * as __WEBPACK_EXTERNAL_MODULE__rfkit_spectrum_analyzer_159ab12b__ from "@rfkit/spectrum-analyzer";
 var __webpack_modules__ = {
+    "./src/utils/index.ts": function(__unused_webpack_module, __webpack_exports__, __webpack_require__) {
+        __webpack_require__.d(__webpack_exports__, {
+            Ax: ()=>leftSegments2frequency,
+            B5: ()=>getRowCol,
+            Bp: ()=>isdBm,
+            Fc: ()=>getDateTime,
+            IS: ()=>generateFrequencySegments,
+            P2: ()=>throttle1,
+            P9: ()=>convertToTimestampedArrays,
+            PM: ()=>mergeObjects,
+            Ri: ()=>isNumberAlias,
+            SF: ()=>createGUID,
+            f1: ()=>leftSegmentsFindStep,
+            g9: ()=>throttleTimer,
+            kL: ()=>getDimInfo,
+            lj: ()=>getFrequencyToFixed,
+            or: ()=>leftPoints2frequency,
+            r2: ()=>scopeLeftSegments2bandwidth,
+            sl: ()=>generateGreatSegments,
+            vY: ()=>getThemeFillStyle,
+            wF: ()=>getMidIndex
+        });
+        const createGUID = ()=>((1 + Math.random()) * 0x10000 | 0).toString(16).substring(1);
+        const getDateTime = (t = Date.now(), sep1 = '-', sep2 = ':', time = false)=>{
+            if (!t) return '';
+            let timestamp;
+            if (t instanceof Date) timestamp = t.getTime();
+            else {
+                if ('number' != typeof t) return '';
+                timestamp = t;
+                if (10 === timestamp.toString().length) timestamp *= 1000;
+            }
+            const date = new Date(timestamp);
+            if (Number.isNaN(date.getTime())) return '';
+            const year = date.getFullYear();
+            const month = String(date.getMonth() + 1).padStart(2, '0');
+            const day = String(date.getDate()).padStart(2, '0');
+            const hours = String(date.getHours()).padStart(2, '0');
+            const minutes = String(date.getMinutes()).padStart(2, '0');
+            const seconds = String(date.getSeconds()).padStart(2, '0');
+            const timeStr = `${hours}${sep2}${minutes}${sep2}${seconds}`;
+            if (time) return timeStr;
+            const dateStr = `${year}${sep1}${month}${sep1}${day}`;
+            return `${dateStr} ${timeStr}`;
+        };
+        function throttle1(func = ()=>{}, wait = 1000 / 30) {
+            let prev = 0;
+            return (...arg)=>{
+                const now = Date.now();
+                const timeSinceLastCall = now - prev;
+                if (timeSinceLastCall >= wait) {
+                    func(...arg);
+                    prev = now;
+                }
+            };
+        }
+        function throttleRequestAnimationFrame(func = ()=>{}) {
+            let scheduled = false;
+            return (e)=>{
+                if (!scheduled) {
+                    scheduled = true;
+                    requestAnimationFrame(()=>{
+                        func(e);
+                        scheduled = false;
+                    });
+                }
+            };
+        }
+        function throttleTimer(func = ()=>{}, wait) {
+            let timer = null;
+            return (e)=>{
+                clearTimeout(timer);
+                timer = setTimeout(()=>{
+                    func(e);
+                }, wait || 100);
+            };
+        }
+        const leftSegments2frequency = (segments)=>{
+            if (!segments?.length) return ()=>'';
+            const { totalPoints } = segments;
+            const segmentInfo = segments.map((segment, index)=>{
+                const { point, frequencyCache } = segment;
+                const ll = 100 * point / totalPoints;
+                return {
+                    ll,
+                    frequencyCache,
+                    startLeft: 0 === index ? 0 : segments.slice(0, index).reduce((sum, s)=>sum + 100 * s.point / totalPoints, 0)
+                };
+            });
+            return (left)=>{
+                if (left <= 0) return String(segments[0]?.start);
+                if (left >= 100) return String(segments[segments.length - 1]?.stop);
+                let low = 0;
+                let high = segmentInfo.length - 1;
+                while(low <= high){
+                    const mid = low + high >>> 1;
+                    const { startLeft, ll } = segmentInfo[mid];
+                    if (left >= startLeft && left < startLeft + ll) {
+                        const { frequencyCache } = segmentInfo[mid];
+                        const relativeLeft = left - startLeft;
+                        const ratio = relativeLeft / ll;
+                        const index = Math.min(Math.ceil(ratio * frequencyCache.length) - 1, frequencyCache.length - 1);
+                        return frequencyCache[index]?.frequency ?? '';
+                    }
+                    if (left < startLeft) high = mid - 1;
+                    else low = mid + 1;
+                }
+                return '';
+            };
+        };
+        const leftSegmentsFindStep = (segments)=>(left)=>{
+                if (!segments || 0 === left || 100 === left) return 0;
+                const { totalPoints } = segments;
+                let l = left;
+                for(let i = 0; i < segments.length; i += 1){
+                    const { point } = segments[i];
+                    const ll = 100 * point / totalPoints;
+                    if (l - ll <= 0) return ll / point;
+                    l -= ll;
+                }
+                return 0;
+            };
+        function leftPoints2frequency(points) {
+            const len = points.length;
+            return (left)=>{
+                if (0 === len) return;
+                let index = Math.ceil(left * len / 100) - 1;
+                if (-1 === index) index = 0;
+                return points[index];
+            };
+        }
+        const scopeLeftSegments2bandwidth = (e)=>{
+            if (!e) return 0;
+            const { segments } = e;
+            if (!segments) return 0;
+            const { totalPoints } = segments;
+            let { endLeft, startLeft } = e;
+            const diff = endLeft - startLeft;
+            const diffabs = Math.abs(diff);
+            if (diff < 0) {
+                startLeft = e.endLeft;
+                endLeft = e.startLeft;
+            }
+            let width = 0;
+            let startTag = false;
+            for(let i = 0; i < segments.length; i += 1){
+                const { step, start, stop, point } = segments[i];
+                const ll = 100 * point / totalPoints;
+                const quark = step / 1000;
+                const haveStart = startLeft - ll <= 0;
+                const haveEnd = endLeft - ll <= 0;
+                if (!startTag && haveStart && haveEnd) return Math.round(diffabs / ll * point) * quark;
+                if (haveStart && !startTag) {
+                    startTag = true;
+                    width += Math.round((1 - startLeft / ll) * point) * quark;
+                }
+                if (haveEnd) {
+                    width += Math.round(endLeft / ll * point) * quark;
+                    return width;
+                }
+                if (startLeft < 0 && !haveEnd) width += stop - start;
+                startLeft -= ll;
+                endLeft -= ll;
+            }
+            return 0;
+        };
+        function isdBm(unit) {
+            return unit?.slice(0, 3) === 'dBm';
+        }
+        function arrayFindMax(arr) {
+            if (!arr?.length) return {};
+            let max = Number.NEGATIVE_INFINITY;
+            let maxIndex = 0;
+            for(let i = 0; i < arr.length; i += 1){
+                const item = arr[i];
+                if (item > max) {
+                    max = item;
+                    maxIndex = i;
+                }
+            }
+            return {
+                max,
+                maxIndex
+            };
+        }
+        function arrayFindMin(arr) {
+            if (!arr?.length) return 0;
+            let min = Number.POSITIVE_INFINITY;
+            let minIndex = 0;
+            for(let i = 0; i < arr.length; i += 1){
+                const item = arr[i];
+                if (item < min) {
+                    min = item;
+                    minIndex = i;
+                }
+            }
+            return {
+                min,
+                minIndex
+            };
+        }
+        const setTotalPoints = (segments, totalPoints)=>{
+            Object.defineProperty(segments, 'totalPoints', {
+                value: totalPoints,
+                enumerable: false,
+                configurable: true
+            });
+            return segments;
+        };
+        const generateFrequencyCache = (config)=>{
+            const { totalPoints, startFrequency, stopFrequency, index = 0 } = config;
+            const segmentWidth = stopFrequency - startFrequency;
+            if (1 === totalPoints) return [
+                {
+                    frequency: getFrequencyToFixed(startFrequency),
+                    startLeft: 100 * index / totalPoints,
+                    endLeft: (index + 1) * 100 / totalPoints
+                }
+            ];
+            return new Array(totalPoints).fill(0).map((_, i)=>{
+                const progress = i / (totalPoints - 1);
+                const freq = startFrequency + progress * segmentWidth;
+                return {
+                    frequency: getFrequencyToFixed(freq),
+                    startLeft: (index + i) * 100 / totalPoints,
+                    endLeft: (index + i + 1) * 100 / totalPoints
+                };
+            });
+        };
+        const generateFrequencySegments = (e)=>{
+            const { frequency, bandwidth, totalPoints } = e;
+            const linearStart = frequency - bandwidth / 2000;
+            const linearStop = frequency + bandwidth / 2000;
+            if (linearStart <= 0 || linearStop <= 0) return [];
+            const frequencyCache = generateFrequencyCache({
+                totalPoints,
+                startFrequency: linearStart,
+                stopFrequency: linearStop,
+                stepFrequency: bandwidth / totalPoints
+            });
+            const segments = [
+                {
+                    frequency,
+                    bandwidth,
+                    step: linearStop - linearStart,
+                    start: linearStart,
+                    stop: linearStop,
+                    index: 0,
+                    label: '',
+                    point: totalPoints,
+                    percentage: 1,
+                    progress: [
+                        0,
+                        100
+                    ],
+                    frequencyCache
+                }
+            ];
+            return setTotalPoints(segments, totalPoints);
+        };
+        const generateGreatSegments = (prevSegments)=>{
+            if (!prevSegments?.length) return [];
+            const totalPoints = prevSegments.reduce((sum, { startFrequency, stopFrequency, stepFrequency })=>sum + Math.round((stopFrequency - startFrequency) * 1000 / stepFrequency) + 1, 0);
+            let cumulativePoints = 0;
+            const segments = prevSegments.map(({ startFrequency, stopFrequency, stepFrequency, label })=>{
+                const point = Math.round((stopFrequency - startFrequency) * 1000 / stepFrequency) + 1;
+                const index = cumulativePoints;
+                const frequencyCache = generateFrequencyCache({
+                    totalPoints: point,
+                    startFrequency,
+                    stopFrequency,
+                    stepFrequency,
+                    index
+                });
+                cumulativePoints += point;
+                return {
+                    start: startFrequency,
+                    stop: stopFrequency,
+                    step: stepFrequency,
+                    index,
+                    label,
+                    point,
+                    percentage: point / totalPoints,
+                    progress: [
+                        100 * index / totalPoints,
+                        100 * cumulativePoints / totalPoints
+                    ],
+                    frequencyCache
+                };
+            });
+            return setTotalPoints(segments, totalPoints);
+        };
+        function getDimInfo(d) {
+            if (!d) return {};
+            const valid = d.filter((f)=>isNumberAlias(f));
+            if (!valid?.length) return {};
+            const avg = eval(valid.join('+')) / valid.length;
+            const { min, minIndex } = arrayFindMin(valid);
+            const { max, maxIndex } = arrayFindMax(valid);
+            return {
+                min,
+                minIndex,
+                max,
+                maxIndex,
+                avg
+            };
+        }
+        const isNumberAlias = (n)=>Number.isFinite(+n);
+        const arrayKeepAttribute = (source, target)=>{
+            if (void 0 !== source.max) target.max = source.max;
+            if (void 0 !== source.maxIndex) target.maxIndex = source.maxIndex;
+            if (void 0 !== source.timestamp) target.timestamp = source.timestamp;
+            if (void 0 !== source.progress) target.progress = source.progress;
+        };
+        const weakenArray = (data, interval, factor)=>{
+            if (interval <= 0 || data.length <= interval) {
+                const result = Array.from({
+                    length: data.length
+                }, (_, index)=>{
+                    const value = data[index] + (factor?.[index] ?? 0);
+                    return 0 === value ? 0 : value || void 0;
+                });
+                arrayKeepAttribute(data, result);
+                return result;
+            }
+            const ratio = data.length / interval;
+            const result = new Array(interval);
+            arrayKeepAttribute(data, result);
+            const step = ratio;
+            let currentIndex = ratio / 2;
+            const dataLength = data.length;
+            for(let i = 0; i < interval; i++){
+                const start = Math.floor(currentIndex);
+                const end = Math.min(Math.floor(currentIndex + step), dataLength);
+                let max = data[start];
+                for(let j = start + 1; j < end; j++)if (data[j] > max) max = data[j];
+                const value = factor ? max + (factor[start] ?? 0) : max;
+                result[i] = 0 === value ? 0 : value || void 0;
+                currentIndex += step;
+            }
+            return result;
+        };
+        const getRowCol = (unknownArray)=>{
+            const row = unknownArray.length;
+            const col = Math.max(...unknownArray.map((r)=>r?.length));
+            return {
+                row,
+                col
+            };
+        };
+        function expandArray(arr) {
+            const expandedArray = [];
+            for(let i = 0; i < arr.length - 1; i += 1){
+                const current = arr[i];
+                const next = arr[i + 1];
+                const step = (next - current) / 10;
+                expandedArray.push(current);
+                for(let j = 1; j <= 9; j += 1){
+                    const newValue = current + step * j;
+                    expandedArray.push(newValue);
+                }
+            }
+            expandedArray.push(arr[arr.length - 1]);
+            return expandedArray;
+        }
+        function getThemeFillStyle() {
+            const computedStyles = getComputedStyle(document.documentElement);
+            const themeColorBase = computedStyles.getPropertyValue('--theme-color-base').trim();
+            const themeColorPrimary = computedStyles.getPropertyValue('--theme-color-primary').trim();
+            const fillStyle = `${themeColorBase}B0`;
+            const fillStylePrimary = themeColorPrimary;
+            const fillStyleTransparentBase = `${themeColorBase}10`;
+            return {
+                fillStyle,
+                fillStylePrimary,
+                fillStyleTransparentBase
+            };
+        }
+        const mergeObjects = (e, params)=>{
+            const p = e;
+            Object.keys(p).forEach((k)=>{
+                if ('[object Object]' === Object.prototype.toString.call(params[k])) p[k] = {
+                    ...p[k],
+                    ...params[k]
+                };
+                else if (void 0 !== params[k]) p[k] = params[k];
+            });
+            return p;
+        };
+        function getMidIndex(indexStart, indexEnd) {
+            if (indexStart < 0 || indexEnd < 0 || indexStart > indexEnd) throw new Error('Invalid index range');
+            return indexStart + Math.floor((indexEnd - indexStart) / 2);
+        }
+        const getFrequencyToFixed = (frequency, fixedNum = 6)=>{
+            if (!frequency && 0 !== frequency) return '';
+            const fixed = Number.parseFloat(frequency.toFixed(fixedNum));
+            return Number.isFinite(fixed) ? String(fixed) : '';
+        };
+        const createChartRenderID = ({ moduleType, globalID })=>{
+            if (moduleType && globalID) return `${moduleType}-${globalID}`;
+            return createGUID();
+        };
+        const convertToTimestampedArrays = (data, timestamps)=>{
+            if (!data || !Array.isArray(data)) return [];
+            return Array.from({
+                length: data.length
+            }, (_, i)=>{
+                const d = data[i];
+                const frame = new Float32Array(d.length);
+                frame.set(d);
+                frame.timestamp = timestamps[i];
+                return frame;
+            });
+        };
+        const debounce = (fn, delay = 1000 / 30)=>{
+            let timer = null;
+            const debouncedFunction = (...args)=>{
+                if (timer) clearTimeout(timer);
+                timer = setTimeout(()=>{
+                    fn(...args);
+                }, delay);
+            };
+            debouncedFunction.cancel = ()=>{
+                if (timer) {
+                    clearTimeout(timer);
+                    timer = null;
+                }
+            };
+            return debouncedFunction;
+        };
+        function debounceRequestAnimationFrame(func = ()=>{}) {
+            let scheduled = false;
+            return (...args)=>{
+                if (!scheduled) {
+                    scheduled = true;
+                    requestAnimationFrame(()=>{
+                        func(...args);
+                        scheduled = false;
+                    });
+                }
+            };
+        }
+    },
     "../../../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.3.1_@rsbuild+core@1.4.12/node_modules/@rsbuild/plugin-less/compiled/less-loader/index.js??ruleSet[1].rules[11].use[3]!./src/components/AxisX/styles.module.less": function(module, __webpack_exports__, __webpack_require__) {
         __webpack_require__.d(__webpack_exports__, {
             Z: ()=>__WEBPACK_DEFAULT_EXPORT__
@@ -3221,6 +3664,16 @@ function __webpack_require__(moduleId) {
 (()=>{
     __webpack_require__.nc = void 0;
 })();
+const STORAGE_KEY = 'rfkit-charts-frequency-allocation';
+const getFrequencyAllocationFromCache = ()=>{
+    const cached = localStorage.getItem(STORAGE_KEY);
+    if (!cached) return null;
+    const data = JSON.parse(cached);
+    return Array.isArray(data) ? data : null;
+};
+const setFrequencyAllocationToCache = (data)=>{
+    localStorage.setItem(STORAGE_KEY, JSON.stringify(data));
+};
 const KEY = 'DCHARTS_CONFIG';
 const defaultConfig = {
     line: {
@@ -3621,334 +4074,7 @@ function withChartPublisher(ChartComponent, componentName) {
     ChartWrapper.displayName = `withChartPublisher(${componentName})`;
     return ChartWrapper;
 }
-const createGUID = ()=>((1 + Math.random()) * 0x10000 | 0).toString(16).substring(1);
-const getDateTime = (t = Date.now(), sep1 = '-', sep2 = ':', time = false)=>{
-    if (!t) return '';
-    let timestamp;
-    if (t instanceof Date) timestamp = t.getTime();
-    else {
-        if ('number' != typeof t) return '';
-        timestamp = t;
-        if (10 === timestamp.toString().length) timestamp *= 1000;
-    }
-    const date = new Date(timestamp);
-    if (Number.isNaN(date.getTime())) return '';
-    const year = date.getFullYear();
-    const month = String(date.getMonth() + 1).padStart(2, '0');
-    const day = String(date.getDate()).padStart(2, '0');
-    const hours = String(date.getHours()).padStart(2, '0');
-    const minutes = String(date.getMinutes()).padStart(2, '0');
-    const seconds = String(date.getSeconds()).padStart(2, '0');
-    const timeStr = `${hours}${sep2}${minutes}${sep2}${seconds}`;
-    if (time) return timeStr;
-    const dateStr = `${year}${sep1}${month}${sep1}${day}`;
-    return `${dateStr} ${timeStr}`;
-};
-function utils_throttle(func = ()=>{}, wait = 1000 / 30) {
-    let prev = 0;
-    return (...arg)=>{
-        const now = Date.now();
-        const timeSinceLastCall = now - prev;
-        if (timeSinceLastCall >= wait) {
-            func(...arg);
-            prev = now;
-        }
-    };
-}
-function throttleTimer(func = ()=>{}, wait) {
-    let timer = null;
-    return (e)=>{
-        clearTimeout(timer);
-        timer = setTimeout(()=>{
-            func(e);
-        }, wait || 100);
-    };
-}
-const leftSegments2frequency = (segments)=>{
-    if (!segments?.length) return ()=>'';
-    const { totalPoints } = segments;
-    const segmentInfo = segments.map((segment, index)=>{
-        const { point, frequencyCache } = segment;
-        const ll = 100 * point / totalPoints;
-        return {
-            ll,
-            frequencyCache,
-            startLeft: 0 === index ? 0 : segments.slice(0, index).reduce((sum, s)=>sum + 100 * s.point / totalPoints, 0)
-        };
-    });
-    return (left)=>{
-        if (left <= 0) return String(segments[0]?.start);
-        if (left >= 100) return String(segments[segments.length - 1]?.stop);
-        let low = 0;
-        let high = segmentInfo.length - 1;
-        while(low <= high){
-            const mid = low + high >>> 1;
-            const { startLeft, ll } = segmentInfo[mid];
-            if (left >= startLeft && left < startLeft + ll) {
-                const { frequencyCache } = segmentInfo[mid];
-                const relativeLeft = left - startLeft;
-                const ratio = relativeLeft / ll;
-                const index = Math.min(Math.ceil(ratio * frequencyCache.length) - 1, frequencyCache.length - 1);
-                return frequencyCache[index]?.frequency ?? '';
-            }
-            if (left < startLeft) high = mid - 1;
-            else low = mid + 1;
-        }
-        return '';
-    };
-};
-const leftSegmentsFindStep = (segments)=>(left)=>{
-        if (!segments || 0 === left || 100 === left) return 0;
-        const { totalPoints } = segments;
-        let l = left;
-        for(let i = 0; i < segments.length; i += 1){
-            const { point } = segments[i];
-            const ll = 100 * point / totalPoints;
-            if (l - ll <= 0) return ll / point;
-            l -= ll;
-        }
-        return 0;
-    };
-function leftPoints2frequency(points) {
-    const len = points.length;
-    return (left)=>{
-        if (0 === len) return;
-        let index = Math.ceil(left * len / 100) - 1;
-        if (-1 === index) index = 0;
-        return points[index];
-    };
-}
-const scopeLeftSegments2bandwidth = (e)=>{
-    if (!e) return 0;
-    const { segments } = e;
-    if (!segments) return 0;
-    const { totalPoints } = segments;
-    let { endLeft, startLeft } = e;
-    const diff = endLeft - startLeft;
-    const diffabs = Math.abs(diff);
-    if (diff < 0) {
-        startLeft = e.endLeft;
-        endLeft = e.startLeft;
-    }
-    let width = 0;
-    let startTag = false;
-    for(let i = 0; i < segments.length; i += 1){
-        const { step, start, stop, point } = segments[i];
-        const ll = 100 * point / totalPoints;
-        const quark = step / 1000;
-        const haveStart = startLeft - ll <= 0;
-        const haveEnd = endLeft - ll <= 0;
-        if (!startTag && haveStart && haveEnd) return Math.round(diffabs / ll * point) * quark;
-        if (haveStart && !startTag) {
-            startTag = true;
-            width += Math.round((1 - startLeft / ll) * point) * quark;
-        }
-        if (haveEnd) {
-            width += Math.round(endLeft / ll * point) * quark;
-            return width;
-        }
-        if (startLeft < 0 && !haveEnd) width += stop - start;
-        startLeft -= ll;
-        endLeft -= ll;
-    }
-    return 0;
-};
-function isdBm(unit) {
-    return unit?.slice(0, 3) === 'dBm';
-}
-function arrayFindMax(arr) {
-    if (!arr?.length) return {};
-    let max = Number.NEGATIVE_INFINITY;
-    let maxIndex = 0;
-    for(let i = 0; i < arr.length; i += 1){
-        const item = arr[i];
-        if (item > max) {
-            max = item;
-            maxIndex = i;
-        }
-    }
-    return {
-        max,
-        maxIndex
-    };
-}
-function arrayFindMin(arr) {
-    if (!arr?.length) return 0;
-    let min = Number.POSITIVE_INFINITY;
-    let minIndex = 0;
-    for(let i = 0; i < arr.length; i += 1){
-        const item = arr[i];
-        if (item < min) {
-            min = item;
-            minIndex = i;
-        }
-    }
-    return {
-        min,
-        minIndex
-    };
-}
-const setTotalPoints = (segments, totalPoints)=>{
-    Object.defineProperty(segments, 'totalPoints', {
-        value: totalPoints,
-        enumerable: false,
-        configurable: true
-    });
-    return segments;
-};
-const generateFrequencyCache = (config)=>{
-    const { totalPoints, startFrequency, stopFrequency, index = 0 } = config;
-    const segmentWidth = stopFrequency - startFrequency;
-    if (1 === totalPoints) return [
-        {
-            frequency: getFrequencyToFixed(startFrequency),
-            startLeft: 100 * index / totalPoints,
-            endLeft: (index + 1) * 100 / totalPoints
-        }
-    ];
-    return new Array(totalPoints).fill(0).map((_, i)=>{
-        const progress = i / (totalPoints - 1);
-        const freq = startFrequency + progress * segmentWidth;
-        return {
-            frequency: getFrequencyToFixed(freq),
-            startLeft: (index + i) * 100 / totalPoints,
-            endLeft: (index + i + 1) * 100 / totalPoints
-        };
-    });
-};
-const generateFrequencySegments = (e)=>{
-    const { frequency, bandwidth, totalPoints } = e;
-    const linearStart = frequency - bandwidth / 2000;
-    const linearStop = frequency + bandwidth / 2000;
-    if (linearStart <= 0 || linearStop <= 0) return [];
-    const frequencyCache = generateFrequencyCache({
-        totalPoints,
-        startFrequency: linearStart,
-        stopFrequency: linearStop,
-        stepFrequency: bandwidth / totalPoints
-    });
-    const segments = [
-        {
-            frequency,
-            bandwidth,
-            step: linearStop - linearStart,
-            start: linearStart,
-            stop: linearStop,
-            index: 0,
-            label: '',
-            point: totalPoints,
-            percentage: 1,
-            progress: [
-                0,
-                100
-            ],
-            frequencyCache
-        }
-    ];
-    return setTotalPoints(segments, totalPoints);
-};
-const generateGreatSegments = (prevSegments)=>{
-    if (!prevSegments?.length) return [];
-    const totalPoints = prevSegments.reduce((sum, { startFrequency, stopFrequency, stepFrequency })=>sum + Math.round((stopFrequency - startFrequency) * 1000 / stepFrequency) + 1, 0);
-    let cumulativePoints = 0;
-    const segments = prevSegments.map(({ startFrequency, stopFrequency, stepFrequency, label })=>{
-        const point = Math.round((stopFrequency - startFrequency) * 1000 / stepFrequency) + 1;
-        const index = cumulativePoints;
-        const frequencyCache = generateFrequencyCache({
-            totalPoints: point,
-            startFrequency,
-            stopFrequency,
-            stepFrequency,
-            index
-        });
-        cumulativePoints += point;
-        return {
-            start: startFrequency,
-            stop: stopFrequency,
-            step: stepFrequency,
-            index,
-            label,
-            point,
-            percentage: point / totalPoints,
-            progress: [
-                100 * index / totalPoints,
-                100 * cumulativePoints / totalPoints
-            ],
-            frequencyCache
-        };
-    });
-    return setTotalPoints(segments, totalPoints);
-};
-function getDimInfo(d) {
-    if (!d) return {};
-    const valid = d.filter((f)=>isNumberAlias(f));
-    if (!valid?.length) return {};
-    const eval2 = eval;
-    const avg = eval2(valid.join('+')) / valid.length;
-    const { min, minIndex } = arrayFindMin(valid);
-    const { max, maxIndex } = arrayFindMax(valid);
-    return {
-        min,
-        minIndex,
-        max,
-        maxIndex,
-        avg
-    };
-}
-const isNumberAlias = (n)=>Number.isFinite(+n);
-const getRowCol = (unknownArray)=>{
-    const row = unknownArray.length;
-    const col = Math.max(...unknownArray.map((r)=>r?.length));
-    return {
-        row,
-        col
-    };
-};
-function getThemeFillStyle() {
-    const computedStyles = getComputedStyle(document.documentElement);
-    const themeColorBase = computedStyles.getPropertyValue('--theme-color-base').trim();
-    const themeColorPrimary = computedStyles.getPropertyValue('--theme-color-primary').trim();
-    const fillStyle = `${themeColorBase}B0`;
-    const fillStylePrimary = themeColorPrimary;
-    const fillStyleTransparentBase = `${themeColorBase}10`;
-    return {
-        fillStyle,
-        fillStylePrimary,
-        fillStyleTransparentBase
-    };
-}
-const mergeObjects = (e, params)=>{
-    const p = e;
-    Object.keys(p).forEach((k)=>{
-        if ('[object Object]' === Object.prototype.toString.call(params[k])) p[k] = {
-            ...p[k],
-            ...params[k]
-        };
-        else if (void 0 !== params[k]) p[k] = params[k];
-    });
-    return p;
-};
-function getMidIndex(indexStart, indexEnd) {
-    if (indexStart < 0 || indexEnd < 0 || indexStart > indexEnd) throw new Error('Invalid index range');
-    return indexStart + Math.floor((indexEnd - indexStart) / 2);
-}
-const getFrequencyToFixed = (frequency, fixedNum = 6)=>{
-    if (!frequency && 0 !== frequency) return '';
-    const fixed = Number.parseFloat(frequency.toFixed(fixedNum));
-    return Number.isFinite(fixed) ? String(fixed) : '';
-};
-const convertToTimestampedArrays = (data, timestamps)=>{
-    if (!data || !Array.isArray(data)) return [];
-    return Array.from({
-        length: data.length
-    }, (_, i)=>{
-        const d = data[i];
-        const frame = new Float32Array(d.length);
-        frame.set(d);
-        frame.timestamp = timestamps[i];
-        return frame;
-    });
-};
+var utils = __webpack_require__("./src/utils/index.ts");
 const AppContext = __WEBPACK_EXTERNAL_MODULE_react__["default"].createContext({});
 const store_context = AppContext;
 var store_HeatmapCaptureType = /*#__PURE__*/ function(HeatmapCaptureType) {
@@ -3995,618 +4121,6 @@ const intervalDefault = {
     end: weakenDefault
 };
 const dataRateDefault = 1;
-const originalFrequencyAllocationData = [
-    {
-        startFrequency: 87,
-        stopFrequency: 108,
-        defaultStep: 100,
-        defaultBandwidth: 150,
-        modulation: 'AM',
-        demodulation: "\u4E0D\u89E3\u8C03",
-        allocation: "FM\u5E7F\u64AD",
-        status: "\u5408\u6CD5",
-        color: '#FF7F50',
-        title: "FM\u5E7F\u64AD",
-        description: "FM\u8C03\u9891\u5E7F\u64AD\u9891\u6BB5\uFF0C\u7528\u4E8E\u97F3\u9891\u5E7F\u64AD\u670D\u52A1"
-    },
-    {
-        startFrequency: 108,
-        stopFrequency: 118,
-        defaultStep: 50,
-        defaultBandwidth: 100,
-        modulation: 'FM',
-        demodulation: "\u89E3\u8C03",
-        allocation: "\u822A\u7A7A\u5BFC\u822A",
-        status: "\u5408\u6CD5",
-        color: '#4169E1',
-        title: "\u822A\u7A7A\u5BFC\u822A",
-        description: "\u822A\u7A7A\u65E0\u7EBF\u7535\u5BFC\u822A\u9891\u6BB5\uFF0C\u7528\u4E8E\u4EEA\u8868\u7740\u9646\u7CFB\u7EDF\u7B49"
-    },
-    {
-        startFrequency: 118,
-        stopFrequency: 137,
-        defaultStep: 25,
-        defaultBandwidth: 50,
-        modulation: 'AM',
-        demodulation: "\u89E3\u8C03",
-        allocation: "\u822A\u7A7A\u8BED\u97F3\u901A\u4FE1",
-        status: "\u5408\u6CD5",
-        color: '#32CD32',
-        title: "\u822A\u7A7A\u8BED\u97F3\u901A\u4FE1",
-        description: "\u6C11\u7528\u822A\u7A7A\u8BED\u97F3\u901A\u4FE1\u9891\u6BB5"
-    },
-    {
-        startFrequency: 121,
-        stopFrequency: 122,
-        defaultStep: 25,
-        defaultBandwidth: 50,
-        modulation: 'FM',
-        demodulation: "\u89E3\u8C03",
-        allocation: "\u7D27\u6025\u901A\u4FE1",
-        status: "\u5408\u6CD5",
-        color: '#FF4500',
-        title: "\u7D27\u6025\u901A\u4FE1",
-        description: "\u7D27\u6025\u60C5\u51B5\u901A\u4FE1\u4E13\u7528\u9891\u6BB5"
-    },
-    {
-        startFrequency: 136,
-        stopFrequency: 174,
-        defaultStep: 25,
-        defaultBandwidth: 50,
-        modulation: 'FM',
-        demodulation: "\u89E3\u8C03",
-        allocation: "\u5BF9\u8BB2\u901A\u4FE1",
-        status: "\u5408\u6CD5",
-        color: '#9370DB',
-        title: "\u5BF9\u8BB2\u901A\u4FE1",
-        description: "\u4E13\u4E1A\u65E0\u7EBF\u5BF9\u8BB2\u901A\u4FE1\u9891\u6BB5"
-    },
-    {
-        startFrequency: 161,
-        stopFrequency: 162,
-        defaultStep: 25,
-        defaultBandwidth: 50,
-        modulation: 'GMSK',
-        demodulation: "\u89E3\u8C03",
-        allocation: "AIS\u8239\u8236\u901A\u4FE1",
-        status: "\u5408\u6CD5",
-        color: '#4682B4',
-        title: "AIS\u8239\u8236\u901A\u4FE1",
-        description: "\u8239\u8236\u81EA\u52A8\u8BC6\u522B\u7CFB\u7EDF(AIS)\u4E13\u7528\u9891\u6BB5"
-    },
-    {
-        startFrequency: 351,
-        stopFrequency: 400,
-        defaultStep: 25,
-        defaultBandwidth: 50,
-        modulation: 'FM',
-        demodulation: "\u89E3\u8C03",
-        allocation: "\u96C6\u7FA4\u901A\u4FE1",
-        status: "\u5408\u6CD5",
-        color: '#20B2AA',
-        title: "\u96C6\u7FA4\u901A\u4FE1",
-        description: "\u4E13\u4E1A\u96C6\u7FA4\u901A\u4FE1\u7CFB\u7EDF\u9891\u6BB5"
-    },
-    {
-        startFrequency: 400,
-        stopFrequency: 470,
-        defaultStep: 25,
-        defaultBandwidth: 50,
-        modulation: 'FM',
-        demodulation: "\u89E3\u8C03",
-        allocation: "\u4E13\u4E1A\u5BF9\u8BB2",
-        status: "\u5408\u6CD5",
-        color: '#DDA0DD',
-        title: "\u4E13\u4E1A\u5BF9\u8BB2",
-        description: "\u4E13\u4E1A\u65E0\u7EBF\u5BF9\u8BB2\u901A\u4FE1\u9891\u6BB5"
-    },
-    {
-        startFrequency: 534,
-        stopFrequency: 542,
-        defaultStep: 100,
-        defaultBandwidth: 8000,
-        modulation: 'OFDM',
-        demodulation: "\u89E3\u8C03",
-        allocation: "\u6570\u5B57\u7535\u89C6",
-        status: "\u5408\u6CD5",
-        color: '#F08080',
-        title: "\u6570\u5B57\u7535\u89C6",
-        description: "\u6570\u5B57\u7535\u89C6\u5E7F\u64AD\u9891\u6BB5"
-    },
-    {
-        startFrequency: 622,
-        stopFrequency: 630,
-        defaultStep: 100,
-        defaultBandwidth: 8000,
-        modulation: 'OFDM',
-        demodulation: "\u89E3\u8C03",
-        allocation: "\u6570\u5B57\u7535\u89C6",
-        status: "\u5408\u6CD5",
-        color: '#87CEFA',
-        title: "\u6570\u5B57\u7535\u89C6",
-        description: "\u6570\u5B57\u7535\u89C6\u5E7F\u64AD\u9891\u6BB5"
-    },
-    {
-        startFrequency: 703,
-        stopFrequency: 733,
-        defaultStep: 100,
-        defaultBandwidth: 30000,
-        modulation: 'OFDMA',
-        demodulation: "\u89E3\u8C03",
-        allocation: "5G\u4E0A\u884C(\u5E7F\u7535/\u79FB\u52A8)",
-        status: "\u5408\u6CD5",
-        color: '#9ACD32',
-        title: "5G\u4E0A\u884C(\u5E7F\u7535/\u79FB\u52A8)",
-        description: "\u5E7F\u7535\u548C\u79FB\u52A85G\u7F51\u7EDC\u4E0A\u884C\u9891\u6BB5"
-    },
-    {
-        startFrequency: 758,
-        stopFrequency: 788,
-        defaultStep: 100,
-        defaultBandwidth: 30000,
-        modulation: 'OFDMA',
-        demodulation: "\u89E3\u8C03",
-        allocation: "5G\u4E0B\u884C(\u5E7F\u7535/\u79FB\u52A8)",
-        status: "\u5408\u6CD5",
-        color: '#7B68EE',
-        title: "5G\u4E0B\u884C(\u5E7F\u7535/\u79FB\u52A8)",
-        description: "\u5E7F\u7535\u548C\u79FB\u52A85G\u7F51\u7EDC\u4E0B\u884C\u9891\u6BB5"
-    },
-    {
-        startFrequency: 806,
-        stopFrequency: 821,
-        defaultStep: 25,
-        defaultBandwidth: 50,
-        modulation: "\u03C0/4DQPSK",
-        demodulation: "\u89E3\u8C03",
-        allocation: "\u6570\u5B57\u96C6\u7FA4\u4E0A\u884C",
-        status: "\u5408\u6CD5",
-        color: '#FFA500',
-        title: "\u6570\u5B57\u96C6\u7FA4\u4E0A\u884C",
-        description: "\u6570\u5B57\u96C6\u7FA4\u901A\u4FE1\u7CFB\u7EDF(TETRA)\u4E0A\u884C\u9891\u6BB5"
-    },
-    {
-        startFrequency: 824,
-        stopFrequency: 835,
-        defaultStep: 100,
-        defaultBandwidth: 5000,
-        modulation: 'QPSK',
-        demodulation: "\u89E3\u8C03",
-        allocation: "\u7535\u4FE13G/4G/5G\u4E0A\u884C",
-        status: "\u5408\u6CD5",
-        color: '#48D1CC',
-        title: "\u7535\u4FE13G/4G/5G\u4E0A\u884C",
-        description: "\u4E2D\u56FD\u7535\u4FE13G/4G/5G\u7F51\u7EDC\u4E0A\u884C\u9891\u6BB5"
-    },
-    {
-        startFrequency: 851,
-        stopFrequency: 866,
-        defaultStep: 25,
-        defaultBandwidth: 50,
-        modulation: "\u03C0/4DQPSK",
-        demodulation: "\u89E3\u8C03",
-        allocation: "\u6570\u5B57\u96C6\u7FA4\u4E0B\u884C",
-        status: "\u5408\u6CD5",
-        color: '#C71585',
-        title: "\u6570\u5B57\u96C6\u7FA4\u4E0B\u884C",
-        description: "\u6570\u5B57\u96C6\u7FA4\u901A\u4FE1\u7CFB\u7EDF(TETRA)\u4E0B\u884C\u9891\u6BB5"
-    },
-    {
-        startFrequency: 869,
-        stopFrequency: 880,
-        defaultStep: 100,
-        defaultBandwidth: 5000,
-        modulation: 'QPSK',
-        demodulation: "\u89E3\u8C03",
-        allocation: "\u7535\u4FE13G/4G/5G\u4E0B\u884C",
-        status: "\u5408\u6CD5",
-        color: '#6495ED',
-        title: "\u7535\u4FE13G/4G/5G\u4E0B\u884C",
-        description: "\u4E2D\u56FD\u7535\u4FE13G/4G/5G\u7F51\u7EDC\u4E0B\u884C\u9891\u6BB5"
-    },
-    {
-        startFrequency: 885,
-        stopFrequency: 889,
-        defaultStep: 200,
-        defaultBandwidth: 200,
-        modulation: 'GMSK',
-        demodulation: "\u89E3\u8C03",
-        allocation: "GSM-R\u4E0A\u884C",
-        status: "\u5408\u6CD5",
-        color: '#DC143C',
-        title: "GSM-R\u4E0A\u884C",
-        description: "\u94C1\u8DEF\u4E13\u7528GSM-R\u7F51\u7EDC\u4E0A\u884C\u9891\u6BB5"
-    },
-    {
-        startFrequency: 889,
-        stopFrequency: 904,
-        defaultStep: 200,
-        defaultBandwidth: 200,
-        modulation: 'GMSK',
-        demodulation: "\u89E3\u8C03",
-        allocation: "\u79FB\u52A82G/4G\u4E0A\u884C",
-        status: "\u5408\u6CD5",
-        color: '#B22222',
-        title: "\u79FB\u52A82G/4G\u4E0A\u884C",
-        description: "\u4E2D\u56FD\u79FB\u52A82G/4G\u7F51\u7EDC\u4E0A\u884C\u9891\u6BB5"
-    },
-    {
-        startFrequency: 904,
-        stopFrequency: 915,
-        defaultStep: 200,
-        defaultBandwidth: 200,
-        modulation: 'QPSK',
-        demodulation: "\u89E3\u8C03",
-        allocation: "\u8054\u901A2/3/4/5G\u4E0A\u884C",
-        status: "\u5408\u6CD5",
-        color: '#808000',
-        title: "\u8054\u901A2/3/4/5G\u4E0A\u884C",
-        description: "\u4E2D\u56FD\u8054\u901A2G/3G/4G/5G\u7F51\u7EDC\u4E0A\u884C\u9891\u6BB5"
-    },
-    {
-        startFrequency: 930,
-        stopFrequency: 934,
-        defaultStep: 200,
-        defaultBandwidth: 200,
-        modulation: 'GMSK',
-        demodulation: "\u89E3\u8C03",
-        allocation: "GSM-R\u4E0B\u884C",
-        status: "\u5408\u6CD5",
-        color: '#008080',
-        title: "GSM-R\u4E0B\u884C",
-        description: "\u94C1\u8DEF\u4E13\u7528GSM-R\u7F51\u7EDC\u4E0B\u884C\u9891\u6BB5"
-    },
-    {
-        startFrequency: 934,
-        stopFrequency: 949,
-        defaultStep: 200,
-        defaultBandwidth: 200,
-        modulation: 'GMSK',
-        demodulation: "\u89E3\u8C03",
-        allocation: "\u79FB\u52A82G/4G\u4E0B\u884C",
-        status: "\u5408\u6CD5",
-        color: '#2E8B57',
-        title: "\u79FB\u52A82G/4G\u4E0B\u884C",
-        description: "\u4E2D\u56FD\u79FB\u52A82G/4G\u7F51\u7EDC\u4E0B\u884C\u9891\u6BB5"
-    },
-    {
-        startFrequency: 949,
-        stopFrequency: 960,
-        defaultStep: 200,
-        defaultBandwidth: 200,
-        modulation: 'QPSK',
-        demodulation: "\u89E3\u8C03",
-        allocation: "\u8054\u901A2/3/4/5G\u4E0B\u884C",
-        status: "\u5408\u6CD5",
-        color: '#800080',
-        title: "\u8054\u901A2/3/4/5G\u4E0B\u884C",
-        description: "\u4E2D\u56FD\u8054\u901A2G/3G/4G/5G\u7F51\u7EDC\u4E0B\u884C\u9891\u6BB5"
-    },
-    {
-        startFrequency: 1164,
-        stopFrequency: 1189,
-        defaultStep: 1000,
-        defaultBandwidth: 10000,
-        modulation: 'BPSK',
-        demodulation: "\u89E3\u8C03",
-        allocation: "GPS L5\u9891\u6BB5",
-        status: "\u5408\u6CD5",
-        color: '#B8860B',
-        title: "GPS L5\u9891\u6BB5",
-        description: "\u5168\u7403\u5B9A\u4F4D\u7CFB\u7EDFGPS L5\u9891\u6BB5"
-    },
-    {
-        startFrequency: 1215,
-        stopFrequency: 1234,
-        defaultStep: 1000,
-        defaultBandwidth: 10000,
-        modulation: 'BPSK',
-        demodulation: "\u89E3\u8C03",
-        allocation: "GPS L2\u9891\u6BB5",
-        status: "\u5408\u6CD5",
-        color: '#778899',
-        title: "GPS L2\u9891\u6BB5",
-        description: "\u5168\u7403\u5B9A\u4F4D\u7CFB\u7EDFGPS L2\u9891\u6BB5"
-    },
-    {
-        startFrequency: 1447,
-        stopFrequency: 1467,
-        defaultStep: 100,
-        defaultBandwidth: 10000,
-        modulation: 'OFDMA',
-        demodulation: "\u89E3\u8C03",
-        allocation: "\u653F\u52A1\u516C\u5B89\u4E13\u7F51",
-        status: "\u5408\u6CD5",
-        color: '#483D8B',
-        title: "\u653F\u52A1\u516C\u5B89\u4E13\u7F51",
-        description: "\u653F\u52A1\u548C\u516C\u5B89\u4E13\u7528LTE\u7F51\u7EDC\u9891\u6BB5"
-    },
-    {
-        startFrequency: 1563,
-        stopFrequency: 1587,
-        defaultStep: 1000,
-        defaultBandwidth: 10000,
-        modulation: 'BPSK',
-        demodulation: "\u89E3\u8C03",
-        allocation: "GPS L1\u9891\u6BB5",
-        status: "\u5408\u6CD5",
-        color: '#CD5C5C',
-        title: "GPS L1\u9891\u6BB5",
-        description: "\u5168\u7403\u5B9A\u4F4D\u7CFB\u7EDFGPS L1\u9891\u6BB5"
-    },
-    {
-        startFrequency: 1710,
-        stopFrequency: 1735,
-        defaultStep: 200,
-        defaultBandwidth: 5000,
-        modulation: 'QPSK',
-        demodulation: "\u89E3\u8C03",
-        allocation: "\u79FB\u52A82G/4G\u4E0A\u884C",
-        status: "\u5408\u6CD5",
-        color: '#FA8072',
-        title: "\u79FB\u52A82G/4G\u4E0A\u884C",
-        description: "\u4E2D\u56FD\u79FB\u52A82G/4G\u7F51\u7EDC\u4E0A\u884C\u9891\u6BB5"
-    },
-    {
-        startFrequency: 1735,
-        stopFrequency: 1765,
-        defaultStep: 200,
-        defaultBandwidth: 5000,
-        modulation: 'QPSK',
-        demodulation: "\u89E3\u8C03",
-        allocation: "\u8054\u901A2/4G\u4E0A\u884C",
-        status: "\u5408\u6CD5",
-        color: '#6A5ACD',
-        title: "\u8054\u901A2/4G\u4E0A\u884C",
-        description: "\u4E2D\u56FD\u8054\u901A2G/4G\u7F51\u7EDC\u4E0A\u884C\u9891\u6BB5"
-    },
-    {
-        startFrequency: 1805,
-        stopFrequency: 1830,
-        defaultStep: 200,
-        defaultBandwidth: 5000,
-        modulation: 'QPSK',
-        demodulation: "\u89E3\u8C03",
-        allocation: "\u79FB\u52A82G/4G\u4E0B\u884C",
-        status: "\u5408\u6CD5",
-        color: '#00FA9A',
-        title: "\u79FB\u52A82G/4G\u4E0B\u884C",
-        description: "\u4E2D\u56FD\u79FB\u52A82G/4G\u7F51\u7EDC\u4E0B\u884C\u9891\u6BB5"
-    },
-    {
-        startFrequency: 1830,
-        stopFrequency: 1860,
-        defaultStep: 200,
-        defaultBandwidth: 5000,
-        modulation: 'QPSK',
-        demodulation: "\u89E3\u8C03",
-        allocation: "\u8054\u901A2/4G\u4E0B\u884C",
-        status: "\u5408\u6CD5",
-        color: '#FF6347',
-        title: "\u8054\u901A2/4G\u4E0B\u884C",
-        description: "\u4E2D\u56FD\u8054\u901A2G/4G\u7F51\u7EDC\u4E0B\u884C\u9891\u6BB5"
-    },
-    {
-        startFrequency: 1885,
-        stopFrequency: 1915,
-        defaultStep: 100,
-        defaultBandwidth: 10000,
-        modulation: 'OFDMA',
-        demodulation: "\u89E3\u8C03",
-        allocation: "\u79FB\u52A84G",
-        status: "\u5408\u6CD5",
-        color: '#4169E1',
-        title: "\u79FB\u52A84G",
-        description: "\u4E2D\u56FD\u79FB\u52A84G\u7F51\u7EDC\u9891\u6BB5"
-    },
-    {
-        startFrequency: 1920,
-        stopFrequency: 1940,
-        defaultStep: 100,
-        defaultBandwidth: 10000,
-        modulation: 'OFDMA',
-        demodulation: "\u89E3\u8C03",
-        allocation: "\u7535\u4FE1/\u8054\u901A5G\u4E0A\u884C",
-        status: "\u5408\u6CD5",
-        color: '#8A2BE2',
-        title: "\u7535\u4FE1/\u8054\u901A5G\u4E0A\u884C",
-        description: "\u4E2D\u56FD\u7535\u4FE1/\u8054\u901A5G\u7F51\u7EDC\u4E0A\u884C\u9891\u6BB5"
-    },
-    {
-        startFrequency: 1940,
-        stopFrequency: 1965,
-        defaultStep: 100,
-        defaultBandwidth: 10000,
-        modulation: 'OFDMA',
-        demodulation: "\u89E3\u8C03",
-        allocation: "\u8054\u901A3/4/5G\u4E0A\u884C",
-        status: "\u5408\u6CD5",
-        color: '#9932CC',
-        title: "\u8054\u901A3/4/5G\u4E0A\u884C",
-        description: "\u4E2D\u56FD\u8054\u901A3G/4G/5G\u7F51\u7EDC\u4E0A\u884C\u9891\u6BB5"
-    },
-    {
-        startFrequency: 2110,
-        stopFrequency: 2130,
-        defaultStep: 100,
-        defaultBandwidth: 10000,
-        modulation: 'OFDMA',
-        demodulation: "\u89E3\u8C03",
-        allocation: "\u7535\u4FE1/\u8054\u901A5G\u4E0B\u884C",
-        status: "\u5408\u6CD5",
-        color: '#8FBC8F',
-        title: "\u7535\u4FE1/\u8054\u901A5G\u4E0B\u884C",
-        description: "\u4E2D\u56FD\u7535\u4FE1/\u8054\u901A5G\u7F51\u7EDC\u4E0B\u884C\u9891\u6BB5"
-    },
-    {
-        startFrequency: 2300,
-        stopFrequency: 2320,
-        defaultStep: 100,
-        defaultBandwidth: 10000,
-        modulation: 'OFDMA',
-        demodulation: "\u89E3\u8C03",
-        allocation: "\u8054\u901A4G",
-        status: "\u5408\u6CD5",
-        color: '#2F4F4F',
-        title: "\u8054\u901A4G",
-        description: "\u4E2D\u56FD\u8054\u901A4G\u7F51\u7EDC\u9891\u6BB5"
-    },
-    {
-        startFrequency: 2320,
-        stopFrequency: 2370,
-        defaultStep: 100,
-        defaultBandwidth: 10000,
-        modulation: 'OFDMA',
-        demodulation: "\u89E3\u8C03",
-        allocation: "\u79FB\u52A84G",
-        status: "\u5408\u6CD5",
-        color: '#00CED1',
-        title: "\u79FB\u52A84G",
-        description: "\u4E2D\u56FD\u79FB\u52A84G\u7F51\u7EDC\u9891\u6BB5"
-    },
-    {
-        startFrequency: 2400,
-        stopFrequency: 2500,
-        defaultStep: 1,
-        defaultBandwidth: 20,
-        modulation: 'OFDM',
-        demodulation: "\u89E3\u8C03",
-        allocation: 'ISM 2.4GHz',
-        status: "\u5408\u6CD5",
-        color: '#A0522D',
-        title: 'ISM 2.4GHz',
-        description: "WIFI\u3001\u84DD\u7259\u3001\u65E0\u4EBA\u673A\u7B49\u4F7F\u7528\u9891\u6BB5"
-    },
-    {
-        startFrequency: 2515,
-        stopFrequency: 2675,
-        defaultStep: 100,
-        defaultBandwidth: 10000,
-        modulation: 'OFDMA',
-        demodulation: "\u89E3\u8C03",
-        allocation: "\u79FB\u52A85G/4G",
-        status: "\u5408\u6CD5",
-        color: '#BA55D3',
-        title: "\u79FB\u52A85G/4G",
-        description: "\u4E2D\u56FD\u79FB\u52A85G\u548C4G\u7F51\u7EDC\u9891\u6BB5"
-    },
-    {
-        startFrequency: 3300,
-        stopFrequency: 3600,
-        defaultStep: 100,
-        defaultBandwidth: 10000,
-        modulation: 'OFDMA',
-        demodulation: "\u89E3\u8C03",
-        allocation: "5G\u9891\u6BB5",
-        status: "\u5408\u6CD5",
-        color: '#66CDAA',
-        title: "5G\u9891\u6BB5",
-        description: "\u7535\u4FE1\u3001\u8054\u901A\u3001\u5E7F\u75355G\u7F51\u7EDC\u9891\u6BB5"
-    },
-    {
-        startFrequency: 4800,
-        stopFrequency: 4900,
-        defaultStep: 100,
-        defaultBandwidth: 10000,
-        modulation: 'OFDMA',
-        demodulation: "\u89E3\u8C03",
-        allocation: "\u79FB\u52A85G",
-        status: "\u5408\u6CD5",
-        color: '#9370DB',
-        title: "\u79FB\u52A85G",
-        description: "\u4E2D\u56FD\u79FB\u52A85G\u7F51\u7EDC\u9891\u6BB5"
-    },
-    {
-        startFrequency: 4900,
-        stopFrequency: 4960,
-        defaultStep: 100,
-        defaultBandwidth: 10000,
-        modulation: 'OFDMA',
-        demodulation: "\u89E3\u8C03",
-        allocation: "\u5E7F\u75355G",
-        status: "\u5408\u6CD5",
-        color: '#3CB371',
-        title: "\u5E7F\u75355G",
-        description: "\u4E2D\u56FD\u5E7F\u75355G\u7F51\u7EDC\u9891\u6BB5"
-    },
-    {
-        startFrequency: 5725,
-        stopFrequency: 5875.5,
-        defaultStep: 5,
-        defaultBandwidth: 20,
-        modulation: 'OFDM',
-        demodulation: "\u89E3\u8C03",
-        allocation: 'ISM 5GHz',
-        status: "\u5408\u6CD5",
-        color: '#7FFFD4',
-        title: 'ISM 5GHz',
-        description: "WIFI\u3001\u65E0\u4EBA\u673A\u7B49\u4F7F\u7528\u9891\u6BB5"
-    }
-];
-const originalColors = originalFrequencyAllocationData.map((item)=>item.color);
-function hexToHsl(hex) {
-    const r = parseInt(hex.slice(1, 3), 16) / 255;
-    const g = parseInt(hex.slice(3, 5), 16) / 255;
-    const b = parseInt(hex.slice(5, 7), 16) / 255;
-    const max = Math.max(r, g, b);
-    const min = Math.min(r, g, b);
-    let h = 0;
-    let s = 0;
-    const l = (max + min) / 2;
-    if (max !== min) {
-        const d = max - min;
-        s = l > 0.5 ? d / (2 - max - min) : d / (max + min);
-        switch(max){
-            case r:
-                h = (g - b) / d + (g < b ? 6 : 0);
-                break;
-            case g:
-                h = (b - r) / d + 2;
-                break;
-            case b:
-                h = (r - g) / d + 4;
-                break;
-        }
-        h /= 6;
-    }
-    return {
-        h: 360 * h,
-        s: 100 * s,
-        l: 100 * l
-    };
-}
-const sortedColors = [
-    ...originalColors
-].map((color)=>({
-        color,
-        hsl: hexToHsl(color)
-    })).sort((a, b)=>{
-    if (Math.abs(a.hsl.h - b.hsl.h) > 10) return a.hsl.h - b.hsl.h;
-    return a.hsl.l - b.hsl.l;
-}).map((item)=>item.color);
-function sortAndRecolorFrequencyAllocationData(data) {
-    const sortedData = [
-        ...data
-    ].sort((a, b)=>a.startFrequency - b.startFrequency);
-    return sortedData.map((item, index)=>{
-        const totalBands = sortedData.length;
-        const colorCount = sortedColors.length;
-        const startColorIndex = Math.floor(index / totalBands * colorCount);
-        const endColorIndex = Math.floor((index + 1) / totalBands * colorCount);
-        const startColor = sortedColors[Math.min(startColorIndex, colorCount - 1)];
-        const endColor = sortedColors[Math.min(endColorIndex, colorCount - 1)];
-        const finalEndColor = index === totalBands - 1 ? sortedColors[colorCount - 1] : endColor;
-        return {
-            ...item,
-            color: startColor,
-            gradientColors: [
-                startColor,
-                finalEndColor
-            ]
-        };
-    });
-}
-const frequencyAllocationData = sortAndRecolorFrequencyAllocationData(originalFrequencyAllocationData);
 function defaultState_createParams() {
     return {
         globalID: '',
@@ -4779,7 +4293,7 @@ function defaultState_createParams() {
         frequencyAllocation: {
             show: true,
             display: true,
-            data: frequencyAllocationData
+            data: []
         },
         timeRange: 0,
         levelStream: {
@@ -4856,7 +4370,7 @@ function useVirtualRange({ unit, realRange, step, globalID }) {
     let { offset, flaw } = tools_defaultData;
     let range = realRange;
     let renderRange = realRange;
-    if (isdBm(unit)) {
+    if ((0, utils.Bp)(unit)) {
         const diff = dBuV2dBm(0);
         flaw = diff % step;
         offset = diff - flaw;
@@ -4881,7 +4395,7 @@ function useVirtualRange({ unit, realRange, step, globalID }) {
 function range2realRange({ range, unit, globalID }) {
     let realRange = range;
     let renderRange = range;
-    if (isdBm(unit)) {
+    if ((0, utils.Bp)(unit)) {
         const { offset, flaw } = VIRTUAL_RANGE(globalID);
         realRange = [
             range[0] - offset,
@@ -4898,7 +4412,7 @@ function range2realRange({ range, unit, globalID }) {
     };
 }
 function getVirtualLevel(unit, v) {
-    const dbm = isdBm(unit);
+    const dbm = (0, utils.Bp)(unit);
     return dbm ? dBuV2dBm(v) : v;
 }
 function mergeParameter(key, params, state) {
@@ -4906,7 +4420,7 @@ function mergeParameter(key, params, state) {
     const p = preset[key];
     if (!params) return p;
     if ('object' != typeof params || null === params) return params;
-    return mergeObjects(p, params);
+    return (0, utils.PM)(p, params);
 }
 const useParamEffect = (paramName, paramValue, state, dispatch)=>{
     (0, __WEBPACK_EXTERNAL_MODULE_react__.useEffect)(()=>{
@@ -4962,7 +4476,7 @@ const Params_Params = (props)=>{
         const axisY = props.axisY;
         if (axisY && globalID) {
             const { range, unit } = axisY;
-            if (range?.[0] !== void 0 && (unit && isdBm(unit) && state.axisY.unit !== unit || range[0] !== state.axisY.range[0] && isdBm(state.axisY.unit))) {
+            if (range?.[0] !== void 0 && (unit && (0, utils.Bp)(unit) && state.axisY.unit !== unit || range[0] !== state.axisY.range[0] && (0, utils.Bp)(state.axisY.unit))) {
                 const { realRange, renderRange } = range2realRange({
                     range,
                     unit,
@@ -4978,7 +4492,7 @@ const Params_Params = (props)=>{
                         axisY: mergeParameter('axisY', updatedAxisY, state)
                     }
                 });
-            } else if (unit || isdBm(state.axisY.unit) || !range) dispatch({
+            } else if (unit || (0, utils.Bp)(state.axisY.unit) || !range) dispatch({
                 payload: {
                     axisY: mergeParameter('axisY', axisY, state)
                 }
@@ -5026,7 +4540,7 @@ function useStore_useStore() {
 }
 const Store = (props)=>{
     const { children } = props;
-    const [state, dispatchBase] = (0, __WEBPACK_EXTERNAL_MODULE_react__.useReducer)(reducer, mergeObjects(defaultState_createParams(), props));
+    const [state, dispatchBase] = (0, __WEBPACK_EXTERNAL_MODULE_react__.useReducer)(reducer, (0, utils.PM)(defaultState_createParams(), props));
     const dispatch = (0, __WEBPACK_EXTERNAL_MODULE_react__.useCallback)((action)=>{
         if (action?.payload) dispatchBase(action);
     }, []);
@@ -5121,7 +4635,7 @@ const Container = (props)=>{
     const { children, style } = props;
     const { state: { system }, dispatch } = useStore_useStore();
     const ref = (0, __WEBPACK_EXTERNAL_MODULE_react__.useRef)(null);
-    const globalID = (0, __WEBPACK_EXTERNAL_MODULE_react__.useMemo)(()=>createGUID(), []);
+    const globalID = (0, __WEBPACK_EXTERNAL_MODULE_react__.useMemo)(()=>(0, utils.SF)(), []);
     (0, __WEBPACK_EXTERNAL_MODULE_react__.useEffect)(()=>{
         if (globalID) dispatch({
             payload: {
@@ -5136,7 +4650,7 @@ const Container = (props)=>{
         if (globalID) {
             let first = true;
             resizeObserver = new ResizeObserver(()=>{
-                if (!first) throttleTimer(()=>{
+                if (!first) (0, utils.g9)(()=>{
                     PUB_SUB(globalID)({
                         pstype: constants_PSType.Resize
                     });
@@ -5229,10 +4743,10 @@ useChart_styles_module_options.domAPI = styleDomAPI_default();
 useChart_styles_module_options.insertStyleElement = insertStyleElement_default();
 injectStylesIntoStyleTag_default()(useChart_styles_module.Z, useChart_styles_module_options);
 const hooks_useChart_styles_module = useChart_styles_module.Z && useChart_styles_module.Z.locals ? useChart_styles_module.Z.locals : void 0;
-const useChart = (props)=>{
+const useChart_useChart = (props)=>{
     const { state: { globalID } } = useStore_useStore();
     const { Render, params, onIDChange } = props;
-    const id = (0, __WEBPACK_EXTERNAL_MODULE_react__.useMemo)(()=>createGUID(), []);
+    const id = (0, __WEBPACK_EXTERNAL_MODULE_react__.useMemo)(()=>(0, utils.SF)(), []);
     const [chart, init] = (0, __WEBPACK_EXTERNAL_MODULE_react__.useState)();
     (0, __WEBPACK_EXTERNAL_MODULE_react__.useEffect)(()=>{
         if (id && globalID) {
@@ -5276,7 +4790,7 @@ const useChart = (props)=>{
         Chart
     };
 };
-const hooks_useChart = useChart;
+const useChart = useChart_useChart;
 const tools = (globalID, name, func)=>subscription_createSubscriptionManager(`passThrough-${globalID}-${name}`, '0', func);
 class engine_Engine {
     state = {
@@ -5625,7 +5139,7 @@ class Gauge extends engine_Engine {
     }
     drawLimit() {
         const { data: { limit }, range: [min, max], canvas, ctx, baseWidth, padding, lineWidth, fillStylePrimary } = this.state;
-        if (!isNumberAlias(limit)) return;
+        if (!(0, utils.Ri)(limit)) return;
         const width = 3 * baseWidth;
         const height = canvas.height - 2 * padding;
         const x = (canvas.width - width) / 2;
@@ -6034,7 +5548,7 @@ class Heatmap extends engine_Engine {
         const { range = this.state.range, colors = this.state.colors } = e;
         if (range && colors) {
             const [rangeMin, rangeMax] = range;
-            if (isNumberAlias(rangeMax) && isNumberAlias(rangeMax) && rangeMin < rangeMax) if (this.state.CI) this.state.CI.setColors(colors, rangeMin, rangeMax, 0.1);
+            if ((0, utils.Ri)(rangeMax) && (0, utils.Ri)(rangeMax) && rangeMin < rangeMax) if (this.state.CI) this.state.CI.setColors(colors, rangeMin, rangeMax, 0.1);
             else this.updateProps({
                 CI: new ColorInterpolator_ColorInterpolator(colors, rangeMin, rangeMax, 0.1)
             });
@@ -6070,7 +5584,7 @@ class Heatmap extends engine_Engine {
     render(data) {
         if (data?.length >= 0) {
             this.state.data = data;
-            utils_throttle(()=>{
+            (0, utils.P2)(()=>{
                 this.draw();
             })();
         }
@@ -6098,7 +5612,7 @@ class IQ extends engine_Engine {
     render(data) {
         if (data.IData && data.QData) {
             this.state.data = data;
-            utils_throttle(()=>{
+            (0, utils.P2)(()=>{
                 this.draw();
             })();
         }
@@ -6165,7 +5679,7 @@ class iqEye_IQ extends engine_Engine {
     render(data) {
         if (data.IData && data.QData) {
             this.state.data = data;
-            utils_throttle(()=>{
+            (0, utils.P2)(()=>{
                 this.draw();
             })();
         }
@@ -6278,19 +5792,19 @@ class iqEye_IQ extends engine_Engine {
         }
     }
 }
-var type_OrientationType = /*#__PURE__*/ function(OrientationType) {
-    OrientationType["Horizontal"] = "horizontal";
-    OrientationType["Vertical"] = "vertical";
-    return OrientationType;
+var type_OrientationType = /*#__PURE__*/ function(OrientationType1) {
+    OrientationType1["Horizontal"] = "horizontal";
+    OrientationType1["Vertical"] = "vertical";
+    return OrientationType1;
 }({});
-var type_GraphicType = /*#__PURE__*/ function(GraphicType) {
-    GraphicType["Circle"] = "circle";
-    GraphicType["Rect"] = "rect";
-    GraphicType["Line"] = "line";
-    GraphicType["Stepline"] = "stepline";
-    GraphicType["Bar"] = "bar";
-    GraphicType["Area"] = "area";
-    return GraphicType;
+var type_GraphicType = /*#__PURE__*/ function(GraphicType1) {
+    GraphicType1["Circle"] = "circle";
+    GraphicType1["Rect"] = "rect";
+    GraphicType1["Line"] = "line";
+    GraphicType1["Stepline"] = "stepline";
+    GraphicType1["Bar"] = "bar";
+    GraphicType1["Area"] = "area";
+    return GraphicType1;
 }({});
 class Series extends engine_Engine {
     init(props) {
@@ -6347,20 +5861,19 @@ class Series extends engine_Engine {
                 thickness: 1,
                 display: true,
                 color: '#000000',
-                type: type_GraphicType.Line,
+                type: type_GraphicType.Stepline,
                 data: void 0,
                 path: void 0,
                 orientation: type_OrientationType.Vertical,
                 ...series[name],
                 ...e
             };
-            if ('templateData' === e.name) console.log(series[name]);
             this.draw();
         }
     }
     render(e) {
         e && this.setSeries(e);
-        utils_throttle(()=>{
+        (0, utils.P2)(()=>{
             this.draw();
         })();
     }
@@ -6533,27 +6046,486 @@ class Series extends engine_Engine {
             if (type === type_GraphicType.Bar) if (orientation === type_OrientationType.Horizontal) {
                 const h = height / len;
                 const hh = Math.round(h);
-                for(let i = 0; i < len; i += 1){
-                    const y = Math.round(height - (i + 1) * h);
-                    const w = Math.round((data[i] - min) / rangeY * width);
-                    const x = width - w;
-                    ctx.beginPath();
-                    ctx.rect(x, y, w, hh);
-                    ctx.fillStyle = color;
-                    ctx.fill();
-                }
-            } else for(let i = 0; i < len; i += 1){
-                const startX = Math.floor(i * width / len);
-                const endX = Math.floor((i + 1) * width / len);
-                const w = endX - startX;
-                const h = Math.round((data[i] - min) / rangeY * height);
-                ctx.beginPath();
-                ctx.rect(startX, 0, w, h);
-                ctx.fillStyle = this.state.barValue2Color ? this.state.CI.getColor(data[i]).hax : color;
-                ctx.fill();
+                for(let i = 0; i < len; i += 1){
+                    const y = Math.round(height - (i + 1) * h);
+                    const w = Math.round((data[i] - min) / rangeY * width);
+                    const x = width - w;
+                    ctx.beginPath();
+                    ctx.rect(x, y, w, hh);
+                    ctx.fillStyle = color;
+                    ctx.fill();
+                }
+            } else for(let i = 0; i < len; i += 1){
+                const startX = Math.floor(i * width / len);
+                const endX = Math.floor((i + 1) * width / len);
+                const w = endX - startX;
+                const h = Math.round((data[i] - min) / rangeY * height);
+                ctx.beginPath();
+                ctx.rect(startX, 0, w, h);
+                ctx.fillStyle = this.state.barValue2Color ? this.state.CI.getColor(data[i]).hax : color;
+                ctx.fill();
+            }
+        }
+        ctx.restore();
+    }
+}
+class webglEngine_WebGLEngine {
+    state = {
+        id: '',
+        container: void 0,
+        canvas: null,
+        ctx: null,
+        range: [
+            -20,
+            100
+        ]
+    };
+    constructor(props){
+        this.updateProps(props);
+        this.init(props);
+    }
+    updateProps(e) {
+        this.state = {
+            ...this.state,
+            ...e
+        };
+    }
+    init(_p) {
+        const { id } = this.state;
+        const container = document.getElementById(id);
+        const canvas = document.createElement('canvas');
+        const gl = canvas.getContext('webgl') || canvas.getContext('experimental-webgl');
+        if (!gl) return;
+        canvas.style.transform = 'scaleY(-1)';
+        this.updateProps({
+            container,
+            canvas,
+            gl
+        });
+        container?.appendChild(canvas);
+        this.initWebGL();
+        this.resize(false);
+    }
+    initWebGL() {
+        const { gl } = this.state;
+        if (!gl) return;
+        const program = this.createShaderProgram();
+        const positionBuffer = gl.createBuffer();
+        const colorBuffer = gl.createBuffer();
+        this.updateProps({
+            program,
+            buffers: {
+                position: positionBuffer,
+                color: colorBuffer
+            }
+        });
+        gl.viewport(0, 0, gl.canvas.width, gl.canvas.height);
+        gl.enable(gl.BLEND);
+        gl.blendFunc(gl.SRC_ALPHA, gl.ONE_MINUS_SRC_ALPHA);
+    }
+    createShaderProgram() {
+        const { gl } = this.state;
+        if (!gl) return null;
+        const vertexShaderSource = `
+      attribute vec2 a_position;
+      attribute vec4 a_color;
+      uniform vec2 u_resolution;
+      varying vec4 v_color;
+      
+      void main() {
+        // \u{5C06}\u{50CF}\u{7D20}\u{5750}\u{6807}\u{8F6C}\u{6362}\u{4E3A}\u{88C1}\u{526A}\u{7A7A}\u{95F4}\u{5750}\u{6807}
+        vec2 zeroToOne = a_position / u_resolution;
+        vec2 zeroToTwo = zeroToOne * 2.0;
+        vec2 clipSpace = zeroToTwo - 1.0;
+        
+        gl_Position = vec4(clipSpace * vec2(1, -1), 0, 1);
+        v_color = a_color;
+      }
+    `;
+        const fragmentShaderSource = `
+      precision mediump float;
+      varying vec4 v_color;
+      
+      void main() {
+        gl_FragColor = v_color;
+      }
+    `;
+        const vertexShader = this.createShader(gl, gl.VERTEX_SHADER, vertexShaderSource);
+        const fragmentShader = this.createShader(gl, gl.FRAGMENT_SHADER, fragmentShaderSource);
+        if (!vertexShader || !fragmentShader) return null;
+        const program = gl.createProgram();
+        if (!program) return null;
+        gl.attachShader(program, vertexShader);
+        gl.attachShader(program, fragmentShader);
+        gl.linkProgram(program);
+        if (!gl.getProgramParameter(program, gl.LINK_STATUS)) return null;
+        return program;
+    }
+    createShader(gl, type, source) {
+        const shader = gl.createShader(type);
+        if (!shader) return null;
+        gl.shaderSource(shader, source);
+        gl.compileShader(shader);
+        if (!gl.getShaderParameter(shader, gl.COMPILE_STATUS)) {
+            gl.deleteShader(shader);
+            return null;
+        }
+        return shader;
+    }
+    resize(draw = true) {
+        const { canvas, container, gl } = this.state;
+        const { clientWidth, clientHeight } = container;
+        if (!clientWidth || !clientHeight) return;
+        canvas.width = clientWidth;
+        canvas.height = clientHeight;
+        if (gl) gl.viewport(0, 0, clientWidth, clientHeight);
+        if (draw) setTimeout(()=>{
+            this.draw();
+        });
+    }
+    clear() {
+        const { gl } = this.state;
+        if (!gl) return;
+        gl.clearColor(0.0, 0.0, 0.0, 0.0);
+        gl.clear(gl.COLOR_BUFFER_BIT);
+    }
+    draw() {}
+    drawLines(vertices, colors) {
+        const { gl, program, buffers } = this.state;
+        if (!gl || !program || !buffers) return;
+        gl.useProgram(program);
+        const resolutionLocation = gl.getUniformLocation(program, 'u_resolution');
+        gl.uniform2f(resolutionLocation, gl.canvas.width, gl.canvas.height);
+        const positionLocation = gl.getAttribLocation(program, 'a_position');
+        gl.bindBuffer(gl.ARRAY_BUFFER, buffers.position);
+        gl.bufferData(gl.ARRAY_BUFFER, vertices, gl.STATIC_DRAW);
+        gl.enableVertexAttribArray(positionLocation);
+        gl.vertexAttribPointer(positionLocation, 2, gl.FLOAT, false, 0, 0);
+        const colorLocation = gl.getAttribLocation(program, 'a_color');
+        gl.bindBuffer(gl.ARRAY_BUFFER, buffers.color);
+        gl.bufferData(gl.ARRAY_BUFFER, colors, gl.STATIC_DRAW);
+        gl.enableVertexAttribArray(colorLocation);
+        gl.vertexAttribPointer(colorLocation, 4, gl.FLOAT, false, 0, 0);
+        const vertexCount = vertices.length / 2;
+        gl.drawArrays(gl.TRIANGLES, 0, vertexCount);
+    }
+    drawTriangles(vertices, colors) {
+        const { gl, program, buffers } = this.state;
+        if (!gl || !program || !buffers) return;
+        gl.useProgram(program);
+        const resolutionLocation = gl.getUniformLocation(program, 'u_resolution');
+        gl.uniform2f(resolutionLocation, gl.canvas.width, gl.canvas.height);
+        const positionLocation = gl.getAttribLocation(program, 'a_position');
+        gl.bindBuffer(gl.ARRAY_BUFFER, buffers.position);
+        gl.bufferData(gl.ARRAY_BUFFER, vertices, gl.STATIC_DRAW);
+        gl.enableVertexAttribArray(positionLocation);
+        gl.vertexAttribPointer(positionLocation, 2, gl.FLOAT, false, 0, 0);
+        const colorLocation = gl.getAttribLocation(program, 'a_color');
+        gl.bindBuffer(gl.ARRAY_BUFFER, buffers.color);
+        gl.bufferData(gl.ARRAY_BUFFER, colors, gl.STATIC_DRAW);
+        gl.enableVertexAttribArray(colorLocation);
+        gl.vertexAttribPointer(colorLocation, 4, gl.FLOAT, false, 0, 0);
+        const vertexCount = vertices.length / 2;
+        gl.drawArrays(gl.TRIANGLES, 0, vertexCount);
+    }
+    setupBuffers(vertices, colors) {
+        const { gl, program, buffers } = this.state;
+        if (!gl || !program || !buffers) return;
+        gl.useProgram(program);
+        const resolutionLocation = gl.getUniformLocation(program, 'u_resolution');
+        gl.uniform2f(resolutionLocation, gl.canvas.width, gl.canvas.height);
+        const positionLocation = gl.getAttribLocation(program, 'a_position');
+        gl.bindBuffer(gl.ARRAY_BUFFER, buffers.position);
+        gl.bufferData(gl.ARRAY_BUFFER, vertices, gl.STATIC_DRAW);
+        gl.enableVertexAttribArray(positionLocation);
+        gl.vertexAttribPointer(positionLocation, 2, gl.FLOAT, false, 0, 0);
+        const colorLocation = gl.getAttribLocation(program, 'a_color');
+        gl.bindBuffer(gl.ARRAY_BUFFER, buffers.color);
+        gl.bufferData(gl.ARRAY_BUFFER, colors, gl.STATIC_DRAW);
+        gl.enableVertexAttribArray(colorLocation);
+        gl.vertexAttribPointer(colorLocation, 4, gl.FLOAT, false, 0, 0);
+    }
+}
+class WebGLSeries extends null {
+    vertexData = new Float32Array(0);
+    colorData = new Float32Array(0);
+    throttledDraw = throttle(()=>{
+        this.draw();
+    });
+    init(props) {
+        super.init(props);
+        const { series } = props;
+        this.updateProps({
+            interval: 0,
+            series: {}
+        });
+        this.setRange(this.state.range);
+        series?.forEach((e)=>{
+            this.setSeries(e);
+        });
+    }
+    updateProps(e) {
+        super.updateProps(e);
+        const { colors = this.state.colors } = e;
+        if (this.state.barValue2Color && !this.state.CI) this.updateProps({
+            CI: new ColorInterpolator(colors, 0, 100, 0.1)
+        });
+    }
+    clear() {
+        super.clear();
+        const { series } = this.state;
+        const seriesArray = Object.entries(series);
+        seriesArray.forEach(([name, i])=>{
+            series[name] = {
+                ...i,
+                data: void 0
+            };
+        });
+    }
+    setRange(range) {
+        this.updateProps({
+            range: [
+                ...range,
+                range[1] - range[0]
+            ]
+        });
+        this.draw();
+    }
+    setIntervel(interval) {
+        if (!interval) return;
+        this.updateProps({
+            interval
+        });
+    }
+    setSeries(e) {
+        if (e?.name) {
+            const { name } = e;
+            const { series } = this.state;
+            series[name] = {
+                thickness: 1,
+                display: true,
+                color: '#000000',
+                type: GraphicType.Line,
+                data: void 0,
+                path: void 0,
+                orientation: OrientationType.Vertical,
+                ...series[name],
+                ...e
+            };
+        }
+    }
+    render(e) {
+        e && this.setSeries(e);
+        this.throttledDraw();
+    }
+    hexToRgba(hex, alpha = 1) {
+        const r = Number.parseInt(hex.slice(1, 3), 16) / 255;
+        const g = Number.parseInt(hex.slice(3, 5), 16) / 255;
+        const b = Number.parseInt(hex.slice(5, 7), 16) / 255;
+        return [
+            r,
+            g,
+            b,
+            alpha
+        ];
+    }
+    generateLineVertices(data, color, thickness) {
+        const vertices = [];
+        const colors = [];
+        const [r, g, b, a] = this.hexToRgba(color);
+        const { range: [min, , rangeY], canvas: { width, height } } = this.state;
+        const len = data.length;
+        const per = width / len;
+        const halfThickness = thickness / 2;
+        for(let i = 0; i < len - 1; i++){
+            const value1 = data[i];
+            const value2 = data[i + 1];
+            if (void 0 === value1 || void 0 === value2 || Number.isNaN(value1) || Number.isNaN(value2)) continue;
+            const x1 = (i + 0.5) * per;
+            const y1 = (value1 - min) / rangeY * height;
+            const x2 = (i + 1.5) * per;
+            const y2 = (value2 - min) / rangeY * height;
+            const dx = x2 - x1;
+            const dy = y2 - y1;
+            const length = Math.sqrt(dx * dx + dy * dy);
+            const nx = -dy / length * halfThickness;
+            const ny = dx / length * halfThickness;
+            vertices.push(x1 + nx, y1 + ny, x1 - nx, y1 - ny, x2 + nx, y2 + ny);
+            vertices.push(x1 - nx, y1 - ny, x2 - nx, y2 - ny, x2 + nx, y2 + ny);
+            for(let j = 0; j < 6; j++)colors.push(r, g, b, a);
+        }
+        return {
+            vertices,
+            colors
+        };
+    }
+    generateSteplineVertices(data, color, thickness) {
+        const vertices = [];
+        const colors = [];
+        const [r, g, b, a] = this.hexToRgba(color);
+        const { range: [min, , rangeY], canvas: { width, height } } = this.state;
+        const len = data.length;
+        const per = width / len;
+        const halfThickness = thickness / 2;
+        for(let i = 0; i < len - 1; i++){
+            const value1 = data[i];
+            const value2 = data[i + 1];
+            if (void 0 === value1 || void 0 === value2 || Number.isNaN(value1) || Number.isNaN(value2)) continue;
+            const x1 = i * per;
+            const y1 = (value1 - min) / rangeY * height;
+            const x2 = (i + 1) * per;
+            const y2 = (value2 - min) / rangeY * height;
+            vertices.push(x1, y1 - halfThickness, x1, y1 + halfThickness, x2, y1 - halfThickness, x1, y1 + halfThickness, x2, y1 + halfThickness, x2, y1 - halfThickness);
+            vertices.push(x2 - halfThickness, y1, x2 + halfThickness, y1, x2 - halfThickness, y2, x2 + halfThickness, y1, x2 + halfThickness, y2, x2 - halfThickness, y2);
+            for(let j = 0; j < 12; j++)colors.push(r, g, b, a);
+        }
+        return {
+            vertices,
+            colors
+        };
+    }
+    generateBarVertices(data, color, orientation) {
+        const vertices = [];
+        const colors = [];
+        const [r, g, b, a] = this.hexToRgba(color);
+        const { range: [min, , rangeY], canvas: { width, height } } = this.state;
+        const len = data.length;
+        if (orientation === OrientationType.Vertical) for(let i = 0; i < len; i++){
+            const value = data[i];
+            if (void 0 === value || Number.isNaN(value)) continue;
+            const startX = Math.floor(i * width / len);
+            const endX = Math.floor((i + 1) * width / len);
+            const barHeight = (value - min) / rangeY * height;
+            vertices.push(startX, 0, endX, 0, startX, barHeight, endX, 0, endX, barHeight, startX, barHeight);
+            for(let j = 0; j < 6; j++)if (this.state.barValue2Color && this.state.CI) {
+                const colorObj = this.state.CI.getColor(value);
+                const [cr, cg, cb] = this.hexToRgba(colorObj.hax);
+                colors.push(cr, cg, cb, a);
+            } else colors.push(r, g, b, a);
+        }
+        else {
+            const h = height / len;
+            for(let i = 0; i < len; i++){
+                const value = data[i];
+                if (void 0 === value || Number.isNaN(value)) continue;
+                const y = Math.round(height - (i + 1) * h);
+                const w = (value - min) / rangeY * width;
+                const x = width - w;
+                const hh = Math.round(h);
+                vertices.push(x, y, width, y, x, y + hh, width, y, width, y + hh, x, y + hh);
+                for(let j = 0; j < 6; j++)colors.push(r, g, b, a);
             }
         }
-        ctx.restore();
+        return {
+            vertices,
+            colors
+        };
+    }
+    generateCircleVertices(data, color, thickness) {
+        const vertices = [];
+        const colors = [];
+        const [r, g, b, a] = this.hexToRgba(color);
+        const { range: [min, , rangeY], canvas: { width, height } } = this.state;
+        const len = data.length;
+        const per = width / len;
+        const radius = thickness / 2;
+        const segments = 16;
+        for(let i = 0; i < len; i++){
+            const value = data[i];
+            if (void 0 === value || Number.isNaN(value)) continue;
+            const centerX = (i + 0.5) * per;
+            const centerY = (value - min) / rangeY * height;
+            for(let j = 0; j < segments; j++){
+                const angle1 = j / segments * 2 * Math.PI;
+                const angle2 = (j + 1) / segments * 2 * Math.PI;
+                vertices.push(centerX, centerY, centerX + Math.cos(angle1) * radius, centerY + Math.sin(angle1) * radius, centerX + Math.cos(angle2) * radius, centerY + Math.sin(angle2) * radius);
+                for(let k = 0; k < 3; k++)colors.push(r, g, b, a);
+            }
+        }
+        return {
+            vertices,
+            colors
+        };
+    }
+    generateRectVertices(data, color, thickness) {
+        const vertices = [];
+        const colors = [];
+        const [r, g, b, a] = this.hexToRgba(color);
+        const { range: [min, , rangeY], canvas: { width, height } } = this.state;
+        const len = data.length;
+        const per = width / len;
+        const side = thickness;
+        const halfSide = side / 2;
+        for(let i = 0; i < len; i++){
+            const value = data[i];
+            if (void 0 === value || Number.isNaN(value)) continue;
+            const centerX = (i + 0.5) * per;
+            const centerY = (value - min) / rangeY * height;
+            vertices.push(centerX - halfSide, centerY - halfSide, centerX + halfSide, centerY - halfSide, centerX - halfSide, centerY + halfSide, centerX + halfSide, centerY - halfSide, centerX + halfSide, centerY + halfSide, centerX - halfSide, centerY + halfSide);
+            for(let j = 0; j < 6; j++)colors.push(r, g, b, a);
+        }
+        return {
+            vertices,
+            colors
+        };
+    }
+    draw() {
+        const { series, gl, program, buffers } = this.state;
+        if (!gl || !program || !buffers) return;
+        gl.clearColor(0.0, 0.0, 0.0, 0.0);
+        gl.clear(gl.COLOR_BUFFER_BIT);
+        const seriesArray = Object.values(series);
+        const allVertices = [];
+        const allColors = [];
+        for (const seriesConfig of seriesArray){
+            const { display, color, type, data, orientation, thickness } = seriesConfig;
+            if (!data || !display) continue;
+            let result;
+            switch(type){
+                case GraphicType.Line:
+                    result = this.generateLineVertices(data, color, thickness || 1);
+                    this.drawLines(new Float32Array(result.vertices), new Float32Array(result.colors));
+                    break;
+                case GraphicType.Stepline:
+                    result = this.generateSteplineVertices(data, color, thickness || 1);
+                    this.drawLines(new Float32Array(result.vertices), new Float32Array(result.colors));
+                    break;
+                case GraphicType.Bar:
+                    result = this.generateBarVertices(data, color, orientation || OrientationType.Vertical);
+                    this.drawTriangles(new Float32Array(result.vertices), new Float32Array(result.colors));
+                    break;
+                case GraphicType.Circle:
+                    result = this.generateCircleVertices(data, color, thickness || 4);
+                    this.drawTriangles(new Float32Array(result.vertices), new Float32Array(result.colors));
+                    break;
+                case GraphicType.Rect:
+                    result = this.generateRectVertices(data, color, thickness || 3);
+                    this.drawTriangles(new Float32Array(result.vertices), new Float32Array(result.colors));
+                    break;
+            }
+            const vertices = result.vertices;
+            const colors = result.colors;
+            allVertices.push(...vertices);
+            allColors.push(...colors);
+        }
+        if (0 === allVertices.length) return;
+        this.vertexData = new Float32Array(allVertices);
+        this.colorData = new Float32Array(allColors);
+        gl.useProgram(program);
+        const resolutionLocation = gl.getUniformLocation(program, 'u_resolution');
+        gl.uniform2f(resolutionLocation, gl.canvas.width, gl.canvas.height);
+        const positionLocation = gl.getAttribLocation(program, 'a_position');
+        gl.bindBuffer(gl.ARRAY_BUFFER, buffers.position);
+        gl.bufferData(gl.ARRAY_BUFFER, this.vertexData, gl.STATIC_DRAW);
+        gl.enableVertexAttribArray(positionLocation);
+        gl.vertexAttribPointer(positionLocation, 2, gl.FLOAT, false, 0, 0);
+        const colorLocation = gl.getAttribLocation(program, 'a_color');
+        gl.bindBuffer(gl.ARRAY_BUFFER, buffers.color);
+        gl.bufferData(gl.ARRAY_BUFFER, this.colorData, gl.STATIC_DRAW);
+        gl.enableVertexAttribArray(colorLocation);
+        gl.vertexAttribPointer(colorLocation, 4, gl.FLOAT, false, 0, 0);
+        const vertexCount = this.vertexData.length / 2;
+        gl.drawArrays(gl.TRIANGLES, 0, vertexCount);
     }
 }
 class IQStream {
@@ -6570,14 +6542,14 @@ class IQStream {
         if (!id) return;
         this.state.chart = new Dial({
             id,
-            ...getThemeFillStyle()
+            ...(0, utils.vY)()
         });
         setTimeout(()=>{
             this.state.chart.resize();
         });
         __WEBPACK_EXTERNAL_MODULE__rfkit_theme_a11ca9cb__.themeObserver.subscribe(()=>{
             this.state.chart.updateProps({
-                ...getThemeFillStyle()
+                ...(0, utils.vY)()
             });
             this.state.chart.resize();
             this.state.chart.draw();
@@ -6599,7 +6571,7 @@ class IQStream {
 }
 const Dial_Dial = ()=>{
     const { state: { globalID } } = useStore_useStore();
-    const { chart, Chart } = hooks_useChart({
+    const { chart, Chart } = useChart({
         Render: IQStream
     });
     (0, __WEBPACK_EXTERNAL_MODULE_react__.useEffect)(()=>{
@@ -6746,7 +6718,7 @@ class render_IQStream {
         if (!id) return;
         this.state.chart = new Gauge({
             id,
-            ...getThemeFillStyle(),
+            ...(0, utils.vY)(),
             ...props
         });
         setTimeout(()=>{
@@ -6754,7 +6726,7 @@ class render_IQStream {
         });
         __WEBPACK_EXTERNAL_MODULE__rfkit_theme_a11ca9cb__.themeObserver.subscribe(()=>{
             this.state.chart.updateProps({
-                ...getThemeFillStyle()
+                ...(0, utils.vY)()
             });
             this.state.chart.resize();
             this.state.chart.draw();
@@ -6781,7 +6753,7 @@ const Gauge_padding = 20;
 const Gauge_step = 2;
 const Gauge_Gauge = ({ onChange })=>{
     const { state: { globalID, axisY: { range } } } = useStore_useStore();
-    const { chart, Chart } = hooks_useChart({
+    const { chart, Chart } = useChart({
         Render: render_IQStream,
         params: {
             padding: Gauge_padding,
@@ -6902,7 +6874,7 @@ const Ticks = (props)=>{
             for(let i = 0; i < HEATMAP_FULL_TICKS; i++){
                 const index = Math.floor((dataLength - 1) * i / (HEATMAP_FULL_TICKS - 1));
                 const data = waterfallData[index];
-                const value = data?.timestamp ? getDateTime(data.timestamp, void 0, void 0, true) : '';
+                const value = data?.timestamp ? (0, utils.Fc)(data.timestamp, void 0, void 0, true) : '';
                 values.push(value);
             }
             setTimeValues(values);
@@ -7239,7 +7211,7 @@ const FrequencyDataBoard = ({ left, updateKey, onChange })=>{
         if (0 === values.length) return null;
         index.current = Math.max(0, Math.ceil(values.length * left / 100) - 1);
         const level = getVirtualLevel(axisY.unit, values[index.current])?.toFixed(1);
-        if (!isNumberAlias(level)) return null;
+        if (!(0, utils.Ri)(level)) return null;
         return /*#__PURE__*/ (0, __WEBPACK_EXTERNAL_MODULE_react_jsx_runtime_225474f2__.jsxs)("div", {
             className: components_FrequencyDataBoard_styles_module.item,
             style: {
@@ -7387,7 +7359,7 @@ const HeatmapPopover = ({ id })=>{
                     const newValue = yValue[xIndex];
                     setValue(Number.isFinite(newValue) ? newValue.toFixed(1) : '');
                     const timestamp = yValue.timestamp;
-                    if (timestamp) setTimestamp(getDateTime(timestamp));
+                    if (timestamp) setTimestamp((0, utils.Fc)(timestamp));
                 }
             }
         }
@@ -7675,7 +7647,7 @@ const EventBus_EventBus = ({ id })=>{
     }, [
         EID
     ]);
-    const handleMouseMove = (0, __WEBPACK_EXTERNAL_MODULE_react__.useCallback)(utils_throttle((e)=>{
+    const handleMouseMove = (0, __WEBPACK_EXTERNAL_MODULE_react__.useCallback)((0, utils.P2)((e)=>{
         createMoveEventManager(EID)(e, calculateEventRelativePosition(e));
         updateCursor();
         if (dragState.current.isDragging && dragState.current.startPoint.event) {
@@ -7721,7 +7693,7 @@ const EventBus_EventBus = ({ id })=>{
     }, [
         EID
     ]);
-    const handleWheel = (0, __WEBPACK_EXTERNAL_MODULE_react__.useCallback)(utils_throttle((e)=>{
+    const handleWheel = (0, __WEBPACK_EXTERNAL_MODULE_react__.useCallback)((0, utils.P2)((e)=>{
         createWheelEventManager(EID)(-1 * e.deltaY, calculateEventRelativePosition(e));
     }), [
         EID
@@ -7832,17 +7804,17 @@ function calculateAreaInfo({ endLeft, startLeft, startTop, endTop, frequencyForm
         startCol: indices.start,
         endCol: indices.end,
         startTimestamp,
-        startTimestampFormat: getDateTime(startTimestamp),
+        startTimestampFormat: (0, utils.Fc)(startTimestamp),
         endTimestamp,
-        endTimestampFormat: getDateTime(endTimestamp),
+        endTimestampFormat: (0, utils.Fc)(endTimestamp),
         duration,
-        durationFormat: getFrequencyToFixed(duration / 1000, 3),
+        durationFormat: (0, utils.lj)(duration / 1000, 3),
         startFrequency: frequencies.start,
         startFrequencyFormat: String(frequencies.start),
         endFrequency: frequencies.end,
         endFrequencyFormat: String(frequencies.end),
         bandwidth,
-        bandwidthFormat: getFrequencyToFixed(bandwidth),
+        bandwidthFormat: (0, utils.lj)(bandwidth),
         data: waterfallData.slice(indices.bottom, indices.top + 1).map((row)=>Array.from(row.slice(indices.start, indices.end + 1)))
     };
     return result;
@@ -7997,7 +7969,7 @@ const Area = (props)=>{
                                 })
                             ]
                         }),
-                        isNumberAlias(info.durationFormat) && /*#__PURE__*/ (0, __WEBPACK_EXTERNAL_MODULE_react_jsx_runtime_225474f2__.jsxs)("div", {
+                        (0, utils.Ri)(info.durationFormat) && /*#__PURE__*/ (0, __WEBPACK_EXTERNAL_MODULE_react_jsx_runtime_225474f2__.jsxs)("div", {
                             className: HeatmapCapture_Area_styles_module.item,
                             children: [
                                 /*#__PURE__*/ (0, __WEBPACK_EXTERNAL_MODULE_react_jsx_runtime_225474f2__.jsx)("div", {
@@ -8056,7 +8028,7 @@ const RowIndex = ({ id })=>{
             const rowData = {
                 data: waterfallData[newRowIndex],
                 timestamp: newTimestamp,
-                timestampFormat: getDateTime(newTimestamp),
+                timestampFormat: (0, utils.Fc)(newTimestamp),
                 rowIndex: newRowIndex
             };
             setInfo(rowData);
@@ -8207,9 +8179,9 @@ const Slider = ({ id })=>{
         const endIndex = Math.round((100 - newPosition) / 100 * (len - 1));
         const startIndex = Math.round((100 - (newPosition + newHeight)) / 100 * (len - 1));
         const startTimestamp = heatmapData[startIndex]?.timestamp;
-        const startTimestampFormat = getDateTime(startTimestamp);
+        const startTimestampFormat = (0, utils.Fc)(startTimestamp);
         const endTimestamp = heatmapData[endIndex]?.timestamp;
-        const endTimestampFormat = getDateTime(endTimestamp);
+        const endTimestampFormat = (0, utils.Fc)(endTimestamp);
         const duration = endTimestamp - startTimestamp;
         const durationFormat = (duration / 1000).toFixed(3);
         return {
@@ -8489,7 +8461,7 @@ const Board = ({ markers, heatmapMode, onChange })=>{
                                     children: i.frequency
                                 }),
                                 heatmapMode && /*#__PURE__*/ (0, __WEBPACK_EXTERNAL_MODULE_react_jsx_runtime_225474f2__.jsx)("span", {
-                                    children: i.timestamp ? `-${getDateTime(i.timestamp).slice(11)}` : ''
+                                    children: i.timestamp ? `-${(0, utils.Fc)(i.timestamp).slice(11)}` : ''
                                 })
                             ]
                         }),
@@ -8792,7 +8764,7 @@ class Markers {
     create(e, isBatchAdd = false) {
         const { markers, labelCache, counter, data, heatmapMode, selectMax } = this.state;
         if (0 === data.length) return;
-        const id = createGUID();
+        const id = (0, utils.SF)();
         const label = counter.add();
         if (!label) return;
         labelCache.push(label);
@@ -9096,7 +9068,7 @@ class FreeMarkers extends Markers {
         if (!data || 0 === data.length) return e;
         const { peak } = e;
         let { left, top } = e;
-        const { row, col } = getRowCol(data);
+        const { row, col } = (0, utils.B5)(data);
         const splitLeft = splitZoomLeft({
             left,
             zoom,
@@ -9304,7 +9276,7 @@ class Range {
             ...db[SERIES.maxData.name],
             ...db[SERIES.minData.name]
         ];
-        const allInfo = getDimInfo(allData);
+        const allInfo = (0, utils.kL)(allData);
         let { avg } = allInfo;
         if (void 0 === avg) avg = 10;
         let step = propsStep || axisY.step;
@@ -9431,7 +9403,7 @@ class Range {
             step: this.state.axisY.step,
             globalID: this.state.globalID
         });
-        const diff = isdBm(unit) ? v.offset : 0;
+        const diff = (0, utils.Bp)(unit) ? v.offset : 0;
         const isExceedMin = min < restrict[0] - diff;
         const isExceedMax = max > restrict[1];
         let newMin = min;
@@ -9474,7 +9446,7 @@ const components_Ticks_Ticks = ({ ranging })=>{
             length: len
         }, (_, index)=>{
             const value = (restrictMax - index * step).toFixed(0);
-            if (!isNumberAlias(value)) return null;
+            if (!(0, utils.Ri)(value)) return null;
             return /*#__PURE__*/ (0, __WEBPACK_EXTERNAL_MODULE_react_jsx_runtime_225474f2__.jsx)("div", {
                 children: /*#__PURE__*/ (0, __WEBPACK_EXTERNAL_MODULE_react_jsx_runtime_225474f2__.jsx)("span", {
                     children: value
@@ -9779,17 +9751,17 @@ class Spectrum {
             id,
             range: renderRange
         });
+        this.initSeries();
+        this.useRangeAutoFocus = ()=>{
+            useRangeAutoFocus(this.state.globalID)();
+        };
+    }
+    initSeries() {
         Object.values(SERIES).forEach((config)=>{
+            if (config.name === SERIES.templateData.name) config.type = type_GraphicType.Area;
             this.setSeries(JSON.parse(JSON.stringify(config)));
             return config;
         });
-        this.setSeries({
-            ...SERIES.templateData,
-            type: type_GraphicType.Area
-        });
-        this.useRangeAutoFocus = ()=>{
-            useRangeAutoFocus(this.state.globalID)();
-        };
     }
     updateSeries(d, extraData) {
         const { series, chart } = this.state;
@@ -10159,7 +10131,7 @@ const Markers_Markers = ({ id, counter, selecter, heatmapMode = false })=>{
     ]);
     (0, __WEBPACK_EXTERNAL_MODULE_react__.useEffect)(()=>{
         if (globalID) {
-            const quark = leftSegmentsFindStep(segments);
+            const quark = (0, utils.f1)(segments);
             subscriptionKeyBus(globalID, 'marker', (e)=>{
                 const { ctrlKey, altKey, key } = e;
                 const { selected } = marker;
@@ -10454,7 +10426,7 @@ class render_Heatmap {
 const Heatmap_Heatmap = (props)=>{
     const { selecter, heatmapDefaultData } = props;
     const { state: { axisY: { realRange }, globalID } } = useStore_useStore();
-    const { id, chart, Chart } = hooks_useChart({
+    const { id, chart, Chart } = useChart({
         Render: render_Heatmap,
         params: {
             realRange,
@@ -10546,7 +10518,7 @@ const Heatmap_Chart_Chart = ({ publish, heatmapDefaultData })=>{
             const { pstype } = e;
             if (pstype === constants_PSType.Heatmap) {
                 const { data, timestamps } = e;
-                const waterfallData = convertToTimestampedArrays(data, timestamps);
+                const waterfallData = (0, utils.P9)(data, timestamps);
                 const db = withDatabase(globalID);
                 db.getAllRawData = ()=>({
                         ...getDefaultData().getAllRawData(),
@@ -10612,7 +10584,7 @@ class IQPlanisphere {
 }
 function IQEye_IQPlanisphere() {
     const { state: { globalID } } = useStore_useStore();
-    const { chart, Chart } = hooks_useChart({
+    const { chart, Chart } = useChart({
         Render: IQPlanisphere
     });
     (0, __WEBPACK_EXTERNAL_MODULE_react__.useEffect)(()=>{
@@ -10774,7 +10746,7 @@ const GridLines = ()=>{
 const components_GridLines = /*#__PURE__*/ __WEBPACK_EXTERNAL_MODULE_react__["default"].memo(GridLines);
 const IQLine = ()=>{
     const { state: { axisY: { autoranging }, globalID } } = useStore_useStore();
-    const { chart, Chart } = hooks_useChart({
+    const { chart, Chart } = useChart({
         Render: Spectrum,
         params: {
             autoranging
@@ -10807,7 +10779,7 @@ const IQLine = ()=>{
                     {
                         const { IData, QData } = d;
                         if (IData && QData) {
-                            const { min, max } = getDimInfo([
+                            const { min, max } = (0, utils.kL)([
                                 ...IData,
                                 ...QData
                             ]);
@@ -10878,7 +10850,7 @@ class render_IQPlanisphere {
 }
 function IQPlanisphere_IQPlanisphere() {
     const { state: { globalID } } = useStore_useStore();
-    const { chart, Chart } = hooks_useChart({
+    const { chart, Chart } = useChart({
         Render: render_IQPlanisphere
     });
     (0, __WEBPACK_EXTERNAL_MODULE_react__.useEffect)(()=>{
@@ -10939,7 +10911,7 @@ class IQStream_render_IQStream {
 }
 const IQStream_IQStream = ()=>{
     const { state: { globalID } } = useStore_useStore();
-    const { chart, Chart } = hooks_useChart({
+    const { chart, Chart } = useChart({
         Render: IQStream_render_IQStream
     });
     (0, __WEBPACK_EXTERNAL_MODULE_react__.useEffect)(()=>{
@@ -11004,405 +10976,975 @@ const IQ_Chart_Chart = (props)=>{
             }
         }
     });
-    const Chart = (0, __WEBPACK_EXTERNAL_MODULE_react__.useMemo)(()=>{
-        switch(type){
-            case constants_ChartType.IQEye:
-                return IQEye_IQPlanisphere;
-            case constants_ChartType.IQLine:
-                return modules_IQLine;
-            case constants_ChartType.IQPlanisphere:
-                return IQPlanisphere_IQPlanisphere;
-            case constants_ChartType.IQStream:
-                return modules_IQStream;
-            default:
-                return IQPlanisphere_IQPlanisphere;
-        }
+    const Chart = (0, __WEBPACK_EXTERNAL_MODULE_react__.useMemo)(()=>{
+        switch(type){
+            case constants_ChartType.IQEye:
+                return IQEye_IQPlanisphere;
+            case constants_ChartType.IQLine:
+                return modules_IQLine;
+            case constants_ChartType.IQPlanisphere:
+                return IQPlanisphere_IQPlanisphere;
+            case constants_ChartType.IQStream:
+                return modules_IQStream;
+            default:
+                return IQPlanisphere_IQPlanisphere;
+        }
+    }, [
+        type
+    ]);
+    return /*#__PURE__*/ (0, __WEBPACK_EXTERNAL_MODULE_react_jsx_runtime_225474f2__.jsx)(components_Container, {
+        children: /*#__PURE__*/ (0, __WEBPACK_EXTERNAL_MODULE_react_jsx_runtime_225474f2__.jsx)(Chart, {})
+    });
+};
+const IQ_Chart = IQ_Chart_Chart;
+const IQChart = (props)=>/*#__PURE__*/ (0, __WEBPACK_EXTERNAL_MODULE_react_jsx_runtime_225474f2__.jsx)(store, {
+        system: {
+            padding: false,
+            border: false
+        },
+        ...props,
+        children: /*#__PURE__*/ (0, __WEBPACK_EXTERNAL_MODULE_react_jsx_runtime_225474f2__.jsx)(IQ_Chart, {
+            ...props
+        })
+    });
+const IQ_IQ = withChartPublisher(IQChart, 'IQ');
+const lib_IQ = IQ_IQ;
+function uselevelStreamAnalyzer() {
+    const { state: { globalID, axisY: { range }, levelStream: { cacheTime, granularity } } } = useStore_useStore();
+    const analyzer = (0, __WEBPACK_EXTERNAL_MODULE_react__.useRef)(null);
+    const globalIDRef = (0, __WEBPACK_EXTERNAL_MODULE_react__.useRef)(globalID);
+    const updateLevelStreamData = (0, __WEBPACK_EXTERNAL_MODULE_react__.useCallback)((renderData)=>{
+        tools(globalIDRef.current, constants_ModuleType.Spectrum)({
+            pstype: constants_PSType.Render,
+            data: {
+                [REAL_DATA_NAME]: renderData.spectrumData
+            }
+        });
+        tools(globalIDRef.current, constants_ModuleType.LevelStream)({
+            pstype: constants_PSType.Render,
+            data: renderData.probabilityRangeData
+        });
+    }, []);
+    const handleLevelStreamUpdate = (0, __WEBPACK_EXTERNAL_MODULE_react__.useCallback)((data)=>{
+        const { probabilityRangeData, spectrumData } = data;
+        updateLevelStreamData({
+            probabilityRangeData,
+            spectrumData
+        });
+    }, [
+        updateLevelStreamData
+    ]);
+    (0, __WEBPACK_EXTERNAL_MODULE_react__.useEffect)(()=>{
+        globalIDRef.current = globalID;
+    }, [
+        globalID
+    ]);
+    if (!analyzer.current && globalID) {
+        analyzer.current = new __WEBPACK_EXTERNAL_MODULE__rfkit_spectrum_analyzer_159ab12b__.LevelStreamAnalyzer({
+            range,
+            cacheTime: cacheTime,
+            granularity: granularity,
+            onLevelStreamUpdate: handleLevelStreamUpdate
+        });
+        const key = 'levelStream';
+        const { line: color } = getConfig(key);
+        tools(globalID, constants_ModuleType.Spectrum)({
+            pstype: constants_PSType.Series,
+            name: REAL_DATA_NAME,
+            color
+        });
+    }
+    (0, __WEBPACK_EXTERNAL_MODULE_react__.useEffect)(()=>{
+        analyzer.current?.setConfig({
+            range
+        });
+    }, [
+        range
+    ]);
+    (0, __WEBPACK_EXTERNAL_MODULE_react__.useEffect)(()=>{
+        analyzer.current?.setConfig({
+            cacheTime: cacheTime
+        });
+    }, [
+        cacheTime
+    ]);
+    (0, __WEBPACK_EXTERNAL_MODULE_react__.useEffect)(()=>{
+        analyzer.current?.setConfig({
+            granularity: granularity
+        });
+    }, [
+        granularity
+    ]);
+    (0, __WEBPACK_EXTERNAL_MODULE_react__.useEffect)(()=>{
+        analyzer.current?.setConfig({
+            onLevelStreamUpdate: handleLevelStreamUpdate
+        });
+    }, [
+        handleLevelStreamUpdate
+    ]);
+    return {
+        analyzer: analyzer.current,
+        updateLevelStreamData
+    };
+}
+class Occupancy {
+    state;
+    constructor(props){
+        this.state = {
+            chart: null,
+            orientation: type_OrientationType.Vertical,
+            ...props
+        };
+        this.init();
+    }
+    init() {
+        const { id, orientation } = this.state;
+        const colors = [
+            ...getGradient()
+        ].reverse().map((c)=>hexToRGBA(c));
+        const chart = new Series({
+            id,
+            series: [
+                {
+                    name: 'bar',
+                    type: 'bar',
+                    display: true,
+                    color: getConfig('bar'),
+                    orientation
+                }
+            ],
+            range: [
+                0,
+                100
+            ],
+            barValue2Color: true,
+            colors
+        });
+        this.state.chart = chart;
+    }
+    updateSeries(data) {
+        const { chart } = this.state;
+        chart.render({
+            name: 'bar',
+            data
+        });
+    }
+    reset() {
+        this.resize();
+        this.clear();
+    }
+    resize() {
+        this.state.chart.resize();
+    }
+    clear() {
+        this.state.chart.clear();
+    }
+}
+const Level_Level = (props)=>{
+    const { state: { axisY, globalID } } = useStore_useStore();
+    const { opacity } = props;
+    const { chart, Chart } = useChart({
+        Render: Occupancy,
+        params: {
+            orientation: type_OrientationType.Horizontal
+        }
+    });
+    (0, __WEBPACK_EXTERNAL_MODULE_react__.useEffect)(()=>{
+        if (chart && globalID) tools(globalID, constants_ModuleType.LevelStream, (d)=>{
+            const { data } = d;
+            if (data) chart.updateSeries(data);
+        });
     }, [
-        type
+        chart,
+        globalID
     ]);
-    return /*#__PURE__*/ (0, __WEBPACK_EXTERNAL_MODULE_react_jsx_runtime_225474f2__.jsx)(components_Container, {
-        children: /*#__PURE__*/ (0, __WEBPACK_EXTERNAL_MODULE_react_jsx_runtime_225474f2__.jsx)(Chart, {})
+    const style = (0, __WEBPACK_EXTERNAL_MODULE_react__.useMemo)(()=>({
+            opacity,
+            zIndex: 1
+        }), [
+        axisY,
+        opacity
+    ]);
+    return /*#__PURE__*/ (0, __WEBPACK_EXTERNAL_MODULE_react_jsx_runtime_225474f2__.jsx)(Chart, {
+        style: style
     });
 };
-const IQ_Chart = IQ_Chart_Chart;
-const IQChart = (props)=>/*#__PURE__*/ (0, __WEBPACK_EXTERNAL_MODULE_react_jsx_runtime_225474f2__.jsx)(store, {
-        system: {
-            padding: false,
-            border: false
-        },
-        ...props,
-        children: /*#__PURE__*/ (0, __WEBPACK_EXTERNAL_MODULE_react_jsx_runtime_225474f2__.jsx)(IQ_Chart, {
-            ...props
-        })
-    });
-const IQ_IQ = withChartPublisher(IQChart, 'IQ');
-const lib_IQ = IQ_IQ;
-function uselevelStreamAnalyzer() {
-    const { state: { globalID, axisY: { range }, levelStream: { cacheTime, granularity } } } = useStore_useStore();
-    const analyzer = (0, __WEBPACK_EXTERNAL_MODULE_react__.useRef)(null);
-    const globalIDRef = (0, __WEBPACK_EXTERNAL_MODULE_react__.useRef)(globalID);
-    const updateLevelStreamData = (0, __WEBPACK_EXTERNAL_MODULE_react__.useCallback)((renderData)=>{
-        tools(globalIDRef.current, constants_ModuleType.Spectrum)({
-            pstype: constants_PSType.Render,
-            data: {
-                [REAL_DATA_NAME]: renderData.spectrumData
+const Level = Level_Level;
+var Band_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.3.1_@rsbuild+core@1.4.12/node_modules/@rsbuild/plugin-less/compiled/less-loader/index.js??ruleSet[1].rules[11].use[3]!./src/components/Band/styles.module.less");
+var Band_styles_module_options = {};
+Band_styles_module_options.styleTagTransform = styleTagTransform_default();
+Band_styles_module_options.setAttributes = setAttributesWithoutAttributes_default();
+Band_styles_module_options.insert = insertBySelector_default().bind(null, "head");
+Band_styles_module_options.domAPI = styleDomAPI_default();
+Band_styles_module_options.insertStyleElement = insertStyleElement_default();
+injectStylesIntoStyleTag_default()(Band_styles_module.Z, Band_styles_module_options);
+const components_Band_styles_module = Band_styles_module.Z && Band_styles_module.Z.locals ? Band_styles_module.Z.locals : void 0;
+function useBand() {
+    const { state: { band }, dispatch } = useStore_useStore();
+    const setBand = (0, __WEBPACK_EXTERNAL_MODULE_react__.useCallback)((e)=>{
+        const { show = true, width = 0 } = e;
+        dispatch({
+            payload: {
+                band: {
+                    ...band,
+                    show,
+                    width
+                }
             }
         });
-        tools(globalIDRef.current, constants_ModuleType.LevelStream)({
-            pstype: constants_PSType.Render,
-            data: renderData.probabilityRangeData
-        });
-    }, []);
-    const handleLevelStreamUpdate = (0, __WEBPACK_EXTERNAL_MODULE_react__.useCallback)((data)=>{
-        const { probabilityRangeData, spectrumData } = data;
-        updateLevelStreamData({
-            probabilityRangeData,
-            spectrumData
-        });
-    }, [
-        updateLevelStreamData
-    ]);
-    (0, __WEBPACK_EXTERNAL_MODULE_react__.useEffect)(()=>{
-        globalIDRef.current = globalID;
     }, [
-        globalID
+        band
     ]);
-    if (!analyzer.current && globalID) {
-        analyzer.current = new __WEBPACK_EXTERNAL_MODULE__rfkit_spectrum_analyzer_159ab12b__.LevelStreamAnalyzer({
-            range,
-            cacheTime: cacheTime,
-            granularity: granularity,
-            onLevelStreamUpdate: handleLevelStreamUpdate
-        });
-        const key = 'levelStream';
-        const { line: color } = getConfig(key);
-        tools(globalID, constants_ModuleType.Spectrum)({
-            pstype: constants_PSType.Series,
-            name: REAL_DATA_NAME,
-            color
+    return setBand;
+}
+const Band_Band = ()=>{
+    const { state: { band: { show, width, left, color } } } = useStore_useStore();
+    if (!show) return null;
+    return /*#__PURE__*/ (0, __WEBPACK_EXTERNAL_MODULE_react_jsx_runtime_225474f2__.jsx)(Zoom_ZoomOffsetContainer, {
+        children: /*#__PURE__*/ (0, __WEBPACK_EXTERNAL_MODULE_react_jsx_runtime_225474f2__.jsx)("div", {
+            className: components_Band_styles_module.band,
+            style: {
+                left: void 0 !== left ? `${left}%` : `calc(50% - ${width / 2}%)`,
+                width: `${width}%`,
+                backgroundColor: `${color}15`,
+                borderColor: `${color}`
+            }
+        })
+    });
+};
+const Band = Band_Band;
+var DragFrame_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.3.1_@rsbuild+core@1.4.12/node_modules/@rsbuild/plugin-less/compiled/less-loader/index.js??ruleSet[1].rules[11].use[3]!./src/components/DragFrame/styles.module.less");
+var DragFrame_styles_module_options = {};
+DragFrame_styles_module_options.styleTagTransform = styleTagTransform_default();
+DragFrame_styles_module_options.setAttributes = setAttributesWithoutAttributes_default();
+DragFrame_styles_module_options.insert = insertBySelector_default().bind(null, "head");
+DragFrame_styles_module_options.domAPI = styleDomAPI_default();
+DragFrame_styles_module_options.insertStyleElement = insertStyleElement_default();
+injectStylesIntoStyleTag_default()(DragFrame_styles_module.Z, DragFrame_styles_module_options);
+const components_DragFrame_styles_module = DragFrame_styles_module.Z && DragFrame_styles_module.Z.locals ? DragFrame_styles_module.Z.locals : void 0;
+const maxIndexSegments2FrequencyBandwidth = ({ frequencyLeft, segments })=>(0, utils.Ax)(segments)(frequencyLeft);
+const startEnd2AnalyseFrequencyBandwidth = ({ e, zoom, segments, onChange, globalID })=>{
+    const { realData } = withDatabase(globalID).getAllRawData();
+    if (!realData) return;
+    const len = realData.length;
+    const { interval: { start: outsideStart, end: outsideEnd } } = zoom;
+    const potintLen = outsideEnd - outsideStart;
+    const { left: startLeft } = e;
+    const endLeft = e.left + e.width;
+    const left = convertCoordToVisualLeft({
+        coord: e,
+        segments,
+        zoom
+    });
+    const right = convertCoordToVisualLeft({
+        coord: {
+            left: endLeft
+        },
+        segments,
+        zoom
+    });
+    const start = Math.max(0, Math.ceil(len * left / 100) - 1);
+    const end = Math.ceil(len * right / 100);
+    const { maxIndex } = (0, utils.kL)(Array.from(realData.slice(start, end)));
+    const frequencyLeft = (outsideStart + (start + maxIndex + 1) / len * potintLen) * 100 / segments.totalPoints;
+    const frequency = maxIndexSegments2FrequencyBandwidth({
+        frequencyLeft,
+        segments
+    });
+    const bandwidth = Math.round(1000 * (0, utils.r2)({
+        segments,
+        endLeft,
+        startLeft
+    }));
+    onChange({
+        frequency,
+        bandwidth,
+        left,
+        right
+    });
+};
+const DragFrame_COMPONENT_KEY = constants_ToolType.DragFrame;
+const DragFrame = ({ id })=>{
+    const { state: { zoom, segments, signalAnalysis, globalID }, dispatch } = useStore_useStore();
+    const [frameState, setFrameState] = (0, __WEBPACK_EXTERNAL_MODULE_react__.useState)(null);
+    const onChange = (0, __WEBPACK_EXTERNAL_MODULE_react__.useCallback)((e, isSignalAnalysis = false)=>{
+        if (signalAnalysis.show && signalAnalysis.display && isSignalAnalysis) return void startEnd2AnalyseFrequencyBandwidth({
+            e,
+            zoom,
+            segments,
+            onChange: signalAnalysis.onChange,
+            globalID
         });
-    }
-    (0, __WEBPACK_EXTERNAL_MODULE_react__.useEffect)(()=>{
-        analyzer.current?.setConfig({
-            range
+        dispatch({
+            payload: {
+                zoom: {
+                    ...zoom,
+                    interval: e.interval,
+                    isScanSegmentsUpdateMagnify: e.isScanSegmentsUpdateMagnify
+                }
+            }
         });
     }, [
-        range
+        signalAnalysis,
+        zoom,
+        segments,
+        globalID
     ]);
-    (0, __WEBPACK_EXTERNAL_MODULE_react__.useEffect)(()=>{
-        analyzer.current?.setConfig({
-            cacheTime: cacheTime
+    const filterFrameState = (0, __WEBPACK_EXTERNAL_MODULE_react__.useCallback)((startCoords, endCoords, _, isEventButtonsRight)=>{
+        if (startCoords && endCoords && isEventButtonsRight) {
+            const diffX = endCoords.left - startCoords.left;
+            setFrameState({
+                diffX,
+                left: diffX > 0 ? startCoords.left : endCoords.left,
+                width: Math.abs(diffX),
+                isScanSegmentsUpdateMagnify: diffX > 0
+            });
+        }
+    }, []);
+    const handleFrameRender = (0, __WEBPACK_EXTERNAL_MODULE_react__.useCallback)(()=>{
+        if (!frameState) return;
+        const { left, width, isScanSegmentsUpdateMagnify, diffX } = frameState;
+        const { totalPoints } = segments;
+        if (isScanSegmentsUpdateMagnify && diffX > 0) {
+            const nextPoint = 2 * Math.ceil(width / 100 * totalPoints / 2);
+            const start = Math.round(totalPoints * left / 100) - 1;
+            const end = nextPoint + start - 1;
+            if (nextPoint > 10) onChange({
+                interval: {
+                    start,
+                    end
+                },
+                isScanSegmentsUpdateMagnify,
+                left,
+                width
+            }, true);
+        }
+        if (diffX < 0) onChange({
+            interval: {
+                start: 0,
+                end: totalPoints - 1
+            },
+            isScanSegmentsUpdateMagnify,
+            left,
+            width
         });
     }, [
-        cacheTime
+        frameState,
+        segments,
+        zoom.interval.end,
+        onChange
     ]);
-    (0, __WEBPACK_EXTERNAL_MODULE_react__.useEffect)(()=>{
-        analyzer.current?.setConfig({
-            granularity: granularity
-        });
+    (0, __WEBPACK_EXTERNAL_MODULE_react__.useEffect)(()=>{
+        if (zoom.show) {
+            const reset = ()=>{
+                setFrameState(null);
+                resetEventLevel(id, DragFrame_COMPONENT_KEY);
+            };
+            createMouseDownEventManager(id, DragFrame_COMPONENT_KEY, reset);
+            createMouseUpEventManager(id, DragFrame_COMPONENT_KEY, ()=>{
+                handleFrameRender();
+                reset();
+            });
+            createMouseLeaveEventManager(id, DragFrame_COMPONENT_KEY, reset);
+            createDragEventManager(id, DragFrame_COMPONENT_KEY, (...args)=>{
+                if (compareEventPriority(id, DragFrame_COMPONENT_KEY)) filterFrameState(args[0], args[1], args[2], args[3]);
+            });
+        }
     }, [
-        granularity
+        zoom.show,
+        id,
+        handleFrameRender,
+        filterFrameState
     ]);
     (0, __WEBPACK_EXTERNAL_MODULE_react__.useEffect)(()=>{
-        analyzer.current?.setConfig({
-            onLevelStreamUpdate: handleLevelStreamUpdate
-        });
+        if (!frameState) resetEventLevel(id, DragFrame_COMPONENT_KEY);
     }, [
-        handleLevelStreamUpdate
+        frameState,
+        id
     ]);
+    if (!zoom.show) return null;
+    return /*#__PURE__*/ (0, __WEBPACK_EXTERNAL_MODULE_react_jsx_runtime_225474f2__.jsx)(Zoom_ZoomOffsetContainer, {
+        className: components_DragFrame_styles_module.DragFrame,
+        children: /*#__PURE__*/ (0, __WEBPACK_EXTERNAL_MODULE_react_jsx_runtime_225474f2__.jsx)("div", {
+            className: `${components_DragFrame_styles_module.frame} ${frameState?.isScanSegmentsUpdateMagnify ? '' : components_DragFrame_styles_module.bias}`,
+            style: frameState ? {
+                left: `${frameState.left}%`,
+                width: `${frameState.width}%`
+            } : {}
+        })
+    });
+};
+const components_DragFrame = /*#__PURE__*/ (0, __WEBPACK_EXTERNAL_MODULE_react__.memo)(DragFrame);
+const originalColors = [
+    '#B22222',
+    '#CD5C5C',
+    '#FF6347',
+    '#FA8072',
+    '#F08080',
+    '#A0522D',
+    '#FF4500',
+    '#FF7F50',
+    '#B8860B',
+    '#FFA500',
+    '#808000',
+    '#9ACD32',
+    '#32CD32',
+    '#8FBC8F',
+    '#2E8B57',
+    '#3CB371',
+    '#00FA9A',
+    '#66CDAA',
+    '#7FFFD4',
+    '#2F4F4F',
+    '#008080',
+    '#00CED1',
+    '#20B2AA',
+    '#48D1CC',
+    '#4682B4',
+    '#778899',
+    '#87CEFA',
+    '#4169E1',
+    '#4169E1',
+    '#6495ED',
+    '#483D8B',
+    '#6A5ACD',
+    '#7B68EE',
+    '#9370DB',
+    '#9370DB',
+    '#9932CC',
+    '#8A2BE2',
+    '#BA55D3',
+    '#800080',
+    '#DDA0DD',
+    '#C71585',
+    '#DC143C'
+];
+function hexToHsl(hex) {
+    const r = parseInt(hex.slice(1, 3), 16) / 255;
+    const g = parseInt(hex.slice(3, 5), 16) / 255;
+    const b = parseInt(hex.slice(5, 7), 16) / 255;
+    const max = Math.max(r, g, b);
+    const min = Math.min(r, g, b);
+    let h = 0;
+    let s = 0;
+    const l = (max + min) / 2;
+    if (max !== min) {
+        const d = max - min;
+        s = l > 0.5 ? d / (2 - max - min) : d / (max + min);
+        switch(max){
+            case r:
+                h = (g - b) / d + (g < b ? 6 : 0);
+                break;
+            case g:
+                h = (b - r) / d + 2;
+                break;
+            case b:
+                h = (r - g) / d + 4;
+                break;
+        }
+        h /= 6;
+    }
     return {
-        analyzer: analyzer.current,
-        updateLevelStreamData
+        h: 360 * h,
+        s: 100 * s,
+        l: 100 * l
     };
 }
-class Occupancy {
-    state;
-    constructor(props){
-        this.state = {
-            chart: null,
-            orientation: type_OrientationType.Vertical,
-            ...props
+const sortedColors = [
+    ...originalColors
+].map((color)=>({
+        color,
+        hsl: hexToHsl(color)
+    })).sort((a, b)=>{
+    if (Math.abs(a.hsl.h - b.hsl.h) > 10) return a.hsl.h - b.hsl.h;
+    return a.hsl.l - b.hsl.l;
+}).map((item)=>item.color);
+function sortAndRecolorFrequencyAllocationData(data) {
+    const sortedData = [
+        ...data
+    ].sort((a, b)=>Number(a.startFrequency) - Number(b.startFrequency));
+    return sortedData.map((item, index)=>{
+        const totalBands = sortedData.length;
+        const colorCount = sortedColors.length;
+        const startColorIndex = Math.floor(index / totalBands * colorCount);
+        const endColorIndex = Math.floor((index + 1) / totalBands * colorCount);
+        const startColor = sortedColors[Math.min(startColorIndex, colorCount - 1)];
+        const endColor = sortedColors[Math.min(endColorIndex, colorCount - 1)];
+        const finalEndColor = index === totalBands - 1 ? sortedColors[colorCount - 1] : endColor;
+        return {
+            ...item,
+            color: startColor,
+            gradientColors: [
+                startColor,
+                finalEndColor
+            ]
         };
-        this.init();
-    }
-    init() {
-        const { id, orientation } = this.state;
-        const colors = [
-            ...getGradient()
-        ].reverse().map((c)=>hexToRGBA(c));
-        const chart = new Series({
-            id,
-            series: [
-                {
-                    name: 'bar',
-                    type: 'bar',
-                    display: true,
-                    color: getConfig('bar'),
-                    orientation
-                }
-            ],
-            range: [
-                0,
-                100
-            ],
-            barValue2Color: true,
-            colors
-        });
-        this.state.chart = chart;
-    }
-    updateSeries(data) {
-        const { chart } = this.state;
-        chart.render({
-            name: 'bar',
-            data
-        });
-    }
-    reset() {
-        this.resize();
-        this.clear();
-    }
-    resize() {
-        this.state.chart.resize();
-    }
-    clear() {
-        this.state.chart.clear();
+    });
+}
+const FrequencyAllocation_data = [
+    {
+        startFrequency: 87,
+        stopFrequency: 108,
+        stepFrequency: 100,
+        bandwidth: 150,
+        modulation: 'AM',
+        demodulation: "\u4E0D\u89E3\u8C03",
+        status: "\u5408\u6CD5",
+        title: "FM\u5E7F\u64AD",
+        description: "FM\u8C03\u9891\u5E7F\u64AD\u9891\u6BB5\uFF0C\u7528\u4E8E\u97F3\u9891\u5E7F\u64AD\u670D\u52A1"
+    },
+    {
+        startFrequency: 108,
+        stopFrequency: 118,
+        stepFrequency: 50,
+        bandwidth: 100,
+        modulation: 'FM',
+        demodulation: "\u89E3\u8C03",
+        status: "\u5408\u6CD5",
+        title: "\u822A\u7A7A\u5BFC\u822A",
+        description: "\u822A\u7A7A\u65E0\u7EBF\u7535\u5BFC\u822A\u9891\u6BB5\uFF0C\u7528\u4E8E\u4EEA\u8868\u7740\u9646\u7CFB\u7EDF\u7B49"
+    },
+    {
+        startFrequency: 118,
+        stopFrequency: 137,
+        stepFrequency: 25,
+        bandwidth: 50,
+        modulation: 'AM',
+        demodulation: "\u89E3\u8C03",
+        status: "\u5408\u6CD5",
+        title: "\u822A\u7A7A\u8BED\u97F3\u901A\u4FE1",
+        description: "\u6C11\u7528\u822A\u7A7A\u8BED\u97F3\u901A\u4FE1\u9891\u6BB5"
+    },
+    {
+        startFrequency: 121,
+        stopFrequency: 122,
+        stepFrequency: 25,
+        bandwidth: 50,
+        modulation: 'FM',
+        demodulation: "\u89E3\u8C03",
+        status: "\u5408\u6CD5",
+        title: "\u7D27\u6025\u901A\u4FE1",
+        description: "\u7D27\u6025\u60C5\u51B5\u901A\u4FE1\u4E13\u7528\u9891\u6BB5"
+    },
+    {
+        startFrequency: 136,
+        stopFrequency: 174,
+        stepFrequency: 25,
+        bandwidth: 50,
+        modulation: 'FM',
+        demodulation: "\u89E3\u8C03",
+        status: "\u5408\u6CD5",
+        title: "\u5BF9\u8BB2\u901A\u4FE1",
+        description: "\u4E13\u4E1A\u65E0\u7EBF\u5BF9\u8BB2\u901A\u4FE1\u9891\u6BB5"
+    },
+    {
+        startFrequency: 161,
+        stopFrequency: 162,
+        stepFrequency: 25,
+        bandwidth: 50,
+        modulation: 'GMSK',
+        demodulation: "\u89E3\u8C03",
+        status: "\u5408\u6CD5",
+        title: "AIS\u8239\u8236\u901A\u4FE1",
+        description: "\u8239\u8236\u81EA\u52A8\u8BC6\u522B\u7CFB\u7EDF(AIS)\u4E13\u7528\u9891\u6BB5"
+    },
+    {
+        startFrequency: 351,
+        stopFrequency: 400,
+        stepFrequency: 25,
+        bandwidth: 50,
+        modulation: 'FM',
+        demodulation: "\u89E3\u8C03",
+        status: "\u5408\u6CD5",
+        title: "\u96C6\u7FA4\u901A\u4FE1",
+        description: "\u4E13\u4E1A\u96C6\u7FA4\u901A\u4FE1\u7CFB\u7EDF\u9891\u6BB5"
+    },
+    {
+        startFrequency: 400,
+        stopFrequency: 470,
+        stepFrequency: 25,
+        bandwidth: 50,
+        modulation: 'FM',
+        demodulation: "\u89E3\u8C03",
+        status: "\u5408\u6CD5",
+        title: "\u4E13\u4E1A\u5BF9\u8BB2",
+        description: "\u4E13\u4E1A\u65E0\u7EBF\u5BF9\u8BB2\u901A\u4FE1\u9891\u6BB5"
+    },
+    {
+        startFrequency: 534,
+        stopFrequency: 542,
+        stepFrequency: 100,
+        bandwidth: 8000,
+        modulation: 'OFDM',
+        demodulation: "\u89E3\u8C03",
+        status: "\u5408\u6CD5",
+        title: "\u6570\u5B57\u7535\u89C6",
+        description: "\u6570\u5B57\u7535\u89C6\u5E7F\u64AD\u9891\u6BB5"
+    },
+    {
+        startFrequency: 622,
+        stopFrequency: 630,
+        stepFrequency: 100,
+        bandwidth: 8000,
+        modulation: 'OFDM',
+        demodulation: "\u89E3\u8C03",
+        status: "\u5408\u6CD5",
+        title: "\u6570\u5B57\u7535\u89C6",
+        description: "\u6570\u5B57\u7535\u89C6\u5E7F\u64AD\u9891\u6BB5"
+    },
+    {
+        startFrequency: 703,
+        stopFrequency: 733,
+        stepFrequency: 100,
+        bandwidth: 30000,
+        modulation: 'OFDMA',
+        demodulation: "\u89E3\u8C03",
+        status: "\u5408\u6CD5",
+        title: "5G\u4E0A\u884C(\u5E7F\u7535/\u79FB\u52A8)",
+        description: "\u5E7F\u7535\u548C\u79FB\u52A85G\u7F51\u7EDC\u4E0A\u884C\u9891\u6BB5"
+    },
+    {
+        startFrequency: 758,
+        stopFrequency: 788,
+        stepFrequency: 100,
+        bandwidth: 30000,
+        modulation: 'OFDMA',
+        demodulation: "\u89E3\u8C03",
+        status: "\u5408\u6CD5",
+        title: "5G\u4E0B\u884C(\u5E7F\u7535/\u79FB\u52A8)",
+        description: "\u5E7F\u7535\u548C\u79FB\u52A85G\u7F51\u7EDC\u4E0B\u884C\u9891\u6BB5"
+    },
+    {
+        startFrequency: 806,
+        stopFrequency: 821,
+        stepFrequency: 25,
+        bandwidth: 50,
+        modulation: "\u03C0/4DQPSK",
+        demodulation: "\u89E3\u8C03",
+        status: "\u5408\u6CD5",
+        title: "\u6570\u5B57\u96C6\u7FA4\u4E0A\u884C",
+        description: "\u6570\u5B57\u96C6\u7FA4\u901A\u4FE1\u7CFB\u7EDF(TETRA)\u4E0A\u884C\u9891\u6BB5"
+    },
+    {
+        startFrequency: 824,
+        stopFrequency: 835,
+        stepFrequency: 100,
+        bandwidth: 5000,
+        modulation: 'QPSK',
+        demodulation: "\u89E3\u8C03",
+        status: "\u5408\u6CD5",
+        title: "\u7535\u4FE13G/4G/5G\u4E0A\u884C",
+        description: "\u4E2D\u56FD\u7535\u4FE13G/4G/5G\u7F51\u7EDC\u4E0A\u884C\u9891\u6BB5"
+    },
+    {
+        startFrequency: 851,
+        stopFrequency: 866,
+        stepFrequency: 25,
+        bandwidth: 50,
+        modulation: "\u03C0/4DQPSK",
+        demodulation: "\u89E3\u8C03",
+        status: "\u5408\u6CD5",
+        title: "\u6570\u5B57\u96C6\u7FA4\u4E0B\u884C",
+        description: "\u6570\u5B57\u96C6\u7FA4\u901A\u4FE1\u7CFB\u7EDF(TETRA)\u4E0B\u884C\u9891\u6BB5"
+    },
+    {
+        startFrequency: 869,
+        stopFrequency: 880,
+        stepFrequency: 100,
+        bandwidth: 5000,
+        modulation: 'QPSK',
+        demodulation: "\u89E3\u8C03",
+        status: "\u5408\u6CD5",
+        title: "\u7535\u4FE13G/4G/5G\u4E0B\u884C",
+        description: "\u4E2D\u56FD\u7535\u4FE13G/4G/5G\u7F51\u7EDC\u4E0B\u884C\u9891\u6BB5"
+    },
+    {
+        startFrequency: 885,
+        stopFrequency: 889,
+        stepFrequency: 200,
+        bandwidth: 200,
+        modulation: 'GMSK',
+        demodulation: "\u89E3\u8C03",
+        status: "\u5408\u6CD5",
+        title: "GSM-R\u4E0A\u884C",
+        description: "\u94C1\u8DEF\u4E13\u7528GSM-R\u7F51\u7EDC\u4E0A\u884C\u9891\u6BB5"
+    },
+    {
+        startFrequency: 889,
+        stopFrequency: 904,
+        stepFrequency: 200,
+        bandwidth: 200,
+        modulation: 'GMSK',
+        demodulation: "\u89E3\u8C03",
+        status: "\u5408\u6CD5",
+        title: "\u79FB\u52A82G/4G\u4E0A\u884C",
+        description: "\u4E2D\u56FD\u79FB\u52A82G/4G\u7F51\u7EDC\u4E0A\u884C\u9891\u6BB5"
+    },
+    {
+        startFrequency: 904,
+        stopFrequency: 915,
+        stepFrequency: 200,
+        bandwidth: 200,
+        modulation: 'QPSK',
+        demodulation: "\u89E3\u8C03",
+        status: "\u5408\u6CD5",
+        title: "\u8054\u901A2/3/4/5G\u4E0A\u884C",
+        description: "\u4E2D\u56FD\u8054\u901A2G/3G/4G/5G\u7F51\u7EDC\u4E0A\u884C\u9891\u6BB5"
+    },
+    {
+        startFrequency: 930,
+        stopFrequency: 934,
+        stepFrequency: 200,
+        bandwidth: 200,
+        modulation: 'GMSK',
+        demodulation: "\u89E3\u8C03",
+        status: "\u5408\u6CD5",
+        title: "GSM-R\u4E0B\u884C",
+        description: "\u94C1\u8DEF\u4E13\u7528GSM-R\u7F51\u7EDC\u4E0B\u884C\u9891\u6BB5"
+    },
+    {
+        startFrequency: 934,
+        stopFrequency: 949,
+        stepFrequency: 200,
+        bandwidth: 200,
+        modulation: 'GMSK',
+        demodulation: "\u89E3\u8C03",
+        status: "\u5408\u6CD5",
+        title: "\u79FB\u52A82G/4G\u4E0B\u884C",
+        description: "\u4E2D\u56FD\u79FB\u52A82G/4G\u7F51\u7EDC\u4E0B\u884C\u9891\u6BB5"
+    },
+    {
+        startFrequency: 949,
+        stopFrequency: 960,
+        stepFrequency: 200,
+        bandwidth: 200,
+        modulation: 'QPSK',
+        demodulation: "\u89E3\u8C03",
+        status: "\u5408\u6CD5",
+        title: "\u8054\u901A2/3/4/5G\u4E0B\u884C",
+        description: "\u4E2D\u56FD\u8054\u901A2G/3G/4G/5G\u7F51\u7EDC\u4E0B\u884C\u9891\u6BB5"
+    },
+    {
+        startFrequency: 1164,
+        stopFrequency: 1189,
+        stepFrequency: 1000,
+        bandwidth: 10000,
+        modulation: 'BPSK',
+        demodulation: "\u89E3\u8C03",
+        status: "\u5408\u6CD5",
+        title: "GPS L5\u9891\u6BB5",
+        description: "\u5168\u7403\u5B9A\u4F4D\u7CFB\u7EDFGPS L5\u9891\u6BB5"
+    },
+    {
+        startFrequency: 1215,
+        stopFrequency: 1234,
+        stepFrequency: 1000,
+        bandwidth: 10000,
+        modulation: 'BPSK',
+        demodulation: "\u89E3\u8C03",
+        status: "\u5408\u6CD5",
+        title: "GPS L2\u9891\u6BB5",
+        description: "\u5168\u7403\u5B9A\u4F4D\u7CFB\u7EDFGPS L2\u9891\u6BB5"
+    },
+    {
+        startFrequency: 1447,
+        stopFrequency: 1467,
+        stepFrequency: 100,
+        bandwidth: 10000,
+        modulation: 'OFDMA',
+        demodulation: "\u89E3\u8C03",
+        status: "\u5408\u6CD5",
+        title: "\u653F\u52A1\u516C\u5B89\u4E13\u7F51",
+        description: "\u653F\u52A1\u548C\u516C\u5B89\u4E13\u7528LTE\u7F51\u7EDC\u9891\u6BB5"
+    },
+    {
+        startFrequency: 1563,
+        stopFrequency: 1587,
+        stepFrequency: 1000,
+        bandwidth: 10000,
+        modulation: 'BPSK',
+        demodulation: "\u89E3\u8C03",
+        status: "\u5408\u6CD5",
+        title: "GPS L1\u9891\u6BB5",
+        description: "\u5168\u7403\u5B9A\u4F4D\u7CFB\u7EDFGPS L1\u9891\u6BB5"
+    },
+    {
+        startFrequency: 1710,
+        stopFrequency: 1735,
+        stepFrequency: 200,
+        bandwidth: 5000,
+        modulation: 'QPSK',
+        demodulation: "\u89E3\u8C03",
+        status: "\u5408\u6CD5",
+        title: "\u79FB\u52A82G/4G\u4E0A\u884C",
+        description: "\u4E2D\u56FD\u79FB\u52A82G/4G\u7F51\u7EDC\u4E0A\u884C\u9891\u6BB5"
+    },
+    {
+        startFrequency: 1735,
+        stopFrequency: 1765,
+        stepFrequency: 200,
+        bandwidth: 5000,
+        modulation: 'QPSK',
+        demodulation: "\u89E3\u8C03",
+        status: "\u5408\u6CD5",
+        title: "\u8054\u901A2/4G\u4E0A\u884C",
+        description: "\u4E2D\u56FD\u8054\u901A2G/4G\u7F51\u7EDC\u4E0A\u884C\u9891\u6BB5"
+    },
+    {
+        startFrequency: 1805,
+        stopFrequency: 1830,
+        stepFrequency: 200,
+        bandwidth: 5000,
+        modulation: 'QPSK',
+        demodulation: "\u89E3\u8C03",
+        status: "\u5408\u6CD5",
+        title: "\u79FB\u52A82G/4G\u4E0B\u884C",
+        description: "\u4E2D\u56FD\u79FB\u52A82G/4G\u7F51\u7EDC\u4E0B\u884C\u9891\u6BB5"
+    },
+    {
+        startFrequency: 1830,
+        stopFrequency: 1860,
+        stepFrequency: 200,
+        bandwidth: 5000,
+        modulation: 'QPSK',
+        demodulation: "\u89E3\u8C03",
+        status: "\u5408\u6CD5",
+        title: "\u8054\u901A2/4G\u4E0B\u884C",
+        description: "\u4E2D\u56FD\u8054\u901A2G/4G\u7F51\u7EDC\u4E0B\u884C\u9891\u6BB5"
+    },
+    {
+        startFrequency: 1885,
+        stopFrequency: 1915,
+        stepFrequency: 100,
+        bandwidth: 10000,
+        modulation: 'OFDMA',
+        demodulation: "\u89E3\u8C03",
+        status: "\u5408\u6CD5",
+        title: "\u79FB\u52A84G",
+        description: "\u4E2D\u56FD\u79FB\u52A84G\u7F51\u7EDC\u9891\u6BB5"
+    },
+    {
+        startFrequency: 1920,
+        stopFrequency: 1940,
+        stepFrequency: 100,
+        bandwidth: 10000,
+        modulation: 'OFDMA',
+        demodulation: "\u89E3\u8C03",
+        status: "\u5408\u6CD5",
+        title: "\u7535\u4FE1/\u8054\u901A5G\u4E0A\u884C",
+        description: "\u4E2D\u56FD\u7535\u4FE1/\u8054\u901A5G\u7F51\u7EDC\u4E0A\u884C\u9891\u6BB5"
+    },
+    {
+        startFrequency: 1940,
+        stopFrequency: 1965,
+        stepFrequency: 100,
+        bandwidth: 10000,
+        modulation: 'OFDMA',
+        demodulation: "\u89E3\u8C03",
+        status: "\u5408\u6CD5",
+        title: "\u8054\u901A3/4/5G\u4E0A\u884C",
+        description: "\u4E2D\u56FD\u8054\u901A3G/4G/5G\u7F51\u7EDC\u4E0A\u884C\u9891\u6BB5"
+    },
+    {
+        startFrequency: 2110,
+        stopFrequency: 2130,
+        stepFrequency: 100,
+        bandwidth: 10000,
+        modulation: 'OFDMA',
+        demodulation: "\u89E3\u8C03",
+        status: "\u5408\u6CD5",
+        title: "\u7535\u4FE1/\u8054\u901A5G\u4E0B\u884C",
+        description: "\u4E2D\u56FD\u7535\u4FE1/\u8054\u901A5G\u7F51\u7EDC\u4E0B\u884C\u9891\u6BB5"
+    },
+    {
+        startFrequency: 2300,
+        stopFrequency: 2320,
+        stepFrequency: 100,
+        bandwidth: 10000,
+        modulation: 'OFDMA',
+        demodulation: "\u89E3\u8C03",
+        status: "\u5408\u6CD5",
+        title: "\u8054\u901A4G",
+        description: "\u4E2D\u56FD\u8054\u901A4G\u7F51\u7EDC\u9891\u6BB5"
+    },
+    {
+        startFrequency: 2320,
+        stopFrequency: 2370,
+        stepFrequency: 100,
+        bandwidth: 10000,
+        modulation: 'OFDMA',
+        demodulation: "\u89E3\u8C03",
+        status: "\u5408\u6CD5",
+        title: "\u79FB\u52A84G",
+        description: "\u4E2D\u56FD\u79FB\u52A84G\u7F51\u7EDC\u9891\u6BB5"
+    },
+    {
+        startFrequency: 2400,
+        stopFrequency: 2500,
+        stepFrequency: 1,
+        bandwidth: 20,
+        modulation: 'OFDM',
+        demodulation: "\u89E3\u8C03",
+        status: "\u5408\u6CD5",
+        title: 'ISM 2.4GHz',
+        description: "WIFI\u3001\u84DD\u7259\u3001\u65E0\u4EBA\u673A\u7B49\u4F7F\u7528\u9891\u6BB5"
+    },
+    {
+        startFrequency: 2515,
+        stopFrequency: 2675,
+        stepFrequency: 100,
+        bandwidth: 10000,
+        modulation: 'OFDMA',
+        demodulation: "\u89E3\u8C03",
+        status: "\u5408\u6CD5",
+        title: "\u79FB\u52A85G/4G",
+        description: "\u4E2D\u56FD\u79FB\u52A85G\u548C4G\u7F51\u7EDC\u9891\u6BB5"
+    },
+    {
+        startFrequency: 3300,
+        stopFrequency: 3600,
+        stepFrequency: 100,
+        bandwidth: 10000,
+        modulation: 'OFDMA',
+        demodulation: "\u89E3\u8C03",
+        status: "\u5408\u6CD5",
+        title: "5G\u9891\u6BB5",
+        description: "\u7535\u4FE1\u3001\u8054\u901A\u3001\u5E7F\u75355G\u7F51\u7EDC\u9891\u6BB5"
+    },
+    {
+        startFrequency: 4800,
+        stopFrequency: 4900,
+        stepFrequency: 100,
+        bandwidth: 10000,
+        modulation: 'OFDMA',
+        demodulation: "\u89E3\u8C03",
+        status: "\u5408\u6CD5",
+        title: "\u79FB\u52A85G",
+        description: "\u4E2D\u56FD\u79FB\u52A85G\u7F51\u7EDC\u9891\u6BB5"
+    },
+    {
+        startFrequency: 4900,
+        stopFrequency: 4960,
+        stepFrequency: 100,
+        bandwidth: 10000,
+        modulation: 'OFDMA',
+        demodulation: "\u89E3\u8C03",
+        status: "\u5408\u6CD5",
+        title: "\u5E7F\u75355G",
+        description: "\u4E2D\u56FD\u5E7F\u75355G\u7F51\u7EDC\u9891\u6BB5"
+    },
+    {
+        startFrequency: 5725,
+        stopFrequency: 5875.5,
+        stepFrequency: 5,
+        bandwidth: 20,
+        modulation: 'OFDM',
+        demodulation: "\u89E3\u8C03",
+        status: "\u5408\u6CD5",
+        title: 'ISM 5GHz',
+        description: "WIFI\u3001\u65E0\u4EBA\u673A\u7B49\u4F7F\u7528\u9891\u6BB5"
     }
-}
-const Level_Level = (props)=>{
-    const { state: { axisY, globalID } } = useStore_useStore();
-    const { opacity } = props;
-    const { chart, Chart } = hooks_useChart({
-        Render: Occupancy,
-        params: {
-            orientation: type_OrientationType.Horizontal
-        }
-    });
-    (0, __WEBPACK_EXTERNAL_MODULE_react__.useEffect)(()=>{
-        if (chart && globalID) tools(globalID, constants_ModuleType.LevelStream, (d)=>{
-            const { data } = d;
-            if (data) chart.updateSeries(data);
-        });
-    }, [
-        chart,
-        globalID
-    ]);
-    const style = (0, __WEBPACK_EXTERNAL_MODULE_react__.useMemo)(()=>({
-            opacity,
-            zIndex: 1
-        }), [
-        axisY,
-        opacity
-    ]);
-    return /*#__PURE__*/ (0, __WEBPACK_EXTERNAL_MODULE_react_jsx_runtime_225474f2__.jsx)(Chart, {
-        style: style
-    });
-};
-const Level = Level_Level;
-var Band_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.3.1_@rsbuild+core@1.4.12/node_modules/@rsbuild/plugin-less/compiled/less-loader/index.js??ruleSet[1].rules[11].use[3]!./src/components/Band/styles.module.less");
-var Band_styles_module_options = {};
-Band_styles_module_options.styleTagTransform = styleTagTransform_default();
-Band_styles_module_options.setAttributes = setAttributesWithoutAttributes_default();
-Band_styles_module_options.insert = insertBySelector_default().bind(null, "head");
-Band_styles_module_options.domAPI = styleDomAPI_default();
-Band_styles_module_options.insertStyleElement = insertStyleElement_default();
-injectStylesIntoStyleTag_default()(Band_styles_module.Z, Band_styles_module_options);
-const components_Band_styles_module = Band_styles_module.Z && Band_styles_module.Z.locals ? Band_styles_module.Z.locals : void 0;
-function useBand() {
-    const { state: { band }, dispatch } = useStore_useStore();
-    const setBand = (0, __WEBPACK_EXTERNAL_MODULE_react__.useCallback)((e)=>{
-        const { show = true, width = 0 } = e;
-        dispatch({
-            payload: {
-                band: {
-                    ...band,
-                    show,
-                    width
-                }
-            }
-        });
-    }, [
-        band
-    ]);
-    return setBand;
-}
-const Band_Band = ()=>{
-    const { state: { band: { show, width, left, color } } } = useStore_useStore();
-    if (!show) return null;
-    return /*#__PURE__*/ (0, __WEBPACK_EXTERNAL_MODULE_react_jsx_runtime_225474f2__.jsx)(Zoom_ZoomOffsetContainer, {
-        children: /*#__PURE__*/ (0, __WEBPACK_EXTERNAL_MODULE_react_jsx_runtime_225474f2__.jsx)("div", {
-            className: components_Band_styles_module.band,
-            style: {
-                left: void 0 !== left ? `${left}%` : `calc(50% - ${width / 2}%)`,
-                width: `${width}%`,
-                backgroundColor: `${color}15`,
-                borderColor: `${color}`
-            }
-        })
-    });
-};
-const Band = Band_Band;
-var DragFrame_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.3.1_@rsbuild+core@1.4.12/node_modules/@rsbuild/plugin-less/compiled/less-loader/index.js??ruleSet[1].rules[11].use[3]!./src/components/DragFrame/styles.module.less");
-var DragFrame_styles_module_options = {};
-DragFrame_styles_module_options.styleTagTransform = styleTagTransform_default();
-DragFrame_styles_module_options.setAttributes = setAttributesWithoutAttributes_default();
-DragFrame_styles_module_options.insert = insertBySelector_default().bind(null, "head");
-DragFrame_styles_module_options.domAPI = styleDomAPI_default();
-DragFrame_styles_module_options.insertStyleElement = insertStyleElement_default();
-injectStylesIntoStyleTag_default()(DragFrame_styles_module.Z, DragFrame_styles_module_options);
-const components_DragFrame_styles_module = DragFrame_styles_module.Z && DragFrame_styles_module.Z.locals ? DragFrame_styles_module.Z.locals : void 0;
-const maxIndexSegments2FrequencyBandwidth = ({ frequencyLeft, segments })=>leftSegments2frequency(segments)(frequencyLeft);
-const startEnd2AnalyseFrequencyBandwidth = ({ e, zoom, segments, onChange, globalID })=>{
-    const { realData } = withDatabase(globalID).getAllRawData();
-    if (!realData) return;
-    const len = realData.length;
-    const { interval: { start: outsideStart, end: outsideEnd } } = zoom;
-    const potintLen = outsideEnd - outsideStart;
-    const { left: startLeft } = e;
-    const endLeft = e.left + e.width;
-    const left = convertCoordToVisualLeft({
-        coord: e,
-        segments,
-        zoom
-    });
-    const right = convertCoordToVisualLeft({
-        coord: {
-            left: endLeft
-        },
-        segments,
-        zoom
-    });
-    const start = Math.max(0, Math.ceil(len * left / 100) - 1);
-    const end = Math.ceil(len * right / 100);
-    const { maxIndex } = getDimInfo(Array.from(realData.slice(start, end)));
-    const frequencyLeft = (outsideStart + (start + maxIndex + 1) / len * potintLen) * 100 / segments.totalPoints;
-    const frequency = maxIndexSegments2FrequencyBandwidth({
-        frequencyLeft,
-        segments
-    });
-    const bandwidth = Math.round(1000 * scopeLeftSegments2bandwidth({
-        segments,
-        endLeft,
-        startLeft
-    }));
-    onChange({
-        frequency,
-        bandwidth,
-        left,
-        right
-    });
-};
-const DragFrame_COMPONENT_KEY = constants_ToolType.DragFrame;
-const DragFrame = ({ id })=>{
-    const { state: { zoom, segments, signalAnalysis, globalID }, dispatch } = useStore_useStore();
-    const [frameState, setFrameState] = (0, __WEBPACK_EXTERNAL_MODULE_react__.useState)(null);
-    const onChange = (0, __WEBPACK_EXTERNAL_MODULE_react__.useCallback)((e, isSignalAnalysis = false)=>{
-        if (signalAnalysis.show && signalAnalysis.display && isSignalAnalysis) return void startEnd2AnalyseFrequencyBandwidth({
-            e,
-            zoom,
-            segments,
-            onChange: signalAnalysis.onChange,
-            globalID
-        });
-        dispatch({
-            payload: {
-                zoom: {
-                    ...zoom,
-                    interval: e.interval,
-                    isScanSegmentsUpdateMagnify: e.isScanSegmentsUpdateMagnify
-                }
-            }
-        });
-    }, [
-        signalAnalysis,
-        zoom,
-        segments,
-        globalID
-    ]);
-    const filterFrameState = (0, __WEBPACK_EXTERNAL_MODULE_react__.useCallback)((startCoords, endCoords, _, isEventButtonsRight)=>{
-        if (startCoords && endCoords && isEventButtonsRight) {
-            const diffX = endCoords.left - startCoords.left;
-            setFrameState({
-                diffX,
-                left: diffX > 0 ? startCoords.left : endCoords.left,
-                width: Math.abs(diffX),
-                isScanSegmentsUpdateMagnify: diffX > 0
-            });
-        }
-    }, []);
-    const handleFrameRender = (0, __WEBPACK_EXTERNAL_MODULE_react__.useCallback)(()=>{
-        if (!frameState) return;
-        const { left, width, isScanSegmentsUpdateMagnify, diffX } = frameState;
-        const { totalPoints } = segments;
-        if (isScanSegmentsUpdateMagnify && diffX > 0) {
-            const nextPoint = 2 * Math.ceil(width / 100 * totalPoints / 2);
-            const start = Math.round(totalPoints * left / 100) - 1;
-            const end = nextPoint + start - 1;
-            if (nextPoint > 10) onChange({
-                interval: {
-                    start,
-                    end
-                },
-                isScanSegmentsUpdateMagnify,
-                left,
-                width
-            }, true);
-        }
-        if (diffX < 0) onChange({
-            interval: {
-                start: 0,
-                end: totalPoints - 1
-            },
-            isScanSegmentsUpdateMagnify,
-            left,
-            width
-        });
-    }, [
-        frameState,
-        segments,
-        zoom.interval.end,
-        onChange
-    ]);
-    (0, __WEBPACK_EXTERNAL_MODULE_react__.useEffect)(()=>{
-        if (zoom.show) {
-            const reset = ()=>{
-                setFrameState(null);
-                resetEventLevel(id, DragFrame_COMPONENT_KEY);
-            };
-            createMouseDownEventManager(id, DragFrame_COMPONENT_KEY, reset);
-            createMouseUpEventManager(id, DragFrame_COMPONENT_KEY, ()=>{
-                handleFrameRender();
-                reset();
-            });
-            createMouseLeaveEventManager(id, DragFrame_COMPONENT_KEY, reset);
-            createDragEventManager(id, DragFrame_COMPONENT_KEY, (...args)=>{
-                if (compareEventPriority(id, DragFrame_COMPONENT_KEY)) filterFrameState(args[0], args[1], args[2], args[3]);
-            });
-        }
-    }, [
-        zoom.show,
-        id,
-        handleFrameRender,
-        filterFrameState
-    ]);
-    (0, __WEBPACK_EXTERNAL_MODULE_react__.useEffect)(()=>{
-        if (!frameState) resetEventLevel(id, DragFrame_COMPONENT_KEY);
-    }, [
-        frameState,
-        id
-    ]);
-    if (!zoom.show) return null;
-    return /*#__PURE__*/ (0, __WEBPACK_EXTERNAL_MODULE_react_jsx_runtime_225474f2__.jsx)(Zoom_ZoomOffsetContainer, {
-        className: components_DragFrame_styles_module.DragFrame,
-        children: /*#__PURE__*/ (0, __WEBPACK_EXTERNAL_MODULE_react_jsx_runtime_225474f2__.jsx)("div", {
-            className: `${components_DragFrame_styles_module.frame} ${frameState?.isScanSegmentsUpdateMagnify ? '' : components_DragFrame_styles_module.bias}`,
-            style: frameState ? {
-                left: `${frameState.left}%`,
-                width: `${frameState.width}%`
-            } : {}
-        })
-    });
-};
-const components_DragFrame = /*#__PURE__*/ (0, __WEBPACK_EXTERNAL_MODULE_react__.memo)(DragFrame);
+];
 var FrequencyAllocation_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.3.1_@rsbuild+core@1.4.12/node_modules/@rsbuild/plugin-less/compiled/less-loader/index.js??ruleSet[1].rules[11].use[3]!./src/components/FrequencyAllocation/styles.module.less");
 var FrequencyAllocation_styles_module_options = {};
 FrequencyAllocation_styles_module_options.styleTagTransform = styleTagTransform_default();
@@ -11418,7 +11960,7 @@ const SegmentContainer = /*#__PURE__*/ (0, __WEBPACK_EXTERNAL_MODULE_react__.mem
         children: bandPositions.map(({ band, range, position }, index)=>/*#__PURE__*/ (0, __WEBPACK_EXTERNAL_MODULE_react_jsx_runtime_225474f2__.jsx)("div", {
                 className: components_FrequencyAllocation_styles_module.item,
                 style: {
-                    background: band.gradientColors ? `linear-gradient(to right, ${band.gradientColors[0]}, ${band.gradientColors[1]})` : band.color,
+                    background: (band.gradientColors ? `linear-gradient(to right, ${band.gradientColors[0]}, ${band.gradientColors[1]})` : band.color) || 'var(--theme-color-primary)',
                     left: position.left,
                     width: position.width
                 },
@@ -11438,7 +11980,7 @@ FrequencyAllocation_Tooltip_styles_module_options.domAPI = styleDomAPI_default()
 FrequencyAllocation_Tooltip_styles_module_options.insertStyleElement = insertStyleElement_default();
 injectStylesIntoStyleTag_default()(FrequencyAllocation_Tooltip_styles_module.Z, FrequencyAllocation_Tooltip_styles_module_options);
 const components_FrequencyAllocation_Tooltip_styles_module = FrequencyAllocation_Tooltip_styles_module.Z && FrequencyAllocation_Tooltip_styles_module.Z.locals ? FrequencyAllocation_Tooltip_styles_module.Z.locals : void 0;
-const FrequencyAllocation_Tooltip_Tooltip = ({ title, description, visible, x, y, startFrequency, stopFrequency, centerFrequency, bandwidth, defaultStep, defaultBandwidth, modulation, demodulation, allocation, status })=>{
+const FrequencyAllocation_Tooltip_Tooltip = ({ title, description, visible, x, y, startFrequency, stopFrequency, centerFrequency, stepFrequency, bandwidth, modulation, demodulation, status })=>{
     const tooltipRef = (0, __WEBPACK_EXTERNAL_MODULE_react__.useRef)(null);
     const [position, setPosition] = (0, __WEBPACK_EXTERNAL_MODULE_react__.useState)({
         x,
@@ -11481,13 +12023,13 @@ const FrequencyAllocation_Tooltip_Tooltip = ({ title, description, visible, x, y
                         children: `\u{9891}\u{7387}\u{8303}\u{56F4}: ${startFrequency} - ${stopFrequency}`
                     }),
                     centerFrequency && bandwidth && /*#__PURE__*/ (0, __WEBPACK_EXTERNAL_MODULE_react_jsx_runtime_225474f2__.jsx)("div", {
-                        children: `\u{4E2D}\u{5FC3}\u{9891}\u{7387}: ${centerFrequency} & \u{5E26}\u{5BBD}: ${bandwidth}`
+                        children: `\u{4E2D}\u{5FC3}\u{9891}\u{7387}: ${centerFrequency} MHz & \u{5E26}\u{5BBD}: ${bandwidth} kHz`
                     }),
-                    defaultStep && /*#__PURE__*/ (0, __WEBPACK_EXTERNAL_MODULE_react_jsx_runtime_225474f2__.jsx)("div", {
-                        children: `\u{9ED8}\u{8BA4}\u{6B65}\u{8FDB}: ${defaultStep}`
+                    stepFrequency && /*#__PURE__*/ (0, __WEBPACK_EXTERNAL_MODULE_react_jsx_runtime_225474f2__.jsx)("div", {
+                        children: `\u{6B65}\u{8FDB}: ${stepFrequency} kHz`
                     }),
-                    defaultBandwidth && /*#__PURE__*/ (0, __WEBPACK_EXTERNAL_MODULE_react_jsx_runtime_225474f2__.jsx)("div", {
-                        children: `\u{9ED8}\u{8BA4}\u{5E26}\u{5BBD}: ${defaultBandwidth}`
+                    bandwidth && /*#__PURE__*/ (0, __WEBPACK_EXTERNAL_MODULE_react_jsx_runtime_225474f2__.jsx)("div", {
+                        children: `\u{5E26}\u{5BBD}: ${bandwidth} kHz`
                     }),
                     modulation && /*#__PURE__*/ (0, __WEBPACK_EXTERNAL_MODULE_react_jsx_runtime_225474f2__.jsx)("div", {
                         children: `\u{8C03}\u{5236}\u{65B9}\u{5F0F}: ${modulation}`
@@ -11495,9 +12037,6 @@ const FrequencyAllocation_Tooltip_Tooltip = ({ title, description, visible, x, y
                     demodulation && /*#__PURE__*/ (0, __WEBPACK_EXTERNAL_MODULE_react_jsx_runtime_225474f2__.jsx)("div", {
                         children: `\u{89E3}\u{8C03}\u{65B9}\u{5F0F}: ${demodulation}`
                     }),
-                    allocation && /*#__PURE__*/ (0, __WEBPACK_EXTERNAL_MODULE_react_jsx_runtime_225474f2__.jsx)("div", {
-                        children: `\u{5212}\u{5206}\u{4FE1}\u{606F}: ${allocation}`
-                    }),
                     status && /*#__PURE__*/ (0, __WEBPACK_EXTERNAL_MODULE_react_jsx_runtime_225474f2__.jsx)("div", {
                         children: `\u{72B6}\u{6001}: ${status}`
                     })
@@ -11513,38 +12052,42 @@ const FrequencyAllocation_Tooltip_Tooltip = ({ title, description, visible, x, y
 const FrequencyAllocation_Tooltip = FrequencyAllocation_Tooltip_Tooltip;
 const FrequencyAllocation_FrequencyAllocation = ()=>{
     const { state: { axisX: { unit }, segments, frequencyAllocation: { display, show, data }, zoom: { style: zoomOffStyle } } } = useStore_useStore();
+    const frequencyAllocationData = (0, __WEBPACK_EXTERNAL_MODULE_react__.useMemo)(()=>{
+        const cachedData = getFrequencyAllocationFromCache();
+        return sortAndRecolorFrequencyAllocationData(cachedData?.length > 0 ? cachedData : data?.length > 0 ? data : FrequencyAllocation_data);
+    }, [
+        data
+    ]);
     const [tooltipInfo, setTooltipInfo] = (0, __WEBPACK_EXTERNAL_MODULE_react__.useState)({
         visible: false,
         x: 0,
-        y: 0,
-        title: '',
-        description: ''
+        y: 0
     });
     const getFrequencyRange = (0, __WEBPACK_EXTERNAL_MODULE_react__.useCallback)((band)=>{
         if (null != band.startFrequency && null != band.stopFrequency) return {
-            start: band.startFrequency,
-            stop: band.stopFrequency,
+            start: Number(band.startFrequency),
+            stop: Number(band.stopFrequency),
             type: 'range'
         };
         if (null != band.centerFrequency && null != band.bandwidth) {
-            const [segment] = generateFrequencySegments({
+            const [segment] = (0, utils.IS)({
                 frequency: band.centerFrequency,
                 bandwidth: band.bandwidth
             });
             return {
                 start: segment.start,
                 stop: segment.stop,
-                frequency: band.centerFrequency,
-                bandwidth: band.bandwidth,
+                frequency: Number(band.centerFrequency),
+                bandwidth: Number(band.bandwidth),
                 type: 'centerBandwidth'
             };
         }
         return null;
     }, []);
     const segmentData = (0, __WEBPACK_EXTERNAL_MODULE_react__.useMemo)(()=>{
-        if (!segments?.length || !data) return [];
+        if (!segments?.length || !frequencyAllocationData) return [];
         return segments.map((segment, segmentIndex)=>{
-            const segmentBands = (Array.isArray(data) ? data : []).map((band)=>{
+            const segmentBands = frequencyAllocationData.map((band)=>{
                 const range = getFrequencyRange(band);
                 if (range && !(range.stop < segment.start || range.start > segment.stop)) return {
                     band,
@@ -11609,7 +12152,7 @@ const FrequencyAllocation_FrequencyAllocation = ()=>{
             };
         });
     }, [
-        data,
+        frequencyAllocationData,
         segments,
         getFrequencyRange
     ]);
@@ -11621,19 +12164,12 @@ const FrequencyAllocation_FrequencyAllocation = ()=>{
     }, []);
     const handleMouseEnter = (0, __WEBPACK_EXTERNAL_MODULE_react__.useCallback)((band, range)=>(e)=>{
             const tooltipData = {
+                ...band,
                 visible: true,
                 x: e.clientX + 10,
                 y: e.clientY + 10,
-                title: band.title,
-                description: band.description,
                 startFrequency: `${range.start}${unit}`,
-                stopFrequency: `${range.stop}${unit}`,
-                defaultStep: null != band.defaultStep ? `${band.defaultStep}kHz` : void 0,
-                defaultBandwidth: null != band.defaultBandwidth ? `${band.defaultBandwidth}kHz` : void 0,
-                modulation: band.modulation,
-                demodulation: band.demodulation,
-                allocation: band.allocation,
-                status: band.status
+                stopFrequency: `${range.stop}${unit}`
             };
             if ('centerBandwidth' === range.type && null != range.frequency && null != range.bandwidth) {
                 tooltipData.centerFrequency = `${range.frequency}${unit}`;
@@ -11708,7 +12244,7 @@ const Board_Board = ({ id })=>{
     const handleChange = (0, __WEBPACK_EXTERNAL_MODULE_react__.useCallback)((e)=>{
         if (!e) return;
         const { index, frequency } = e;
-        if (!isNumberAlias(frequency)) return;
+        if (!(0, utils.Ri)(frequency)) return;
         onChange({
             index,
             frequency
@@ -11737,7 +12273,7 @@ FrequencyMarkerLine_styles_module_options.insertStyleElement = insertStyleElemen
 injectStylesIntoStyleTag_default()(FrequencyMarkerLine_styles_module.Z, FrequencyMarkerLine_styles_module_options);
 const components_FrequencyMarkerLine_styles_module = FrequencyMarkerLine_styles_module.Z && FrequencyMarkerLine_styles_module.Z.locals ? FrequencyMarkerLine_styles_module.Z.locals : void 0;
 const FrequencyMarkerLine_COMPONENT_KEY = constants_ToolType.FrequencyMarkerLine;
-const FrequencyMarkerLine = (props)=>{
+const FrequencyMarkerLine_FrequencyMarkerLine = (props)=>{
     const { state: { frequencyMarkerLine }, dispatch } = useStore_useStore();
     const { show, display, left, onChange } = frequencyMarkerLine;
     const { id } = props;
@@ -11811,7 +12347,7 @@ const FrequencyMarkerLine = (props)=>{
         })
     });
 };
-const components_FrequencyMarkerLine = /*#__PURE__*/ __WEBPACK_EXTERNAL_MODULE_react__["default"].memo(FrequencyMarkerLine);
+const FrequencyMarkerLine = /*#__PURE__*/ __WEBPACK_EXTERNAL_MODULE_react__["default"].memo(FrequencyMarkerLine_FrequencyMarkerLine);
 var Limit_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.3.1_@rsbuild+core@1.4.12/node_modules/@rsbuild/plugin-less/compiled/less-loader/index.js??ruleSet[1].rules[11].use[3]!./src/components/Limit/styles.module.less");
 var Limit_styles_module_options = {};
 Limit_styles_module_options.styleTagTransform = styleTagTransform_default();
@@ -11826,7 +12362,7 @@ const Item_Item = ({ value, onChange })=>{
     const { label, disabled } = limit;
     const { unit, range, step } = axisY;
     const [min, max] = range;
-    const diff = (0, __WEBPACK_EXTERNAL_MODULE_react__.useMemo)(()=>isdBm(unit) ? dBuV2dBm(0) : 0, [
+    const diff = (0, __WEBPACK_EXTERNAL_MODULE_react__.useMemo)(()=>(0, utils.Bp)(unit) ? dBuV2dBm(0) : 0, [
         unit
     ]);
     const value2top = (0, __WEBPACK_EXTERNAL_MODULE_react__.useCallback)((v)=>(max - v - diff) / (max - min) * 100, [
@@ -11965,7 +12501,7 @@ const Limit = ({ id })=>{
         });
         createDragEventManager(id, COMPONENT_NAME, (_, __, diff)=>{
             if (!canRender || disabled) return;
-            if (isNumberAlias(index) && compareEventPriority(id, COMPONENT_NAME)) {
+            if ((0, utils.Ri)(index) && compareEventPriority(id, COMPONENT_NAME)) {
                 if (diff?.top) setValue(index, Math.round(limit.value[index] - 100 * diff.top));
             }
         });
@@ -11984,7 +12520,7 @@ const Limit = ({ id })=>{
         children: segments?.map((i, index)=>/*#__PURE__*/ (0, __WEBPACK_EXTERNAL_MODULE_react_jsx_runtime_225474f2__.jsx)("div", {
                 style: {
                     width: `${100 * i.point / segments.totalPoints}%`,
-                    opacity: isNumberAlias(value[index]) ? 1 : 0
+                    opacity: (0, utils.Ri)(value[index]) ? 1 : 0
                 },
                 className: components_Limit_styles_module.item,
                 children: /*#__PURE__*/ (0, __WEBPACK_EXTERNAL_MODULE_react_jsx_runtime_225474f2__.jsx)(Item, {
@@ -12450,7 +12986,7 @@ function usePoints() {
     const { dispatch, state: { axisX } } = useStore_useStore();
     const setPoints = (0, __WEBPACK_EXTERNAL_MODULE_react__.useCallback)((points)=>{
         if (points?.length) {
-            axisX.frequencyFormat = leftPoints2frequency(points);
+            axisX.frequencyFormat = (0, utils.or)(points);
             dispatch({
                 payload: {
                     points,
@@ -12464,7 +13000,7 @@ function usePoints() {
 const Spectrum_Spectrum = (props)=>{
     const { selecter, children } = props;
     const { state: { axisY: { autoranging }, series: { weaken }, globalID } } = useStore_useStore();
-    const { id, chart, Chart } = hooks_useChart({
+    const { id, chart, Chart } = useChart({
         Render: Spectrum,
         params: {
             autoranging,
@@ -12573,7 +13109,7 @@ const Spectrum_Spectrum = (props)=>{
                     /*#__PURE__*/ (0, __WEBPACK_EXTERNAL_MODULE_react_jsx_runtime_225474f2__.jsx)(components_Stripe, {
                         id: id
                     }),
-                    /*#__PURE__*/ (0, __WEBPACK_EXTERNAL_MODULE_react_jsx_runtime_225474f2__.jsx)(components_FrequencyMarkerLine, {
+                    /*#__PURE__*/ (0, __WEBPACK_EXTERNAL_MODULE_react_jsx_runtime_225474f2__.jsx)(FrequencyMarkerLine, {
                         id: id
                     }),
                     /*#__PURE__*/ (0, __WEBPACK_EXTERNAL_MODULE_react_jsx_runtime_225474f2__.jsx)(FrequencyAllocation, {}),
@@ -12745,7 +13281,7 @@ const TotalLine = TotalLine_TotalLine;
 const Occupancy_Occupancy = (props)=>{
     const { occupancyAxisYDisabled } = props;
     const { state: { globalID } } = useStore_useStore();
-    const { id, chart, Chart } = hooks_useChart({
+    const { id, chart, Chart } = useChart({
         Render: Occupancy
     });
     const [value, setValue] = (0, __WEBPACK_EXTERNAL_MODULE_react__.useState)(0);
@@ -12840,9 +13376,9 @@ const ThreeFixedTicks = ()=>{
     const { start, bandwidth = 0 } = segments[0] ?? {};
     const center = (0, __WEBPACK_EXTERNAL_MODULE_react__.useMemo)(()=>{
         if (!endIndex || !bandwidth || void 0 === start) return 0;
-        const midIndex = getMidIndex(intervalStart, intervalEnd);
+        const midIndex = (0, utils.wF)(intervalStart, intervalEnd);
         const safeIndex = Math.max(0, Math.min(midIndex, endIndex));
-        return getFrequencyToFixed(start + safeIndex * bandwidth / (1000 * endIndex));
+        return (0, utils.lj)(start + safeIndex * bandwidth / (1000 * endIndex));
     }, [
         intervalStart,
         intervalEnd,
@@ -12853,7 +13389,7 @@ const ThreeFixedTicks = ()=>{
     const bandwidthDiff = (0, __WEBPACK_EXTERNAL_MODULE_react__.useMemo)(()=>{
         if (!totalPoints || !bandwidth) return 0;
         const intervalWidth = intervalEnd - intervalStart + 1;
-        return getFrequencyToFixed(intervalWidth * bandwidth / (2 * totalPoints));
+        return (0, utils.lj)(intervalWidth * bandwidth / (2 * totalPoints));
     }, [
         intervalStart,
         intervalEnd,
@@ -12978,7 +13514,7 @@ const AxisXTicks = ({ type })=>{
     });
 };
 const AxisX_Ticks = /*#__PURE__*/ (0, __WEBPACK_EXTERNAL_MODULE_react__.memo)(AxisXTicks);
-const AxisX = ({ type })=>{
+const AxisX_AxisX = ({ type })=>{
     const { state: { axisX } } = useStore_useStore();
     const { children, unit, ticks } = axisX;
     const { width, pluginBoxWidth } = useAxisYWidth();
@@ -13016,7 +13552,7 @@ const AxisX = ({ type })=>{
         })
     });
 };
-const components_AxisX = /*#__PURE__*/ (0, __WEBPACK_EXTERNAL_MODULE_react__.memo)(AxisX);
+const AxisX = /*#__PURE__*/ (0, __WEBPACK_EXTERNAL_MODULE_react__.memo)(AxisX_AxisX);
 var Blaze_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.3.1_@rsbuild+core@1.4.12/node_modules/@rsbuild/plugin-less/compiled/less-loader/index.js??ruleSet[1].rules[11].use[3]!./src/components/Blaze/styles.module.less");
 var Blaze_styles_module_options = {};
 Blaze_styles_module_options.styleTagTransform = styleTagTransform_default();
@@ -13664,7 +14200,7 @@ function useSegments() {
                 zoom,
                 axisX
             };
-            if (0 === points.length) payload.axisX.frequencyFormat = leftSegments2frequency(s);
+            if (0 === points.length) payload.axisX.frequencyFormat = (0, utils.Ax)(s);
             dispatch({
                 payload
             });
@@ -13710,7 +14246,7 @@ function useSpectrumRule({ channel, onChannelChange }) {
                 zoom
             }
         });
-        if (event === constants_SegmentsEvent.Cover) setSegments(generateGreatSegments(e.data));
+        if (event === constants_SegmentsEvent.Cover) setSegments((0, utils.sl)(e.data));
     }, [
         segments
     ]);
@@ -13733,7 +14269,7 @@ function useSpectrumRule({ channel, onChannelChange }) {
     });
     const generateSegmentsFromPoints = (0, __WEBPACK_EXTERNAL_MODULE_react__.useCallback)((points, newRule = ruleRef.current)=>{
         if (newRule.bandwidth && newRule.frequency && points) {
-            const segments = generateFrequencySegments({
+            const segments = (0, utils.IS)({
                 frequency: newRule?.frequency,
                 bandwidth: newRule?.bandwidth,
                 totalPoints: points
@@ -13786,7 +14322,7 @@ function useSpectrumRule({ channel, onChannelChange }) {
     }, []);
     return handleSpectrumRule;
 }
-const SegmentsDisplayControl = ()=>{
+const SegmentsDisplayControl_SegmentsDisplayControl = ()=>{
     const { state: { segments, globalID } } = useStore_useStore();
     const [display, setDisplay] = (0, __WEBPACK_EXTERNAL_MODULE_react__.useState)([]);
     const [selectedIndex, setSelectedIndex] = (0, __WEBPACK_EXTERNAL_MODULE_react__.useState)(null);
@@ -13827,7 +14363,7 @@ const SegmentsDisplayControl = ()=>{
         onChange: handleSelect
     });
 };
-const ToolsBar_SegmentsDisplayControl = SegmentsDisplayControl;
+const SegmentsDisplayControl = SegmentsDisplayControl_SegmentsDisplayControl;
 var SeriesDisplayControl_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.3.1_@rsbuild+core@1.4.12/node_modules/@rsbuild/plugin-less/compiled/less-loader/index.js??ruleSet[1].rules[11].use[3]!./src/components/ToolsBar/SeriesDisplayControl/styles.module.less");
 var SeriesDisplayControl_styles_module_options = {};
 SeriesDisplayControl_styles_module_options.styleTagTransform = styleTagTransform_default();
@@ -13837,7 +14373,7 @@ SeriesDisplayControl_styles_module_options.domAPI = styleDomAPI_default();
 SeriesDisplayControl_styles_module_options.insertStyleElement = insertStyleElement_default();
 injectStylesIntoStyleTag_default()(SeriesDisplayControl_styles_module.Z, SeriesDisplayControl_styles_module_options);
 const ToolsBar_SeriesDisplayControl_styles_module = SeriesDisplayControl_styles_module.Z && SeriesDisplayControl_styles_module.Z.locals ? SeriesDisplayControl_styles_module.Z.locals : void 0;
-const SeriesDisplayControl = ()=>{
+const SeriesDisplayControl_SeriesDisplayControl = ()=>{
     const { state: { globalID, series }, dispatch } = useStore_useStore();
     const { data, legendExternal, forceDisplay } = series;
     const seriesArray = (0, __WEBPACK_EXTERNAL_MODULE_react__.useMemo)(()=>Array.from(data.keys()).filter((name)=>!legendExternal.includes(name)).filter((name)=>name !== constants_SeriesType.TemplateData), [
@@ -13951,7 +14487,7 @@ const SeriesDisplayControl = ()=>{
         ]
     });
 };
-const ToolsBar_SeriesDisplayControl = SeriesDisplayControl;
+const SeriesDisplayControl = SeriesDisplayControl_SeriesDisplayControl;
 const SpacerLine = ()=>/*#__PURE__*/ (0, __WEBPACK_EXTERNAL_MODULE_react_jsx_runtime_225474f2__.jsx)("div", {
         className: components_ToolsBar_styles_module.spacerLine
     });
@@ -13987,7 +14523,7 @@ const ToolsBar = ({ type })=>{
                     ]
                 }),
                 type === constants_ChartType.Scan && /*#__PURE__*/ (0, __WEBPACK_EXTERNAL_MODULE_react_jsx_runtime_225474f2__.jsx)(__WEBPACK_EXTERNAL_MODULE_react_jsx_runtime_225474f2__.Fragment, {
-                    children: /*#__PURE__*/ (0, __WEBPACK_EXTERNAL_MODULE_react_jsx_runtime_225474f2__.jsx)(ToolsBar_SegmentsDisplayControl, {})
+                    children: /*#__PURE__*/ (0, __WEBPACK_EXTERNAL_MODULE_react_jsx_runtime_225474f2__.jsx)(SegmentsDisplayControl, {})
                 }),
                 type === constants_ChartType.Heatmap && /*#__PURE__*/ (0, __WEBPACK_EXTERNAL_MODULE_react_jsx_runtime_225474f2__.jsxs)(__WEBPACK_EXTERNAL_MODULE_react_jsx_runtime_225474f2__.Fragment, {
                     children: [
@@ -13995,7 +14531,7 @@ const ToolsBar = ({ type })=>{
                         /*#__PURE__*/ (0, __WEBPACK_EXTERNAL_MODULE_react_jsx_runtime_225474f2__.jsx)(TimeRange_Switch, {})
                     ]
                 }),
-                (type === constants_ChartType.SingleFrequency || type === constants_ChartType.Scan || type === constants_ChartType.MScan) && /*#__PURE__*/ (0, __WEBPACK_EXTERNAL_MODULE_react_jsx_runtime_225474f2__.jsx)(ToolsBar_SeriesDisplayControl, {})
+                (type === constants_ChartType.SingleFrequency || type === constants_ChartType.Scan || type === constants_ChartType.MScan) && /*#__PURE__*/ (0, __WEBPACK_EXTERNAL_MODULE_react_jsx_runtime_225474f2__.jsx)(SeriesDisplayControl, {})
             ]
         })
     });
@@ -14056,7 +14592,7 @@ function useMarkerLinkageZoom() {
 const SET_SERIES = (globalID, func)=>subscription_createSubscriptionManager(`SET_SERIES-${globalID}`, '0', func);
 const SERIES_DEFAULT_CONFIG = {
     label: '',
-    color: 'rgba(1,1,1,0.5)',
+    color: '#11111150',
     thickness: 1,
     display: true,
     type: type_GraphicType.Stepline
@@ -14394,7 +14930,7 @@ function useSpectrumAnalyzer(props) {
             case constants_PSType.Heatmap:
                 if (e.data) {
                     const { data, timestamps } = e;
-                    const waterfallData = convertToTimestampedArrays(data, timestamps);
+                    const waterfallData = (0, utils.P9)(data, timestamps);
                     analyzer.current.setWaterfallData(waterfallData);
                 }
                 break;
@@ -14548,7 +15084,7 @@ const HeatmapPortal_Chart = (props)=>{
                 /*#__PURE__*/ (0, __WEBPACK_EXTERNAL_MODULE_react_jsx_runtime_225474f2__.jsx)(modules_Heatmap, {
                     selecter: selecter
                 }),
-                /*#__PURE__*/ (0, __WEBPACK_EXTERNAL_MODULE_react_jsx_runtime_225474f2__.jsx)(components_AxisX, {
+                /*#__PURE__*/ (0, __WEBPACK_EXTERNAL_MODULE_react_jsx_runtime_225474f2__.jsx)(AxisX, {
                     type: type
                 })
             ]
@@ -14566,7 +15102,7 @@ const OccupancyPortal_Chart = (props)=>{
                     type: constants_ChartType.Occupancy
                 }),
                 /*#__PURE__*/ (0, __WEBPACK_EXTERNAL_MODULE_react_jsx_runtime_225474f2__.jsx)(modules_Occupancy, {}),
-                /*#__PURE__*/ (0, __WEBPACK_EXTERNAL_MODULE_react_jsx_runtime_225474f2__.jsx)(components_AxisX, {
+                /*#__PURE__*/ (0, __WEBPACK_EXTERNAL_MODULE_react_jsx_runtime_225474f2__.jsx)(AxisX, {
                     type: type
                 })
             ]
@@ -14635,7 +15171,7 @@ const Spectrum_Chart_Chart = (props)=>{
                     })
                 ]
             }),
-            /*#__PURE__*/ (0, __WEBPACK_EXTERNAL_MODULE_react_jsx_runtime_225474f2__.jsx)(components_AxisX, {
+            /*#__PURE__*/ (0, __WEBPACK_EXTERNAL_MODULE_react_jsx_runtime_225474f2__.jsx)(AxisX, {
                 type: type
             })
         ]
@@ -14650,4 +15186,4 @@ const SpectrumChart = (props)=>/*#__PURE__*/ (0, __WEBPACK_EXTERNAL_MODULE_react
     });
 const lib_Spectrum_Spectrum = withChartPublisher(SpectrumChart, 'Spectrum');
 const lib_Spectrum = lib_Spectrum_Spectrum;
-export { constants_ChartType as ChartType, lib_Dial as Dial, lib_Gauge as Gauge, lib_Heatmap as Heatmap, store_HeatmapCaptureType as HeatmapCaptureType, lib_IQ as IQ, LevelStream, constants_MarkerEventType as MarkerEventType, lib_Occupancy as Occupancy, constants_OptionKey as OptionKey, constants_PSType as PSType, constants_SegmentsEvent as SegmentsEvent, constants_SeriesType as SeriesType, lib_Spectrum as Spectrum, useSafePublish };
+export { constants_ChartType as ChartType, lib_Dial as Dial, lib_Gauge as Gauge, lib_Heatmap as Heatmap, store_HeatmapCaptureType as HeatmapCaptureType, lib_IQ as IQ, LevelStream, constants_MarkerEventType as MarkerEventType, lib_Occupancy as Occupancy, constants_OptionKey as OptionKey, constants_PSType as PSType, constants_SegmentsEvent as SegmentsEvent, constants_SeriesType as SeriesType, lib_Spectrum as Spectrum, setFrequencyAllocationToCache, useSafePublish };