impact-ui 4.0.1-alpha.21 → 4.0.1-alpha.22

package/dist/components/KeyboardShortCuts/index.js

@@ -10,6 +10,7 @@ import { Screen3 } from "./screen3.js";
 import { ShortcutLandingPage } from "./ShortcutLandingPage.js";
 import { TutorialModal } from "./tutorial.js";
 
+import { useTranslation } from "../../i18n/useTranslation.js";
 const SLIDE_DURATIONS = [4500, 8e3, 9e3];
 const TOTAL_SLIDES = SLIDE_DURATIONS.length;
 const KeyboardShortcuts = ({
@@ -27,6 +28,7 @@ const KeyboardShortcuts = ({
   onCloseAllSetBox = () => {
   }
 }) => {
+  const { t } = useTranslation();
   const [activeIndex, setActiveIndex] = useState(0);
   const [leftLandingOnce, setLeftLandingOnce] = useState(false);
   const [showKeyboardShortcuts, setShowKeyboardShortcuts] = useState(true);
@@ -100,14 +102,14 @@ const KeyboardShortcuts = ({
                   Badge,
                   {
                     color: "info",
-                    label: "New Feature",
+                    label: t("keyboardShortcuts.newFeature"),
                     size: isSmallScreen ? "small" : "default",
                     variant: "subtle"
                   }
                 ),
                 /* @__PURE__ */ jsxs("div", { className: "page-header-title-discription", children: [
-                  /* @__PURE__ */ jsx("span", { className: "page-header-title", children: "Keyboard Shortcuts" }),
-                  /* @__PURE__ */ jsx("span", { className: "page-header-description", children: "Key combinations that help you work faster without a mouse." })
+                  /* @__PURE__ */ jsx("span", { className: "page-header-title", children: t("keyboardShortcuts.title") }),
+                  /* @__PURE__ */ jsx("span", { className: "page-header-description", children: t("keyboardShortcuts.description") })
                 ] })
               ]
             }
@@ -141,7 +143,7 @@ const KeyboardShortcuts = ({
                       onRemindMeLater();
                       setShowKeyboardShortcuts(false);
                     },
-                    children: "Remind Me Later"
+                    children: t("keyboardShortcuts.remindMeLater")
                   }
                 ),
                 /* @__PURE__ */ jsx(
@@ -152,7 +154,7 @@ const KeyboardShortcuts = ({
                       setShowLandingPageScreen(false);
                       setShowTutorialModal(true);
                     },
-                    children: "Try Now"
+                    children: t("keyboardShortcuts.tryNow")
                   }
                 )
               ] })

package/dist/components/KeyboardShortCuts/screen2.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"screen2.d.ts","sourceRoot":"","sources":["../../../src/components/KeyboardShortCuts/screen2.tsx"],"names":[],"mappings":"AAGA,eAAO,MAAM,OAAO,GAAI,cAAc;IAAE,QAAQ,CAAC,EAAE,MAAM,CAAA;CAAE,4CAc1D,CAAC"}
+{"version":3,"file":"screen2.d.ts","sourceRoot":"","sources":["../../../src/components/KeyboardShortCuts/screen2.tsx"],"names":[],"mappings":"AAIA,eAAO,MAAM,OAAO,GAAI,cAAc;IAAE,QAAQ,CAAC,EAAE,MAAM,CAAA;CAAE,4CAe1D,CAAC"}

package/dist/components/KeyboardShortCuts/screen2.js

@@ -1,15 +1,17 @@
 import { jsxs, jsx } from "react/jsx-runtime";
 import { isMac } from "../../utils/shortcuts/platform.js";
 import { KeyCombo } from "./Keycombo.js";
+import { useTranslation } from "../../i18n/useTranslation.js";
 const Screen2 = ({ videoSrc }) => {
+  const { t } = useTranslation();
   return /* @__PURE__ */ jsxs("div", { className: "screen2-container", children: [
     videoSrc && /* @__PURE__ */ jsx("video", { autoPlay: true, loop: true, muted: true, playsInline: true, className: "screen-video", src: videoSrc }),
     /* @__PURE__ */ jsx(
       KeyCombo,
       {
-        description: "Open & close filter",
+        description: t("keyboardShortcuts.screen2.description"),
         firstSymbol: isMac ? "⌥" : null,
-        firstText: isMac ? "option" : "Alt",
+        firstText: isMac ? t("keyboardShortcuts.key.option") : t("keyboardShortcuts.key.alt"),
         secondText: "F"
       }
     )

package/dist/components/KeyboardShortCuts/screen3.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"screen3.d.ts","sourceRoot":"","sources":["../../../src/components/KeyboardShortCuts/screen3.tsx"],"names":[],"mappings":"AAGA,eAAO,MAAM,OAAO,GAAI,cAAc;IAAE,QAAQ,CAAC,EAAE,MAAM,CAAA;CAAE,4CAc1D,CAAC"}
+{"version":3,"file":"screen3.d.ts","sourceRoot":"","sources":["../../../src/components/KeyboardShortCuts/screen3.tsx"],"names":[],"mappings":"AAIA,eAAO,MAAM,OAAO,GAAI,cAAc;IAAE,QAAQ,CAAC,EAAE,MAAM,CAAA;CAAE,4CAe1D,CAAC"}

package/dist/components/KeyboardShortCuts/screen3.js

@@ -1,15 +1,17 @@
 import { jsxs, jsx } from "react/jsx-runtime";
 import { isMac } from "../../utils/shortcuts/platform.js";
 import { KeyCombo } from "./Keycombo.js";
+import { useTranslation } from "../../i18n/useTranslation.js";
 const Screen3 = ({ videoSrc }) => {
+  const { t } = useTranslation();
   return /* @__PURE__ */ jsxs("div", { className: "screen3-container", children: [
     videoSrc && /* @__PURE__ */ jsx("video", { autoPlay: true, loop: true, muted: true, playsInline: true, className: "screen-video", src: videoSrc }),
     /* @__PURE__ */ jsx(
       KeyCombo,
       {
-        description: "Open & close side navigation",
+        description: t("keyboardShortcuts.screen3.description"),
         firstSymbol: isMac ? "⌘" : null,
-        firstText: isMac ? "command" : "Ctrl",
+        firstText: isMac ? t("keyboardShortcuts.key.command") : t("keyboardShortcuts.key.ctrl"),
         secondText: "B"
       }
     )

package/dist/components/KeyboardShortCuts/tutorial.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"tutorial.d.ts","sourceRoot":"","sources":["../../../src/components/KeyboardShortCuts/tutorial.tsx"],"names":[],"mappings":"AASA,OAAO,iCAAiC,CAAC;AA+FzC,UAAU,kBAAkB;IAC1B,oBAAoB,EAAE,CAAC,IAAI,EAAE,OAAO,KAAK,IAAI,CAAC;IAC9C,WAAW,CAAC,EAAE,MAAM,IAAI,CAAC;CAC1B;AAED,eAAO,MAAM,aAAa,GAAI,uCAAuC,kBAAkB,4CAyMtF,CAAC"}
+{"version":3,"file":"tutorial.d.ts","sourceRoot":"","sources":["../../../src/components/KeyboardShortCuts/tutorial.tsx"],"names":[],"mappings":"AAUA,OAAO,iCAAiC,CAAC;AA+FzC,UAAU,kBAAkB;IAC1B,oBAAoB,EAAE,CAAC,IAAI,EAAE,OAAO,KAAK,IAAI,CAAC;IAC9C,WAAW,CAAC,EAAE,MAAM,IAAI,CAAC;CAC1B;AAED,eAAO,MAAM,aAAa,GAAI,uCAAuC,kBAAkB,4CA0MtF,CAAC"}

package/dist/components/KeyboardShortCuts/tutorial.js

@@ -7,28 +7,29 @@ import { ShortcutManager } from "../../utils/shortcuts/ShortcutManager.js";
 import { Loader } from "../Loader/index.js";
 import { Keys } from "./Keycombo.js";
 
+import { useTranslation } from "../../i18n/useTranslation.js";
 import { useShortcut } from "../Shortcuts/useShortcut.js";
 const tutorialSteps = [
   {
-    text: "Open & close side navigation by pressing",
+    textKey: "keyboardShortcuts.tutorial.step1.text",
     firstSymbol: isMac ? "⌘" : null,
-    firstText: isMac ? "command" : "Ctrl",
+    firstTextKey: isMac ? "keyboardShortcuts.key.command" : "keyboardShortcuts.key.ctrl",
     secondText: "B",
     arrowPosition: "left-top"
   },
   {
-    text: "Open keyboard settings by pressing",
+    textKey: "keyboardShortcuts.tutorial.step2.text",
     firstSymbol: isMac ? "⌥" : null,
-    firstText: isMac ? "option" : "Alt",
+    firstTextKey: isMac ? "keyboardShortcuts.key.option" : "keyboardShortcuts.key.alt",
     secondText: "K",
     arrowPosition: "left"
   },
   {
-    text: "Open keyboard shortcut panel by pressing",
+    textKey: "keyboardShortcuts.tutorial.step3.text",
     firstSymbol: isMac ? "⌘" : null,
-    firstText: isMac ? "command" : "Ctrl",
+    firstTextKey: isMac ? "keyboardShortcuts.key.command" : "keyboardShortcuts.key.ctrl",
     middleSymbol: null,
-    middleText: isMac ? null : "Alt",
+    middleTextKey: isMac ? null : "keyboardShortcuts.key.alt",
     secondText: "K",
     arrowPosition: "top-right"
   }
@@ -82,6 +83,7 @@ const ProgressBar = ({ currentStep, totalSteps }) => {
   }) });
 };
 const TutorialModal = ({ setShowTutorialModal, onSkipClick }) => {
+  const { t } = useTranslation();
   const totalSteps = tutorialSteps.length;
   const [tutorialStep, setTutorialStep] = useState(0);
   const step = tutorialSteps[tutorialStep] ?? tutorialSteps[0];
@@ -199,7 +201,7 @@ const TutorialModal = ({ setShowTutorialModal, onSkipClick }) => {
     "div",
     {
       ref: modalRef,
-      className: `tutorial-modal-wrapper tutorial-modal--step-${tutorialStep} tutorial-modal--arrow-${tutorialStep === 2 && !step2ArrowReady ? "left" : step.arrowPosition}${document.querySelector(".impact-sidebar-container.sidebar-open") ? " tutorial-modal--sidebar-expanded" : ""}${step.middleText ? " tutorial-modal--three-keys" : ""}`,
+      className: `tutorial-modal-wrapper tutorial-modal--step-${tutorialStep} tutorial-modal--arrow-${tutorialStep === 2 && !step2ArrowReady ? "left" : step.arrowPosition}${document.querySelector(".impact-sidebar-container.sidebar-open") ? " tutorial-modal--sidebar-expanded" : ""}${step.middleTextKey ? " tutorial-modal--three-keys" : ""}`,
       style: tutorialStep === 2 ? (() => {
         const pos = step2Position ?? prevPositionRef.current;
         if (!pos) return { visibility: "hidden" };
@@ -226,21 +228,21 @@ const TutorialModal = ({ setShowTutorialModal, onSkipClick }) => {
                 src: "https://lottie.host/embed/bd7243cb-3821-46da-bbaa-56edfb4b2056/Z74goW01Yw.lottie"
               }
             ) : /* @__PURE__ */ jsx(Loader, { size: "small", text: "" }) }),
-            /* @__PURE__ */ jsx("span", { className: "top-section-text", children: step.text })
+            /* @__PURE__ */ jsx("span", { className: "top-section-text", children: t(step.textKey) })
           ] }),
           /* @__PURE__ */ jsx("div", { className: "top-section-buttons", children: /* @__PURE__ */ jsx(
             Keys,
             {
               firstSymbol: step.firstSymbol,
-              firstText: step.firstText,
+              firstText: t(step.firstTextKey),
               middleSymbol: step.middleSymbol,
-              middleText: step.middleText,
+              middleText: step.middleTextKey ? t(step.middleTextKey) : null,
               secondText: step.secondText
             }
           ) })
         ] }),
         /* @__PURE__ */ jsxs("div", { className: "bottom-section", children: [
-          /* @__PURE__ */ jsx("span", { className: "bottom-section-text", role: "button", tabIndex: 0, onClick: handleSkip, children: "Skip" }),
+          /* @__PURE__ */ jsx("span", { className: "bottom-section-text", role: "button", tabIndex: 0, onClick: handleSkip, children: t("keyboardShortcuts.skip") }),
           /* @__PURE__ */ jsx("div", { className: "bottom-section-progress", children: /* @__PURE__ */ jsx(ProgressBar, { currentStep: tutorialStep, totalSteps }) })
         ] })
       ]

package/dist/components/Loader/index.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/components/Loader/index.tsx"],"names":[],"mappings":"AAIA,OAAO,KAAK,EAAE,WAAW,EAA4B,MAAM,gBAAgB,CAAC;AAC5E,OAAO,sBAAsB,CAAC;AAE9B,YAAY,EAAE,WAAW,EAAE,UAAU,EAAE,MAAM,gBAAgB,CAAC;AAc9D;;;GAGG;AACH,wBAAgB,MAAM,CAAC,EACrB,IAAc,EACd,QAAa,EACb,YAAoB,EACpB,IAAmB,EACnB,SAAS,EACT,EAAE,EACF,aAAa,EAAE,UAAU,EACzB,YAAY,EAAE,SAAqB,EACnC,IAAe,EACf,QAAQ,EACR,aAAa,GACd,EAAE,WAAW,2CAuDb;yBAnEe,MAAM"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/components/Loader/index.tsx"],"names":[],"mappings":"AAKA,OAAO,KAAK,EAAE,WAAW,EAA4B,MAAM,gBAAgB,CAAC;AAC5E,OAAO,sBAAsB,CAAC;AAE9B,YAAY,EAAE,WAAW,EAAE,UAAU,EAAE,MAAM,gBAAgB,CAAC;AAc9D;;;GAGG;AACH,wBAAgB,MAAM,CAAC,EACrB,IAAc,EACd,QAAa,EACb,YAAoB,EACpB,IAAI,EACJ,SAAS,EACT,EAAE,EACF,aAAa,EAAE,UAAU,EACzB,YAAY,EAAE,SAAqB,EACnC,IAAe,EACf,QAAQ,EACR,aAAa,GACd,EAAE,WAAW,2CAyDb;yBArEe,MAAM"}

package/dist/components/Loader/index.js

@@ -2,6 +2,7 @@
 import { jsxs, jsx } from "react/jsx-runtime";
 import { useMemo } from "react";
 
+import { useTranslation } from "../../i18n/useTranslation.js";
 import Box from "../../node_modules/@mui/material/Box/Box.js";
 import Skeleton from "../../node_modules/@mui/material/Skeleton/Skeleton.js";
 function getSkeletonDimensions(size) {
@@ -19,7 +20,7 @@ function Loader({
   size = "large",
   progress = "",
   showSkeleton = false,
-  text = "Loading...",
+  text,
   className,
   id,
   "data-testid": dataTestId,
@@ -28,6 +29,8 @@ function Loader({
   boxProps,
   skeletonProps
 }) {
+  const { t } = useTranslation();
+  const loaderText = text ?? t("common.loading");
   const skeletonDimensions = useMemo(() => getSkeletonDimensions(size), [size]);
   if (showSkeleton) {
     return /* @__PURE__ */ jsxs(
@@ -87,7 +90,7 @@ function Loader({
       role,
       children: [
         /* @__PURE__ */ jsx("div", { className: `ia-styles ia-loader-outer ia-loader-${size}`, children: /* @__PURE__ */ jsx("div", { className: "ia-loader ia-loader-inner", children: size !== "small" && progress }) }),
-        (progress || text) && /* @__PURE__ */ jsx("div", { className: "ia-loaderText", children: text })
+        (progress || loaderText) && /* @__PURE__ */ jsx("div", { className: "ia-loaderText", children: loaderText })
       ]
     }
   );

package/dist/components/Menu/MenuHeaderInfo.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"MenuHeaderInfo.d.ts","sourceRoot":"","sources":["../../../src/components/Menu/MenuHeaderInfo.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAqD,MAAM,OAAO,CAAC;AAK1E,OAAO,KAAK,EAAE,mBAAmB,EAAE,MAAM,wBAAwB,CAAC;AAClE,OAAO,8BAA8B,CAAC;AAuQtC,eAAO,MAAM,cAAc,4RA1OxB,mBAAmB,6CA0OqC,CAAC;AAG5D,+DAA+D;AAC/D,eAAO,MAAM,iBAAiB,4RA9O3B,mBAAmB,6CA8OyB,CAAC"}
+{"version":3,"file":"MenuHeaderInfo.d.ts","sourceRoot":"","sources":["../../../src/components/Menu/MenuHeaderInfo.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAqD,MAAM,OAAO,CAAC;AAM1E,OAAO,KAAK,EAAE,mBAAmB,EAAE,MAAM,wBAAwB,CAAC;AAClE,OAAO,8BAA8B,CAAC;AAwQtC,eAAO,MAAM,cAAc,4RA3OxB,mBAAmB,6CA2OqC,CAAC;AAG5D,+DAA+D;AAC/D,eAAO,MAAM,iBAAiB,4RA/O3B,mBAAmB,6CA+OyB,CAAC"}

package/dist/components/Menu/MenuHeaderInfo.js

@@ -5,6 +5,7 @@ import { SearchIconTable as SearchIconTable_default } from "../../node_modules/@
 import { Checkbox } from "../Checkbox/index.js";
 import { RadioButtonGroup } from "../RadioButtonGroup/index.js";
 
+import { useTranslation } from "../../i18n/useTranslation.js";
 import MenuItem from "../../node_modules/@mui/material/MenuItem/MenuItem.js";
 function debounce(func, wait) {
   let timeout = null;
@@ -33,6 +34,7 @@ const MenuHeaderInfoComponent = ({
   externalHandlers = {},
   overrideConfig = {}
 }) => {
+  const { t } = useTranslation();
   const config = {
     radioButtonOptions: overrideConfig.radioButtonOptions ?? radioButtonOptions,
     selectedRadioButton: overrideConfig.selectedRadioButton ?? selectedRadioButton,
@@ -193,7 +195,7 @@ const MenuHeaderInfoComponent = ({
     config.isSearchable ? /* @__PURE__ */ jsxs(
       "div",
       {
-        "aria-label": "Search input container",
+        "aria-label": t("menu.searchAriaLabel"),
         className: "menu-header-search-container",
         role: "search",
         children: [
@@ -204,7 +206,7 @@ const MenuHeaderInfoComponent = ({
               ref: inputRef,
               autoComplete: "off",
               className: "menu-header-search-input",
-              placeholder: searchPlaceholder ?? "Search here...",
+              placeholder: searchPlaceholder ?? t("menu.searchPlaceholder"),
               tabIndex: 0,
               type: "text",
               value: internalSearchQuery,
@@ -222,7 +224,7 @@ const MenuHeaderInfoComponent = ({
         {
           checked: isAllSelected,
           indeterminate: isIndeterminate,
-          label: selectAllLabel ?? "Select all",
+          label: selectAllLabel ?? t("common.selectAll"),
           variant: "default",
           onChange: () => {
             handleSelectAll();
@@ -241,7 +243,7 @@ const MenuHeaderInfoComponent = ({
             if (e.key === "Enter") handleClearSelection();
           },
           ...clearButtonProps ?? {},
-          children: clearButtonText ?? "Clear"
+          children: clearButtonText ?? t("common.clear")
         }
       )
     ] }) : null

package/dist/components/Menu/index.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/components/Menu/index.tsx"],"names":[],"mappings":"AACA,OAAO,KAA0C,MAAM,OAAO,CAAC;AAI/D,OAAO,KAAK,EAAE,SAAS,EAAc,MAAM,cAAc,CAAC;AAC1D,OAAO,KAAK,EAAE,SAAS,IAAI,YAAY,EAAE,MAAM,oBAAoB,CAAC;AACpE,OAAO,oBAAoB,CAAC;AAE5B,YAAY,EAAE,SAAS,EAAE,UAAU,EAAE,MAAM,cAAc,CAAC;AAC1D,OAAO,EAAE,cAAc,EAAE,iBAAiB,EAAE,MAAM,kBAAkB,CAAC;AACrE,YAAY,EAAE,mBAAmB,EAAE,MAAM,wBAAwB,CAAC;AAElE;;;;GAIG;AACH,eAAO,MAAM,IAAI,uHAuOhB,CAAC"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/components/Menu/index.tsx"],"names":[],"mappings":"AACA,OAAO,KAA0C,MAAM,OAAO,CAAC;AAK/D,OAAO,KAAK,EAAE,SAAS,EAAc,MAAM,cAAc,CAAC;AAC1D,OAAO,KAAK,EAAE,SAAS,IAAI,YAAY,EAAE,MAAM,oBAAoB,CAAC;AACpE,OAAO,oBAAoB,CAAC;AAE5B,YAAY,EAAE,SAAS,EAAE,UAAU,EAAE,MAAM,cAAc,CAAC;AAC1D,OAAO,EAAE,cAAc,EAAE,iBAAiB,EAAE,MAAM,kBAAkB,CAAC;AACrE,YAAY,EAAE,mBAAmB,EAAE,MAAM,wBAAwB,CAAC;AAElE;;;;GAIG;AACH,eAAO,MAAM,IAAI,uHAwOhB,CAAC"}

package/dist/components/Menu/index.js

@@ -4,9 +4,11 @@ import { forwardRef, useState, useEffect } from "react";
 import { nestedMenuItemsFromObject } from "./nestedMenuItemsFromObject.js";
 import { Button } from "../Button/index.js";
 
+import { useTranslation } from "../../i18n/useTranslation.js";
 import Menu$1 from "../../node_modules/@mui/material/Menu/Menu.js";
 const Menu = forwardRef(
   function Menu2(props, ref) {
+    const { t } = useTranslation();
     const {
       options: data,
       onClick: onMenuClick = () => {
@@ -91,14 +93,22 @@ const Menu = forwardRef(
     const isSearching = customHeaderProps.isSearching;
     const hasEmptySearch = Boolean(searchQuery && (data == null ? void 0 : data.length) === 0 && !isSearching);
     const hasNoInitialData = !searchQuery && (data == null ? void 0 : data.length) === 0 && !isLoading;
-    const renderLoadingState = () => /* @__PURE__ */ jsx("div", { style: { padding: "16px", textAlign: "center", color: "#666" }, children: /* @__PURE__ */ jsx("div", { children: " Loading options..." }) });
-    const renderSearchingState = () => /* @__PURE__ */ jsx("div", { style: { padding: "16px", textAlign: "center", color: "#666" }, children: /* @__PURE__ */ jsx("div", { children: " Searching..." }) });
+    const renderLoadingState = () => /* @__PURE__ */ jsx("div", { style: { padding: "16px", textAlign: "center", color: "#666" }, children: /* @__PURE__ */ jsxs("div", { children: [
+      " ",
+      t("menu.loadingOptions")
+    ] }) });
+    const renderSearchingState = () => /* @__PURE__ */ jsx("div", { style: { padding: "16px", textAlign: "center", color: "#666" }, children: /* @__PURE__ */ jsxs("div", { children: [
+      " ",
+      t("menu.searching")
+    ] }) });
     const renderEmptySearchState = () => /* @__PURE__ */ jsx("div", { style: { padding: "16px", textAlign: "center", color: "#666" }, children: /* @__PURE__ */ jsxs("div", { children: [
-      ' No results found for "',
-      searchQuery,
-      '"'
+      " ",
+      t("menu.noResults", { query: searchQuery ?? "" })
+    ] }) });
+    const renderNoDataState = () => /* @__PURE__ */ jsx("div", { style: { padding: "16px", textAlign: "center", color: "#666" }, children: /* @__PURE__ */ jsxs("div", { children: [
+      "📭 ",
+      t("menu.noOptions")
     ] }) });
-    const renderNoDataState = () => /* @__PURE__ */ jsx("div", { style: { padding: "16px", textAlign: "center", color: "#666" }, children: /* @__PURE__ */ jsx("div", { children: "📭 No options available" }) });
     const menuItems = nestedMenuItemsFromObject({
       handleClose: onClose,
       isOpen: open,
@@ -161,7 +171,7 @@ const Menu = forwardRef(
                 variant: "tertiary",
                 onClick: onTertiaryButtonClick,
                 ...tertiaryButtonProps,
-                children: tertiaryButtonLabel || "Cancel"
+                children: tertiaryButtonLabel || t("common.cancel")
               }
             ),
             /* @__PURE__ */ jsx(
@@ -171,7 +181,7 @@ const Menu = forwardRef(
                 variant: "primary",
                 onClick: onPrimaryButtonClick,
                 ...primaryButtonProps,
-                children: primaryButtonProps.loading ? "Loading..." : primaryButtonProps.label ?? "Apply"
+                children: primaryButtonProps.loading ? t("common.loading") : primaryButtonProps.label ?? t("common.apply")
               }
             )
           ] }) })

package/dist/components/Modal/index.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/components/Modal/index.tsx"],"names":[],"mappings":"AAGA,OAAO,KAAK,EAAE,UAAU,EAAE,MAAM,eAAe,CAAC;AAChD,OAAO,qBAAqB,CAAC;AAE7B,YAAY,EAAE,UAAU,EAAE,SAAS,EAAE,MAAM,eAAe,CAAC;AAE3D,wBAAgB,KAAK,CAAC,EACpB,SAAc,EACd,KAAK,EACL,IAAe,EACf,QAAQ,EACR,kBAAkB,EAClB,oBAAoB,EACpB,IAAI,EACJ,oBAAoB,EACpB,sBAAsB,EACtB,kBAAkB,EAClB,oBAAoB,EACpB,OAAO,EACP,KAAK,EACL,MAAM,EACN,aAAa,EACb,aAAqB,EACrB,UAAkB,EAClB,QAAQ,EACR,SAAS,EACT,MAAa,EACb,cAAsB,EACtB,GAAG,IAAI,EACR,EAAE,UAAU,2CA4FZ;yBAnHe,KAAK"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/components/Modal/index.tsx"],"names":[],"mappings":"AAIA,OAAO,KAAK,EAAE,UAAU,EAAE,MAAM,eAAe,CAAC;AAChD,OAAO,qBAAqB,CAAC;AAE7B,YAAY,EAAE,UAAU,EAAE,SAAS,EAAE,MAAM,eAAe,CAAC;AAE3D,wBAAgB,KAAK,CAAC,EACpB,SAAc,EACd,KAAK,EACL,IAAe,EACf,QAAQ,EACR,kBAAkB,EAClB,oBAAoB,EACpB,IAAI,EACJ,oBAAoB,EACpB,sBAAsB,EACtB,kBAAkB,EAClB,oBAAoB,EACpB,OAAO,EACP,KAAK,EACL,MAAM,EACN,aAAa,EACb,aAAqB,EACrB,UAAkB,EAClB,QAAQ,EACR,SAAS,EACT,MAAa,EACb,cAAsB,EACtB,GAAG,IAAI,EACR,EAAE,UAAU,2CA6FZ;yBApHe,KAAK"}

package/dist/components/Modal/index.js

@@ -1,7 +1,8 @@
 !function(){"use strict";try{if("undefined"!=typeof document){var o=document.createElement("style");o.appendChild(document.createTextNode(".ia_modalPopover{background:#fff;border-radius:8px;bottom:0;display:flex;flex-direction:column;left:0;margin:auto;position:absolute;right:0;top:0}.ia_modalPopover.is-bottom-sheet{border-radius:16px 16px 0 0;bottom:0;left:0;right:0;top:auto;transform:none;transition:height .3s ease-in-out;width:100%!important}.ia_modalPopover.is-bottom-sheet.with-expand-icon{height:465px!important}.ia_modalPopover.is-bottom-sheet.expanded{height:auto!important;top:100px}.ia_modalPopover .ia_modalHeader{align-items:center;background:#eceefd;border-radius:8px 8px 0 0;display:flex;justify-content:space-between;padding:16px}.ia_modalPopover .ia_modalHeader .ia_modalHeading{color:#0d152c;font-size:16px;font-weight:700;line-height:16px}.ia_modalPopover .ia_modalHeader .modal-actions{align-items:center;display:flex;gap:8px}.ia_modalPopover .ia_modalHeader .close_icon,.ia_modalPopover .ia_modalHeader .collapse_icon,.ia_modalPopover .ia_modalHeader .expand_icon{background-color:initial;background-repeat:no-repeat;background-size:contain;border:none;cursor:pointer;height:24px;margin:0;padding:0;width:24px}.ia_modalPopover .ia_modalHeader .close_icon:focus-visible,.ia_modalPopover .ia_modalHeader .collapse_icon:focus-visible,.ia_modalPopover .ia_modalHeader .expand_icon:focus-visible{box-shadow:0 0 0 var(--ia-focus-ring-offset,2px) var(--ia-focus-bg,#fff),0 0 0 calc(var(--ia-focus-ring-offset, 2px) + var(--ia-focus-ring-width, 2px)) var(--ia-focus-color,#4259ee);outline:none;transition:box-shadow .15s ease-in-out}.ia_modalPopover .ia_modalHeader .close_icon:focus:not(:focus-visible),.ia_modalPopover .ia_modalHeader .collapse_icon:focus:not(:focus-visible),.ia_modalPopover .ia_modalHeader .expand_icon:focus:not(:focus-visible){box-shadow:none;outline:none}.ia_modalPopover .ia_modalHeader .expand_icon{background:url(https://impact-kit.devs.iaproducts.ai/api/v1/files/uploads/impact-ui/prod/icons/expand-icon.svg) no-repeat;background-position:50%;background-size:16px;height:16px;width:16px}.ia_modalPopover .ia_modalHeader .collapse_icon{background:url(https://impact-kit.devs.iaproducts.ai/api/v1/files/uploads/impact-ui/prod/icons/collapse-icon-2.svg) no-repeat;background-position:50%;background-size:16px;height:16px;width:16px}.ia_modalPopover .ia_modalHeader .close_icon{background:url(https://impact-kit.devs.iaproducts.ai/api/v1/files/uploads/impact-ui/prod/icons/close.svg) no-repeat;background-position:50%;background-size:16px;height:10px;width:10px}.ia_modalPopover .ia_modalBody{bottom:56px;box-sizing:border-box;flex:1;font-size:14px;line-height:22px;overflow:auto;padding:24px 16px 16px;position:absolute;top:48px;width:100%}.ia_modalPopover .ia_modalFooter{align-items:center;border-top:1px solid #d9dde7;bottom:0;display:flex;gap:16px;height:56px;justify-content:flex-end;left:0;padding-right:16px;position:absolute;right:0}.ia_modalPopover.ia_modal_small{height:304px;width:526px}.ia_modalPopover.ia_modal_medium{height:532px;width:800px}.ia_modalPopover.ia_modal_large{top:100px;right:100px;bottom:100px;left:100px}")),document.head.appendChild(o)}}catch(a){console.error("vite-plugin-css-injected-by-js",a)}}();
-import { jsx, jsxs } from "react/jsx-runtime";
+import { jsxs, jsx } from "react/jsx-runtime";
 import { Button } from "../Button/index.js";
 
+import { useTranslation } from "../../i18n/useTranslation.js";
 import Modal$1 from "../../node_modules/@mui/material/Modal/Modal.js";
 import Box from "../../node_modules/@mui/material/Box/Box.js";
 function Modal({
@@ -28,6 +29,7 @@ function Modal({
   withExpandIcon = false,
   ...args
 }) {
+  const { t } = useTranslation();
   const modalClasses = [
     "ia_modalPopover",
     `ia_modal_${size}`,
@@ -44,7 +46,7 @@ function Modal({
     isBottomSheet && withExpandIcon && /* @__PURE__ */ jsx(
       "button",
       {
-        "aria-label": isExpanded ? "Collapse" : "Expand",
+        "aria-label": isExpanded ? t("modal.collapse") : t("modal.expand"),
         className: isExpanded ? "collapse_icon" : "expand_icon",
         type: "button",
         onClick: onExpand
@@ -53,7 +55,7 @@ function Modal({
     /* @__PURE__ */ jsx(
       "button",
       {
-        "aria-label": "Close",
+        "aria-label": t("common.close"),
         className: "close_icon",
         "data-testid": "modal-close-button",
         type: "button",

package/dist/components/MonthPicker/index.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/components/MonthPicker/index.tsx"],"names":[],"mappings":"AASA,OAAO,KAAK,EAAE,gBAAgB,EAAc,MAAM,qBAAqB,CAAC;AAExE,OAAO,2BAA2B,CAAC;AAEnC,YAAY,EAAE,gBAAgB,EAAE,UAAU,EAAE,MAAM,qBAAqB,CAAC;AACxE,OAAO,EAAE,aAAa,EAAE,MAAM,aAAa,CAAC;AAW5C,wBAAgB,WAAW,CAAC,EAC1B,WAAW,EACX,MAAgB,EAChB,WAAmB,EACnB,aAAyB,EACzB,YAAmB,EACnB,OAAO,EACP,aAAa,EACb,aAAa,EAAE,oBAA2B,EAC1C,cAA4B,EAC5B,QAAgB,EAChB,cAAsB,EACtB,OAAe,EACf,WAAqB,EACrB,UAAkB,EAClB,eAEoC,EACpC,eAAoB,EACpB,mBAAmB,EAAE,cAAc,GACpC,EAAE,gBAAgB,2CAkclB;yBAtde,WAAW"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/components/MonthPicker/index.tsx"],"names":[],"mappings":"AAUA,OAAO,KAAK,EAAE,gBAAgB,EAAc,MAAM,qBAAqB,CAAC;AAExE,OAAO,2BAA2B,CAAC;AAEnC,YAAY,EAAE,gBAAgB,EAAE,UAAU,EAAE,MAAM,qBAAqB,CAAC;AACxE,OAAO,EAAE,aAAa,EAAE,MAAM,aAAa,CAAC;AAW5C,wBAAgB,WAAW,CAAC,EAC1B,WAAW,EACX,MAAM,EACN,WAAmB,EACnB,aAAyB,EACzB,YAAmB,EACnB,OAAO,EACP,aAAa,EACb,aAAa,EAAE,oBAA2B,EAC1C,cAA4B,EAC5B,QAAgB,EAChB,cAAsB,EACtB,OAAe,EACf,WAAqB,EACrB,UAAkB,EAClB,eAEoC,EACpC,eAAoB,EACpB,mBAAmB,EAAE,cAAc,GACpC,EAAE,gBAAgB,2CAsclB;yBA1de,WAAW"}

package/dist/components/MonthPicker/index.js

@@ -8,6 +8,7 @@ import { Portal } from "../Portal/index.js";
 import { Select } from "../Select/index.js";
 import { MONTHS_NUMBER } from "./constants.js";
 
+import { useTranslation } from "../../i18n/useTranslation.js";
 import IconButton from "../../node_modules/@mui/material/IconButton/IconButton.js";
 const defaultYears = () => {
   const today = /* @__PURE__ */ new Date();
@@ -19,7 +20,7 @@ const defaultYears = () => {
 };
 function MonthPicker({
   customYears,
-  locale = "en-US",
+  locale,
   isMandatory = false,
   displayFormat = "MM/YYYY",
   focusedInput = null,
@@ -36,6 +37,8 @@ function MonthPicker({
   portalClassName = "",
   YearSelectComponent: YearSelectProp
 }) {
+  const { t, locale: activeLocale } = useTranslation();
+  const effectiveLocale = locale || activeLocale;
   const YearSelect = YearSelectProp ?? Select;
   const today = useMemo(() => /* @__PURE__ */ new Date(), []);
   const yrs = useMemo(() => defaultYears(), []);
@@ -78,12 +81,12 @@ function MonthPicker({
   const formatDate = useCallback(
     (date) => {
       if (!date) return "";
-      const month = new Intl.DateTimeFormat("en-US", { month: "2-digit" }).format(date);
-      const year = new Intl.DateTimeFormat("en-US", { year: "numeric" }).format(date);
+      const month = new Intl.DateTimeFormat(effectiveLocale, { month: "2-digit" }).format(date);
+      const year = new Intl.DateTimeFormat(effectiveLocale, { year: "numeric" }).format(date);
       if (displayFormat === "YYYY/MM") return `${year}/${month}`;
       return `${month}/${year}`;
     },
-    [displayFormat]
+    [displayFormat, effectiveLocale]
   );
   const isMonthSelected = useCallback(
     (month) => {
@@ -105,7 +108,7 @@ function MonthPicker({
           ref: (el) => {
             monthButtonRefs.current[monthIndex] = el;
           },
-          "aria-label": new Intl.DateTimeFormat(locale, {
+          "aria-label": new Intl.DateTimeFormat(effectiveLocale, {
             month: "long",
             year: "numeric"
           }).format(monthStart),
@@ -120,12 +123,12 @@ function MonthPicker({
           onFocus: () => {
             setFocusedMonthIndex(monthIndex);
           },
-          children: /* @__PURE__ */ jsx("span", { className: "mp-calendar-month", children: new Intl.DateTimeFormat(locale, { month: "short" }).format(monthStart) })
+          children: /* @__PURE__ */ jsx("span", { className: "mp-calendar-month", children: new Intl.DateTimeFormat(effectiveLocale, { month: "short" }).format(monthStart) })
         },
         monthIndex
       );
     },
-    [locale, today, isMonthSelected, isOutsideRange, handleMonthClick, focusedMonthIndex]
+    [effectiveLocale, today, isMonthSelected, isOutsideRange, handleMonthClick, focusedMonthIndex]
   );
   const renderYear = useCallback(
     (year) => /* @__PURE__ */ jsx("div", { className: "mp-render-month", children: MONTHS_NUMBER.map((m) => renderMonth(year, m)) }),
@@ -305,7 +308,7 @@ function MonthPicker({
     "div",
     {
       ref: dropDownContainerRef,
-      "aria-label": "Month picker",
+      "aria-label": t("monthPicker.ariaMonthPicker"),
       className: "mp-single-month-picker-container",
       role: "dialog",
       onKeyDown: handleCalendarKeyDown,
@@ -354,8 +357,8 @@ function MonthPicker({
         /* @__PURE__ */ jsx("div", { className: "mp-render-month-container", children: renderYear(parseInt(selectedOptions.value, 10)) }),
         /* @__PURE__ */ jsx("hr", { className: "mp-vertical-line" }),
         /* @__PURE__ */ jsxs("div", { className: "mp-calendar-button", children: [
-          /* @__PURE__ */ jsx(Button, { variant: "tertiary", onClick: handleCancel, children: "Cancel" }),
-          /* @__PURE__ */ jsx(Button, { onClick: handleApply, children: "Apply" })
+          /* @__PURE__ */ jsx(Button, { variant: "tertiary", onClick: handleCancel, children: t("common.cancel") }),
+          /* @__PURE__ */ jsx(Button, { onClick: handleApply, children: t("common.apply") })
         ] })
       ]
     }
@@ -366,7 +369,7 @@ function MonthPicker({
       className: `impact-singleMonthPicker-main-container single-month-label-flex-column ${disabled ? "disabled" : ""}`,
       children: [
         /* @__PURE__ */ jsxs("div", { className: "singleMonthPicker-label", children: [
-          "Select Month & Year",
+          t("monthPicker.label"),
           isMandatory && /* @__PURE__ */ jsx("span", { style: { color: "red" }, children: "*" })
         ] }),
         /* @__PURE__ */ jsxs(
@@ -384,9 +387,9 @@ function MonthPicker({
                     readOnly: true,
                     "aria-expanded": openCalendar,
                     "aria-haspopup": "dialog",
-                    "aria-label": "Selected month",
+                    "aria-label": t("monthPicker.ariaSelectedMonth"),
                     className: `singleMonthPicker-input-field ${selectedMonth ? "active" : ""} ${computedIsError ? "error" : ""}`.trim(),
-                    placeholder: `Select ${displayFormat}`,
+                    placeholder: t("monthPicker.placeholder", { format: displayFormat }),
                     type: "text",
                     value: selectedMonth ? formatDate(selectedMonth) : "",
                     onBlur: () => {
@@ -402,7 +405,7 @@ function MonthPicker({
                 selectedMonth && /* @__PURE__ */ jsx(
                   "button",
                   {
-                    "aria-label": "Clear selection",
+                    "aria-label": t("monthPicker.ariaClose"),
                     className: "mp-close-icon",
                     tabIndex: 0,
                     type: "button",

package/dist/components/MonthRangePicker/index.d.ts

@@ -1,7 +1,7 @@
 
 export declare const MonthRangePicker: ({ customYears, locale, isMandatory, displayFormat, focusedInput, onApply, startMonth: initialStartMonth, endMonth: initialEndMonth, showYearSelect, isOutsideRange, disabled, customWidth, isError, withPortal, portalContainer, portalClassName, onStartMonthChange, onEndMonthChange, className, id, "data-testid": dataTestId, }: {
     customYears: any;
-    locale?: string | undefined;
+    locale: any;
     isMandatory?: boolean | undefined;
     displayFormat?: string | undefined;
     focusedInput?: null | undefined;

package/dist/components/MonthRangePicker/index.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/components/MonthRangePicker/index.tsx"],"names":[],"mappings":"AAuBA,OAAO,gCAAgC,CAAC;AAExC,eAAO,MAAM,gBAAgB,GAAI;;;;;;;;;;;;;;;;;;;;;;CAwBhC,4CAwpBA,CAAC"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/components/MonthRangePicker/index.tsx"],"names":[],"mappings":"AAwBA,OAAO,gCAAgC,CAAC;AAExC,eAAO,MAAM,gBAAgB,GAAI;;;;;;;;;;;;;;;;;;;;;;CAwBhC,4CA4pBA,CAAC"}