@expcat/tigercat-vue 0.4.2 → 1.0.0

package/dist/chunk-DC5J25FH.mjs

@@ -0,0 +1,245 @@
+import { defineComponent, ref, computed, h } from 'vue';
+import { splitTransferData, filterTransferItems, classNames, transferBaseClasses, coerceClassValue, transferOperationClasses, getTransferButtonClasses, transferPanelClasses, transferPanelHeaderClasses, transferSearchClasses, transferPanelBodyClasses, getTransferItemClasses, getTransferCheckboxClasses, transferEmptyClasses, icon20ViewBox, chevronRightSolidIcon20PathD, chevronLeftSolidIcon20PathD } from '@expcat/tigercat-core';
+
+// src/components/Transfer.ts
+function ArrowIcon(pathD) {
+  return h(
+    "svg",
+    {
+      class: "w-4 h-4",
+      viewBox: icon20ViewBox,
+      fill: "currentColor",
+      xmlns: "http://www.w3.org/2000/svg"
+    },
+    [
+      h("path", {
+        d: pathD,
+        "fill-rule": "evenodd",
+        "clip-rule": "evenodd"
+      })
+    ]
+  );
+}
+var Transfer = defineComponent({
+  name: "TigerTransfer",
+  props: {
+    modelValue: {
+      type: Array,
+      default: () => []
+    },
+    dataSource: {
+      type: Array,
+      default: () => []
+    },
+    size: {
+      type: String,
+      default: "md"
+    },
+    disabled: {
+      type: Boolean,
+      default: false
+    },
+    showSearch: {
+      type: Boolean,
+      default: false
+    },
+    sourceTitle: {
+      type: String,
+      default: "Source"
+    },
+    targetTitle: {
+      type: String,
+      default: "Target"
+    },
+    notFoundText: {
+      type: String,
+      default: "No data"
+    },
+    filterOption: {
+      type: Function,
+      default: void 0
+    }
+  },
+  emits: ["update:modelValue", "change"],
+  setup(props, { emit, attrs }) {
+    const sourceSelectedKeys = ref(/* @__PURE__ */ new Set());
+    const targetSelectedKeys = ref(/* @__PURE__ */ new Set());
+    const sourceSearch = ref("");
+    const targetSearch = ref("");
+    const { sourceItems, targetItems } = computed(
+      () => splitTransferData(props.dataSource, props.modelValue)
+    ).value;
+    const computedData = computed(() => splitTransferData(props.dataSource, props.modelValue));
+    const filteredSourceItems = computed(
+      () => filterTransferItems(computedData.value.sourceItems, sourceSearch.value, props.filterOption)
+    );
+    const filteredTargetItems = computed(
+      () => filterTransferItems(computedData.value.targetItems, targetSearch.value, props.filterOption)
+    );
+    const canMoveRight = computed(() => {
+      if (props.disabled) return false;
+      for (const key of sourceSelectedKeys.value) {
+        const item = props.dataSource.find((d) => d.key === key);
+        if (item && !item.disabled) return true;
+      }
+      return false;
+    });
+    const canMoveLeft = computed(() => {
+      if (props.disabled) return false;
+      for (const key of targetSelectedKeys.value) {
+        const item = props.dataSource.find((d) => d.key === key);
+        if (item && !item.disabled) return true;
+      }
+      return false;
+    });
+    function toggleSourceItem(key) {
+      const next = new Set(sourceSelectedKeys.value);
+      if (next.has(key)) {
+        next.delete(key);
+      } else {
+        next.add(key);
+      }
+      sourceSelectedKeys.value = next;
+    }
+    function toggleTargetItem(key) {
+      const next = new Set(targetSelectedKeys.value);
+      if (next.has(key)) {
+        next.delete(key);
+      } else {
+        next.add(key);
+      }
+      targetSelectedKeys.value = next;
+    }
+    function moveRight() {
+      if (!canMoveRight.value) return;
+      const keysToMove = [...sourceSelectedKeys.value].filter((key) => {
+        const item = props.dataSource.find((d) => d.key === key);
+        return item && !item.disabled;
+      });
+      const newTargetKeys = [...props.modelValue, ...keysToMove];
+      sourceSelectedKeys.value = /* @__PURE__ */ new Set();
+      emit("update:modelValue", newTargetKeys);
+      emit("change", newTargetKeys, "right", keysToMove);
+    }
+    function moveLeft() {
+      if (!canMoveLeft.value) return;
+      const keysToRemove = new Set(
+        [...targetSelectedKeys.value].filter((key) => {
+          const item = props.dataSource.find((d) => d.key === key);
+          return item && !item.disabled;
+        })
+      );
+      const newTargetKeys = props.modelValue.filter((k) => !keysToRemove.has(k));
+      targetSelectedKeys.value = /* @__PURE__ */ new Set();
+      emit("update:modelValue", newTargetKeys);
+      emit("change", newTargetKeys, "left", [...keysToRemove]);
+    }
+    function renderPanel(title, items, selectedKeys, toggleFn, searchValue, onSearch) {
+      return h("div", { class: transferPanelClasses, role: "group", "aria-label": title }, [
+        // Header
+        h("div", { class: transferPanelHeaderClasses }, [
+          h(
+            "span",
+            { class: "font-medium text-[var(--tiger-transfer-title,var(--tiger-text,#111827))]" },
+            `${title} (${items.length})`
+          )
+        ]),
+        // Search
+        props.showSearch ? h("input", {
+          type: "text",
+          class: transferSearchClasses,
+          placeholder: "Search...",
+          value: searchValue,
+          "aria-label": `Search ${title}`,
+          onInput: (e) => onSearch(e.target.value)
+        }) : null,
+        // Body
+        h(
+          "div",
+          { class: transferPanelBodyClasses, role: "listbox" },
+          items.length > 0 ? items.map((item) => {
+            const isSelected = selectedKeys.has(item.key);
+            const isDisabled = props.disabled || !!item.disabled;
+            return h(
+              "label",
+              {
+                key: item.key,
+                class: getTransferItemClasses(isSelected, isDisabled, props.size),
+                role: "option",
+                "aria-selected": isSelected,
+                "aria-disabled": isDisabled
+              },
+              [
+                h("input", {
+                  type: "checkbox",
+                  class: getTransferCheckboxClasses(props.size),
+                  checked: isSelected,
+                  disabled: isDisabled,
+                  onChange: () => {
+                    if (!isDisabled) toggleFn(item.key);
+                  }
+                }),
+                h("span", { class: "flex-1 truncate" }, item.label)
+              ]
+            );
+          }) : [h("div", { class: transferEmptyClasses }, props.notFoundText)]
+        )
+      ]);
+    }
+    return () => {
+      const containerClasses = classNames(transferBaseClasses, coerceClassValue(attrs.class));
+      return h("div", { class: containerClasses }, [
+        // Source panel
+        renderPanel(
+          props.sourceTitle,
+          filteredSourceItems.value,
+          sourceSelectedKeys.value,
+          toggleSourceItem,
+          sourceSearch.value,
+          (val) => {
+            sourceSearch.value = val;
+          }
+        ),
+        // Operation buttons
+        h("div", { class: transferOperationClasses }, [
+          h(
+            "button",
+            {
+              type: "button",
+              class: getTransferButtonClasses(!canMoveRight.value),
+              disabled: !canMoveRight.value,
+              "aria-label": "Move selected to target",
+              onClick: moveRight
+            },
+            [ArrowIcon(chevronRightSolidIcon20PathD)]
+          ),
+          h(
+            "button",
+            {
+              type: "button",
+              class: getTransferButtonClasses(!canMoveLeft.value),
+              disabled: !canMoveLeft.value,
+              "aria-label": "Move selected to source",
+              onClick: moveLeft
+            },
+            [ArrowIcon(chevronLeftSolidIcon20PathD)]
+          )
+        ]),
+        // Target panel
+        renderPanel(
+          props.targetTitle,
+          filteredTargetItems.value,
+          targetSelectedKeys.value,
+          toggleTargetItem,
+          targetSearch.value,
+          (val) => {
+            targetSearch.value = val;
+          }
+        )
+      ]);
+    };
+  }
+});
+var Transfer_default = Transfer;
+
+export { Transfer, Transfer_default };

package/dist/chunk-DYSLYJ2W.js

@@ -0,0 +1,88 @@
+'use strict';
+
+var vue = require('vue');
+var tigercatCore = require('@expcat/tigercat-core');
+
+// src/components/InputGroup.ts
+var INPUT_GROUP_INJECTION_KEY = /* @__PURE__ */ Symbol("TigerInputGroup");
+var InputGroup = vue.defineComponent({
+  name: "TigerInputGroup",
+  inheritAttrs: false,
+  props: {
+    size: {
+      type: String,
+      default: "md"
+    },
+    compact: {
+      type: Boolean,
+      default: false
+    },
+    className: {
+      type: String,
+      default: void 0
+    }
+  },
+  setup(props, { slots, attrs }) {
+    vue.provide(INPUT_GROUP_INJECTION_KEY, {
+      get size() {
+        return props.size;
+      },
+      get compact() {
+        return props.compact;
+      }
+    });
+    const classes = vue.computed(
+      () => tigercatCore.classNames(
+        tigercatCore.getInputGroupClasses(props.compact, props.className),
+        tigercatCore.coerceClassValue(attrs.class)
+      )
+    );
+    return () => vue.h(
+      "div",
+      {
+        ...attrs,
+        class: classes.value,
+        role: "group"
+      },
+      slots.default?.()
+    );
+  }
+});
+var InputGroupAddon = vue.defineComponent({
+  name: "TigerInputGroupAddon",
+  inheritAttrs: false,
+  props: {
+    type: {
+      type: String,
+      default: "text"
+    },
+    className: {
+      type: String,
+      default: void 0
+    }
+  },
+  setup(props, { slots, attrs }) {
+    const ctx = vue.inject(INPUT_GROUP_INJECTION_KEY, null);
+    return () => {
+      const size = ctx?.size ?? "md";
+      const compact = ctx?.compact ?? true;
+      return vue.h(
+        "span",
+        {
+          ...attrs,
+          class: tigercatCore.classNames(
+            tigercatCore.getInputGroupAddonClasses(size, compact, props.className),
+            tigercatCore.coerceClassValue(attrs.class)
+          )
+        },
+        slots.default?.()
+      );
+    };
+  }
+});
+var InputGroup_default = InputGroup;
+
+exports.INPUT_GROUP_INJECTION_KEY = INPUT_GROUP_INJECTION_KEY;
+exports.InputGroup = InputGroup;
+exports.InputGroupAddon = InputGroupAddon;
+exports.InputGroup_default = InputGroup_default;

package/dist/chunk-E2GQSWHK.mjs

@@ -0,0 +1,93 @@
+import { defineComponent, computed, h } from 'vue';
+import { classNames, getPrintLayoutClasses, coerceClassValue, printLayoutHeaderClasses, printLayoutFooterClasses, printLayoutPageBreakClasses } from '@expcat/tigercat-core';
+
+// src/components/PrintLayout.ts
+var PrintLayout = defineComponent({
+  name: "TigerPrintLayout",
+  inheritAttrs: false,
+  props: {
+    pageSize: {
+      type: String,
+      default: "A4"
+    },
+    orientation: {
+      type: String,
+      default: "portrait"
+    },
+    showHeader: {
+      type: Boolean,
+      default: false
+    },
+    showFooter: {
+      type: Boolean,
+      default: false
+    },
+    headerText: {
+      type: String,
+      default: void 0
+    },
+    footerText: {
+      type: String,
+      default: void 0
+    },
+    showPageBreaks: {
+      type: Boolean,
+      default: true
+    },
+    className: {
+      type: String,
+      default: void 0
+    }
+  },
+  setup(props, { slots, attrs }) {
+    const classes = computed(
+      () => classNames(
+        getPrintLayoutClasses(props.pageSize, props.orientation, props.className),
+        coerceClassValue(attrs.class)
+      )
+    );
+    return () => {
+      const children = [];
+      if (props.showHeader && (props.headerText || slots.header)) {
+        children.push(
+          h(
+            "div",
+            { class: printLayoutHeaderClasses },
+            slots.header ? slots.header() : props.headerText
+          )
+        );
+      }
+      children.push(h("div", { class: "tiger-print-content" }, slots.default?.()));
+      if (props.showFooter && (props.footerText || slots.footer)) {
+        children.push(
+          h(
+            "div",
+            { class: printLayoutFooterClasses },
+            slots.footer ? slots.footer() : props.footerText
+          )
+        );
+      }
+      return h(
+        "div",
+        {
+          ...attrs,
+          class: classes.value
+        },
+        children
+      );
+    };
+  }
+});
+var PrintPageBreak = defineComponent({
+  name: "TigerPrintPageBreak",
+  setup(_, { attrs }) {
+    return () => h("div", {
+      ...attrs,
+      class: classNames(printLayoutPageBreakClasses, "print:break-before-page"),
+      "aria-hidden": "true"
+    });
+  }
+});
+var PrintLayout_default = PrintLayout;
+
+export { PrintLayout, PrintLayout_default, PrintPageBreak };

package/dist/{chunk-XEU42TLP.js → chunk-ECUROLZ7.js}

@@ -158,6 +158,13 @@ var Tree = vue.defineComponent({
       type: String,
       default: ""
     },
+    /**
+     * Whether to show built-in search input
+     */
+    searchable: {
+      type: Boolean,
+      default: false
+    },
     /**
      * Custom filter function
      */
@@ -191,6 +198,13 @@ var Tree = vue.defineComponent({
     ariaLabel: {
       type: String,
       default: "Tree"
+    },
+    /**
+     * Whether nodes are draggable
+     */
+    draggable: {
+      type: Boolean,
+      default: false
     }
   },
   emits: [
@@ -202,7 +216,8 @@ var Tree = vue.defineComponent({
     "node-collapse",
     "update:expandedKeys",
     "update:selectedKeys",
-    "update:checkedKeys"
+    "update:checkedKeys",
+    "drop"
   ],
   setup(props, { emit, attrs }) {
     const rootEl = vue.ref(null);
@@ -219,6 +234,27 @@ var Tree = vue.defineComponent({
       return props.multiple;
     });
     const internalExpandedKeys = vue.ref(/* @__PURE__ */ new Set());
+    const dragNodeKey = vue.ref(null);
+    function handleTreeDragStart(key) {
+      dragNodeKey.value = key;
+    }
+    function handleTreeDragOver(e) {
+      e.preventDefault();
+    }
+    function handleTreeDrop(targetKey) {
+      if (dragNodeKey.value === null || dragNodeKey.value === targetKey) {
+        dragNodeKey.value = null;
+        return;
+      }
+      emit("drop", {
+        dragKey: dragNodeKey.value,
+        dropKey: targetKey
+      });
+      dragNodeKey.value = null;
+    }
+    function handleTreeDragEnd() {
+      dragNodeKey.value = null;
+    }
     const internalSelectedKeys = vue.ref(
       new Set(props.selectedKeys ?? props.defaultSelectedKeys)
     );
@@ -286,8 +322,12 @@ var Tree = vue.defineComponent({
         target?.focus();
       }
     );
+    const internalSearchValue = vue.ref("");
+    const effectiveFilterValue = vue.computed(
+      () => props.searchable ? internalSearchValue.value : props.filterValue
+    );
     vue.watch(
-      () => props.filterValue,
+      () => effectiveFilterValue.value,
       (newValue) => {
         if (newValue) {
           const matched = tigercatCore.filterTreeNodes(props.treeData, newValue, props.filterFn);
@@ -501,6 +541,18 @@ var Tree = vue.defineComponent({
               "aria-expanded": isExpandable ? isExpanded ? true : false : void 0,
               "aria-checked": props.checkable ? isHalfChecked ? "mixed" : isChecked : void 0,
               tabIndex: isFocusable ? 0 : -1,
+              draggable: props.draggable && !node.disabled ? true : void 0,
+              onDragstart: props.draggable && !node.disabled ? (e) => {
+                e.stopPropagation();
+                handleTreeDragStart(node.key);
+              } : void 0,
+              onDragover: props.draggable ? handleTreeDragOver : void 0,
+              onDrop: props.draggable ? (e) => {
+                e.preventDefault();
+                e.stopPropagation();
+                handleTreeDrop(node.key);
+              } : void 0,
+              onDragend: props.draggable ? handleTreeDragEnd : void 0,
               onFocus: () => {
                 if (!node.disabled) activeKey.value = node.key;
               },
@@ -622,6 +674,15 @@ var Tree = vue.defineComponent({
           [vue.h("div", { class: tigercatCore.treeEmptyStateClasses }, props.emptyText)]
         );
       }
+      const searchInput = props.searchable ? vue.h("input", {
+        type: "text",
+        class: "w-full mb-2 px-2 py-1 text-sm border border-[var(--tiger-border,#e5e7eb)] rounded bg-[var(--tiger-surface,#ffffff)] focus:outline-none focus:ring-1 focus:ring-[var(--tiger-primary,#2563eb)]",
+        placeholder: "Search...",
+        value: internalSearchValue.value,
+        onInput: (e) => {
+          internalSearchValue.value = e.target.value;
+        }
+      }) : null;
       return vue.h(
         "div",
         {
@@ -632,7 +693,7 @@ var Tree = vue.defineComponent({
           "aria-multiselectable": effectiveMultiple.value ? true : void 0,
           ref: rootEl
         },
-        props.treeData.map((node) => renderTreeNode(node, 0))
+        [searchInput, ...props.treeData.map((node) => renderTreeNode(node, 0))]
       );
     };
   }

package/dist/chunk-ELEAQEMV.mjs

@@ -0,0 +1,61 @@
+import { defineComponent, h } from 'vue';
+import { classNames, getSegmentedContainerClasses, coerceClassValue, getSegmentedOptionClasses } from '@expcat/tigercat-core';
+
+// src/components/Segmented.ts
+var Segmented = defineComponent({
+  name: "TigerSegmented",
+  props: {
+    modelValue: {
+      type: [String, Number],
+      default: void 0
+    },
+    options: {
+      type: Array,
+      default: () => []
+    },
+    disabled: { type: Boolean, default: false },
+    size: { type: String, default: "md" },
+    block: { type: Boolean, default: false }
+  },
+  emits: ["update:modelValue", "change"],
+  setup(props, { emit, attrs }) {
+    function handleSelect(option) {
+      if (option.disabled || props.disabled) return;
+      if (option.value === props.modelValue) return;
+      emit("update:modelValue", option.value);
+      emit("change", option.value);
+    }
+    return () => h(
+      "div",
+      {
+        class: classNames(
+          getSegmentedContainerClasses(props.size, props.block),
+          coerceClassValue(attrs.class)
+        ),
+        role: "radiogroup"
+      },
+      props.options.map((opt) => {
+        const selected = opt.value === props.modelValue;
+        const isDisabled = !!opt.disabled || props.disabled;
+        return h(
+          "label",
+          {
+            key: opt.value,
+            class: classNames(
+              getSegmentedOptionClasses(props.size, selected, isDisabled),
+              props.block ? "flex-1 text-center" : ""
+            ),
+            role: "radio",
+            "aria-checked": selected,
+            "aria-disabled": isDisabled,
+            onClick: () => handleSelect(opt)
+          },
+          [h("span", null, opt.label)]
+        );
+      })
+    );
+  }
+});
+var Segmented_default = Segmented;
+
+export { Segmented, Segmented_default };

package/dist/{chunk-GNKXBRXH.js → chunk-ESTA5C5P.js}

@@ -1,8 +1,8 @@
 'use strict';
 
-var chunkW36SYMVH_js = require('./chunk-W36SYMVH.js');
+var chunk7VSD3NPI_js = require('./chunk-7VSD3NPI.js');
 var chunkK2U3FEL7_js = require('./chunk-K2U3FEL7.js');
-var chunkDELTFEEJ_js = require('./chunk-DELTFEEJ.js');
+var chunkU7CCKZAG_js = require('./chunk-U7CCKZAG.js');
 var vue = require('vue');
 var tigercatCore = require('@expcat/tigercat-core');
 
@@ -151,15 +151,15 @@ var CropUpload = vue.defineComponent({
         ]
       );
       const modal = vue.h(
-        chunkW36SYMVH_js.Modal,
+        chunk7VSD3NPI_js.Modal,
         {
-          visible: modalVisible.value,
+          open: modalVisible.value,
           size: "lg",
           title: props.modalTitle,
           closable: true,
           maskClosable: false,
           showDefaultFooter: false,
-          "onUpdate:visible": (val) => {
+          "onUpdate:open": (val) => {
             if (!val) handleCancel();
           }
         },
@@ -170,9 +170,9 @@ var CropUpload = vue.defineComponent({
             ...props.cropperProps
           }) : null,
           footer: ({ cancel }) => vue.h("div", { class: tigercatCore.modalFooterClasses }, [
-            vue.h(chunkDELTFEEJ_js.Button, { variant: "secondary", onClick: handleCancel }, { default: () => "\u53D6\u6D88" }),
+            vue.h(chunkU7CCKZAG_js.Button, { variant: "secondary", onClick: handleCancel }, { default: () => "\u53D6\u6D88" }),
             vue.h(
-              chunkDELTFEEJ_js.Button,
+              chunkU7CCKZAG_js.Button,
               { onClick: handleConfirm, loading: cropping.value },
               { default: () => "\u786E\u8BA4\u88C1\u526A" }
             )