@expcat/tigercat-react 1.3.4 → 1.5.0

package/dist/chunk-6LGCAGNG.js

@@ -0,0 +1,312 @@
+"use strict";Object.defineProperty(exports, "__esModule", {value: true}); function _nullishCoalesce(lhs, rhsFn) { if (lhs != null) { return lhs; } else { return rhsFn(); } } function _optionalChain(ops) { let lastAccessLHS = undefined; let value = ops[0]; let i = 1; while (i < ops.length) { const op = ops[i]; const fn = ops[i + 1]; i += 2; if ((op === 'optionalAccess' || op === 'optionalCall') && value == null) { return undefined; } if (op === 'access' || op === 'optionalAccess') { lastAccessLHS = value; value = fn(value); } else if (op === 'call' || op === 'optionalCall') { value = fn((...args) => value.call(lastAccessLHS, ...args)); lastAccessLHS = undefined; } } return value; }
+
+var _chunkTDODFBBOjs = require('./chunk-TDODFBBO.js');
+
+// src/components/Calendar.tsx
+var _react = require('react');
+var _tigercatcore = require('@expcat/tigercat-core');
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+var _jsxruntime = require('react/jsx-runtime');
+var Calendar = ({
+  value,
+  mode = "month",
+  fullscreen = false,
+  disabledDate,
+  locale,
+  onChange,
+  onPanelChange,
+  className
+}) => {
+  const config = _chunkTDODFBBOjs.useTigerConfig.call(void 0, );
+  const mergedLocale = _react.useMemo.call(void 0, 
+    () => _tigercatcore.mergeTigerLocale.call(void 0, config.locale, locale),
+    [config.locale, locale]
+  );
+  const localeCode = _optionalChain([mergedLocale, 'optionalAccess', _ => _.locale]);
+  const labels = _react.useMemo.call(void 0, () => _tigercatcore.getCalendarLabels.call(void 0, mergedLocale), [mergedLocale]);
+  const weekdayNames = _react.useMemo.call(void 0, () => _tigercatcore.getShortDayNames.call(void 0, localeCode), [localeCode]);
+  const monthNames = _react.useMemo.call(void 0, () => _tigercatcore.getShortMonthNames.call(void 0, localeCode), [localeCode]);
+  const today = /* @__PURE__ */ new Date();
+  const [viewYear, setViewYear] = _react.useState.call(void 0, _nullishCoalesce(_optionalChain([value, 'optionalAccess', _2 => _2.getFullYear, 'call', _3 => _3()]), () => ( today.getFullYear())));
+  const [viewMonth, setViewMonth] = _react.useState.call(void 0, _nullishCoalesce(_optionalChain([value, 'optionalAccess', _4 => _4.getMonth, 'call', _5 => _5()]), () => ( today.getMonth())));
+  const days = _react.useMemo.call(void 0, () => _tigercatcore.getMonthDays.call(void 0, viewYear, viewMonth), [viewYear, viewMonth]);
+  const weeks = _react.useMemo.call(void 0, () => {
+    const out = [];
+    for (let i = 0; i < days.length; i += 7) out.push(days.slice(i, i + 7));
+    return out;
+  }, [days]);
+  const monthRows = _react.useMemo.call(void 0, () => {
+    const out = [];
+    for (let i = 0; i < monthNames.length; i += 3) out.push(monthNames.slice(i, i + 3));
+    return out;
+  }, [monthNames]);
+  const navigate = _react.useCallback.call(void 0, 
+    (newYear, newMonth) => {
+      setViewYear(newYear);
+      setViewMonth(newMonth);
+      _optionalChain([onPanelChange, 'optionalCall', _6 => _6(new Date(newYear, newMonth, 1), mode)]);
+    },
+    [mode, onPanelChange]
+  );
+  const prevMonth = _react.useCallback.call(void 0, () => {
+    if (viewMonth === 0) navigate(viewYear - 1, 11);
+    else navigate(viewYear, viewMonth - 1);
+  }, [viewYear, viewMonth, navigate]);
+  const nextMonth = _react.useCallback.call(void 0, () => {
+    if (viewMonth === 11) navigate(viewYear + 1, 0);
+    else navigate(viewYear, viewMonth + 1);
+  }, [viewYear, viewMonth, navigate]);
+  const prevYear = _react.useCallback.call(void 0, 
+    () => navigate(viewYear - 1, viewMonth),
+    [viewYear, viewMonth, navigate]
+  );
+  const nextYear = _react.useCallback.call(void 0, 
+    () => navigate(viewYear + 1, viewMonth),
+    [viewYear, viewMonth, navigate]
+  );
+  const selectDay = _react.useCallback.call(void 0, 
+    (date) => {
+      if (_optionalChain([disabledDate, 'optionalCall', _7 => _7(date)])) return;
+      _optionalChain([onChange, 'optionalCall', _8 => _8(date)]);
+    },
+    [disabledDate, onChange]
+  );
+  const selectMonth = _react.useCallback.call(void 0, 
+    (monthIdx) => {
+      setViewMonth(monthIdx);
+      _optionalChain([onPanelChange, 'optionalCall', _9 => _9(new Date(viewYear, monthIdx, 1), mode)]);
+    },
+    [viewYear, mode, onPanelChange]
+  );
+  const dayGridRef = _react.useRef.call(void 0, null);
+  const pendingFocusIsoRef = _react.useRef.call(void 0, null);
+  const [activeIso, setActiveIso] = _react.useState.call(void 0, null);
+  const toIso = (d) => _tigercatcore.formatDate.call(void 0, d, "yyyy-MM-dd");
+  const defaultDayIso = (() => {
+    if (value && value.getFullYear() === viewYear && value.getMonth() === viewMonth)
+      return toIso(value);
+    if (today.getFullYear() === viewYear && today.getMonth() === viewMonth) return toIso(today);
+    return toIso(new Date(viewYear, viewMonth, 1));
+  })();
+  const rovingDayIso = _nullishCoalesce(activeIso, () => ( defaultDayIso));
+  const focusDayIso = (iso) => {
+    const el = _optionalChain([dayGridRef, 'access', _10 => _10.current, 'optionalAccess', _11 => _11.querySelector, 'call', _12 => _12(`button[data-date="${iso}"]`)]);
+    if (el && !el.disabled) {
+      el.focus();
+      setActiveIso(iso);
+      return true;
+    }
+    return false;
+  };
+  const moveDayFocus = (deltaDays) => {
+    const activeEl = document.activeElement;
+    const currentIso = _nullishCoalesce(_optionalChain([activeEl, 'optionalAccess', _13 => _13.getAttribute, 'call', _14 => _14("data-date")]), () => ( rovingDayIso));
+    const base = _tigercatcore.parseDate.call(void 0, currentIso);
+    if (!base) return;
+    let candidate = _tigercatcore.addDays.call(void 0, base, deltaDays);
+    for (let attempts = 0; attempts < 42; attempts++) {
+      const iso = toIso(candidate);
+      const el = _optionalChain([dayGridRef, 'access', _15 => _15.current, 'optionalAccess', _16 => _16.querySelector, 'call', _17 => _17(`button[data-date="${iso}"]`)]);
+      if (el && !el.disabled) {
+        el.focus();
+        setActiveIso(iso);
+        return;
+      }
+      if (!el) {
+        pendingFocusIsoRef.current = iso;
+        setActiveIso(iso);
+        navigate(candidate.getFullYear(), candidate.getMonth());
+        return;
+      }
+      candidate = _tigercatcore.addDays.call(void 0, candidate, deltaDays);
+    }
+  };
+  _react.useEffect.call(void 0, () => {
+    const iso = pendingFocusIsoRef.current;
+    if (!iso) return;
+    const el = _optionalChain([dayGridRef, 'access', _18 => _18.current, 'optionalAccess', _19 => _19.querySelector, 'call', _20 => _20(`button[data-date="${iso}"]`)]);
+    if (el) {
+      el.focus();
+      pendingFocusIsoRef.current = null;
+    }
+  }, [days]);
+  const handleDayGridKeyDown = (e) => {
+    switch (e.key) {
+      case "ArrowLeft":
+        e.preventDefault();
+        moveDayFocus(-1);
+        break;
+      case "ArrowRight":
+        e.preventDefault();
+        moveDayFocus(1);
+        break;
+      case "ArrowUp":
+        e.preventDefault();
+        moveDayFocus(-7);
+        break;
+      case "ArrowDown":
+        e.preventDefault();
+        moveDayFocus(7);
+        break;
+      case "Home":
+        e.preventDefault();
+        focusDayIso(toIso(new Date(viewYear, viewMonth, 1)));
+        break;
+      case "End":
+        e.preventDefault();
+        focusDayIso(toIso(new Date(viewYear, viewMonth + 1, 0)));
+        break;
+      case "Enter":
+      case " ": {
+        const activeEl = document.activeElement;
+        const iso = _optionalChain([activeEl, 'optionalAccess', _21 => _21.getAttribute, 'call', _22 => _22("data-date")]);
+        if (iso) {
+          e.preventDefault();
+          const d = _tigercatcore.parseDate.call(void 0, iso);
+          if (d) selectDay(d);
+        }
+        break;
+      }
+      default:
+        break;
+    }
+  };
+  const [activeMonthIdx, setActiveMonthIdx] = _react.useState.call(void 0, null);
+  const rovingMonthIdx = _nullishCoalesce(activeMonthIdx, () => ( viewMonth));
+  const monthGridRef = _react.useRef.call(void 0, null);
+  const focusMonthIdx = (idx) => {
+    const els = _optionalChain([monthGridRef, 'access', _23 => _23.current, 'optionalAccess', _24 => _24.querySelectorAll, 'call', _25 => _25('button[role="gridcell"]')]);
+    _optionalChain([els, 'optionalAccess', _26 => _26[idx], 'optionalAccess', _27 => _27.focus, 'call', _28 => _28()]);
+    setActiveMonthIdx(idx);
+  };
+  const handleMonthKeyDown = (e, idx) => {
+    let target = idx;
+    switch (e.key) {
+      case "ArrowRight":
+        target = Math.min(11, idx + 1);
+        break;
+      case "ArrowLeft":
+        target = Math.max(0, idx - 1);
+        break;
+      case "ArrowDown":
+        target = Math.min(11, idx + 3);
+        break;
+      case "ArrowUp":
+        target = Math.max(0, idx - 3);
+        break;
+      case "Home":
+        target = 0;
+        break;
+      case "End":
+        target = 11;
+        break;
+      case "Enter":
+      case " ":
+        e.preventDefault();
+        selectMonth(idx);
+        return;
+      default:
+        return;
+    }
+    e.preventDefault();
+    focusMonthIdx(target);
+  };
+  const containerClass = _tigercatcore.classNames.call(void 0, _tigercatcore.getCalendarContainerClasses.call(void 0, fullscreen), className);
+  return /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, "div", { className: containerClass, role: "group", children: [
+    /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, "div", { className: _tigercatcore.calendarHeaderClasses, children: [
+      /* @__PURE__ */ _jsxruntime.jsx.call(void 0, 
+        "button",
+        {
+          type: "button",
+          className: _tigercatcore.calendarNavButtonClasses,
+          "aria-label": mode === "month" ? labels.previousMonth : labels.previousYear,
+          onClick: mode === "month" ? prevMonth : prevYear,
+          children: "\u2039"
+        }
+      ),
+      /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "span", { className: _tigercatcore.calendarTitleClasses, children: mode === "month" ? _tigercatcore.formatMonthYear.call(void 0, viewYear, viewMonth, localeCode) : `${viewYear}` }),
+      /* @__PURE__ */ _jsxruntime.jsx.call(void 0, 
+        "button",
+        {
+          type: "button",
+          className: _tigercatcore.calendarNavButtonClasses,
+          "aria-label": mode === "month" ? labels.nextMonth : labels.nextYear,
+          onClick: mode === "month" ? nextMonth : nextYear,
+          children: "\u203A"
+        }
+      )
+    ] }),
+    mode === "year" ? /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "div", { className: "grid grid-cols-1 gap-2", role: "grid", ref: monthGridRef, children: monthRows.map((row, ri) => /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "div", { className: "grid grid-cols-3 gap-2", role: "row", children: row.map((m, ci) => {
+      const i = ri * 3 + ci;
+      return /* @__PURE__ */ _jsxruntime.jsx.call(void 0, 
+        "button",
+        {
+          type: "button",
+          role: "gridcell",
+          "aria-selected": viewMonth === i,
+          tabIndex: rovingMonthIdx === i ? 0 : -1,
+          className: _tigercatcore.getCalendarMonthClasses.call(void 0, viewMonth === i),
+          onClick: () => selectMonth(i),
+          onFocus: () => setActiveMonthIdx(i),
+          onKeyDown: (e) => handleMonthKeyDown(e, i),
+          children: m
+        },
+        i
+      );
+    }) }, ri)) }) : /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, "div", { role: "grid", "aria-rowcount": 7, "aria-colcount": 7, ref: dayGridRef, children: [
+      /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "div", { className: "grid grid-cols-7", role: "row", children: weekdayNames.map((wd) => /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "div", { className: _tigercatcore.calendarWeekdayClasses, role: "columnheader", children: wd }, wd)) }),
+      weeks.map((week, wi) => /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "div", { className: "grid grid-cols-7", role: "row", onKeyDown: handleDayGridKeyDown, children: week.map((date) => {
+        const isCurrentMonth = date.getMonth() === viewMonth;
+        const isSelected = value ? _tigercatcore.isSameDay.call(void 0, date, value) : false;
+        const isTodayDate = _tigercatcore.isSameDay.call(void 0, date, today);
+        const isDisabled = !!_optionalChain([disabledDate, 'optionalCall', _29 => _29(date)]);
+        const iso = toIso(date);
+        return /* @__PURE__ */ _jsxruntime.jsx.call(void 0, 
+          "button",
+          {
+            type: "button",
+            role: "gridcell",
+            "data-date": iso,
+            "aria-label": iso,
+            "aria-selected": isSelected,
+            "aria-current": isTodayDate ? "date" : void 0,
+            disabled: isDisabled,
+            tabIndex: rovingDayIso === iso && !isDisabled ? 0 : -1,
+            className: _tigercatcore.classNames.call(void 0, 
+              _tigercatcore.getCalendarDayClasses.call(void 0, isSelected, isTodayDate, isCurrentMonth, isDisabled),
+              "justify-self-center my-0.5"
+            ),
+            onClick: () => selectDay(date),
+            onFocus: () => setActiveIso(iso),
+            children: date.getDate()
+          },
+          iso
+        );
+      }) }, wi))
+    ] })
+  ] });
+};
+var Calendar_default = Calendar;
+
+
+
+
+exports.Calendar = Calendar; exports.Calendar_default = Calendar_default;

package/dist/{chunk-A42OLED6.mjs → chunk-6REMGSLS.mjs}

@@ -1,11 +1,16 @@
 import {
   VirtualList
-} from "./chunk-7DUHHRAU.mjs";
+} from "./chunk-Y5X3G2LD.mjs";
+import {
+  useTigerConfig
+} from "./chunk-QAIBQHIO.mjs";
 
 // src/components/List.tsx
 import React, { useMemo, useState } from "react";
 import {
   classNames,
+  resolveLocaleText,
+  mergeTigerLocale,
   getListClasses,
   getListItemClasses,
   getListHeaderFooterClasses,
@@ -31,7 +36,10 @@ import {
   getSimplePaginationSelectClasses,
   getSimplePaginationButtonClasses,
   getSimplePaginationPageIndicatorClasses,
-  getSimplePaginationButtonsWrapperClasses
+  getSimplePaginationButtonsWrapperClasses,
+  getPaginationLabels,
+  formatPaginationTotal,
+  formatPaginationPageIndicator
 } from "@expcat/tigercat-core";
 import { jsx, jsxs } from "react/jsx-runtime";
 var spinnerSvg = getSpinnerSVG("spinner");
@@ -54,7 +62,8 @@ var List = ({
   size = "md",
   bordered = "divided",
   loading = false,
-  emptyText = "No data",
+  emptyText,
+  locale,
   split = true,
   itemLayout = "horizontal",
   header,
@@ -75,6 +84,11 @@ var List = ({
   onReorder,
   ...divProps
 }) => {
+  const config = useTigerConfig();
+  const mergedLocale = useMemo(
+    () => mergeTigerLocale(config.locale, locale),
+    [config.locale, locale]
+  );
   const [currentPage, setCurrentPage] = useState(
     pagination && typeof pagination === "object" ? pagination.current || 1 : 1
   );
@@ -232,7 +246,7 @@ var List = ({
       return null;
     }
     if (paginatedData.length === 0) {
-      return /* @__PURE__ */ jsx("div", { className: listEmptyStateClasses, role: "status", "aria-live": "polite", children: emptyText });
+      return /* @__PURE__ */ jsx("div", { className: listEmptyStateClasses, role: "status", "aria-live": "polite", children: resolveLocaleText("No data", emptyText, mergedLocale?.common?.emptyText) });
     }
     const items = paginatedData.map((item, index) => renderListItem(item, index));
     if (grid) {
@@ -267,8 +281,15 @@ var List = ({
     const { totalPages, startIndex, endIndex, hasNext, hasPrev } = paginationInfo;
     const total = dataSource.length;
     const paginationConfig = pagination;
+    const paginationLabels = getPaginationLabels(mergedLocale);
+    const localeCode = mergedLocale?.locale;
     return /* @__PURE__ */ jsxs("div", { className: getSimplePaginationContainerClasses(), children: [
-      paginationConfig.showTotal !== false && /* @__PURE__ */ jsx("div", { className: getSimplePaginationTotalClasses(), children: paginationConfig.totalText ? paginationConfig.totalText(total, [startIndex, endIndex]) : `Showing ${startIndex} to ${endIndex} of ${total} items` }),
+      paginationConfig.showTotal !== false && /* @__PURE__ */ jsx("div", { className: getSimplePaginationTotalClasses(), children: paginationConfig.totalText ? paginationConfig.totalText(total, [startIndex, endIndex]) : formatPaginationTotal(
+        paginationLabels.totalText,
+        total,
+        [startIndex, endIndex],
+        localeCode
+      ) }),
       /* @__PURE__ */ jsxs("div", { className: getSimplePaginationControlsClasses(), children: [
         paginationConfig.showSizeChanger !== false && /* @__PURE__ */ jsx(
           "select",
@@ -278,7 +299,8 @@ var List = ({
             onChange: (e) => handlePageSizeChange(Number(e.target.value)),
             children: (paginationConfig.pageSizeOptions || [10, 20, 50, 100]).map((size2) => /* @__PURE__ */ jsxs("option", { value: size2, children: [
               size2,
-              " / page"
+              " ",
+              paginationLabels.itemsPerPageText
             ] }, size2))
           }
         ),
@@ -289,22 +311,22 @@ var List = ({
               className: getSimplePaginationButtonClasses(!hasPrev),
               disabled: !hasPrev,
               onClick: () => handlePageChange(currentPage - 1),
-              children: "Previous"
+              children: paginationLabels.prevPageAriaLabel
             }
           ),
-          /* @__PURE__ */ jsxs("span", { className: getSimplePaginationPageIndicatorClasses(), children: [
-            "Page ",
+          /* @__PURE__ */ jsx("span", { className: getSimplePaginationPageIndicatorClasses(), children: formatPaginationPageIndicator(
+            paginationLabels.pageIndicatorText,
             currentPage,
-            " of ",
-            totalPages
-          ] }),
+            totalPages,
+            localeCode
+          ) }),
           /* @__PURE__ */ jsx(
             "button",
             {
               className: getSimplePaginationButtonClasses(!hasNext),
               disabled: !hasNext,
               onClick: () => handlePageChange(currentPage + 1),
-              children: "Next"
+              children: paginationLabels.nextPageAriaLabel
             }
           )
         ] })

package/dist/{chunk-PNAWOJ32.js → chunk-6S5QOTXZ.js}

@@ -1,4 +1,8 @@
-"use strict";Object.defineProperty(exports, "__esModule", {value: true}); function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; } function _nullishCoalesce(lhs, rhsFn) { if (lhs != null) { return lhs; } else { return rhsFn(); } }// src/components/Badge.tsx
+"use strict";Object.defineProperty(exports, "__esModule", {value: true}); function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; } function _nullishCoalesce(lhs, rhsFn) { if (lhs != null) { return lhs; } else { return rhsFn(); } }
+
+var _chunkTDODFBBOjs = require('./chunk-TDODFBBO.js');
+
+// src/components/Badge.tsx
 var _react = require('react'); var _react2 = _interopRequireDefault(_react);
 
 
@@ -11,10 +15,13 @@ var _react = require('react'); var _react2 = _interopRequireDefault(_react);
 
 
 
+
+
 var _tigercatcore = require('@expcat/tigercat-core');
 var _jsxruntime = require('react/jsx-runtime');
 var Badge = _react2.default.memo(
   ({
+    locale,
     variant = "danger",
     size = "md",
     type = "number",
@@ -28,6 +35,11 @@ var Badge = _react2.default.memo(
     ["aria-label"]: ariaLabelProp,
     ...props
   }) => {
+    const config = _chunkTDODFBBOjs.useTigerConfig.call(void 0, );
+    const labels = _react.useMemo.call(void 0, 
+      () => _tigercatcore.getStatusLabels.call(void 0, _tigercatcore.mergeTigerLocale.call(void 0, config.locale, locale)),
+      [config.locale, locale]
+    );
     const isDot = type === "dot";
     const isHidden = _tigercatcore.shouldHideBadge.call(void 0, content, type, showZero);
     const displayContent = _tigercatcore.formatBadgeContent.call(void 0, content, max, showZero);
@@ -39,7 +51,7 @@ var Badge = _react2.default.memo(
       !standalone && _tigercatcore.badgePositionClasses[position],
       className
     );
-    const computedAriaLabel = _nullishCoalesce(ariaLabelProp, () => ( (isDot ? "notification" : type === "number" ? `${displayContent} notifications` : `${_nullishCoalesce(displayContent, () => ( ""))}`)));
+    const computedAriaLabel = _nullishCoalesce(ariaLabelProp, () => ( (isDot ? labels.badgeLabel : type === "number" ? labels.badgeCountLabel.replace("{count}", String(displayContent)) : `${_nullishCoalesce(displayContent, () => ( ""))}`)));
     if (isHidden) {
       return standalone ? null : /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _jsxruntime.Fragment, { children });
     }