@expcat/tigercat-react 2.0.19 → 2.1.1

package/dist/chunk-PY2VUNEJ.mjs

@@ -0,0 +1,494 @@
+import {
+  VirtualList
+} from "./chunk-Y5X3G2LD.mjs";
+import {
+  renderOverlayPortal,
+  useAnchoredOverlay
+} from "./chunk-HKAZXG74.mjs";
+import {
+  useTigerConfig
+} from "./chunk-YSIXURBW.mjs";
+
+// src/components/TreeSelect.tsx
+import { useState, useMemo, useRef, useId, useLayoutEffect, useCallback } from "react";
+import {
+  resolveLocaleText,
+  mergeTigerLocale,
+  treeSelectBaseClasses,
+  treeSelectSearchClasses,
+  treeSelectEmptyClasses,
+  getTreeSelectTriggerClasses,
+  getTreeSelectNodeClasses,
+  getTreeSelectDropdownClasses,
+  getTreeSelectDisplayLabel,
+  getAllTreeSelectKeys,
+  flattenTreeSelectNodes,
+  filterTreeSelectNodes,
+  getTreeSelectVisibleIndex,
+  alignTreeSelectVirtualScroll,
+  TREE_SELECT_DEFAULT_HEIGHT,
+  TREE_SELECT_DEFAULT_ITEM_HEIGHT,
+  getPickerComboboxAria,
+  getPickerListboxAria,
+  getPickerOptionAria,
+  getPickerTriggerKeyAction,
+  getPickerNavigationIndex,
+  getPickerOptionId,
+  findFirstEnabledIndex,
+  classNames,
+  icon20ViewBox,
+  chevronDownSolidIcon20PathD,
+  chevronRightSolidIcon20PathD,
+  closeSolidIcon20PathD
+} from "@expcat/tigercat-core";
+import { jsx, jsxs } from "react/jsx-runtime";
+var TREESELECT_KEYS = /* @__PURE__ */ new Set([
+  "value",
+  "treeData",
+  "placeholder",
+  "size",
+  "disabled",
+  "clearable",
+  "multiple",
+  "searchable",
+  "searchValue",
+  "defaultSearchValue",
+  "emptyText",
+  "defaultExpandAll",
+  "virtual",
+  "height",
+  "itemHeight",
+  "onChange",
+  "onSearchChange"
+]);
+var TreeSelect = (props) => {
+  const {
+    value,
+    treeData = [],
+    placeholder = "Please select",
+    size = "md",
+    disabled = false,
+    clearable = false,
+    multiple = false,
+    searchable = false,
+    searchValue,
+    defaultSearchValue = "",
+    emptyText,
+    defaultExpandAll = false,
+    virtual = false,
+    height = TREE_SELECT_DEFAULT_HEIGHT,
+    itemHeight = TREE_SELECT_DEFAULT_ITEM_HEIGHT,
+    className,
+    onChange,
+    onSearchChange,
+    locale,
+    ...rest
+  } = props;
+  const config = useTigerConfig();
+  const mergedLocale = useMemo(
+    () => mergeTigerLocale(config.locale, locale),
+    [config.locale, locale]
+  );
+  const divProps = {};
+  for (const key of Object.keys(rest)) {
+    if (!TREESELECT_KEYS.has(key)) {
+      divProps[key] = rest[key];
+    }
+  }
+  const instanceId = useId();
+  const listboxId = `tiger-treeselect-listbox-${instanceId}`;
+  const [isOpen, setIsOpen] = useState(false);
+  const [uncontrolledSearchValue, setUncontrolledSearchValue] = useState(defaultSearchValue);
+  const searchQuery = searchValue ?? uncontrolledSearchValue;
+  const [expandedKeys, setExpandedKeys] = useState(
+    () => defaultExpandAll ? new Set(getAllTreeSelectKeys(treeData)) : /* @__PURE__ */ new Set()
+  );
+  const containerRef = useRef(null);
+  const triggerRef = useRef(null);
+  const dropdownRef = useRef(null);
+  const virtualListWrapperRef = useRef(null);
+  const [activeIndex, setActiveIndex] = useState(-1);
+  const overlay = useAnchoredOverlay({
+    enabled: isOpen,
+    referenceRef: triggerRef,
+    floatingRef: dropdownRef,
+    containerRef,
+    placement: "bottom-start",
+    offset: 4,
+    matchReferenceWidth: true,
+    dismissOnOutside: true,
+    dismissOnEscape: true,
+    restoreFocusOnDismiss: true,
+    onDismiss: closeDropdown
+  });
+  const displayLabel = useMemo(() => getTreeSelectDisplayLabel(treeData, value), [treeData, value]);
+  const showClearButton = clearable && !disabled && value !== void 0 && (Array.isArray(value) ? value.length > 0 : value !== "");
+  const matchedKeys = useMemo(() => {
+    if (!searchQuery) return null;
+    return filterTreeSelectNodes(treeData, searchQuery);
+  }, [treeData, searchQuery]);
+  const effectiveExpandedKeys = matchedKeys ?? expandedKeys;
+  const flatNodes = useMemo(
+    () => flattenTreeSelectNodes(treeData, effectiveExpandedKeys),
+    [treeData, effectiveExpandedKeys]
+  );
+  const visibleNodes = useMemo(() => {
+    if (!matchedKeys) return flatNodes;
+    return flatNodes.filter((f) => matchedKeys.has(f.node.key));
+  }, [flatNodes, matchedKeys]);
+  const isNodeDisabled = useCallback((item) => !!item.node.disabled, []);
+  const visibleNodesRef = useRef(visibleNodes);
+  visibleNodesRef.current = visibleNodes;
+  const valueRef = useRef(value);
+  valueRef.current = value;
+  const lastActiveKeyRef = useRef(void 0);
+  const resolveActiveIndex = useCallback(() => {
+    const nodes = visibleNodesRef.current;
+    const selected = getTreeSelectVisibleIndex(nodes, valueRef.current);
+    if (selected >= 0 && !nodes[selected]?.node.disabled) return selected;
+    return findFirstEnabledIndex(nodes, isNodeDisabled);
+  }, [isNodeDisabled]);
+  const commitActiveIndex = useCallback((index) => {
+    lastActiveKeyRef.current = index >= 0 ? visibleNodesRef.current[index]?.node.key : void 0;
+    setActiveIndex(index);
+  }, []);
+  const alignVirtualScroll = useCallback(
+    (index) => {
+      if (!virtual) return;
+      const wrapper = virtualListWrapperRef.current;
+      const el = wrapper?.firstElementChild ?? wrapper;
+      alignTreeSelectVirtualScroll(el, index, itemHeight, height);
+    },
+    [virtual, itemHeight, height]
+  );
+  useLayoutEffect(() => {
+    if (!isOpen) {
+      commitActiveIndex(-1);
+      return;
+    }
+    commitActiveIndex(resolveActiveIndex());
+  }, [isOpen, searchQuery, commitActiveIndex, resolveActiveIndex]);
+  useLayoutEffect(() => {
+    if (!isOpen) return;
+    const remapped = getTreeSelectVisibleIndex(visibleNodesRef.current, lastActiveKeyRef.current);
+    if (remapped >= 0) setActiveIndex(remapped);
+  }, [expandedKeys, treeData, isOpen]);
+  useLayoutEffect(() => {
+    if (!isOpen) return;
+    alignVirtualScroll(activeIndex);
+  }, [activeIndex, isOpen, alignVirtualScroll, visibleNodes.length]);
+  function handleVirtualListKeyDown(e) {
+    if (e.key !== "ArrowDown" && e.key !== "ArrowUp" && e.key !== "Home" && e.key !== "End") {
+      return;
+    }
+    e.preventDefault();
+    e.stopPropagation();
+    setActiveIndex((current) => {
+      const next = getPickerNavigationIndex(visibleNodes, current, e.key, isNodeDisabled);
+      lastActiveKeyRef.current = visibleNodes[next]?.node.key;
+      return next;
+    });
+  }
+  function openDropdown() {
+    if (disabled) return;
+    setIsOpen(true);
+  }
+  function closeDropdown() {
+    setIsOpen(false);
+    updateSearchValue("");
+  }
+  function updateSearchValue(value2) {
+    if (searchValue === void 0) {
+      setUncontrolledSearchValue(value2);
+    }
+    onSearchChange?.(value2);
+  }
+  function toggleDropdown() {
+    if (isOpen) closeDropdown();
+    else openDropdown();
+  }
+  function toggleExpandKey(key) {
+    setExpandedKeys((prev) => {
+      const next = new Set(prev);
+      if (next.has(key)) next.delete(key);
+      else next.add(key);
+      return next;
+    });
+  }
+  function toggleExpand(key, e) {
+    e.stopPropagation();
+    toggleExpandKey(key);
+  }
+  function isSelected(key) {
+    if (multiple && Array.isArray(value)) {
+      return value.includes(key);
+    }
+    return value === key;
+  }
+  function handleNodeSelect(node) {
+    if (node.disabled) return;
+    if (multiple) {
+      const current = Array.isArray(value) ? [...value] : [];
+      const idx = current.indexOf(node.key);
+      if (idx >= 0) current.splice(idx, 1);
+      else current.push(node.key);
+      onChange?.(current);
+    } else {
+      onChange?.(node.key);
+      closeDropdown();
+    }
+  }
+  function handleClear(e) {
+    e.stopPropagation();
+    onChange?.(multiple ? [] : void 0);
+  }
+  function handleOpenListKeyDown(e, fromSearchInput = false) {
+    const key = e.key;
+    if (fromSearchInput && key === " ") return false;
+    if (key === "ArrowDown" || key === "ArrowUp" || key === "Home" || key === "End") {
+      e.preventDefault();
+      e.stopPropagation();
+      setActiveIndex((current) => {
+        const next = getPickerNavigationIndex(visibleNodes, current, key, isNodeDisabled);
+        lastActiveKeyRef.current = visibleNodes[next]?.node.key;
+        return next;
+      });
+      return true;
+    }
+    if (key === "Enter" || key === " ") {
+      e.preventDefault();
+      e.stopPropagation();
+      const item = visibleNodes[activeIndex];
+      if (item && !item.node.disabled) {
+        handleNodeSelect(item.node);
+      }
+      return true;
+    }
+    if (key === "ArrowRight") {
+      e.preventDefault();
+      e.stopPropagation();
+      const item = visibleNodes[activeIndex];
+      if (item?.hasChildren && !item.isExpanded) {
+        toggleExpandKey(item.node.key);
+      }
+      return true;
+    }
+    if (key === "ArrowLeft") {
+      e.preventDefault();
+      e.stopPropagation();
+      const item = visibleNodes[activeIndex];
+      if (item?.hasChildren && item.isExpanded) {
+        toggleExpandKey(item.node.key);
+      }
+      return true;
+    }
+    return false;
+  }
+  function handleKeyDown(e) {
+    if (disabled) return;
+    if (isOpen && handleOpenListKeyDown(e)) return;
+    const action = getPickerTriggerKeyAction(e.key, isOpen);
+    if (action === "none") return;
+    e.preventDefault();
+    if (action === "toggle") {
+      if (isOpen) closeDropdown();
+      else openDropdown();
+    } else if (action === "open") {
+      openDropdown();
+    } else if (action === "close") {
+      closeDropdown();
+    }
+  }
+  function handleDropdownKeyDown(e) {
+    if (e.target instanceof HTMLInputElement) return;
+    if (!isOpen) return;
+    handleOpenListKeyDown(e);
+  }
+  function handleSearchKeyDown(e) {
+    switch (e.key) {
+      case " ":
+        e.stopPropagation();
+        return;
+      case "ArrowDown":
+      case "ArrowUp":
+      case "Enter":
+        handleOpenListKeyDown(e, true);
+        return;
+      case "Escape":
+        e.preventDefault();
+        e.stopPropagation();
+        closeDropdown();
+        triggerRef.current?.focus();
+        return;
+      default:
+        return;
+    }
+  }
+  function renderFlatNode(flatNode, index) {
+    const { node, level, hasChildren, isExpanded } = flatNode;
+    const selected = isSelected(node.key);
+    const isActive = index === activeIndex;
+    const indent = level * 20;
+    return /* @__PURE__ */ jsxs(
+      "div",
+      {
+        id: getPickerOptionId(listboxId, index),
+        "data-active": isActive || void 0,
+        ...getPickerOptionAria({ selected, disabled: !!node.disabled }),
+        className: getTreeSelectNodeClasses(selected || isActive, !!node.disabled, size),
+        style: { paddingLeft: `${indent + 8}px`, height: virtual ? "100%" : void 0 },
+        onClick: (e) => {
+          e.stopPropagation();
+          handleNodeSelect(node);
+        },
+        children: [
+          hasChildren ? /* @__PURE__ */ jsx(
+            "span",
+            {
+              className: classNames(
+                "inline-flex items-center justify-center w-4 h-4 mr-1 transition-transform",
+                isExpanded ? "rotate-90" : ""
+              ),
+              onClick: (e) => toggleExpand(node.key, e),
+              children: /* @__PURE__ */ jsx("svg", { className: "w-3 h-3", viewBox: icon20ViewBox, fill: "currentColor", children: /* @__PURE__ */ jsx("path", { d: chevronRightSolidIcon20PathD, fillRule: "evenodd", clipRule: "evenodd" }) })
+            }
+          ) : /* @__PURE__ */ jsx("span", { className: "w-4 mr-1" }),
+          /* @__PURE__ */ jsx("span", { className: "flex-1 truncate", children: node.label })
+        ]
+      },
+      String(node.key)
+    );
+  }
+  return /* @__PURE__ */ jsxs("div", { ref: containerRef, className: classNames(treeSelectBaseClasses, className), ...divProps, children: [
+    /* @__PURE__ */ jsx(
+      "button",
+      {
+        ref: triggerRef,
+        type: "button",
+        className: classNames(
+          getTreeSelectTriggerClasses(size, disabled, isOpen),
+          showClearButton ? "pr-14" : void 0
+        ),
+        ...getPickerComboboxAria({
+          expanded: isOpen,
+          listboxId,
+          activeIndex: isOpen ? activeIndex : -1
+        }),
+        disabled,
+        onClick: toggleDropdown,
+        onKeyDown: handleKeyDown,
+        children: /* @__PURE__ */ jsx(
+          "span",
+          {
+            className: classNames(
+              "flex-1 truncate",
+              !displayLabel ? "text-[var(--tiger-treeselect-placeholder,var(--tiger-text-muted,#9ca3af))]" : ""
+            ),
+            children: displayLabel || placeholder
+          }
+        )
+      }
+    ),
+    /* @__PURE__ */ jsxs("span", { className: "pointer-events-none absolute inset-y-0 right-3 flex items-center gap-1", children: [
+      showClearButton && /* @__PURE__ */ jsx(
+        "button",
+        {
+          type: "button",
+          className: "pointer-events-auto inline-flex rounded-sm focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-[var(--tiger-treeselect-ring,var(--tiger-primary,#2563eb))] text-[var(--tiger-treeselect-clear,var(--tiger-text-muted,#9ca3af))] hover:text-[var(--tiger-treeselect-clear-hover,var(--tiger-text,#111827))]",
+          "data-tiger-treeselect-clear": "",
+          "aria-label": resolveLocaleText("Clear selection", mergedLocale?.common?.clearText),
+          onClick: handleClear,
+          children: /* @__PURE__ */ jsx(
+            "svg",
+            {
+              className: "w-4 h-4",
+              viewBox: icon20ViewBox,
+              fill: "currentColor",
+              xmlns: "http://www.w3.org/2000/svg",
+              children: /* @__PURE__ */ jsx("path", { d: closeSolidIcon20PathD, fillRule: "evenodd", clipRule: "evenodd" })
+            }
+          )
+        }
+      ),
+      /* @__PURE__ */ jsx(
+        "span",
+        {
+          className: classNames(
+            "inline-flex text-[var(--tiger-text-muted,#9ca3af)]",
+            isOpen && "rotate-180"
+          ),
+          "aria-hidden": "true",
+          children: /* @__PURE__ */ jsx(
+            "svg",
+            {
+              className: "w-4 h-4 transition-transform",
+              viewBox: icon20ViewBox,
+              fill: "currentColor",
+              xmlns: "http://www.w3.org/2000/svg",
+              children: /* @__PURE__ */ jsx("path", { d: chevronDownSolidIcon20PathD, fillRule: "evenodd", clipRule: "evenodd" })
+            }
+          )
+        }
+      )
+    ] }),
+    renderOverlayPortal(
+      isOpen ? /* @__PURE__ */ jsxs(
+        "div",
+        {
+          ref: dropdownRef,
+          ...getPickerListboxAria({ id: listboxId }),
+          className: classNames(getTreeSelectDropdownClasses(virtual), overlay.floatingClasses),
+          style: overlay.floatingStyles,
+          "data-positioned": overlay.positioned,
+          onKeyDown: handleDropdownKeyDown,
+          children: [
+            searchable && /* @__PURE__ */ jsx(
+              "input",
+              {
+                type: "text",
+                className: treeSelectSearchClasses,
+                placeholder: resolveLocaleText(
+                  "Search...",
+                  mergedLocale?.common?.searchPlaceholder
+                ),
+                value: searchQuery,
+                "aria-label": resolveLocaleText(
+                  "Search tree",
+                  mergedLocale?.common?.searchPlaceholder
+                ),
+                onChange: (e) => updateSearchValue(e.target.value),
+                onKeyDown: handleSearchKeyDown
+              }
+            ),
+            visibleNodes.length > 0 ? virtual ? /* @__PURE__ */ jsx(
+              "div",
+              {
+                ref: virtualListWrapperRef,
+                "data-tiger-treeselect-virtual": "",
+                tabIndex: 0,
+                onKeyDown: handleVirtualListKeyDown,
+                children: /* @__PURE__ */ jsx(
+                  VirtualList,
+                  {
+                    itemCount: visibleNodes.length,
+                    itemHeight,
+                    height,
+                    renderItem: ({ index }) => {
+                      const item = visibleNodes[index];
+                      return item ? renderFlatNode(item, index) : null;
+                    }
+                  }
+                )
+              }
+            ) : visibleNodes.map((flatNode, index) => renderFlatNode(flatNode, index)) : /* @__PURE__ */ jsx("div", { className: treeSelectEmptyClasses, children: resolveLocaleText("No data", emptyText, mergedLocale?.common?.emptyText) })
+          ]
+        }
+      ) : null,
+      overlay.target
+    )
+  ] });
+};
+
+export {
+  TreeSelect
+};

package/dist/{chunk-BEJZPJIK.mjs → chunk-QOAOOD53.mjs}

@@ -13,6 +13,7 @@ import {
   calendarWeekdayClasses,
   getCalendarDayClasses,
   getCalendarMonthClasses,
+  isCalendarMonthDisabled,
   isSameDay,
   getMonthDays,
   getShortDayNames,
@@ -91,10 +92,13 @@ var Calendar = ({
   );
   const selectMonth = useCallback(
     (monthIdx) => {
+      if (isCalendarMonthDisabled(viewYear, monthIdx, disabledDate)) return;
       setViewMonth(monthIdx);
-      onPanelChange?.(new Date(viewYear, monthIdx, 1), mode);
+      const date = new Date(viewYear, monthIdx, 1);
+      onChange?.(date);
+      onPanelChange?.(date, "month");
     },
-    [viewYear, mode, onPanelChange]
+    [viewYear, disabledDate, onChange, onPanelChange]
   );
   const dayGridRef = useRef(null);
   const pendingFocusIsoRef = useRef(null);
@@ -256,14 +260,16 @@ var Calendar = ({
     ] }),
     mode === "year" ? /* @__PURE__ */ jsx("div", { className: "grid grid-cols-1 gap-2", role: "grid", ref: monthGridRef, children: monthRows.map((row, ri) => /* @__PURE__ */ jsx("div", { className: "grid grid-cols-3 gap-2", role: "row", children: row.map((m, ci) => {
       const i = ri * 3 + ci;
+      const isDisabled = isCalendarMonthDisabled(viewYear, i, disabledDate);
       return /* @__PURE__ */ jsx(
         "button",
         {
           type: "button",
           role: "gridcell",
           "aria-selected": viewMonth === i,
-          tabIndex: rovingMonthIdx === i ? 0 : -1,
-          className: getCalendarMonthClasses(viewMonth === i),
+          disabled: isDisabled,
+          tabIndex: rovingMonthIdx === i && !isDisabled ? 0 : -1,
+          className: getCalendarMonthClasses(viewMonth === i, isDisabled),
           onClick: () => selectMonth(i),
           onFocus: () => setActiveMonthIdx(i),
           onKeyDown: (e) => handleMonthKeyDown(e, i),

package/dist/{chunk-2WGEHH5A.mjs → chunk-QU3QXUTC.mjs}

@@ -4,26 +4,32 @@ import {
 } from "./chunk-Z3CRHC5F.mjs";
 import {
   List
-} from "./chunk-QJE3MZBO.mjs";
+} from "./chunk-Y6UH3EKE.mjs";
 import {
   Button
 } from "./chunk-5TE7KLE5.mjs";
 import {
   Loading
-} from "./chunk-K4GIKSZE.mjs";
+} from "./chunk-I2BENK5X.mjs";
 import {
   Text
 } from "./chunk-HLS4CHWX.mjs";
 import {
   Card
 } from "./chunk-IXV5YBCZ.mjs";
+import {
+  useTigerConfig
+} from "./chunk-YSIXURBW.mjs";
 
 // src/components/NotificationCenter.tsx
 import { useMemo, useEffect, useState, useCallback } from "react";
 import {
   classNames,
   buildNotificationGroups,
-  formatActivityTime
+  formatActivityTime,
+  getNotificationCenterLabels,
+  mergeTigerLocale,
+  resolveLocaleText
 } from "@expcat/tigercat-core";
 
 // ../core/src/internal/notification-center-styles.ts
@@ -75,15 +81,17 @@ var NotificationCenter = ({
   readFilter,
   defaultReadFilter = "all",
   loading = false,
-  loadingText = "\u52A0\u8F7D\u4E2D...",
-  emptyText = "\u6682\u65E0\u901A\u77E5",
-  title = "\u901A\u77E5\u4E2D\u5FC3",
-  allLabel = "\u5168\u90E8",
-  unreadLabel = "\u672A\u8BFB",
-  readLabel = "\u5DF2\u8BFB",
-  markAllReadText = "\u5168\u90E8\u6807\u8BB0\u5DF2\u8BFB",
-  markReadText = "\u6807\u8BB0\u5DF2\u8BFB",
-  markUnreadText = "\u6807\u8BB0\u672A\u8BFB",
+  loadingText,
+  emptyText,
+  title,
+  allLabel,
+  unreadLabel,
+  readLabel,
+  markAllReadText,
+  markReadText,
+  markUnreadText,
+  locale,
+  labels: labelsOverride,
   manageReadState = false,
   onGroupChange,
   onReadFilterChange,
@@ -93,6 +101,24 @@ var NotificationCenter = ({
   className,
   ...props
 }) => {
+  const config = useTigerConfig();
+  const mergedLocale = useMemo(
+    () => mergeTigerLocale(config.locale, locale),
+    [config.locale, locale]
+  );
+  const labels = useMemo(
+    () => getNotificationCenterLabels(mergedLocale, labelsOverride),
+    [mergedLocale, labelsOverride]
+  );
+  const resolvedTitle = resolveLocaleText(labels.title, title);
+  const resolvedEmptyText = resolveLocaleText(labels.emptyText, emptyText);
+  const resolvedLoadingText = resolveLocaleText(labels.loadingText, loadingText);
+  const resolvedAllLabel = resolveLocaleText(labels.allLabel, allLabel);
+  const resolvedUnreadLabel = resolveLocaleText(labels.unreadLabel, unreadLabel);
+  const resolvedReadLabel = resolveLocaleText(labels.readLabel, readLabel);
+  const resolvedMarkAllReadText = resolveLocaleText(labels.markAllReadText, markAllReadText);
+  const resolvedMarkReadText = resolveLocaleText(labels.markReadText, markReadText);
+  const resolvedMarkUnreadText = resolveLocaleText(labels.markUnreadText, markUnreadText);
   const resolvedGroups = useMemo(
     () => buildNotificationGroups(items, groups, groupBy, groupOrder),
     [items, groups, groupBy, groupOrder]
@@ -168,11 +194,11 @@ var NotificationCenter = ({
   );
   const filterButtons = useMemo(
     () => [
-      { key: "all", label: allLabel },
-      { key: "unread", label: unreadLabel },
-      { key: "read", label: readLabel }
+      { key: "all", label: resolvedAllLabel },
+      { key: "unread", label: resolvedUnreadLabel },
+      { key: "read", label: resolvedReadLabel }
     ],
-    [allLabel, unreadLabel, readLabel]
+    [resolvedAllLabel, resolvedUnreadLabel, resolvedReadLabel]
   );
   const groupTabData = useMemo(
     () => resolvedGroups.map((group, index) => {
@@ -270,7 +296,7 @@ var NotificationCenter = ({
                 }
                 onItemReadChange?.(item, !isRead);
               },
-              children: isRead ? markUnreadText : markReadText
+              children: isRead ? resolvedMarkUnreadText : resolvedMarkReadText
             }
           )
         ]
@@ -298,7 +324,7 @@ var NotificationCenter = ({
             )
           }
         ) }),
-        /* @__PURE__ */ jsx(Text, { tag: "div", size: "sm", color: "muted", className: notificationCenterEmptyTextClasses, children: emptyText })
+        /* @__PURE__ */ jsx(Text, { tag: "div", size: "sm", color: "muted", className: notificationCenterEmptyTextClasses, children: resolvedEmptyText })
       ] });
     }
     return /* @__PURE__ */ jsx(
@@ -308,13 +334,13 @@ var NotificationCenter = ({
         split: true,
         bordered: "divided",
         hoverable: true,
-        emptyText,
+        emptyText: resolvedEmptyText,
         onItemClick: (item, index) => onItemClick?.(item, index),
         renderItem
       }
     );
   };
-  const content = loading ? /* @__PURE__ */ jsx("div", { className: "flex items-center justify-center py-16", children: /* @__PURE__ */ jsx(Loading, { text: loadingText, className: notificationCenterLoadingClasses }) }) : resolvedGroups.length > 0 ? /* @__PURE__ */ jsx("div", { className: "-mx-4 -mb-4", children: /* @__PURE__ */ jsx(
+  const content = loading ? /* @__PURE__ */ jsx("div", { className: "flex items-center justify-center py-16", children: /* @__PURE__ */ jsx(Loading, { text: resolvedLoadingText, className: notificationCenterLoadingClasses }) }) : resolvedGroups.length > 0 ? /* @__PURE__ */ jsx("div", { className: "-mx-4 -mb-4", children: /* @__PURE__ */ jsx(
     Tabs,
     {
       type: "line",
@@ -329,7 +355,7 @@ var NotificationCenter = ({
     {
       className: wrapperClasses,
       role: props.role ?? "region",
-      "aria-label": props["aria-label"] ?? (props["aria-labelledby"] ? void 0 : title),
+      "aria-label": props["aria-label"] ?? (props["aria-labelledby"] ? void 0 : resolvedTitle),
       ...props,
       "data-tiger-notification-center": true,
       children: /* @__PURE__ */ jsx(
@@ -347,7 +373,7 @@ var NotificationCenter = ({
                     size: "base",
                     weight: "bold",
                     className: notificationCenterTitleClasses,
-                    children: title
+                    children: resolvedTitle
                   }
                 ),
                 totalUnread > 0 ? /* @__PURE__ */ jsx("span", { className: notificationCenterUnreadBadgeClasses, children: totalUnread }) : null
@@ -363,7 +389,7 @@ var NotificationCenter = ({
                     notificationCenterMarkAllBaseClasses,
                     hasUnread ? notificationCenterMarkAllEnabledClasses : notificationCenterMarkAllDisabledClasses
                   ),
-                  children: markAllReadText
+                  children: resolvedMarkAllReadText
                 }
               )
             ] }),