oolib 2.191.0 → 2.192.0

package/dist/v2/components/dataviz/BarGraphCollection/index.d.ts

@@ -1,7 +1,7 @@
 export const BAR_GRAPH_HEIGHT: 250;
 export const DEFAULT_SINGLE_BAR_WIDTH: 24;
 export const BAR_GAP: 0.3;
-export function BarGraphCollection({ data: originalData, valuePath, labelPath, tooltipLabelsMapping, onClick, showCount, showPercent, groupBy, }: {
+export function BarGraphCollection({ data: originalData, valuePath, labelPath, tooltipLabelsMapping, onClick, showCount, showPercent, groupBy, totalDataCount, }: {
     data: any;
     valuePath: any;
     labelPath?: string;
@@ -10,6 +10,7 @@ export function BarGraphCollection({ data: originalData, valuePath, labelPath, t
     showCount?: boolean;
     showPercent?: boolean;
     groupBy: any;
+    totalDataCount: any;
 }): React.JSX.Element;
 export function BarGraph({ tagCategory, index1, showCount, showPercent, onClick }: {
     tagCategory: any;

package/dist/v2/components/dataviz/BarGraphCollection/index.js

@@ -50,13 +50,15 @@ exports.BAR_GRAPH_HEIGHT = 250;
 exports.DEFAULT_SINGLE_BAR_WIDTH = 24;
 exports.BAR_GAP = 0.3;
 var BarGraphCollection = function (_a) {
-    var originalData = _a.data, valuePath = _a.valuePath, _b = _a.labelPath, labelPath = _b === void 0 ? "display" : _b, _c = _a.tooltipLabelsMapping, tooltipLabelsMapping = _c === void 0 ? {} : _c, onClick = _a.onClick, _d = _a.showCount, showCount = _d === void 0 ? true : _d, _e = _a.showPercent, showPercent = _e === void 0 ? true : _e, groupBy = _a.groupBy;
+    var originalData = _a.data, valuePath = _a.valuePath, _b = _a.labelPath, labelPath = _b === void 0 ? "display" : _b, _c = _a.tooltipLabelsMapping, tooltipLabelsMapping = _c === void 0 ? {} : _c, onClick = _a.onClick, _d = _a.showCount, showCount = _d === void 0 ? true : _d, _e = _a.showPercent, showPercent = _e === void 0 ? true : _e, groupBy = _a.groupBy, totalDataCount = _a.totalDataCount;
     var containerRef = (0, react_1.useRef)();
     var _f = (0, react_1.useState)(0), containerWidth = _f[0], setContainerWidth = _f[1];
+    var highestCount = originalData === null || originalData === void 0 ? void 0 : originalData.reduce(function (highest, item) { return item.value > highest ? item.value : highest; }, 0);
     var transformedData = (0, react_1.useMemo)(function () {
         return (0, usePrepareData_1.usePrepareData)({ data: originalData, valuePath: valuePath, labelPath: labelPath, tooltipLabelsMapping: tooltipLabelsMapping, groupBy: groupBy });
     }, [originalData, valuePath, labelPath, tooltipLabelsMapping, groupBy]);
-    var data = (0, useGetDimensions_1.useGetDimensions)(transformedData, exports.BAR_GRAPH_HEIGHT, containerWidth);
+    var data = (0, useGetDimensions_1.useGetDimensions)(transformedData, exports.BAR_GRAPH_HEIGHT, containerWidth, totalDataCount, highestCount);
+    //  console.log({ total: calculateTotalPercentage(data) })
     (0, react_1.useEffect)(function () {
         var handleResize = function () {
             var _a, _b;
@@ -157,3 +159,16 @@ var BarGraph = function (_a) {
     })));
 };
 exports.BarGraph = BarGraph;
+//   function calculateTotalPercentage(data) {
+//     let totalPercentage = 0;
+//     // Iterate through each category
+//     data.forEach(category => {
+//         // Sum all percentages within tagSpecificCount
+//         if (category.tagSpecificCount && Array.isArray(category.tagSpecificCount)) {
+//             category.tagSpecificCount.forEach(tag => {
+//                 totalPercentage += tag.percentage || 0;
+//             });
+//         }
+//     });
+//     return totalPercentage;
+// }

package/dist/v2/components/dataviz/BarGraphCollection/utils/useGetDimensions.d.ts

@@ -1 +1 @@
-export function useGetDimensions(data: any, maxHeight: any, containerWidth: any): any;
+export function useGetDimensions(data: any, maxHeight: any, containerWidth: any, totalDataCount: any, highestCount: any): any;

package/dist/v2/components/dataviz/BarGraphCollection/utils/useGetDimensions.js

@@ -14,7 +14,7 @@ Object.defineProperty(exports, "__esModule", { value: true });
 exports.useGetDimensions = void 0;
 var __1 = require("..");
 var styled_1 = require("../styled");
-var useGetDimensions = function (data, maxHeight, containerWidth) {
+var useGetDimensions = function (data, maxHeight, containerWidth, totalDataCount, highestCount) {
     var singleBarWidth;
     var totalBars = data === null || data === void 0 ? void 0 : data.reduce(function (total, tagCategory) {
         var _a;
@@ -25,6 +25,26 @@ var useGetDimensions = function (data, maxHeight, containerWidth) {
     // const defaultWidthForBars = (totalBars - 1) * DEFAULT_SINGLE_BAR_WIDTH - (CONTAINER_PADDING * 2);
     var dynamicBarWidth = availableWidthForBars / totalBars;
     singleBarWidth = Math.max(dynamicBarWidth, __1.DEFAULT_SINGLE_BAR_WIDTH);
+    // Calculate the ceiling value for the highest count
+    var getCeilingValue = function (num) {
+        if (num === 0)
+            return 10;
+        // Find the power of 10 (magnitude)
+        var magnitude = Math.pow(10, Math.floor(Math.log10(num)));
+        // Round up to the nearest "nice" number
+        var normalized = num / magnitude; // This gives us a number between 1-10
+        var multiplier;
+        if (normalized <= 1)
+            multiplier = 1;
+        else if (normalized <= 2)
+            multiplier = 2;
+        else if (normalized <= 5)
+            multiplier = 5;
+        else
+            multiplier = 10;
+        return multiplier * magnitude;
+    };
+    var ceilingValue = getCeilingValue(highestCount);
     return data === null || data === void 0 ? void 0 : data.map(function (category) {
         // total count for this category
         var total = category.tagSpecificCount.reduce(function (sum, tag) { return sum + tag.count; }, 0);
@@ -33,8 +53,12 @@ var useGetDimensions = function (data, maxHeight, containerWidth) {
         var categoryTotalWidth = (barsInCategory * singleBarWidth) + (gapsInCategory * Math.floor(__1.BAR_GAP * 10));
         // percentage to each tag
         return __assign(__assign({}, category), { width: categoryTotalWidth, tagSpecificCount: category.tagSpecificCount.map(function (tag) {
-                var percentage = Number((tag.count / total * 100).toFixed(1));
-                return __assign({ percentage: percentage, height: Math.round((percentage / 100) * maxHeight), width: singleBarWidth }, tag);
+                // Original percentage relative to total dataset
+                var percentage = Number((tag.count / (totalDataCount || total) * 100).toFixed(1));
+                // New height calculation relative to highest count and ceiling
+                // This creates a "zoomed in" effect where bars are more visible
+                var relativeHeight = Math.round((tag.count / ceilingValue) * maxHeight);
+                return __assign({ percentage: percentage, height: relativeHeight, width: singleBarWidth }, tag);
             }) });
     });
 };

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "oolib",
-  "version": "2.191.0",
+  "version": "2.192.0",
   "description": " OKE Component Library",
   "main": "dist/index.js",
   "types": "dist/index.d.ts",