oolib 2.213.5 → 2.214.1

package/dist/components/LoadersAndProgress/ProgressBar/index.d.ts

@@ -11,7 +11,7 @@ export interface ProgressBarProps {
  * @component Renders a progress bar component with customizable text and styling.
  *
  * - The props object containing the following properties:
- * @prop {number} progress: The progress of the bar.
+ * @prop {number} progress: The progress of the bar as a percentage between 0-100.
  * @prop {string} text: The text to be displayed next to the progress bar.
  * @prop {React.ReactNode} children: The content to be rendered inside the progress bar.
  * @prop {boolean} isBlock: A boolean indicating whether the progress bar should be displayed as a block element. Defaults to true.

package/dist/components/LoadersAndProgress/ProgressBar/index.js

@@ -11,7 +11,7 @@ var styled_1 = require("../styled");
  * @component Renders a progress bar component with customizable text and styling.
  *
  * - The props object containing the following properties:
- * @prop {number} progress: The progress of the bar.
+ * @prop {number} progress: The progress of the bar as a percentage between 0-100.
  * @prop {string} text: The text to be displayed next to the progress bar.
  * @prop {React.ReactNode} children: The content to be rendered inside the progress bar.
  * @prop {boolean} isBlock: A boolean indicating whether the progress bar should be displayed as a block element. Defaults to true.

package/dist/index.d.ts

@@ -68,11 +68,6 @@ export { TabBarStyle1 as TabBarV2 } from "./v2/components/TabBar";
 export { default as MetaBlockV2 } from "./v2/components/MetaBlock";
 export { DateRangePicker as DateRangePickerV2 } from "./v2/components/DateRangePicker";
 export { HomeCover as HomeCoverV2 } from "./v2/components/HomeCover";
-export { BarChart } from "./v2/components/dataviz/BarChart";
-export { PieChart } from "./v2/components/dataviz/PieChart";
-export { HeatMapGrid } from "./v2/components/dataviz/HeatMapGrid";
-export { BarGraphCollection } from "./v2/components/dataviz/BarGraphCollection";
-export { DataVizAccordion } from "./v2/components/DataVizAccordion";
 export { Accordion as AccordionV2 } from "./v2/components/Accordion";
 export { CheckboxList } from "./v2/components/RadioAndCheckbox/comps/CheckboxList";
 export { CheckboxInput } from "./v2/components/RadioAndCheckbox/comps/CheckboxList/comps/CheckboxInput";
@@ -80,7 +75,6 @@ export { CheckboxButton } from "./v2/components/RadioAndCheckbox/comps/CheckboxL
 export { RadioList } from "./v2/components/RadioAndCheckbox/comps/RadioList/index";
 export { List } from "./v2/components/List";
 export { ListItem } from "./v2/components/List/comps/ListItem";
-export { default as CustomTooltip } from "./v2/components/dataviz/BarChart/comps/CustomTooltip";
 export * as baseStyling from "./v2/themes/utils/baseStyling";
 export { LoaderCircle, ProgressBar, LoaderCircle as Loader, LoaderOverlay } from "./components/LoadersAndProgress";
 export { TagClear, TagLink, TagSelect, TagDisplay } from "./components/Tags";

package/dist/index.js

@@ -40,8 +40,8 @@ var __importDefault = (this && this.__importDefault) || function (mod) {
 };
 Object.defineProperty(exports, "__esModule", { value: true });
 exports.BannerContext = exports.BannerInfo = exports.BannerAlert = exports.GroupQuestionsInputSingle = exports.ResourceInput = exports.IFrameInput = exports.PDFInput = exports.AudioInput = exports.VideoInput = exports.ProfileImageInput = exports.ImageInput = exports.MetaBlock = exports.parseCardConfig = exports.ListProfile = exports.CardProfile = exports.CardEmbed = exports.DateTimeRangePicker = exports.DateTimePicker = exports.TimeRangePicker = exports.TimePicker = exports.DateRangePicker = exports.DatePicker = exports.TextLoader = exports.PageScrollIndicator = exports.HomeCover = exports.EmptyStates = exports.ModalSmall = exports.Modal = exports.ModalForms = exports.ModalConfirm = exports.SkeletonLoader = exports.Divider = exports.PercentCompletedPie = exports.Accordion = exports.ActionMenu = exports.Tooltip = exports.OKELink = exports.UserRoleBadge = exports.Section = exports.TagDisplay = exports.TagSelect = exports.TagLink = exports.TagClear = exports.LoaderOverlay = exports.Loader = exports.ProgressBar = exports.LoaderCircle = exports.icons = exports.colors = exports.GlobalStyles = void 0;
-exports.RadioInput = exports.RadioList = exports.CheckboxButton = exports.CheckboxInput = exports.CheckboxList = exports.AccordionV2 = exports.DataVizAccordion = exports.BarGraphCollection = exports.HeatMapGrid = exports.PieChart = exports.BarChart = exports.HomeCoverV2 = exports.DateRangePickerV2 = exports.MetaBlockV2 = exports.typoV2_CSS = exports.colors2 = exports.TabBarV2 = exports.ButtonUpload = exports.ButtonGhostCompact = exports.ButtonTertiaryCompact = exports.ButtonSecondaryCompact = exports.ButtonPrimaryCompact = exports.ButtonGhostV2 = exports.ButtonTertiaryV2 = exports.ButtonSecondaryV2 = exports.ButtonPrimaryV2 = exports.TagClearV2 = exports.TagLinkV2 = exports.TagDisplayV2 = exports.generateOptions = exports.genTagComp = exports.OptionsSingle = exports.DropdownMulti = exports.DropdownSingle = exports.HintsProvider = exports.BlockLabel = exports.ListContent = exports.CardContent = exports.URLInput = exports.PasswordInput = exports.PhoneInput = exports.NumberInput = exports.EmailInput = exports.TextInput = exports.TableCellResizerPlugin = exports.styledOKELinkCSS = exports.SimpleTable = exports.ModalConfirmAction = exports.BannerProvider = exports.useBannerContext = void 0;
-exports.baseStyling = exports.CustomTooltip = exports.ListItem = exports.List = exports.SwitchDouble = exports.SwitchSingle = exports.RadioButton = void 0;
+exports.ListItem = exports.List = exports.SwitchDouble = exports.SwitchSingle = exports.RadioButton = exports.RadioInput = exports.RadioList = exports.CheckboxButton = exports.CheckboxInput = exports.CheckboxList = exports.AccordionV2 = exports.HomeCoverV2 = exports.DateRangePickerV2 = exports.MetaBlockV2 = exports.typoV2_CSS = exports.colors2 = exports.TabBarV2 = exports.ButtonUpload = exports.ButtonGhostCompact = exports.ButtonTertiaryCompact = exports.ButtonSecondaryCompact = exports.ButtonPrimaryCompact = exports.ButtonGhostV2 = exports.ButtonTertiaryV2 = exports.ButtonSecondaryV2 = exports.ButtonPrimaryV2 = exports.TagClearV2 = exports.TagLinkV2 = exports.TagDisplayV2 = exports.generateOptions = exports.genTagComp = exports.OptionsSingle = exports.DropdownMulti = exports.DropdownSingle = exports.HintsProvider = exports.BlockLabel = exports.ListContent = exports.CardContent = exports.URLInput = exports.PasswordInput = exports.PhoneInput = exports.NumberInput = exports.EmailInput = exports.TextInput = exports.TableCellResizerPlugin = exports.styledOKELinkCSS = exports.SimpleTable = exports.ModalConfirmAction = exports.BannerProvider = exports.useBannerContext = void 0;
+exports.baseStyling = void 0;
 //css and styling related ( styled-components )
 var globalStyles_1 = require("./globalStyles");
 Object.defineProperty(exports, "GlobalStyles", { enumerable: true, get: function () { return globalStyles_1.GlobalStyles; } });
@@ -226,16 +226,6 @@ Object.defineProperty(exports, "DateRangePickerV2", { enumerable: true, get: fun
 var HomeCover_2 = require("./v2/components/HomeCover");
 Object.defineProperty(exports, "HomeCoverV2", { enumerable: true, get: function () { return HomeCover_2.HomeCover; } });
 //V2 data viz comps
-var BarChart_1 = require("./v2/components/dataviz/BarChart");
-Object.defineProperty(exports, "BarChart", { enumerable: true, get: function () { return BarChart_1.BarChart; } });
-var PieChart_1 = require("./v2/components/dataviz/PieChart");
-Object.defineProperty(exports, "PieChart", { enumerable: true, get: function () { return PieChart_1.PieChart; } });
-var HeatMapGrid_1 = require("./v2/components/dataviz/HeatMapGrid");
-Object.defineProperty(exports, "HeatMapGrid", { enumerable: true, get: function () { return HeatMapGrid_1.HeatMapGrid; } });
-var BarGraphCollection_1 = require("./v2/components/dataviz/BarGraphCollection");
-Object.defineProperty(exports, "BarGraphCollection", { enumerable: true, get: function () { return BarGraphCollection_1.BarGraphCollection; } });
-var DataVizAccordion_1 = require("./v2/components/DataVizAccordion");
-Object.defineProperty(exports, "DataVizAccordion", { enumerable: true, get: function () { return DataVizAccordion_1.DataVizAccordion; } });
 var Accordion_2 = require("./v2/components/Accordion");
 Object.defineProperty(exports, "AccordionV2", { enumerable: true, get: function () { return Accordion_2.Accordion; } });
 var CheckboxList_1 = require("./v2/components/RadioAndCheckbox/comps/CheckboxList");
@@ -257,6 +247,4 @@ var List_1 = require("./v2/components/List");
 Object.defineProperty(exports, "List", { enumerable: true, get: function () { return List_1.List; } });
 var ListItem_1 = require("./v2/components/List/comps/ListItem");
 Object.defineProperty(exports, "ListItem", { enumerable: true, get: function () { return ListItem_1.ListItem; } });
-var CustomTooltip_1 = require("./v2/components/dataviz/BarChart/comps/CustomTooltip");
-Object.defineProperty(exports, "CustomTooltip", { enumerable: true, get: function () { return __importDefault(CustomTooltip_1).default; } });
 exports.baseStyling = __importStar(require("./v2/themes/utils/baseStyling"));

package/dist/stories/v2/components/Accordion.stories.js

@@ -5,7 +5,6 @@ var __importDefault = (this && this.__importDefault) || function (mod) {
 Object.defineProperty(exports, "__esModule", { value: true });
 exports.BarChart = void 0;
 var react_1 = __importDefault(require("react"));
-var BarChart_1 = require("../../../v2/components/dataviz/BarChart");
 var Accordion_1 = require("../../../v2/components/Accordion");
 // import BarChartDocs from './BarChart.mdx'
 exports.default = {

package/dist/v2/components/Buttons/index.js

@@ -79,8 +79,10 @@ var ButtonStyledWrapper = function (_a) {
         : (M && 'M') || 'S'; // this size logic dont have design defination yet, default size is "S"
     var calcIconSize = function () {
         var thisSize = iconSize || size;
-        return typeof thisSize === 'number' ? thisSize : (thisSize === 'S' && responsive_) ? 18 : (thisSize === 'S' && !responsive_) ? 16 : 20;
+        console.log({ thisSize: thisSize, variant: variant });
+        return typeof thisSize === 'number' ? thisSize : (thisSize === 'S' && responsive_) ? 18 : (thisSize === 'S' && !responsive_) ? 16 : 16;
     };
+    console.log({ iconSize: calcIconSize() });
     var iconColor = !disabled ? _iconColor : colors_1.colors.grey40;
     var DisplayTextTypo = Typos[typo] || Typo2_1.UI_BODY_SEMIBOLD_SM_DF;
     return (react_1.default.createElement(styled_1.ButtonStyled, { id: id, style: style, className: className, variant: variant, size: size, active: active, disabled: disabled, theme: theme, onMouseEnter: onMouseEnter, onMouseLeave: onMouseLeave, type: submit ? "submit" : "button", onClick: function (e) {

package/package.json

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

package/dist/stories/v2/components/DataVizAccordion.stories.d.ts

@@ -1,7 +0,0 @@
-declare namespace _default {
-    let title: string;
-    let parameters: {};
-}
-export default _default;
-export function DataVizAccordion(args: any): React.JSX.Element;
-import React from "react";

package/dist/stories/v2/components/DataVizAccordion.stories.js

@@ -1,141 +0,0 @@
-"use strict";
-var __importDefault = (this && this.__importDefault) || function (mod) {
-    return (mod && mod.__esModule) ? mod : { "default": mod };
-};
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.DataVizAccordion = void 0;
-var react_1 = __importDefault(require("react"));
-var DataVizAccordion_1 = require("../../../v2/components/DataVizAccordion");
-// import BarChartDocs from './BarChart.mdx'
-exports.default = {
-    title: "Oolib V 2.0/components/DataVizAccordion",
-    // argTypes: {
-    //   HeaderStyle: {
-    //     options: ["HeaderStyle1", "HeaderStyle2", "HeaderStyle3"],
-    //     control: { type: "inline-radio" },
-    //     defaultValue: "HeaderStyle1",
-    //   },
-    //   percent: {
-    //     control: { type: 'range', min: 1, max: 100, step: 1 },
-    //     defaultValue: 39,
-    //     table: {
-    //       category: 'HeaderStyle 2 Options',
-    //     },
-    //   },
-    //   infoTooltip: {
-    //     control: { type: 'text' },
-    //     defaultValue: '',
-    //     table: {
-    //       category: 'HeaderStyle 2 Options',
-    //     },
-    //   },
-    //   showPercent: {
-    //     table: {
-    //       category: 'HeaderStyle 2 Options',
-    //     },
-    //   },
-    // },
-    // args: {
-    //   // invert: false,
-    //   title: "This is the title",
-    //   label: "Label",
-    //   infoTooltip: '',
-    //   showPercent: true
-    // },
-    parameters: {
-    // docs: {
-    //   page: BarChartDocs,
-    // },
-    },
-};
-// Updated data for stacked bar chart
-var data = [
-    {
-        display: "Logged In Once",
-        stack1: 60,
-        stack2: 20,
-        stack3: 40,
-        stack4: 10,
-        stack5: 40,
-        stack6: 10,
-    },
-    {
-        display: "Registered Users",
-        stack1: 100,
-        stack2: 50,
-        stack3: 10,
-        stack4: 15,
-        stack5: 40,
-        stack6: 10,
-    },
-    {
-        display: "Created Profile",
-        stack1: 20,
-        stack2: 5,
-        stack3: 10,
-        stack4: 15,
-        stack5: 40,
-        stack6: 10,
-    },
-    {
-        display: "Wrote at least 3 story",
-        stack1: 8,
-        stack2: 2,
-        stack3: 1,
-        stack4: 1,
-        stack5: 40,
-        stack6: 10,
-    },
-    {
-        display: "Created Profile again",
-        stack1: 20,
-        stack2: 5,
-        stack3: 10,
-        stack4: 15,
-        stack5: 40,
-        stack6: 10,
-    },
-    {
-        display: "Wrote at least 1 story",
-        stack1: 8,
-        stack2: 2,
-        stack3: 1,
-        stack4: 1,
-        stack5: 40,
-        stack6: 10,
-    },
-];
-var DataVizAccordion = function (args) {
-    var colors = ["#5C80FF", "#FFA800", "#00BC8F", "#5C51CE"];
-    var handleBarClick = function (name) {
-        console.log("Bar clicked: ".concat(name));
-    };
-    return (react_1.default.createElement("div", { style: { display: "flex", flexDirection: "column", gap: "5rem" } },
-        react_1.default.createElement(DataVizAccordion_1.DataVizAccordion, { chartOptions: [
-                {
-                    display: "Stacked Bar Chart",
-                    comp: "BarChart",
-                    props: { breakdownDisplayType: "stacked" },
-                },
-                {
-                    display: "Grouped Bar Chart",
-                    comp: "BarChart",
-                    props: { breakdownDisplayType: "grouped" },
-                },
-            ], data: data, plotDataPoint: "percentage" // This can be changed to count
-            , valuePath: ["stack1", "stack2", "stack3", "stack4", "stack5", "stack6"], 
-            // valuePath="stack1"
-            labelPath: "display", title: "This is a Stacked BarChart", onClick: handleBarClick, showPercent: true, colorIdx: 0 }),
-        react_1.default.createElement(DataVizAccordion_1.DataVizAccordion, { chartOptions: [
-                {
-                    display: "Bar Chart",
-                    comp: "BarChart",
-                },
-                {
-                    display: "Pie Chart",
-                    comp: "PieChart",
-                },
-            ], data: data, plotDataPoint: "percentage" // This can be changed to count
-            , valuePath: "stack1", labelPath: "display", title: "This is a Stacked BarChart", onClick: handleBarClick, showPercent: true, colorIdx: 0 })));
-};
-exports.DataVizAccordion = DataVizAccordion;

package/dist/stories/v2/components/visualization/BarChart.stories.d.ts

@@ -1,23 +0,0 @@
-declare namespace _default {
-    let title: string;
-    namespace argTypes {
-        namespace showPercent {
-            let control: string;
-            let description: string;
-            let defaultValue: boolean;
-        }
-    }
-    namespace args {
-        let showPercent_1: boolean;
-        export { showPercent_1 as showPercent };
-    }
-    namespace parameters {
-        namespace docs {
-            export { BarChartDocs as page };
-        }
-    }
-}
-export default _default;
-export function _BarChart(args: any): React.JSX.Element;
-import BarChartDocs from './BarChart.mdx';
-import React from "react";

package/dist/stories/v2/components/visualization/BarChart.stories.js

@@ -1,251 +0,0 @@
-"use strict";
-var __importDefault = (this && this.__importDefault) || function (mod) {
-    return (mod && mod.__esModule) ? mod : { "default": mod };
-};
-Object.defineProperty(exports, "__esModule", { value: true });
-exports._BarChart = void 0;
-var react_1 = __importDefault(require("react"));
-var BarChart_mdx_1 = __importDefault(require("./BarChart.mdx"));
-var BarChart_1 = require("../../../../v2/components/dataviz/BarChart");
-exports.default = {
-    title: "Oolib V 2.0/Visualization/BarChart",
-    argTypes: {
-        showPercent: {
-            control: 'boolean',
-            description: 'Toggle percentage display',
-            defaultValue: true,
-        }
-    },
-    args: {
-        showPercent: true,
-    },
-    parameters: {
-        docs: {
-            page: BarChart_mdx_1.default,
-        },
-    },
-};
-// Updated data for stacked bar chart
-var data = [
-    { display: "Logged In Once", stack1: 60, stack2: 20, stack3: 40 },
-    { display: "Registered Users", stack1: 100, stack2: 50 },
-    { display: "Created Profile", stack1: 20, stack2: 5, stack3: 10, stack4: 15 },
-    { display: "Wrote at least 1 story", stack1: 8, stack2: 2 },
-];
-var _BarChart = function (args) {
-    var colors = ["#5C80FF", "#FFA800", "#00BC8F", "#5C51CE"];
-    var handleBarClick = function (name) {
-        console.log("Bar clicked: ".concat(name));
-    };
-    return (react_1.default.createElement("div", { style: { display: "grid", gridTemplateColumns: "1fr 1fr", gap: "20px", padding: '20px' } },
-        react_1.default.createElement("div", { style: { border: '1px solid black', padding: '10px' } },
-            react_1.default.createElement(BarChart_1.BarChart, { overflowAfterHeight: 300, showPercent: args.showPercent, data: [
-                    {
-                        display: "Logged In Once",
-                        stack1: 0, stack2: 23, stack3: 67, stack4: 12, stack5: 89,
-                        stack6: 34, stack7: 56, stack8: 78, stack9: 21, stack10: 43,
-                        stack11: 65, stack12: 87, stack13: 32, stack14: 54, stack15: 76,
-                        stack16: 19, stack17: 41, stack18: 63, stack19: 85, stack20: 28,
-                        stack2Display: 'Labels Path Stack 2 Display'
-                    },
-                    {
-                        display: "Registered Users",
-                        stack1: 0, stack3: 71, stack4: 25, stack5: 84,
-                        stack6: 47, stack7: 69, stack8: 13, stack9: 56, stack10: 91,
-                        stack11: 29, stack12: 73, stack13: 46, stack14: 82, stack15: 17,
-                        stack16: 64, stack17: 39, stack18: 75, stack19: 22, stack20: 58
-                    },
-                    {
-                        display: "Created Profile",
-                        stack1: 33, stack2: 77, stack3: 14, stack4: 59, stack5: 86,
-                        stack6: 31, stack7: 68, stack8: 42, stack9: 95, stack10: 26,
-                        stack11: 71, stack12: 48, stack13: 83, stack14: 16, stack15: 62,
-                        stack16: 37, stack17: 74, stack18: 29, stack19: 85, stack20: 51
-                    },
-                    {
-                        display: "Wrote at least 3 story",
-                        stack1: 18, stack2: 52, stack3: 79, stack4: 35, stack5: 61,
-                        stack6: 93, stack7: 24, stack8: 67, stack9: 41, stack10: 88,
-                        stack11: 15, stack12: 53, stack13: 76, stack14: 32, stack15: 68,
-                        stack16: 94, stack17: 27, stack18: 49, stack19: 81, stack20: 36
-                    },
-                    {
-                        display: "Created Profile again",
-                        stack1: 44, stack2: 87, stack3: 21, stack4: 63, stack5: 96,
-                        stack6: 38, stack7: 72, stack8: 55, stack9: 19, stack10: 81,
-                        stack11: 46, stack12: 92, stack13: 28, stack14: 65, stack15: 37,
-                        stack16: 74, stack17: 51, stack18: 83, stack19: 26, stack20: 69
-                    },
-                    {
-                        display: "Wrote at least 1 story",
-                        stack1: 57, stack2: 23, stack3: 89, stack4: 41, stack5: 76,
-                        stack6: 12, stack7: 64, stack8: 98, stack9: 33, stack10: 78,
-                        stack11: 55, stack12: 17, stack13: 91, stack14: 48, stack15: 82,
-                        stack16: 26, stack17: 69, stack18: 43, stack19: 95, stack20: 31
-                    }
-                ], plotDataPoint: "percentage", valuePath: [
-                    "stack1", "stack2", "stack3", "stack4", "stack5",
-                    // "stack6", "stack7", "stack8", "stack9", "stack10",
-                    // "stack11", "stack12", "stack13", "stack14", "stack15",
-                    // "stack16", "stack17", "stack18", "stack19", "stack20"
-                ], breakdownCategoryName: "Age of org.", tooltipLabelsMapping: {
-                    stack1: 'Stack 1', stack2: 'Stack 2', stack3: 'Stack 3', stack4: 'Stack 4', stack5: 'Stack 5',
-                    stack6: 'Stack 6', stack7: 'Stack 7', stack8: 'Stack 8', stack9: 'Stack 9', stack10: 'Stack 10',
-                    stack11: 'Stack 11', stack12: 'Stack 12', stack13: 'Stack 13', stack14: 'Stack 14', stack15: 'Stack 15',
-                    stack16: 'Stack 16', stack17: 'Stack 17', stack18: 'Stack 18', stack19: 'Stack 19', stack20: 'Stack 20'
-                }, labelPath: "display", title: "This is a Stacked BarChart with 20 Stacks", onClick: handleBarClick, colorIdx: 2 })),
-        react_1.default.createElement("div", { style: { border: '1px solid black', padding: '10px' } },
-            react_1.default.createElement(BarChart_1.BarChart, { data: [
-                    {
-                        display: "Logged In Once During the First Week of Registration and Completed the Basic Profile Section Without Abandoning the Process",
-                        stack1: 60
-                    },
-                    {
-                        display: "Registered Users Who Successfully Verified Their Email Address and Set Up Two-Factor Authentication for Enhanced Account Security",
-                        stack1: 100
-                    },
-                    {
-                        display: "Created Profile With All Recommended Fields Including Biography, Education History, Work Experience, and Personal Interests",
-                        stack1: 20
-                    },
-                    {
-                        display: "Wrote at least 3 stories With Over 2,000 Words Each and Received More Than 50 Positive Engagements from Other Community Members",
-                        stack1: 0
-                    },
-                    {
-                        display: "Created Profile again After Deleting Their Previous One Due to Privacy Concerns or Desire to Start Fresh with New Information",
-                        stack1: 20
-                    },
-                    {
-                        display: "Wrote at least 1 story That Was Featured on the Homepage and Remained in the Top Trending Section for More Than 48 Hours",
-                        stack1: 8
-                    },
-                    {
-                        display: "Completed Onboarding Including All Optional Tutorials and Achieved a Perfect Score on the Platform Knowledge Assessment Test",
-                        stack1: 78
-                    },
-                    {
-                        display: "Added Payment Method and Set Up Recurring Billing for Premium Subscription Without Encountering Any Technical Issues During Checkout",
-                        stack1: 42
-                    },
-                    {
-                        display: "Made First Purchase Within 24 Hours of Creating Their Account and Left a Five-Star Review for the Product or Service",
-                        stack1: 35
-                    },
-                    {
-                        display: "Referred a Friend Through the Official Referral Program and Both Received the Maximum Possible Bonus Credits as a Result",
-                        stack1: 27
-                    },
-                    {
-                        display: "Participated in the Annual User Satisfaction Survey and Provided Detailed Feedback on Potential Platform Improvements",
-                        stack1: 54
-                    },
-                    {
-                        display: "Downloaded the Mobile Application on Multiple Devices and Enabled Cross-Platform Synchronization for Seamless User Experience",
-                        stack1: 89
-                    },
-                    {
-                        display: "Configured Advanced Notification Preferences to Receive Real-Time Alerts for Specific Activities Relevant to Their Interests",
-                        stack1: 31
-                    },
-                    {
-                        display: "Successfully Recovered Account After Forgetting Password by Following the Secure Password Reset Protocol Without Support Assistance",
-                        stack1: 46
-                    },
-                    {
-                        display: "Achieved Gold Tier Status in the Loyalty Program by Consistently Engaging with the Platform for More Than Six Consecutive Months",
-                        stack1: 15
-                    },
-                    {
-                        display: "Converted From Free Trial to Paid Subscription Before the Trial Period Ended and Opted for the Annual Payment Plan with Auto-Renewal",
-                        stack1: 67
-                    },
-                    {
-                        display: "Customized Their Dashboard Layout to Optimize Workflow Efficiency Based on Their Unique Usage Patterns and Preferences",
-                        stack1: 72
-                    },
-                    {
-                        display: "Signed Up for Beta Testing Program and Provided Valuable Feedback on Experimental Features Before General Public Release",
-                        stack1: 19
-                    },
-                    {
-                        display: "Linked All Available Social Media Accounts to Enable Cross-Platform Sharing and Enhanced Social Networking Capabilities",
-                        stack1: 38
-                    },
-                    {
-                        display: "Reported a Critical Bug That Was Subsequently Fixed in the Next Software Update and Received Official Recognition for the Contribution",
-                        stack1: 5
-                    }
-                ], plotDataPoint: "percentage" // This can be changed to count
-                , 
-                // valuePath={["stack1", "stack2", "stack3", "stack4", "stack5", "stack6"]}
-                valuePath: "stack1", labelPath: "display", title: "This is a Stacked BarChart", onClick: handleBarClick, showPercent: args.showPercent, colorIdx: 2 })),
-        react_1.default.createElement("div", { style: { border: '1px solid black', padding: '10px' } },
-            react_1.default.createElement(BarChart_1.BarChart, { data: [
-                    {
-                        display: "Logged In Once",
-                        stack1: 60,
-                        stack2: 20,
-                        stack3: 40,
-                        stack4: 10,
-                        stack5: 40,
-                        stack6: 10,
-                    },
-                    {
-                        display: "Registered Users",
-                        stack1: 100,
-                        stack2: 50,
-                        stack3: 10,
-                        stack4: 15,
-                        stack5: 40,
-                        stack6: 10,
-                    },
-                    {
-                        display: "Created Profile",
-                        stack1: 20,
-                        stack2: 5,
-                        stack3: 10,
-                        stack4: 15,
-                        stack5: 40,
-                        stack6: 10,
-                    },
-                    {
-                        display: "Wrote at least 3 story",
-                        stack1: 8,
-                        stack2: 2,
-                        stack3: 1,
-                        stack4: 1,
-                        stack5: 40,
-                        stack6: 10,
-                    },
-                    {
-                        display: "Created Profile again",
-                        stack1: 20,
-                        stack2: 5,
-                        stack3: 10,
-                        stack4: 15,
-                        stack5: 40,
-                        stack6: 10,
-                    },
-                    {
-                        display: "Wrote at least 1 story",
-                        stack1: 8,
-                        stack2: 2,
-                        stack3: 1,
-                        stack4: 1,
-                        stack5: 40,
-                        stack6: 10,
-                    },
-                ], plotDataPoint: "percentage" // This can be changed to count
-                , valuePath: [
-                    "stack1",
-                    "stack2",
-                    "stack3",
-                    "stack4",
-                    "stack5",
-                    "stack6",
-                ], 
-                // valuePath="stack1"
-                breakdownDisplayType: "stacked", labelPath: "display", title: "This is a Stacked BarChart", onClick: handleBarClick, showPercent: args.showPercent, colorIdx: 2 }))));
-};
-exports._BarChart = _BarChart;

package/dist/stories/v2/components/visualization/BarGraphCollection.stories.d.ts

@@ -1,19 +0,0 @@
-declare namespace _default {
-    let title: string;
-    namespace argTypes {
-        namespace showPercent {
-            let name: string;
-            let control: string;
-            let description: string;
-            let defaultValue: boolean;
-        }
-    }
-    namespace args {
-        let showPercent_1: boolean;
-        export { showPercent_1 as showPercent };
-        export let debug: boolean;
-    }
-}
-export default _default;
-export function _BarGraphCollection_(args: any): React.JSX.Element;
-import React from "react";