@underverse-ui/underverse 0.1.5 → 0.1.7

package/dist/index.d.cts

@@ -328,8 +328,9 @@ interface AlertProps {
     dismissible?: boolean;
     onClose?: () => void;
     actions?: ReactNode;
+    closeAriaLabel?: string;
 }
-declare const Alert: ({ title, description, variant, className, icon, dismissible, onClose, actions }: AlertProps) => react_jsx_runtime.JSX.Element | null;
+declare const Alert: ({ title, description, variant, className, icon, dismissible, onClose, actions, closeAriaLabel }: AlertProps) => react_jsx_runtime.JSX.Element | null;
 
 interface GlobalLoadingProps {
     className?: string;
@@ -461,6 +462,24 @@ interface PaginationProps {
     pageSizeOptions?: number[];
     onPageSizeChange?: (size: number) => void;
     totalItems?: number;
+    labels?: {
+        navigationLabel?: string;
+        showingResults?: (ctx: {
+            startItem: number;
+            endItem: number;
+            totalItems?: number;
+        }) => string;
+        firstPage?: string;
+        previousPage?: string;
+        previous?: string;
+        nextPage?: string;
+        next?: string;
+        lastPage?: string;
+        itemsPerPage?: string;
+        search?: string;
+        noOptions?: string;
+        pageNumber?: (page: number) => string;
+    };
 }
 declare const Pagination: React$1.FC<PaginationProps>;
 
@@ -488,6 +507,9 @@ interface DatePickerProps {
     size?: "sm" | "md";
     label?: string;
     required?: boolean;
+    todayLabel?: string;
+    clearLabel?: string;
+    weekdayLabels?: string[];
 }
 declare const DatePicker: React$1.FC<DatePickerProps>;
 
@@ -716,9 +738,16 @@ interface DataTableProps<T> {
     enableDensityToggle?: boolean;
     striped?: boolean;
     className?: string;
+    labels?: {
+        density?: string;
+        columns?: string;
+        compact?: string;
+        normal?: string;
+        comfortable?: string;
+    };
 }
 declare function DataTable<T extends Record<string, any>>({ columns, data, rowKey, loading, total, page, pageSize, onQueryChange, caption, toolbar, enableColumnVisibilityToggle, enableDensityToggle, striped, // Mặc định bật màu nền sẽn kẽ cho các dòng
-className, }: DataTableProps<T>): react_jsx_runtime.JSX.Element;
+className, labels, }: DataTableProps<T>): react_jsx_runtime.JSX.Element;
 
 interface TableProps extends React__default.HTMLAttributes<HTMLTableElement> {
     containerClassName?: string;
@@ -748,8 +777,11 @@ interface NotificationModalProps {
     isOpen: boolean;
     onClose: () => void;
     notification: NotificationItem | null;
+    titleText?: string;
+    openLinkText?: string;
+    closeText?: string;
 }
-declare function NotificationModal({ isOpen, onClose, notification }: NotificationModalProps): react_jsx_runtime.JSX.Element | null;
+declare function NotificationModal({ isOpen, onClose, notification, titleText, openLinkText, closeText }: NotificationModalProps): react_jsx_runtime.JSX.Element | null;
 
 interface FloatingContactsProps {
     className?: string;

package/dist/index.d.ts

@@ -328,8 +328,9 @@ interface AlertProps {
     dismissible?: boolean;
     onClose?: () => void;
     actions?: ReactNode;
+    closeAriaLabel?: string;
 }
-declare const Alert: ({ title, description, variant, className, icon, dismissible, onClose, actions }: AlertProps) => react_jsx_runtime.JSX.Element | null;
+declare const Alert: ({ title, description, variant, className, icon, dismissible, onClose, actions, closeAriaLabel }: AlertProps) => react_jsx_runtime.JSX.Element | null;
 
 interface GlobalLoadingProps {
     className?: string;
@@ -461,6 +462,24 @@ interface PaginationProps {
     pageSizeOptions?: number[];
     onPageSizeChange?: (size: number) => void;
     totalItems?: number;
+    labels?: {
+        navigationLabel?: string;
+        showingResults?: (ctx: {
+            startItem: number;
+            endItem: number;
+            totalItems?: number;
+        }) => string;
+        firstPage?: string;
+        previousPage?: string;
+        previous?: string;
+        nextPage?: string;
+        next?: string;
+        lastPage?: string;
+        itemsPerPage?: string;
+        search?: string;
+        noOptions?: string;
+        pageNumber?: (page: number) => string;
+    };
 }
 declare const Pagination: React$1.FC<PaginationProps>;
 
@@ -488,6 +507,9 @@ interface DatePickerProps {
     size?: "sm" | "md";
     label?: string;
     required?: boolean;
+    todayLabel?: string;
+    clearLabel?: string;
+    weekdayLabels?: string[];
 }
 declare const DatePicker: React$1.FC<DatePickerProps>;
 
@@ -716,9 +738,16 @@ interface DataTableProps<T> {
     enableDensityToggle?: boolean;
     striped?: boolean;
     className?: string;
+    labels?: {
+        density?: string;
+        columns?: string;
+        compact?: string;
+        normal?: string;
+        comfortable?: string;
+    };
 }
 declare function DataTable<T extends Record<string, any>>({ columns, data, rowKey, loading, total, page, pageSize, onQueryChange, caption, toolbar, enableColumnVisibilityToggle, enableDensityToggle, striped, // Mặc định bật màu nền sẽn kẽ cho các dòng
-className, }: DataTableProps<T>): react_jsx_runtime.JSX.Element;
+className, labels, }: DataTableProps<T>): react_jsx_runtime.JSX.Element;
 
 interface TableProps extends React__default.HTMLAttributes<HTMLTableElement> {
     containerClassName?: string;
@@ -748,8 +777,11 @@ interface NotificationModalProps {
     isOpen: boolean;
     onClose: () => void;
     notification: NotificationItem | null;
+    titleText?: string;
+    openLinkText?: string;
+    closeText?: string;
 }
-declare function NotificationModal({ isOpen, onClose, notification }: NotificationModalProps): react_jsx_runtime.JSX.Element | null;
+declare function NotificationModal({ isOpen, onClose, notification, titleText, openLinkText, closeText }: NotificationModalProps): react_jsx_runtime.JSX.Element | null;
 
 interface FloatingContactsProps {
     className?: string;

package/dist/index.js

@@ -2485,7 +2485,7 @@ var variantIcons = {
   warning: /* @__PURE__ */ jsx18(WarningIcon, { className: "h-4 w-4 text-warning" }),
   error: /* @__PURE__ */ jsx18(ErrorIcon, { className: "h-4 w-4 text-destructive" })
 };
-var Alert = ({ title, description, variant = "default", className, icon, dismissible = false, onClose, actions }) => {
+var Alert = ({ title, description, variant = "default", className, icon, dismissible = false, onClose, actions, closeAriaLabel }) => {
   const [open, setOpen] = useState13(true);
   const t = useTranslations2("Common");
   if (!open) return null;
@@ -2511,7 +2511,7 @@ var Alert = ({ title, description, variant = "default", className, icon, dismiss
           {
             onClick: handleClose,
             className: "rounded-md p-1 hover:bg-accent focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring",
-            "aria-label": t("closeAlert"),
+            "aria-label": closeAriaLabel || t("closeAlert"),
             children: /* @__PURE__ */ jsx18(X6, { className: "h-4 w-4" })
           }
         )
@@ -2522,7 +2522,7 @@ var Alert = ({ title, description, variant = "default", className, icon, dismiss
 var Alert_default = Alert;
 
 // ../../components/ui/GlobalLoading.tsx
-import { useEffect as useEffect7, useState as useState14 } from "react";
+import React14, { useEffect as useEffect7, useState as useState14 } from "react";
 import { Activity as Activity2 } from "lucide-react";
 
 // ../../lib/utils/loading.ts
@@ -2641,21 +2641,24 @@ var ButtonLoading = ({
   disabled,
   loadingText
 }) => {
+  const child = React14.isValidElement(children) ? React14.cloneElement(children, {
+    disabled: (children.props?.disabled ?? false) || disabled || isLoading,
+    "aria-busy": isLoading || void 0
+  }) : children;
   return /* @__PURE__ */ jsxs17(
-    "button",
+    "div",
     {
       className: cn(
-        "relative",
+        "relative inline-block",
         isLoading && "cursor-not-allowed",
         className
       ),
-      disabled: disabled || isLoading,
       children: [
-        isLoading && /* @__PURE__ */ jsxs17("div", { className: "absolute inset-0 flex items-center justify-center", children: [
+        isLoading && /* @__PURE__ */ jsxs17("div", { className: "absolute inset-0 flex items-center justify-center pointer-events-none", children: [
           /* @__PURE__ */ jsx19(Activity2, { className: "w-4 h-4 animate-spin text-primary-foreground" }),
           loadingText && /* @__PURE__ */ jsx19("span", { className: "ml-2 text-sm", children: loadingText })
         ] }),
-        /* @__PURE__ */ jsx19("div", { className: cn(isLoading && "invisible"), children })
+        /* @__PURE__ */ jsx19("div", { className: cn(isLoading && "opacity-50 pointer-events-none"), children: child })
       ]
     }
   );
@@ -3572,7 +3575,8 @@ var Pagination = ({
   pageSize,
   pageSizeOptions,
   onPageSizeChange,
-  totalItems
+  totalItems,
+  labels
 }) => {
   const t = useTranslations4("Pagination");
   const createPageArray = () => {
@@ -3626,8 +3630,8 @@ var Pagination = ({
     }
   };
   if (totalPages <= 1) return null;
-  return /* @__PURE__ */ jsxs22("nav", { className: cn("flex flex-col gap-4", className), "aria-label": t("navigationLabel"), children: [
-    showInfo && totalItems && /* @__PURE__ */ jsx24("div", { className: "text-sm text-muted-foreground text-center", children: t("showingResults", { startItem: startItem || 0, endItem: endItem || 0, totalItems }) }),
+  return /* @__PURE__ */ jsxs22("nav", { className: cn("flex flex-col gap-4", className), "aria-label": labels?.navigationLabel || t("navigationLabel"), children: [
+    showInfo && totalItems && /* @__PURE__ */ jsx24("div", { className: "text-sm text-muted-foreground text-center", children: labels?.showingResults ? labels.showingResults({ startItem: startItem || 0, endItem: endItem || 0, totalItems }) : t("showingResults", { startItem: startItem || 0, endItem: endItem || 0, totalItems }) }),
     /* @__PURE__ */ jsxs22("div", { className: "flex items-center justify-center gap-1", children: [
       showFirstLast && /* @__PURE__ */ jsx24(
         Button_default,
@@ -3638,8 +3642,8 @@ var Pagination = ({
           onClick: () => onChange(1),
           disabled: disabled || page === 1,
           className: "hidden sm:flex",
-          title: t("firstPage"),
-          "aria-label": t("firstPage"),
+          title: labels?.firstPage || t("firstPage"),
+          "aria-label": labels?.firstPage || t("firstPage"),
           "aria-disabled": disabled || page === 1
         }
       ),
@@ -3651,10 +3655,10 @@ var Pagination = ({
           icon: ChevronLeft,
           onClick: () => onChange(Math.max(1, page - 1)),
           disabled: disabled || page === 1,
-          title: t("previousPage"),
-          "aria-label": t("previousPage"),
+          title: labels?.previousPage || t("previousPage"),
+          "aria-label": labels?.previousPage || t("previousPage"),
           "aria-disabled": disabled || page === 1,
-          children: /* @__PURE__ */ jsx24("span", { className: "hidden sm:inline", children: t("previous") })
+          children: /* @__PURE__ */ jsx24("span", { className: "hidden sm:inline", children: labels?.previous || t("previous") })
         }
       ),
       showPageNumbers && createPageArray().map((p, i) => {
@@ -3671,7 +3675,7 @@ var Pagination = ({
             onClick: () => onChange(pageNumber),
             disabled,
             className: cn("min-w-[2.5rem]", isActive && "font-semibold"),
-            "aria-label": t("pageNumber", { page: pageNumber }),
+            "aria-label": labels?.pageNumber ? labels.pageNumber(pageNumber) : t("pageNumber", { page: pageNumber }),
             "aria-current": isActive ? "page" : void 0,
             children: pageNumber
           },
@@ -3686,10 +3690,10 @@ var Pagination = ({
           iconRight: ChevronRight2,
           onClick: () => onChange(Math.min(totalPages, page + 1)),
           disabled: disabled || page === totalPages,
-          title: t("nextPage"),
-          "aria-label": t("nextPage"),
+          title: labels?.nextPage || t("nextPage"),
+          "aria-label": labels?.nextPage || t("nextPage"),
           "aria-disabled": disabled || page === totalPages,
-          children: /* @__PURE__ */ jsx24("span", { className: "hidden sm:inline", children: t("next") })
+          children: /* @__PURE__ */ jsx24("span", { className: "hidden sm:inline", children: labels?.next || t("next") })
         }
       ),
       showFirstLast && /* @__PURE__ */ jsx24(
@@ -3701,15 +3705,15 @@ var Pagination = ({
           onClick: () => onChange(totalPages),
           disabled: disabled || page === totalPages,
           className: "hidden sm:flex",
-          title: t("lastPage"),
-          "aria-label": t("lastPage"),
+          title: labels?.lastPage || t("lastPage"),
+          "aria-label": labels?.lastPage || t("lastPage"),
           "aria-disabled": disabled || page === totalPages
         }
       )
     ] }),
     pageSizeOptions && onPageSizeChange && /* @__PURE__ */ jsxs22("div", { className: "flex items-center justify-center gap-2 text-sm", children: [
       /* @__PURE__ */ jsxs22("span", { className: "text-muted-foreground", children: [
-        t("itemsPerPage"),
+        labels?.itemsPerPage || t("itemsPerPage"),
         ":"
       ] }),
       /* @__PURE__ */ jsx24("div", { className: "w-20", children: /* @__PURE__ */ jsx24(
@@ -3719,8 +3723,8 @@ var Pagination = ({
           value: pageSize?.toString() || "10",
           onChange: handlePageSizeChange,
           placeholder: "10",
-          searchPlaceholder: t("search"),
-          emptyText: t("noOptions"),
+          searchPlaceholder: labels?.search || t("search"),
+          emptyText: labels?.noOptions || t("noOptions"),
           disabled
         }
       ) })
@@ -3976,7 +3980,10 @@ var DatePicker = ({
   disabled = false,
   size = "md",
   label,
-  required
+  required,
+  todayLabel,
+  clearLabel,
+  weekdayLabels
 }) => {
   const t = useTranslations5("DatePicker");
   const locale = useLocale();
@@ -4117,10 +4124,10 @@ var DatePicker = ({
           children: [
             /* @__PURE__ */ jsxs23("div", { className: "flex items-center justify-between mb-4", children: [
               /* @__PURE__ */ jsx27(Button_default, { variant: "ghost", size: "sm", onClick: () => navigateMonth("prev"), className: "p-1 h-auto", children: /* @__PURE__ */ jsx27(ChevronLeft2, { className: "h-4 w-4" }) }),
-              /* @__PURE__ */ jsx27("div", { className: "text-sm font-semibold", children: viewDate.toLocaleDateString(locale === "vi" /* VI */ ? "vi-VN" : "en-US", { month: "long", year: "numeric" }) }),
+              /* @__PURE__ */ jsx27("div", { className: "text-sm font-semibold", children: viewDate.toLocaleDateString("en-US", { month: "long", year: "numeric" }) }),
               /* @__PURE__ */ jsx27(Button_default, { variant: "ghost", size: "sm", onClick: () => navigateMonth("next"), className: "p-1 h-auto", children: /* @__PURE__ */ jsx27(ChevronRight3, { className: "h-4 w-4" }) })
             ] }),
-            /* @__PURE__ */ jsx27("div", { className: cn("grid grid-cols-7 gap-1", size === "sm" ? "mb-1" : "mb-2"), children: (locale === "vi" /* VI */ ? t("weekdays").split(",") : ["Su", "Mo", "Tu", "We", "Th", "Fr", "Sa"]).map((day) => /* @__PURE__ */ jsx27("div", { className: cn("text-muted-foreground text-center font-medium", size === "sm" ? "text-[10px] py-0.5" : "text-xs py-1"), children: day }, day)) }),
+            /* @__PURE__ */ jsx27("div", { className: cn("grid grid-cols-7 gap-1", size === "sm" ? "mb-1" : "mb-2"), children: (weekdayLabels || ["Su", "Mo", "Tu", "We", "Th", "Fr", "Sa"]).map((day) => /* @__PURE__ */ jsx27("div", { className: cn("text-muted-foreground text-center font-medium", size === "sm" ? "text-[10px] py-0.5" : "text-xs py-1"), children: day }, day)) }),
             /* @__PURE__ */ jsx27("div", { className: "grid grid-cols-7 gap-1", children: renderCalendar() })
           ]
         }
@@ -5643,7 +5650,8 @@ function DataTable({
   enableDensityToggle = true,
   striped = true,
   // Mặc định bật màu nền sẽn kẽ cho các dòng
-  className
+  className,
+  labels
 }) {
   const t = useTranslations7("Common");
   const [visibleCols, setVisibleCols] = React29.useState(() => columns.filter((c) => c.visible !== false).map((c) => c.key));
@@ -5823,12 +5831,12 @@ function DataTable({
           {
             trigger: /* @__PURE__ */ jsxs32(Button_default, { variant: "ghost", size: "sm", className: "h-8 px-2", children: [
               /* @__PURE__ */ jsx38("svg", { className: "w-4 h-4 mr-1", fill: "none", stroke: "currentColor", viewBox: "0 0 24 24", children: /* @__PURE__ */ jsx38("path", { strokeLinecap: "round", strokeLinejoin: "round", strokeWidth: 2, d: "M4 6h16M4 10h16M4 14h16M4 18h16" }) }),
-              t("density")
+              labels?.density || t("density")
             ] }),
             items: [
-              { label: t("compact"), onClick: () => setDensity("compact") },
-              { label: t("normal"), onClick: () => setDensity("normal") },
-              { label: t("comfortable"), onClick: () => setDensity("comfortable") }
+              { label: labels?.compact || t("compact"), onClick: () => setDensity("compact") },
+              { label: labels?.normal || t("normal"), onClick: () => setDensity("normal") },
+              { label: labels?.comfortable || t("comfortable"), onClick: () => setDensity("comfortable") }
             ]
           }
         ),
@@ -5845,7 +5853,7 @@ function DataTable({
                   d: "M9 17V7m0 10a2 2 0 01-2 2H5a2 2 0 01-2-2V7a2 2 0 012-2h2a2 2 0 012 2m0 10a2 2 0 002 2h2a2 2 0 002-2M9 7a2 2 0 012-2h2a2 2 0 012 2m0 10V7m0 10a2 2 0 002 2h2a2 2 0 002-2V7a2 2 0 00-2-2h-2a2 2 0 00-2 2"
                 }
               ) }),
-              t("columns")
+              labels?.columns || t("columns")
             ] }),
             children: columns.map((c) => /* @__PURE__ */ jsxs32(
               DropdownMenuItem,
@@ -5925,7 +5933,7 @@ var DataTable_default = DataTable;
 import { ExternalLink } from "lucide-react";
 import { useTranslations as useTranslations8 } from "next-intl";
 import { jsx as jsx39, jsxs as jsxs33 } from "react/jsx-runtime";
-function NotificationModal({ isOpen, onClose, notification }) {
+function NotificationModal({ isOpen, onClose, notification, titleText, openLinkText, closeText }) {
   const t = useTranslations8("Common");
   if (!notification) return null;
   const formatTime2 = (dateString) => {
@@ -5950,7 +5958,7 @@ function NotificationModal({ isOpen, onClose, notification }) {
     {
       isOpen,
       onClose,
-      title: t("notifications"),
+      title: titleText || t("notifications"),
       size: "md",
       children: /* @__PURE__ */ jsxs33("div", { className: "space-y-4", children: [
         /* @__PURE__ */ jsxs33("div", { className: "flex items-center gap-2 pb-2 border-b border-border", children: [
@@ -5973,7 +5981,7 @@ function NotificationModal({ isOpen, onClose, notification }) {
               className: "gap-2",
               children: [
                 /* @__PURE__ */ jsx39(ExternalLink, { className: "w-4 h-4" }),
-                t("openLink")
+                openLinkText || t("openLink")
               ]
             }
           ),
@@ -5983,7 +5991,7 @@ function NotificationModal({ isOpen, onClose, notification }) {
               variant: "ghost",
               size: "sm",
               onClick: onClose,
-              children: t("close")
+              children: closeText || t("close")
             }
           )
         ] })