@expcat/tigercat-vue 1.0.7 → 1.2.0

package/dist/chunk-DZXZ3YEL.js

@@ -0,0 +1,137 @@
+"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; }// src/components/BackTop.ts
+
+
+
+
+
+
+
+
+var _vue = require('vue');
+
+
+
+
+
+
+
+
+
+
+
+var _tigercatcore = require('@expcat/tigercat-core');
+var DefaultIcon = _vue.h.call(void 0, 
+  "svg",
+  {
+    xmlns: "http://www.w3.org/2000/svg",
+    fill: "none",
+    viewBox: "0 0 24 24",
+    stroke: "currentColor",
+    "stroke-width": "2",
+    class: "h-5 w-5",
+    "aria-hidden": "true"
+  },
+  [_vue.h.call(void 0, "path", { "stroke-linecap": "round", "stroke-linejoin": "round", d: _tigercatcore.backTopIconPath })]
+);
+var BackTop = _vue.defineComponent.call(void 0, {
+  name: "TigerBackTop",
+  inheritAttrs: false,
+  props: {
+    /**
+     * Scroll height to show the BackTop button
+     * @default 400
+     */
+    visibilityHeight: {
+      type: Number,
+      default: 400
+    },
+    /**
+     * Target element to listen for scroll events
+     * @default () => window
+     */
+    target: {
+      type: Function,
+      default: () => window
+    },
+    /**
+     * Use immediate scroll when set to 0; positive values use native smooth scrolling
+     * @default 450
+     */
+    duration: {
+      type: Number,
+      default: 450
+    },
+    className: {
+      type: String,
+      default: void 0
+    },
+    style: {
+      type: Object,
+      default: void 0
+    }
+  },
+  emits: ["click"],
+  setup(props, { slots, emit, attrs }) {
+    const visible = _vue.ref.call(void 0, false);
+    const targetElement = _vue.shallowRef.call(void 0, null);
+    let visibilityController;
+    const handleClick = (event) => {
+      if (!targetElement.value) return;
+      _tigercatcore.scrollToTop.call(void 0, targetElement.value, props.duration);
+      emit("click", event);
+    };
+    _vue.onMounted.call(void 0, () => {
+      targetElement.value = _nullishCoalesce(props.target(), () => ( window));
+      visibilityController = _tigercatcore.createBackTopVisibilityController.call(void 0, {
+        target: targetElement.value,
+        getVisibilityHeight: () => props.visibilityHeight,
+        onChange: (nextVisible) => {
+          visible.value = nextVisible;
+        }
+      });
+      targetElement.value.addEventListener("scroll", visibilityController.schedule, {
+        passive: true
+      });
+      visibilityController.update();
+    });
+    _vue.onBeforeUnmount.call(void 0, () => {
+      if (targetElement.value && visibilityController) {
+        targetElement.value.removeEventListener("scroll", visibilityController.schedule);
+      }
+      _optionalChain([visibilityController, 'optionalAccess', _ => _.cancel, 'call', _2 => _2()]);
+    });
+    const buttonClasses = _vue.computed.call(void 0, () => {
+      const target = _nullishCoalesce(targetElement.value, () => ( props.target()));
+      const isWindowTarget = !target || target === window;
+      const positionClasses = isWindowTarget ? _tigercatcore.backTopButtonClasses : _tigercatcore.backTopContainerClasses;
+      return _tigercatcore.classNames.call(void 0, 
+        positionClasses,
+        visible.value ? _tigercatcore.backTopVisibleClasses : _tigercatcore.backTopHiddenClasses,
+        props.className,
+        _tigercatcore.coerceClassValue.call(void 0, attrs.class)
+      );
+    });
+    const mergedStyle = _vue.computed.call(void 0, () => _tigercatcore.mergeStyleValues.call(void 0, attrs.style, props.style));
+    return () => {
+      const content = slots.default ? slots.default() : DefaultIcon;
+      return _vue.h.call(void 0, 
+        "button",
+        {
+          ...attrs,
+          type: "button",
+          class: buttonClasses.value,
+          style: mergedStyle.value,
+          "aria-label": _nullishCoalesce(attrs["aria-label"], () => ( "Back to top")),
+          onClick: handleClick
+        },
+        content
+      );
+    };
+  }
+});
+var BackTop_default = BackTop;
+
+
+
+
+exports.BackTop = BackTop; exports.BackTop_default = BackTop_default;

package/dist/chunk-E2GQSWHK.mjs

@@ -1,7 +1,13 @@
-import { defineComponent, computed, h } from 'vue';
-import { classNames, getPrintLayoutClasses, coerceClassValue, printLayoutHeaderClasses, printLayoutFooterClasses, printLayoutPageBreakClasses } from '@expcat/tigercat-core';
-
 // src/components/PrintLayout.ts
+import { defineComponent, h, computed } from "vue";
+import {
+  classNames,
+  coerceClassValue,
+  getPrintLayoutClasses,
+  printLayoutHeaderClasses,
+  printLayoutFooterClasses,
+  printLayoutPageBreakClasses
+} from "@expcat/tigercat-core";
 var PrintLayout = defineComponent({
   name: "TigerPrintLayout",
   inheritAttrs: false,
@@ -90,4 +96,8 @@ var PrintPageBreak = defineComponent({
 });
 var PrintLayout_default = PrintLayout;
 
-export { PrintLayout, PrintLayout_default, PrintPageBreak };
+export {
+  PrintLayout,
+  PrintPageBreak,
+  PrintLayout_default
+};

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

@@ -1,8 +1,117 @@
-import { defineComponent, ref, computed, watch, onMounted, nextTick, onBeforeUnmount, reactive, provide, h } from 'vue';
-import { classNames, getAnchorWrapperClasses, coerceClassValue, getAnchorInkContainerClasses, getAnchorInkActiveClasses, getAnchorLinkListClasses, mergeStyleValues, findActiveAnchor, scrollToAnchor } from '@expcat/tigercat-core';
-
 // src/components/Anchor.ts
+import {
+  defineComponent,
+  h,
+  ref,
+  computed,
+  provide,
+  inject,
+  onMounted,
+  onBeforeUnmount,
+  watch,
+  nextTick,
+  reactive
+} from "vue";
+import {
+  classNames,
+  coerceClassValue,
+  mergeStyleValues,
+  getAnchorWrapperClasses,
+  getAnchorInkContainerClasses,
+  getAnchorInkActiveClasses,
+  getAnchorLinkClasses,
+  getAnchorLinkListClasses,
+  createAnchorObserver,
+  scrollToAnchor
+} from "@expcat/tigercat-core";
 var AnchorContextKey = /* @__PURE__ */ Symbol("AnchorContext");
+var AnchorLink = defineComponent({
+  name: "TigerAnchorLink",
+  inheritAttrs: false,
+  props: {
+    /**
+     * Target anchor ID (with #)
+     */
+    href: {
+      type: String,
+      required: true
+    },
+    /**
+     * Link title/text
+     */
+    title: {
+      type: String,
+      default: void 0
+    },
+    /**
+     * Link target attribute
+     */
+    target: {
+      type: String,
+      default: void 0
+    },
+    className: {
+      type: String,
+      default: void 0
+    }
+  },
+  setup(props, { slots, attrs }) {
+    const anchorContext = inject(AnchorContextKey, null);
+    onMounted(() => {
+      anchorContext?.registerLink(props.href);
+    });
+    onBeforeUnmount(() => {
+      anchorContext?.unregisterLink(props.href);
+    });
+    const handleClick = (event) => {
+      event.preventDefault();
+      anchorContext?.handleLinkClick(props.href, event);
+    };
+    const linkClasses = computed(() => {
+      const isActive = anchorContext?.activeLink === props.href;
+      return classNames(
+        getAnchorLinkClasses(isActive, props.className),
+        coerceClassValue(attrs.class)
+      );
+    });
+    return () => {
+      const slotContent = slots.default?.();
+      const hasNestedLinks = slotContent && Array.isArray(slotContent) && slotContent.some(
+        (vnode) => vnode.type && vnode.type.name === "TigerAnchorLink"
+      );
+      if (hasNestedLinks) {
+        return h("div", { class: "anchor-link-wrapper" }, [
+          h(
+            "a",
+            {
+              ...attrs,
+              href: props.href,
+              target: props.target,
+              class: linkClasses.value,
+              "data-anchor-href": props.href,
+              onClick: handleClick
+            },
+            props.title
+          ),
+          h("div", { class: "pl-3 mt-1 space-y-1" }, slotContent)
+        ]);
+      }
+      const content = slotContent ?? props.title;
+      return h(
+        "a",
+        {
+          ...attrs,
+          href: props.href,
+          target: props.target,
+          class: linkClasses.value,
+          "data-anchor-href": props.href,
+          onClick: handleClick
+        },
+        content
+      );
+    };
+  }
+});
 var Anchor = defineComponent({
   name: "TigerAnchor",
   inheritAttrs: false,
@@ -85,7 +194,6 @@ var Anchor = defineComponent({
     const anchorRef = ref(null);
     const inkRef = ref(null);
     const isScrolling = ref(false);
-    let animationFrameId = null;
     let scrollTimeoutId = null;
     const getContainer = () => props.getContainer();
     const scrollOffset = computed(() => props.targetOffset ?? props.offsetTop);
@@ -97,23 +205,21 @@ var Anchor = defineComponent({
     const unregisterLink = (href) => {
       links.value = links.value.filter((l) => l !== href);
     };
-    const handleScroll = () => {
-      if (isScrolling.value) return;
-      if (animationFrameId !== null) {
-        cancelAnimationFrame(animationFrameId);
-      }
-      animationFrameId = requestAnimationFrame(() => {
-        const container = getContainer();
-        const newActiveLink = findActiveAnchor(
-          links.value,
-          container,
-          props.bounds,
-          scrollOffset.value
-        );
-        const finalActiveLink = props.getCurrentAnchor ? props.getCurrentAnchor(newActiveLink) : newActiveLink;
-        if (finalActiveLink !== activeLink.value) {
-          activeLink.value = finalActiveLink;
-          emit("change", finalActiveLink);
+    let stopObserver = null;
+    const setupObserver = () => {
+      stopObserver?.();
+      const container = getContainer();
+      const root = container === window ? null : container;
+      stopObserver = createAnchorObserver(links.value, {
+        offsetTop: scrollOffset.value,
+        root,
+        onChange: (newActiveLink) => {
+          if (isScrolling.value) return;
+          const finalActiveLink = props.getCurrentAnchor ? props.getCurrentAnchor(newActiveLink) : newActiveLink;
+          if (finalActiveLink !== activeLink.value) {
+            activeLink.value = finalActiveLink;
+            emit("change", finalActiveLink);
+          }
         }
       });
     };
@@ -155,22 +261,17 @@ var Anchor = defineComponent({
       updateInkPosition();
     });
     watch(() => props.direction, updateInkPosition);
-    let currentContainer = null;
     onMounted(() => {
       nextTick(() => {
-        currentContainer = getContainer();
-        currentContainer.addEventListener("scroll", handleScroll, { passive: true });
-        handleScroll();
+        setupObserver();
         setTimeout(updateInkPosition, 0);
       });
     });
+    watch([links, scrollOffset, () => props.getContainer], () => {
+      nextTick(() => setupObserver());
+    });
     onBeforeUnmount(() => {
-      if (currentContainer) {
-        currentContainer.removeEventListener("scroll", handleScroll);
-      }
-      if (animationFrameId !== null) {
-        cancelAnimationFrame(animationFrameId);
-      }
+      stopObserver?.();
       if (scrollTimeoutId !== null) {
         clearTimeout(scrollTimeoutId);
       }
@@ -244,4 +345,9 @@ var Anchor = defineComponent({
 });
 var Anchor_default = Anchor;
 
-export { Anchor, AnchorContextKey, Anchor_default };
+export {
+  AnchorContextKey,
+  AnchorLink,
+  Anchor,
+  Anchor_default
+};

package/dist/chunk-EJNPSYTS.js

@@ -0,0 +1,44 @@
+"use strict";Object.defineProperty(exports, "__esModule", {value: true});// src/components/Divider.ts
+var _vue = require('vue');
+
+
+
+var _tigercatcore = require('@expcat/tigercat-core');
+var Divider = _vue.defineComponent.call(void 0, {
+  name: "TigerDivider",
+  props: {
+    orientation: {
+      type: String,
+      default: "horizontal"
+    },
+    lineStyle: {
+      type: String,
+      default: "solid"
+    },
+    spacing: {
+      type: String,
+      default: "md"
+    },
+    color: String,
+    thickness: String
+  },
+  setup(props, { attrs }) {
+    const classes = _vue.computed.call(void 0, 
+      () => _tigercatcore.getDividerClasses.call(void 0, props.orientation, props.lineStyle, props.spacing)
+    );
+    const style = _vue.computed.call(void 0, () => _tigercatcore.getDividerStyle.call(void 0, props.orientation, props.color, props.thickness));
+    return () => _vue.h.call(void 0, "div", {
+      ...attrs,
+      class: [classes.value, attrs.class],
+      style: [style.value, attrs.style],
+      role: "separator",
+      "aria-orientation": props.orientation
+    });
+  }
+});
+var Divider_default = Divider;
+
+
+
+
+exports.Divider = Divider; exports.Divider_default = Divider_default;

package/dist/{chunk-TW64ZNZY.mjs → chunk-EKWJTB5H.mjs}

@@ -1,10 +1,28 @@
-import { Input } from './chunk-2WJADO6O.mjs';
-import { Textarea } from './chunk-MKBIVETW.mjs';
-import { Button } from './chunk-M7JUNLA7.mjs';
-import { Avatar } from './chunk-COCECPMG.mjs';
-import { defineComponent, ref, watch, computed, h } from 'vue';
-import { classNames, coerceClassValue, mergeStyleValues, getChatMessageStatusInfo, formatChatTime } from '@expcat/tigercat-core';
+import {
+  VirtualList
+} from "./chunk-PENI3H3I.mjs";
+import {
+  Input
+} from "./chunk-2WJADO6O.mjs";
+import {
+  Textarea
+} from "./chunk-MKBIVETW.mjs";
+import {
+  Button
+} from "./chunk-UM5GGKIX.mjs";
+import {
+  Avatar
+} from "./chunk-COCECPMG.mjs";
 
+// src/components/ChatWindow.ts
+import { defineComponent, h, computed, ref, watch, onMounted, onUpdated } from "vue";
+import {
+  classNames,
+  coerceClassValue,
+  getChatMessageStatusInfo,
+  formatChatTime,
+  mergeStyleValues
+} from "@expcat/tigercat-core";
 var ChatWindow = defineComponent({
   name: "TigerChatWindow",
   inheritAttrs: false,
@@ -91,6 +109,22 @@ var ChatWindow = defineComponent({
       type: Boolean,
       default: true
     },
+    virtual: {
+      type: Boolean,
+      default: false
+    },
+    virtualItemHeight: {
+      type: Number,
+      default: 88
+    },
+    virtualHeight: {
+      type: Number,
+      default: 400
+    },
+    autoScrollToBottom: {
+      type: Boolean,
+      default: true
+    },
     className: {
       type: String
     },
@@ -116,7 +150,7 @@ var ChatWindow = defineComponent({
     );
     const wrapperClasses = computed(
       () => classNames(
-        "tiger-chat-window flex flex-col w-full rounded-lg border border-[var(--tiger-border,#e5e7eb)] bg-[var(--tiger-surface,#ffffff)]",
+        "tiger-chat-window flex flex-col w-full rounded-[var(--tiger-radius-md,0.5rem)] border border-[var(--tiger-border,#e5e7eb)] bg-[var(--tiger-surface,#ffffff)]",
         props.className,
         coerceClassValue(attrs.class)
       )
@@ -154,6 +188,28 @@ var ChatWindow = defineComponent({
       event.preventDefault();
       handleSend();
     };
+    const messageListRef = ref(null);
+    const virtualWrapperRef = ref(null);
+    const scrollToBottom = () => {
+      if (!props.autoScrollToBottom) return;
+      requestAnimationFrame(() => {
+        if (props.virtual) {
+          const wrapper = virtualWrapperRef.value;
+          const scroller = wrapper?.firstElementChild ?? wrapper;
+          if (scroller) {
+            scroller.scrollTop = scroller.scrollHeight;
+          }
+        } else if (messageListRef.value) {
+          messageListRef.value.scrollTop = messageListRef.value.scrollHeight;
+        }
+      });
+    };
+    onMounted(scrollToBottom);
+    onUpdated(scrollToBottom);
+    watch(
+      () => props.messages.length,
+      () => scrollToBottom()
+    );
     const renderMessageItem = (message, index) => {
       const isSelf = message.direction === "self";
       const statusInfo = message.status ? getChatMessageStatusInfo(message.status) : void 0;
@@ -192,7 +248,7 @@ var ChatWindow = defineComponent({
               "div",
               {
                 class: classNames(
-                  "rounded-lg px-3 py-2 text-sm break-words",
+                  "rounded-[var(--tiger-radius-md,0.5rem)] px-3 py-2 text-sm break-words",
                   isSelf ? "bg-[var(--tiger-primary,#2563eb)] text-white rounded-tr-none" : "bg-[var(--tiger-surface-muted,#f3f4f6)] text-[var(--tiger-text,#111827)] rounded-tl-none"
                 ),
                 "data-tiger-chat-bubble": ""
@@ -234,9 +290,32 @@ var ChatWindow = defineComponent({
         "data-tiger-chat-window": ""
       },
       [
-        h(
+        props.virtual && props.messages.length > 0 ? h(
+          "div",
+          {
+            ref: virtualWrapperRef,
+            role: "log",
+            "aria-live": "polite",
+            "aria-relevant": "additions text",
+            "aria-label": props.messageListAriaLabel ?? "\u6D88\u606F\u5217\u8868"
+          },
+          [
+            h(
+              VirtualList,
+              {
+                itemCount: props.messages.length,
+                itemHeight: props.virtualItemHeight,
+                height: props.virtualHeight
+              },
+              {
+                default: ({ index }) => renderMessageItem(props.messages[index], index)
+              }
+            )
+          ]
+        ) : h(
           "div",
           {
+            ref: messageListRef,
             class: "flex-1 overflow-auto p-4 space-y-3",
             role: "log",
             "aria-live": "polite",
@@ -284,4 +363,7 @@ var ChatWindow = defineComponent({
 });
 var ChatWindow_default = ChatWindow;
 
-export { ChatWindow, ChatWindow_default };
+export {
+  ChatWindow,
+  ChatWindow_default
+};