@perses-dev/components 0.54.0-beta.0 → 0.54.0-beta.1

package/dist/cjs/model/decimal.js

@@ -0,0 +1,72 @@
+// Copyright 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.
+"use strict";
+Object.defineProperty(exports, "__esModule", {
+    value: true
+});
+function _export(target, all) {
+    for(var name in all)Object.defineProperty(target, name, {
+        enumerable: true,
+        get: Object.getOwnPropertyDescriptor(all, name).get
+    });
+}
+_export(exports, {
+    get DECIMAL_GROUP_CONFIG () {
+        return DECIMAL_GROUP_CONFIG;
+    },
+    get DECIMAL_UNIT_CONFIG () {
+        return DECIMAL_UNIT_CONFIG;
+    },
+    get formatDecimal () {
+        return formatDecimal;
+    }
+});
+const _constants = require("./constants");
+const _formatterCache = require("./formatterCache");
+const _utils = require("./utils");
+const DECIMAL_GROUP_CONFIG = {
+    label: 'Decimal',
+    decimalPlaces: true,
+    shortValues: true
+};
+const DECIMAL_UNIT_CONFIG = {
+    decimal: {
+        group: 'Decimal',
+        label: 'Decimal'
+    }
+};
+function formatDecimal(value, { shortValues, decimalPlaces }) {
+    const formatterOptions = {
+        style: 'decimal',
+        useGrouping: true
+    };
+    if ((0, _utils.shouldShortenValues)(shortValues)) {
+        formatterOptions.notation = 'compact';
+    }
+    if ((0, _utils.hasDecimalPlaces)(decimalPlaces)) {
+        formatterOptions.minimumFractionDigits = (0, _utils.limitDecimalPlaces)(decimalPlaces);
+        formatterOptions.maximumFractionDigits = (0, _utils.limitDecimalPlaces)(decimalPlaces);
+    } else {
+        if ((0, _utils.shouldShortenValues)(shortValues)) {
+            formatterOptions.maximumSignificantDigits = _constants.MAX_SIGNIFICANT_DIGITS;
+        }
+    }
+    const key = [
+        formatterOptions.style,
+        formatterOptions.useGrouping,
+        formatterOptions.notation,
+        formatterOptions.maximumSignificantDigits,
+        decimalPlaces
+    ];
+    return (0, _formatterCache.getFormatterFromCache)(key, 'decimal', formatterOptions, 'en-US')(value);
+}

package/dist/cjs/model/formatterCache.js

@@ -0,0 +1,120 @@
+// Copyright 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.
+"use strict";
+Object.defineProperty(exports, "__esModule", {
+    value: true
+});
+function _export(target, all) {
+    for(var name in all)Object.defineProperty(target, name, {
+        enumerable: true,
+        get: Object.getOwnPropertyDescriptor(all, name).get
+    });
+}
+_export(exports, {
+    get getFormatterFromCache () {
+        return getFormatterFromCache;
+    },
+    get getFormatterStats () {
+        return getFormatterStats;
+    }
+});
+/**
+ * REASONING FOR CLUSTERING (Map-of-Maps):
+ *
+ * 1. PERSISTENCE & REUSE: Intl.NumberFormat instantiation is CPU-heavy due to
+ *    locale/data lookups. Clustering allows 100x faster reuse via caching.
+ *
+ *
+ * 2. LOOKUP PERFORMANCE: Smaller, specialized Maps reduce the risk of hash
+ *    collisions, ensuring O(1) retrieval time remains consistent even as
+ *    the total number of formatters across the app grows.
+ *
+ * 3. GARBAGE COLLECTION & STATS: Categorization allows for targeted memory
+ *    monitoring and easier debugging of which specific data types are
+ *    consuming the most resources.
+ */ const TIME_FORMATTER_CACHE = new Map();
+const DECIMAL_FORMATTER_CACHE = new Map();
+const BITS_FORMATTER_CACHE = new Map();
+const BYTES_FORMATTER_CACHE = new Map();
+const CURRENCY_FORMATTER_CACHE = new Map();
+const PERCENT_FORMATTER_CACHE = new Map();
+const TEMPERATURE_FORMATTER_CACHE = new Map();
+const THROUGHPUT_FORMATTER_CACHE = new Map();
+const ALL_FORMATTERS = new Map([
+    [
+        'time',
+        TIME_FORMATTER_CACHE
+    ],
+    [
+        'decimal',
+        DECIMAL_FORMATTER_CACHE
+    ],
+    [
+        'bits',
+        BITS_FORMATTER_CACHE
+    ],
+    [
+        'bytes',
+        BYTES_FORMATTER_CACHE
+    ],
+    [
+        'currency',
+        CURRENCY_FORMATTER_CACHE
+    ],
+    [
+        'percent',
+        PERCENT_FORMATTER_CACHE
+    ],
+    [
+        'temperature',
+        TEMPERATURE_FORMATTER_CACHE
+    ],
+    [
+        'throughput',
+        THROUGHPUT_FORMATTER_CACHE
+    ]
+]);
+function getFormatterFromCache(key, inputType, formatterOptions, locals = 'en-US') {
+    const compoundKey = `${key.filter((k)=>![
+            undefined,
+            null,
+            '',
+            NaN
+        ].includes(k)).join('|')}|${locals}`;
+    const inputTypeFormatters = ALL_FORMATTERS.get(inputType);
+    if (!inputTypeFormatters) throw new Error('No formatter found for the input type');
+    const formatter = inputTypeFormatters.get(compoundKey);
+    if (formatter) {
+        return formatter.format;
+    }
+    const newFormatter = Intl.NumberFormat(locals, formatterOptions);
+    inputTypeFormatters?.set(`${compoundKey}`, newFormatter);
+    return newFormatter.format;
+}
+const getFormatterStats = ()=>{
+    const countCacheItems = (inputType)=>{
+        if (inputType !== 'all') {
+            return ALL_FORMATTERS.get(inputType)?.size ?? 0;
+        }
+        return Array.from(ALL_FORMATTERS.values()).reduce((acc, map)=>acc + (map?.size ?? 0), 0);
+    };
+    const getKeys = (inputType)=>{
+        return [
+            ...ALL_FORMATTERS.get(inputType)?.keys() || []
+        ];
+    };
+    return {
+        countCacheItems,
+        getKeys
+    };
+};

package/dist/cjs/model/index.js

@@ -18,6 +18,22 @@ _export_star(require("./graph"), exports);
 _export_star(require("./theme"), exports);
 _export_star(require("./timeOption"), exports);
 _export_star(require("./timeZoneOption"), exports);
+_export_star(require("./action"), exports);
+_export_star(require("./legend"), exports);
+_export_star(require("./time"), exports);
+_export_star(require("./bits"), exports);
+_export_star(require("./bytes"), exports);
+_export_star(require("./currency"), exports);
+_export_star(require("./percent"), exports);
+_export_star(require("./temperature"), exports);
+_export_star(require("./decimal"), exports);
+_export_star(require("./throughput"), exports);
+_export_star(require("./formatterCache"), exports);
+_export_star(require("./units"), exports);
+_export_star(require("./utils"), exports);
+_export_star(require("./types"), exports);
+_export_star(require("./thresholds"), exports);
+_export_star(require("./transforms"), exports);
 function _export_star(from, to) {
     Object.keys(from).forEach(function(k) {
         if (k !== "default" && !Object.prototype.hasOwnProperty.call(to, k)) {

package/dist/cjs/model/legend.js

@@ -0,0 +1,101 @@
+// Copyright 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.
+"use strict";
+Object.defineProperty(exports, "__esModule", {
+    value: true
+});
+function _export(target, all) {
+    for(var name in all)Object.defineProperty(target, name, {
+        enumerable: true,
+        get: Object.getOwnPropertyDescriptor(all, name).get
+    });
+}
+_export(exports, {
+    get DEFAULT_LEGEND () {
+        return DEFAULT_LEGEND;
+    },
+    get getLegendMode () {
+        return getLegendMode;
+    },
+    get getLegendPosition () {
+        return getLegendPosition;
+    },
+    get getLegendSize () {
+        return getLegendSize;
+    },
+    get isValidLegendMode () {
+        return isValidLegendMode;
+    },
+    get isValidLegendPosition () {
+        return isValidLegendPosition;
+    },
+    get isValidLegendSize () {
+        return isValidLegendSize;
+    },
+    get legendModes () {
+        return legendModes;
+    },
+    get legendPositions () {
+        return legendPositions;
+    },
+    get legendSizes () {
+        return legendSizes;
+    }
+});
+const legendPositions = [
+    'bottom',
+    'right'
+];
+const legendModes = [
+    'list',
+    'table'
+];
+const legendSizes = [
+    'small',
+    'medium'
+];
+function isValidLegendPosition(position) {
+    return legendPositions.includes(position);
+}
+function isValidLegendMode(mode) {
+    return legendModes.includes(mode);
+}
+function isValidLegendSize(size) {
+    return legendSizes.includes(size);
+}
+const DEFAULT_LEGEND = {
+    position: 'bottom',
+    mode: 'list',
+    size: 'medium'
+};
+function getLegendPosition(position) {
+    if (position === undefined) {
+        return DEFAULT_LEGEND.position;
+    }
+    if (isValidLegendPosition(position)) {
+        return position;
+    }
+    return DEFAULT_LEGEND.position;
+}
+function getLegendMode(mode) {
+    if (!mode || !isValidLegendMode(mode)) {
+        return DEFAULT_LEGEND.mode;
+    }
+    return mode;
+}
+function getLegendSize(size) {
+    if (!size || !isValidLegendSize(size)) {
+        return DEFAULT_LEGEND.size;
+    }
+    return size;
+}

package/dist/cjs/model/percent.js

@@ -0,0 +1,82 @@
+// Copyright 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.
+"use strict";
+Object.defineProperty(exports, "__esModule", {
+    value: true
+});
+function _export(target, all) {
+    for(var name in all)Object.defineProperty(target, name, {
+        enumerable: true,
+        get: Object.getOwnPropertyDescriptor(all, name).get
+    });
+}
+_export(exports, {
+    get PERCENT_GROUP_CONFIG () {
+        return PERCENT_GROUP_CONFIG;
+    },
+    get PERCENT_UNIT_CONFIG () {
+        return PERCENT_UNIT_CONFIG;
+    },
+    get formatPercent () {
+        return formatPercent;
+    }
+});
+const _constants = require("./constants");
+const _formatterCache = require("./formatterCache");
+const _utils = require("./utils");
+const PERCENT_GROUP_CONFIG = {
+    label: 'percent',
+    decimalPlaces: true
+};
+const PERCENT_GROUP = 'Percent';
+const PERCENT_UNIT_CONFIG = {
+    percent: {
+        group: PERCENT_GROUP,
+        label: 'Percent (0-100)'
+    },
+    'percent-decimal': {
+        group: PERCENT_GROUP,
+        label: 'Percent (0.0-1.0)'
+    },
+    '%': {
+        // This option is not shown in the selector because it is a shorthand
+        // duplicate of `Percent`.
+        disableSelectorOption: true,
+        group: PERCENT_GROUP,
+        label: '%'
+    }
+};
+function formatPercent(value, { unit, decimalPlaces }) {
+    const formatterOptions = {
+        style: 'percent',
+        useGrouping: true
+    };
+    if ((0, _utils.hasDecimalPlaces)(decimalPlaces)) {
+        formatterOptions.minimumFractionDigits = (0, _utils.limitDecimalPlaces)(decimalPlaces);
+        formatterOptions.maximumFractionDigits = (0, _utils.limitDecimalPlaces)(decimalPlaces);
+    } else {
+        formatterOptions.maximumSignificantDigits = _constants.MAX_SIGNIFICANT_DIGITS;
+    }
+    // Intl.NumberFormat translates 0 -> 0%, 0.5 -> 50%, 1 -> 100%, etc.
+    if (unit === 'percent') {
+        value = value / 100;
+    }
+    const key = [
+        formatterOptions.style,
+        formatterOptions.useGrouping,
+        formatterOptions.maximumSignificantDigits,
+        decimalPlaces,
+        unit
+    ];
+    return (0, _formatterCache.getFormatterFromCache)(key, 'percent', formatterOptions, 'en-US')(value);
+}

package/dist/cjs/model/temperature.js

@@ -0,0 +1,72 @@
+// Copyright 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.
+"use strict";
+Object.defineProperty(exports, "__esModule", {
+    value: true
+});
+function _export(target, all) {
+    for(var name in all)Object.defineProperty(target, name, {
+        enumerable: true,
+        get: Object.getOwnPropertyDescriptor(all, name).get
+    });
+}
+_export(exports, {
+    get TEMPERATURE_GROUP_CONFIG () {
+        return TEMPERATURE_GROUP_CONFIG;
+    },
+    get TEMPERATURE_UNIT_CONFIG () {
+        return TEMPERATURE_UNIT_CONFIG;
+    },
+    get formatTemperature () {
+        return formatTemperature;
+    }
+});
+const _constants = require("./constants");
+const _formatterCache = require("./formatterCache");
+const _utils = require("./utils");
+const TEMPERATURE_GROUP = 'Temperature';
+const TEMPERATURE_GROUP_CONFIG = {
+    label: TEMPERATURE_GROUP,
+    decimalPlaces: true
+};
+const TEMPERATURE_UNIT_CONFIG = {
+    celsius: {
+        group: TEMPERATURE_GROUP,
+        label: 'Celsius (°C)'
+    },
+    fahrenheit: {
+        group: TEMPERATURE_GROUP,
+        label: 'Fahrenheit (°F)'
+    }
+};
+const formatTemperature = (value, { unit, decimalPlaces })=>{
+    const formatterOptions = {
+        unit,
+        style: 'unit'
+    };
+    if ((0, _utils.hasDecimalPlaces)(decimalPlaces)) {
+        formatterOptions.minimumFractionDigits = (0, _utils.limitDecimalPlaces)(decimalPlaces);
+        formatterOptions.maximumFractionDigits = (0, _utils.limitDecimalPlaces)(decimalPlaces);
+    } else {
+        formatterOptions.maximumSignificantDigits = _constants.MAX_SIGNIFICANT_DIGITS;
+    }
+    const locals = unit === 'celsius' ? 'en-GB' : 'en-US';
+    const key = [
+        formatterOptions.style,
+        formatterOptions.unit,
+        formatterOptions.maximumSignificantDigits,
+        decimalPlaces,
+        locals
+    ];
+    return (0, _formatterCache.getFormatterFromCache)(key, 'temperature', formatterOptions, locals)(value);
+};

package/dist/cjs/model/thresholds.js

@@ -0,0 +1,16 @@
+// Copyright 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.
+"use strict";
+Object.defineProperty(exports, "__esModule", {
+    value: true
+});

package/dist/cjs/model/throughput.js

@@ -0,0 +1,161 @@
+// Copyright 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.
+"use strict";
+Object.defineProperty(exports, "__esModule", {
+    value: true
+});
+function _export(target, all) {
+    for(var name in all)Object.defineProperty(target, name, {
+        enumerable: true,
+        get: Object.getOwnPropertyDescriptor(all, name).get
+    });
+}
+_export(exports, {
+    get THROUGHPUT_GROUP_CONFIG () {
+        return THROUGHPUT_GROUP_CONFIG;
+    },
+    get THROUGHPUT_UNIT_CONFIG () {
+        return THROUGHPUT_UNIT_CONFIG;
+    },
+    get formatThroughput () {
+        return formatThroughput;
+    }
+});
+const _bytes = require("./bytes");
+const _bits = require("./bits");
+const _constants = require("./constants");
+const _utils = require("./utils");
+const _formatterCache = require("./formatterCache");
+const THROUGHPUT_GROUP_CONFIG = {
+    label: 'Throughput',
+    decimalPlaces: true
+};
+const THROUGHPUT_GROUP = 'Throughput';
+const THROUGHPUT_UNIT_CONFIG = {
+    'bits/sec': {
+        group: THROUGHPUT_GROUP,
+        label: 'Bits/sec (IEC)'
+    },
+    'decbits/sec': {
+        group: THROUGHPUT_GROUP,
+        label: 'Bits/sec (SI)'
+    },
+    'bytes/sec': {
+        group: THROUGHPUT_GROUP,
+        label: 'Bytes/sec (IEC)'
+    },
+    'decbytes/sec': {
+        group: THROUGHPUT_GROUP,
+        label: 'Bytes/sec (SI)'
+    },
+    'counts/sec': {
+        group: THROUGHPUT_GROUP,
+        label: 'Counts/sec'
+    },
+    'events/sec': {
+        group: THROUGHPUT_GROUP,
+        label: 'Events/sec'
+    },
+    'messages/sec': {
+        group: THROUGHPUT_GROUP,
+        label: 'Messages/sec'
+    },
+    'ops/sec': {
+        group: THROUGHPUT_GROUP,
+        label: 'Ops/sec'
+    },
+    'packets/sec': {
+        group: THROUGHPUT_GROUP,
+        label: 'Packets/sec'
+    },
+    'reads/sec': {
+        group: THROUGHPUT_GROUP,
+        label: 'Reads/sec'
+    },
+    'requests/sec': {
+        group: THROUGHPUT_GROUP,
+        label: 'Requests/sec'
+    },
+    'records/sec': {
+        group: THROUGHPUT_GROUP,
+        label: 'Records/sec'
+    },
+    'rows/sec': {
+        group: THROUGHPUT_GROUP,
+        label: 'Rows/sec'
+    },
+    'writes/sec': {
+        group: THROUGHPUT_GROUP,
+        label: 'Writes/sec'
+    }
+};
+function formatThroughput(value, { unit, shortValues, decimalPlaces }) {
+    // special case for data throughput
+    if (unit === 'bits/sec') {
+        const denominator = Math.abs(value) < 1024 ? 'sec' : 's';
+        return (0, _bits.formatBits)(value, {
+            unit: 'bits',
+            shortValues,
+            decimalPlaces
+        }) + '/' + denominator;
+    }
+    if (unit === 'decbits/sec') {
+        const denominator = Math.abs(value) < 1000 ? 'sec' : 's';
+        return (0, _bits.formatBits)(value, {
+            unit: 'decbits',
+            shortValues,
+            decimalPlaces
+        }) + '/' + denominator;
+    }
+    if (unit === 'decbytes/sec') {
+        const denominator = Math.abs(value) < 1000 ? 'sec' : 's';
+        return (0, _bytes.formatBytes)(value, {
+            unit: 'decbytes',
+            shortValues,
+            decimalPlaces
+        }) + '/' + denominator;
+    }
+    if (unit === 'bytes/sec') {
+        const denominator = Math.abs(value) < 1024 ? 'sec' : 's';
+        return (0, _bytes.formatBytes)(value, {
+            unit: 'bytes',
+            shortValues,
+            decimalPlaces
+        }) + '/' + denominator;
+    }
+    const formatterOptions = {
+        style: 'decimal',
+        useGrouping: true
+    };
+    if ((0, _utils.shouldShortenValues)(shortValues)) {
+        formatterOptions.notation = 'compact';
+    }
+    if ((0, _utils.hasDecimalPlaces)(decimalPlaces)) {
+        formatterOptions.minimumFractionDigits = (0, _utils.limitDecimalPlaces)(decimalPlaces);
+        formatterOptions.maximumFractionDigits = (0, _utils.limitDecimalPlaces)(decimalPlaces);
+    } else {
+        if ((0, _utils.shouldShortenValues)(shortValues)) {
+            formatterOptions.maximumSignificantDigits = _constants.MAX_SIGNIFICANT_DIGITS;
+        }
+    }
+    const key = [
+        formatterOptions.style,
+        formatterOptions.useGrouping,
+        formatterOptions.notation,
+        formatterOptions.maximumSignificantDigits,
+        decimalPlaces,
+        shortValues,
+        unit
+    ];
+    return `${(0, _formatterCache.getFormatterFromCache)(key, 'throughput', formatterOptions, 'en-US')(value)} ${unit}`;
+}