@vizzly/dashboard 0.14.4-dev-c25428d42db56a9b153be528febab668cec55785 → 0.14.4-dev-b4a15896ec5f2fffd81b6585e16fac81b314a1f1
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/charts/src/v2/components/BarChart/BarChart.d.ts +19 -0
- package/dist/charts/src/v2/components/BarChart/index.d.ts +1 -0
- package/dist/charts/src/v2/components/BarChart/utils.d.ts +7 -0
- package/dist/charts/src/v2/index.d.ts +1 -0
- package/dist/charts/src/v2/utils/buildMargin.d.ts +9 -0
- package/dist/charts/src/v2/utils/getTooltipData.d.ts +3 -1
- package/dist/dashboard.cjs.development.js +235 -227
- package/dist/dashboard.cjs.production.min.js +1 -1
- package/dist/dashboard.esm.js +236 -228
- package/dist/shared-logic/src/BarChartV2/adjustTicks.d.ts +1 -0
- package/dist/shared-logic/src/BarChartV2/types.d.ts +74 -0
- package/dist/shared-logic/src/ChartsV2/types.d.ts +5 -0
- package/dist/shared-logic/src/ConditionalFormatting/utils.d.ts +7 -0
- package/dist/shared-logic/src/LineChartV2/getScaleAndTicks.d.ts +2 -1
- package/dist/shared-logic/src/LineChartV2/types.d.ts +1 -5
- package/dist/shared-ui/src/components/ChartHelper.d.ts +1 -0
- package/dist/shared-ui/src/components/DataTable/buildConditionalFormattingBoundaries.d.ts +1 -0
- package/dist/shared-ui/src/library/ConditionalFormatting.d.ts +2 -8
- package/package.json +1 -1
- package/dist/charts/src/v2/components/LineChart/buildMargin.d.ts +0 -9
package/dist/dashboard.esm.js
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
import React__default, { Fragment, useEffect, useState, useContext, createContext, forwardRef, isValidElement, cloneElement, createElement, useLayoutEffect, useRef, useMemo, useReducer, createRef, useCallback, memo, useImperativeHandle, Suspense } from 'react';
|
|
2
2
|
import isEmpty$3 from 'lodash-es/isEmpty';
|
|
3
|
-
import _, { isArray, capitalize, isEmpty as isEmpty$2, replace, isObject, isNumber, every, some, mergeWith, remove as remove$2, cloneDeep, findIndex, reduce, merge, sumBy, mapValues,
|
|
3
|
+
import _, { isArray, capitalize, isEmpty as isEmpty$2, replace, isObject, isNumber, every, some, mergeWith, remove as remove$2, cloneDeep, findIndex, reduce, merge, sumBy, mapValues, zipObject, isFunction, isDate, omit as omit$1, maxBy, reject, defaultsDeep, isString, flatMap, filter, uniq, uniqBy, debounce as debounce$1, orderBy, minBy, throttle, get as get$1, min, max, groupBy, intersection, isEqual } from 'lodash-es';
|
|
4
4
|
import { QueryEngineConfig } from '@vizzly/semantic-layer-public';
|
|
5
5
|
import { v4 } from 'uuid';
|
|
6
6
|
import Joi from '@vizzly/joi';
|
|
@@ -9955,169 +9955,6 @@ var to100PercentResultSet = function to100PercentResultSet(resultSet) {
|
|
|
9955
9955
|
});
|
|
9956
9956
|
};
|
|
9957
9957
|
|
|
9958
|
-
var DEFAULT_ROW_HEIGHT = 350;
|
|
9959
|
-
var HEADER_ROW_HEIGHT = 52;
|
|
9960
|
-
var linearScale = function linearScale(colors, colorCount) {
|
|
9961
|
-
return chroma.scale(colors).colors(colorCount);
|
|
9962
|
-
};
|
|
9963
|
-
var themeToColorScale = function themeToColorScale(colors, colorCount) {
|
|
9964
|
-
var _colors$length;
|
|
9965
|
-
if ((colorCount != null ? colorCount : 0) <= ((_colors$length = colors == null ? void 0 : colors.length) != null ? _colors$length : 0)) {
|
|
9966
|
-
return colors;
|
|
9967
|
-
}
|
|
9968
|
-
return shuffle(linearScale(colors, colorCount));
|
|
9969
|
-
};
|
|
9970
|
-
var vizzlyDefaultTheme = {
|
|
9971
|
-
colors: ['#feae4a', '#5fbaff', '#e15e9d'],
|
|
9972
|
-
detail: 'minimal',
|
|
9973
|
-
fontFamily: 'Inter, sans-serif',
|
|
9974
|
-
rowLimit: 6,
|
|
9975
|
-
fontSize: '0.65rem'
|
|
9976
|
-
};
|
|
9977
|
-
var darkerColor = function darkerColor(color, darkenBy, opacity) {
|
|
9978
|
-
var newColor = chroma(color).darken(darkenBy);
|
|
9979
|
-
if (opacity) newColor = setOpacity(newColor, opacity);
|
|
9980
|
-
return newColor.hex();
|
|
9981
|
-
};
|
|
9982
|
-
var darkenListOfColors = function darkenListOfColors(colors, darkenBy) {
|
|
9983
|
-
if (darkenBy === void 0) {
|
|
9984
|
-
darkenBy = 1;
|
|
9985
|
-
}
|
|
9986
|
-
return [].concat(colors).map(function (color) {
|
|
9987
|
-
return darkerColor(color, darkenBy);
|
|
9988
|
-
});
|
|
9989
|
-
};
|
|
9990
|
-
var setOpacity = function setOpacity(color, opacity) {
|
|
9991
|
-
return chroma(color).alpha(opacity);
|
|
9992
|
-
};
|
|
9993
|
-
var highestContrast = function highestContrast(baseColor, colorOptions) {
|
|
9994
|
-
return maxBy(colorOptions, function (potentialTextColour) {
|
|
9995
|
-
return chroma.contrast(potentialTextColour, baseColor);
|
|
9996
|
-
}) || baseColor;
|
|
9997
|
-
};
|
|
9998
|
-
|
|
9999
|
-
// Typically anything over 4.5 is high enough contrast.
|
|
10000
|
-
var pickBestTextColor = function pickBestTextColor(backgroundColour, possibleTextColours) {
|
|
10001
|
-
return highestContrast(backgroundColour, possibleTextColours);
|
|
10002
|
-
};
|
|
10003
|
-
|
|
10004
|
-
// ------------------------------------------------------------------------------------
|
|
10005
|
-
// ------------------------------------------------------------------------------------
|
|
10006
|
-
// ------------------------------------------------------------------------------------
|
|
10007
|
-
// ------------------------------------------------------------------------------------
|
|
10008
|
-
// https://stackoverflow.com/questions/16801687/javascript-random-ordering-with-seed
|
|
10009
|
-
|
|
10010
|
-
var random = function random(seed) {
|
|
10011
|
-
var x = Math.sin(seed++) * 10000;
|
|
10012
|
-
return x - Math.floor(x);
|
|
10013
|
-
};
|
|
10014
|
-
var DEFAULT_RANDOM_SEED = 5;
|
|
10015
|
-
var shuffle = function shuffle(array, seed) {
|
|
10016
|
-
if (seed === void 0) {
|
|
10017
|
-
seed = DEFAULT_RANDOM_SEED;
|
|
10018
|
-
}
|
|
10019
|
-
var m = array.length,
|
|
10020
|
-
t,
|
|
10021
|
-
i;
|
|
10022
|
-
|
|
10023
|
-
// While there remain elements to shuffle…
|
|
10024
|
-
while (m) {
|
|
10025
|
-
// Pick a remaining element…
|
|
10026
|
-
i = Math.floor(random(seed) * m--);
|
|
10027
|
-
|
|
10028
|
-
// And swap it with the current element.
|
|
10029
|
-
t = array[m];
|
|
10030
|
-
array[m] = array[i];
|
|
10031
|
-
array[i] = t;
|
|
10032
|
-
++seed;
|
|
10033
|
-
}
|
|
10034
|
-
return array;
|
|
10035
|
-
};
|
|
10036
|
-
// ------------------------------------------------------------------------------------
|
|
10037
|
-
// ------------------------------------------------------------------------------------
|
|
10038
|
-
// ------------------------------------------------------------------------------------
|
|
10039
|
-
// ------------------------------------------------------------------------------------
|
|
10040
|
-
|
|
10041
|
-
function getFormattedByRule(_ref) {
|
|
10042
|
-
var type = _ref.type,
|
|
10043
|
-
value = _ref.value;
|
|
10044
|
-
var fontColor = pickBestTextColor(value != null ? value : '', ['white', 'black']);
|
|
10045
|
-
switch (type) {
|
|
10046
|
-
case 'fontColor':
|
|
10047
|
-
{
|
|
10048
|
-
return {
|
|
10049
|
-
color: value
|
|
10050
|
-
};
|
|
10051
|
-
}
|
|
10052
|
-
case 'backgroundColor':
|
|
10053
|
-
{
|
|
10054
|
-
return {
|
|
10055
|
-
backgroundColor: value,
|
|
10056
|
-
color: fontColor
|
|
10057
|
-
};
|
|
10058
|
-
}
|
|
10059
|
-
}
|
|
10060
|
-
return {};
|
|
10061
|
-
}
|
|
10062
|
-
var unsupportedNullComparisons = ['contains_substring', 'does_not_contain_substring', 'ends_with', 'starts_with', '<', '<=', '>', '>='];
|
|
10063
|
-
var compare = function compare(filter, recordValue) {
|
|
10064
|
-
if (recordValue == null && unsupportedNullComparisons.includes(filter.op)) return false;
|
|
10065
|
-
switch (filter.op) {
|
|
10066
|
-
case 'starts_with':
|
|
10067
|
-
return ("" + recordValue).startsWith(filter.value);
|
|
10068
|
-
case 'ends_with':
|
|
10069
|
-
return ("" + recordValue).endsWith(filter.value);
|
|
10070
|
-
case 'is_one_of':
|
|
10071
|
-
return filter.value.includes(recordValue);
|
|
10072
|
-
case 'is_not_one_of':
|
|
10073
|
-
return !filter.value.includes(recordValue);
|
|
10074
|
-
case 'contains_substring':
|
|
10075
|
-
return ("" + recordValue).includes(filter.value);
|
|
10076
|
-
case 'does_not_contain_substring':
|
|
10077
|
-
return !("" + recordValue).includes(filter.value);
|
|
10078
|
-
case '<':
|
|
10079
|
-
return recordValue < filter.value;
|
|
10080
|
-
case '>':
|
|
10081
|
-
return recordValue > filter.value;
|
|
10082
|
-
case '=':
|
|
10083
|
-
return recordValue == filter.value;
|
|
10084
|
-
case '!=':
|
|
10085
|
-
return recordValue != filter.value;
|
|
10086
|
-
case '>=':
|
|
10087
|
-
return recordValue >= filter.value;
|
|
10088
|
-
case '<=':
|
|
10089
|
-
return recordValue <= filter.value;
|
|
10090
|
-
case 'array_contains':
|
|
10091
|
-
// For some reason a datumKey being passed as the recordValue in certain situations here? // isDatumKey but don't implement yet
|
|
10092
|
-
if (!isArray(recordValue)) return false;
|
|
10093
|
-
return recordValue.some(function (v) {
|
|
10094
|
-
return filter.value.includes(v);
|
|
10095
|
-
});
|
|
10096
|
-
case 'array_does_not_contain':
|
|
10097
|
-
// For some reason a datumKey being passed as the recordValue in certain situations here?
|
|
10098
|
-
if (!isArray(recordValue)) return false;
|
|
10099
|
-
return !recordValue.some(function (v) {
|
|
10100
|
-
return filter.value.includes(v);
|
|
10101
|
-
});
|
|
10102
|
-
case 'array_contains_any_of':
|
|
10103
|
-
if (!isArray(recordValue)) return false;
|
|
10104
|
-
return recordValue.some(function (v) {
|
|
10105
|
-
return filter.value.includes(v);
|
|
10106
|
-
});
|
|
10107
|
-
case 'array_contains_all_of':
|
|
10108
|
-
if (!isArray(recordValue)) return false;
|
|
10109
|
-
// write a function to check if all elements in filter.value are in recordValue
|
|
10110
|
-
return recordValue.every(function (v) {
|
|
10111
|
-
return filter.value.includes(v);
|
|
10112
|
-
});
|
|
10113
|
-
}
|
|
10114
|
-
console.log('Unsupported comparison op.', filter.op);
|
|
10115
|
-
throw 'Unsupported comparison op.';
|
|
10116
|
-
};
|
|
10117
|
-
var conditionIsMet = function conditionIsMet(filter, value) {
|
|
10118
|
-
return compare(filter, value);
|
|
10119
|
-
};
|
|
10120
|
-
|
|
10121
9958
|
var defaultNumberFormatOptions = function defaultNumberFormatOptions(textOverride) {
|
|
10122
9959
|
var noValue = textOverride('number_format_option.noValueReplacement', 'No value');
|
|
10123
9960
|
var formattingError = textOverride('number_format_option.formattingError', 'Formatting error');
|
|
@@ -10474,6 +10311,65 @@ var acceptedTimeDimensions = function acceptedTimeDimensions(timeDimension) {
|
|
|
10474
10311
|
return ['week', 'month', 'quarter', 'year'].includes(timeDimension.truncate);
|
|
10475
10312
|
};
|
|
10476
10313
|
|
|
10314
|
+
var unsupportedNullComparisons = ['contains_substring', 'does_not_contain_substring', 'ends_with', 'starts_with', '<', '<=', '>', '>='];
|
|
10315
|
+
var compare = function compare(filter, recordValue) {
|
|
10316
|
+
if (recordValue == null && unsupportedNullComparisons.includes(filter.op)) return false;
|
|
10317
|
+
switch (filter.op) {
|
|
10318
|
+
case 'starts_with':
|
|
10319
|
+
return ("" + recordValue).startsWith(filter.value);
|
|
10320
|
+
case 'ends_with':
|
|
10321
|
+
return ("" + recordValue).endsWith(filter.value);
|
|
10322
|
+
case 'is_one_of':
|
|
10323
|
+
return filter.value.includes(recordValue);
|
|
10324
|
+
case 'is_not_one_of':
|
|
10325
|
+
return !filter.value.includes(recordValue);
|
|
10326
|
+
case 'contains_substring':
|
|
10327
|
+
return ("" + recordValue).includes(filter.value);
|
|
10328
|
+
case 'does_not_contain_substring':
|
|
10329
|
+
return !("" + recordValue).includes(filter.value);
|
|
10330
|
+
case '<':
|
|
10331
|
+
return recordValue < filter.value;
|
|
10332
|
+
case '>':
|
|
10333
|
+
return recordValue > filter.value;
|
|
10334
|
+
case '=':
|
|
10335
|
+
return recordValue == filter.value;
|
|
10336
|
+
case '!=':
|
|
10337
|
+
return recordValue != filter.value;
|
|
10338
|
+
case '>=':
|
|
10339
|
+
return recordValue >= filter.value;
|
|
10340
|
+
case '<=':
|
|
10341
|
+
return recordValue <= filter.value;
|
|
10342
|
+
case 'array_contains':
|
|
10343
|
+
// For some reason a datumKey being passed as the recordValue in certain situations here? // isDatumKey but don't implement yet
|
|
10344
|
+
if (!isArray(recordValue)) return false;
|
|
10345
|
+
return recordValue.some(function (v) {
|
|
10346
|
+
return filter.value.includes(v);
|
|
10347
|
+
});
|
|
10348
|
+
case 'array_does_not_contain':
|
|
10349
|
+
// For some reason a datumKey being passed as the recordValue in certain situations here?
|
|
10350
|
+
if (!isArray(recordValue)) return false;
|
|
10351
|
+
return !recordValue.some(function (v) {
|
|
10352
|
+
return filter.value.includes(v);
|
|
10353
|
+
});
|
|
10354
|
+
case 'array_contains_any_of':
|
|
10355
|
+
if (!isArray(recordValue)) return false;
|
|
10356
|
+
return recordValue.some(function (v) {
|
|
10357
|
+
return filter.value.includes(v);
|
|
10358
|
+
});
|
|
10359
|
+
case 'array_contains_all_of':
|
|
10360
|
+
if (!isArray(recordValue)) return false;
|
|
10361
|
+
// write a function to check if all elements in filter.value are in recordValue
|
|
10362
|
+
return recordValue.every(function (v) {
|
|
10363
|
+
return filter.value.includes(v);
|
|
10364
|
+
});
|
|
10365
|
+
}
|
|
10366
|
+
console.log('Unsupported comparison op.', filter.op);
|
|
10367
|
+
throw 'Unsupported comparison op.';
|
|
10368
|
+
};
|
|
10369
|
+
var conditionIsMet = function conditionIsMet(filter, value) {
|
|
10370
|
+
return compare(filter, value);
|
|
10371
|
+
};
|
|
10372
|
+
|
|
10477
10373
|
var mergeProps = function mergeProps(explicitProps, remoteProps, defaultProps) {
|
|
10478
10374
|
var devDefined = merge({}, remoteProps, explicitProps);
|
|
10479
10375
|
return merge({}, defaultProps, devDefined);
|
|
@@ -11178,6 +11074,89 @@ var TableLibraryWrapper = function TableLibraryWrapper(props) {
|
|
|
11178
11074
|
});
|
|
11179
11075
|
};
|
|
11180
11076
|
|
|
11077
|
+
var DEFAULT_ROW_HEIGHT = 350;
|
|
11078
|
+
var HEADER_ROW_HEIGHT = 52;
|
|
11079
|
+
var linearScale = function linearScale(colors, colorCount) {
|
|
11080
|
+
return chroma.scale(colors).colors(colorCount);
|
|
11081
|
+
};
|
|
11082
|
+
var themeToColorScale = function themeToColorScale(colors, colorCount) {
|
|
11083
|
+
var _colors$length;
|
|
11084
|
+
if ((colorCount != null ? colorCount : 0) <= ((_colors$length = colors == null ? void 0 : colors.length) != null ? _colors$length : 0)) {
|
|
11085
|
+
return colors;
|
|
11086
|
+
}
|
|
11087
|
+
return shuffle(linearScale(colors, colorCount));
|
|
11088
|
+
};
|
|
11089
|
+
var vizzlyDefaultTheme = {
|
|
11090
|
+
colors: ['#feae4a', '#5fbaff', '#e15e9d'],
|
|
11091
|
+
detail: 'minimal',
|
|
11092
|
+
fontFamily: 'Inter, sans-serif',
|
|
11093
|
+
rowLimit: 6,
|
|
11094
|
+
fontSize: '0.65rem'
|
|
11095
|
+
};
|
|
11096
|
+
var darkerColor = function darkerColor(color, darkenBy, opacity) {
|
|
11097
|
+
var newColor = chroma(color).darken(darkenBy);
|
|
11098
|
+
if (opacity) newColor = setOpacity(newColor, opacity);
|
|
11099
|
+
return newColor.hex();
|
|
11100
|
+
};
|
|
11101
|
+
var darkenListOfColors = function darkenListOfColors(colors, darkenBy) {
|
|
11102
|
+
if (darkenBy === void 0) {
|
|
11103
|
+
darkenBy = 1;
|
|
11104
|
+
}
|
|
11105
|
+
return [].concat(colors).map(function (color) {
|
|
11106
|
+
return darkerColor(color, darkenBy);
|
|
11107
|
+
});
|
|
11108
|
+
};
|
|
11109
|
+
var setOpacity = function setOpacity(color, opacity) {
|
|
11110
|
+
return chroma(color).alpha(opacity);
|
|
11111
|
+
};
|
|
11112
|
+
var highestContrast = function highestContrast(baseColor, colorOptions) {
|
|
11113
|
+
return maxBy(colorOptions, function (potentialTextColour) {
|
|
11114
|
+
return chroma.contrast(potentialTextColour, baseColor);
|
|
11115
|
+
}) || baseColor;
|
|
11116
|
+
};
|
|
11117
|
+
|
|
11118
|
+
// Typically anything over 4.5 is high enough contrast.
|
|
11119
|
+
var pickBestTextColor = function pickBestTextColor(backgroundColour, possibleTextColours) {
|
|
11120
|
+
return highestContrast(backgroundColour, possibleTextColours);
|
|
11121
|
+
};
|
|
11122
|
+
|
|
11123
|
+
// ------------------------------------------------------------------------------------
|
|
11124
|
+
// ------------------------------------------------------------------------------------
|
|
11125
|
+
// ------------------------------------------------------------------------------------
|
|
11126
|
+
// ------------------------------------------------------------------------------------
|
|
11127
|
+
// https://stackoverflow.com/questions/16801687/javascript-random-ordering-with-seed
|
|
11128
|
+
|
|
11129
|
+
var random = function random(seed) {
|
|
11130
|
+
var x = Math.sin(seed++) * 10000;
|
|
11131
|
+
return x - Math.floor(x);
|
|
11132
|
+
};
|
|
11133
|
+
var DEFAULT_RANDOM_SEED = 5;
|
|
11134
|
+
var shuffle = function shuffle(array, seed) {
|
|
11135
|
+
if (seed === void 0) {
|
|
11136
|
+
seed = DEFAULT_RANDOM_SEED;
|
|
11137
|
+
}
|
|
11138
|
+
var m = array.length,
|
|
11139
|
+
t,
|
|
11140
|
+
i;
|
|
11141
|
+
|
|
11142
|
+
// While there remain elements to shuffle…
|
|
11143
|
+
while (m) {
|
|
11144
|
+
// Pick a remaining element…
|
|
11145
|
+
i = Math.floor(random(seed) * m--);
|
|
11146
|
+
|
|
11147
|
+
// And swap it with the current element.
|
|
11148
|
+
t = array[m];
|
|
11149
|
+
array[m] = array[i];
|
|
11150
|
+
array[i] = t;
|
|
11151
|
+
++seed;
|
|
11152
|
+
}
|
|
11153
|
+
return array;
|
|
11154
|
+
};
|
|
11155
|
+
// ------------------------------------------------------------------------------------
|
|
11156
|
+
// ------------------------------------------------------------------------------------
|
|
11157
|
+
// ------------------------------------------------------------------------------------
|
|
11158
|
+
// ------------------------------------------------------------------------------------
|
|
11159
|
+
|
|
11181
11160
|
var _excluded$1 = ["fill", "width", "height"],
|
|
11182
11161
|
_excluded2 = ["fill", "width", "height"],
|
|
11183
11162
|
_excluded3 = ["fill", "gradient"],
|
|
@@ -39914,7 +39893,8 @@ var getTooltipData = function getTooltipData(_ref) {
|
|
|
39914
39893
|
xScaleKey = _ref.xScaleKey,
|
|
39915
39894
|
xScaleDataType = _ref.xScaleDataType,
|
|
39916
39895
|
xScale = _ref.xScale,
|
|
39917
|
-
xOrdering = _ref.xOrdering
|
|
39896
|
+
xOrdering = _ref.xOrdering,
|
|
39897
|
+
chartType = _ref.chartType;
|
|
39918
39898
|
var descending = xOrdering === 'desc';
|
|
39919
39899
|
var point = localPoint(event) || {
|
|
39920
39900
|
x: 0,
|
|
@@ -39982,7 +39962,12 @@ var getTooltipData = function getTooltipData(_ref) {
|
|
|
39982
39962
|
tooltipData = Math.abs(_x - _d0Value) > Math.abs(_d1Value - _x) ? _d2 : _d;
|
|
39983
39963
|
}
|
|
39984
39964
|
} else if (xScaleDataType === 'string' && 'step' in xScale) {
|
|
39965
|
+
var barWidth = 0;
|
|
39985
39966
|
// 1. Get the band width in pixels of the xScale so we can use it to determine how wide each column is
|
|
39967
|
+
|
|
39968
|
+
if (chartType === 'bar') {
|
|
39969
|
+
barWidth = xScale.bandwidth();
|
|
39970
|
+
}
|
|
39986
39971
|
var scaleBandWidth = xScale.step();
|
|
39987
39972
|
// 2. Get the horizontal x position by removing the margin.left value
|
|
39988
39973
|
var _x2 = point.x - margin.left;
|
|
@@ -39994,7 +39979,7 @@ var getTooltipData = function getTooltipData(_ref) {
|
|
|
39994
39979
|
tooltipData = _d3;
|
|
39995
39980
|
if (_d4) {
|
|
39996
39981
|
// If x is closer to scaleBandWidth * d0 or scaleBandWidth * d1, then use d0 or d1 respectively
|
|
39997
|
-
tooltipData = Math.abs(_x2 - scaleBandWidth * _indexOfX2) > Math.abs(scaleBandWidth * (_indexOfX2 + 1) - _x2) ? _d4 : _d3;
|
|
39982
|
+
tooltipData = Math.abs(_x2 - (scaleBandWidth + barWidth) * _indexOfX2) > Math.abs((scaleBandWidth + barWidth) * (_indexOfX2 + 1) - _x2) ? _d4 : _d3;
|
|
39998
39983
|
}
|
|
39999
39984
|
}
|
|
40000
39985
|
return {
|
|
@@ -40177,7 +40162,7 @@ var LegendItem = function LegendItem(_ref) {
|
|
|
40177
40162
|
color: rule.color,
|
|
40178
40163
|
style: style,
|
|
40179
40164
|
yKey: yKey
|
|
40180
|
-
});
|
|
40165
|
+
}, "rule-" + JSON.stringify(rule));
|
|
40181
40166
|
})]
|
|
40182
40167
|
}), jsx("span", {
|
|
40183
40168
|
style: {
|
|
@@ -40306,69 +40291,13 @@ var GoalLine = function GoalLine(_ref) {
|
|
|
40306
40291
|
*/
|
|
40307
40292
|
|
|
40308
40293
|
var ASSUMED_AVERAGE_CHAR_WIDTH = 8.8;
|
|
40309
|
-
function calculateWordWidth(word, avgCharWidth) {
|
|
40310
|
-
if (avgCharWidth === void 0) {
|
|
40311
|
-
avgCharWidth = ASSUMED_AVERAGE_CHAR_WIDTH;
|
|
40312
|
-
}
|
|
40313
|
-
return word.length * avgCharWidth;
|
|
40314
|
-
}
|
|
40315
|
-
|
|
40316
|
-
/** Reduce width proportionally to simulate spacing / padding between ticks. */
|
|
40317
|
-
var widthWithSpacing = function widthWithSpacing(width) {
|
|
40318
|
-
var THIRTY_PERCENT = 0.3;
|
|
40319
|
-
return width - width * THIRTY_PERCENT;
|
|
40320
|
-
};
|
|
40321
|
-
function howManyTicksFitInWidth(ticks, maxWidth, avgCharWidth) {
|
|
40322
|
-
if (avgCharWidth === void 0) {
|
|
40323
|
-
avgCharWidth = ASSUMED_AVERAGE_CHAR_WIDTH;
|
|
40324
|
-
}
|
|
40325
|
-
var fittedTicks = [];
|
|
40326
|
-
var currentWidth = 0;
|
|
40327
|
-
for (var _iterator = _createForOfIteratorHelperLoose(ticks), _step; !(_step = _iterator()).done;) {
|
|
40328
|
-
var tick = _step.value;
|
|
40329
|
-
var word = (tick == null ? void 0 : tick.formattedValue) || '';
|
|
40330
|
-
var wordWidth = calculateWordWidth(word, avgCharWidth);
|
|
40331
|
-
if (currentWidth + wordWidth <= widthWithSpacing(maxWidth)) {
|
|
40332
|
-
fittedTicks.push(tick);
|
|
40333
|
-
currentWidth += wordWidth + avgCharWidth; // Add space between words
|
|
40334
|
-
} else {
|
|
40335
|
-
break; // Stop if adding the word exceeds maxWidth
|
|
40336
|
-
}
|
|
40337
|
-
}
|
|
40338
|
-
return fittedTicks.length;
|
|
40339
|
-
}
|
|
40340
|
-
function pickEquallySpaced(arr, numPicks) {
|
|
40341
|
-
if (numPicks >= arr.length) {
|
|
40342
|
-
return arr; // If numPicks is greater than or equal to the array length, return the whole array
|
|
40343
|
-
}
|
|
40344
|
-
var result = [];
|
|
40345
|
-
var interval = (arr.length - 1) / (numPicks - 1);
|
|
40346
|
-
for (var i = 0; i < numPicks; i++) {
|
|
40347
|
-
var index = Math.round(i * interval); // Calculate index and round it
|
|
40348
|
-
result.push(arr[index]);
|
|
40349
|
-
}
|
|
40350
|
-
return result;
|
|
40351
|
-
}
|
|
40352
|
-
var adjustTicks = function adjustTicks(lineChartRepresentation, width) {
|
|
40353
|
-
lineChartRepresentation = cloneDeep(lineChartRepresentation);
|
|
40354
|
-
|
|
40355
|
-
// TODO; take this from the theme override...
|
|
40356
|
-
var averageCharacterWidth = ASSUMED_AVERAGE_CHAR_WIDTH;
|
|
40357
|
-
var numberOfTicksFittingIntoSpace = howManyTicksFitInWidth(lineChartRepresentation.x.ticks || [], width, averageCharacterWidth);
|
|
40358
|
-
|
|
40359
|
-
// @ts-ignore
|
|
40360
|
-
lineChartRepresentation.x.ticks = pickEquallySpaced(lineChartRepresentation.x.ticks, numberOfTicksFittingIntoSpace);
|
|
40361
|
-
return lineChartRepresentation;
|
|
40362
|
-
};
|
|
40363
40294
|
|
|
40364
|
-
var buildMargin = function buildMargin(
|
|
40365
|
-
var maxWidth = max(
|
|
40295
|
+
var buildMargin = function buildMargin(yTicks, showYAxisLabels, hasYAxisTitle, hasXAxisTitle) {
|
|
40296
|
+
var maxWidth = max(yTicks.map(function (tick) {
|
|
40366
40297
|
return (tick.formattedValue || '').length * ASSUMED_AVERAGE_CHAR_WIDTH;
|
|
40367
40298
|
}));
|
|
40368
|
-
var showYTicks = showYAxisLabels &&
|
|
40299
|
+
var showYTicks = showYAxisLabels && yTicks.length > 0;
|
|
40369
40300
|
var MINIMUM_Y_AXIS_WIDTH = 40;
|
|
40370
|
-
var hasYAxisTitle = !!chart.y.title;
|
|
40371
|
-
var hasXAxisTitle = !!chart.x.title;
|
|
40372
40301
|
var yAxisTitleOffset = hasYAxisTitle ? 40 : 0;
|
|
40373
40302
|
var xAxisTitleOffset = hasXAxisTitle ? 40 : 0;
|
|
40374
40303
|
var left = showYTicks ? max([maxWidth, MINIMUM_Y_AXIS_WIDTH]) : MINIMUM_Y_AXIS_WIDTH;
|
|
@@ -40415,7 +40344,7 @@ var LineChart$5 = function LineChart(_ref) {
|
|
|
40415
40344
|
tooltipData = _useTooltip.tooltipData,
|
|
40416
40345
|
hideTooltip = _useTooltip.hideTooltip,
|
|
40417
40346
|
showTooltip = _useTooltip.showTooltip;
|
|
40418
|
-
var margin = buildMargin(chart, options.axis.showYAxisLabels);
|
|
40347
|
+
var margin = buildMargin(chart.y.ticks, options.axis.showYAxisLabels, chart.y.title != null, chart.x.title != null);
|
|
40419
40348
|
var _useState = useState(chart.lines.map(function (legendItem) {
|
|
40420
40349
|
return legendItem.yKey;
|
|
40421
40350
|
})),
|
|
@@ -40505,7 +40434,8 @@ var LineChart$5 = function LineChart(_ref) {
|
|
|
40505
40434
|
xScaleKey: xScaleKey,
|
|
40506
40435
|
xScaleDataType: xScaleDataType,
|
|
40507
40436
|
xOrdering: chart.x.scale.ordering,
|
|
40508
|
-
xScale: xScale
|
|
40437
|
+
xScale: xScale,
|
|
40438
|
+
chartType: 'lines'
|
|
40509
40439
|
});
|
|
40510
40440
|
showTooltip({
|
|
40511
40441
|
tooltipLeft: tooltipData == null ? void 0 : tooltipData.tooltipLeft,
|
|
@@ -41568,6 +41498,62 @@ var buildLineChartRepresentation = function buildLineChartRepresentation(_ref) {
|
|
|
41568
41498
|
return chart;
|
|
41569
41499
|
};
|
|
41570
41500
|
|
|
41501
|
+
var ASSUMED_AVERAGE_CHAR_WIDTH$1 = 8.8;
|
|
41502
|
+
function calculateWordWidth(word, avgCharWidth) {
|
|
41503
|
+
if (avgCharWidth === void 0) {
|
|
41504
|
+
avgCharWidth = ASSUMED_AVERAGE_CHAR_WIDTH$1;
|
|
41505
|
+
}
|
|
41506
|
+
return word.length * avgCharWidth;
|
|
41507
|
+
}
|
|
41508
|
+
|
|
41509
|
+
/** Reduce width proportionally to simulate spacing / padding between ticks. */
|
|
41510
|
+
var widthWithSpacing = function widthWithSpacing(width) {
|
|
41511
|
+
var THIRTY_PERCENT = 0.3;
|
|
41512
|
+
return width - width * THIRTY_PERCENT;
|
|
41513
|
+
};
|
|
41514
|
+
function howManyTicksFitInWidth(ticks, maxWidth, avgCharWidth) {
|
|
41515
|
+
if (avgCharWidth === void 0) {
|
|
41516
|
+
avgCharWidth = ASSUMED_AVERAGE_CHAR_WIDTH$1;
|
|
41517
|
+
}
|
|
41518
|
+
var fittedTicks = [];
|
|
41519
|
+
var currentWidth = 0;
|
|
41520
|
+
for (var _iterator = _createForOfIteratorHelperLoose(ticks), _step; !(_step = _iterator()).done;) {
|
|
41521
|
+
var tick = _step.value;
|
|
41522
|
+
var word = (tick == null ? void 0 : tick.formattedValue) || '';
|
|
41523
|
+
var wordWidth = calculateWordWidth(word, avgCharWidth);
|
|
41524
|
+
if (currentWidth + wordWidth <= widthWithSpacing(maxWidth)) {
|
|
41525
|
+
fittedTicks.push(tick);
|
|
41526
|
+
currentWidth += wordWidth + avgCharWidth; // Add space between words
|
|
41527
|
+
} else {
|
|
41528
|
+
break; // Stop if adding the word exceeds maxWidth
|
|
41529
|
+
}
|
|
41530
|
+
}
|
|
41531
|
+
return fittedTicks.length;
|
|
41532
|
+
}
|
|
41533
|
+
function pickEquallySpaced(arr, numPicks) {
|
|
41534
|
+
if (numPicks >= arr.length) {
|
|
41535
|
+
return arr; // If numPicks is greater than or equal to the array length, return the whole array
|
|
41536
|
+
}
|
|
41537
|
+
var result = [];
|
|
41538
|
+
var interval = (arr.length - 1) / (numPicks - 1);
|
|
41539
|
+
for (var i = 0; i < numPicks; i++) {
|
|
41540
|
+
var index = Math.round(i * interval); // Calculate index and round it
|
|
41541
|
+
result.push(arr[index]);
|
|
41542
|
+
}
|
|
41543
|
+
return result;
|
|
41544
|
+
}
|
|
41545
|
+
var adjustTicks = function adjustTicks(lineChartRepresentation, width) {
|
|
41546
|
+
lineChartRepresentation = cloneDeep(lineChartRepresentation);
|
|
41547
|
+
|
|
41548
|
+
// TODO; take this from the theme override...
|
|
41549
|
+
var averageCharacterWidth = ASSUMED_AVERAGE_CHAR_WIDTH$1;
|
|
41550
|
+
var numberOfTicksFittingIntoSpace = howManyTicksFitInWidth(lineChartRepresentation.x.ticks || [], width, averageCharacterWidth);
|
|
41551
|
+
|
|
41552
|
+
// @ts-ignore
|
|
41553
|
+
lineChartRepresentation.x.ticks = pickEquallySpaced(lineChartRepresentation.x.ticks, numberOfTicksFittingIntoSpace);
|
|
41554
|
+
return lineChartRepresentation;
|
|
41555
|
+
};
|
|
41556
|
+
|
|
41571
41557
|
var LineChartV2View = function LineChartV2View(props) {
|
|
41572
41558
|
var _props$library, _props$attributes$vie;
|
|
41573
41559
|
var _useDashboardBehaviou = useDashboardBehaviourContext(),
|
|
@@ -43844,6 +43830,28 @@ function buildColumnWidth(datumKey, sizing, defaultColumnWidth, alternativeColum
|
|
|
43844
43830
|
return (_sizing$width = (_sizing = sizing[datumKey]) == null ? void 0 : _sizing.width) != null ? _sizing$width : defaultColumnWidth;
|
|
43845
43831
|
}
|
|
43846
43832
|
|
|
43833
|
+
function getFormattedByRule(_ref) {
|
|
43834
|
+
var type = _ref.type,
|
|
43835
|
+
value = _ref.value;
|
|
43836
|
+
var fontColor = pickBestTextColor(value != null ? value : '', ['white', 'black']);
|
|
43837
|
+
switch (type) {
|
|
43838
|
+
case 'fontColor':
|
|
43839
|
+
{
|
|
43840
|
+
return {
|
|
43841
|
+
color: value
|
|
43842
|
+
};
|
|
43843
|
+
}
|
|
43844
|
+
case 'backgroundColor':
|
|
43845
|
+
{
|
|
43846
|
+
return {
|
|
43847
|
+
backgroundColor: value,
|
|
43848
|
+
color: fontColor
|
|
43849
|
+
};
|
|
43850
|
+
}
|
|
43851
|
+
}
|
|
43852
|
+
return {};
|
|
43853
|
+
}
|
|
43854
|
+
|
|
43847
43855
|
var DataTableTR = function DataTableTR(props) {
|
|
43848
43856
|
var row = props.row,
|
|
43849
43857
|
rowIndex = props.rowIndex,
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
export declare const ASSUMED_AVERAGE_CHAR_WIDTH = 8.8;
|
|
@@ -0,0 +1,74 @@
|
|
|
1
|
+
import { Tick } from '../ChartsV2/types';
|
|
2
|
+
import { DataType } from '../Field/types';
|
|
3
|
+
export declare type KeyId = string;
|
|
4
|
+
export declare type Operator = string;
|
|
5
|
+
export declare type ConditionalFormattingRule = {
|
|
6
|
+
operator: Operator;
|
|
7
|
+
value: any;
|
|
8
|
+
color: string;
|
|
9
|
+
yKey: KeyId;
|
|
10
|
+
};
|
|
11
|
+
export declare type Axis<SupportedVizzlyDataTypes, AxisKeys> = {
|
|
12
|
+
ticks: Tick<SupportedVizzlyDataTypes>[];
|
|
13
|
+
scale: {
|
|
14
|
+
dataType: DataType;
|
|
15
|
+
key: KeyId | null;
|
|
16
|
+
ordering: 'asc' | 'desc' | null;
|
|
17
|
+
min: SupportedVizzlyDataTypes | null;
|
|
18
|
+
max: SupportedVizzlyDataTypes | null;
|
|
19
|
+
};
|
|
20
|
+
postfix: string;
|
|
21
|
+
prefix: string;
|
|
22
|
+
title: string | null;
|
|
23
|
+
} & AxisKeys;
|
|
24
|
+
export declare type LegendItemStyleLine = {
|
|
25
|
+
type: 'line';
|
|
26
|
+
strokeDasharray: string | number | null;
|
|
27
|
+
strokeWidth: number;
|
|
28
|
+
};
|
|
29
|
+
export declare type LegendItem = {
|
|
30
|
+
yKey: KeyId;
|
|
31
|
+
color: string;
|
|
32
|
+
style: LegendItemStyleLine;
|
|
33
|
+
};
|
|
34
|
+
export declare type Key = {
|
|
35
|
+
key: KeyId;
|
|
36
|
+
keyFormatted: string;
|
|
37
|
+
dataType: DataType;
|
|
38
|
+
};
|
|
39
|
+
export declare type BarChartRepresentation = {
|
|
40
|
+
keys: {
|
|
41
|
+
[key: KeyId]: Key;
|
|
42
|
+
};
|
|
43
|
+
x: Axis<Date | string | number, {
|
|
44
|
+
key: KeyId;
|
|
45
|
+
}>;
|
|
46
|
+
y: Axis<number, {
|
|
47
|
+
keys: KeyId[];
|
|
48
|
+
}>;
|
|
49
|
+
conditionalFormattingRules: ConditionalFormattingRule[];
|
|
50
|
+
goalLines: GoalLine[];
|
|
51
|
+
data: {
|
|
52
|
+
[keyId: string]: DataItem;
|
|
53
|
+
}[];
|
|
54
|
+
bars: LegendItem[];
|
|
55
|
+
};
|
|
56
|
+
export declare type DataItem = {
|
|
57
|
+
value: number | string | null;
|
|
58
|
+
formattedValue: string | null;
|
|
59
|
+
};
|
|
60
|
+
export declare type GoalLine = {
|
|
61
|
+
value: number;
|
|
62
|
+
formattedValue: string | null;
|
|
63
|
+
color: string;
|
|
64
|
+
strokeStyle?: 'dashed' | 'solid';
|
|
65
|
+
strokeWidth: number;
|
|
66
|
+
};
|
|
67
|
+
export declare type DateTimeFormatter = {
|
|
68
|
+
formatter: (date: Date) => string;
|
|
69
|
+
description: string;
|
|
70
|
+
};
|
|
71
|
+
export declare type NumberFormatter = {
|
|
72
|
+
formatter: (number: number | undefined | null, noValueReplacement?: string) => string;
|
|
73
|
+
description: string;
|
|
74
|
+
};
|
|
@@ -0,0 +1,7 @@
|
|
|
1
|
+
import { QueryAttributes } from '../QueryAttributes/types';
|
|
2
|
+
export declare type ComparisonFilter = {
|
|
3
|
+
op: QueryAttributes.Operator;
|
|
4
|
+
value: QueryAttributes.Filter['value'];
|
|
5
|
+
};
|
|
6
|
+
export declare const compare: (filter: ComparisonFilter, recordValue: unknown) => any;
|
|
7
|
+
export declare const conditionIsMet: (filter: ComparisonFilter, value: number | string | boolean) => boolean;
|
|
@@ -1,7 +1,8 @@
|
|
|
1
|
-
import { KeyId,
|
|
1
|
+
import { KeyId, GoalLine } from './types';
|
|
2
2
|
import { QueryAttributes } from '../QueryAttributes/types';
|
|
3
3
|
import { DataType } from '../Field/types';
|
|
4
4
|
import { FormattedResult } from '../Result/types';
|
|
5
|
+
import { Tick } from '../ChartsV2/types';
|
|
5
6
|
declare type FormattingFunction = (value: any, nullValueAlias?: string) => string;
|
|
6
7
|
interface getScaleAndTicksArgs {
|
|
7
8
|
data: FormattedResult['contentMapped'];
|
|
@@ -1,3 +1,4 @@
|
|
|
1
|
+
import { Tick } from '../ChartsV2/types';
|
|
1
2
|
import { DataType } from '../Field/types';
|
|
2
3
|
export declare type KeyId = string;
|
|
3
4
|
export declare type Operator = string;
|
|
@@ -35,11 +36,6 @@ export declare type Key = {
|
|
|
35
36
|
keyFormatted: string;
|
|
36
37
|
dataType: DataType;
|
|
37
38
|
};
|
|
38
|
-
export declare type Tick<DataType> = {
|
|
39
|
-
value: DataType;
|
|
40
|
-
formattedValue: string | null;
|
|
41
|
-
scaleValue: DataType | null;
|
|
42
|
-
};
|
|
43
39
|
export declare type LineChartRepresentation = {
|
|
44
40
|
keys: {
|
|
45
41
|
[key: KeyId]: Key;
|
|
@@ -6,6 +6,7 @@ import { DashboardBehaviour, LabelFormat } from '../contexts/DashboardBehaviour/
|
|
|
6
6
|
import { ConditionalFormattingOption } from '../../../charts/src/Legend/Legend';
|
|
7
7
|
import { ConditionalFormattingBoundary } from './DataTable/buildConditionalFormattingBoundaries';
|
|
8
8
|
import { TextOverride } from '../../../shared-logic/src/Translations/types';
|
|
9
|
+
import * as ConditionalFormatting from '../../../shared-logic/src/ConditionalFormatting/utils';
|
|
9
10
|
export declare type AxisLabelConfig = {
|
|
10
11
|
prefix?: string;
|
|
11
12
|
postfix?: string;
|