@expcat/tigercat-vue 1.4.0 → 1.5.0

package/dist/{chunk-LG6KGO5D.js → chunk-TXMPLBWW.js}

@@ -10,6 +10,8 @@ var _vue = require('vue');
 
 
 
+
+
 var _tigercatcore = require('@expcat/tigercat-core');
 var Resizable = _vue.defineComponent.call(void 0, {
   name: "TigerResizable",
@@ -130,17 +132,67 @@ var Resizable = _vue.defineComponent.call(void 0, {
         deltaY: clamped.height - startHeight.value
       });
     };
+    const onKeyDown = (handle, e) => {
+      if (props.disabled) return;
+      const delta = _tigercatcore.getResizeKeyboardDelta.call(void 0, e.key);
+      if (!delta) return;
+      e.preventDefault();
+      const startW = _nullishCoalesce(width.value, () => ( 0));
+      const startH = _nullishCoalesce(height.value, () => ( 0));
+      const { deltaWidth, deltaHeight } = _tigercatcore.calculateResizeDelta.call(void 0, 
+        handle,
+        delta.deltaX,
+        delta.deltaY,
+        props.axis
+      );
+      let newW = startW + deltaWidth;
+      let newH = startH + deltaHeight;
+      if (props.lockAspectRatio) {
+        const ar = _tigercatcore.applyAspectRatio.call(void 0, newW, newH, startW, startH);
+        newW = ar.width;
+        newH = ar.height;
+      }
+      const clamped = _tigercatcore.clampDimensions.call(void 0, 
+        newW,
+        newH,
+        props.minWidth,
+        props.minHeight,
+        props.maxWidth,
+        props.maxHeight
+      );
+      width.value = clamped.width;
+      height.value = clamped.height;
+      const evt = {
+        width: clamped.width,
+        height: clamped.height,
+        handle,
+        deltaX: clamped.width - startW,
+        deltaY: clamped.height - startH
+      };
+      emit("resize", evt);
+      emit("resize-end", evt);
+    };
     _vue.onBeforeUnmount.call(void 0, () => {
       cleanupDragSession();
     });
     return () => {
-      const handleNodes = props.handles.map(
-        (pos) => _vue.h.call(void 0, "div", {
+      const handleNodes = props.handles.map((pos) => {
+        const usesHeight = pos === "top" || pos === "bottom";
+        const valueNow = Math.round(_nullishCoalesce((usesHeight ? height.value : width.value), () => ( 0)));
+        return _vue.h.call(void 0, "div", {
           class: _tigercatcore.getResizableHandleClasses.call(void 0, pos, draggingHandle.value === pos, props.disabled),
           "data-handle": pos,
-          onMousedown: (e) => onMouseDown(pos, e)
-        })
-      );
+          role: "separator",
+          "aria-label": `Resize ${pos}`,
+          "aria-orientation": _tigercatcore.getResizeHandleOrientation.call(void 0, pos),
+          "aria-valuenow": valueNow,
+          "aria-valuemin": usesHeight ? props.minHeight : props.minWidth,
+          "aria-valuemax": usesHeight ? props.maxHeight : props.maxWidth,
+          tabindex: props.disabled ? -1 : 0,
+          onMousedown: (e) => onMouseDown(pos, e),
+          onKeydown: (e) => onKeyDown(pos, e)
+        });
+      });
       return _vue.h.call(void 0, 
         "div",
         {

package/dist/{chunk-NOZ65AMO.js → chunk-TYYJPEWG.js}

@@ -1,4 +1,8 @@
-"use strict";Object.defineProperty(exports, "__esModule", {value: true}); function _nullishCoalesce(lhs, rhsFn) { if (lhs != null) { return lhs; } else { return rhsFn(); } }// src/components/Empty.ts
+"use strict";Object.defineProperty(exports, "__esModule", {value: true}); function _nullishCoalesce(lhs, rhsFn) { if (lhs != null) { return lhs; } else { return rhsFn(); } }
+
+var _chunkIXTYS3EKjs = require('./chunk-IXTYS3EK.js');
+
+// src/components/Empty.ts
 var _vue = require('vue');
 
 
@@ -11,6 +15,7 @@ var _vue = require('vue');
 
 
 
+
 var _tigercatcore = require('@expcat/tigercat-core');
 var Empty = _vue.defineComponent.call(void 0, {
   name: "TigerEmpty",
@@ -35,10 +40,18 @@ var Empty = _vue.defineComponent.call(void 0, {
     style: {
       type: Object,
       default: void 0
+    },
+    locale: {
+      type: Object,
+      default: void 0
     }
   },
   setup(props, { slots, attrs }) {
-    const descText = _vue.computed.call(void 0, () => _nullishCoalesce(props.description, () => ( _tigercatcore.getEmptyDescription.call(void 0, props.preset))));
+    const config = _chunkIXTYS3EKjs.useTigerConfig.call(void 0, );
+    const mergedLocale = _vue.computed.call(void 0, () => _tigercatcore.mergeTigerLocale.call(void 0, config.value.locale, props.locale));
+    const descText = _vue.computed.call(void 0, 
+      () => _nullishCoalesce(props.description, () => ( _tigercatcore.getEmptyDescription.call(void 0, props.preset, mergedLocale.value)))
+    );
     return () => {
       const attrsRecord = attrs;
       const children = [];

package/dist/{chunk-NEVDRG6C.js → chunk-U5TSCS34.js}

@@ -1,10 +1,10 @@
 "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 _chunk44N7LE3Qjs = require('./chunk-44N7LE3Q.js');
+var _chunkYTE45DNCjs = require('./chunk-YTE45DNC.js');
 
 
-var _chunkSJIW7SNAjs = require('./chunk-SJIW7SNA.js');
+var _chunkPH6ERFC7js = require('./chunk-PH6ERFC7.js');
 
 
 var _chunkHA5QZ76Mjs = require('./chunk-HA5QZ76M.js');
@@ -160,16 +160,6 @@ var NotificationCenter = _vue.defineComponent.call(void 0, {
       },
       { immediate: true }
     );
-    const _currentGroup = _vue.computed.call(void 0, () => {
-      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 = _vue.ref.call(void 0, /* @__PURE__ */ new Map());
     const applyReadOverrides = (items) => {
       if (!props.manageReadState || readStateOverrides.value.size === 0) return items;
@@ -412,7 +402,7 @@ var NotificationCenter = _vue.defineComponent.call(void 0, {
         );
       }
       return _vue.h.call(void 0, 
-        _chunkSJIW7SNAjs.List,
+        _chunkPH6ERFC7js.List,
         {
           dataSource: items,
           split: true,
@@ -427,7 +417,7 @@ var NotificationCenter = _vue.defineComponent.call(void 0, {
       );
     };
     const renderTabs = () => _vue.h.call(void 0, 
-      _chunk44N7LE3Qjs.Tabs,
+      _chunkYTE45DNCjs.Tabs,
       {
         type: "line",
         size: "small",
@@ -437,7 +427,7 @@ var NotificationCenter = _vue.defineComponent.call(void 0, {
       {
         default: () => groupTabData.value.map(
           (tab) => _vue.h.call(void 0, 
-            _chunk44N7LE3Qjs.TabPane,
+            _chunkYTE45DNCjs.TabPane,
             {
               key: tab.key,
               tabKey: tab.key,

package/dist/{chunk-SLYUQ67P.js → chunk-UKR3IJF3.js}

@@ -10,6 +10,7 @@ var _vue = require('vue');
 
 
 
+
 var _tigercatcore = require('@expcat/tigercat-core');
 var Slider = _vue.defineComponent.call(void 0, {
   name: "TigerSlider",
@@ -290,7 +291,8 @@ var Slider = _vue.defineComponent.call(void 0, {
       };
       const createMarks = () => {
         if (!props.marks) return null;
-        const marks = typeof props.marks === "boolean" ? {} : props.marks;
+        const marks = _tigercatcore.sliderResolveMarks.call(void 0, props.marks, props.min, props.max);
+        if (Object.keys(marks).length === 0) return null;
         return _vue.h.call(void 0, 
           "div",
           { class: "absolute w-full top-full mt-2" },

package/dist/{chunk-M5PGWW25.mjs → chunk-UTGFGMZT.mjs}

@@ -3,13 +3,13 @@ import {
 } from "./chunk-R2HO74FE.mjs";
 import {
   ChartLegend
-} from "./chunk-VVS2CQS4.mjs";
+} from "./chunk-HLPSHCXO.mjs";
 import {
   ChartSeries
 } from "./chunk-2ZUEXCVJ.mjs";
 import {
   ChartTooltip
-} from "./chunk-OK4PVFQG.mjs";
+} from "./chunk-G2LB4QCL.mjs";
 import {
   ChartCanvas
 } from "./chunk-W5RZPTFD.mjs";
@@ -295,6 +295,15 @@ var RadarChart = defineComponent({
       hoveredPoint.value = null;
       handleHoverLeave();
     };
+    const showPointTooltipFromElement = (el, seriesIndex, pointIndex) => {
+      if (!props.hoverable) return;
+      const rect = el.getBoundingClientRect();
+      hoveredPoint.value = { seriesIndex, pointIndex };
+      handleHoverEnter(seriesIndex, {
+        clientX: rect.left + rect.width / 2,
+        clientY: rect.top + rect.height / 2
+      });
+    };
     const axisData = computed(() => {
       if (props.series && props.series.length > 0) return props.series[0]?.data ?? [];
       return props.data ?? [];
@@ -678,13 +687,34 @@ var RadarChart = defineComponent({
                           props.showTooltip && props.hoverable ? "cursor-pointer" : null,
                           "transition-[r] duration-150 ease-out"
                         ),
+                        role: props.showTooltip && props.hoverable ? "button" : "img",
+                        "aria-label": point.data.label ?? String(point.data.value),
+                        tabindex: props.showTooltip && props.hoverable ? 0 : void 0,
                         "data-radar-point": "true",
                         "data-series-index": seriesIndex,
                         "data-series-key": item.seriesKey,
                         "data-point-index": point.index,
                         onMouseenter: props.showTooltip && props.hoverable ? (e) => handlePointEnter(seriesIndex, point.index, e) : void 0,
                         onMousemove: props.showTooltip && props.hoverable ? handlePointMove : void 0,
-                        onMouseleave: props.showTooltip && props.hoverable ? handlePointLeave : void 0
+                        onMouseleave: props.showTooltip && props.hoverable ? handlePointLeave : void 0,
+                        onFocus: props.showTooltip && props.hoverable ? (e) => showPointTooltipFromElement(
+                          e.currentTarget,
+                          seriesIndex,
+                          point.index
+                        ) : void 0,
+                        onBlur: props.showTooltip && props.hoverable ? handlePointLeave : void 0,
+                        onKeydown: props.showTooltip && props.hoverable ? (e) => {
+                          if (e.key === "Enter" || e.key === " ") {
+                            e.preventDefault();
+                            showPointTooltipFromElement(
+                              e.currentTarget,
+                              seriesIndex,
+                              point.index
+                            );
+                          } else if (e.key === "Escape") {
+                            handlePointLeave();
+                          }
+                        } : void 0
                       });
                     }) : null
                   ]

package/dist/chunk-V5ANPH5R.mjs

@@ -0,0 +1,341 @@
+import {
+  useTigerConfig
+} from "./chunk-R6WFL6NI.mjs";
+
+// src/components/Calendar.ts
+import { defineComponent, h, ref, computed, nextTick } from "vue";
+import { classNames, coerceClassValue } from "@expcat/tigercat-core";
+import {
+  getCalendarContainerClasses,
+  calendarHeaderClasses,
+  calendarNavButtonClasses,
+  calendarTitleClasses,
+  calendarWeekdayClasses,
+  getCalendarDayClasses,
+  getCalendarMonthClasses,
+  isSameDay,
+  getMonthDays,
+  getShortDayNames,
+  getShortMonthNames,
+  formatMonthYear,
+  formatDate,
+  parseDate,
+  addDays,
+  getCalendarLabels,
+  mergeTigerLocale
+} from "@expcat/tigercat-core";
+var Calendar = defineComponent({
+  name: "TigerCalendar",
+  inheritAttrs: false,
+  props: {
+    modelValue: { type: Date, default: void 0 },
+    mode: { type: String, default: "month" },
+    fullscreen: { type: Boolean, default: false },
+    disabledDate: { type: Function, default: void 0 },
+    locale: { type: Object, default: void 0 },
+    className: { type: String, default: void 0 }
+  },
+  emits: ["update:modelValue", "change", "panel-change"],
+  setup(props, { emit, attrs }) {
+    const config = useTigerConfig();
+    const mergedLocale = computed(() => mergeTigerLocale(config.value.locale, props.locale));
+    const localeCode = computed(() => mergedLocale.value?.locale);
+    const labels = computed(() => getCalendarLabels(mergedLocale.value));
+    const weekdayNames = computed(() => getShortDayNames(localeCode.value));
+    const monthNames = computed(() => getShortMonthNames(localeCode.value));
+    const today = /* @__PURE__ */ new Date();
+    const viewYear = ref(props.modelValue?.getFullYear() ?? today.getFullYear());
+    const viewMonth = ref(props.modelValue?.getMonth() ?? today.getMonth());
+    const days = computed(() => getMonthDays(viewYear.value, viewMonth.value));
+    function prevMonth() {
+      if (viewMonth.value === 0) {
+        viewMonth.value = 11;
+        viewYear.value--;
+      } else {
+        viewMonth.value--;
+      }
+      emit("panel-change", new Date(viewYear.value, viewMonth.value, 1), props.mode);
+    }
+    function nextMonth() {
+      if (viewMonth.value === 11) {
+        viewMonth.value = 0;
+        viewYear.value++;
+      } else {
+        viewMonth.value++;
+      }
+      emit("panel-change", new Date(viewYear.value, viewMonth.value, 1), props.mode);
+    }
+    function prevYear() {
+      viewYear.value--;
+      emit("panel-change", new Date(viewYear.value, viewMonth.value, 1), props.mode);
+    }
+    function nextYear() {
+      viewYear.value++;
+      emit("panel-change", new Date(viewYear.value, viewMonth.value, 1), props.mode);
+    }
+    function selectDay(date) {
+      if (props.disabledDate?.(date)) return;
+      emit("update:modelValue", date);
+      emit("change", date);
+    }
+    function selectMonth(monthIdx) {
+      viewMonth.value = monthIdx;
+      emit("panel-change", new Date(viewYear.value, monthIdx, 1), props.mode);
+    }
+    const dayGridEl = ref(null);
+    const monthGridEl = ref(null);
+    const activeIso = ref(null);
+    const activeMonthIdx = ref(null);
+    const toIso = (d) => formatDate(d, "yyyy-MM-dd");
+    function getDefaultDayIso() {
+      const v = props.modelValue;
+      if (v && v.getFullYear() === viewYear.value && v.getMonth() === viewMonth.value)
+        return toIso(v);
+      if (today.getFullYear() === viewYear.value && today.getMonth() === viewMonth.value)
+        return toIso(today);
+      return toIso(new Date(viewYear.value, viewMonth.value, 1));
+    }
+    function navigate(y, m) {
+      viewYear.value = y;
+      viewMonth.value = m;
+      emit("panel-change", new Date(y, m, 1), props.mode);
+    }
+    function focusDayIso(iso) {
+      const el = dayGridEl.value?.querySelector(`button[data-date="${iso}"]`);
+      if (el && !el.disabled) {
+        el.focus();
+        activeIso.value = iso;
+        return true;
+      }
+      return false;
+    }
+    function moveDayFocus(deltaDays) {
+      const activeEl = document.activeElement;
+      const currentIso = activeEl?.getAttribute("data-date") ?? activeIso.value ?? getDefaultDayIso();
+      const base = parseDate(currentIso);
+      if (!base) return;
+      let candidate = addDays(base, deltaDays);
+      for (let attempts = 0; attempts < 42; attempts++) {
+        const iso = toIso(candidate);
+        const el = dayGridEl.value?.querySelector(`button[data-date="${iso}"]`);
+        if (el && !el.disabled) {
+          el.focus();
+          activeIso.value = iso;
+          return;
+        }
+        if (!el) {
+          activeIso.value = iso;
+          navigate(candidate.getFullYear(), candidate.getMonth());
+          nextTick(() => {
+            dayGridEl.value?.querySelector(`button[data-date="${iso}"]`)?.focus();
+          });
+          return;
+        }
+        candidate = addDays(candidate, deltaDays);
+      }
+    }
+    function 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.value, viewMonth.value, 1)));
+          break;
+        case "End":
+          e.preventDefault();
+          focusDayIso(toIso(new Date(viewYear.value, viewMonth.value + 1, 0)));
+          break;
+        case "Enter":
+        case " ": {
+          const activeEl = document.activeElement;
+          const iso = activeEl?.getAttribute("data-date");
+          if (iso) {
+            e.preventDefault();
+            const d = parseDate(iso);
+            if (d) selectDay(d);
+          }
+          break;
+        }
+        default:
+          break;
+      }
+    }
+    function focusMonthIdx(idx) {
+      const els = monthGridEl.value?.querySelectorAll('button[role="gridcell"]');
+      els?.[idx]?.focus();
+      activeMonthIdx.value = idx;
+    }
+    function 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);
+    }
+    return () => {
+      const containerClass = classNames(
+        getCalendarContainerClasses(!!props.fullscreen),
+        props.className,
+        coerceClassValue(attrs.class)
+      );
+      const header = h("div", { class: calendarHeaderClasses }, [
+        h(
+          "button",
+          {
+            type: "button",
+            class: calendarNavButtonClasses,
+            "aria-label": props.mode === "month" ? labels.value.previousMonth : labels.value.previousYear,
+            onClick: props.mode === "month" ? prevMonth : prevYear
+          },
+          "\u2039"
+        ),
+        h(
+          "span",
+          { class: calendarTitleClasses },
+          props.mode === "month" ? formatMonthYear(viewYear.value, viewMonth.value, localeCode.value) : `${viewYear.value}`
+        ),
+        h(
+          "button",
+          {
+            type: "button",
+            class: calendarNavButtonClasses,
+            "aria-label": props.mode === "month" ? labels.value.nextMonth : labels.value.nextYear,
+            onClick: props.mode === "month" ? nextMonth : nextYear
+          },
+          "\u203A"
+        )
+      ]);
+      const rovingDayIso = activeIso.value ?? getDefaultDayIso();
+      const rovingMonthIdx = activeMonthIdx.value ?? viewMonth.value;
+      let body;
+      if (props.mode === "year") {
+        const monthRows = [];
+        for (let i = 0; i < monthNames.value.length; i += 3)
+          monthRows.push(monthNames.value.slice(i, i + 3));
+        body = h(
+          "div",
+          { class: "grid grid-cols-1 gap-2", role: "grid", ref: monthGridEl },
+          monthRows.map(
+            (row, ri) => h(
+              "div",
+              { key: ri, class: "grid grid-cols-3 gap-2", role: "row" },
+              row.map((m, ci) => {
+                const i = ri * 3 + ci;
+                return h(
+                  "button",
+                  {
+                    key: i,
+                    type: "button",
+                    role: "gridcell",
+                    "aria-selected": viewMonth.value === i,
+                    tabindex: rovingMonthIdx === i ? 0 : -1,
+                    class: getCalendarMonthClasses(viewMonth.value === i),
+                    onClick: () => selectMonth(i),
+                    onFocus: () => activeMonthIdx.value = i,
+                    onKeydown: (e) => handleMonthKeyDown(e, i)
+                  },
+                  m
+                );
+              })
+            )
+          )
+        );
+      } else {
+        const weekdayRow = h(
+          "div",
+          { class: "grid grid-cols-7", role: "row" },
+          weekdayNames.value.map(
+            (wd) => h("div", { key: wd, class: calendarWeekdayClasses, role: "columnheader" }, wd)
+          )
+        );
+        const weeks = [];
+        for (let i = 0; i < days.value.length; i += 7) weeks.push(days.value.slice(i, i + 7));
+        const weekRows = weeks.map(
+          (week, wi) => h(
+            "div",
+            { key: wi, class: "grid grid-cols-7", role: "row", onKeydown: handleDayGridKeyDown },
+            week.map((date) => {
+              const isCurrentMonth = date.getMonth() === viewMonth.value;
+              const isSelected = props.modelValue ? isSameDay(date, props.modelValue) : false;
+              const isTodayDate = isSameDay(date, today);
+              const isDisabled = !!props.disabledDate?.(date);
+              const iso = toIso(date);
+              return h(
+                "button",
+                {
+                  key: iso,
+                  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,
+                  class: classNames(
+                    getCalendarDayClasses(isSelected, isTodayDate, isCurrentMonth, isDisabled),
+                    "justify-self-center my-0.5"
+                  ),
+                  onClick: () => selectDay(date),
+                  onFocus: () => activeIso.value = iso
+                },
+                date.getDate()
+              );
+            })
+          )
+        );
+        body = h("div", { role: "grid", "aria-rowcount": 7, "aria-colcount": 7, ref: dayGridEl }, [
+          weekdayRow,
+          ...weekRows
+        ]);
+      }
+      return h("div", { ...attrs, class: containerClass, role: "group" }, [header, body]);
+    };
+  }
+});
+var Calendar_default = Calendar;
+
+export {
+  Calendar,
+  Calendar_default
+};