@elastic/charts 46.9.0 → 46.10.0

package/CHANGELOG.md

@@ -1,3 +1,10 @@
+# [46.10.0](https://github.com/elastic/elastic-charts/compare/v46.9.0...v46.10.0) (2022-06-10)
+
+
+### Features
+
+* Metric visualization ([#1658](https://github.com/elastic/elastic-charts/issues/1658)) ([fc2c955](https://github.com/elastic/elastic-charts/commit/fc2c955c1615c4d76079d01b685d7466e799c147))
+
 # [46.9.0](https://github.com/elastic/elastic-charts/compare/v46.8.0...v46.9.0) (2022-06-07)
 
 

package/dist/chart_types/index.d.ts

@@ -11,6 +11,7 @@ export declare const ChartType: Readonly<{
     XYAxis: "xy_axis";
     Heatmap: "heatmap";
     Wordcloud: "wordcloud";
+    Metric: "metric";
 }>;
 /** @public */
 export declare type ChartType = $Values<typeof ChartType>;

package/dist/chart_types/index.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../src/chart_types/index.ts"],"names":[],"mappings":"AAQA,OAAO,EAAE,OAAO,EAAE,MAAM,eAAe,CAAC;AAExC;;;GAGG;AACH,eAAO,MAAM,SAAS;;;;;;;;EAQpB,CAAC;AACH,cAAc;AACd,oBAAY,SAAS,GAAG,OAAO,CAAC,OAAO,SAAS,CAAC,CAAC"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../src/chart_types/index.ts"],"names":[],"mappings":"AAQA,OAAO,EAAE,OAAO,EAAE,MAAM,eAAe,CAAC;AAExC;;;GAGG;AACH,eAAO,MAAM,SAAS;;;;;;;;;EASpB,CAAC;AACH,cAAc;AACd,oBAAY,SAAS,GAAG,OAAO,CAAC,OAAO,SAAS,CAAC,CAAC"}

package/dist/chart_types/index.js

@@ -9,5 +9,6 @@ exports.ChartType = Object.freeze({
     XYAxis: 'xy_axis',
     Heatmap: 'heatmap',
     Wordcloud: 'wordcloud',
+    Metric: 'metric',
 });
 //# sourceMappingURL=index.js.map

package/dist/chart_types/index.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.js","sourceRoot":"","sources":["../../src/chart_types/index.ts"],"names":[],"mappings":";;;AAca,QAAA,SAAS,GAAG,MAAM,CAAC,MAAM,CAAC;IACrC,MAAM,EAAE,QAAiB;IACzB,IAAI,EAAE,MAAe;IACrB,SAAS,EAAE,WAAoB;IAC/B,KAAK,EAAE,OAAgB;IACvB,MAAM,EAAE,SAAkB;IAC1B,OAAO,EAAE,SAAkB;IAC3B,SAAS,EAAE,WAAoB;CAChC,CAAC,CAAC"}
+{"version":3,"file":"index.js","sourceRoot":"","sources":["../../src/chart_types/index.ts"],"names":[],"mappings":";;;AAca,QAAA,SAAS,GAAG,MAAM,CAAC,MAAM,CAAC;IACrC,MAAM,EAAE,QAAiB;IACzB,IAAI,EAAE,MAAe;IACrB,SAAS,EAAE,WAAoB;IAC/B,KAAK,EAAE,OAAgB;IACvB,MAAM,EAAE,SAAkB;IAC1B,OAAO,EAAE,SAAkB;IAC3B,SAAS,EAAE,WAAoB;IAC/B,MAAM,EAAE,QAAiB;CAC1B,CAAC,CAAC"}

package/dist/chart_types/metric/renderer/dom/index.d.ts

@@ -0,0 +1,2 @@
+export {};
+//# sourceMappingURL=index.d.ts.map

package/dist/chart_types/metric/renderer/dom/index.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../../src/chart_types/metric/renderer/dom/index.tsx"],"names":[],"mappings":""}

package/dist/chart_types/metric/renderer/dom/index.js

@@ -0,0 +1,155 @@
+"use strict";
+var __extends = (this && this.__extends) || (function () {
+    var extendStatics = function (d, b) {
+        extendStatics = Object.setPrototypeOf ||
+            ({ __proto__: [] } instanceof Array && function (d, b) { d.__proto__ = b; }) ||
+            function (d, b) { for (var p in b) if (Object.prototype.hasOwnProperty.call(b, p)) d[p] = b[p]; };
+        return extendStatics(d, b);
+    };
+    return function (d, b) {
+        if (typeof b !== "function" && b !== null)
+            throw new TypeError("Class extends value " + String(b) + " is not a constructor or null");
+        extendStatics(d, b);
+        function __() { this.constructor = d; }
+        d.prototype = b === null ? Object.create(b) : (__.prototype = b.prototype, new __());
+    };
+})();
+var __read = (this && this.__read) || function (o, n) {
+    var m = typeof Symbol === "function" && o[Symbol.iterator];
+    if (!m) return o;
+    var i = m.call(o), r, ar = [], e;
+    try {
+        while ((n === void 0 || n-- > 0) && !(r = i.next()).done) ar.push(r.value);
+    }
+    catch (error) { e = { error: error }; }
+    finally {
+        try {
+            if (r && !r.done && (m = i["return"])) m.call(i);
+        }
+        finally { if (e) throw e.error; }
+    }
+    return ar;
+};
+var __spreadArray = (this && this.__spreadArray) || function (to, from, pack) {
+    if (pack || arguments.length === 2) for (var i = 0, l = from.length, ar; i < l; i++) {
+        if (ar || !(i in from)) {
+            if (!ar) ar = Array.prototype.slice.call(from, 0, i);
+            ar[i] = from[i];
+        }
+    }
+    return to.concat(ar || Array.prototype.slice.call(from));
+};
+var __importDefault = (this && this.__importDefault) || function (mod) {
+    return (mod && mod.__esModule) ? mod : { "default": mod };
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.Metric = void 0;
+var classnames_1 = __importDefault(require("classnames"));
+var react_1 = __importDefault(require("react"));
+var react_redux_1 = require("react-redux");
+var redux_1 = require("redux");
+var chart_1 = require("../../../../state/actions/chart");
+var get_accessibility_config_1 = require("../../../../state/selectors/get_accessibility_config");
+var get_chart_theme_1 = require("../../../../state/selectors/get_chart_theme");
+var get_internal_is_intialized_1 = require("../../../../state/selectors/get_internal_is_intialized");
+var common_1 = require("../../../../utils/common");
+var light_theme_1 = require("../../../../utils/themes/light_theme");
+var specs_1 = require("../../specs");
+var chart_size_1 = require("../../state/selectors/chart_size");
+var data_1 = require("../../state/selectors/data");
+var progress_1 = require("./progress");
+var sparkline_1 = require("./sparkline");
+var text_1 = require("./text");
+var Component = (function (_super) {
+    __extends(Component, _super);
+    function Component() {
+        return _super !== null && _super.apply(this, arguments) || this;
+    }
+    Component.prototype.componentDidMount = function () {
+        this.props.onChartRendered();
+    };
+    Component.prototype.componentDidUpdate = function () {
+        this.props.onChartRendered();
+    };
+    Component.prototype.render = function () {
+        var _a = this.props, chartId = _a.chartId, initialized = _a.initialized, _b = _a.size, width = _b.width, height = _b.height, a11y = _a.a11y, specs = _a.specs, style = _a.style;
+        if (!initialized || specs.length === 0 || width === 0 || height === 0) {
+            return null;
+        }
+        var data = specs[0].data;
+        var maxRows = data.length;
+        var maxColumns = data.reduce(function (acc, curr) {
+            return Math.max(acc, curr.length);
+        }, 0);
+        var panel = { width: width / maxColumns, height: height / maxRows };
+        return (react_1.default.createElement("div", { className: "echMetricContainer", "aria-labelledby": a11y.labelId, "aria-describedby": a11y.descriptionId, style: {
+                gridTemplateColumns: "repeat(" + maxColumns + ", minmax(0, 1fr)",
+                gridTemplateRows: "repeat(" + maxRows + ", minmax(64px, 1fr)",
+            } }, data
+            .map(function (columns, ri) {
+            return __spreadArray(__spreadArray([], __read(columns.map(function (d, ci) {
+                var metricHTMLId = "echMetric-" + chartId + "-" + ri + "-" + ci;
+                var emptyMetricClassName = (0, classnames_1.default)('echMetric', {
+                    'echMetric--rightBorder': ci < maxColumns - 1,
+                    'echMetric--bottomBorder': ri < maxRows - 1,
+                });
+                if (!d) {
+                    return react_1.default.createElement("div", { key: "empty-" + ci, className: emptyMetricClassName });
+                }
+                var hasProgressBar = (0, specs_1.isMetricWProgress)(d);
+                var progressBarDirection = (0, specs_1.isMetricWProgress)(d) ? d.progressBarDirection : undefined;
+                var metricPanelClassName = (0, classnames_1.default)(emptyMetricClassName, {
+                    'echMetric--small': hasProgressBar,
+                    'echMetric--vertical': progressBarDirection === common_1.LayoutDirection.Vertical,
+                    'echMetric--horizontal': progressBarDirection === common_1.LayoutDirection.Horizontal,
+                });
+                return (react_1.default.createElement("div", { role: "figure", "aria-labelledby": d.title && metricHTMLId, key: "" + d.title + d.subtitle + d.color + ci, className: metricPanelClassName, style: {
+                        backgroundColor: !(0, specs_1.isMetricWTrend)(d) && !(0, specs_1.isMetricWProgress)(d) ? d.color : style.background,
+                    } },
+                    react_1.default.createElement(text_1.MetricText, { id: metricHTMLId, datum: d, panel: panel, style: style }),
+                    (0, specs_1.isMetricWTrend)(d) && react_1.default.createElement(sparkline_1.SparkLine, { id: metricHTMLId, datum: d }),
+                    (0, specs_1.isMetricWProgress)(d) && react_1.default.createElement(progress_1.ProgressBar, { datum: d, barBackground: style.barBackground })));
+            })), false), __read(Array.from({ length: maxColumns - columns.length }, function (d, ci) {
+                var emptyMetricClassName = (0, classnames_1.default)('echMetric', {
+                    'echMetric--rightBorder': columns.length + ci < maxColumns - 1,
+                    'echMetric--bottomBorder': ri < maxRows - 1,
+                });
+                return react_1.default.createElement("div", { key: "missing-" + ci, className: emptyMetricClassName });
+            })), false);
+        })
+            .flat()));
+    };
+    Component.displayName = 'Metric';
+    return Component;
+}(react_1.default.Component));
+var mapDispatchToProps = function (dispatch) {
+    return (0, redux_1.bindActionCreators)({
+        onChartRendered: chart_1.onChartRendered,
+    }, dispatch);
+};
+var DEFAULT_PROPS = {
+    initialized: false,
+    chartId: '',
+    specs: [],
+    size: {
+        width: 0,
+        height: 0,
+    },
+    a11y: get_accessibility_config_1.DEFAULT_A11Y_SETTINGS,
+    style: light_theme_1.LIGHT_THEME.metric,
+};
+var mapStateToProps = function (state) {
+    if ((0, get_internal_is_intialized_1.getInternalIsInitializedSelector)(state) !== get_internal_is_intialized_1.InitStatus.Initialized) {
+        return DEFAULT_PROPS;
+    }
+    return {
+        initialized: true,
+        chartId: state.chartId,
+        specs: (0, data_1.getMetricSpecs)(state),
+        size: (0, chart_size_1.chartSize)(state),
+        a11y: (0, get_accessibility_config_1.getA11ySettingsSelector)(state),
+        style: (0, get_chart_theme_1.getChartThemeSelector)(state).metric,
+    };
+};
+exports.Metric = (0, react_redux_1.connect)(mapStateToProps, mapDispatchToProps)(Component);
+//# sourceMappingURL=index.js.map

package/dist/chart_types/metric/renderer/dom/index.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../../../src/chart_types/metric/renderer/dom/index.tsx"],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAWA,0DAAoC;AACpC,gDAA0B;AAC1B,2CAAsC;AACtC,+BAAqD;AAErD,yDAAkE;AAElE,iGAI8D;AAC9D,+EAAoF;AACpF,qGAAsH;AACtH,mDAA2D;AAC3D,oEAAmE;AAEnE,qCAA4E;AAC5E,+DAA6D;AAC7D,mDAA4D;AAC5D,uCAAyC;AACzC,yCAAwC;AACxC,+BAAoC;AAkBpC;IAAwB,6BAA2C;IAAnE;;IA4FA,CAAC;IA1FC,qCAAiB,GAAjB;QACE,IAAI,CAAC,KAAK,CAAC,eAAe,EAAE,CAAC;IAC/B,CAAC;IAED,sCAAkB,GAAlB;QACE,IAAI,CAAC,KAAK,CAAC,eAAe,EAAE,CAAC;IAC/B,CAAC;IAED,0BAAM,GAAN;QACQ,IAAA,KAOF,IAAI,CAAC,KAAK,EANZ,OAAO,aAAA,EACP,WAAW,iBAAA,EACX,YAAuB,EAAf,KAAK,WAAA,EAAE,MAAM,YAAA,EACrB,IAAI,UAAA,EACJ,KAAK,WAAA,EACL,KAAK,WACO,CAAC;QACf,IAAI,CAAC,WAAW,IAAI,KAAK,CAAC,MAAM,KAAK,CAAC,IAAI,KAAK,KAAK,CAAC,IAAI,MAAM,KAAK,CAAC,EAAE;YACrE,OAAO,IAAI,CAAC;SACb;QAEO,IAAA,IAAI,GAAK,KAAK,CAAC,CAAC,CAAC,KAAb,CAAc;QAE1B,IAAM,OAAO,GAAG,IAAI,CAAC,MAAM,CAAC;QAC5B,IAAM,UAAU,GAAG,IAAI,CAAC,MAAM,CAAC,UAAC,GAAG,EAAE,IAAI;YACvC,OAAO,IAAI,CAAC,GAAG,CAAC,GAAG,EAAE,IAAI,CAAC,MAAM,CAAC,CAAC;QACpC,CAAC,EAAE,CAAC,CAAC,CAAC;QACN,IAAM,KAAK,GAAG,EAAE,KAAK,EAAE,KAAK,GAAG,UAAU,EAAE,MAAM,EAAE,MAAM,GAAG,OAAO,EAAE,CAAC;QAEtE,OAAO,CACL,uCACE,SAAS,EAAC,oBAAoB,qBACb,IAAI,CAAC,OAAO,sBACX,IAAI,CAAC,aAAa,EACpC,KAAK,EAAE;gBACL,mBAAmB,EAAE,YAAU,UAAU,qBAAkB;gBAC3D,gBAAgB,EAAE,YAAU,OAAO,wBAAqB;aACzD,IAEA,IAAI;aACF,GAAG,CAAC,UAAC,OAAO,EAAE,EAAE;YACf,8CACK,OAAO,CAAC,GAAG,CAAC,UAAC,CAAC,EAAE,EAAE;gBACnB,IAAM,YAAY,GAAG,eAAa,OAAO,SAAI,EAAE,SAAI,EAAI,CAAC;gBAExD,IAAM,oBAAoB,GAAG,IAAA,oBAAU,EAAC,WAAW,EAAE;oBACnD,wBAAwB,EAAE,EAAE,GAAG,UAAU,GAAG,CAAC;oBAC7C,yBAAyB,EAAE,EAAE,GAAG,OAAO,GAAG,CAAC;iBAC5C,CAAC,CAAC;gBACH,IAAI,CAAC,CAAC,EAAE;oBACN,OAAO,uCAAK,GAAG,EAAE,WAAS,EAAI,EAAE,SAAS,EAAE,oBAAoB,GAAQ,CAAC;iBACzE;gBACD,IAAM,cAAc,GAAG,IAAA,yBAAiB,EAAC,CAAC,CAAC,CAAC;gBAC5C,IAAM,oBAAoB,GAAG,IAAA,yBAAiB,EAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,oBAAoB,CAAC,CAAC,CAAC,SAAS,CAAC;gBACvF,IAAM,oBAAoB,GAAG,IAAA,oBAAU,EAAC,oBAAoB,EAAE;oBAC5D,kBAAkB,EAAE,cAAc;oBAClC,qBAAqB,EAAE,oBAAoB,KAAK,wBAAe,CAAC,QAAQ;oBACxE,uBAAuB,EAAE,oBAAoB,KAAK,wBAAe,CAAC,UAAU;iBAC7E,CAAC,CAAC;gBAEH,OAAO,CACL,uCACE,IAAI,EAAC,QAAQ,qBACI,CAAC,CAAC,KAAK,IAAI,YAAY,EACxC,GAAG,EAAE,KAAG,CAAC,CAAC,KAAK,GAAG,CAAC,CAAC,QAAQ,GAAG,CAAC,CAAC,KAAK,GAAG,EAAI,EAC7C,SAAS,EAAE,oBAAoB,EAC/B,KAAK,EAAE;wBACL,eAAe,EAAE,CAAC,IAAA,sBAAc,EAAC,CAAC,CAAC,IAAI,CAAC,IAAA,yBAAiB,EAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,KAAK,CAAC,CAAC,CAAC,KAAK,CAAC,UAAU;qBAC1F;oBAED,8BAAC,iBAAU,IAAC,EAAE,EAAE,YAAY,EAAE,KAAK,EAAE,CAAC,EAAE,KAAK,EAAE,KAAK,EAAE,KAAK,EAAE,KAAK,GAAI;oBACrE,IAAA,sBAAc,EAAC,CAAC,CAAC,IAAI,8BAAC,qBAAS,IAAC,EAAE,EAAE,YAAY,EAAE,KAAK,EAAE,CAAC,GAAI;oBAC9D,IAAA,yBAAiB,EAAC,CAAC,CAAC,IAAI,8BAAC,sBAAW,IAAC,KAAK,EAAE,CAAC,EAAE,aAAa,EAAE,KAAK,CAAC,aAAa,GAAI,CAClF,CACP,CAAC;YACJ,CAAC,CAAC,kBAEC,KAAK,CAAC,IAAI,CAAC,EAAE,MAAM,EAAE,UAAU,GAAG,OAAO,CAAC,MAAM,EAAE,EAAE,UAAC,CAAC,EAAE,EAAE;gBAC3D,IAAM,oBAAoB,GAAG,IAAA,oBAAU,EAAC,WAAW,EAAE;oBACnD,wBAAwB,EAAE,OAAO,CAAC,MAAM,GAAG,EAAE,GAAG,UAAU,GAAG,CAAC;oBAC9D,yBAAyB,EAAE,EAAE,GAAG,OAAO,GAAG,CAAC;iBAC5C,CAAC,CAAC;gBACH,OAAO,uCAAK,GAAG,EAAE,aAAW,EAAI,EAAE,SAAS,EAAE,oBAAoB,GAAQ,CAAC;YAC5E,CAAC,CAAC,UACF;QACJ,CAAC,CAAC;aACD,IAAI,EAAE,CACL,CACP,CAAC;IACJ,CAAC;IA1FM,qBAAW,GAAG,QAAQ,CAAC;IA2FhC,gBAAC;CAAA,AA5FD,CAAwB,eAAK,CAAC,SAAS,GA4FtC;AAED,IAAM,kBAAkB,GAAG,UAAC,QAAkB;IAC5C,OAAA,IAAA,0BAAkB,EAChB;QACE,eAAe,yBAAA;KAChB,EACD,QAAQ,CACT;AALD,CAKC,CAAC;AAEJ,IAAM,aAAa,GAAe;IAChC,WAAW,EAAE,KAAK;IAClB,OAAO,EAAE,EAAE;IACX,KAAK,EAAE,EAAE;IACT,IAAI,EAAE;QACJ,KAAK,EAAE,CAAC;QACR,MAAM,EAAE,CAAC;KACV;IACD,IAAI,EAAE,gDAAqB;IAC3B,KAAK,EAAE,yBAAW,CAAC,MAAM;CAC1B,CAAC;AAEF,IAAM,eAAe,GAAG,UAAC,KAAuB;IAC9C,IAAI,IAAA,6DAAgC,EAAC,KAAK,CAAC,KAAK,uCAAU,CAAC,WAAW,EAAE;QACtE,OAAO,aAAa,CAAC;KACtB;IACD,OAAO;QACL,WAAW,EAAE,IAAI;QACjB,OAAO,EAAE,KAAK,CAAC,OAAO;QACtB,KAAK,EAAE,IAAA,qBAAc,EAAC,KAAK,CAAC;QAC5B,IAAI,EAAE,IAAA,sBAAS,EAAC,KAAK,CAAC;QACtB,IAAI,EAAE,IAAA,kDAAuB,EAAC,KAAK,CAAC;QACpC,KAAK,EAAE,IAAA,uCAAqB,EAAC,KAAK,CAAC,CAAC,MAAM;KAC3C,CAAC;AACJ,CAAC,CAAC;AAGW,QAAA,MAAM,GAAG,IAAA,qBAAO,EAAC,eAAe,EAAE,kBAAkB,CAAC,CAAC,SAAS,CAAC,CAAC"}

package/dist/chart_types/metric/renderer/dom/progress.d.ts

@@ -0,0 +1,2 @@
+export {};
+//# sourceMappingURL=progress.d.ts.map

package/dist/chart_types/metric/renderer/dom/progress.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"progress.d.ts","sourceRoot":"","sources":["../../../../../src/chart_types/metric/renderer/dom/progress.tsx"],"names":[],"mappings":""}

package/dist/chart_types/metric/renderer/dom/progress.js

@@ -0,0 +1,41 @@
+"use strict";
+var __assign = (this && this.__assign) || function () {
+    __assign = Object.assign || function(t) {
+        for (var s, i = 1, n = arguments.length; i < n; i++) {
+            s = arguments[i];
+            for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p))
+                t[p] = s[p];
+        }
+        return t;
+    };
+    return __assign.apply(this, arguments);
+};
+var __importDefault = (this && this.__importDefault) || function (mod) {
+    return (mod && mod.__esModule) ? mod : { "default": mod };
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.ProgressBar = void 0;
+var classnames_1 = __importDefault(require("classnames"));
+var react_1 = __importDefault(require("react"));
+var common_1 = require("../../../../utils/common");
+var ProgressBar = function (_a) {
+    var _b = _a.datum, title = _b.title, domain = _b.domain, value = _b.value, color = _b.color, progressBarDirection = _b.progressBarDirection, barBackground = _a.barBackground;
+    var verticalDirection = progressBarDirection === common_1.LayoutDirection.Vertical;
+    var isSmall = true;
+    var percent = Number((0, common_1.clamp)((domain ? value / (domain.max - domain.min) : 1) * 100, 0, 100).toFixed(2));
+    var bgClassName = (0, classnames_1.default)('echSingleMetricProgress', {
+        'echSingleMetricProgress--vertical': verticalDirection,
+        'echSingleMetricProgress--horizontal': !verticalDirection,
+        'echSingleMetricProgress--small': isSmall,
+    });
+    var barClassName = (0, classnames_1.default)('echSingleMetricProgressBar', {
+        'echSingleMetricProgressBar--vertical': verticalDirection,
+        'echSingleMetricProgressBar--horizontal': !verticalDirection,
+        'echSingleMetricProgressBar--small': isSmall,
+    });
+    var percentProp = verticalDirection ? { height: percent + "%" } : { width: percent + "%" };
+    return (react_1.default.createElement("div", { className: bgClassName, style: { background: isSmall ? barBackground : undefined } },
+        react_1.default.createElement("div", { className: barClassName, style: __assign({ background: color }, percentProp), role: "meter", "aria-label": title ? "Percentage of " + title : 'Percentage', "aria-valuemin": 0, "aria-valuemax": 100, "aria-valuenow": percent })));
+};
+exports.ProgressBar = ProgressBar;
+//# sourceMappingURL=progress.js.map

package/dist/chart_types/metric/renderer/dom/progress.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"progress.js","sourceRoot":"","sources":["../../../../../src/chart_types/metric/renderer/dom/progress.tsx"],"names":[],"mappings":";;;;;;;;;;;;;;;;;AAQA,0DAAoC;AACpC,gDAA0B;AAG1B,mDAAkE;AAI3D,IAAM,WAAW,GAGnB,UAAC,EAA+E;QAA7E,aAA4D,EAAnD,KAAK,WAAA,EAAE,MAAM,YAAA,EAAE,KAAK,WAAA,EAAE,KAAK,WAAA,EAAE,oBAAoB,0BAAA,EAAI,aAAa,mBAAA;IACjF,IAAM,iBAAiB,GAAG,oBAAoB,KAAK,wBAAe,CAAC,QAAQ,CAAC;IAE5E,IAAM,OAAO,GAAG,IAAI,CAAC;IACrB,IAAM,OAAO,GAAG,MAAM,CAAC,IAAA,cAAK,EAAC,CAAC,MAAM,CAAC,CAAC,CAAC,KAAK,GAAG,CAAC,MAAM,CAAC,GAAG,GAAG,MAAM,CAAC,GAAG,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,GAAG,GAAG,EAAE,CAAC,EAAE,GAAG,CAAC,CAAC,OAAO,CAAC,CAAC,CAAC,CAAC,CAAC;IAEzG,IAAM,WAAW,GAAG,IAAA,oBAAU,EAAC,yBAAyB,EAAE;QACxD,mCAAmC,EAAE,iBAAiB;QACtD,qCAAqC,EAAE,CAAC,iBAAiB;QACzD,gCAAgC,EAAE,OAAO;KAC1C,CAAC,CAAC;IACH,IAAM,YAAY,GAAG,IAAA,oBAAU,EAAC,4BAA4B,EAAE;QAC5D,sCAAsC,EAAE,iBAAiB;QACzD,wCAAwC,EAAE,CAAC,iBAAiB;QAC5D,mCAAmC,EAAE,OAAO;KAC7C,CAAC,CAAC;IACH,IAAM,WAAW,GAAG,iBAAiB,CAAC,CAAC,CAAC,EAAE,MAAM,EAAK,OAAO,MAAG,EAAE,CAAC,CAAC,CAAC,EAAE,KAAK,EAAK,OAAO,MAAG,EAAE,CAAC;IAC7F,OAAO,CACL,uCAAK,SAAS,EAAE,WAAW,EAAE,KAAK,EAAE,EAAE,UAAU,EAAE,OAAO,CAAC,CAAC,CAAC,aAAa,CAAC,CAAC,CAAC,SAAS,EAAE;QACrF,uCACE,SAAS,EAAE,YAAY,EACvB,KAAK,aAAI,UAAU,EAAE,KAAK,IAAK,WAAW,GAC1C,IAAI,EAAC,OAAO,gBACA,KAAK,CAAC,CAAC,CAAC,mBAAiB,KAAO,CAAC,CAAC,CAAC,YAAY,mBAC5C,CAAC,mBACD,GAAG,mBACH,OAAO,GACtB,CACE,CACP,CAAC;AACJ,CAAC,CAAC;AAjCW,QAAA,WAAW,eAiCtB"}

package/dist/chart_types/metric/renderer/dom/sparkline.d.ts

@@ -0,0 +1,2 @@
+export {};
+//# sourceMappingURL=sparkline.d.ts.map

package/dist/chart_types/metric/renderer/dom/sparkline.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"sparkline.d.ts","sourceRoot":"","sources":["../../../../../src/chart_types/metric/renderer/dom/sparkline.tsx"],"names":[],"mappings":""}

package/dist/chart_types/metric/renderer/dom/sparkline.js

@@ -0,0 +1,52 @@
+"use strict";
+var __read = (this && this.__read) || function (o, n) {
+    var m = typeof Symbol === "function" && o[Symbol.iterator];
+    if (!m) return o;
+    var i = m.call(o), r, ar = [], e;
+    try {
+        while ((n === void 0 || n-- > 0) && !(r = i.next()).done) ar.push(r.value);
+    }
+    catch (error) { e = { error: error }; }
+    finally {
+        try {
+            if (r && !r.done && (m = i["return"])) m.call(i);
+        }
+        finally { if (e) throw e.error; }
+    }
+    return ar;
+};
+var __importDefault = (this && this.__importDefault) || function (mod) {
+    return (mod && mod.__esModule) ? mod : { "default": mod };
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.SparkLine = void 0;
+var react_1 = __importDefault(require("react"));
+var color_library_wrappers_1 = require("../../../../common/color_library_wrappers");
+var math_1 = require("../../../../common/math");
+var path_1 = require("../../../../geoms/path");
+var common_1 = require("../../../../utils/common");
+var curves_1 = require("../../../../utils/curves");
+var specs_1 = require("../../specs");
+var SparkLine = function (_a) {
+    var id = _a.id, _b = _a.datum, color = _b.color, trend = _b.trend, trendA11yTitle = _b.trendA11yTitle, trendA11yDescription = _b.trendA11yDescription, trendShape = _b.trendShape;
+    if (!trend) {
+        return null;
+    }
+    var _c = __read((0, math_1.extent)(trend.map(function (d) { return d.x; })), 2), xMin = _c[0], xMax = _c[1];
+    var _d = __read((0, math_1.extent)(trend.map(function (d) { return d.y; })), 2), yMax = _d[1];
+    var xScale = function (value) { return (value - xMin) / (xMax - xMin); };
+    var yScale = function (value) { return value / yMax; };
+    var path = (0, path_1.areaGenerator)(function (d) { return xScale(d.x); }, function () { return 1; }, function (d) { return 1 - yScale(d.y); }, function (d) { return (0, common_1.isFiniteNumber)(d.x) && (0, common_1.isFiniteNumber)(d.y); }, trendShape === specs_1.MetricTrendShape.Bars ? curves_1.CurveType.CURVE_STEP_AFTER : curves_1.CurveType.LINEAR);
+    var _e = __read((0, color_library_wrappers_1.colorToHsl)(color), 3), h = _e[0], s = _e[1], l = _e[2];
+    var pathColor = (0, color_library_wrappers_1.hslToColor)(h, s, l >= 0.8 ? l - 0.1 : l + 0.1);
+    var titleId = id + "-trend-title";
+    var descriptionId = id + "-trend-description";
+    return (react_1.default.createElement("div", { className: "echSingleMetricSparkline" },
+        react_1.default.createElement("svg", { className: "echSingleMetricSparkline__svg", width: "100%", height: "100%", viewBox: "0 0 1 1", preserveAspectRatio: "none", role: "img", "aria-labelledby": titleId + " " + descriptionId },
+            react_1.default.createElement("title", { id: titleId, className: "echScreenReaderOnly" }, trendA11yTitle),
+            react_1.default.createElement("text", { id: descriptionId, className: "echScreenReaderOnly", fontSize: 0 }, trendA11yDescription),
+            react_1.default.createElement("rect", { x: 0, y: 0, width: 1, height: 1, fill: color }),
+            react_1.default.createElement("path", { d: path.area(trend), transform: "translate(0, 0.5),scale(1,0.5)", fill: pathColor, stroke: "none", strokeWidth: 0 }))));
+};
+exports.SparkLine = SparkLine;
+//# sourceMappingURL=sparkline.js.map

package/dist/chart_types/metric/renderer/dom/sparkline.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"sparkline.js","sourceRoot":"","sources":["../../../../../src/chart_types/metric/renderer/dom/sparkline.tsx"],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;AAQA,gDAAiD;AAEjD,oFAAmF;AACnF,gDAAiD;AACjD,+CAAuD;AACvD,mDAA0D;AAC1D,mDAAqD;AACrD,qCAA6D;AAGtD,IAAM,SAAS,GAGjB,UAAC,EAAiF;QAA/E,EAAE,QAAA,EAAE,aAAyE,EAAhE,KAAK,WAAA,EAAE,KAAK,WAAA,EAAE,cAAc,oBAAA,EAAE,oBAAoB,0BAAA,EAAE,UAAU,gBAAA;IACjF,IAAI,CAAC,KAAK,EAAE;QACV,OAAO,IAAI,CAAC;KACb;IACK,IAAA,KAAA,OAAe,IAAA,aAAM,EAAC,KAAK,CAAC,GAAG,CAAC,UAAC,CAAC,IAAK,OAAA,CAAC,CAAC,CAAC,EAAH,CAAG,CAAC,CAAC,IAAA,EAA3C,IAAI,QAAA,EAAE,IAAI,QAAiC,CAAC;IAC7C,IAAA,KAAA,OAAW,IAAA,aAAM,EAAC,KAAK,CAAC,GAAG,CAAC,UAAC,CAAC,IAAK,OAAA,CAAC,CAAC,CAAC,EAAH,CAAG,CAAC,CAAC,IAAA,EAArC,IAAI,QAAiC,CAAC;IAC/C,IAAM,MAAM,GAAG,UAAC,KAAa,IAAK,OAAA,CAAC,KAAK,GAAG,IAAI,CAAC,GAAG,CAAC,IAAI,GAAG,IAAI,CAAC,EAA9B,CAA8B,CAAC;IACjE,IAAM,MAAM,GAAG,UAAC,KAAa,IAAK,OAAA,KAAK,GAAG,IAAI,EAAZ,CAAY,CAAC;IAE/C,IAAM,IAAI,GAAG,IAAA,oBAAa,EACxB,UAAC,CAAC,IAAK,OAAA,MAAM,CAAC,CAAC,CAAC,CAAC,CAAC,EAAX,CAAW,EAClB,cAAM,OAAA,CAAC,EAAD,CAAC,EACP,UAAC,CAAC,IAAK,OAAA,CAAC,GAAG,MAAM,CAAC,CAAC,CAAC,CAAC,CAAC,EAAf,CAAe,EACtB,UAAC,CAAC,IAAK,OAAA,IAAA,uBAAc,EAAC,CAAC,CAAC,CAAC,CAAC,IAAI,IAAA,uBAAc,EAAC,CAAC,CAAC,CAAC,CAAC,EAA1C,CAA0C,EACjD,UAAU,KAAK,wBAAgB,CAAC,IAAI,CAAC,CAAC,CAAC,kBAAS,CAAC,gBAAgB,CAAC,CAAC,CAAC,kBAAS,CAAC,MAAM,CACrF,CAAC;IAEI,IAAA,KAAA,OAAY,IAAA,mCAAU,EAAC,KAAK,CAAC,IAAA,EAA5B,CAAC,QAAA,EAAE,CAAC,QAAA,EAAE,CAAC,QAAqB,CAAC;IACpC,IAAM,SAAS,GAAG,IAAA,mCAAU,EAAC,CAAC,EAAE,CAAC,EAAE,CAAC,IAAI,GAAG,CAAC,CAAC,CAAC,CAAC,GAAG,GAAG,CAAC,CAAC,CAAC,CAAC,GAAG,GAAG,CAAC,CAAC;IACjE,IAAM,OAAO,GAAM,EAAE,iBAAc,CAAC;IACpC,IAAM,aAAa,GAAM,EAAE,uBAAoB,CAAC;IAChD,OAAO,CACL,uCAAK,SAAS,EAAC,0BAA0B;QACvC,uCACE,SAAS,EAAC,+BAA+B,EACzC,KAAK,EAAC,MAAM,EACZ,MAAM,EAAC,MAAM,EACb,OAAO,EAAC,SAAS,EACjB,mBAAmB,EAAC,MAAM,EAC1B,IAAI,EAAC,KAAK,qBACU,OAAO,SAAI,aAAe;YAE9C,yCAAO,EAAE,EAAE,OAAO,EAAE,SAAS,EAAC,qBAAqB,IAChD,cAAc,CACT;YACR,wCAAM,EAAE,EAAE,aAAa,EAAE,SAAS,EAAC,qBAAqB,EAAC,QAAQ,EAAE,CAAC,IACjE,oBAAoB,CAChB;YACP,wCAAM,CAAC,EAAE,CAAC,EAAE,CAAC,EAAE,CAAC,EAAE,KAAK,EAAE,CAAC,EAAE,MAAM,EAAE,CAAC,EAAE,IAAI,EAAE,KAAK,GAAI;YACtD,wCACE,CAAC,EAAE,IAAI,CAAC,IAAI,CAAC,KAAK,CAAC,EACnB,SAAS,EAAC,gCAAgC,EAC1C,IAAI,EAAE,SAAS,EACf,MAAM,EAAC,MAAM,EACb,WAAW,EAAE,CAAC,GACd,CACE,CACF,CACP,CAAC;AACJ,CAAC,CAAC;AApDW,QAAA,SAAS,aAoDpB"}

package/dist/chart_types/metric/renderer/dom/text.d.ts

@@ -0,0 +1,2 @@
+export {};
+//# sourceMappingURL=text.d.ts.map

package/dist/chart_types/metric/renderer/dom/text.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"text.d.ts","sourceRoot":"","sources":["../../../../../src/chart_types/metric/renderer/dom/text.tsx"],"names":[],"mappings":""}

package/dist/chart_types/metric/renderer/dom/text.js

@@ -0,0 +1,141 @@
+"use strict";
+var __assign = (this && this.__assign) || function () {
+    __assign = Object.assign || function(t) {
+        for (var s, i = 1, n = arguments.length; i < n; i++) {
+            s = arguments[i];
+            for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p))
+                t[p] = s[p];
+        }
+        return t;
+    };
+    return __assign.apply(this, arguments);
+};
+var __read = (this && this.__read) || function (o, n) {
+    var m = typeof Symbol === "function" && o[Symbol.iterator];
+    if (!m) return o;
+    var i = m.call(o), r, ar = [], e;
+    try {
+        while ((n === void 0 || n-- > 0) && !(r = i.next()).done) ar.push(r.value);
+    }
+    catch (error) { e = { error: error }; }
+    finally {
+        try {
+            if (r && !r.done && (m = i["return"])) m.call(i);
+        }
+        finally { if (e) throw e.error; }
+    }
+    return ar;
+};
+var __importDefault = (this && this.__importDefault) || function (mod) {
+    return (mod && mod.__esModule) ? mod : { "default": mod };
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.MetricText = void 0;
+var classnames_1 = __importDefault(require("classnames"));
+var react_1 = __importDefault(require("react"));
+var color_calcs_1 = require("../../../../common/color_calcs");
+var color_library_wrappers_1 = require("../../../../common/color_library_wrappers");
+var colors_1 = require("../../../../common/colors");
+var common_1 = require("../../../../utils/common");
+var specs_1 = require("../../specs");
+var WIDTH_BP = [
+    [0, 180, 's'],
+    [180, 300, 'm'],
+    [300, Infinity, 'l'],
+];
+var PADDING = 8;
+var MAGIC_NUMBER_LINE_HEIGHT = 1.1428571428571428;
+var TITLE_FONT_SIZE = { s: 12, m: 16, l: 16 };
+var SUBTITLE_FONT_SIZE = { s: 10, m: 14, l: 14 };
+var EXTRA_FONT_SIZE = { s: 10, m: 14, l: 14 };
+var VALUE_FONT_SIZE = { s: 22, m: 27, l: 34 };
+var VALUE_PART_FONT_SIZE = { s: 16, m: 20, l: 24 };
+function findRange(ranges, value) {
+    var range = ranges.find(function (_a) {
+        var _b = __read(_a, 2), min = _b[0], max = _b[1];
+        return min <= value && value < max;
+    });
+    return range ? range[2] : ranges[0][2];
+}
+function elementVisibility(datum, panel, size) {
+    var _a;
+    var titleHeight = function (title, maxLines) {
+        return PADDING + (title ? maxLines * TITLE_FONT_SIZE[size] * MAGIC_NUMBER_LINE_HEIGHT : 0);
+    };
+    var subtitleHeight = function (subtitle, maxLines) {
+        return subtitle ? maxLines * SUBTITLE_FONT_SIZE[size] * MAGIC_NUMBER_LINE_HEIGHT + PADDING : 0;
+    };
+    var extraHeight = function (extra) { return (extra ? EXTRA_FONT_SIZE[size] * MAGIC_NUMBER_LINE_HEIGHT : 0); };
+    var valueHeight = VALUE_FONT_SIZE[size] * MAGIC_NUMBER_LINE_HEIGHT + PADDING;
+    var responsiveBreakPoints = [
+        { titleLines: 3, subtitleLines: 2, title: !!datum.title, subtitle: !!datum.subtitle, extra: !!datum.extra },
+        { titleLines: 3, subtitleLines: 1, title: !!datum.title, subtitle: !!datum.subtitle, extra: !!datum.extra },
+        { titleLines: 3, subtitleLines: 0, title: !!datum.title, subtitle: false, extra: !!datum.extra },
+        { titleLines: 2, subtitleLines: 0, title: !!datum.title, subtitle: false, extra: !!datum.extra },
+        { titleLines: 2, subtitleLines: 0, title: !!datum.title, subtitle: false, extra: false },
+        { titleLines: 1, subtitleLines: 0, title: !!datum.title, subtitle: false, extra: false },
+    ];
+    var isVisible = function (_a) {
+        var titleLines = _a.titleLines, subtitleLines = _a.subtitleLines, title = _a.title, subtitle = _a.subtitle, extra = _a.extra;
+        return titleHeight(title, titleLines) + subtitleHeight(subtitle, subtitleLines) + extraHeight(extra) + valueHeight <
+            panel.height;
+    };
+    return ((_a = responsiveBreakPoints.find(function (breakpoint) { return isVisible(breakpoint); })) !== null && _a !== void 0 ? _a : responsiveBreakPoints[responsiveBreakPoints.length - 1]);
+}
+function lineClamp(maxLines) {
+    return {
+        textOverflow: 'ellipsis',
+        display: '-webkit-box',
+        WebkitLineClamp: maxLines,
+        lineClamp: maxLines,
+        WebkitBoxOrient: 'vertical',
+        overflow: 'hidden',
+    };
+}
+var MetricText = function (_a) {
+    var id = _a.id, datum = _a.datum, panel = _a.panel, style = _a.style;
+    var title = datum.title, subtitle = datum.subtitle, extra = datum.extra, value = datum.value;
+    var size = findRange(WIDTH_BP, panel.width);
+    var hasProgressBar = (0, specs_1.isMetricWProgress)(datum);
+    var progressBarDirection = (0, specs_1.isMetricWProgress)(datum) ? datum.progressBarDirection : undefined;
+    var containerClassName = (0, classnames_1.default)('echMetricText', {
+        'echMetricText--small': hasProgressBar,
+        'echMetricText--vertical': progressBarDirection === common_1.LayoutDirection.Vertical,
+        'echMetricText--horizontal': progressBarDirection === common_1.LayoutDirection.Horizontal,
+    });
+    var visibility = elementVisibility(datum, panel, size);
+    var parts = splitNumericSuffixPrefix(datum.valueFormatter(value));
+    var bgColor = (0, specs_1.isMetricWTrend)(datum) || !(0, specs_1.isMetricWProgress)(datum) ? datum.color : style.background;
+    var highContrastTextColor = (0, color_calcs_1.highContrastColor)((0, color_library_wrappers_1.colorToRgba)(bgColor)) === colors_1.Colors.White.rgba ? style.text.lightColor : style.text.darkColor;
+    return (react_1.default.createElement("div", { className: containerClassName, style: { color: highContrastTextColor } },
+        react_1.default.createElement("div", null, visibility.title && (react_1.default.createElement("h2", { id: id, className: "echMetricText__title", style: __assign({ fontSize: TITLE_FONT_SIZE[size] + "px" }, lineClamp(visibility.titleLines)) }, title))),
+        react_1.default.createElement("div", null, visibility.subtitle && (react_1.default.createElement("p", { className: "echMetricText__subtitle", style: __assign({ fontSize: SUBTITLE_FONT_SIZE[size] + "px" }, lineClamp(visibility.subtitleLines)) }, subtitle))),
+        react_1.default.createElement("div", { className: "echMetricText__gap" }),
+        react_1.default.createElement("div", null, visibility.extra && (react_1.default.createElement("p", { className: "echMetricText__extra", style: { fontSize: EXTRA_FONT_SIZE[size] + "px" } }, extra))),
+        react_1.default.createElement("div", null,
+            react_1.default.createElement("p", { className: "echMetricText__value", style: { fontSize: VALUE_FONT_SIZE[size] + "px" } }, (0, common_1.isFiniteNumber)(value)
+                ? parts.map(function (_a, i) {
+                    var _b = __read(_a, 2), type = _b[0], text = _b[1];
+                    return type === 'numeric' ? (text) : (react_1.default.createElement("span", { key: i, className: "echMetricText__part", style: { fontSize: VALUE_PART_FONT_SIZE[size] + "px" } }, text));
+                })
+                : style.nonFiniteText))));
+};
+exports.MetricText = MetricText;
+function splitNumericSuffixPrefix(text) {
+    var charts = text.split('');
+    var parts = charts.reduce(function (acc, curr) {
+        var type = curr === '.' || curr === ',' || (0, common_1.isFiniteNumber)(Number.parseInt(curr)) ? 'numeric' : 'string';
+        if (acc.length > 0 && acc[acc.length - 1][0] === type) {
+            acc[acc.length - 1][1].push(curr);
+        }
+        else {
+            acc.push([type, [curr]]);
+        }
+        return acc;
+    }, []);
+    return parts.map(function (_a) {
+        var _b = __read(_a, 2), type = _b[0], chars = _b[1];
+        return [type, chars.join('')];
+    });
+}
+//# sourceMappingURL=text.js.map

package/dist/chart_types/metric/renderer/dom/text.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"text.js","sourceRoot":"","sources":["../../../../../src/chart_types/metric/renderer/dom/text.tsx"],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAQA,0DAAoC;AACpC,gDAA6C;AAE7C,8DAAmE;AACnE,oFAAwE;AACxE,oDAAmD;AACnD,mDAA2E;AAG3E,qCAA2G;AAI3G,IAAM,QAAQ,GAAmC;IAC/C,CAAC,CAAC,EAAE,GAAG,EAAE,GAAG,CAAC;IACb,CAAC,GAAG,EAAE,GAAG,EAAE,GAAG,CAAC;IACf,CAAC,GAAG,EAAE,QAAQ,EAAE,GAAG,CAAC;CACrB,CAAC;AAEF,IAAM,OAAO,GAAG,CAAC,CAAC;AAClB,IAAM,wBAAwB,GAAG,kBAAkB,CAAC;AACpD,IAAM,eAAe,GAA+B,EAAE,CAAC,EAAE,EAAE,EAAE,CAAC,EAAE,EAAE,EAAE,CAAC,EAAE,EAAE,EAAE,CAAC;AAC5E,IAAM,kBAAkB,GAA+B,EAAE,CAAC,EAAE,EAAE,EAAE,CAAC,EAAE,EAAE,EAAE,CAAC,EAAE,EAAE,EAAE,CAAC;AAC/E,IAAM,eAAe,GAA+B,EAAE,CAAC,EAAE,EAAE,EAAE,CAAC,EAAE,EAAE,EAAE,CAAC,EAAE,EAAE,EAAE,CAAC;AAC5E,IAAM,eAAe,GAA+B,EAAE,CAAC,EAAE,EAAE,EAAE,CAAC,EAAE,EAAE,EAAE,CAAC,EAAE,EAAE,EAAE,CAAC;AAC5E,IAAM,oBAAoB,GAA+B,EAAE,CAAC,EAAE,EAAE,EAAE,CAAC,EAAE,EAAE,EAAE,CAAC,EAAE,EAAE,EAAE,CAAC;AAEjF,SAAS,SAAS,CAAC,MAAsC,EAAE,KAAa;IACtE,IAAM,KAAK,GAAG,MAAM,CAAC,IAAI,CAAC,UAAC,EAAU;YAAV,KAAA,aAAU,EAAT,GAAG,QAAA,EAAE,GAAG,QAAA;QAAM,OAAA,GAAG,IAAI,KAAK,IAAI,KAAK,GAAG,GAAG;IAA3B,CAA2B,CAAC,CAAC;IACvE,OAAO,KAAK,CAAC,CAAC,CAAC,KAAK,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,MAAM,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC;AACzC,CAAC;AAUD,SAAS,iBAAiB,CACxB,KAAkD,EAClD,KAAW,EACX,IAAgB;;IAEhB,IAAM,WAAW,GAAG,UAAC,KAAc,EAAE,QAAgB;QACnD,OAAA,OAAO,GAAG,CAAC,KAAK,CAAC,CAAC,CAAC,QAAQ,GAAG,eAAe,CAAC,IAAI,CAAC,GAAG,wBAAwB,CAAC,CAAC,CAAC,CAAC,CAAC;IAAnF,CAAmF,CAAC;IACtF,IAAM,cAAc,GAAG,UAAC,QAAiB,EAAE,QAAgB;QACzD,OAAA,QAAQ,CAAC,CAAC,CAAC,QAAQ,GAAG,kBAAkB,CAAC,IAAI,CAAC,GAAG,wBAAwB,GAAG,OAAO,CAAC,CAAC,CAAC,CAAC;IAAvF,CAAuF,CAAC;IAC1F,IAAM,WAAW,GAAG,UAAC,KAAc,IAAK,OAAA,CAAC,KAAK,CAAC,CAAC,CAAC,eAAe,CAAC,IAAI,CAAC,GAAG,wBAAwB,CAAC,CAAC,CAAC,CAAC,CAAC,EAA9D,CAA8D,CAAC;IACvG,IAAM,WAAW,GAAG,eAAe,CAAC,IAAI,CAAC,GAAG,wBAAwB,GAAG,OAAO,CAAC;IAE/E,IAAM,qBAAqB,GAA6B;QACtD,EAAE,UAAU,EAAE,CAAC,EAAE,aAAa,EAAE,CAAC,EAAE,KAAK,EAAE,CAAC,CAAC,KAAK,CAAC,KAAK,EAAE,QAAQ,EAAE,CAAC,CAAC,KAAK,CAAC,QAAQ,EAAE,KAAK,EAAE,CAAC,CAAC,KAAK,CAAC,KAAK,EAAE;QAC3G,EAAE,UAAU,EAAE,CAAC,EAAE,aAAa,EAAE,CAAC,EAAE,KAAK,EAAE,CAAC,CAAC,KAAK,CAAC,KAAK,EAAE,QAAQ,EAAE,CAAC,CAAC,KAAK,CAAC,QAAQ,EAAE,KAAK,EAAE,CAAC,CAAC,KAAK,CAAC,KAAK,EAAE;QAC3G,EAAE,UAAU,EAAE,CAAC,EAAE,aAAa,EAAE,CAAC,EAAE,KAAK,EAAE,CAAC,CAAC,KAAK,CAAC,KAAK,EAAE,QAAQ,EAAE,KAAK,EAAE,KAAK,EAAE,CAAC,CAAC,KAAK,CAAC,KAAK,EAAE;QAChG,EAAE,UAAU,EAAE,CAAC,EAAE,aAAa,EAAE,CAAC,EAAE,KAAK,EAAE,CAAC,CAAC,KAAK,CAAC,KAAK,EAAE,QAAQ,EAAE,KAAK,EAAE,KAAK,EAAE,CAAC,CAAC,KAAK,CAAC,KAAK,EAAE;QAChG,EAAE,UAAU,EAAE,CAAC,EAAE,aAAa,EAAE,CAAC,EAAE,KAAK,EAAE,CAAC,CAAC,KAAK,CAAC,KAAK,EAAE,QAAQ,EAAE,KAAK,EAAE,KAAK,EAAE,KAAK,EAAE;QACxF,EAAE,UAAU,EAAE,CAAC,EAAE,aAAa,EAAE,CAAC,EAAE,KAAK,EAAE,CAAC,CAAC,KAAK,CAAC,KAAK,EAAE,QAAQ,EAAE,KAAK,EAAE,KAAK,EAAE,KAAK,EAAE;KACzF,CAAC;IAEF,IAAM,SAAS,GAAG,UAAC,EAAwE;YAAtE,UAAU,gBAAA,EAAE,aAAa,mBAAA,EAAE,KAAK,WAAA,EAAE,QAAQ,cAAA,EAAE,KAAK,WAAA;QACpE,OAAA,WAAW,CAAC,KAAK,EAAE,UAAU,CAAC,GAAG,cAAc,CAAC,QAAQ,EAAE,aAAa,CAAC,GAAG,WAAW,CAAC,KAAK,CAAC,GAAG,WAAW;YAC3G,KAAK,CAAC,MAAM;IADZ,CACY,CAAC;IAEf,OAAO,CACL,MAAA,qBAAqB,CAAC,IAAI,CAAC,UAAC,UAAU,IAAK,OAAA,SAAS,CAAC,UAAU,CAAC,EAArB,CAAqB,CAAC,mCACjE,qBAAqB,CAAC,qBAAqB,CAAC,MAAM,GAAG,CAAC,CAAC,CACxD,CAAC;AACJ,CAAC;AAED,SAAS,SAAS,CAAC,QAAgB;IACjC,OAAO;QACL,YAAY,EAAE,UAAU;QACxB,OAAO,EAAE,aAAa;QACtB,eAAe,EAAE,QAAQ;QACzB,SAAS,EAAE,QAAQ;QACnB,eAAe,EAAE,UAAU;QAC3B,QAAQ,EAAE,QAAQ;KACnB,CAAC;AACJ,CAAC;AAGM,IAAM,UAAU,GAKlB,UAAC,EAA2B;QAAzB,EAAE,QAAA,EAAE,KAAK,WAAA,EAAE,KAAK,WAAA,EAAE,KAAK,WAAA;IACrB,IAAA,KAAK,GAA6B,KAAK,MAAlC,EAAE,QAAQ,GAAmB,KAAK,SAAxB,EAAE,KAAK,GAAY,KAAK,MAAjB,EAAE,KAAK,GAAK,KAAK,MAAV,CAAW;IAEhD,IAAM,IAAI,GAAG,SAAS,CAAC,QAAQ,EAAE,KAAK,CAAC,KAAK,CAAC,CAAC;IAC9C,IAAM,cAAc,GAAG,IAAA,yBAAiB,EAAC,KAAK,CAAC,CAAC;IAChD,IAAM,oBAAoB,GAAG,IAAA,yBAAiB,EAAC,KAAK,CAAC,CAAC,CAAC,CAAC,KAAK,CAAC,oBAAoB,CAAC,CAAC,CAAC,SAAS,CAAC;IAC/F,IAAM,kBAAkB,GAAG,IAAA,oBAAU,EAAC,eAAe,EAAE;QACrD,sBAAsB,EAAE,cAAc;QACtC,yBAAyB,EAAE,oBAAoB,KAAK,wBAAe,CAAC,QAAQ;QAC5E,2BAA2B,EAAE,oBAAoB,KAAK,wBAAe,CAAC,UAAU;KACjF,CAAC,CAAC;IAEH,IAAM,UAAU,GAAG,iBAAiB,CAAC,KAAK,EAAE,KAAK,EAAE,IAAI,CAAC,CAAC;IAEzD,IAAM,KAAK,GAAG,wBAAwB,CAAC,KAAK,CAAC,cAAc,CAAC,KAAK,CAAC,CAAC,CAAC;IACpE,IAAM,OAAO,GAAG,IAAA,sBAAc,EAAC,KAAK,CAAC,IAAI,CAAC,IAAA,yBAAiB,EAAC,KAAK,CAAC,CAAC,CAAC,CAAC,KAAK,CAAC,KAAK,CAAC,CAAC,CAAC,KAAK,CAAC,UAAU,CAAC;IAEpG,IAAM,qBAAqB,GACzB,IAAA,+BAAiB,EAAC,IAAA,oCAAW,EAAC,OAAO,CAAC,CAAC,KAAK,eAAM,CAAC,KAAK,CAAC,IAAI,CAAC,CAAC,CAAC,KAAK,CAAC,IAAI,CAAC,UAAU,CAAC,CAAC,CAAC,KAAK,CAAC,IAAI,CAAC,SAAS,CAAC;IAE/G,OAAO,CACL,uCAAK,SAAS,EAAE,kBAAkB,EAAE,KAAK,EAAE,EAAE,KAAK,EAAE,qBAAqB,EAAE;QACzE,2CACG,UAAU,CAAC,KAAK,IAAI,CACnB,sCACE,EAAE,EAAE,EAAE,EACN,SAAS,EAAC,sBAAsB,EAChC,KAAK,aAAI,QAAQ,EAAK,eAAe,CAAC,IAAI,CAAC,OAAI,IAAK,SAAS,CAAC,UAAU,CAAC,UAAU,CAAC,KAEnF,KAAK,CACH,CACN,CACG;QACN,2CACG,UAAU,CAAC,QAAQ,IAAI,CACtB,qCACE,SAAS,EAAC,yBAAyB,EACnC,KAAK,aAAI,QAAQ,EAAK,kBAAkB,CAAC,IAAI,CAAC,OAAI,IAAK,SAAS,CAAC,UAAU,CAAC,aAAa,CAAC,KAEzF,QAAQ,CACP,CACL,CACG;QACN,uCAAK,SAAS,EAAC,oBAAoB,GAAO;QAC1C,2CACG,UAAU,CAAC,KAAK,IAAI,CACnB,qCAAG,SAAS,EAAC,sBAAsB,EAAC,KAAK,EAAE,EAAE,QAAQ,EAAK,eAAe,CAAC,IAAI,CAAC,OAAI,EAAE,IAClF,KAAK,CACJ,CACL,CACG;QACN;YACE,qCAAG,SAAS,EAAC,sBAAsB,EAAC,KAAK,EAAE,EAAE,QAAQ,EAAK,eAAe,CAAC,IAAI,CAAC,OAAI,EAAE,IAClF,IAAA,uBAAc,EAAC,KAAK,CAAC;gBACpB,CAAC,CAAC,KAAK,CAAC,GAAG,CAAC,UAAC,EAAY,EAAE,CAAC;wBAAf,KAAA,aAAY,EAAX,IAAI,QAAA,EAAE,IAAI,QAAA;oBACpB,OAAA,IAAI,KAAK,SAAS,CAAC,CAAC,CAAC,CACnB,IAAI,CACL,CAAC,CAAC,CAAC,CAEF,wCAAM,GAAG,EAAE,CAAC,EAAE,SAAS,EAAC,qBAAqB,EAAC,KAAK,EAAE,EAAE,QAAQ,EAAK,oBAAoB,CAAC,IAAI,CAAC,OAAI,EAAE,IACjG,IAAI,CACA,CACR;gBAPD,CAOC,CACF;gBACH,CAAC,CAAC,KAAK,CAAC,aAAa,CACrB,CACA,CACF,CACP,CAAC;AACJ,CAAC,CAAC;AA1EW,QAAA,UAAU,cA0ErB;AAEF,SAAS,wBAAwB,CAAC,IAAY;IAC5C,IAAM,MAAM,GAAG,IAAI,CAAC,KAAK,CAAC,EAAE,CAAC,CAAC;IAC9B,IAAM,KAAK,GAAG,MAAM,CAAC,MAAM,CAA4B,UAAC,GAAG,EAAE,IAAI;QAC/D,IAAM,IAAI,GAAG,IAAI,KAAK,GAAG,IAAI,IAAI,KAAK,GAAG,IAAI,IAAA,uBAAc,EAAC,MAAM,CAAC,QAAQ,CAAC,IAAI,CAAC,CAAC,CAAC,CAAC,CAAC,SAAS,CAAC,CAAC,CAAC,QAAQ,CAAC;QAE1G,IAAI,GAAG,CAAC,MAAM,GAAG,CAAC,IAAI,GAAG,CAAC,GAAG,CAAC,MAAM,GAAG,CAAC,CAAC,CAAC,CAAC,CAAC,KAAK,IAAI,EAAE;YACrD,GAAG,CAAC,GAAG,CAAC,MAAM,GAAG,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,IAAI,CAAC,IAAI,CAAC,CAAC;SACnC;aAAM;YACL,GAAG,CAAC,IAAI,CAAC,CAAC,IAAI,EAAE,CAAC,IAAI,CAAC,CAAC,CAAC,CAAC;SAC1B;QACD,OAAO,GAAG,CAAC;IACb,CAAC,EAAE,EAAE,CAAC,CAAC;IACP,OAAO,KAAK,CAAC,GAAG,CAAC,UAAC,EAAa;YAAb,KAAA,aAAa,EAAZ,IAAI,QAAA,EAAE,KAAK,QAAA;QAAM,OAAA,CAAC,IAAI,EAAE,KAAK,CAAC,IAAI,CAAC,EAAE,CAAC,CAAC;IAAtB,CAAsB,CAAC,CAAC;AAC9D,CAAC"}

package/dist/chart_types/metric/specs/index.d.ts

@@ -0,0 +1,52 @@
+import { ComponentProps, ReactElement } from 'react';
+import { $Values } from 'utility-types';
+import { ChartType } from '../..';
+import { Color } from '../../../common/colors';
+import { Spec } from '../../../specs';
+import { SpecType } from '../../../specs/constants';
+import { LayoutDirection } from '../../../utils/common';
+/** @alpha */
+export declare type MetricBase = {
+    value: number;
+    valueFormatter: (d: number) => string;
+    color: Color;
+    title?: string;
+    subtitle?: string;
+    extra?: ReactElement;
+};
+/** @alpha */
+export declare type MetricWProgress = MetricBase & {
+    domain: {
+        min: number;
+        max: number;
+    };
+    progressBarDirection?: LayoutDirection;
+};
+/** @alpha */
+export declare const MetricTrendShape: Readonly<{
+    Bars: "bars";
+    Area: "area";
+}>;
+/** @alpha */
+export declare type MetricTrendShape = $Values<typeof MetricTrendShape>;
+/** @alpha */
+export declare type MetricWTrend = MetricBase & {
+    trend: {
+        x: number;
+        y: number;
+    }[];
+    trendShape?: MetricTrendShape;
+    trendA11yTitle?: string;
+    trendA11yDescription?: string;
+};
+/** @alpha */
+export interface MetricSpec extends Spec {
+    specType: typeof SpecType.Series;
+    chartType: typeof ChartType.Metric;
+    data: (MetricBase | MetricWProgress | MetricWTrend | undefined)[][];
+}
+/** @alpha */
+export declare const Metric: import("react").FC<import("../../../state/spec_factory").SFProps<MetricSpec, "chartType" | "specType", "data", never, "id">>;
+/** @alpha */
+export declare type MetricSpecProps = ComponentProps<typeof Metric>;
+//# sourceMappingURL=index.d.ts.map

package/dist/chart_types/metric/specs/index.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../src/chart_types/metric/specs/index.ts"],"names":[],"mappings":"AAQA,OAAO,EAAE,cAAc,EAAE,YAAY,EAAE,MAAM,OAAO,CAAC;AACrD,OAAO,EAAE,OAAO,EAAE,MAAM,eAAe,CAAC;AAExC,OAAO,EAAE,SAAS,EAAE,MAAM,OAAO,CAAC;AAClC,OAAO,EAAE,KAAK,EAAE,MAAM,wBAAwB,CAAC;AAC/C,OAAO,EAAE,IAAI,EAAE,MAAM,gBAAgB,CAAC;AACtC,OAAO,EAAE,QAAQ,EAAE,MAAM,0BAA0B,CAAC;AAEpD,OAAO,EAAE,eAAe,EAAE,MAAM,uBAAuB,CAAC;AAExD,aAAa;AACb,oBAAY,UAAU,GAAG;IACvB,KAAK,EAAE,MAAM,CAAC;IACd,cAAc,EAAE,CAAC,CAAC,EAAE,MAAM,KAAK,MAAM,CAAC;IACtC,KAAK,EAAE,KAAK,CAAC;IACb,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,QAAQ,CAAC,EAAE,MAAM,CAAC;IAClB,KAAK,CAAC,EAAE,YAAY,CAAC;CACtB,CAAC;AAEF,aAAa;AACb,oBAAY,eAAe,GAAG,UAAU,GAAG;IACzC,MAAM,EAAE;QAAE,GAAG,EAAE,MAAM,CAAC;QAAC,GAAG,EAAE,MAAM,CAAA;KAAE,CAAC;IACrC,oBAAoB,CAAC,EAAE,eAAe,CAAC;CACxC,CAAC;AAEF,aAAa;AACb,eAAO,MAAM,gBAAgB;;;EAG3B,CAAC;AAEH,aAAa;AACb,oBAAY,gBAAgB,GAAG,OAAO,CAAC,OAAO,gBAAgB,CAAC,CAAC;AAEhE,aAAa;AACb,oBAAY,YAAY,GAAG,UAAU,GAAG;IACtC,KAAK,EAAE;QAAE,CAAC,EAAE,MAAM,CAAC;QAAC,CAAC,EAAE,MAAM,CAAA;KAAE,EAAE,CAAC;IAClC,UAAU,CAAC,EAAE,gBAAgB,CAAC;IAC9B,cAAc,CAAC,EAAE,MAAM,CAAC;IACxB,oBAAoB,CAAC,EAAE,MAAM,CAAC;CAC/B,CAAC;AAEF,aAAa;AACb,MAAM,WAAW,UAAW,SAAQ,IAAI;IACtC,QAAQ,EAAE,OAAO,QAAQ,CAAC,MAAM,CAAC;IACjC,SAAS,EAAE,OAAO,SAAS,CAAC,MAAM,CAAC;IACnC,IAAI,EAAE,CAAC,UAAU,GAAG,eAAe,GAAG,YAAY,GAAG,SAAS,CAAC,EAAE,EAAE,CAAC;CACrE;AAED,aAAa;AACb,eAAO,MAAM,MAAM,8HAQlB,CAAC;AAEF,aAAa;AACb,oBAAY,eAAe,GAAG,cAAc,CAAC,OAAO,MAAM,CAAC,CAAC"}

package/dist/chart_types/metric/specs/index.js

@@ -0,0 +1,25 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.isMetricWTrend = exports.isMetricWProgress = exports.Metric = exports.MetricTrendShape = void 0;
+var __1 = require("../..");
+var constants_1 = require("../../../specs/constants");
+var spec_factory_1 = require("../../../state/spec_factory");
+exports.MetricTrendShape = Object.freeze({
+    Bars: 'bars',
+    Area: 'area',
+});
+exports.Metric = (0, spec_factory_1.specComponentFactory)()({
+    chartType: __1.ChartType.Metric,
+    specType: constants_1.SpecType.Series,
+}, {
+    data: [],
+});
+function isMetricWProgress(datum) {
+    return datum.hasOwnProperty('domain') && !datum.hasOwnProperty('trend');
+}
+exports.isMetricWProgress = isMetricWProgress;
+function isMetricWTrend(datum) {
+    return datum.hasOwnProperty('trend') && !datum.hasOwnProperty('domain');
+}
+exports.isMetricWTrend = isMetricWTrend;
+//# sourceMappingURL=index.js.map

package/dist/chart_types/metric/specs/index.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../../src/chart_types/metric/specs/index.ts"],"names":[],"mappings":";;;AAWA,2BAAkC;AAGlC,sDAAoD;AACpD,4DAAmE;AAoBtD,QAAA,gBAAgB,GAAG,MAAM,CAAC,MAAM,CAAC;IAC5C,IAAI,EAAE,MAAe;IACrB,IAAI,EAAE,MAAe;CACtB,CAAC,CAAC;AAqBU,QAAA,MAAM,GAAG,IAAA,mCAAoB,GAAc,CACtD;IACE,SAAS,EAAE,aAAS,CAAC,MAAM;IAC3B,QAAQ,EAAE,oBAAQ,CAAC,MAAM;CAC1B,EACD;IACE,IAAI,EAAE,EAAE;CACT,CACF,CAAC;AAMF,SAAgB,iBAAiB,CAAC,KAAkD;IAClF,OAAO,KAAK,CAAC,cAAc,CAAC,QAAQ,CAAC,IAAI,CAAC,KAAK,CAAC,cAAc,CAAC,OAAO,CAAC,CAAC;AAC1E,CAAC;AAFD,8CAEC;AAGD,SAAgB,cAAc,CAAC,KAAkD;IAC/E,OAAO,KAAK,CAAC,cAAc,CAAC,OAAO,CAAC,IAAI,CAAC,KAAK,CAAC,cAAc,CAAC,QAAQ,CAAC,CAAC;AAC1E,CAAC;AAFD,wCAEC"}

package/dist/chart_types/metric/state/chart_state.d.ts

@@ -0,0 +1,2 @@
+export {};
+//# sourceMappingURL=chart_state.d.ts.map

package/dist/chart_types/metric/state/chart_state.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"chart_state.d.ts","sourceRoot":"","sources":["../../../../src/chart_types/metric/state/chart_state.tsx"],"names":[],"mappings":""}