impact-ui 4.0.1-alpha.12 → 4.0.1-alpha.13

package/dist/components/Chatbot/utils.js

@@ -7,7 +7,7 @@ const formatAMPM = (date) => {
   minutes = minutes < 10 ? `0${minutes}` : minutes;
   return `${hours}:${minutes} ${ampm}`;
 };
-const getDateLabel = (dateString) => {
+const getDateLabel = (dateString, t, locale) => {
   if (!dateString) return "";
   const date = new Date(dateString);
   const today = /* @__PURE__ */ new Date();
@@ -15,9 +15,9 @@ const getDateLabel = (dateString) => {
   yesterday.setDate(today.getDate() - 1);
   const isToday = date.toDateString() === today.toDateString();
   const isYesterday = date.toDateString() === yesterday.toDateString();
-  if (isToday) return "Today";
-  if (isYesterday) return "Yesterday";
-  return date.toLocaleDateString(void 0, {
+  if (isToday) return t ? t("chatBot.dateSeparator.today") : "Today";
+  if (isYesterday) return t ? t("chatBot.dateSeparator.yesterday") : "Yesterday";
+  return date.toLocaleDateString(locale, {
     month: "short",
     day: "numeric",
     year: "numeric"

package/dist/components/CommentsPanel/CommentsContext.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"CommentsContext.d.ts","sourceRoot":"","sources":["../../../src/components/CommentsPanel/CommentsContext.tsx"],"names":[],"mappings":"AAmBA,QAAA,MAAM,eAAe,+BAAsB,CAAC;AAE5C,wBAAgB,gBAAgB,CAAC,EAAE,YAAY,EAAE,QAAQ,EAAE;;;CAAA,2CAmlB1D;AAED,wBAAgB,WAAW,SAE1B;AAED,OAAO,EAAE,eAAe,EAAE,CAAC;AAC3B,eAAe,gBAAgB,CAAC"}
+{"version":3,"file":"CommentsContext.d.ts","sourceRoot":"","sources":["../../../src/components/CommentsPanel/CommentsContext.tsx"],"names":[],"mappings":"AAoBA,QAAA,MAAM,eAAe,+BAAsB,CAAC;AAE5C,wBAAgB,gBAAgB,CAAC,EAAE,YAAY,EAAE,QAAQ,EAAE;;;CAAA,2CAwlB1D;AAED,wBAAgB,WAAW,SAE1B;AAED,OAAO,EAAE,eAAe,EAAE,CAAC;AAC3B,eAAe,gBAAgB,CAAC"}

package/dist/components/CommentsPanel/CommentsContext.js

@@ -3,12 +3,14 @@ import { createContext, useContext, useState, useRef, useEffect, useCallback, us
 import { getAssetUrl } from "../../utils/assetBase.js";
 import { Menu } from "../Menu/index.js";
 import { Prompt } from "../Prompt/index.js";
+import { useTranslation } from "../../i18n/useTranslation.js";
 const EditIcon = (props) => /* @__PURE__ */ jsx("img", { alt: "", src: getAssetUrl("icons/edit-black.svg"), ...props });
 const DeleteIcon = (props) => /* @__PURE__ */ jsx("img", { alt: "", src: getAssetUrl("icons/delete-black.svg"), ...props });
 const UnreadIcon = (props) => /* @__PURE__ */ jsx("img", { alt: "", src: getAssetUrl("icons/Comment.svg"), ...props });
 const ReadIcon = (props) => /* @__PURE__ */ jsx("img", { alt: "", src: getAssetUrl("icons/CheckTickAll.svg"), ...props });
 const CommentsContext = createContext(null);
 function CommentsProvider({ commentProps, children }) {
+  const { t } = useTranslation();
   const [comments, setComments] = useState((commentProps == null ? void 0 : commentProps.comments) || {});
   const [resolvedComments, setResolvedComments] = useState((commentProps == null ? void 0 : commentProps.resolvedComments) || []);
   const [isCommentResolvedAlertOpen, setIsCommentResolvedAlertOpen] = useState(false);
@@ -127,7 +129,7 @@ function CommentsProvider({ commentProps, children }) {
         const options = [];
         if (!config.disableMarkAsRead) {
           options.push({
-            label: isRead ? "Mark as Unread" : "Mark as Read",
+            label: isRead ? t("commentsPanel.markAsUnread") : t("commentsPanel.markAsRead"),
             onClick: async () => {
               if (selectedComment == null ? void 0 : selectedComment.read) {
                 await (commentProps == null ? void 0 : commentProps.handleMarkAsUnread(selectedComment.id));
@@ -143,7 +145,7 @@ function CommentsProvider({ commentProps, children }) {
         }
         if (!config.disableDeleteThread && author == (commentProps == null ? void 0 : commentProps.author)) {
           options.push({
-            label: "Delete Thread",
+            label: t("commentsPanel.deleteThread"),
             icon: /* @__PURE__ */ jsx(DeleteIcon, {}),
             onClick: () => {
               setThreadToDelete({
@@ -162,7 +164,7 @@ function CommentsProvider({ commentProps, children }) {
         const options = [];
         if (!config.disableEditComment) {
           options.push({
-            label: "Edit",
+            label: t("commentsPanel.edit"),
             icon: /* @__PURE__ */ jsx(EditIcon, {}),
             onClick: () => {
               if (selectedComment) {
@@ -176,7 +178,7 @@ function CommentsProvider({ commentProps, children }) {
         }
         if (!config.disableDeleteComment) {
           options.push({
-            label: "Delete",
+            label: t("commentsPanel.delete"),
             icon: /* @__PURE__ */ jsx(DeleteIcon, {}),
             onClick: () => {
               setCommentToDelete({
@@ -194,7 +196,7 @@ function CommentsProvider({ commentProps, children }) {
         return options;
       }
     },
-    [commentProps, selectedComment, popup == null ? void 0 : popup.cellId, popup == null ? void 0 : popup.data]
+    [commentProps, selectedComment, popup == null ? void 0 : popup.cellId, popup == null ? void 0 : popup.data, t]
   );
   const handleMouseLeave = useCallback(() => {
     if ((popup == null ? void 0 : popup.openedBy) === "hover") {
@@ -242,17 +244,17 @@ function CommentsProvider({ commentProps, children }) {
         setEditingComment(null);
       } catch (error) {
         console.error("Error updating comment:", error);
-        setCommentError("Failed to update comment. Please try again.");
+        setCommentError(t("commentsPanel.updateFailed"));
       } finally {
         setIsCommentLoading(false);
       }
     },
-    [editingComment, commentProps]
+    [editingComment, commentProps, t]
   );
   const handleAddComment = useCallback(
     async (cellId, inputValue, taggedUsers) => {
       if (!(inputValue == null ? void 0 : inputValue.trim())) {
-        setCommentError("Comment cannot be empty");
+        setCommentError(t("commentsPanel.commentEmpty"));
         return;
       }
       const isEditing = editingComment !== null;
@@ -298,7 +300,7 @@ function CommentsProvider({ commentProps, children }) {
               id: Date.now(),
               text: inputValue.trim(),
               timestamp: (/* @__PURE__ */ new Date()).toISOString(),
-              author: (commentProps == null ? void 0 : commentProps.author) || "Current User",
+              author: (commentProps == null ? void 0 : commentProps.author) || t("commentsPanel.currentUser"),
               isEdited: false
             };
             setComments((prev) => ({
@@ -313,7 +315,7 @@ function CommentsProvider({ commentProps, children }) {
       } catch (error) {
         console.error("Error saving comment:", error);
         setCommentError(
-          (error == null ? void 0 : error.message) || (isEditing ? "Failed to update comment" : "Failed to save comment")
+          (error == null ? void 0 : error.message) || (isEditing ? t("commentsPanel.updateFailedShort") : t("commentsPanel.saveFailed"))
         );
       } finally {
         setIsCommentLoading(false);
@@ -324,7 +326,8 @@ function CommentsProvider({ commentProps, children }) {
       editingComment,
       commentProps == null ? void 0 : commentProps.handleSaveComment,
       commentProps == null ? void 0 : commentProps.handleCommentEdit,
-      commentProps == null ? void 0 : commentProps.author
+      commentProps == null ? void 0 : commentProps.author,
+      t
     ]
   );
   const handleMarkAsResolved = useCallback(
@@ -532,17 +535,17 @@ function CommentsProvider({ commentProps, children }) {
       {
         handleClose: handleDeleteCancel,
         isOpen: showDeleteConfirmation,
-        primaryButtonLabel: isDeleteConfirmationLoading ? "Deleting..." : "Delete",
+        primaryButtonLabel: isDeleteConfirmationLoading ? t("commentsPanel.deleting") : t("commentsPanel.delete"),
         primaryButtonProps: {
           type: "destructive"
         },
-        secondaryButtonLabel: "Cancel",
+        secondaryButtonLabel: t("common.cancel"),
         style: { zIndex: 1e4 },
-        title: "Delete Comment",
+        title: t("commentsPanel.deleteCommentTitle"),
         variant: "error",
         onPrimaryButtonClick: handleDeleteConfirm,
         onSecondaryButtonClick: handleDeleteCancel,
-        children: "Are you sure you want to delete this comment? This action cannot be undone."
+        children: t("commentsPanel.deleteConfirmMessage")
       }
     )
   ] });

package/dist/components/CommentsPanel/CommentsPanel.impl.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"CommentsPanel.impl.d.ts","sourceRoot":"","sources":["../../../src/components/CommentsPanel/CommentsPanel.impl.tsx"],"names":[],"mappings":"AAaA,OAAO,6BAA6B,CAAC;AA2BrC,MAAM,CAAC,OAAO,UAAU,aAAa,CAAC,EAAE,SAAS,EAAE,KAAK,EAAE,OAAO,EAAE,kBAAkB,EAAE;;;;;CAAA,kDAyZtF"}
+{"version":3,"file":"CommentsPanel.impl.d.ts","sourceRoot":"","sources":["../../../src/components/CommentsPanel/CommentsPanel.impl.tsx"],"names":[],"mappings":"AAcA,OAAO,6BAA6B,CAAC;AA2BrC,MAAM,CAAC,OAAO,UAAU,aAAa,CAAC,EAAE,SAAS,EAAE,KAAK,EAAE,OAAO,EAAE,kBAAkB,EAAE;;;;;CAAA,kDA+ZtF"}

package/dist/components/CommentsPanel/CommentsPanel.impl.js

@@ -13,6 +13,7 @@ import { Input } from "../Input/index.js";
 import { Menu } from "../Menu/index.js";
 import { useComments } from "./CommentsContext.js";
 
+import { useTranslation } from "../../i18n/useTranslation.js";
 const MenuIcon = (props) => /* @__PURE__ */ jsx("img", { alt: "", src: getAssetUrl("icons/MoreHorizontal.svg"), ...props });
 const SuccessIcon = (props) => /* @__PURE__ */ jsx("img", { alt: "", src: getAssetUrl("icons/success-gray.svg"), ...props });
 const SuccessFillIcon = (props) => /* @__PURE__ */ jsx("img", { alt: "", src: getAssetUrl("icons/success-fill.svg"), ...props });
@@ -21,12 +22,13 @@ const EmptyStateIcon = (props) => /* @__PURE__ */ jsx("img", { alt: "", src: get
 const SearchIcon = (props) => /* @__PURE__ */ jsx("img", { alt: "", src: getAssetUrl("icons/search.svg"), ...props });
 const NoFilterResultsIcon = (props) => /* @__PURE__ */ jsx("img", { alt: "", src: getAssetUrl("icons/no-filter-results.svg"), ...props });
 const COMMENT_SEARCH_OPTIONS = [
-  { label: "Sort by date", value: "opt1" },
-  { label: "Sort by unread", value: "opt2" },
-  { label: "Show resolved comments", value: "opt3" },
-  { label: "Only your threads", value: "opt4" }
+  { labelKey: "commentsPanel.sortByDate", value: "opt1" },
+  { labelKey: "commentsPanel.sortByUnread", value: "opt2" },
+  { labelKey: "commentsPanel.showResolved", value: "opt3" },
+  { labelKey: "commentsPanel.onlyYourThreads", value: "opt4" }
 ];
 function CommentsPanel({ className, style, onClose, visibleSortOptions }) {
+  const { t } = useTranslation();
   const ctx = useComments();
   const [activeItem, setActiveItem] = useState(null);
   const [menuAnchorEl, setMenuAnchorEl] = useState(null);
@@ -63,8 +65,8 @@ function CommentsPanel({ className, style, onClose, visibleSortOptions }) {
     const getTime = (entry) => {
       var _a, _b;
       const ts = (_b = (_a = entry == null ? void 0 : entry[1]) == null ? void 0 : _a[0]) == null ? void 0 : _b.timestamp;
-      const t = ts ? new Date(ts).getTime() : NaN;
-      return Number.isNaN(t) ? -Infinity : t;
+      const t2 = ts ? new Date(ts).getTime() : NaN;
+      return Number.isNaN(t2) ? -Infinity : t2;
     };
     const isThreadUnread = (entry) => {
       const [, value] = entry;
@@ -147,13 +149,14 @@ function CommentsPanel({ className, style, onClose, visibleSortOptions }) {
   const availableSortOptions = visibleSortOptions ? COMMENT_SEARCH_OPTIONS.filter((option) => visibleSortOptions.includes(option.value)) : COMMENT_SEARCH_OPTIONS;
   const menuOptions = availableSortOptions.map((option) => ({
     ...option,
+    label: t(option.labelKey),
     onClick: () => handleOptionClick(option),
     selected: selectedOption === option.value
   }));
   const formatTimestamp = (timestamp) => {
     if (!timestamp) return "";
     if (moment(timestamp).isValid()) {
-      return moment.utc(timestamp).local().format("hh:mm A, MM-DD-YYYY");
+      return moment.utc(timestamp).local().format("LT, L");
     }
     return timestamp;
   };
@@ -164,7 +167,7 @@ function CommentsPanel({ className, style, onClose, visibleSortOptions }) {
       style,
       children: [
         /* @__PURE__ */ jsxs("div", { className: "comment-panel-header", children: [
-          /* @__PURE__ */ jsx("h2", { children: "Comments" }),
+          /* @__PURE__ */ jsx("h2", { children: t("commentsPanel.title") }),
           /* @__PURE__ */ jsx(
             "span",
             {
@@ -174,7 +177,7 @@ function CommentsPanel({ className, style, onClose, visibleSortOptions }) {
               onClick: () => {
                 setShowCommentPanel(false);
                 setSelectedOption("opt1");
-                onExitResolvedCommentsView == null ? void 0 : onExitResolvedCommentsView();
+                onExitResolvedCommentsView();
                 onClose == null ? void 0 : onClose();
               },
               onKeyDown: (e) => {
@@ -182,7 +185,7 @@ function CommentsPanel({ className, style, onClose, visibleSortOptions }) {
                   e.preventDefault();
                   setShowCommentPanel(false);
                   setSelectedOption("opt1");
-                  onExitResolvedCommentsView == null ? void 0 : onExitResolvedCommentsView();
+                  onExitResolvedCommentsView();
                   onClose == null ? void 0 : onClose();
                 }
               }
@@ -195,7 +198,7 @@ function CommentsPanel({ className, style, onClose, visibleSortOptions }) {
               Input,
               {
                 leftIcon: /* @__PURE__ */ jsx(SearchIcon, {}),
-                placeholder: "Search comments",
+                placeholder: t("commentsPanel.searchPlaceholder"),
                 type: "text",
                 value: searchTerm,
                 onChange: (e) => {
@@ -220,16 +223,18 @@ function CommentsPanel({ className, style, onClose, visibleSortOptions }) {
           Object.keys(comments).length > 0 ? /* @__PURE__ */ jsx("div", { className: "comment-panel-content", children: isLoadingResolvedComments ? /* @__PURE__ */ jsx(
             EmptyState,
             {
-              description: "Fetching resolved comments.",
+              description: t("commentsPanel.loadingResolvedDescription"),
               emptyStateIcon: /* @__PURE__ */ jsx(NoFilterResultsIcon, {}),
-              heading: "Loading resolved comments..."
+              heading: t("commentsPanel.loadingResolvedHeading")
             }
           ) : filteredEntries.length === 0 ? /* @__PURE__ */ jsx(
             EmptyState,
             {
-              description: selectedOption === "opt3" ? "No resolved comments to display." : searchTerm ? `We couldn't locate ${searchTerm}. Please try searching for something else.` : "We couldn't find any matching comments.",
+              description: selectedOption === "opt3" ? t("commentsPanel.noResolvedDescription") : searchTerm ? t("commentsPanel.searchNoMatchDescription", {
+                term: searchTerm
+              }) : t("commentsPanel.noMatchingDescription"),
               emptyStateIcon: /* @__PURE__ */ jsx(NoFilterResultsIcon, {}),
-              heading: "No results found"
+              heading: t("commentsPanel.noResultsHeading")
             }
           ) : filteredEntries.map(([key, value]) => {
             var _a, _b, _c;
@@ -289,7 +294,7 @@ function CommentsPanel({ className, style, onClose, visibleSortOptions }) {
                           !isRead && !isResolved && /* @__PURE__ */ jsx(
                             "span",
                             {
-                              "aria-label": "unread",
+                              "aria-label": t("commentsPanel.unread"),
                               style: {
                                 display: "inline-block",
                                 width: 8,
@@ -302,7 +307,7 @@ function CommentsPanel({ className, style, onClose, visibleSortOptions }) {
                             }
                           )
                         ] }),
-                        value[0].isEdited && /* @__PURE__ */ jsx("span", { children: "(edited)" })
+                        value[0].isEdited && /* @__PURE__ */ jsx("span", { children: t("commentsPanel.edited") })
                       ] })
                     ] }),
                     /* @__PURE__ */ jsxs("div", { className: "comment-panel-item-header-right", children: [
@@ -352,18 +357,14 @@ function CommentsPanel({ className, style, onClose, visibleSortOptions }) {
                     }
                   ),
                   showFooterRow && /* @__PURE__ */ jsxs("div", { className: "comment-panel-item-footer-row", children: [
-                    replyCount > 0 ? /* @__PURE__ */ jsxs(
+                    replyCount > 0 ? /* @__PURE__ */ jsx(
                       Button,
                       {
                         variant: "url",
                         onClick: () => onCommentItemClick(key, value),
-                        children: [
-                          replyCount,
-                          " ",
-                          replyCount === 1 ? "Reply" : "Replies"
-                        ]
+                        children: replyCount === 1 ? t("commentsPanel.reply", { count: replyCount }) : t("commentsPanel.replies", { count: replyCount })
                       }
-                    ) : /* @__PURE__ */ jsx("span", { className: "comment-panel-item-footer comment-panel-item-footer-muted", children: "No Replies" }),
+                    ) : /* @__PURE__ */ jsx("span", { className: "comment-panel-item-footer comment-panel-item-footer-muted", children: t("commentsPanel.noReplies") }),
                     threadBadgeLabel && /* @__PURE__ */ jsx(
                       Badge,
                       {
@@ -381,9 +382,9 @@ function CommentsPanel({ className, style, onClose, visibleSortOptions }) {
           }) }) : /* @__PURE__ */ jsx(
             EmptyState,
             {
-              description: "To add a new comment, simply click on any cell in the table and type your comment.",
+              description: t("commentsPanel.emptyDescription"),
               emptyStateIcon: /* @__PURE__ */ jsx(EmptyStateIcon, {}),
-              heading: "No comments to display"
+              heading: t("commentsPanel.emptyHeading")
             }
           )
         ] }),

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

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/components/CreateItemFlow/index.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAwB,MAAM,OAAO,CAAC;AAK7C,OAAO,KAAK,EAAE,mBAAmB,EAA0B,MAAM,wBAAwB,CAAC;AAC1F,OAAO,8BAA8B,CAAC;AAItC,YAAY,EAAE,mBAAmB,EAAE,MAAM,wBAAwB,CAAC;AAiFlE,eAAO,MAAM,cAAc,iDA0DzB,CAAC"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/components/CreateItemFlow/index.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAwB,MAAM,OAAO,CAAC;AAM7C,OAAO,KAAK,EAAE,mBAAmB,EAA0B,MAAM,wBAAwB,CAAC;AAC1F,OAAO,8BAA8B,CAAC;AAItC,YAAY,EAAE,mBAAmB,EAAE,MAAM,wBAAwB,CAAC;AAuFlE,eAAO,MAAM,cAAc,iDA+DzB,CAAC"}

package/dist/components/CreateItemFlow/index.js

@@ -6,18 +6,27 @@ import { Button } from "../Button/index.js";
 import { DynamicLayout } from "../DynamicLayout/index.js";
 import { Stepper } from "../Stepper/index.js";
 
+import { useTranslation } from "../../i18n/useTranslation.js";
 const createFlowImage = getAssetUrl("icons/createFlowImage.svg");
 function LeftPanelContent({
   leftPanelTitle,
   leftPanelDescription,
   leftPanelImage
 }) {
+  const { t } = useTranslation();
   return /* @__PURE__ */ jsxs("div", { className: "left-panel-content", children: [
     /* @__PURE__ */ jsxs("div", { className: "left-panel-title", children: [
       /* @__PURE__ */ jsx("h1", { children: leftPanelTitle }),
       /* @__PURE__ */ jsx("p", { children: leftPanelDescription })
     ] }),
-    leftPanelImage ?? /* @__PURE__ */ jsx("img", { alt: "Create Item Flow", className: "left-panel-image", src: createFlowImage })
+    leftPanelImage ?? /* @__PURE__ */ jsx(
+      "img",
+      {
+        alt: t("createItemFlow.imageAlt"),
+        className: "left-panel-image",
+        src: createFlowImage
+      }
+    )
   ] });
 }
 function RightContentPanel({
@@ -36,6 +45,7 @@ function RightContentPanel({
   onNext,
   totalSteps
 }) {
+  const { t } = useTranslation();
   const childArray = React__default.Children.toArray(children ?? []);
   return /* @__PURE__ */ jsxs(Fragment, { children: [
     showStepper && /* @__PURE__ */ jsx(
@@ -60,8 +70,8 @@ function RightContentPanel({
       }
     ),
     actionsChildren != null ? /* @__PURE__ */ jsx("div", { className: "actions", children: actionsChildren }) : /* @__PURE__ */ jsxs("div", { className: "actions", children: [
-      step === 1 ? /* @__PURE__ */ jsx(Button, { variant: "secondary", onClick: onCancel, children: "Cancel" }) : /* @__PURE__ */ jsx(Button, { variant: "secondary", onClick: onPrev, children: "Previous" }),
-      /* @__PURE__ */ jsx(Button, { variant: "primary", onClick: onNext, children: step === totalSteps ? "Submit" : "Next" })
+      step === 1 ? /* @__PURE__ */ jsx(Button, { variant: "secondary", onClick: onCancel, children: t("common.cancel") }) : /* @__PURE__ */ jsx(Button, { variant: "secondary", onClick: onPrev, children: t("common.previous") }),
+      /* @__PURE__ */ jsx(Button, { variant: "primary", onClick: onNext, children: step === totalSteps ? t("common.submit") : t("common.next") })
     ] })
   ] });
 }
@@ -76,18 +86,23 @@ const CreateItemFlow = memo(function CreateItemFlow2({
   onPrev,
   onStepClick,
   stepperVariant = "progress",
-  leftPanelTitle = "Create item",
+  leftPanelTitle,
   leftPanelDescription = "",
   leftPanelImage = null,
   actionsChildren = null,
   showStepper = true
 }) {
+  const { t } = useTranslation();
+  const resolvedLeftPanelTitle = leftPanelTitle ?? t("createItemFlow.defaultTitle");
   const steps = useMemo(
     () => Array.from({ length: totalSteps }, (_, idx) => ({
-      label: `Step ${idx + 1}`,
-      description: `Step ${idx + 1} of ${totalSteps}`
+      label: t("createItemFlow.stepLabel", { number: idx + 1 }),
+      description: t("createItemFlow.stepDescription", {
+        number: idx + 1,
+        total: totalSteps
+      })
     })),
-    [totalSteps]
+    [totalSteps, t]
   );
   const rightContent = /* @__PURE__ */ jsx(
     RightContentPanel,
@@ -114,7 +129,7 @@ const CreateItemFlow = memo(function CreateItemFlow2({
         {
           leftPanelDescription,
           leftPanelImage,
-          leftPanelTitle
+          leftPanelTitle: resolvedLeftPanelTitle
         }
       ),
       leftPanelWidth,

package/dist/components/DatePicker/datePickerFooter.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"datePickerFooter.d.ts","sourceRoot":"","sources":["../../../src/components/DatePicker/datePickerFooter.tsx"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAE,MAAM,EAAE,MAAM,QAAQ,CAAC;AAErC,MAAM,WAAW,qBAAqB;IACpC,mBAAmB,CAAC,EAAE,MAAM,CAAC,MAAM,EAAE,OAAO,CAAC,CAAC;IAC9C,oBAAoB,CAAC,EAAE,MAAM,CAAC,MAAM,EAAE,OAAO,CAAC,CAAC;IAC/C,kBAAkB,CAAC,EAAE,MAAM,CAAC,MAAM,EAAE,OAAO,CAAC,CAAC;IAC7C,eAAe,CAAC,EAAE,CAAC,IAAI,EAAE,MAAM,GAAG,IAAI,KAAK,IAAI,CAAC;IAChD,UAAU,EAAE,CAAC,OAAO,EAAE,OAAO,KAAK,IAAI,CAAC;IACvC,qBAAqB,CAAC,EAAE,MAAM,IAAI,CAAC;IACnC,sBAAsB,CAAC,EAAE,MAAM,IAAI,CAAC;IACpC,oBAAoB,CAAC,EAAE,MAAM,IAAI,CAAC;IAClC,SAAS,EAAE,CAAC,IAAI,EAAE,OAAO,KAAK,IAAI,CAAC;IACnC,kBAAkB,CAAC,EAAE,OAAO,CAAC;IAC7B,mBAAmB,CAAC,EAAE,OAAO,CAAC;IAC9B,iBAAiB,CAAC,EAAE,OAAO,CAAC;CAC7B;AAED,wBAAgB,gBAAgB,CAAC,EAC/B,mBAAmB,EACnB,oBAAoB,EACpB,kBAAkB,EAClB,eAAe,EACf,UAAU,EACV,qBAAqB,EACrB,sBAAsB,EACtB,oBAAoB,EACpB,SAAS,EACT,kBAAkB,EAClB,mBAAmB,EACnB,iBAAiB,GAClB,EAAE,qBAAqB,2CA2CvB"}
+{"version":3,"file":"datePickerFooter.d.ts","sourceRoot":"","sources":["../../../src/components/DatePicker/datePickerFooter.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,EAAE,MAAM,EAAE,MAAM,QAAQ,CAAC;AAErC,MAAM,WAAW,qBAAqB;IACpC,mBAAmB,CAAC,EAAE,MAAM,CAAC,MAAM,EAAE,OAAO,CAAC,CAAC;IAC9C,oBAAoB,CAAC,EAAE,MAAM,CAAC,MAAM,EAAE,OAAO,CAAC,CAAC;IAC/C,kBAAkB,CAAC,EAAE,MAAM,CAAC,MAAM,EAAE,OAAO,CAAC,CAAC;IAC7C,eAAe,CAAC,EAAE,CAAC,IAAI,EAAE,MAAM,GAAG,IAAI,KAAK,IAAI,CAAC;IAChD,UAAU,EAAE,CAAC,OAAO,EAAE,OAAO,KAAK,IAAI,CAAC;IACvC,qBAAqB,CAAC,EAAE,MAAM,IAAI,CAAC;IACnC,sBAAsB,CAAC,EAAE,MAAM,IAAI,CAAC;IACpC,oBAAoB,CAAC,EAAE,MAAM,IAAI,CAAC;IAClC,SAAS,EAAE,CAAC,IAAI,EAAE,OAAO,KAAK,IAAI,CAAC;IACnC,kBAAkB,CAAC,EAAE,OAAO,CAAC;IAC7B,mBAAmB,CAAC,EAAE,OAAO,CAAC;IAC9B,iBAAiB,CAAC,EAAE,OAAO,CAAC;CAC7B;AAED,wBAAgB,gBAAgB,CAAC,EAC/B,mBAAmB,EACnB,oBAAoB,EACpB,kBAAkB,EAClB,eAAe,EACf,UAAU,EACV,qBAAqB,EACrB,sBAAsB,EACtB,oBAAoB,EACpB,SAAS,EACT,kBAAkB,EAClB,mBAAmB,EACnB,iBAAiB,GAClB,EAAE,qBAAqB,2CA4CvB"}

package/dist/components/DatePicker/datePickerFooter.js

@@ -1,5 +1,6 @@
 import { jsxs, jsx } from "react/jsx-runtime";
 import { Button } from "../Button/index.js";
+import { useTranslation } from "../../i18n/useTranslation.js";
 function DatePickerFooter({
   tertiaryButtonProps,
   secondaryButtonProps,
@@ -14,6 +15,7 @@ function DatePickerFooter({
   hideSecondaryButton,
   hidePrimaryButton
 }) {
+  const { t } = useTranslation();
   const allButtonsHidden = hideTertiaryButton && hideSecondaryButton && hidePrimaryButton;
   const handleClear = () => {
     setSelectedDate == null ? void 0 : setSelectedDate(null);
@@ -34,9 +36,9 @@ function DatePickerFooter({
     {
       className: `datePicker-buttons-container ${allButtonsHidden ? "datePicker-buttons-container--hidden" : ""}`,
       children: [
-        !hideTertiaryButton && /* @__PURE__ */ jsx(Button, { size: "small", variant: "url", onClick: handleClear, ...tertiaryButtonProps, children: "Clear" }),
-        !hideSecondaryButton && /* @__PURE__ */ jsx(Button, { size: "small", variant: "secondary", onClick: handleCancel, ...secondaryButtonProps, children: "Cancel" }),
-        !hidePrimaryButton && /* @__PURE__ */ jsx(Button, { size: "small", variant: "primary", onClick: handleApply, ...primaryButtonProps, children: "Apply" })
+        !hideTertiaryButton && /* @__PURE__ */ jsx(Button, { size: "small", variant: "url", onClick: handleClear, ...tertiaryButtonProps, children: t("common.clear") }),
+        !hideSecondaryButton && /* @__PURE__ */ jsx(Button, { size: "small", variant: "secondary", onClick: handleCancel, ...secondaryButtonProps, children: t("common.cancel") }),
+        !hidePrimaryButton && /* @__PURE__ */ jsx(Button, { size: "small", variant: "primary", onClick: handleApply, ...primaryButtonProps, children: t("common.apply") })
       ]
     }
   );

package/dist/components/DatePicker/datePickerInput.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"datePickerInput.d.ts","sourceRoot":"","sources":["../../../src/components/DatePicker/datePickerInput.tsx"],"names":[],"mappings":"AACA,OAAO,KAA+D,MAAM,OAAO,CAAC;AACpF,OAAe,EAAE,KAAK,MAAM,EAAE,MAAM,QAAQ,CAAC;AAW7C,MAAM,WAAW,oBAAoB;IACnC,UAAU,EAAE,MAAM,CAAC;IACnB,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB,UAAU,CAAC,EAAE,OAAO,CAAC;IACrB,OAAO,CAAC,EAAE,OAAO,CAAC;IAClB,iBAAiB,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC,cAAc,GAAG,IAAI,CAAC,CAAC;IAC3D,YAAY,CAAC,EAAE,MAAM,GAAG,IAAI,CAAC;IAC7B,UAAU,CAAC,EAAE,MAAM,CAAC,MAAM,EAAE,OAAO,CAAC,CAAC;IACrC,MAAM,CAAC,EAAE,OAAO,CAAC;IACjB,SAAS,EAAE,CAAC,IAAI,EAAE,OAAO,KAAK,IAAI,CAAC;IACnC,aAAa,CAAC,EAAE,MAAM,CAAC;IACvB,kBAAkB,CAAC,EAAE,CAAC,KAAK,EAAE,MAAM,GAAG,MAAM,GAAG,IAAI,KAAK,IAAI,CAAC;IAC7D,OAAO,CAAC,EAAE,MAAM,GAAG,IAAI,CAAC;IACxB,OAAO,CAAC,EAAE,MAAM,GAAG,IAAI,CAAC;IACxB,QAAQ,CAAC,EAAE,MAAM,CAAC;IAClB,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,UAAU,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;IAC7B,EAAE,CAAC,EAAE,MAAM,CAAC;IACZ,aAAa,CAAC,EAAE,MAAM,CAAC;CACxB;AAKD,eAAO,MAAM,eAAe,sGAqQ3B,CAAC"}
+{"version":3,"file":"datePickerInput.d.ts","sourceRoot":"","sources":["../../../src/components/DatePicker/datePickerInput.tsx"],"names":[],"mappings":"AAAA,OAAO,KAA+D,MAAM,OAAO,CAAC;AACpF,OAAe,EAAE,KAAK,MAAM,EAAE,MAAM,QAAQ,CAAC;AAY7C,MAAM,WAAW,oBAAoB;IACnC,UAAU,EAAE,MAAM,CAAC;IACnB,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB,UAAU,CAAC,EAAE,OAAO,CAAC;IACrB,OAAO,CAAC,EAAE,OAAO,CAAC;IAClB,iBAAiB,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC,cAAc,GAAG,IAAI,CAAC,CAAC;IAC3D,YAAY,CAAC,EAAE,MAAM,GAAG,IAAI,CAAC;IAC7B,UAAU,CAAC,EAAE,MAAM,CAAC,MAAM,EAAE,OAAO,CAAC,CAAC;IACrC,MAAM,CAAC,EAAE,OAAO,CAAC;IACjB,SAAS,EAAE,CAAC,IAAI,EAAE,OAAO,KAAK,IAAI,CAAC;IACnC,aAAa,CAAC,EAAE,MAAM,CAAC;IACvB,kBAAkB,CAAC,EAAE,CAAC,KAAK,EAAE,MAAM,GAAG,MAAM,GAAG,IAAI,KAAK,IAAI,CAAC;IAC7D,OAAO,CAAC,EAAE,MAAM,GAAG,IAAI,CAAC;IACxB,OAAO,CAAC,EAAE,MAAM,GAAG,IAAI,CAAC;IACxB,QAAQ,CAAC,EAAE,MAAM,CAAC;IAClB,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,UAAU,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;IAC7B,EAAE,CAAC,EAAE,MAAM,CAAC;IACZ,aAAa,CAAC,EAAE,MAAM,CAAC;CACxB;AAKD,eAAO,MAAM,eAAe,sGAsQ3B,CAAC"}

package/dist/components/DatePicker/datePickerInput.js

@@ -1,6 +1,7 @@
 import { jsxs, jsx } from "react/jsx-runtime";
 import { forwardRef, useState, useRef, useCallback, useEffect } from "react";
 import moment from "moment";
+import { useTranslation } from "../../i18n/useTranslation.js";
 const FORMAT_MAP = {
   "DD-MM-YYYY": { day: [0, 2], month: [3, 5], year: [6, 10] },
   "MM-DD-YYYY": { day: [3, 5], month: [0, 2], year: [6, 10] },
@@ -11,7 +12,7 @@ const NUMBER_POSITIONS_YYYY_MM_DD = [0, 1, 2, 3, 5, 6, 8, 9];
 const DatePickerInput = forwardRef(
   ({
     dateString,
-    placeholder = "Select Date",
+    placeholder,
     isDisabled,
     isError,
     inputContainerRef,
@@ -30,6 +31,7 @@ const DatePickerInput = forwardRef(
     "data-testid": dataTestId,
     ...rest
   }, ref) => {
+    const { t } = useTranslation();
     const [isFocused, setIsFocused] = useState(false);
     const [inputValue, setInputValue] = useState("");
     const inputRef = useRef(null);
@@ -228,7 +230,7 @@ const DatePickerInput = forwardRef(
               "data-testid": dataTestId,
               disabled: isDisabled,
               id,
-              placeholder,
+              placeholder: placeholder ?? t("datePicker.selectDate"),
               readOnly,
               type: "text",
               value: inputValue,

package/dist/components/DateRangePicker/dateRangePickerCustom.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"dateRangePickerCustom.d.ts","sourceRoot":"","sources":["../../../src/components/DateRangePicker/dateRangePickerCustom.tsx"],"names":[],"mappings":"AAKA,wBAAgB,qBAAqB,CAAC,EAAE,yBAAyB,EAAE,aAAa,EAAE,EAAE,GAAG,2CActF"}
+{"version":3,"file":"dateRangePickerCustom.d.ts","sourceRoot":"","sources":["../../../src/components/DateRangePicker/dateRangePickerCustom.tsx"],"names":[],"mappings":"AAKA,wBAAgB,qBAAqB,CAAC,EAAE,yBAAyB,EAAE,aAAa,EAAE,EAAE,GAAG,2CAetF"}

package/dist/components/DateRangePicker/dateRangePickerCustom.js

@@ -1,14 +1,16 @@
 import { jsxs, jsx } from "react/jsx-runtime";
-import { rangeSelectorTypes } from "./utils.js";
+import { getRangeSelectorTypes } from "./utils.js";
 import { RadioButtonGroup } from "../RadioButtonGroup/index.js";
+import { useTranslation } from "../../i18n/useTranslation.js";
 function DateRangePickerCustom({ handleRangeSelectorChange, selectedRange }) {
+  const { t } = useTranslation();
   return /* @__PURE__ */ jsxs("div", { className: "dateRangePicker-show-range-main-container", children: [
-    /* @__PURE__ */ jsx("div", { className: "dateRangePicker-shortcut-heading", children: "Date Range" }),
+    /* @__PURE__ */ jsx("div", { className: "dateRangePicker-shortcut-heading", children: t("dateRangePicker.rangeHeading") }),
     /* @__PURE__ */ jsx("div", { className: "dateRangePicker-shortcut-list", children: /* @__PURE__ */ jsx(
       RadioButtonGroup,
       {
         className: "dateRangePicker-shortcut-list-item",
-        options: rangeSelectorTypes,
+        options: getRangeSelectorTypes(t),
         value: selectedRange,
         onChange: handleRangeSelectorChange
       }

package/dist/components/DateRangePicker/dateRangePickerFooter.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"dateRangePickerFooter.d.ts","sourceRoot":"","sources":["../../../src/components/DateRangePicker/dateRangePickerFooter.tsx"],"names":[],"mappings":"AAIA,wBAAgB,qBAAqB,CAAC,EACpC,kBAAkB,EAClB,gBAAgB,EAChB,iBAAiB,EACjB,sBAAsB,EACtB,mBAAmB,EACnB,gBAAgB,EAChB,kBAAkB,EAClB,cAAc,GACf,EAAE,GAAG,2CAkCL"}
+{"version":3,"file":"dateRangePickerFooter.d.ts","sourceRoot":"","sources":["../../../src/components/DateRangePicker/dateRangePickerFooter.tsx"],"names":[],"mappings":"AAIA,wBAAgB,qBAAqB,CAAC,EACpC,kBAAkB,EAClB,gBAAgB,EAChB,iBAAiB,EACjB,sBAAsB,EACtB,mBAAmB,EACnB,gBAAgB,EAChB,kBAAkB,EAClB,cAAc,GACf,EAAE,GAAG,2CAsCL"}

package/dist/components/DateRangePicker/dateRangePickerFooter.js

@@ -1,5 +1,6 @@
 import { jsxs, jsx } from "react/jsx-runtime";
 import { Button } from "../Button/index.js";
+import { useTranslation } from "../../i18n/useTranslation.js";
 function DateRangePickerFooter({
   selectedDaysNumber,
   handleResetDates,
@@ -10,16 +11,15 @@ function DateRangePickerFooter({
   primaryButtonProps,
   hasInputErrors
 }) {
+  const { t } = useTranslation();
   return /* @__PURE__ */ jsxs("div", { className: "dateRangePicker-footer-container", children: [
     /* @__PURE__ */ jsx("div", { className: "dateRangePicker-buttons-left-container", children: /* @__PURE__ */ jsxs("div", { className: "dateRangePicker-footer-label-container", children: [
-      "Selected: ",
-      /* @__PURE__ */ jsxs("span", { className: "dateRangePicker-footer-value", children: [
-        selectedDaysNumber,
-        " days"
-      ] })
+      t("dateRangePicker.selectedLabel"),
+      " ",
+      /* @__PURE__ */ jsx("span", { className: "dateRangePicker-footer-value", children: t("dateRangePicker.daysCount", { count: selectedDaysNumber }) })
     ] }) }),
     /* @__PURE__ */ jsxs("div", { className: "dateRangePicker-buttons-right-container", children: [
-      /* @__PURE__ */ jsx(Button, { size: "small", variant: "url", onClick: handleResetDates, children: "Clear" }),
+      /* @__PURE__ */ jsx(Button, { size: "small", variant: "url", onClick: handleResetDates, children: t("common.clear") }),
       onSecondaryButtonClick && /* @__PURE__ */ jsx(
         Button,
         {
@@ -27,7 +27,7 @@ function DateRangePickerFooter({
           variant: "secondary",
           onClick: handleCancelDates,
           ...tertiaryButtonProps,
-          children: "Cancel"
+          children: t("common.cancel")
         }
       ),
       /* @__PURE__ */ jsx(
@@ -38,7 +38,7 @@ function DateRangePickerFooter({
           variant: "primary",
           onClick: handleApplyDates,
           ...primaryButtonProps,
-          children: "Apply"
+          children: t("common.apply")
         }
       )
     ] })

package/dist/components/DateRangePicker/dateRangePickerInput.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"dateRangePickerInput.d.ts","sourceRoot":"","sources":["../../../src/components/DateRangePicker/dateRangePickerInput.tsx"],"names":[],"mappings":"AAMA,wBAAgB,oBAAoB,CAAC,EACnC,iBAAiB,EACjB,eAAe,EACf,iBAAiB,EACjB,mBAAmB,EACnB,aAAa,EACb,eAAe,EACf,iBAAiB,EACjB,UAAU,EACV,OAAO,EACP,gBAAgB,EAChB,cAAc,EACd,aAA4B,EAC5B,uBAAuB,EACvB,qBAAqB,EACrB,OAAO,EACP,OAAO,EACP,QAAQ,EACR,cAAc,EACd,kBAAkB,EAClB,kBAAkB,EAClB,YAAY,EACZ,UAAU,GACX,EAAE,GAAG,2CAkfL"}
+{"version":3,"file":"dateRangePickerInput.d.ts","sourceRoot":"","sources":["../../../src/components/DateRangePicker/dateRangePickerInput.tsx"],"names":[],"mappings":"AAOA,wBAAgB,oBAAoB,CAAC,EACnC,iBAAiB,EACjB,eAAe,EACf,iBAAiB,EACjB,mBAAmB,EACnB,aAAa,EACb,eAAe,EACf,iBAAiB,EACjB,UAAU,EACV,OAAO,EACP,gBAAgB,EAChB,cAAc,EACd,aAA4B,EAC5B,uBAAuB,EACvB,qBAAqB,EACrB,OAAO,EACP,OAAO,EACP,QAAQ,EACR,cAAc,EACd,kBAAkB,EAClB,kBAAkB,EAClB,YAAY,EACZ,UAAU,GACX,EAAE,GAAG,2CAmfL"}

package/dist/components/DateRangePicker/dateRangePickerInput.js

@@ -2,6 +2,7 @@ import { jsxs, jsx } from "react/jsx-runtime";
 import { useState, useEffect } from "react";
 import moment from "moment";
 import { getAssetUrl } from "../../utils/assetBase.js";
+import { useTranslation } from "../../i18n/useTranslation.js";
 const calendarIcon = getAssetUrl("icons/calendar.svg");
 function DateRangePickerInput({
   inputContainerRef,
@@ -27,6 +28,7 @@ function DateRangePickerInput({
   resetTrigger,
   customIcon
 }) {
+  const { t } = useTranslation();
   const [startInputValue, setStartInputValue] = useState("");
   const [endInputValue, setEndInputValue] = useState("");
   const [startErrorState, setStartErrorState] = useState(false);
@@ -345,7 +347,7 @@ function DateRangePickerInput({
           "input",
           {
             ref: startDateInputRef,
-            placeholder: "Start Date",
+            placeholder: t("dateRangePicker.startPlaceholder"),
             readOnly,
             type: "text",
             value: startInputValue,
@@ -363,7 +365,7 @@ function DateRangePickerInput({
           "input",
           {
             ref: endDateInputRef,
-            placeholder: "End Date",
+            placeholder: t("dateRangePicker.endPlaceholder"),
             readOnly,
             type: "text",
             value: endInputValue,