@expcat/tigercat-vue 1.0.4 → 1.1.0

package/dist/{chunk-2WZGK7XJ.js → chunk-LWDA7ABQ.js}

@@ -1,6 +1,6 @@
 'use strict';
 
-var chunkIVTBNUKQ_js = require('./chunk-IVTBNUKQ.js');
+var chunkJDCVS4SJ_js = require('./chunk-JDCVS4SJ.js');
 var vue = require('vue');
 var tigercatCore = require('@expcat/tigercat-core');
 
@@ -30,7 +30,7 @@ function useFloatingPopup(options) {
     x,
     y,
     placement: actualPlacement
-  } = chunkIVTBNUKQ_js.useVueFloating({
+  } = chunkJDCVS4SJ_js.useVueFloating({
     referenceRef: triggerRef,
     floatingRef,
     enabled: currentVisible,
@@ -50,15 +50,15 @@ function useFloatingPopup(options) {
       outsideClickCleanup = void 0;
       escapeKeyCleanup = void 0;
       if (visible && trigger === "click") {
-        outsideClickCleanup = chunkIVTBNUKQ_js.useVueClickOutside({
+        outsideClickCleanup = chunkJDCVS4SJ_js.useVueClickOutside({
           enabled: currentVisible,
-          containerRef,
+          refs: [containerRef, floatingRef],
           onOutsideClick: () => setVisible(false),
           defer: true
         });
       }
       if (visible && trigger !== "manual") {
-        escapeKeyCleanup = chunkIVTBNUKQ_js.useVueEscapeKey({
+        escapeKeyCleanup = chunkJDCVS4SJ_js.useVueEscapeKey({
           enabled: currentVisible,
           onEscape: () => setVisible(false)
         });

package/dist/{chunk-2SCIJ2RW.mjs → chunk-M3G6LJKZ.mjs}

@@ -1,5 +1,5 @@
 import { defineComponent, computed, provide, h } from 'vue';
-import { getGutterStyles, classNames, getAlignClasses, getJustifyClasses } from '@expcat/tigercat-core';
+import { getRowGutterStyleVars, classNames, getRowGutterClasses, getAlignClasses, getJustifyClasses } from '@expcat/tigercat-core';
 
 // src/components/Row.ts
 var RowContextKey = /* @__PURE__ */ Symbol("RowContext");
@@ -41,12 +41,13 @@ var Row = defineComponent({
   },
   setup(props, { slots, attrs }) {
     const gutter = computed(() => props.gutter);
-    const rowStyle = computed(() => getGutterStyles(gutter.value).rowStyle);
+    const rowStyle = computed(() => getRowGutterStyleVars(gutter.value));
     const rowClasses = computed(() => {
       return classNames(
         "flex",
         "w-full",
         props.wrap && "flex-wrap",
+        getRowGutterClasses(gutter.value),
         getAlignClasses(props.align),
         getJustifyClasses(props.justify)
       );

package/dist/{chunk-P4X7GS2X.mjs → chunk-MDPHUCVS.mjs}

@@ -1,12 +1,12 @@
 import { Timeline } from './chunk-LBGTABIU.mjs';
 import { Link } from './chunk-4YHOD7LT.mjs';
-import { Loading } from './chunk-Q6OYCTQO.mjs';
+import { Loading } from './chunk-PCUUTKQZ.mjs';
 import { Tag } from './chunk-3G4VPV4D.mjs';
 import { Text } from './chunk-6V7XCCXN.mjs';
 import { Card } from './chunk-KOTSKHPQ.mjs';
 import { Avatar } from './chunk-COCECPMG.mjs';
 import { defineComponent, computed, h } from 'vue';
-import { buildActivityGroups, classNames, coerceClassValue, mergeStyleValues, toActivityTimelineItems, formatActivityTime } from '@expcat/tigercat-core';
+import { buildActivityGroups, classNames, coerceClassValue, mergeStyleValues, toActivityTimelineItems, formatActivityTime, activityItemClasses, activityItemLayoutClasses, activityItemBodyClasses, activityItemHeaderClasses, activityItemTitleGroupClasses, activityItemDescriptionClasses, activityItemActionsClasses } from '@expcat/tigercat-core';
 
 var renderAction = (item, action, index) => {
   const key = action.key ?? `${item.id}-action-${index}`;
@@ -109,19 +109,19 @@ var ActivityFeed = defineComponent({
       return h(
         "div",
         {
-          class: "tiger-activity-item"
+          class: activityItemClasses
         },
         [
-          h("div", { class: "flex gap-3 items-start" }, [
+          h("div", { class: activityItemLayoutClasses }, [
             props.showAvatar && item.user ? h(Avatar, {
               size: "sm",
               src: item.user.avatar,
               text: item.user.name,
               className: "shrink-0"
             }) : null,
-            h("div", { class: "flex-1 min-w-0" }, [
-              h("div", { class: "flex items-center justify-between gap-2 mb-1" }, [
-                h("div", { class: "flex items-center gap-2 min-w-0" }, [
+            h("div", { class: activityItemBodyClasses }, [
+              h("div", { class: activityItemHeaderClasses }, [
+                h("div", { class: activityItemTitleGroupClasses }, [
                   titleText ? h(
                     Text,
                     { tag: "div", size: "sm", weight: "medium", class: "truncate" },
@@ -150,15 +150,22 @@ var ActivityFeed = defineComponent({
               ]),
               descriptionText ? h(
                 Text,
-                { tag: "div", size: "sm", color: "muted", class: "mb-2 break-words" },
+                { tag: "div", size: "sm", color: "muted", class: activityItemDescriptionClasses },
                 { default: () => descriptionText }
               ) : null,
-              actionNodes?.length ? h("div", { class: "flex flex-wrap gap-2" }, actionNodes) : null
+              actionNodes?.length ? h("div", { class: activityItemActionsClasses }, actionNodes) : null
             ])
           ])
         ]
       );
     };
+    const feedRole = computed(() => attrs.role ?? "feed");
+    const feedAriaLabel = computed(
+      () => attrs["aria-label"] ?? (attrs["aria-labelledby"] ? void 0 : "\u52A8\u6001")
+    );
+    const feedAriaBusy = computed(
+      () => attrs["aria-busy"] ?? (props.loading ? "true" : void 0)
+    );
     return () => {
       if (props.loading) {
         const loadingNode = slots.loading ? slots.loading() : h(Loading, { text: props.loadingText });
@@ -168,6 +175,9 @@ var ActivityFeed = defineComponent({
             ...attrs,
             class: wrapperClasses.value,
             style: wrapperStyle.value,
+            role: feedRole.value,
+            "aria-label": feedAriaLabel.value,
+            "aria-busy": feedAriaBusy.value,
             "data-tiger-activity-feed": true
           },
           [
@@ -189,6 +199,8 @@ var ActivityFeed = defineComponent({
             ...attrs,
             class: wrapperClasses.value,
             style: wrapperStyle.value,
+            role: feedRole.value,
+            "aria-label": feedAriaLabel.value,
             "data-tiger-activity-feed": true
           },
           [
@@ -208,6 +220,8 @@ var ActivityFeed = defineComponent({
           ...attrs,
           class: wrapperClasses.value,
           style: wrapperStyle.value,
+          role: feedRole.value,
+          "aria-label": feedAriaLabel.value,
           "data-tiger-activity-feed": true
         },
         resolvedGroups.value.map((group, groupIndex) => {

package/dist/{chunk-LV3BMS4U.mjs → chunk-ML2QP5KF.mjs}

@@ -1,6 +1,6 @@
-import { useTigerConfig } from './chunk-XP5M2GK7.mjs';
+import { useTigerConfig } from './chunk-E3BSOB7P.mjs';
 import { defineComponent, ref, computed, watch, h } from 'vue';
-import { getSpinnerSVG, mergeTigerLocale, getUploadLabels, mergeStyleValues, classNames, coerceClassValue, getDragAreaClasses, interpolateUploadLabel, formatFileSize, getUploadButtonClasses, getPictureCardClasses, getUploadStatusIconClasses, normalizeSvgAttrs, getFileListItemClasses, icon20ViewBox, successCircleSolidIcon20PathD, errorCircleSolidIcon20PathD, closeSolidIcon20PathD, prepareUploadFiles, fileToUploadFile } from '@expcat/tigercat-core';
+import { getSpinnerSVG, mergeTigerLocale, getUploadLabels, mergeStyleValues, classNames, coerceClassValue, getDragAreaClasses, interpolateUploadLabel, formatFileSize, getUploadButtonClasses, handleUploadDrop, handleUploadDragLeave, handleUploadDragOver, getPictureCardClasses, getUploadStatusIconClasses, normalizeSvgAttrs, getFileListItemClasses, icon20ViewBox, successCircleSolidIcon20PathD, errorCircleSolidIcon20PathD, closeSolidIcon20PathD, prepareUploadFiles, fileToUploadFile } from '@expcat/tigercat-core';
 
 var Upload = defineComponent({
   name: "TigerUpload",
@@ -251,21 +251,20 @@ var Upload = defineComponent({
       emit("preview", file);
     };
     const handleDragOver = (event) => {
-      if (props.disabled) return;
-      event.preventDefault();
-      isDragging.value = true;
+      const result = handleUploadDragOver(event, props.disabled);
+      if (!result.handled) return;
+      isDragging.value = result.isDragging;
     };
     const handleDragLeave = (event) => {
-      if (props.disabled) return;
-      event.preventDefault();
-      isDragging.value = false;
+      const result = handleUploadDragLeave(event, props.disabled);
+      if (!result.handled) return;
+      isDragging.value = result.isDragging;
     };
     const handleDrop = async (event) => {
-      if (props.disabled) return;
-      event.preventDefault();
-      isDragging.value = false;
-      const files = Array.from(event.dataTransfer?.files || []);
-      await processFiles(files);
+      const result = handleUploadDrop(event, props.disabled);
+      if (!result.handled) return;
+      isDragging.value = result.isDragging;
+      await processFiles(result.files);
     };
     const handleDragKeydown = (event) => {
       if (props.disabled) return;

package/dist/{chunk-G4ZD6COW.js → chunk-MRMKZTC6.js}

@@ -1,6 +1,6 @@
 'use strict';
 
-var chunkIVTBNUKQ_js = require('./chunk-IVTBNUKQ.js');
+var chunkJDCVS4SJ_js = require('./chunk-JDCVS4SJ.js');
 var vue = require('vue');
 var tigercatCore = require('@expcat/tigercat-core');
 
@@ -155,33 +155,22 @@ var Drawer = vue.defineComponent({
       emit("close");
     };
     const handleMaskClick = (event) => {
-      if (!props.maskClosable) return;
-      if (event.target === event.currentTarget) {
+      if (tigercatCore.shouldCloseOnMaskClick(event, props.maskClosable)) {
         handleClose();
       }
     };
     const escapeEnabled = vue.computed(() => props.open);
     let cleanupEscape;
-    const handleKeyDown = (event) => {
-      if (event.key === "Tab" && props.open && dialogRef.value) {
-        const focusables = tigercatCore.getFocusableElements(dialogRef.value);
-        const result = tigercatCore.getFocusTrapNavigation(event, focusables, document.activeElement);
-        if (result.shouldHandle && result.next) {
-          event.preventDefault();
-          result.next.focus();
-        }
-      }
-    };
+    chunkJDCVS4SJ_js.useVueBodyScrollLock(escapeEnabled);
+    chunkJDCVS4SJ_js.useVueFocusTrap({ enabled: escapeEnabled, containerRef: dialogRef });
     vue.onMounted(() => {
-      cleanupEscape = chunkIVTBNUKQ_js.useVueEscapeKey({
+      cleanupEscape = chunkJDCVS4SJ_js.useVueEscapeKey({
         enabled: escapeEnabled,
         onEscape: handleClose
       });
-      document.addEventListener("keydown", handleKeyDown);
     });
     vue.onBeforeUnmount(() => {
       cleanupEscape?.();
-      document.removeEventListener("keydown", handleKeyDown);
     });
     vue.watch(
       () => props.open,
@@ -314,7 +303,7 @@ var Drawer = vue.defineComponent({
         },
         [mask, panel]
       );
-      return vue.h(vue.Teleport, { to: "body", disabled: props.disableTeleport }, [root]);
+      return chunkJDCVS4SJ_js.renderVueBodyTeleport([root], props.disableTeleport);
     };
   }
 });

package/dist/{chunk-MVIHUPCX.js → chunk-MSKAWM7K.js}

@@ -1,6 +1,6 @@
 'use strict';
 
-var chunkI2BZURVP_js = require('./chunk-I2BZURVP.js');
+var chunkXUOGT4HG_js = require('./chunk-XUOGT4HG.js');
 var vue = require('vue');
 var tigercatCore = require('@expcat/tigercat-core');
 
@@ -27,7 +27,7 @@ var Col = vue.defineComponent({
     }
   },
   setup(props, { slots, attrs }) {
-    const rowContext = vue.inject(chunkI2BZURVP_js.RowContextKey, null);
+    const rowContext = vue.inject(chunkXUOGT4HG_js.RowContextKey, null);
     const gutter = vue.computed(() => rowContext?.gutter.value ?? 0);
     const isFlexSpanMode = vue.computed(() => props.flex !== void 0 && props.span === 0);
     const colClasses = vue.computed(
@@ -35,11 +35,11 @@ var Col = vue.defineComponent({
         isFlexSpanMode.value ? "" : tigercatCore.getSpanClasses(props.span),
         tigercatCore.getOffsetClasses(props.offset),
         tigercatCore.getOrderClasses(props.order),
-        tigercatCore.getFlexClasses(props.flex)
+        tigercatCore.getFlexClasses(props.flex),
+        tigercatCore.getColGutterClasses(gutter.value)
       )
     );
     const colMergedStyle = vue.computed(() => ({
-      ...tigercatCore.getGutterStyles(gutter.value).colStyle,
       ...tigercatCore.getColMergedStyleVars(
         isFlexSpanMode.value ? void 0 : props.span,
         props.offset,