@perses-dev/components 0.2.0 → 0.3.1

package/dist/cjs/LineChart.js

@@ -0,0 +1,227 @@
+"use strict";
+var __importDefault = (this && this.__importDefault) || function (mod) {
+    return (mod && mod.__esModule) ? mod : { "default": mod };
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.LineChart = void 0;
+const jsx_runtime_1 = require("react/jsx-runtime");
+// Copyright 2021 The Perses Authors
+// Licensed under the Apache License, Version 2.0 (the "License");
+// you may not use this file except in compliance with the License.
+// You may obtain a copy of the License at
+//
+// http://www.apache.org/licenses/LICENSE-2.0
+//
+// Unless required by applicable law or agreed to in writing, software
+// distributed under the License is distributed on an "AS IS" BASIS,
+// WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+// See the License for the specific language governing permissions and
+// limitations under the License.
+const react_1 = require("react");
+const material_1 = require("@mui/material");
+const merge_1 = __importDefault(require("lodash/merge"));
+const core_1 = require("echarts/core");
+const charts_1 = require("echarts/charts");
+const components_1 = require("echarts/components");
+const renderers_1 = require("echarts/renderers");
+const ECharts_1 = require("./ECharts");
+const graph_model_1 = require("./model/graph-model");
+const units_1 = require("./model/units");
+const tooltip_model_1 = require("./tooltip/tooltip-model");
+const Tooltip_1 = require("./tooltip/Tooltip");
+(0, core_1.use)([
+    charts_1.LineChart,
+    components_1.GridComponent,
+    components_1.DataZoomComponent,
+    components_1.MarkAreaComponent,
+    components_1.MarkLineComponent,
+    components_1.MarkPointComponent,
+    components_1.TitleComponent,
+    components_1.ToolboxComponent,
+    components_1.TooltipComponent,
+    components_1.LegendComponent,
+    components_1.VisualMapComponent,
+    renderers_1.CanvasRenderer,
+]);
+const noDataOption = {
+    title: {
+        show: true,
+        textStyle: {
+            color: 'grey',
+            fontSize: 16,
+            fontWeight: 400,
+        },
+        text: 'No data',
+        left: 'center',
+        top: 'center',
+    },
+    xAxis: {
+        show: false,
+    },
+    yAxis: {
+        show: false,
+    },
+    series: [],
+};
+function LineChart(props) {
+    const { height, data, grid, legend, toolbox, dataZoomEnabled, onDataZoom } = props;
+    const theme = (0, material_1.useTheme)();
+    const chartRef = (0, react_1.useRef)();
+    const [showTooltip, setShowTooltip] = (0, react_1.useState)(true);
+    const handleEvents = (0, react_1.useMemo)(() => {
+        return {
+            datazoom: (params) => {
+                var _a, _b;
+                if (onDataZoom === undefined || params.batch[0] === undefined)
+                    return;
+                const startIndex = (_a = params.batch[0].startValue) !== null && _a !== void 0 ? _a : 0;
+                const endIndex = (_b = params.batch[0].endValue) !== null && _b !== void 0 ? _b : data.xAxis.length - 1;
+                const xAxisStartValue = data.xAxis[startIndex];
+                const xAxisEndValue = data.xAxis[endIndex];
+                if (xAxisStartValue !== undefined && xAxisEndValue !== undefined) {
+                    const zoomEvent = {
+                        start: xAxisStartValue,
+                        end: xAxisEndValue,
+                        startIndex,
+                        endIndex,
+                    };
+                    onDataZoom(zoomEvent);
+                }
+            },
+        };
+    }, [data, onDataZoom]);
+    if (chartRef.current !== undefined && dataZoomEnabled === true) {
+        const chart = chartRef.current;
+        chart.dispatchAction({
+            type: 'takeGlobalCursor',
+            key: 'dataZoomSelect',
+            dataZoomSelectActive: true,
+        });
+    }
+    const handleOnMouseDown = (event) => {
+        // hide tooltip when user drags to zoom, but allow clicking inside tooltip to copy labels
+        if (event.target instanceof HTMLCanvasElement) {
+            setShowTooltip(false);
+        }
+    };
+    const handleOnMouseUp = () => {
+        setShowTooltip(true);
+    };
+    const handleOnMouseEnter = () => {
+        setShowTooltip(true);
+    };
+    const handleOnMouseLeave = () => {
+        setShowTooltip(false);
+    };
+    const option = (0, react_1.useMemo)(() => {
+        if (data.timeSeries === undefined)
+            return {};
+        if (data.timeSeries === null || data.timeSeries.length === 0)
+            return noDataOption;
+        const showPointsOnHover = data.timeSeries.length < graph_model_1.PROGRESSIVE_MODE_SERIES_LIMIT;
+        const defaultGrid = {
+            show: true,
+            backgroundColor: theme.palette.mode === 'dark' ? theme.palette.grey[100] : theme.palette.background.paper,
+            borderColor: theme.palette.grey['300'],
+            top: 10,
+            right: 20,
+            bottom: 0,
+            left: 20,
+            containLabel: true,
+        };
+        const defaultToolbox = {
+            show: true,
+            top: 10,
+            right: 10,
+            iconStyle: {
+                borderColor: theme.palette.text.primary,
+            },
+            feature: {
+                dataZoom: {
+                    icon: dataZoomEnabled ? null : undefined,
+                    yAxisIndex: 'none',
+                },
+                restore: {},
+            },
+            emphasis: {
+                iconStyle: {
+                    textFill: theme.palette.text.primary,
+                },
+            },
+        };
+        if (dataZoomEnabled === false) {
+            delete defaultToolbox.feature.dataZoom.icon;
+        }
+        const option = {
+            title: {
+                show: false,
+            },
+            grid: (0, merge_1.default)(defaultGrid, grid),
+            toolbox: (0, merge_1.default)(defaultToolbox, toolbox),
+            series: data.timeSeries,
+            xAxis: {
+                type: 'category',
+                data: data.xAxis,
+                axisLabel: {
+                    color: theme.palette.text.primary,
+                    margin: 12,
+                    formatter: (value) => {
+                        return getFormattedDate(value);
+                    },
+                },
+                axisTick: {
+                    show: true,
+                    length: 6,
+                },
+                axisLine: {
+                    lineStyle: {
+                        color: theme.palette.grey['600'],
+                    },
+                },
+            },
+            yAxis: {
+                type: 'value',
+                boundaryGap: ['10%', '10%'],
+                axisLabel: {
+                    showMinLabel: false,
+                    showMaxLabel: true,
+                    color: theme.palette.text.primary,
+                    formatter: (value) => {
+                        return (0, units_1.abbreviateLargeNumber)(value);
+                    },
+                },
+                splitLine: {
+                    lineStyle: {
+                        color: theme.palette.grey['300'],
+                    },
+                },
+            },
+            animation: false,
+            tooltip: {
+                show: showPointsOnHover,
+                trigger: 'axis',
+                showContent: false,
+                axisPointer: {
+                    type: 'none',
+                },
+            },
+            legend,
+        };
+        return option;
+    }, [data, theme, grid, legend, toolbox, dataZoomEnabled]);
+    return ((0, jsx_runtime_1.jsxs)(material_1.Box, { sx: {
+            height,
+        }, onMouseDown: handleOnMouseDown, onMouseUp: handleOnMouseUp, onMouseLeave: handleOnMouseLeave, onMouseEnter: handleOnMouseEnter, children: [showTooltip === true && ((0, jsx_runtime_1.jsx)(Tooltip_1.Tooltip, { chartRef: chartRef, tooltipData: tooltip_model_1.emptyTooltipData, chartData: data, wrapLabels: true })), (0, jsx_runtime_1.jsx)(ECharts_1.ECharts, { sx: {
+                    width: '100%',
+                    height: '100%',
+                }, option: option, onEvents: handleEvents, _instance: chartRef })] }));
+}
+exports.LineChart = LineChart;
+function getFormattedDate(value) {
+    const XAXIS_DATE_FORMAT = new Intl.DateTimeFormat(undefined, {
+        hour: 'numeric',
+        minute: 'numeric',
+        hour12: false,
+    });
+    return XAXIS_DATE_FORMAT.format(value * 1000);
+}

package/dist/cjs/StatChart.js

@@ -0,0 +1,205 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.StatChart = void 0;
+const jsx_runtime_1 = require("react/jsx-runtime");
+// Copyright 2021 The Perses Authors
+// Licensed under the Apache License, Version 2.0 (the "License");
+// you may not use this file except in compliance with the License.
+// You may obtain a copy of the License at
+//
+// http://www.apache.org/licenses/LICENSE-2.0
+//
+// Unless required by applicable law or agreed to in writing, software
+// distributed under the License is distributed on an "AS IS" BASIS,
+// WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+// See the License for the specific language governing permissions and
+// limitations under the License.
+const react_1 = require("react");
+const lodash_es_1 = require("lodash-es");
+const core_1 = require("echarts/core");
+const charts_1 = require("echarts/charts");
+const charts_2 = require("echarts/charts");
+const components_1 = require("echarts/components");
+const renderers_1 = require("echarts/renderers");
+const units_1 = require("./model/units");
+const ECharts_1 = require("./ECharts");
+(0, core_1.use)([
+    charts_1.GaugeChart,
+    charts_2.LineChart,
+    components_1.GridComponent,
+    components_1.DatasetComponent,
+    components_1.TitleComponent,
+    components_1.TooltipComponent,
+    renderers_1.CanvasRenderer,
+]);
+const noDataOption = {
+    title: {
+        show: true,
+        textStyle: {
+            color: 'grey',
+            fontSize: 16,
+            fontWeight: 400,
+        },
+        text: 'No data',
+        left: 'center',
+        top: 'center',
+    },
+    xAxis: {
+        show: false,
+    },
+    yAxis: {
+        show: false,
+    },
+    series: [],
+};
+function StatChart(props) {
+    const { width, height, data, unit, backgroundColor, sparkline } = props;
+    const option = (0, react_1.useMemo)(() => {
+        var _a;
+        if (data.seriesData === undefined)
+            return {};
+        if (data.seriesData === null || data.calculatedValue === undefined)
+            return noDataOption;
+        const series = data.seriesData;
+        const calculatedValue = (_a = data.calculatedValue) !== null && _a !== void 0 ? _a : 0;
+        const isLargePanel = width > 250 ? true : false;
+        const showName = isLargePanel;
+        const name = showName === true ? data.name : '';
+        const smallestSide = Math.min(width, height * 1.2);
+        const baseFontSize = Math.min((smallestSide / 4) * 0.65, 72);
+        const nameFontSize = baseFontSize * 0.5;
+        const statSeries = [
+            {
+                type: 'gauge',
+                data: [
+                    {
+                        value: calculatedValue,
+                        name: name,
+                    },
+                ],
+                detail: {
+                    show: true,
+                    offsetCenter: ['0%', '-65%'],
+                    formatter: [`{name|${name}}`, `{value|${(0, units_1.formatValue)(calculatedValue, unit)}}`].join('\n'),
+                    rich: {
+                        name: {
+                            padding: showName === true ? [0, 0, 5, 0] : 0,
+                            fontSize: nameFontSize,
+                            lineHeight: nameFontSize * 2.5,
+                            fontWeight: 500,
+                        },
+                        value: {},
+                    },
+                },
+                center: ['50%', '60%'],
+                animation: false,
+                silent: true,
+                title: { show: false },
+                progress: { show: false },
+                pointer: { show: false },
+                axisLine: { show: false },
+                axisTick: { show: false },
+                splitLine: { show: false },
+                axisLabel: { show: false },
+                anchor: { show: false },
+                zlevel: 2,
+            },
+        ];
+        if (sparkline !== undefined) {
+            const lineSeries = {
+                type: 'line',
+                data: [...series.values],
+                zlevel: 1,
+                symbol: 'none',
+                animation: false,
+                lineStyle: {
+                    color: '#FFFFFF',
+                    opacity: 0.6,
+                },
+                areaStyle: {
+                    color: '#FFFFFF',
+                    opacity: 0.3,
+                },
+                silent: true,
+            };
+            const mergedSeries = (0, lodash_es_1.merge)(lineSeries, sparkline);
+            statSeries.push(mergedSeries);
+        }
+        const option = {
+            title: {
+                show: false,
+            },
+            grid: [
+                {
+                    show: true,
+                    backgroundColor: backgroundColor,
+                    top: 0,
+                    right: 0,
+                    bottom: 0,
+                    left: 0,
+                    containLabel: false,
+                    borderWidth: 0,
+                },
+                {
+                    show: false,
+                    top: '45%',
+                    right: 0,
+                    bottom: 0,
+                    left: 0,
+                    containLabel: false,
+                },
+            ],
+            xAxis: {
+                type: 'time',
+                show: false,
+                boundaryGap: false,
+                gridIndex: 1, // sparkline grid
+            },
+            yAxis: {
+                type: 'value',
+                show: false,
+                gridIndex: 1,
+            },
+            tooltip: {
+                show: false,
+            },
+            series: statSeries,
+            textStyle: {
+                color: backgroundColor === 'transparent' ? '#000000' : '#FFFFFF',
+                fontSize: 25,
+                lineHeight: 18,
+                fontFamily: '"Lato", sans-serif',
+                fontWeight: 'bold',
+            },
+            media: [
+                {
+                    query: {
+                        maxWidth: 150,
+                    },
+                    option: {
+                        textStyle: {
+                            fontSize: 12,
+                        },
+                    },
+                },
+                {
+                    query: {
+                        minWidth: 150,
+                    },
+                    option: {
+                        textStyle: {
+                            fontSize: `max(14px, ${baseFontSize}px)`,
+                            lineHeight: Math.min(16, baseFontSize * 1.2),
+                        },
+                    },
+                },
+            ],
+        };
+        return option;
+    }, [data, height, unit, width, sparkline, backgroundColor]);
+    return ((0, jsx_runtime_1.jsx)(ECharts_1.ECharts, { sx: {
+            width: width,
+            height: height,
+        }, option: option }));
+}
+exports.StatChart = StatChart;

package/dist/cjs/index.js

@@ -0,0 +1,37 @@
+"use strict";
+// Copyright 2021 The Perses Authors
+// Licensed under the Apache License, Version 2.0 (the "License");
+// you may not use this file except in compliance with the License.
+// You may obtain a copy of the License at
+//
+// http://www.apache.org/licenses/LICENSE-2.0
+//
+// Unless required by applicable law or agreed to in writing, software
+// distributed under the License is distributed on an "AS IS" BASIS,
+// WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+// See the License for the specific language governing permissions and
+// limitations under the License.
+var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    var desc = Object.getOwnPropertyDescriptor(m, k);
+    if (!desc || ("get" in desc ? !m.__esModule : desc.writable || desc.configurable)) {
+      desc = { enumerable: true, get: function() { return m[k]; } };
+    }
+    Object.defineProperty(o, k2, desc);
+}) : (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    o[k2] = m[k];
+}));
+var __exportStar = (this && this.__exportStar) || function(m, exports) {
+    for (var p in m) if (p !== "default" && !Object.prototype.hasOwnProperty.call(exports, p)) __createBinding(exports, m, p);
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+__exportStar(require("./ECharts"), exports);
+__exportStar(require("./ErrorAlert"), exports);
+__exportStar(require("./ErrorBoundary"), exports);
+__exportStar(require("./GaugeChart"), exports);
+__exportStar(require("./LineChart"), exports);
+__exportStar(require("./StatChart"), exports);
+__exportStar(require("./utils/combine-sx"), exports);
+__exportStar(require("./model/graph-model"), exports);
+__exportStar(require("./model/units"), exports);

package/dist/cjs/model/graph-model.js

@@ -0,0 +1,16 @@
+"use strict";
+// Copyright 2021 The Perses Authors
+// Licensed under the Apache License, Version 2.0 (the "License");
+// you may not use this file except in compliance with the License.
+// You may obtain a copy of the License at
+//
+// http://www.apache.org/licenses/LICENSE-2.0
+//
+// Unless required by applicable law or agreed to in writing, software
+// distributed under the License is distributed on an "AS IS" BASIS,
+// WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+// See the License for the specific language governing permissions and
+// limitations under the License.
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.PROGRESSIVE_MODE_SERIES_LIMIT = void 0;
+exports.PROGRESSIVE_MODE_SERIES_LIMIT = 500;

package/dist/cjs/model/units.js

@@ -0,0 +1,211 @@
+"use strict";
+// Copyright 2021 The Perses Authors
+// Licensed under the Apache License, Version 2.0 (the "License");
+// you may not use this file except in compliance with the License.
+// You may obtain a copy of the License at
+//
+// http://www.apache.org/licenses/LICENSE-2.0
+//
+// Unless required by applicable law or agreed to in writing, software
+// distributed under the License is distributed on an "AS IS" BASIS,
+// WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+// See the License for the specific language governing permissions and
+// limitations under the License.
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.SIMPLE_UNITS = exports.removeUnitNamespace = exports.SANCTIONED_UNITS = exports.isSanctionedSimpleUnitIdentifier = exports.abbreviateLargeNumber = exports.formatValue = void 0;
+const date_fns_1 = require("date-fns");
+function formatValue(value, unitOptions) {
+    if (unitOptions === undefined) {
+        return value.toString();
+    }
+    if (isTimeUnit(unitOptions)) {
+        return formatTime(value, unitOptions);
+    }
+    if (isPercentUnit(unitOptions)) {
+        return formatPercent(value, unitOptions);
+    }
+    if (isDecimalUnit(unitOptions)) {
+        return formatDecimal(value, unitOptions);
+    }
+    const exhaustive = unitOptions;
+    throw new Error(`Unknown unit options ${exhaustive}`);
+}
+exports.formatValue = formatValue;
+const timeUnitKinds = ['Milliseconds', 'Seconds', 'Minutes', 'Hours', 'Days', 'Weeks', 'Months', 'Years'];
+const timeUnitKindsSet = new Set(timeUnitKinds);
+function isTimeUnit(unitOptions) {
+    return timeUnitKindsSet.has(unitOptions.kind);
+}
+function formatTime(value, unitOptions) {
+    // Create a Duration from the value based on what time unit it is
+    const duration = {};
+    switch (unitOptions.kind) {
+        case 'Milliseconds':
+            duration.seconds = value / 1000;
+            break;
+        case 'Seconds':
+            duration.seconds = value;
+            break;
+        case 'Minutes':
+            duration.minutes = value;
+            break;
+        case 'Hours':
+            duration.hours = value;
+            break;
+        case 'Days':
+            duration.days = value;
+            break;
+        case 'Weeks':
+            duration.weeks = value;
+            break;
+        case 'Months':
+            duration.months = value;
+            break;
+        case 'Years':
+            duration.years = value;
+            break;
+        default:
+            const exhaustive = unitOptions.kind;
+            throw new Error(`Unknown time unit type ${exhaustive}`);
+    }
+    // Find the largest whole time unit we can display the value in and use it
+    const ms = (0, date_fns_1.milliseconds)(duration);
+    const seconds = ms / 1000;
+    if (seconds < 1) {
+        return `${ms.toFixed()} milliseconds`;
+    }
+    const minutes = seconds / 60;
+    if (minutes < 1) {
+        return `${seconds.toFixed()} seconds`;
+    }
+    const hours = minutes / 60;
+    if (hours < 1) {
+        return `${minutes.toFixed()} minutes`;
+    }
+    const days = hours / 24;
+    if (days < 1) {
+        return `${hours.toFixed()} hours`;
+    }
+    const weeks = days / 7;
+    if (weeks < 1) {
+        return `${days.toFixed()} days`;
+    }
+    const years = weeks / 52;
+    if (years < 1) {
+        return `${weeks.toFixed()} weeks`;
+    }
+    return `${years.toFixed()} years`;
+}
+const percentUnitKinds = ['Percent', 'PercentDecimal'];
+const percentUnitKindsSet = new Set(percentUnitKinds);
+function isPercentUnit(unitOptions) {
+    return percentUnitKindsSet.has(unitOptions.kind);
+}
+function formatPercent(value, unitOptions) {
+    if (unitOptions.kind === 'PercentDecimal') {
+        value = value * 100;
+    }
+    return value.toFixed(unitOptions.decimal_places) + '%';
+}
+const decimalUnitKinds = ['Decimal'];
+const decimalUnitKindsSet = new Set(decimalUnitKinds);
+function isDecimalUnit(unitOptions) {
+    return decimalUnitKindsSet.has(unitOptions.kind);
+}
+function formatDecimal(value, unitOptions) {
+    var _a, _b;
+    const maximumFractionDigits = (_a = unitOptions.decimal_places) !== null && _a !== void 0 ? _a : 2;
+    if (unitOptions.suffix !== undefined) {
+        if (isSanctionedSimpleUnitIdentifier(unitOptions.suffix)) {
+            const formatParams = {
+                style: 'unit',
+                minimumFractionDigits: 0,
+                maximumFractionDigits: maximumFractionDigits,
+                useGrouping: true,
+                unit: unitOptions.suffix,
+                unitDisplay: (_b = unitOptions.unitDisplay) !== null && _b !== void 0 ? _b : 'narrow',
+            };
+            const unitFormatter = new Intl.NumberFormat('en-US', formatParams);
+            return unitFormatter.format(value);
+        }
+    }
+    const formatParams = {
+        style: 'decimal',
+        minimumFractionDigits: 0,
+        maximumFractionDigits: maximumFractionDigits,
+        useGrouping: true,
+    };
+    const decimalFormatter = new Intl.NumberFormat('en-US', formatParams);
+    return decimalFormatter.format(value);
+}
+// Take a large number and abbreviate appropriate suffix
+// ex) 10000 -> 10k, 1000000 -> 1M
+function abbreviateLargeNumber(num) {
+    return num >= 1e12
+        ? num / 1e12 + 'T'
+        : num >= 1e9
+            ? num / 1e9 + 'B'
+            : num >= 1e6
+                ? num / 1e6 + 'M'
+                : num >= 1e3
+                    ? num / 1e3 + 'k'
+                    : num;
+}
+exports.abbreviateLargeNumber = abbreviateLargeNumber;
+// Util to check unit name against ECMA standard: https://tc39.es/ecma402/#sec-issanctionedsimpleunitidentifier
+function isSanctionedSimpleUnitIdentifier(unitIdentifier) {
+    return exports.SIMPLE_UNITS.indexOf(unitIdentifier) > -1;
+}
+exports.isSanctionedSimpleUnitIdentifier = isSanctionedSimpleUnitIdentifier;
+// https://tc39.es/ecma402/#table-sanctioned-simple-unit-identifiers
+exports.SANCTIONED_UNITS = [
+    'angle-degree',
+    'area-acre',
+    'area-hectare',
+    'concentr-percent',
+    'digital-bit',
+    'digital-byte',
+    'digital-gigabit',
+    'digital-gigabyte',
+    'digital-kilobit',
+    'digital-kilobyte',
+    'digital-megabit',
+    'digital-megabyte',
+    'digital-petabyte',
+    'digital-terabit',
+    'digital-terabyte',
+    'duration-day',
+    'duration-hour',
+    'duration-millisecond',
+    'duration-minute',
+    'duration-month',
+    'duration-second',
+    'duration-week',
+    'duration-year',
+    'length-centimeter',
+    'length-foot',
+    'length-inch',
+    'length-kilometer',
+    'length-meter',
+    'length-mile-scandinavian',
+    'length-mile',
+    'length-millimeter',
+    'length-yard',
+    'mass-gram',
+    'mass-kilogram',
+    'mass-ounce',
+    'mass-pound',
+    'mass-stone',
+    'temperature-celsius',
+    'temperature-fahrenheit',
+    'volume-fluid-ounce',
+    'volume-gallon',
+    'volume-liter',
+    'volume-milliliter',
+];
+// removes the namespace prefix, ex: duration-hour -> hour
+function removeUnitNamespace(unit) {
+    return unit.slice(unit.indexOf('-') + 1);
+}
+exports.removeUnitNamespace = removeUnitNamespace;
+exports.SIMPLE_UNITS = exports.SANCTIONED_UNITS.map(removeUnitNamespace);