@expcat/tigercat-vue 1.0.7 → 1.2.0

package/dist/chunk-6HM77SWE.js

@@ -0,0 +1,392 @@
+"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; }
+
+var _chunkOW5D4LU6js = require('./chunk-OW5D4LU6.js');
+
+
+var _chunkBGMAWKWVjs = require('./chunk-BGMAWKWV.js');
+
+
+var _chunkBYNMOQBBjs = require('./chunk-BYNMOQBB.js');
+
+
+var _chunk5436FG3Bjs = require('./chunk-5436FG3B.js');
+
+// src/components/DataTableWithToolbar.ts
+
+
+
+
+
+
+
+var _vue = require('vue');
+
+
+
+
+var _tigercatcore = require('@expcat/tigercat-core');
+var DataTableWithToolbar = _vue.defineComponent.call(void 0, {
+  name: "TigerDataTableWithToolbar",
+  inheritAttrs: false,
+  props: {
+    columns: {
+      type: Array,
+      required: true
+    },
+    columnLockable: {
+      type: Boolean,
+      default: false
+    },
+    dataSource: {
+      type: Array,
+      default: () => []
+    },
+    sort: {
+      type: Object,
+      default: void 0
+    },
+    defaultSort: {
+      type: Object,
+      default: void 0
+    },
+    filters: {
+      type: Object,
+      default: void 0
+    },
+    defaultFilters: {
+      type: Object,
+      default: void 0
+    },
+    size: {
+      type: String,
+      default: "md"
+    },
+    bordered: {
+      type: Boolean,
+      default: false
+    },
+    striped: {
+      type: Boolean,
+      default: false
+    },
+    hoverable: {
+      type: Boolean,
+      default: true
+    },
+    loading: {
+      type: Boolean,
+      default: false
+    },
+    emptyText: {
+      type: String,
+      default: "No data"
+    },
+    rowSelection: {
+      type: Object,
+      default: void 0
+    },
+    rowKey: {
+      type: [String, Function],
+      default: "id"
+    },
+    rowClassName: {
+      type: [String, Function],
+      default: void 0
+    },
+    stickyHeader: {
+      type: Boolean,
+      default: false
+    },
+    maxHeight: {
+      type: [String, Number],
+      default: void 0
+    },
+    toolbar: {
+      type: Object,
+      default: void 0
+    },
+    pagination: {
+      type: [Object, Boolean],
+      default: false
+    },
+    tableLayout: {
+      type: String,
+      default: "auto"
+    },
+    className: {
+      type: String,
+      default: void 0
+    },
+    style: {
+      type: Object,
+      default: void 0
+    }
+  },
+  emits: {
+    "search-change": (_value) => true,
+    search: (_value) => true,
+    "filters-change": (_filters) => true,
+    "bulk-action": (_action, _keys) => true,
+    "selection-change": (_keys) => true,
+    "page-change": (_current, _pageSize) => true,
+    "page-size-change": (_current, _pageSize) => true
+  },
+  setup(props, { attrs, emit }) {
+    const internalSearch = _vue.ref.call(void 0, _nullishCoalesce(_optionalChain([props, 'access', _ => _.toolbar, 'optionalAccess', _2 => _2.defaultSearchValue]), () => ( "")));
+    const internalFilters = _vue.ref.call(void 0, {});
+    const previousPageSize = _vue.ref.call(void 0, 
+      props.pagination && typeof props.pagination === "object" ? _nullishCoalesce(_nullishCoalesce(props.pagination.pageSize, () => ( props.pagination.defaultPageSize)), () => ( 10)) : void 0
+    );
+    const vnodeProps = _nullishCoalesce(_optionalChain([_vue.getCurrentInstance.call(void 0, ), 'optionalAccess', _3 => _3.vnode, 'access', _4 => _4.props]), () => ( {}));
+    const hasSearchListener = Boolean(vnodeProps.onSearch || vnodeProps.onSearchChange);
+    _vue.watch.call(void 0, 
+      () => _optionalChain([props, 'access', _5 => _5.toolbar, 'optionalAccess', _6 => _6.searchValue]),
+      (nextValue) => {
+        if (nextValue !== void 0) {
+          internalSearch.value = _nullishCoalesce(nextValue, () => ( ""));
+        }
+      }
+    );
+    _vue.watch.call(void 0, 
+      () => props.pagination,
+      (nextValue) => {
+        if (nextValue && typeof nextValue === "object") {
+          previousPageSize.value = _nullishCoalesce(_nullishCoalesce(nextValue.pageSize, () => ( nextValue.defaultPageSize)), () => ( 10));
+        }
+      }
+    );
+    _vue.watch.call(void 0, 
+      () => _optionalChain([props, 'access', _7 => _7.toolbar, 'optionalAccess', _8 => _8.filters]),
+      (filters) => {
+        if (!filters) return;
+        const next = { ...internalFilters.value };
+        filters.forEach((filter) => {
+          if (filter.value === void 0 && !(filter.key in next)) {
+            next[filter.key] = _nullishCoalesce(filter.defaultValue, () => ( null));
+          }
+        });
+        internalFilters.value = next;
+      },
+      { immediate: true, deep: true }
+    );
+    const searchValue = _vue.computed.call(void 0, 
+      () => _optionalChain([props, 'access', _9 => _9.toolbar, 'optionalAccess', _10 => _10.searchValue]) !== void 0 ? props.toolbar.searchValue : internalSearch.value
+    );
+    const resolvedFilters = _vue.computed.call(void 0, () => {
+      const next = {};
+      _optionalChain([props, 'access', _11 => _11.toolbar, 'optionalAccess', _12 => _12.filters, 'optionalAccess', _13 => _13.forEach, 'call', _14 => _14((filter) => {
+        next[filter.key] = filter.value !== void 0 ? filter.value : _nullishCoalesce(_nullishCoalesce(internalFilters.value[filter.key], () => ( filter.defaultValue)), () => ( null));
+      })]);
+      return next;
+    });
+    const hasSearch = _vue.computed.call(void 0, () => {
+      if (!props.toolbar) return hasSearchListener;
+      return Boolean(
+        props.toolbar.searchPlaceholder || props.toolbar.searchValue !== void 0 || props.toolbar.defaultSearchValue !== void 0 || props.toolbar.showSearchButton || hasSearchListener
+      );
+    });
+    const hasFilters = _vue.computed.call(void 0, () => Boolean(_optionalChain([props, 'access', _15 => _15.toolbar, 'optionalAccess', _16 => _16.filters, 'optionalAccess', _17 => _17.length])));
+    const hasBulkActions = _vue.computed.call(void 0, () => Boolean(_optionalChain([props, 'access', _18 => _18.toolbar, 'optionalAccess', _19 => _19.bulkActions, 'optionalAccess', _20 => _20.length])));
+    const canSearch = _vue.computed.call(void 0, () => Boolean(vnodeProps.onSearch));
+    const selectedKeys = _vue.computed.call(void 0, 
+      () => _nullishCoalesce(_nullishCoalesce(_optionalChain([props, 'access', _21 => _21.toolbar, 'optionalAccess', _22 => _22.selectedKeys]), () => ( _optionalChain([props, 'access', _23 => _23.rowSelection, 'optionalAccess', _24 => _24.selectedRowKeys]))), () => ( []))
+    );
+    const selectedCount = _vue.computed.call(void 0, 
+      () => _optionalChain([props, 'access', _25 => _25.toolbar, 'optionalAccess', _26 => _26.selectedCount]) !== void 0 ? props.toolbar.selectedCount : selectedKeys.value.length
+    );
+    const bulkLabel = _vue.computed.call(void 0, () => _nullishCoalesce(_optionalChain([props, 'access', _27 => _27.toolbar, 'optionalAccess', _28 => _28.bulkActionsLabel]), () => ( "\u5DF2\u9009\u62E9")));
+    const wrapperClasses = _vue.computed.call(void 0, 
+      () => _tigercatcore.classNames.call(void 0, 
+        "tiger-data-table-with-toolbar flex flex-col gap-3",
+        props.className,
+        _tigercatcore.coerceClassValue.call(void 0, attrs.class)
+      )
+    );
+    const wrapperStyle = _vue.computed.call(void 0, () => _tigercatcore.mergeStyleValues.call(void 0, attrs.style, props.style));
+    const handleSearchChange = (value) => {
+      if (_optionalChain([props, 'access', _29 => _29.toolbar, 'optionalAccess', _30 => _30.searchValue]) === void 0) {
+        internalSearch.value = value;
+      }
+      emit("search-change", value);
+    };
+    const handleSearchSubmit = () => {
+      emit("search", _nullishCoalesce(searchValue.value, () => ( "")));
+    };
+    const handleFilterSelect = (filter, value) => {
+      const nextFilters = {
+        ...resolvedFilters.value,
+        [filter.key]: value
+      };
+      if (filter.value === void 0) {
+        internalFilters.value = {
+          ...internalFilters.value,
+          [filter.key]: value
+        };
+      }
+      emit("filters-change", nextFilters);
+    };
+    const handleBulkAction = (action) => {
+      const keys = _nullishCoalesce(selectedKeys.value, () => ( []));
+      _optionalChain([action, 'access', _31 => _31.onClick, 'optionalCall', _32 => _32(keys)]);
+      emit("bulk-action", action, keys);
+    };
+    const handleTablePageChange = ({
+      current,
+      pageSize
+    }) => {
+      emit("page-change", current, pageSize);
+      if (previousPageSize.value !== void 0 && previousPageSize.value !== pageSize) {
+        emit("page-size-change", current, pageSize);
+      }
+      previousPageSize.value = pageSize;
+    };
+    const renderToolbar = () => {
+      if (!hasSearch.value && !hasFilters.value && !hasBulkActions.value) return null;
+      const leftNodes = [];
+      if (hasSearch.value) {
+        const showButton = _nullishCoalesce(_optionalChain([props, 'access', _33 => _33.toolbar, 'optionalAccess', _34 => _34.showSearchButton]), () => ( true));
+        leftNodes.push(
+          _vue.h.call(void 0, 
+            "div",
+            { class: "flex items-center gap-2 w-full sm:w-auto sm:min-w-[200px] sm:max-w-[320px]" },
+            [
+              _vue.h.call(void 0, _chunkBYNMOQBBjs.Input, {
+                type: "search",
+                size: "sm",
+                modelValue: searchValue.value,
+                placeholder: _nullishCoalesce(_optionalChain([props, 'access', _35 => _35.toolbar, 'optionalAccess', _36 => _36.searchPlaceholder]), () => ( "\u641C\u7D22")),
+                "onUpdate:modelValue": (value) => handleSearchChange(String(_nullishCoalesce(value, () => ( "")))),
+                onKeydown: (event) => {
+                  if (event.key === "Enter") {
+                    handleSearchSubmit();
+                  }
+                }
+              }),
+              showButton ? _vue.h.call(void 0, 
+                _chunk5436FG3Bjs.Button,
+                {
+                  size: "sm",
+                  variant: "primary",
+                  class: "whitespace-nowrap shrink-0",
+                  onClick: handleSearchSubmit,
+                  disabled: !canSearch.value
+                },
+                { default: () => _nullishCoalesce(_optionalChain([props, 'access', _37 => _37.toolbar, 'optionalAccess', _38 => _38.searchButtonText]), () => ( "\u641C\u7D22")) }
+              ) : null
+            ]
+          )
+        );
+      }
+      if (hasFilters.value) {
+        _optionalChain([props, 'access', _39 => _39.toolbar, 'optionalAccess', _40 => _40.filters, 'optionalAccess', _41 => _41.forEach, 'call', _42 => _42((filter) => {
+          const currentValue = resolvedFilters.value[filter.key];
+          const clearable = filter.clearable !== false;
+          leftNodes.push(
+            _vue.h.call(void 0, "div", { class: "w-full sm:w-auto sm:min-w-[120px] sm:max-w-[180px]" }, [
+              _vue.h.call(void 0, _chunkBGMAWKWVjs.Select, {
+                size: "sm",
+                options: filter.options.map((opt) => ({
+                  label: opt.label,
+                  value: opt.value
+                })),
+                modelValue: _nullishCoalesce(currentValue, () => ( void 0)),
+                placeholder: _nullishCoalesce(filter.placeholder, () => ( filter.label)),
+                clearable,
+                "onUpdate:modelValue": (value) => {
+                  handleFilterSelect(filter, _nullishCoalesce(value, () => ( null)));
+                }
+              })
+            ])
+          );
+        })]);
+      }
+      const bulkChildren = [];
+      if (hasBulkActions.value) {
+        if (selectedCount.value > 0) {
+          bulkChildren.push(
+            _vue.h.call(void 0, 
+              "span",
+              { class: "text-sm text-[var(--tiger-text-muted,#6b7280)]" },
+              `${bulkLabel.value} ${selectedCount.value} \u9879`
+            )
+          );
+        }
+        ;
+        (_nullishCoalesce(_optionalChain([props, 'access', _43 => _43.toolbar, 'optionalAccess', _44 => _44.bulkActions]), () => ( []))).forEach((action) => {
+          bulkChildren.push(
+            _vue.h.call(void 0, 
+              _chunk5436FG3Bjs.Button,
+              {
+                key: action.key,
+                size: "sm",
+                variant: _nullishCoalesce(action.variant, () => ( "outline")),
+                disabled: action.disabled || selectedCount.value === 0,
+                onClick: () => handleBulkAction(action)
+              },
+              { default: () => action.label }
+            )
+          );
+        });
+      }
+      return _vue.h.call(void 0, 
+        "div",
+        {
+          class: "tiger-data-table-toolbar flex flex-wrap items-center gap-2 pb-3",
+          role: "toolbar",
+          "aria-label": "\u6570\u636E\u8868\u683C\u5DE5\u5177\u680F"
+        },
+        [
+          _vue.h.call(void 0, "div", { class: "flex items-center gap-2 flex-wrap flex-1 min-w-0" }, leftNodes),
+          hasBulkActions.value ? _vue.h.call(void 0, 
+            "div",
+            { class: "flex items-center gap-2 flex-wrap ml-auto shrink-0" },
+            bulkChildren
+          ) : null
+        ]
+      );
+    };
+    return () => {
+      const { class: _class, style: _style, ...restAttrs } = attrs;
+      const tableProps = {
+        ...restAttrs,
+        columns: props.columns,
+        columnLockable: props.columnLockable,
+        dataSource: props.dataSource,
+        ...props.sort !== void 0 ? { sort: props.sort } : {},
+        ...props.defaultSort !== void 0 ? { defaultSort: props.defaultSort } : {},
+        ...props.filters !== void 0 ? { filters: props.filters } : {},
+        ...props.defaultFilters !== void 0 ? { defaultFilters: props.defaultFilters } : {},
+        size: props.size,
+        bordered: props.bordered,
+        striped: props.striped,
+        hoverable: props.hoverable,
+        loading: props.loading,
+        emptyText: props.emptyText,
+        pagination: props.pagination,
+        rowSelection: props.rowSelection,
+        rowKey: props.rowKey,
+        rowClassName: props.rowClassName,
+        stickyHeader: props.stickyHeader,
+        maxHeight: props.maxHeight,
+        tableLayout: props.tableLayout,
+        onSelectionChange: (keys) => emit("selection-change", keys),
+        onPageChange: handleTablePageChange
+      };
+      return _vue.h.call(void 0, 
+        "div",
+        {
+          class: wrapperClasses.value,
+          style: wrapperStyle.value,
+          "data-tiger-data-table-with-toolbar": ""
+        },
+        [renderToolbar(), _vue.h.call(void 0, _chunkOW5D4LU6js.Table, tableProps)]
+      );
+    };
+  }
+});
+var DataTableWithToolbar_default = DataTableWithToolbar;
+
+
+
+
+exports.DataTableWithToolbar = DataTableWithToolbar; exports.DataTableWithToolbar_default = DataTableWithToolbar_default;

package/dist/chunk-6V7XCCXN.mjs

@@ -1,7 +1,8 @@
-import { defineComponent, computed, h } from 'vue';
-import { getTextClasses } from '@expcat/tigercat-core';
-
 // src/components/Text.ts
+import { defineComponent, computed, h } from "vue";
+import {
+  getTextClasses
+} from "@expcat/tigercat-core";
 var Text = defineComponent({
   name: "TigerText",
   props: {
@@ -83,4 +84,7 @@ var Text = defineComponent({
 });
 var Text_default = Text;
 
-export { Text, Text_default };
+export {
+  Text,
+  Text_default
+};

package/dist/chunk-7ADONGSB.js

@@ -0,0 +1,49 @@
+"use strict";Object.defineProperty(exports, "__esModule", {value: true}); 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/ButtonGroup.ts
+var _vue = require('vue');
+var _tigercatcore = require('@expcat/tigercat-core');
+var BUTTON_GROUP_INJECTION_KEY = /* @__PURE__ */ Symbol("TigerButtonGroup");
+var ButtonGroup = _vue.defineComponent.call(void 0, {
+  name: "TigerButtonGroup",
+  inheritAttrs: false,
+  props: {
+    size: {
+      type: String,
+      default: void 0
+    },
+    vertical: Boolean,
+    className: {
+      type: String,
+      default: void 0
+    }
+  },
+  setup(props, { slots, attrs }) {
+    _vue.provide.call(void 0, BUTTON_GROUP_INJECTION_KEY, {
+      get size() {
+        return props.size;
+      }
+    });
+    return () => {
+      const classes = _tigercatcore.getButtonGroupClasses.call(void 0, 
+        props.vertical,
+        props.className,
+        _tigercatcore.coerceClassValue.call(void 0, attrs.class)
+      );
+      return _vue.h.call(void 0, 
+        "div",
+        {
+          ...attrs,
+          class: classes,
+          role: "group"
+        },
+        _optionalChain([slots, 'access', _ => _.default, 'optionalCall', _2 => _2()])
+      );
+    };
+  }
+});
+var ButtonGroup_default = ButtonGroup;
+
+
+
+
+
+exports.BUTTON_GROUP_INJECTION_KEY = BUTTON_GROUP_INJECTION_KEY; exports.ButtonGroup = ButtonGroup; exports.ButtonGroup_default = ButtonGroup_default;

package/dist/chunk-7LUATGJU.mjs

@@ -1,7 +1,27 @@
-import { defineComponent, computed, h } from 'vue';
-import { clampPercentage, getStatusVariant, formatProgressText, getCircleSize, calculateCirclePath, classNames, progressCircleBaseClasses, coerceClassValue, progressCircleTrackStrokeClasses, getProgressVariantClasses, progressCircleTextClasses, progressTextSizeClasses, getProgressTextColorClasses, progressLineBaseClasses, progressTrackBgClasses, progressLineSizeClasses, progressLineInnerClasses, progressStripedClasses, progressStripedAnimationClasses, progressTextBaseClasses } from '@expcat/tigercat-core';
-
 // src/components/Progress.ts
+import { defineComponent, computed, h } from "vue";
+import {
+  classNames,
+  coerceClassValue,
+  getProgressVariantClasses,
+  getProgressTextColorClasses,
+  getStatusVariant,
+  formatProgressText,
+  clampPercentage,
+  calculateCirclePath,
+  getCircleSize,
+  progressLineBaseClasses,
+  progressLineInnerClasses,
+  progressTextBaseClasses,
+  progressCircleBaseClasses,
+  progressLineSizeClasses,
+  progressTextSizeClasses,
+  progressStripedClasses,
+  progressStripedAnimationClasses,
+  progressTrackBgClasses,
+  progressCircleTextClasses,
+  progressCircleTrackStrokeClasses
+} from "@expcat/tigercat-core";
 var Progress = defineComponent({
   name: "TigerProgress",
   inheritAttrs: false,
@@ -168,4 +188,7 @@ var Progress = defineComponent({
 });
 var Progress_default = Progress;
 
-export { Progress, Progress_default };
+export {
+  Progress,
+  Progress_default
+};

package/dist/{chunk-MADOTDW7.mjs → chunk-7PY6OQVE.mjs}

@@ -1,7 +1,15 @@
-import { defineComponent, ref, computed, onMounted, watch, onBeforeUnmount, h } from 'vue';
-import { watermarkDefaults, resolveWatermarkFont, getWatermarkOverlayStyle, mergeStyleValues, classNames, watermarkWrapperClasses, coerceClassValue, renderWatermarkCanvas } from '@expcat/tigercat-core';
-
 // src/components/Watermark.ts
+import { defineComponent, computed, h, onMounted, onBeforeUnmount, ref, watch } from "vue";
+import {
+  classNames,
+  coerceClassValue,
+  mergeStyleValues,
+  watermarkDefaults,
+  watermarkWrapperClasses,
+  resolveWatermarkFont,
+  createWatermarkRenderController,
+  getWatermarkOverlayStyle
+} from "@expcat/tigercat-core";
 var Watermark = defineComponent({
   name: "TigerWatermark",
   inheritAttrs: false,
@@ -34,42 +42,34 @@ var Watermark = defineComponent({
   },
   setup(props, { slots, attrs }) {
     const base64 = ref();
+    const wrapperRef = ref(null);
+    let renderController;
     const resolvedFont = computed(() => resolveWatermarkFont(props.font));
     const generate = () => {
-      if (props.image) {
-        const img = new Image();
-        img.crossOrigin = "anonymous";
-        img.onload = () => {
-          const canvas = document.createElement("canvas");
-          const dpr = window.devicePixelRatio || 1;
-          canvas.width = props.width * dpr;
-          canvas.height = props.height * dpr;
-          const ctx = canvas.getContext("2d");
-          if (!ctx) return;
-          ctx.scale(dpr, dpr);
-          ctx.translate(props.width / 2, props.height / 2);
-          ctx.rotate(props.rotate * Math.PI / 180);
-          ctx.translate(-props.width / 2, -props.height / 2);
-          ctx.drawImage(img, 0, 0, props.width, props.height);
-          base64.value = canvas.toDataURL();
-        };
-        img.src = props.image;
-      } else {
-        base64.value = renderWatermarkCanvas({
+      renderController?.render();
+    };
+    onMounted(() => {
+      if (!wrapperRef.value) return;
+      renderController = createWatermarkRenderController({
+        getRenderOptions: () => ({
           content: props.content,
+          image: props.image,
           width: props.width,
           height: props.height,
           rotate: props.rotate,
           font: resolvedFont.value
-        });
-      }
-    };
-    onMounted(generate);
+        }),
+        onRender: (base64Url) => {
+          base64.value = base64Url;
+        }
+      });
+      renderController.observe(wrapperRef.value);
+      renderController.render();
+    });
     watch(
       () => [props.content, props.image, props.width, props.height, props.rotate, props.font],
       generate
     );
-    const wrapperRef = ref(null);
     let observer;
     onMounted(() => {
       if (typeof MutationObserver === "undefined" || !wrapperRef.value) return;
@@ -85,7 +85,11 @@ var Watermark = defineComponent({
       });
       observer.observe(wrapperRef.value, { childList: true });
     });
-    onBeforeUnmount(() => observer?.disconnect());
+    onBeforeUnmount(() => {
+      observer?.disconnect();
+      renderController?.disconnect();
+      renderController = void 0;
+    });
     const overlayStyle = computed(
       () => getWatermarkOverlayStyle({
         base64Url: base64.value,
@@ -126,4 +130,7 @@ var Watermark = defineComponent({
 });
 var Watermark_default = Watermark;
 
-export { Watermark, Watermark_default };
+export {
+  Watermark,
+  Watermark_default
+};