@expcat/tigercat-vue 2.1.2 → 2.1.3

package/dist/{chunk-SPFL55TF.mjs → chunk-2XITUFL6.mjs}

@@ -1,16 +1,25 @@
+import {
+  renderVueOverlayTeleport,
+  useVueOverlayPortalTarget
+} from "./chunk-Y63TRXZO.mjs";
+
 // src/components/ChartTooltip.ts
-import { defineComponent, h, computed, ref, watch, Teleport } from "vue";
+import { defineComponent, h, computed, ref, watch } from "vue";
 import {
   classNames,
+  coerceClassValue,
+  chartTooltipBaseClasses,
   getChartTooltipTransform,
+  isBrowser,
   resolveChartTooltipPosition
 } from "@expcat/tigercat-core";
 var ChartTooltip = defineComponent({
   name: "TigerChartTooltip",
+  inheritAttrs: false,
   props: {
     content: {
       type: String,
-      required: true
+      default: ""
     },
     open: {
       type: Boolean,
@@ -28,13 +37,14 @@ var ChartTooltip = defineComponent({
       type: String
     }
   },
-  setup(props) {
+  setup(props, { slots, attrs }) {
     const tooltipRef = ref(null);
+    const { anchorRef, target } = useVueOverlayPortalTarget();
     const adjustedPosition = ref({ x: props.x, y: props.y });
     watch(
-      () => [props.x, props.y, props.open],
+      () => [props.x, props.y, props.open, props.content],
       (_value, _oldValue, onCleanup) => {
-        if (!props.open) return;
+        if (!props.open || !isBrowser()) return;
         const initialPosition = resolveChartTooltipPosition({
           x: props.x,
           y: props.y,
@@ -57,34 +67,28 @@ var ChartTooltip = defineComponent({
       { immediate: true }
     );
     const tooltipClasses = computed(
-      () => classNames(
-        "fixed left-0 top-0 z-[9999] pointer-events-none will-change-transform",
-        "px-3 py-2 rounded-[var(--tiger-radius-md,0.375rem)] shadow-[var(--tiger-shadow-glass,0_10px_15px_-3px_rgb(0_0_0_/_0.1),0_4px_6px_-4px_rgb(0_0_0_/_0.1))]",
-        "bg-[color:var(--tiger-bg-elevated,#1f2937)]",
-        "text-[color:var(--tiger-text-inverse,#f9fafb)]",
-        "text-sm whitespace-nowrap",
-        "transition-opacity duration-150",
-        props.open ? "opacity-100" : "opacity-0",
-        props.className
-      )
+      () => classNames(chartTooltipBaseClasses, coerceClassValue(attrs.class), props.className)
     );
     return () => {
-      if (!props.content) return null;
-      return h(Teleport, { to: "body" }, [
-        h(
-          "div",
-          {
-            ref: tooltipRef,
-            class: tooltipClasses.value,
-            style: {
-              transform: getChartTooltipTransform(adjustedPosition.value)
-            },
-            role: "tooltip",
-            "data-chart-tooltip": "true"
+      const slotContent = slots.default?.();
+      const body = slotContent && slotContent.length > 0 ? slotContent : props.content;
+      const tooltip = props.open && body ? h(
+        "div",
+        {
+          ref: tooltipRef,
+          class: tooltipClasses.value,
+          style: {
+            transform: getChartTooltipTransform(adjustedPosition.value)
           },
-          props.content
-        )
-      ]);
+          role: "tooltip",
+          "data-chart-tooltip": "true"
+        },
+        body
+      ) : null;
+      return [
+        h("span", { ref: anchorRef, hidden: true }),
+        tooltip ? renderVueOverlayTeleport(tooltip, target.value) : null
+      ];
     };
   }
 });

package/dist/{chunk-QZRSFGZZ.mjs → chunk-35JLHFUT.mjs}

@@ -1,13 +1,15 @@
 import {
   useTigerConfig
-} from "./chunk-UOJOJBEU.mjs";
+} from "./chunk-4GOTWNOO.mjs";
 
 // src/components/Code.ts
 import { computed, defineComponent, h, onBeforeUnmount, ref } from "vue";
 import {
   coerceClassValue,
+  codeBlockCopyStatusLiveClasses,
   codeBlockPreClasses,
   copyTextToClipboard,
+  createCopyStatusReset,
   getCodeBlockContainerClasses,
   getCodeBlockCopyButtonClasses,
   getCodeLabels,
@@ -60,7 +62,9 @@ var Code = defineComponent({
   setup(props, { emit, attrs }) {
     const config = useTigerConfig();
     const copyStatus = ref("idle");
-    const timerRef = ref(null);
+    const reset = createCopyStatusReset((status) => {
+      copyStatus.value = status;
+    });
     const mergedLocale = computed(() => mergeTigerLocale(config.value.locale, props.locale));
     const labels = computed(() => getCodeLabels(mergedLocale.value, props.labels));
     const resolvedCopyLabel = computed(
@@ -77,6 +81,7 @@ var Code = defineComponent({
       if (copyStatus.value === "copied") return resolvedCopiedLabel.value;
       return resolvedCopyLabel.value;
     });
+    const liveText = computed(() => copyStatus.value === "idle" ? "" : buttonLabel.value);
     const containerClasses = computed(() => {
       const attrsRecord = attrs;
       return getCodeBlockContainerClasses(props.className, coerceClassValue(attrsRecord.class));
@@ -84,29 +89,18 @@ var Code = defineComponent({
     const copyButtonClasses = computed(() => {
       return getCodeBlockCopyButtonClasses(copyStatus.value);
     });
-    const clearTimer = () => {
-      if (timerRef.value != null) {
-        window.clearTimeout(timerRef.value);
-        timerRef.value = null;
-      }
-    };
     const handleCopy = async () => {
       if (!props.copyable) return;
       const ok = await copyTextToClipboard(props.code);
-      clearTimer();
       if (ok) {
-        copyStatus.value = "copied";
+        reset.schedule("copied");
         emit("copy", props.code);
       } else {
-        copyStatus.value = "failed";
+        reset.schedule("failed");
       }
-      timerRef.value = window.setTimeout(() => {
-        copyStatus.value = "idle";
-        timerRef.value = null;
-      }, 1500);
     };
     onBeforeUnmount(() => {
-      clearTimer();
+      reset.dispose();
     });
     return () => h(
       "div",
@@ -122,10 +116,17 @@ var Code = defineComponent({
           {
             type: "button",
             class: copyButtonClasses.value,
-            onClick: handleCopy,
-            "aria-label": buttonLabel.value
+            onClick: handleCopy
           },
           buttonLabel.value
+        ) : null,
+        props.copyable ? h(
+          "span",
+          {
+            class: codeBlockCopyStatusLiveClasses,
+            "aria-live": "polite"
+          },
+          liveText.value
         ) : null
       ]
     );

package/dist/chunk-36CRSIXF.mjs

@@ -0,0 +1,122 @@
+import {
+  FORM_ITEM_CONTROL_INJECTION_KEY
+} from "./chunk-P2LZ2MR5.mjs";
+
+// src/components/CheckboxGroup.ts
+import { defineComponent, computed, provide, ref, h, inject } from "vue";
+import {
+  classNames,
+  coerceClassValue,
+  getChoiceGroupClasses,
+  markFormItemGroupControl,
+  mergeAriaDescribedBy,
+  mergeStyleValues,
+  toggleCheckboxGroupValue
+} from "@expcat/tigercat-core";
+var CheckboxGroupKey = /* @__PURE__ */ Symbol("CheckboxGroup");
+var CheckboxGroup = markFormItemGroupControl(
+  defineComponent({
+    name: "TigerCheckboxGroup",
+    inheritAttrs: false,
+    props: {
+      modelValue: {
+        type: Array
+      },
+      defaultValue: {
+        type: Array,
+        default: () => []
+      },
+      disabled: {
+        type: Boolean,
+        default: false
+      },
+      size: {
+        type: String,
+        default: "md"
+      },
+      direction: {
+        type: String,
+        default: "vertical"
+      },
+      status: {
+        type: String
+      },
+      className: {
+        type: String
+      },
+      style: {
+        type: Object
+      }
+    },
+    emits: {
+      "update:modelValue": (value) => Array.isArray(value),
+      change: (value) => Array.isArray(value)
+    },
+    setup(props, { slots, emit, attrs }) {
+      const formItemControl = inject(
+        FORM_ITEM_CONTROL_INJECTION_KEY,
+        null
+      );
+      const internalValue = ref(props.defaultValue);
+      const isControlled = computed(() => props.modelValue !== void 0);
+      const value = computed(
+        () => props.modelValue !== void 0 ? props.modelValue : internalValue.value
+      );
+      const effectiveDisabled = computed(
+        () => props.disabled || (formItemControl?.disabled.value ?? false)
+      );
+      const updateValue = (val, checked) => {
+        if (effectiveDisabled.value) return;
+        const currentValue = toggleCheckboxGroupValue(value.value, val, checked);
+        if (!isControlled.value) internalValue.value = currentValue;
+        emit("update:modelValue", currentValue);
+        emit("change", currentValue);
+        formItemControl?.onChange(currentValue);
+      };
+      provide(
+        CheckboxGroupKey,
+        computed(() => ({
+          value: value.value,
+          disabled: effectiveDisabled.value,
+          size: props.size,
+          updateValue
+        }))
+      );
+      return () => {
+        const { class: _class, style: _style, ...restAttrs } = attrs;
+        const labelledby = typeof restAttrs["aria-labelledby"] === "string" && restAttrs["aria-labelledby"].trim() ? restAttrs["aria-labelledby"].trim() : formItemControl?.labelId.value;
+        const describedBy = mergeAriaDescribedBy(
+          typeof restAttrs["aria-describedby"] === "string" ? restAttrs["aria-describedby"] : void 0,
+          formItemControl?.describedBy.value
+        );
+        const status = props.status ?? formItemControl?.status.value ?? "default";
+        return h(
+          "div",
+          {
+            ...restAttrs,
+            role: "group",
+            class: classNames(
+              getChoiceGroupClasses({
+                direction: props.direction,
+                className: classNames(props.className, coerceClassValue(attrs.class))
+              })
+            ),
+            style: mergeStyleValues(attrs.style, props.style),
+            "aria-labelledby": labelledby,
+            "aria-describedby": describedBy,
+            "aria-disabled": effectiveDisabled.value || void 0,
+            "aria-invalid": status === "error" ? true : restAttrs["aria-invalid"]
+          },
+          slots.default?.()
+        );
+      };
+    }
+  })
+);
+var CheckboxGroup_default = CheckboxGroup;
+
+export {
+  CheckboxGroupKey,
+  CheckboxGroup,
+  CheckboxGroup_default
+};

package/dist/{chunk-A5QYJSHK.mjs → chunk-3DFYNKHA.mjs}

@@ -1,17 +1,29 @@
 import {
   useTigerConfig
-} from "./chunk-UOJOJBEU.mjs";
+} from "./chunk-4GOTWNOO.mjs";
 
 // src/components/InfiniteScroll.ts
-import { defineComponent, h, ref, computed, watch, onMounted, onBeforeUnmount } from "vue";
+import {
+  defineComponent,
+  h,
+  ref,
+  computed,
+  watch,
+  onMounted,
+  onBeforeUnmount,
+  onUpdated
+} from "vue";
 import {
   classNames,
   coerceClassValue,
+  mergeStyleValues,
   shouldLoadMore,
   createInfiniteScrollObserver,
   resolveLocaleText,
   mergeTigerLocale,
   getInfiniteScrollContainerClasses,
+  getInfiniteScrollSentinelStyle,
+  getInfiniteScrollChromeClasses,
   infiniteScrollLoaderClasses,
   infiniteScrollEndClasses,
   infiniteScrollSentinelClasses
@@ -32,75 +44,118 @@ var InfiniteScroll = defineComponent({
     },
     inverse: { type: Boolean, default: false },
     disabled: { type: Boolean, default: false },
+    height: { type: Number, default: void 0 },
+    root: {
+      type: [Object, String],
+      default: "container"
+    },
     className: { type: String, default: void 0 }
   },
   emits: ["load-more"],
   setup(props, { emit, slots, attrs }) {
     const config = useTigerConfig();
     const mergedLocale = computed(() => mergeTigerLocale(config.value.locale, props.locale));
+    const dir = computed(() => config.value.direction === "rtl" ? "rtl" : "ltr");
     const containerRef = ref(null);
     const sentinelRef = ref(null);
     let cleanupObserver = null;
+    let pending = false;
+    let wasLoading = props.loading;
+    let prevScrollHeight = null;
     const containerClasses = computed(
       () => classNames(
         getInfiniteScrollContainerClasses(props.direction, props.className),
         coerceClassValue(attrs.class)
       )
     );
-    function handleLoadMore() {
-      if (props.disabled || props.loading || !props.hasMore) return;
+    function requestLoad() {
+      if (props.disabled || props.loading || !props.hasMore || pending) return;
+      pending = true;
       emit("load-more");
     }
+    function syncPendingFromLoading() {
+      if (wasLoading && !props.loading) pending = false;
+      if (props.loading) pending = true;
+      wasLoading = props.loading;
+    }
+    function resolveObserverRoot() {
+      if (props.root === "container" || props.root === void 0) return containerRef.value;
+      return props.root;
+    }
     function checkScroll() {
-      if (props.disabled || props.loading || !props.hasMore) return;
       const el = containerRef.value;
       if (!el) return;
-      if (shouldLoadMore(el, props.threshold, props.direction, props.inverse)) {
-        emit("load-more");
+      if (shouldLoadMore(el, props.threshold, props.direction, props.inverse, dir.value)) {
+        requestLoad();
       }
     }
     function setupObserver() {
       cleanupObserver?.();
       cleanupObserver = null;
+      syncPendingFromLoading();
       if (props.disabled || !props.hasMore) return;
       const sentinel = sentinelRef.value;
       if (!sentinel) return;
+      const observerRoot = resolveObserverRoot();
       const teardown = createInfiniteScrollObserver(sentinel, {
         threshold: props.threshold,
         direction: props.direction,
-        root: containerRef.value,
+        root: observerRoot,
         inverse: props.inverse,
-        onLoadMore: handleLoadMore
+        onLoadMore: requestLoad
       });
       if (teardown) {
         cleanupObserver = teardown;
-      } else {
-        containerRef.value?.addEventListener("scroll", checkScroll, { passive: true });
-        cleanupObserver = () => {
-          containerRef.value?.removeEventListener("scroll", checkScroll);
-        };
+        if (observerRoot && observerRoot === containerRef.value) checkScroll();
+        return;
       }
+      containerRef.value?.addEventListener("scroll", checkScroll, { passive: true });
+      checkScroll();
+      cleanupObserver = () => {
+        containerRef.value?.removeEventListener("scroll", checkScroll);
+      };
+    }
+    function restoreInverseScroll() {
+      if (!props.inverse) return;
+      const el = containerRef.value;
+      if (!el) return;
+      const next = el.scrollHeight;
+      if (prevScrollHeight != null && next !== prevScrollHeight) {
+        el.scrollTop += next - prevScrollHeight;
+      }
+      prevScrollHeight = next;
     }
     onMounted(setupObserver);
+    onUpdated(restoreInverseScroll);
     watch(
-      () => [props.hasMore, props.disabled, props.threshold, props.direction, props.inverse],
-      setupObserver
+      () => [
+        props.hasMore,
+        props.disabled,
+        props.loading,
+        props.threshold,
+        props.direction,
+        props.inverse,
+        props.root
+      ],
+      setupObserver,
+      { flush: "post" }
     );
     onBeforeUnmount(() => {
       cleanupObserver?.();
     });
     return () => {
+      const { class: _attrClass, style: attrStyle, ...restAttrs } = attrs;
       const content = slots.default?.();
       const sentinel = props.hasMore ? h("div", {
         ref: sentinelRef,
         class: infiniteScrollSentinelClasses,
         "aria-hidden": "true",
-        style: "height:0;overflow:hidden"
+        style: getInfiniteScrollSentinelStyle(props.direction)
       }) : null;
       const loader = props.loading ? h(
         "div",
         {
-          class: infiniteScrollLoaderClasses,
+          class: getInfiniteScrollChromeClasses(props.direction, infiniteScrollLoaderClasses),
           role: "status",
           "aria-live": "polite"
         },
@@ -112,19 +167,29 @@ var InfiniteScroll = defineComponent({
       ) : null;
       const end = !props.hasMore && !props.loading ? h(
         "div",
-        { class: infiniteScrollEndClasses },
+        {
+          class: getInfiniteScrollChromeClasses(props.direction, infiniteScrollEndClasses),
+          "aria-live": "polite"
+        },
         slots.end?.() ?? resolveLocaleText(
           "No more data",
           props.endText,
           mergedLocale.value?.common?.noMoreText
         )
       ) : null;
-      const children = props.inverse ? [sentinel, loader, content, end] : [content, sentinel, loader, end];
+      const chrome = [sentinel, loader, end];
+      const children = props.inverse ? [...chrome, content] : [content, ...chrome];
       return h(
         "div",
         {
+          ...restAttrs,
           ref: containerRef,
-          class: containerClasses.value
+          class: containerClasses.value,
+          style: mergeStyleValues(
+            attrStyle,
+            props.height !== void 0 ? { height: `${props.height}px` } : void 0
+          ),
+          "aria-busy": props.loading || void 0
         },
         children
       );