sag_components 2.0.0-beta16 → 2.0.0-beta160

package/dist/types/icons/index.d.ts

@@ -0,0 +1,20 @@
+export { default as DownloadIcon } from './DownloadIcon';
+export { default as FilterIcon } from './FilterIcon';
+export { default as OptionsIcon } from './OptionsIcon';
+export { default as DocumentIcon } from './DocumentIcon';
+export { default as FlyIcon } from './FlyIcon';
+export { default as BellIcon } from './BellIcon';
+export { default as MaintenanceIcon } from './MaintenanceIcon';
+export { default as ExitIcon } from './ExitIcon';
+export { default as EyeIcon } from './EyeIcon';
+export { default as ButtonArrowRight } from './ButtonArrowRight';
+export { default as ReselectIcon } from './ReselectIcon';
+export { default as SearchIcon } from './SearchIcon';
+export { default as PlusIcon } from './PlusIcon';
+export { default as ArrowLeftIcon } from './ArrowLeftIcon';
+export { default as Plus } from './Plus';
+export { default as ArrowRightFullIcon } from './ArrowRightFullIcon';
+export { default as RedDot } from './RedDot';
+export { default as TrashIcon } from './TrashIcon';
+export { default as CalendarInOpen } from './CalendarInOpen';
+export { default as Calendar } from './Calendar';

package/dist/types/index.d.ts

@@ -21,3 +21,53 @@ export { default as TotalHorizontalCharts } from "./components/TotalHorizontalCh
 export { default as IconButton } from "./components/IconButton/IconButton.jsx";
 export { default as DoublePanelDataRow } from "./components/DoublePanelDataRow/DoublePanelDataRow.jsx";
 export { default as BarChart } from "./components/BarChart/BarChart.jsx";
+export { default as DoubleBarSingleLine } from "./components/DoubleBarSingleLine/DoubleBarSingleLine.jsx";
+export { default as AreaChart } from "./components/AreaChart/AreaChart.jsx";
+export { default as BreakdownPanel } from "./components/BreakdownPanel/BreakdownPanel.jsx";
+export { default as LinkButton } from "./components/LinkButton/LinkButton.jsx";
+export { default as BubbleChart } from "./components/BubbleChart/BubbleChart.jsx";
+export { default as BatteryChart } from "./components/BatteryChart/BatteryChart.jsx";
+export { default as PerformanceAnalyticsLegend } from "./components/PerformanceAnalyticsLegend/PerformanceAnalyticsLegend.jsx";
+export { default as BrushChart } from "./components/BrushChart/BrushChart.jsx";
+export { default as SingleBarLineCharts } from "./components/SingleBarLineCharts/SingleBarLineCharts.jsx";
+export { default as BarChartWithAreaChart } from "./components/BarChartWithAreaChart/BarChartWithAreaChart.jsx";
+export { default as BarChartTwoRows } from "./components/BarChartTwoRows/BarChartTwoRows.jsx";
+export { default as TwoBarCharts } from "./components/TwoBarCharts/TwoBarCharts.jsx";
+export { default as CollapseData } from "./components/CollapseData/CollapseData.jsx";
+export { default as InsightsCarousel } from "./components/InsightsCarousel/InsightsCarousel.jsx";
+export { default as DownloadProgress } from "./components/DownloadProgress/DownloadProgress.jsx";
+export { default as ModalWithOverlay } from "./components/ModalWithOverlay/ModalWithOverlay.jsx";
+export { default as DropdownNew } from "./components/DropdownNew/DropdownNew.jsx";
+export { default as WeeksPicker } from "./components/WeeksPicker/WeeksPicker.jsx";
+export { default as Input } from "./components/Input/Input.jsx";
+export { default as Tooltip } from "./components/Tooltip/Tooltip.jsx";
+export { default as ToggleSwitch } from "./components/ToggleSwitch/ToggleSwitch.jsx";
+export { default as ContainerTable } from "./components/ContainerTable/ContainerTable.jsx";
+export { default as MenuRoute } from "./components/MenuRoute/MenuRoute.jsx";
+export { default as Build } from "./components/MenuRoute/MenuIcons/Build.jsx";
+export { default as Track } from "./components/MenuRoute/MenuIcons/Track.jsx";
+export { default as Execute } from "./components/MenuRoute/MenuIcons/Execute.jsx";
+export { default as Dashboard } from "./components/MenuRoute/MenuIcons/Dashboard.jsx";
+export { default as Campaigns } from "./components/MenuRoute/MenuIcons/Campaigns.jsx";
+export { default as Budgets } from "./components/MenuRoute/MenuIcons/Budgets.jsx";
+export { default as SampleRunEngine } from "./components/MenuRoute/MenuIcons/SampleRunEngine.jsx";
+export { default as Coupons } from "./components/MenuRoute/MenuIcons/Coupons.jsx";
+export { default as RulesEngine } from "./components/MenuRoute/MenuIcons/RulesEngine.jsx";
+export { default as AdvancedThresholds } from "./components/MenuRoute/MenuIcons/AdvancedThresholds.jsx";
+export { default as PreTestWhatIf } from "./components/MenuRoute/MenuIcons/PreTestWhatIf.jsx";
+export { default as CustomerSegments } from "./components/MenuRoute/MenuIcons/CustomerSegments.jsx";
+export { default as GroupBuilder } from "./components/MenuRoute/MenuIcons/GroupBuilder.jsx";
+export { default as ItemsStores } from "./components/MenuRoute/MenuIcons/ItemsStores.jsx";
+export { default as Analytics } from "./components/MenuRoute/MenuIcons/Analytics.jsx";
+export { default as Table } from "./components/Table/Table.jsx";
+export { default as FilterPop } from "./components/Table/DropMenus/FilterPop.jsx";
+export { default as SortPop } from "./components/Table/DropMenus/SortPop.jsx";
+export { default as RangePop } from "./components/Table/DropMenus/RangePop.jsx";
+export { default as SearchInput } from "./components/SearchInput/SearchInput.jsx";
+export { default as ItemManagerPanel } from "./components/ItemManagerPanel/ItemManagerPanel.jsx";
+export { default as ModalDrawer } from "./components/ModalDrawer/ModalDrawer.jsx";
+export { default as OverlayDropdown } from "./components/OverlayDropdown/OverlayDropdown.jsx";
+export { default as MessageBox } from "./components/MessageBox/MessageBox.jsx";
+export { default as ToasterMessageBox } from "./components/ToasterMessageBox/ToasterMessageBox.jsx";
+export { default as QuickFilterCards } from "./components/QuickFilterCards/QuickFilterCards.jsx";
+export { default as RangePicker } from "./components/RangePicker/RangePicker.jsx";

package/dist/types/utils/CommonFunctions.d.ts

@@ -1,6 +1,11 @@
 export function getCurrencySign(currencyTypeToConvert: any, value: any): string;
+export function getMaxCharsPerLine(len: any): 20 | 15 | 10 | 5;
 export function getFormattedUnits(num: any): "" | "B" | "M" | "K";
-export function getFormattedValue(num: any): string | null;
+export function getFormattedValue(num: any, decimal?: boolean): string;
 export function formattedValue(num: any): any;
 export function getNumberWithCommas(x: any): any;
 export function isNumericValue(num: any): boolean;
+export function calculateTooltipOffset(text: any, isRegularCell?: boolean): {
+    offset: number;
+    height: number;
+};

package/package.json

@@ -1,8 +1,8 @@
 {
   "name": "sag_components",
-  "version": "2.0.0-beta16",
+  "version": "2.0.0-beta160",
   "description": "",
-  "main": "dist/index.js",
+  "main": "dist/index.cjs.js",
   "module": "dist/index.esm.js",
   "types": "dist/index.d.ts",
   "files": [
@@ -11,8 +11,10 @@
   "scripts": {
     "build": "tsc && rollup -c",
     "start": "vite dev --open",
-    "test": "jest",
+    "test": "jest --env=jsdom",
     "lint": "eslint . --fix",
+    "clean": "rimraf dist",
+    "build:full": "npm run clean && npm run build && npm link",
     "storybook": "storybook dev -p 6006",
     "build-storybook": "storybook build"
   },
@@ -20,34 +22,31 @@
   "author": "SAG",
   "license": "ISC",
   "devDependencies": {
-    "@babel/cli": "^7.24.5",
-    "@babel/plugin-proposal-private-property-in-object": "^7.21.11",
     "@babel/preset-env": "^7.24.5",
     "@babel/preset-react": "^7.24.1",
     "@babel/preset-typescript": "^7.24.1",
+    "@chromatic-com/storybook": "^3.2.5",
+    "@rollup/plugin-babel": "^6.0.3",
     "@rollup/plugin-commonjs": "^24.0.0",
+    "@rollup/plugin-json": "^6.1.0",
     "@rollup/plugin-node-resolve": "^13.0.6",
-    "@storybook/addon-designs": "^7.0.9",
-    "@storybook/addon-essentials": "^7.4.6",
-    "@storybook/addon-interactions": "^7.4.6",
-    "@storybook/addon-links": "^7.4.6",
-    "@storybook/addon-storysource": "^7.4.6",
-    "@storybook/addons": "^7.5.3",
-    "@storybook/blocks": "^7.4.6",
-    "@storybook/preset-scss": "^1.0.3",
-    "@storybook/react": "^7.4.6",
-    "@storybook/react-webpack5": "^7.4.6",
-    "@storybook/testing-library": "^0.2.2",
-    "@storybook/theming": "^7.5.3",
+    "@rollup/plugin-typescript": "^12.1.2",
+    "@rollup/plugin-url": "^8.0.2",
+    "@storybook/addon-designs": "^8.2.0",
+    "@storybook/addon-essentials": "^8.6.4",
+    "@storybook/addon-interactions": "^8.6.4",
+    "@storybook/addon-links": "^8.6.4",
+    "@storybook/addon-storysource": "^8.6.4",
+    "@storybook/addon-webpack5-compiler-babel": "^3.0.5",
+    "@storybook/blocks": "^8.6.4",
+    "@storybook/manager-api": "^8.6.4",
+    "@storybook/react": "^8.6.4",
+    "@storybook/react-webpack5": "^8.6.4",
+    "@storybook/theming": "^8.6.4",
     "@testing-library/jest-dom": "^6.4.5",
     "@testing-library/react": "^15.0.7",
-    "@types/node": "^22.13.4",
-    "@types/react": "^18.3.18",
-    "@types/rollup-plugin-peer-deps-external": "^2.2.5",
-    "@vitejs/plugin-react": "^4.3.4",
     "babel-plugin-react-css-modules": "^5.2.6",
-    "babel-preset-react-app": "^10.0.1",
-    "cross-env": "^7.0.3",
+    "chromatic": "^11.27.0",
     "css-loader": "^6.8.1",
     "eslint": "^8.56.0",
     "eslint-config-google": "^0.14.0",
@@ -56,41 +55,41 @@
     "eslint-plugin-jsx-a11y": "^6.8.0",
     "eslint-plugin-react": "^7.34.1",
     "eslint-plugin-react-hooks": "^4.6.2",
+    "eslint-plugin-storybook": "^0.11.4",
     "jest": "^29.7.0",
     "jest-environment-jsdom": "^29.7.0",
-    "react-dom": "^18.2.0",
+    "raw-loader": "^4.0.2",
+    "react-css-modules": "^4.7.11",
+    "react-dom": "^18.3.1",
+    "rimraf": "^6.0.1",
     "rollup": "^2.60.0",
+    "rollup-plugin-dts": "4.2.3",
     "rollup-plugin-peer-deps-external": "^2.2.3",
     "rollup-plugin-postcss": "^4.0.2",
-    "rollup-plugin-typescript2": "^0.31.2",
-    "rollup-plugin-dts": "4.2.3",
-    "@rollup/plugin-babel": "^6.0.3",
-    "sass": "^1.74.1",
-    "sass-loader": "^13.3.3",
+    "storybook": "^8.6.4",
     "style-loader": "^3.3.4",
-    "typescript": "^4.9.5",
-    "vite": "^6.1.0"
+    "vite": "^7.1.3"
+  },
+  "peerDependencies": {
+    "react": "^18.3.1",
+    "react-dom": "^18.3.1"
   },
   "dependencies": {
     "@emotion/react": "^11.11.4",
     "@emotion/styled": "^11.11.5",
-    "@mui/icons-material": "^5.15.16",
-    "@mui/material": "^5.15.16",
-    "@mui/x-date-pickers": "^6.18.6",
     "classnames": "^2.3.2",
-    "dayjs": "^1.11.10",
     "framer-motion": "^11.15.0",
+    "lottie-react": "^2.4.1",
     "moment": "^2.30.1",
     "prop-types": "^15.8.1",
-    "react": "^18.2.0",
+    "react": "^18.3.1",
     "react-ace": "^10.1.0",
-    "react-css-modules": "^4.7.11",
     "react-hook-form": "^7.46.2",
     "react-icons": "^5.0.1",
     "react-loading-skeleton": "^3.3.1",
     "recharts": "^2.15.0",
-    "storybook": "^7.4.6",
-    "styled-components": "^6.1.11"
+    "styled-components": "^6.1.15",
+    "typescript": "^4.9.5"
   },
   "browserslist": {
     "production": [
@@ -104,5 +103,9 @@
       "last 1 safari version"
     ]
   },
-  "packageManager": "yarn@1.22.22+sha512.a6b2f7906b721bba3d67d4aff083df04dad64c399707841b7acf00f6b133b7ac24255f2652fa22ae3534329dc6180534e98d17432037ff6fd140556e2bb3137e"
+  "jest": {
+    "setupFilesAfterEnv": [
+      "<rootDir>/setupTests.js"
+    ]
+  }
 }

package/dist/types/components/AutocompleteField/AutocompleteField.d.ts

@@ -1,15 +0,0 @@
-export default AutocompleteField;
-declare function AutocompleteField(props: any): import("react/jsx-runtime").JSX.Element;
-declare namespace AutocompleteField {
-    namespace propTypes {
-        const choices: PropTypes.Requireable<(string | null | undefined)[]>;
-        const onSelect: PropTypes.Requireable<(...args: any[]) => any>;
-    }
-    namespace defaultProps {
-        const choices_1: string[];
-        export { choices_1 as choices };
-        export function onSelect_1(): void;
-        export { onSelect_1 as onSelect };
-    }
-}
-import PropTypes from "prop-types";

package/dist/types/components/AutocompleteField/AutocompleteField.stories.d.ts

@@ -1,19 +0,0 @@
-declare namespace _default {
-    export const title: string;
-    export { AutocompleteField as component };
-    export namespace argTypes {
-        namespace choices {
-            const control: string;
-            const description: string;
-        }
-    }
-}
-export default _default;
-export function Default(args: any): import("react/jsx-runtime").JSX.Element;
-export namespace Default {
-    namespace args {
-        const choices_1: string[];
-        export { choices_1 as choices };
-    }
-}
-import AutocompleteField from "./AutocompleteField";

package/dist/types/components/AutocompleteField/AutocompleteField.style.d.ts

@@ -1,5 +0,0 @@
-export const AutocompleteContainer: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components").FastOmit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, never>> & string;
-export const AutocompleteInput: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components").FastOmit<import("react").DetailedHTMLProps<import("react").InputHTMLAttributes<HTMLInputElement>, HTMLInputElement>, never>> & string;
-export const AutocompleteLabel: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components").FastOmit<import("react").DetailedHTMLProps<import("react").LabelHTMLAttributes<HTMLLabelElement>, HTMLLabelElement>, never>> & string;
-export const AutocompleteOptions: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components").FastOmit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, never>> & string;
-export const AutocompleteOption: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components").FastOmit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, never>> & string;

package/dist/types/components/CampaignTool/CampaignDemoReport.stories.d.ts

@@ -1,64 +0,0 @@
-declare namespace _default {
-    export const title: string;
-    export { CampaignDemoReport as component };
-    export const tags: string[];
-    export namespace argTypes {
-        namespace topHeadline {
-            const name: string;
-            namespace control {
-                const type: string;
-            }
-            const defaultValue: string;
-        }
-        namespace topLabels {
-            const name_1: string;
-            export { name_1 as name };
-            export namespace control_1 {
-                const type_1: string;
-                export { type_1 as type };
-            }
-            export { control_1 as control };
-        }
-        namespace bottomHeadline {
-            const name_2: string;
-            export { name_2 as name };
-            export namespace control_2 {
-                const type_2: string;
-                export { type_2 as type };
-            }
-            export { control_2 as control };
-            const defaultValue_1: string;
-            export { defaultValue_1 as defaultValue };
-        }
-        namespace bottomLabels {
-            const name_3: string;
-            export { name_3 as name };
-            export namespace control_3 {
-                const type_3: string;
-                export { type_3 as type };
-            }
-            export { control_3 as control };
-        }
-    }
-}
-export default _default;
-export function Example(args: any): import("react/jsx-runtime").JSX.Element;
-export namespace Example {
-    namespace args {
-        const topHeadline_1: string;
-        export { topHeadline_1 as topHeadline };
-        const topLabels_1: {
-            icon: string;
-            value: string;
-        }[];
-        export { topLabels_1 as topLabels };
-        const bottomHeadline_1: string;
-        export { bottomHeadline_1 as bottomHeadline };
-        const bottomLabels_1: {
-            icon: string;
-            value: string;
-        }[];
-        export { bottomLabels_1 as bottomLabels };
-    }
-}
-import CampaignDemoReport from "./CampaignDemoReport";

package/dist/types/components/CampaignTool/MultipleCard.stories.d.ts

@@ -1,31 +0,0 @@
-declare namespace _default {
-    export const title: string;
-    export { MultipleCard as component };
-    export const tags: string[];
-    export namespace argTypes {
-        namespace width {
-            const name: string;
-            namespace control {
-                const type: string;
-            }
-            const description: string;
-        }
-        namespace height {
-            const name_1: string;
-            export { name_1 as name };
-            export namespace control_1 {
-                const type_1: string;
-                export { type_1 as type };
-            }
-            export { control_1 as control };
-            const description_1: string;
-            export { description_1 as description };
-        }
-    }
-}
-export default _default;
-export function CardsList(args: any): import("react/jsx-runtime").JSX.Element;
-export namespace CardsList {
-    const args: {};
-}
-import MultipleCard from "../CampaignTool/MultipleCard";

package/dist/types/components/CampaignTool/PageFilterBar.stories.d.ts

@@ -1,23 +0,0 @@
-declare namespace _default {
-    export const title: string;
-    export { PageFilterBar as component };
-    export namespace argTypes {
-        namespace pageHeadline {
-            const name: string;
-            namespace control {
-                const type: string;
-            }
-            const description: string;
-            const defaultValue: string;
-        }
-    }
-}
-export default _default;
-export function OffersPage(args: any): import("react/jsx-runtime").JSX.Element;
-export namespace OffersPage {
-    namespace args {
-        const pageHeadline_1: string;
-        export { pageHeadline_1 as pageHeadline };
-    }
-}
-import PageFilterBar from "../CampaignTool/PageFilterBar";

package/dist/types/components/CampaignTool/Popup.stories.d.ts

@@ -1,166 +0,0 @@
-declare namespace _default {
-    export const title: string;
-    export { Popup as component };
-    export const tags: string[];
-    export namespace argTypes {
-        export namespace title_1 {
-            const name: string;
-            namespace control {
-                const type: string;
-            }
-            const description: string;
-        }
-        export { title_1 as title };
-        export namespace isPopupOpen {
-            const name_1: string;
-            export { name_1 as name };
-            export namespace control_1 {
-                const type_1: string;
-                export { type_1 as type };
-            }
-            export { control_1 as control };
-            const description_1: string;
-            export { description_1 as description };
-        }
-        export namespace width {
-            const name_2: string;
-            export { name_2 as name };
-            export namespace control_2 {
-                const type_2: string;
-                export { type_2 as type };
-            }
-            export { control_2 as control };
-            const description_2: string;
-            export { description_2 as description };
-        }
-        export namespace height {
-            const name_3: string;
-            export { name_3 as name };
-            export namespace control_3 {
-                const type_3: string;
-                export { type_3 as type };
-            }
-            export { control_3 as control };
-            const description_3: string;
-            export { description_3 as description };
-        }
-        export namespace borderColor {
-            const name_4: string;
-            export { name_4 as name };
-            const description_4: string;
-            export { description_4 as description };
-            export namespace control_4 {
-                const type_4: string;
-                export { type_4 as type };
-                export const presetColors: string[];
-            }
-            export { control_4 as control };
-        }
-        export namespace subtitleTextColor {
-            const name_5: string;
-            export { name_5 as name };
-            const description_5: string;
-            export { description_5 as description };
-            export namespace control_5 {
-                const type_5: string;
-                export { type_5 as type };
-                const presetColors_1: string[];
-                export { presetColors_1 as presetColors };
-            }
-            export { control_5 as control };
-        }
-        export namespace onSaveClick {
-            const name_6: string;
-            export { name_6 as name };
-            export const action: string;
-            const description_6: string;
-            export { description_6 as description };
-        }
-        export namespace onCancelClick {
-            const name_7: string;
-            export { name_7 as name };
-            const action_1: string;
-            export { action_1 as action };
-            const description_7: string;
-            export { description_7 as description };
-        }
-        export namespace onChange {
-            const action_2: string;
-            export { action_2 as action };
-            const description_8: string;
-            export { description_8 as description };
-        }
-        export namespace popupItemsData {
-            const description_9: string;
-            export { description_9 as description };
-        }
-    }
-}
-export default _default;
-export function ExamplePopup(args: any): import("react/jsx-runtime").JSX.Element;
-export namespace ExamplePopup {
-    namespace args {
-        const title_2: string;
-        export { title_2 as title };
-        const isPopupOpen_1: boolean;
-        export { isPopupOpen_1 as isPopupOpen };
-        export { popupItemsData1 as popupItemsData };
-        const width_1: string;
-        export { width_1 as width };
-        const height_1: string;
-        export { height_1 as height };
-        const borderColor_1: string;
-        export { borderColor_1 as borderColor };
-        const subtitleTextColor_1: string;
-        export { subtitleTextColor_1 as subtitleTextColor };
-    }
-}
-import Popup from "../CampaignTool/Popup";
-declare const popupItemsData1: {
-    title: string;
-    rowsData: {
-        fieldsArray: ({
-            name: string;
-            label: string;
-            disabled: boolean;
-            required: boolean;
-            inputType: string;
-            showInfo: boolean;
-            infoText: string;
-            placeHolder: string;
-            dropdownOptions: {
-                value: number;
-                label: string;
-            }[];
-            dropdownDefaultValue: null;
-        } | {
-            name: string;
-            label: string;
-            disabled: boolean;
-            required: boolean;
-            inputType: string;
-            showInfo: boolean;
-            infoText: string;
-            placeHolder: string;
-            dropdownOptions: {
-                value: number;
-                label: string;
-            }[];
-            dropdownDefaultValue: {
-                value: number;
-                label: string;
-            };
-        } | {
-            name: string;
-            label: string;
-            disabled: boolean;
-            required: boolean;
-            inputType: string;
-            showInfo: boolean;
-            infoText: string;
-            placeHolder: string;
-            dropdownOptions: null;
-            dropdownDefaultValue: null;
-        })[];
-    }[];
-}[];

package/dist/types/components/CodeEditor/CodeEditor.style.d.ts

@@ -1,2 +0,0 @@
-export const AceEditorContent: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components").FastOmit<import("react-ace").IAceEditorProps & import("react").RefAttributes<AceEditor>, never>> & string & Omit<typeof AceEditor, keyof import("react").Component<any, {}, any>>;
-import AceEditor from "react-ace";

package/dist/types/components/Datepicker/Datepicker.d.ts

@@ -1,12 +0,0 @@
-export function Datepicker({ width, text, format, shape, onChange, value, disableClearable, disabled, labelColor, }: {
-    width?: string | undefined;
-    text: any;
-    format?: string | undefined;
-    shape: any;
-    onChange: any;
-    value: any;
-    disableClearable: any;
-    disabled?: boolean | undefined;
-    labelColor?: string | undefined;
-}): import("react/jsx-runtime").JSX.Element;
-export default Datepicker;