@expcat/tigercat-react 1.0.7 → 1.2.0

package/dist/chunk-DLLLDGXD.mjs

@@ -0,0 +1,236 @@
+import {
+  Table
+} from "./chunk-T7ACOL7K.mjs";
+import {
+  Select
+} from "./chunk-T4OVGM4X.mjs";
+import {
+  Input
+} from "./chunk-WNLUUD5N.mjs";
+import {
+  Button
+} from "./chunk-GKJNQUTW.mjs";
+
+// src/components/DataTableWithToolbar.tsx
+import { useEffect, useMemo, useRef, useState } from "react";
+import {
+  classNames
+} from "@expcat/tigercat-core";
+import { jsx, jsxs } from "react/jsx-runtime";
+var DataTableWithToolbar = ({
+  toolbar,
+  onSearchChange,
+  onSearch,
+  onFiltersChange,
+  onBulkAction,
+  pagination = false,
+  onPageChange,
+  onPageSizeChange,
+  className,
+  tableClassName,
+  ...tableProps
+}) => {
+  const previousPageSizeRef = useRef(
+    pagination && typeof pagination === "object" ? pagination.pageSize ?? pagination.defaultPageSize ?? 10 : void 0
+  );
+  const [internalSearch, setInternalSearch] = useState(toolbar?.defaultSearchValue ?? "");
+  const [internalFilters, setInternalFilters] = useState(
+    () => {
+      const initial = {};
+      toolbar?.filters?.forEach((filter) => {
+        if (filter.value === void 0) {
+          initial[filter.key] = filter.defaultValue ?? null;
+        }
+      });
+      return initial;
+    }
+  );
+  useEffect(() => {
+    if (toolbar?.searchValue !== void 0) {
+      setInternalSearch(toolbar.searchValue ?? "");
+    }
+  }, [toolbar?.searchValue]);
+  useEffect(() => {
+    if (pagination && typeof pagination === "object") {
+      previousPageSizeRef.current = pagination.pageSize ?? pagination.defaultPageSize ?? 10;
+    }
+  }, [pagination]);
+  useEffect(() => {
+    const filters = toolbar?.filters;
+    if (!filters) return;
+    setInternalFilters((prev) => {
+      const next = { ...prev };
+      filters.forEach((filter) => {
+        if (filter.value === void 0 && !(filter.key in next)) {
+          next[filter.key] = filter.defaultValue ?? null;
+        }
+      });
+      return next;
+    });
+  }, [toolbar?.filters]);
+  const searchValue = toolbar?.searchValue !== void 0 ? toolbar.searchValue : internalSearch;
+  const resolvedFilters = useMemo(() => {
+    const next = {};
+    toolbar?.filters?.forEach((filter) => {
+      next[filter.key] = filter.value !== void 0 ? filter.value : internalFilters[filter.key] ?? filter.defaultValue ?? null;
+    });
+    return next;
+  }, [toolbar?.filters, internalFilters]);
+  const hasSearch = Boolean(
+    toolbar && (toolbar.searchPlaceholder || toolbar.searchValue !== void 0 || toolbar.defaultSearchValue !== void 0 || toolbar.showSearchButton || toolbar.onSearchChange || toolbar.onSearch || onSearchChange || onSearch)
+  );
+  const hasFilters = Boolean(toolbar?.filters && toolbar.filters.length > 0);
+  const hasBulkActions = Boolean(toolbar?.bulkActions && toolbar.bulkActions.length > 0);
+  const selectedKeys = toolbar?.selectedKeys ?? tableProps.rowSelection?.selectedRowKeys ?? [];
+  const selectedCount = toolbar?.selectedCount ?? selectedKeys.length;
+  const bulkLabel = toolbar?.bulkActionsLabel ?? "\u5DF2\u9009\u62E9";
+  const wrapperClasses = useMemo(
+    () => classNames("tiger-data-table-with-toolbar flex flex-col gap-3", className),
+    [className]
+  );
+  const handleSearchChange = (value) => {
+    if (toolbar?.searchValue === void 0) {
+      setInternalSearch(value);
+    }
+    onSearchChange?.(value);
+    toolbar?.onSearchChange?.(value);
+  };
+  const handleSearchSubmit = () => {
+    onSearch?.(searchValue ?? "");
+    toolbar?.onSearch?.(searchValue ?? "");
+  };
+  const handleFilterSelect = (filter, value) => {
+    const nextFilters = {
+      ...resolvedFilters,
+      [filter.key]: value
+    };
+    if (filter.value === void 0) {
+      setInternalFilters((prev) => ({
+        ...prev,
+        [filter.key]: value
+      }));
+    }
+    onFiltersChange?.(nextFilters);
+    toolbar?.onFiltersChange?.(nextFilters);
+  };
+  const handleBulkAction = (action) => {
+    const keys = selectedKeys ?? [];
+    action.onClick?.(keys);
+    onBulkAction?.(action, keys);
+    toolbar?.onBulkAction?.(action, keys);
+  };
+  const handleTablePageChange = ({ current, pageSize }) => {
+    onPageChange?.(current, pageSize);
+    if (previousPageSizeRef.current !== void 0 && previousPageSizeRef.current !== pageSize) {
+      onPageSizeChange?.(current, pageSize);
+    }
+    previousPageSizeRef.current = pageSize;
+  };
+  const renderToolbar = () => {
+    if (!hasSearch && !hasFilters && !hasBulkActions) return null;
+    return /* @__PURE__ */ jsxs(
+      "div",
+      {
+        className: "tiger-data-table-toolbar flex flex-wrap items-center gap-2 pb-3",
+        role: "toolbar",
+        "aria-label": "\u6570\u636E\u8868\u683C\u5DE5\u5177\u680F",
+        children: [
+          /* @__PURE__ */ jsxs("div", { className: "flex items-center gap-2 flex-wrap flex-1 min-w-0", children: [
+            hasSearch ? /* @__PURE__ */ jsxs("div", { className: "flex items-center gap-2 w-full sm:w-auto sm:min-w-[200px] sm:max-w-[320px]", children: [
+              /* @__PURE__ */ jsx(
+                Input,
+                {
+                  type: "search",
+                  size: "sm",
+                  value: searchValue,
+                  placeholder: toolbar?.searchPlaceholder ?? "\u641C\u7D22",
+                  onChange: (event) => handleSearchChange(String(event.currentTarget.value)),
+                  onKeyDown: (event) => {
+                    if (event.key === "Enter") {
+                      handleSearchSubmit();
+                    }
+                  }
+                }
+              ),
+              toolbar?.showSearchButton ?? true ? /* @__PURE__ */ jsx(
+                Button,
+                {
+                  size: "sm",
+                  variant: "primary",
+                  className: "whitespace-nowrap shrink-0",
+                  onClick: handleSearchSubmit,
+                  disabled: !onSearch && !toolbar?.onSearch,
+                  children: toolbar?.searchButtonText ?? "\u641C\u7D22"
+                }
+              ) : null
+            ] }) : null,
+            hasFilters ? toolbar?.filters?.map((filter) => {
+              const currentValue = resolvedFilters[filter.key];
+              const clearable = filter.clearable !== false;
+              return /* @__PURE__ */ jsx(
+                "div",
+                {
+                  className: "w-full sm:w-auto sm:min-w-[120px] sm:max-w-[180px]",
+                  children: /* @__PURE__ */ jsx(
+                    Select,
+                    {
+                      size: "sm",
+                      options: filter.options.map((opt) => ({
+                        label: opt.label,
+                        value: opt.value
+                      })),
+                      value: currentValue ?? void 0,
+                      placeholder: filter.placeholder ?? filter.label,
+                      clearable,
+                      onChange: (value) => {
+                        handleFilterSelect(filter, value ?? null);
+                      }
+                    }
+                  )
+                },
+                filter.key
+              );
+            }) : null
+          ] }),
+          hasBulkActions ? /* @__PURE__ */ jsxs("div", { className: "flex items-center gap-2 flex-wrap ml-auto shrink-0", children: [
+            selectedCount > 0 ? /* @__PURE__ */ jsxs("span", { className: "text-sm text-[var(--tiger-text-muted,#6b7280)]", children: [
+              bulkLabel,
+              " ",
+              selectedCount,
+              " \u9879"
+            ] }) : null,
+            toolbar?.bulkActions?.map((action) => /* @__PURE__ */ jsx(
+              Button,
+              {
+                size: "sm",
+                variant: action.variant ?? "outline",
+                disabled: action.disabled || selectedCount === 0,
+                onClick: () => handleBulkAction(action),
+                children: action.label
+              },
+              action.key
+            ))
+          ] }) : null
+        ]
+      }
+    );
+  };
+  return /* @__PURE__ */ jsxs("div", { className: wrapperClasses, "data-tiger-data-table-with-toolbar": true, children: [
+    renderToolbar(),
+    /* @__PURE__ */ jsx(
+      Table,
+      {
+        ...tableProps,
+        pagination,
+        className: tableClassName,
+        onPageChange: handleTablePageChange
+      }
+    )
+  ] });
+};
+var DataTableWithToolbar_default = DataTableWithToolbar;
+
+export {
+  DataTableWithToolbar,
+  DataTableWithToolbar_default
+};

package/dist/chunk-E5GD3H7L.js

@@ -1,10 +1,14 @@
-'use strict';
+"use strict";Object.defineProperty(exports, "__esModule", {value: true});// src/components/ChartAxis.tsx
+var _react = require('react');
 
-var react = require('react');
-var tigercatCore = require('@expcat/tigercat-core');
-var jsxRuntime = require('react/jsx-runtime');
 
-// src/components/ChartAxis.tsx
+
+
+
+
+
+var _tigercatcore = require('@expcat/tigercat-core');
+var _jsxruntime = require('react/jsx-runtime');
 var ChartAxis = ({
   orientation = "bottom",
   scale,
@@ -20,8 +24,8 @@ var ChartAxis = ({
   className,
   ...props
 }) => {
-  const axisTicks = react.useMemo(
-    () => tigercatCore.getChartAxisTicks(scale, {
+  const axisTicks = _react.useMemo.call(void 0, 
+    () => _tigercatcore.getChartAxisTicks.call(void 0, scale, {
       tickCount: ticks,
       tickValues,
       tickFormat
@@ -36,8 +40,8 @@ var ChartAxis = ({
   const tickDirection = isTopOrLeft ? -1 : 1;
   const labelBase = tickSize + tickPadding + labelOffset;
   const labelPosition = (rangeStart + rangeEnd) / 2;
-  return /* @__PURE__ */ jsxRuntime.jsxs("g", { ...props, className: tigercatCore.classNames(className), transform: `translate(${x}, ${y})`, children: [
-    /* @__PURE__ */ jsxRuntime.jsx("line", { ...axisLine, className: tigercatCore.chartAxisLineClasses, "data-axis-line": "true" }),
+  return /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, "g", { ...props, className: _tigercatcore.classNames.call(void 0, className), transform: `translate(${x}, ${y})`, children: [
+    /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "line", { ...axisLine, className: _tigercatcore.chartAxisLineClasses, "data-axis-line": "true" }),
     axisTicks.map((tick) => {
       const textAnchor = isHorizontal ? "middle" : isTopOrLeft ? "end" : "start";
       const tickLine = isHorizontal ? {
@@ -62,15 +66,15 @@ var ChartAxis = ({
         textAnchor,
         dy: "0.32em"
       };
-      return /* @__PURE__ */ jsxRuntime.jsxs("g", { "data-axis-tick": "true", children: [
-        /* @__PURE__ */ jsxRuntime.jsx("line", { ...tickLine, className: tigercatCore.chartAxisTickLineClasses }),
-        /* @__PURE__ */ jsxRuntime.jsx("text", { ...textProps, className: tigercatCore.chartAxisTickTextClasses, children: tick.label })
+      return /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, "g", { "data-axis-tick": "true", children: [
+        /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "line", { ...tickLine, className: _tigercatcore.chartAxisTickLineClasses }),
+        /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "text", { ...textProps, className: _tigercatcore.chartAxisTickTextClasses, children: tick.label })
       ] }, `${tick.value}`);
     }),
-    label ? /* @__PURE__ */ jsxRuntime.jsx(
+    label ? /* @__PURE__ */ _jsxruntime.jsx.call(void 0, 
       "text",
       {
-        className: tigercatCore.chartAxisLabelClasses,
+        className: _tigercatcore.chartAxisLabelClasses,
         "data-axis-label": "true",
         ...isHorizontal ? {
           x: labelPosition,
@@ -90,5 +94,7 @@ var ChartAxis = ({
 };
 var ChartAxis_default = ChartAxis;
 
-exports.ChartAxis = ChartAxis;
-exports.ChartAxis_default = ChartAxis_default;
+
+
+
+exports.ChartAxis = ChartAxis; exports.ChartAxis_default = ChartAxis_default;

package/dist/chunk-EEF26RBA.mjs

@@ -1,8 +1,18 @@
-import React from 'react';
-import { shouldHideBadge, formatBadgeContent, classNames, badgeBaseClasses, getBadgeVariantClasses, dotSizeClasses, badgeSizeClasses, badgeTypeClasses, badgePositionClasses, badgeWrapperClasses } from '@expcat/tigercat-core';
-import { jsx, Fragment, jsxs } from 'react/jsx-runtime';
-
 // src/components/Badge.tsx
+import React from "react";
+import {
+  classNames,
+  getBadgeVariantClasses,
+  badgeBaseClasses,
+  badgeSizeClasses,
+  dotSizeClasses,
+  badgeTypeClasses,
+  badgeWrapperClasses,
+  badgePositionClasses,
+  formatBadgeContent,
+  shouldHideBadge
+} from "@expcat/tigercat-core";
+import { Fragment, jsx, jsxs } from "react/jsx-runtime";
 var Badge = React.memo(
   ({
     variant = "danger",
@@ -45,4 +55,6 @@ var Badge = React.memo(
 );
 Badge.displayName = "Badge";
 
-export { Badge };
+export {
+  Badge
+};

package/dist/chunk-EF5ZTNHX.js

@@ -0,0 +1,238 @@
+"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/Transfer.tsx
+var _react = require('react');
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+var _tigercatcore = require('@expcat/tigercat-core');
+var _jsxruntime = require('react/jsx-runtime');
+var TRANSFER_KEYS = /* @__PURE__ */ new Set([
+  "value",
+  "dataSource",
+  "size",
+  "disabled",
+  "showSearch",
+  "sourceTitle",
+  "targetTitle",
+  "notFoundText",
+  "filterOption",
+  "onChange"
+]);
+var Transfer = (props) => {
+  const {
+    value = [],
+    dataSource = [],
+    size = "md",
+    disabled = false,
+    showSearch = false,
+    sourceTitle = "Source",
+    targetTitle = "Target",
+    notFoundText = "No data",
+    filterOption,
+    className,
+    onChange,
+    ...rest
+  } = props;
+  const divProps = {};
+  for (const key of Object.keys(rest)) {
+    if (!TRANSFER_KEYS.has(key)) {
+      divProps[key] = rest[key];
+    }
+  }
+  const [sourceSelectedKeys, setSourceSelectedKeys] = _react.useState.call(void 0, /* @__PURE__ */ new Set());
+  const [targetSelectedKeys, setTargetSelectedKeys] = _react.useState.call(void 0, /* @__PURE__ */ new Set());
+  const [sourceSearch, setSourceSearch] = _react.useState.call(void 0, "");
+  const [targetSearch, setTargetSearch] = _react.useState.call(void 0, "");
+  const { sourceItems, targetItems } = _react.useMemo.call(void 0, 
+    () => _tigercatcore.splitTransferData.call(void 0, dataSource, value),
+    [dataSource, value]
+  );
+  const filteredSourceItems = _react.useMemo.call(void 0, 
+    () => _tigercatcore.filterTransferItems.call(void 0, sourceItems, sourceSearch, filterOption),
+    [sourceItems, sourceSearch, filterOption]
+  );
+  const filteredTargetItems = _react.useMemo.call(void 0, 
+    () => _tigercatcore.filterTransferItems.call(void 0, targetItems, targetSearch, filterOption),
+    [targetItems, targetSearch, filterOption]
+  );
+  const canMoveRight = !disabled && [...sourceSelectedKeys].some((key) => {
+    const item = dataSource.find((d) => d.key === key);
+    return item && !item.disabled;
+  });
+  const canMoveLeft = !disabled && [...targetSelectedKeys].some((key) => {
+    const item = dataSource.find((d) => d.key === key);
+    return item && !item.disabled;
+  });
+  function toggleSourceItem(key) {
+    setSourceSelectedKeys((prev) => {
+      const next = new Set(prev);
+      if (next.has(key)) next.delete(key);
+      else next.add(key);
+      return next;
+    });
+  }
+  function toggleTargetItem(key) {
+    setTargetSelectedKeys((prev) => {
+      const next = new Set(prev);
+      if (next.has(key)) next.delete(key);
+      else next.add(key);
+      return next;
+    });
+  }
+  function moveRight() {
+    if (!canMoveRight) return;
+    const keysToMove = [...sourceSelectedKeys].filter((key) => {
+      const item = dataSource.find((d) => d.key === key);
+      return item && !item.disabled;
+    });
+    const newTargetKeys = [...value, ...keysToMove];
+    setSourceSelectedKeys(/* @__PURE__ */ new Set());
+    _optionalChain([onChange, 'optionalCall', _ => _(newTargetKeys, "right", keysToMove)]);
+  }
+  function moveLeft() {
+    if (!canMoveLeft) return;
+    const keysToRemove = new Set(
+      [...targetSelectedKeys].filter((key) => {
+        const item = dataSource.find((d) => d.key === key);
+        return item && !item.disabled;
+      })
+    );
+    const newTargetKeys = value.filter((k) => !keysToRemove.has(k));
+    setTargetSelectedKeys(/* @__PURE__ */ new Set());
+    _optionalChain([onChange, 'optionalCall', _2 => _2(newTargetKeys, "left", [...keysToRemove])]);
+  }
+  function renderPanel(title, items, selectedKeys, toggleFn, searchValue, onSearch) {
+    return /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, "div", { className: _tigercatcore.transferPanelClasses, role: "group", "aria-label": title, children: [
+      /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "div", { className: _tigercatcore.transferPanelHeaderClasses, children: /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, "span", { className: "font-medium text-[var(--tiger-transfer-title,var(--tiger-text,#111827))]", children: [
+        title,
+        " (",
+        items.length,
+        ")"
+      ] }) }),
+      showSearch && /* @__PURE__ */ _jsxruntime.jsx.call(void 0, 
+        "input",
+        {
+          type: "text",
+          className: _tigercatcore.transferSearchClasses,
+          placeholder: "Search...",
+          value: searchValue,
+          "aria-label": `Search ${title}`,
+          onChange: (e) => onSearch(e.target.value)
+        }
+      ),
+      /* @__PURE__ */ _jsxruntime.jsx.call(void 0, 
+        "div",
+        {
+          className: _tigercatcore.transferPanelBodyClasses,
+          ..._tigercatcore.getPickerListboxAria.call(void 0, { label: `${title} items` }),
+          children: items.length > 0 ? items.map((item) => {
+            const isSelected = selectedKeys.has(item.key);
+            const isDisabled = disabled || !!item.disabled;
+            return /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, 
+              "label",
+              {
+                className: _tigercatcore.getTransferItemClasses.call(void 0, isSelected, isDisabled, size),
+                ..._tigercatcore.getPickerOptionAria.call(void 0, { selected: isSelected, disabled: isDisabled }),
+                children: [
+                  /* @__PURE__ */ _jsxruntime.jsx.call(void 0, 
+                    "input",
+                    {
+                      type: "checkbox",
+                      className: _tigercatcore.getTransferCheckboxClasses.call(void 0, size),
+                      checked: isSelected,
+                      disabled: isDisabled,
+                      onChange: () => {
+                        if (!isDisabled) toggleFn(item.key);
+                      }
+                    }
+                  ),
+                  /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "span", { className: "flex-1 truncate", children: item.label })
+                ]
+              },
+              String(item.key)
+            );
+          }) : /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "div", { className: _tigercatcore.transferEmptyClasses, children: notFoundText })
+        }
+      )
+    ] });
+  }
+  return /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, "div", { className: _tigercatcore.classNames.call(void 0, _tigercatcore.transferBaseClasses, className), ...divProps, children: [
+    renderPanel(
+      sourceTitle,
+      filteredSourceItems,
+      sourceSelectedKeys,
+      toggleSourceItem,
+      sourceSearch,
+      setSourceSearch
+    ),
+    /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, "div", { className: _tigercatcore.transferOperationClasses, children: [
+      /* @__PURE__ */ _jsxruntime.jsx.call(void 0, 
+        "button",
+        {
+          type: "button",
+          className: _tigercatcore.getTransferButtonClasses.call(void 0, !canMoveRight),
+          disabled: !canMoveRight,
+          "aria-label": "Move selected to target",
+          onClick: moveRight,
+          children: /* @__PURE__ */ _jsxruntime.jsx.call(void 0, 
+            "svg",
+            {
+              className: "w-4 h-4",
+              viewBox: _tigercatcore.icon20ViewBox,
+              fill: "currentColor",
+              xmlns: "http://www.w3.org/2000/svg",
+              children: /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "path", { d: _tigercatcore.chevronRightSolidIcon20PathD, fillRule: "evenodd", clipRule: "evenodd" })
+            }
+          )
+        }
+      ),
+      /* @__PURE__ */ _jsxruntime.jsx.call(void 0, 
+        "button",
+        {
+          type: "button",
+          className: _tigercatcore.getTransferButtonClasses.call(void 0, !canMoveLeft),
+          disabled: !canMoveLeft,
+          "aria-label": "Move selected to source",
+          onClick: moveLeft,
+          children: /* @__PURE__ */ _jsxruntime.jsx.call(void 0, 
+            "svg",
+            {
+              className: "w-4 h-4",
+              viewBox: _tigercatcore.icon20ViewBox,
+              fill: "currentColor",
+              xmlns: "http://www.w3.org/2000/svg",
+              children: /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "path", { d: _tigercatcore.chevronLeftSolidIcon20PathD, fillRule: "evenodd", clipRule: "evenodd" })
+            }
+          )
+        }
+      )
+    ] }),
+    renderPanel(
+      targetTitle,
+      filteredTargetItems,
+      targetSelectedKeys,
+      toggleTargetItem,
+      targetSearch,
+      setTargetSearch
+    )
+  ] });
+};
+
+
+
+exports.Transfer = Transfer;