@expcat/tigercat-vue 0.2.10 → 0.3.0

package/dist/{chunk-ENPZERP2.js → chunk-36KWP3NX.js}

@@ -1,6 +1,6 @@
 'use strict';
 
-var chunkAK3SVOJA_js = require('./chunk-AK3SVOJA.js');
+var chunkUBMNR3BJ_js = require('./chunk-UBMNR3BJ.js');
 var vue = require('vue');
 var tigercatCore = require('@expcat/tigercat-core');
 
@@ -48,7 +48,7 @@ var DropdownItem = vue.defineComponent({
     const attrsRecord = attrs;
     const attrsClass = attrsRecord.class;
     const attrsStyle = attrsRecord.style;
-    const context = vue.inject(chunkAK3SVOJA_js.DropdownContextKey, null);
+    const context = vue.inject(chunkUBMNR3BJ_js.DropdownContextKey, null);
     const handleClick = (event) => {
       if (props.disabled) {
         event.preventDefault();

package/dist/{chunk-FOQHXUHK.js → chunk-3F2QHERR.js}

@@ -84,19 +84,29 @@ var FormItem = vue.defineComponent({
     const labelAlign = vue.computed(() => {
       return formContext.value?.labelAlign || "right";
     });
+    const hasRequiredRule = (maybeRules) => {
+      if (!maybeRules) {
+        return false;
+      }
+      const rules = Array.isArray(maybeRules) ? maybeRules : [maybeRules];
+      return rules.some((rule) => {
+        if (!rule || typeof rule !== "object") {
+          return false;
+        }
+        return !!rule.required;
+      });
+    };
     const showRequiredAsterisk = vue.computed(() => {
       if (props.required !== void 0) {
         return props.required;
       }
       if (props.rules) {
-        const rules = Array.isArray(props.rules) ? props.rules : [props.rules];
-        return rules.some((rule) => rule.required);
+        return hasRequiredRule(props.rules);
       }
       if (props.name && formContext.value?.rules) {
         const fieldRules = formContext.value.rules[props.name];
         if (fieldRules) {
-          const rules = Array.isArray(fieldRules) ? fieldRules : [fieldRules];
-          return rules.some((rule) => rule.required);
+          return hasRequiredRule(fieldRules);
         }
       }
       return false;
@@ -164,20 +174,20 @@ var FormItem = vue.defineComponent({
       return props.showMessage && hasError.value ? errorId : void 0;
     });
     const formItemClasses = vue.computed(() => {
-      return tigercatCore.classNames(
-        "tiger-form-item",
-        `tiger-form-item--${actualSize.value}`,
-        `tiger-form-item--label-${labelPosition.value}`,
-        hasError.value && "tiger-form-item--error",
-        formContext.value?.disabled && "tiger-form-item--disabled"
-      );
+      return tigercatCore.getFormItemClasses({
+        size: actualSize.value,
+        labelPosition: labelPosition.value,
+        hasError: hasError.value,
+        disabled: formContext.value?.disabled
+      });
     });
     const labelClasses = vue.computed(() => {
-      return tigercatCore.classNames(
-        "tiger-form-item__label",
-        `tiger-form-item__label--${labelAlign.value}`,
-        isRequired.value && "tiger-form-item__label--required"
-      );
+      return tigercatCore.getFormItemLabelClasses({
+        size: actualSize.value,
+        labelAlign: labelAlign.value,
+        labelPosition: labelPosition.value,
+        isRequired: isRequired.value
+      });
     });
     const labelStyles = vue.computed(() => {
       if (labelPosition.value === "top") {
@@ -185,10 +195,16 @@ var FormItem = vue.defineComponent({
       }
       return actualLabelWidth.value ? { width: actualLabelWidth.value } : {};
     });
-    const contentClasses = "tiger-form-item__content";
+    const contentClasses = vue.computed(() => tigercatCore.getFormItemContentClasses(labelPosition.value));
     const errorClasses = vue.computed(() => {
-      return tigercatCore.classNames("tiger-form-item__error", hasError.value && "tiger-form-item__error--show");
+      return tigercatCore.classNames(
+        tigercatCore.getFormItemErrorClasses(actualSize.value),
+        hasError.value && "tiger-form-item__error--show"
+      );
     });
+    const fieldClasses = vue.computed(() => tigercatCore.getFormItemFieldClasses());
+    const asteriskClasses = vue.computed(() => tigercatCore.getFormItemAsteriskClasses());
+    const asteriskStyle = vue.computed(() => tigercatCore.getFormItemAsteriskStyle());
     return () => {
       const mergeAriaDescribedBy = (existing, next) => {
         if (!existing) {
@@ -262,20 +278,20 @@ var FormItem = vue.defineComponent({
           for: effectiveFieldId
         },
         [
-          isRequired.value && vue.h("span", { class: "tiger-form-item__asterisk" }, "*"),
+          isRequired.value && vue.h("span", { class: asteriskClasses.value, style: asteriskStyle.value }, "*"),
           props.label
         ]
       ) : null;
       const contentElement = vue.h(
         "div",
         {
-          class: contentClasses
+          class: contentClasses.value
         },
         [
           vue.h(
             "div",
             {
-              class: "tiger-form-item__field",
+              class: fieldClasses.value,
               role: "group",
               "aria-labelledby": props.label ? labelId : void 0,
               "aria-describedby": describedById.value,

package/dist/chunk-3G2QV4TL.js

@@ -0,0 +1,245 @@
+'use strict';
+
+var chunkWO332QT2_js = require('./chunk-WO332QT2.js');
+var chunkYFMXWX6H_js = require('./chunk-YFMXWX6H.js');
+var chunkZK26QLSW_js = require('./chunk-ZK26QLSW.js');
+var chunkCCI3RIZU_js = require('./chunk-CCI3RIZU.js');
+var chunkI7GSAVM7_js = require('./chunk-I7GSAVM7.js');
+var chunkSKUTVXHP_js = require('./chunk-SKUTVXHP.js');
+var chunkU65XZCPB_js = require('./chunk-U65XZCPB.js');
+var vue = require('vue');
+var tigercatCore = require('@expcat/tigercat-core');
+
+var renderAction = (item, action, index) => {
+  const key = action.key ?? `${item.id}-action-${index}`;
+  return vue.h(
+    chunkYFMXWX6H_js.Link,
+    {
+      key,
+      size: "sm",
+      variant: "primary",
+      href: action.href,
+      target: action.target,
+      disabled: action.disabled,
+      onClick: () => action.onClick?.(item, action)
+    },
+    {
+      default: () => action.label
+    }
+  );
+};
+var ActivityFeed = vue.defineComponent({
+  name: "TigerActivityFeed",
+  inheritAttrs: false,
+  props: {
+    items: {
+      type: Array,
+      default: () => []
+    },
+    groups: {
+      type: Array,
+      default: void 0
+    },
+    groupBy: {
+      type: Function,
+      default: void 0
+    },
+    groupOrder: {
+      type: Array,
+      default: void 0
+    },
+    loading: {
+      type: Boolean,
+      default: false
+    },
+    loadingText: {
+      type: String,
+      default: "\u52A0\u8F7D\u4E2D..."
+    },
+    emptyText: {
+      type: String,
+      default: "\u6682\u65E0\u52A8\u6001"
+    },
+    showAvatar: {
+      type: Boolean,
+      default: true
+    },
+    showTime: {
+      type: Boolean,
+      default: true
+    },
+    showGroupTitle: {
+      type: Boolean,
+      default: true
+    },
+    className: {
+      type: String,
+      default: void 0
+    },
+    style: {
+      type: Object,
+      default: void 0
+    }
+  },
+  setup(props, { slots, attrs }) {
+    const resolvedGroups = vue.computed(
+      () => tigercatCore.buildActivityGroups(props.items, props.groups, props.groupBy, props.groupOrder)
+    );
+    const wrapperClasses = vue.computed(
+      () => tigercatCore.classNames(
+        "tiger-activity-feed",
+        "flex",
+        "flex-col",
+        "gap-6",
+        "w-full",
+        props.className,
+        tigercatCore.coerceClassValue(attrs.class)
+      )
+    );
+    const wrapperStyle = vue.computed(() => tigercatCore.mergeStyleValues(attrs.style, props.style));
+    const renderDefaultItem = (item, index, group) => {
+      if (slots.item) {
+        const slotContent = slots.item({ item, index, group });
+        if (slotContent) return slotContent;
+      }
+      const titleText = item.title ?? (typeof item.content === "string" || typeof item.content === "number" ? String(item.content) : "");
+      const descriptionText = item.description;
+      const timeText = props.showTime ? tigercatCore.formatActivityTime(item.time) : "";
+      const actionNodes = item.actions?.map(
+        (action, actionIndex) => renderAction(item, action, actionIndex)
+      );
+      return vue.h(
+        "div",
+        {
+          class: "tiger-activity-item"
+        },
+        [
+          vue.h("div", { class: "flex gap-3 items-start" }, [
+            props.showAvatar && item.user ? vue.h(chunkU65XZCPB_js.Avatar, {
+              size: "sm",
+              src: item.user.avatar,
+              text: item.user.name,
+              className: "shrink-0"
+            }) : null,
+            vue.h("div", { class: "flex-1 min-w-0" }, [
+              vue.h("div", { class: "flex items-center justify-between gap-2 mb-1" }, [
+                vue.h("div", { class: "flex items-center gap-2 min-w-0" }, [
+                  titleText ? vue.h(
+                    chunkI7GSAVM7_js.Text,
+                    { tag: "div", size: "sm", weight: "medium", class: "truncate" },
+                    { default: () => titleText }
+                  ) : null,
+                  item.status ? vue.h(
+                    chunkCCI3RIZU_js.Tag,
+                    {
+                      variant: item.status.variant ?? "default",
+                      size: "sm",
+                      className: "shrink-0"
+                    },
+                    { default: () => item.status?.label }
+                  ) : null
+                ]),
+                timeText ? vue.h(
+                  chunkI7GSAVM7_js.Text,
+                  {
+                    tag: "div",
+                    size: "xs",
+                    color: "muted",
+                    class: "shrink-0 whitespace-nowrap"
+                  },
+                  { default: () => timeText }
+                ) : null
+              ]),
+              descriptionText ? vue.h(
+                chunkI7GSAVM7_js.Text,
+                { tag: "div", size: "sm", color: "muted", class: "mb-2 break-words" },
+                { default: () => descriptionText }
+              ) : null,
+              actionNodes?.length ? vue.h("div", { class: "flex flex-wrap gap-2" }, actionNodes) : null
+            ])
+          ])
+        ]
+      );
+    };
+    return () => {
+      if (props.loading) {
+        const loadingNode = slots.loading ? slots.loading() : vue.h(chunkZK26QLSW_js.Loading, { text: props.loadingText });
+        return vue.h(
+          "div",
+          {
+            ...attrs,
+            class: wrapperClasses.value,
+            style: wrapperStyle.value,
+            "data-tiger-activity-feed": true
+          },
+          [
+            vue.h(
+              chunkSKUTVXHP_js.Card,
+              { variant: "bordered", size: "sm", className: "tiger-activity-feed-loading" },
+              {
+                default: () => vue.h("div", { class: "flex items-center justify-center py-4" }, loadingNode)
+              }
+            )
+          ]
+        );
+      }
+      if (resolvedGroups.value.length === 0) {
+        const emptyNode = slots.empty ? slots.empty() : vue.h(chunkI7GSAVM7_js.Text, { tag: "div", size: "sm", color: "muted" }, { default: () => props.emptyText });
+        return vue.h(
+          "div",
+          {
+            ...attrs,
+            class: wrapperClasses.value,
+            style: wrapperStyle.value,
+            "data-tiger-activity-feed": true
+          },
+          [
+            vue.h(
+              chunkSKUTVXHP_js.Card,
+              { variant: "bordered", size: "sm", className: "tiger-activity-feed-empty" },
+              {
+                default: () => vue.h("div", { class: "flex items-center justify-center py-6" }, emptyNode)
+              }
+            )
+          ]
+        );
+      }
+      return vue.h(
+        "div",
+        {
+          ...attrs,
+          class: wrapperClasses.value,
+          style: wrapperStyle.value,
+          "data-tiger-activity-feed": true
+        },
+        resolvedGroups.value.map((group, groupIndex) => {
+          const headerNode = slots.groupTitle ? slots.groupTitle({ group }) : void 0;
+          const groupTitle = group.title;
+          const timelineItems = tigercatCore.toActivityTimelineItems(group.items);
+          return vue.h("div", { key: group.key ?? groupIndex, class: "space-y-3" }, [
+            props.showGroupTitle && groupTitle ? headerNode ?? vue.h(
+              chunkI7GSAVM7_js.Text,
+              { tag: "div", size: "sm", weight: "medium", color: "muted" },
+              { default: () => groupTitle }
+            ) : null,
+            vue.h(
+              chunkWO332QT2_js.Timeline,
+              { items: timelineItems },
+              {
+                item: ({ item, index }) => {
+                  const activity = item.activity;
+                  if (!activity) return null;
+                  return renderDefaultItem(activity, index, group);
+                }
+              }
+            )
+          ]);
+        })
+      );
+    };
+  }
+});
+var ActivityFeed_default = ActivityFeed;
+
+exports.ActivityFeed = ActivityFeed;
+exports.ActivityFeed_default = ActivityFeed_default;