@expcat/tigercat-vue 1.4.0 → 2.0.0-preview.1

package/dist/chunk-4RKBXGHQ.mjs

@@ -0,0 +1,52 @@
+// src/components/MessageRoot.ts
+var messageModulePromise = null;
+function loadMessageModule() {
+  messageModulePromise ??= import("./components/Message.mjs");
+  return messageModulePromise;
+}
+function forwardMessage(method, options) {
+  let closeMessage = null;
+  let requestedClose = false;
+  void loadMessageModule().then(({ Message: Message2 }) => {
+    const close = Message2[method](options);
+    if (requestedClose) {
+      close();
+    } else {
+      closeMessage = close;
+    }
+  });
+  return () => {
+    if (closeMessage) {
+      closeMessage();
+      closeMessage = null;
+    } else {
+      requestedClose = true;
+    }
+  };
+}
+var Message = {
+  success(options) {
+    return forwardMessage("success", options);
+  },
+  warning(options) {
+    return forwardMessage("warning", options);
+  },
+  error(options) {
+    return forwardMessage("error", options);
+  },
+  info(options) {
+    return forwardMessage("info", options);
+  },
+  loading(options) {
+    return forwardMessage("loading", options);
+  },
+  clear() {
+    void loadMessageModule().then(({ Message: Message2 }) => {
+      Message2.clear();
+    });
+  }
+};
+
+export {
+  Message
+};

package/dist/chunk-4ZKSTL5P.mjs

@@ -0,0 +1,323 @@
+import {
+  useTigerConfig
+} from "./chunk-R6WFL6NI.mjs";
+
+// src/components/VirtualTable.ts
+import { defineComponent, h, ref, computed } from "vue";
+import {
+  classNames,
+  coerceClassValue,
+  isActivationKey,
+  calculateVirtualRange,
+  calculateVirtualColumnRange,
+  getVirtualTableContainerClasses,
+  getVirtualTableRowClasses,
+  getVirtualRowKey,
+  getVirtualTableFixedInfo,
+  getVirtualTableFixedCellStyle,
+  getTableFixedCellClasses,
+  getTableFixedHeaderCellClasses,
+  getTableColgroup,
+  getNextTableSelectAllKeys,
+  tableBaseClasses,
+  virtualTableHeaderClasses,
+  virtualTableHeaderCellClasses,
+  virtualTableCellClasses,
+  virtualTableEmptyClasses,
+  virtualTableLoadingClasses,
+  virtualTableFixedCellSelectedClasses,
+  resolveLocaleText,
+  mergeTigerLocale
+} from "@expcat/tigercat-core";
+var DEFAULT_VIRTUAL_COLUMN_WIDTH = 150;
+var VirtualTable = defineComponent({
+  name: "TigerVirtualTable",
+  inheritAttrs: false,
+  props: {
+    dataSource: {
+      type: Array,
+      default: () => []
+    },
+    columns: {
+      type: Array,
+      default: () => []
+    },
+    virtualItemHeight: { type: Number, default: 48 },
+    virtualHeight: { type: Number, default: 400 },
+    width: { type: [Number, String], default: "auto" },
+    overscan: { type: Number, default: 5 },
+    stickyHeader: { type: Boolean, default: true },
+    virtualizeColumns: { type: Boolean, default: false },
+    rowKey: {
+      type: [String, Function],
+      default: void 0
+    },
+    rowClassName: {
+      type: [String, Function],
+      default: void 0
+    },
+    loading: { type: Boolean, default: false },
+    emptyText: { type: String, default: void 0 },
+    rowSelection: {
+      type: Object,
+      default: void 0
+    },
+    striped: { type: Boolean, default: false },
+    bordered: { type: Boolean, default: false },
+    className: { type: String, default: void 0 },
+    locale: { type: Object, default: void 0 }
+  },
+  emits: ["row-click", "selection-change", "update:rowSelection"],
+  setup(props, { emit, attrs }) {
+    const config = useTigerConfig();
+    const mergedLocale = computed(() => mergeTigerLocale(config.value.locale, props.locale));
+    const containerRef = ref(null);
+    const scrollTop = ref(0);
+    const scrollLeft = ref(0);
+    const resolvedData = computed(() => props.dataSource ?? []);
+    const uncontrolledSelectedKeys = ref(
+      props.rowSelection?.defaultSelectedRowKeys ?? props.rowSelection?.selectedRowKeys ?? []
+    );
+    const isSelectionControlled = computed(() => props.rowSelection?.selectedRowKeys !== void 0);
+    const selectedKeys = computed(
+      () => isSelectionControlled.value ? props.rowSelection?.selectedRowKeys ?? [] : uncontrolledSelectedKeys.value
+    );
+    const hasSelection = computed(() => !!props.rowSelection);
+    function commitSelection(nextKeys) {
+      if (!isSelectionControlled.value) {
+        uncontrolledSelectedKeys.value = nextKeys;
+      }
+      emit("selection-change", nextKeys);
+      emit("update:rowSelection", { ...props.rowSelection, selectedRowKeys: nextKeys });
+    }
+    function toggleRowSelection(key, row) {
+      if (!props.rowSelection || props.rowSelection.getCheckboxProps?.(row)?.disabled) return;
+      if (props.rowSelection.type === "radio") {
+        commitSelection([key]);
+        return;
+      }
+      commitSelection(
+        getNextTableSelectAllKeys(selectedKeys.value, [key], !selectedSet.value.has(key))
+      );
+    }
+    const range = computed(
+      () => calculateVirtualRange(
+        scrollTop.value,
+        props.virtualHeight,
+        resolvedData.value.length,
+        props.virtualItemHeight,
+        props.overscan
+      )
+    );
+    const visibleData = computed(() => resolvedData.value.slice(range.value.start, range.value.end));
+    function onScroll() {
+      if (containerRef.value) {
+        scrollTop.value = containerRef.value.scrollTop;
+        scrollLeft.value = containerRef.value.scrollLeft;
+      }
+    }
+    const columnWidths = computed(
+      () => props.columns.map(
+        (c) => typeof c.width === "number" ? c.width : DEFAULT_VIRTUAL_COLUMN_WIDTH
+      )
+    );
+    const resolveRowClassName = (row, index) => typeof props.rowClassName === "function" ? props.rowClassName(row, index) : props.rowClassName;
+    const containerClasses = computed(
+      () => classNames(
+        getVirtualTableContainerClasses(props.bordered, props.className),
+        coerceClassValue(attrs.class)
+      )
+    );
+    const selectedSet = computed(() => new Set(selectedKeys.value));
+    const fixedInfo = computed(() => getVirtualTableFixedInfo(props.columns));
+    return () => {
+      const fi = fixedInfo.value;
+      const colVirtualActive = props.virtualizeColumns && !fi.hasFixedColumns && props.width !== "auto";
+      const colRange = colVirtualActive ? calculateVirtualColumnRange(scrollLeft.value, props.width, columnWidths.value) : void 0;
+      const visibleColumns = colRange ? props.columns.slice(colRange.start, colRange.end) : props.columns;
+      const colIndexOffset = colRange ? colRange.start : 0;
+      const colgroupEntries = fi.hasFixedColumns ? getTableColgroup({
+        columns: visibleColumns,
+        size: "md",
+        hasSelectionColumn: false,
+        expand: false
+      }) : [];
+      const headerCells = visibleColumns.map((col) => {
+        const widthStyle = col.width ? { width: typeof col.width === "number" ? `${col.width}px` : col.width } : {};
+        const stickyStyle = getVirtualTableFixedCellStyle(col.key, fi);
+        return h(
+          "th",
+          {
+            key: col.key,
+            class: classNames(
+              virtualTableHeaderCellClasses,
+              getTableFixedHeaderCellClasses({
+                view: "virtual-table",
+                column: col,
+                stickyHeader: props.stickyHeader,
+                fixedInfo: fi
+              })
+            ),
+            style: { ...widthStyle, ...stickyStyle }
+          },
+          col.title ?? ""
+        );
+      });
+      const headerRowChildren = [
+        colRange && colRange.leftPad > 0 ? h("th", {
+          key: "__left-pad",
+          "aria-hidden": true,
+          style: { width: `${colRange.leftPad}px`, padding: 0 }
+        }) : null,
+        ...headerCells,
+        colRange && colRange.rightPad > 0 ? h("th", {
+          key: "__right-pad",
+          "aria-hidden": true,
+          style: { width: `${colRange.rightPad}px`, padding: 0 }
+        }) : null
+      ];
+      const headerRow = h("tr", {}, headerRowChildren);
+      const thead = h(
+        "thead",
+        { class: props.stickyHeader ? virtualTableHeaderClasses : void 0 },
+        [headerRow]
+      );
+      const rows = visibleData.value.map((row, localIdx) => {
+        const globalIdx = range.value.start + localIdx;
+        const key = props.rowSelection?.getRowKey ? props.rowSelection.getRowKey(row) : getVirtualRowKey(
+          row,
+          globalIdx,
+          props.rowKey
+        );
+        const isSelected = selectedSet.value.has(key);
+        const isInteractive = hasSelection.value || typeof attrs.onRowClick === "function";
+        const activate = () => {
+          emit("row-click", row, globalIdx);
+          if (hasSelection.value) toggleRowSelection(key, row);
+        };
+        const cells = visibleColumns.map(
+          (col, colIdx) => h(
+            "td",
+            {
+              key: col.key,
+              "aria-colindex": colIndexOffset + colIdx + 1,
+              class: classNames(
+                virtualTableCellClasses,
+                getTableFixedCellClasses({
+                  view: "virtual-table",
+                  column: col,
+                  record: row,
+                  rowIndex: globalIdx,
+                  striped: props.striped,
+                  stripedActive: props.striped && globalIdx % 2 === 1,
+                  selected: isSelected,
+                  hoverable: true,
+                  fixedInfo: fi,
+                  selectedClassName: virtualTableFixedCellSelectedClasses
+                })
+              ),
+              style: getVirtualTableFixedCellStyle(col.key, fi)
+            },
+            String(row[col.key] ?? "")
+          )
+        );
+        const rowChildren = [
+          colRange && colRange.leftPad > 0 ? h("td", {
+            key: "__left-pad",
+            "aria-hidden": true,
+            style: { width: `${colRange.leftPad}px`, padding: 0 }
+          }) : null,
+          ...cells,
+          colRange && colRange.rightPad > 0 ? h("td", {
+            key: "__right-pad",
+            "aria-hidden": true,
+            style: { width: `${colRange.rightPad}px`, padding: 0 }
+          }) : null
+        ];
+        return h(
+          "tr",
+          {
+            key,
+            class: classNames(
+              getVirtualTableRowClasses(globalIdx, props.striped, isSelected),
+              resolveRowClassName(row, globalIdx)
+            ),
+            // header occupies aria-rowindex 1
+            "aria-rowindex": globalIdx + 2,
+            "aria-selected": hasSelection.value ? isSelected : void 0,
+            tabindex: isInteractive ? 0 : void 0,
+            // onClick stays attached so `row-click` always fires for consumers
+            // that listen for it; keyboard activation is added when interactive.
+            onClick: activate,
+            onKeydown: isInteractive ? (e) => {
+              if (isActivationKey(e)) {
+                e.preventDefault();
+                activate();
+              }
+            } : void 0
+          },
+          rowChildren
+        );
+      });
+      const topSpacer = h("tr", {
+        key: "__top-spacer",
+        style: { height: `${range.value.offsetTop}px` },
+        "aria-hidden": true
+      });
+      const bottomHeight = range.value.totalHeight - range.value.end * props.virtualItemHeight;
+      const bottomSpacer = bottomHeight > 0 ? h("tr", {
+        key: "__bottom-spacer",
+        style: { height: `${bottomHeight}px` },
+        "aria-hidden": true
+      }) : null;
+      const tbody = h("tbody", {}, [topSpacer, ...rows, bottomSpacer]);
+      const colgroup = colgroupEntries.length > 0 ? h(
+        "colgroup",
+        {},
+        colgroupEntries.map(
+          (entry) => h("col", {
+            key: entry.key,
+            "data-tiger-table-col": entry.key,
+            style: entry.width ? { width: entry.width } : void 0
+          })
+        )
+      ) : null;
+      const table = h("table", { class: classNames(tableBaseClasses, "table-fixed") }, [
+        colgroup,
+        thead,
+        tbody
+      ]);
+      const emptyEl = resolvedData.value.length === 0 && !props.loading ? h(
+        "div",
+        { class: virtualTableEmptyClasses },
+        resolveLocaleText("No data", props.emptyText, mergedLocale.value?.common?.emptyText)
+      ) : null;
+      const loadingEl = props.loading ? h(
+        "div",
+        { class: virtualTableLoadingClasses },
+        resolveLocaleText("Loading...", mergedLocale.value?.common?.loadingText)
+      ) : null;
+      return h(
+        "div",
+        {
+          ref: containerRef,
+          class: containerClasses.value,
+          style: {
+            height: `${props.virtualHeight}px`,
+            ...props.width !== "auto" ? { width: `${props.width}px` } : {}
+          },
+          onScroll,
+          role: "grid",
+          "aria-rowcount": resolvedData.value.length
+        },
+        [table, emptyEl, loadingEl]
+      );
+    };
+  }
+});
+var VirtualTable_default = VirtualTable;
+
+export {
+  VirtualTable,
+  VirtualTable_default
+};

package/dist/{chunk-YZP4K6KI.mjs → chunk-6BDDX2R4.mjs}

@@ -1,6 +1,6 @@
 import {
   RadioGroupKey
-} from "./chunk-Y4V7BOVR.mjs";
+} from "./chunk-6TTICJR4.mjs";
 
 // src/components/Radio.ts
 import {
@@ -54,14 +54,14 @@ var Radio = defineComponent({
     /**
      * Whether the radio is checked (controlled mode)
      */
-    checked: {
+    modelValue: {
       type: Boolean
     },
     /**
      * Default checked state (uncontrolled mode)
      * @default false
      */
-    defaultChecked: {
+    defaultValue: {
       type: Boolean,
       default: false
     },
@@ -84,18 +84,18 @@ var Radio = defineComponent({
      */
     change: (value) => typeof value === "string" || typeof value === "number",
     /**
-     * Emitted when checked state changes (for v-model:checked)
+     * Emitted when checked state changes (for v-model)
      */
-    "update:checked": (value) => typeof value === "boolean"
+    "update:modelValue": (value) => typeof value === "boolean"
   },
   setup(props, { slots, emit, attrs }) {
     const instance = getCurrentInstance();
     const groupContextRef = inject(RadioGroupKey, null);
     const groupContext = computed(() => groupContextRef?.value);
-    const internalChecked = ref(props.defaultChecked);
+    const internalChecked = ref(props.defaultValue);
     const isCheckedControlled = computed(() => {
       const rawProps = instance?.vnode.props;
-      return !!rawProps && Object.prototype.hasOwnProperty.call(rawProps, "checked");
+      return !!rawProps && Object.prototype.hasOwnProperty.call(rawProps, "modelValue");
     });
     const isInGroup = computed(() => !!groupContext.value);
     const actualSize = computed(() => props.size || groupContext.value?.size || "md");
@@ -105,7 +105,7 @@ var Radio = defineComponent({
     });
     const actualName = computed(() => props.name || groupContext.value?.name);
     const isChecked = computed(() => {
-      if (isCheckedControlled.value) return props.checked;
+      if (isCheckedControlled.value) return props.modelValue;
       if (isInGroup.value) return groupContext.value?.value === props.value;
       return internalChecked.value;
     });
@@ -141,7 +141,7 @@ var Radio = defineComponent({
       if (!isCheckedControlled.value && !isInGroup.value && newChecked) {
         internalChecked.value = true;
       }
-      emit("update:checked", newChecked);
+      emit("update:modelValue", newChecked);
       emit("change", props.value);
       if (newChecked && groupContext.value) groupContext.value.onChange(props.value);
     };

package/dist/{chunk-BYX756N5.mjs → chunk-6FV2OMB7.mjs}

@@ -1,6 +1,6 @@
 import {
   VirtualList
-} from "./chunk-PENI3H3I.mjs";
+} from "./chunk-HS4YQGZQ.mjs";
 import {
   useTigerConfig
 } from "./chunk-R6WFL6NI.mjs";
@@ -45,7 +45,10 @@ import {
   getSimplePaginationSelectClasses,
   getSimplePaginationButtonClasses,
   getSimplePaginationPageIndicatorClasses,
-  getSimplePaginationButtonsWrapperClasses
+  getSimplePaginationButtonsWrapperClasses,
+  getPaginationLabels,
+  formatPaginationTotal,
+  formatPaginationPageIndicator
 } from "@expcat/tigercat-core";
 var spinnerSvg = getSpinnerSVG("spinner");
 var LoadingSpinner = () => {
@@ -435,12 +438,19 @@ var List = defineComponent({
       const { totalPages, startIndex, endIndex, hasNext, hasPrev } = paginationInfo.value;
       const total = props.dataSource.length;
       const paginationConfig = props.pagination;
+      const paginationLabels = getPaginationLabels(mergedLocale.value);
+      const localeCode = mergedLocale.value?.locale;
       return h("div", { class: getSimplePaginationContainerClasses() }, [
         // Total info
         paginationConfig.showTotal !== false && h(
           "div",
           { class: getSimplePaginationTotalClasses() },
-          paginationConfig.totalText ? paginationConfig.totalText(total, [startIndex, endIndex]) : `Showing ${startIndex} to ${endIndex} of ${total} items`
+          paginationConfig.totalText ? paginationConfig.totalText(total, [startIndex, endIndex]) : formatPaginationTotal(
+            paginationLabels.totalText,
+            total,
+            [startIndex, endIndex],
+            localeCode
+          )
         ),
         // Pagination controls
         h("div", { class: getSimplePaginationControlsClasses() }, [
@@ -453,7 +463,7 @@ var List = defineComponent({
               onChange: (e) => handlePageSizeChange(Number(e.target.value))
             },
             (paginationConfig.pageSizeOptions || [10, 20, 50, 100]).map(
-              (size) => h("option", { value: size }, `${size} / page`)
+              (size) => h("option", { value: size }, `${size} ${paginationLabels.itemsPerPageText}`)
             )
           ),
           // Page buttons
@@ -466,13 +476,18 @@ var List = defineComponent({
                 disabled: !hasPrev,
                 onClick: () => handlePageChange(currentPage.value - 1)
               },
-              "Previous"
+              paginationLabels.prevPageAriaLabel
             ),
             // Current page indicator
             h(
               "span",
               { class: getSimplePaginationPageIndicatorClasses() },
-              `Page ${currentPage.value} of ${totalPages}`
+              formatPaginationPageIndicator(
+                paginationLabels.pageIndicatorText,
+                currentPage.value,
+                totalPages,
+                localeCode
+              )
             ),
             // Next button
             h(
@@ -482,7 +497,7 @@ var List = defineComponent({
                 disabled: !hasNext,
                 onClick: () => handlePageChange(currentPage.value + 1)
               },
-              "Next"
+              paginationLabels.nextPageAriaLabel
             )
           ])
         ])

package/dist/{chunk-VN4SKDFO.mjs → chunk-6G5FEZLT.mjs}

@@ -1,10 +1,10 @@
 import {
   TabPane,
   Tabs
-} from "./chunk-SGRUGYQ6.mjs";
+} from "./chunk-EYR27UIE.mjs";
 import {
   List
-} from "./chunk-BYX756N5.mjs";
+} from "./chunk-6FV2OMB7.mjs";
 import {
   Button
 } from "./chunk-YZBQ6IR7.mjs";
@@ -160,16 +160,6 @@ var NotificationCenter = defineComponent({
       },
       { immediate: true }
     );
-    const _currentGroup = computed(() => {
-      const groups = resolvedGroups.value;
-      if (groups.length === 0) return void 0;
-      const activeKey = currentGroupKey.value;
-      if (activeKey === void 0) return groups[0];
-      const matchedIndex = groups.findIndex(
-        (group, index) => getGroupKey(group, index) === activeKey
-      );
-      return matchedIndex >= 0 ? groups[matchedIndex] : groups[0];
-    });
     const readStateOverrides = ref(/* @__PURE__ */ new Map());
     const applyReadOverrides = (items) => {
       if (!props.manageReadState || readStateOverrides.value.size === 0) return items;

package/dist/{chunk-Y4V7BOVR.mjs → chunk-6TTICJR4.mjs}

@@ -18,9 +18,9 @@ var RadioGroup = defineComponent({
   inheritAttrs: false,
   props: {
     /**
-     * Selected value (for v-model:value)
+     * Selected value (for v-model)
      */
-    value: {
+    modelValue: {
       type: [String, Number]
     },
     /**
@@ -66,9 +66,9 @@ var RadioGroup = defineComponent({
   },
   emits: {
     /**
-     * Emitted when value changes (for v-model:value)
+     * Emitted when value changes (for v-model)
      */
-    "update:value": (value) => typeof value === "string" || typeof value === "number",
+    "update:modelValue": (value) => typeof value === "string" || typeof value === "number",
     /**
      * Emitted when value changes
      */
@@ -79,15 +79,17 @@ var RadioGroup = defineComponent({
     const internalValue = ref(props.defaultValue);
     const isControlled = computed(() => {
       const rawProps = instance?.vnode.props;
-      return !!rawProps && Object.prototype.hasOwnProperty.call(rawProps, "value");
+      return !!rawProps && Object.prototype.hasOwnProperty.call(rawProps, "modelValue");
     });
-    const currentValue = computed(() => isControlled.value ? props.value : internalValue.value);
+    const currentValue = computed(
+      () => isControlled.value ? props.modelValue : internalValue.value
+    );
     const handleChange = (value) => {
       if (props.disabled) return;
       if (!isControlled.value) {
         internalValue.value = value;
       }
-      emit("update:value", value);
+      emit("update:modelValue", value);
       emit("change", value);
     };
     const generatedName = `tiger-radio-group-${Date.now()}-${Math.random().toString(36).slice(2, 11)}`;

package/dist/{chunk-BPAN6T7H.mjs → chunk-7LCUVR63.mjs}

@@ -57,6 +57,34 @@ var Rate = defineComponent({
       hoverValue.value = 0;
       emit("hover-change", 0);
     }
+    function handleKeydown(e) {
+      if (props.disabled) return;
+      const step = props.allowHalf ? 0.5 : 1;
+      let next = props.modelValue;
+      switch (e.key) {
+        case "ArrowRight":
+        case "ArrowUp":
+          next = Math.min(props.count, props.modelValue + step);
+          break;
+        case "ArrowLeft":
+        case "ArrowDown":
+          next = Math.max(0, props.modelValue - step);
+          break;
+        case "Home":
+          next = 0;
+          break;
+        case "End":
+          next = props.count;
+          break;
+        default:
+          return;
+      }
+      e.preventDefault();
+      if (next !== props.modelValue) {
+        emit("update:modelValue", next);
+        emit("change", next);
+      }
+    }
     return () => {
       const isChar = !!props.character;
       const stars = [];
@@ -116,9 +144,7 @@ var Rate = defineComponent({
             {
               key: i,
               class: getRateStarClasses(props.size, isChar, props.disabled),
-              role: "radio",
-              "aria-checked": full || half,
-              "aria-label": `${i + 1} star${i + 1 > 1 ? "s" : ""}`,
+              "aria-hidden": "true",
               onClick: (e) => handleClick(i, e),
               onMousemove: (e) => handleMouseMove(i, e),
               onMouseleave: handleMouseLeave
@@ -127,12 +153,21 @@ var Rate = defineComponent({
           )
         );
       }
+      const valueText = `${props.modelValue} star${props.modelValue === 1 ? "" : "s"}`;
       return h(
         "div",
         {
           class: classNames(rateBaseClasses, coerceClassValue(attrs.class)),
-          role: "radiogroup",
-          "aria-label": "Rating"
+          role: "slider",
+          "aria-label": "Rating",
+          "aria-valuemin": 0,
+          "aria-valuemax": props.count,
+          "aria-valuenow": props.modelValue,
+          "aria-valuetext": valueText,
+          "aria-disabled": props.disabled || void 0,
+          "aria-orientation": "horizontal",
+          tabindex: props.disabled ? -1 : 0,
+          onKeydown: handleKeydown
         },
         stars
       );

package/dist/{chunk-E6RGBYI3.mjs → chunk-ALIUAGJO.mjs}

@@ -60,6 +60,13 @@ var AnchorLink = defineComponent({
     onMounted(() => {
       anchorContext?.registerLink(props.href);
     });
+    watch(
+      () => props.href,
+      (next, prev) => {
+        anchorContext?.unregisterLink(prev);
+        anchorContext?.registerLink(next);
+      }
+    );
     onBeforeUnmount(() => {
       anchorContext?.unregisterLink(props.href);
     });