@jswork/antd-components 1.0.106 → 1.0.108

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@jswork/antd-components",
-  "version": "1.0.106",
+  "version": "1.0.108",
   "main": "dist/main.cjs.js",
   "module": "dist/main.esm.js",
   "types": "dist/main.d.ts",
@@ -32,7 +32,7 @@
     "postcss": "^8.5.3",
     "react": "^18.2.0",
     "react-dom": "^18.2.0",
-    "tsup": "^7.2.0",
+    "tsup": "8.3.5",
     "typescript": "^5.2.2"
   },
   "publishConfig": {
@@ -44,15 +44,17 @@
     "@jswork/event-mitt": "^2.0.17",
     "@jswork/harmony-events": "^1.2.11",
     "@jswork/loadkit": "^1.0.6",
+    "@jswork/next-create-fetcher": "^1.0.5",
     "@jswork/next-dom-event": "^1.0.8",
     "@jswork/next-gpid": "^1.0.4",
     "@jswork/next-tree-walk": "^1.0.7",
+    "@jswork/next-unique": "^1.0.2",
     "@jswork/noop": "^1.0.0",
     "@jswork/react-codeflask": "^1.1.2",
     "@jswork/react-list": "^1.4.3",
     "@jswork/weibo2res": "^1.0.4",
     "fast-deep-equal": "^3.1.3",
-    "nanoid": "^4.0.2",
+    "nanoid": "5.0.9",
     "react-input-autosize": "^3.0.0",
     "sortablejs": "^1.15.0"
   },

package/src/lib/_abstract-upload.tsx

@@ -6,7 +6,6 @@ import { UploadChangeParam } from 'antd/es/upload/interface';
 import { UploadFile } from 'antd';
 import { flushSync } from 'react-dom';
 
-import nx from '@jswork/next';
 import '@jswork/next-gpid';
 
 const styleOpts = { id: 'viewer-style' };
@@ -17,7 +16,7 @@ const scriptURL = 'https://unpkg.com/viewerjs@1.11.1/dist/viewer.min.js';
 type StdEventTarget = { target: { value: any } };
 type StdCallback = (inEvent: StdEventTarget) => void;
 
-type Props = {
+export type AcAbstractUploadProps = {
   className?: string;
   value?: any[] | [];
   onChange?: StdCallback;
@@ -29,7 +28,7 @@ type State = {
   fileList: any[];
 };
 
-export class AcAbstractUpload extends React.Component<Props, State> {
+export class AcAbstractUpload extends React.Component<AcAbstractUploadProps, State> {
   protected rootRef = React.createRef<HTMLDivElement>();
   protected sortable: any = null;
   protected viewer: any = null;
@@ -43,7 +42,7 @@ export class AcAbstractUpload extends React.Component<Props, State> {
     });
   };
 
-  constructor(inProps) {
+  constructor(inProps: AcAbstractUploadProps) {
     super(inProps);
     this.state = {
       fileList: this.toFileList(inProps.value)
@@ -58,7 +57,7 @@ export class AcAbstractUpload extends React.Component<Props, State> {
     await this.mountViewer(el);
   }
 
-  shouldComponentUpdate(nextProps: Readonly<Props>): boolean {
+  shouldComponentUpdate(nextProps: Readonly<AcAbstractUploadProps>): boolean {
     const { value } = nextProps;
     if (value !== this.props.value) {
       this.setState({ fileList: this.toFileList(value as any[]) });

package/src/lib/alert.tsx

@@ -1,5 +1,4 @@
 import React from 'react';
-import nx from '@jswork/next';
 import { Input, InputProps, Modal } from 'antd';
 
 declare global {

package/src/lib/breadcrumb.tsx

@@ -14,7 +14,7 @@ const CLASS_NAME = 'ac-breadcrumb';
 type StdEventTarget = { target: { value: any } };
 type StdCallback = (inEvent: StdEventTarget) => void;
 
-type Props = {
+export type AcBreadcrumbProps = {
   className?: string;
   items?: any[];
   template?: (args: TemplateArgs) => React.ReactNode;
@@ -22,7 +22,7 @@ type Props = {
   onChange?: StdCallback;
 } & BreadcrumbProps;
 
-export class AcBreadcrumb extends React.Component<Props> {
+export class AcBreadcrumb extends React.Component<AcBreadcrumbProps> {
   static displayName = CLASS_NAME;
   static defaultProps = {
     onChange: noop,
@@ -38,3 +38,9 @@ export class AcBreadcrumb extends React.Component<Props> {
     );
   }
 }
+
+export const AcBreadcrumbFc = (props: AcBreadcrumbProps) => {
+  return <AcBreadcrumb {...props} />;
+};
+
+

package/src/lib/checkable-dropdown.tsx

@@ -2,7 +2,6 @@ import React from 'react';
 import noop from '@jswork/noop';
 import { Checkbox, Dropdown, Button, MenuProps } from 'antd';
 import { DownOutlined } from '@ant-design/icons';
-import nx from '@jswork/next';
 import '@jswork/next-dom-event';
 import { SizeType } from 'antd/es/config-provider/SizeContext';
 
@@ -11,7 +10,7 @@ const locales = { 'zh-CN': { selectAll: '全部' }, 'en-US': { selectAll: 'All'
 type StdEventTarget = { target: { value: any } };
 type StdCallback = (inEvent: StdEventTarget) => void;
 
-type Props = {
+export type AcCheckableDropdownProps = {
   className?: string;
   lang?: string;
   items?: any[];
@@ -22,7 +21,7 @@ type Props = {
   onChange?: StdCallback;
 };
 
-export class AcCheckableDropdown extends React.Component<Props> {
+export class AcCheckableDropdown extends React.Component<AcCheckableDropdownProps> {
   static displayName = CLASS_NAME;
   static formSchema = CLASS_NAME;
   static id = 1;

package/src/lib/checkbox.tsx

@@ -7,7 +7,7 @@ const CLASS_NAME = 'ac-checkbox';
 type StdEventTarget = { target: { value: any } };
 type StdCallback = (inEvent: StdEventTarget) => void;
 
-type AcCheckboxProps = {
+export type AcCheckboxProps = {
   className?: string;
   value?: boolean;
   onChange?: StdCallback;

package/src/lib/editable-tag-group.tsx

@@ -4,9 +4,8 @@ import noop from '@jswork/noop';
 import AutosizeInput from 'react-input-autosize';
 import { Button, Tag } from 'antd';
 import deepEqual from 'fast-deep-equal';
-import nx from '@jswork/next';
-import _ from 'lodash';
 import '@jswork/next-dom-event';
+import '@jswork/next-unique';
 import { AcInteractiveList } from './interactive-list';
 
 const CLASS_NAME = 'ac-editable-tag-group';
@@ -155,7 +154,7 @@ export class AcEditableTagGroup extends React.Component<AcEditableTagGroupProps>
     let { value } = this.state;
     const len = value?.length;
     setTimeout(() => {
-      value = _.uniq(value);
+      value = nx.unique(value || []);
       if (document.activeElement !== this.latestInput) {
         value = value?.filter(Boolean);
       }

package/src/lib/input-number.tsx

@@ -7,7 +7,7 @@ const CLASS_NAME = 'ac-input-number';
 type StdEventTarget = { target: { value: any } };
 type StdCallback = (inEvent: StdEventTarget) => void;
 
-type AcInputNumberProps = {
+export type AcInputNumberProps = {
   className?: string;
   value?: number;
   onChange?: StdCallback;

package/src/lib/input-tags.tsx

@@ -11,7 +11,7 @@ const TRIGGER_KEYS = ['Tab', 'Enter', 'Space'];
 type StdEventTarget = { target: { value: any } };
 type StdCallback = (inEvent: StdEventTarget) => void;
 
-type AcInputTagsProps = {
+export type AcInputTagsProps = {
   className?: string;
   items?: string[];
   disabled?: boolean;

package/src/lib/input-token.tsx

@@ -9,7 +9,7 @@ const CLASS_NAME = 'ac-input-token';
 type StdEventTarget = { target: { value: any } };
 type StdCallback = (inEvent: StdEventTarget) => void;
 
-type AcInputTokenProps = {
+export type AcInputTokenProps = {
   className?: string;
   value?: string;
   onChange?: StdCallback;

package/src/lib/input.tsx

@@ -7,7 +7,7 @@ const CLASS_NAME = 'ac-input';
 type StdEventTarget = { target: { value: any } };
 type StdCallback = (inEvent: StdEventTarget) => void;
 
-type AcInputProps = {
+export type AcInputProps = {
   className?: string;
   onChange?: StdCallback;
   autoComplete?: boolean;

package/src/lib/radio-group.tsx

@@ -10,7 +10,7 @@ type StdEventTarget = { target: { value: any } };
 type StdCallback = (inEvent: StdEventTarget) => void;
 type TemplateCallback = (item: { item: any; index: number }, opts?: any) => React.ReactNode;
 
-type AcRadioGroupProps = {
+export type AcRadioGroupProps = {
   className?: string;
   value?: any;
   defaultValue?: any;

package/src/lib/range-picker.tsx

@@ -12,7 +12,7 @@ const { RangePicker } = DatePicker;
 type StdEventTarget = { target: { value: any } };
 type StdCallback = (inEvent: StdEventTarget) => void;
 
-type AcRangePickerProps = {
+export type AcRangePickerProps = {
   className?: string;
   value?: any;
   defaultValue?: any;

package/src/lib/rate.tsx

@@ -7,7 +7,7 @@ const CLASS_NAME = 'ac-rate';
 type StdEventTarget = { target: { value: any } };
 type StdCallback = (inEvent: StdEventTarget) => void;
 
-type AcRateProps = {
+export type AcRateProps = {
   className?: string;
   value?: number;
   onChange?: StdCallback;

package/src/lib/search.tsx

@@ -8,7 +8,7 @@ const CLASS_NAME = 'ac-search';
 type StdEventTarget = { target: { value: any } };
 type StdCallback = (inEvent: StdEventTarget) => void;
 
-type AcSearchProps = {
+export type AcSearchProps = {
   className?: string;
   value?: boolean;
   onChange?: StdCallback;

package/src/lib/select.tsx

@@ -15,7 +15,7 @@ type StdEventTarget = { target: { value: any } };
 type StdCallback = (inEvent: StdEventTarget) => void;
 type TemplateCallback = (item: { item: any; index: number }) => React.ReactNode;
 
-type AcSelectProps = {
+export type AcSelectProps = {
   className?: string;
   items?: any[];
   kv?: Record<string, string>;

package/src/lib/switch.tsx

@@ -7,7 +7,7 @@ const CLASS_NAME = 'ac-switch';
 type StdEventTarget = { target: { value: any } };
 type StdCallback = (inEvent: StdEventTarget) => void;
 
-type AcSwitchProps = {
+export type AcSwitchProps = {
   className?: string;
   value?: boolean;
   onChange?: StdCallback;

package/src/lib/table.tsx

@@ -4,11 +4,12 @@
  * @LastEditors: aric.zheng 1290657123@qq.com
  * @LastEditTime: 2025-10-16 08:20:55
  */
-import React from 'react';
+import React, { FC } from 'react';
 import { Table, TableProps, message } from 'antd';
 import cx from 'classnames';
 import type { EventMittNamespace } from '@jswork/event-mitt';
 import { ReactHarmonyEvents } from '@jswork/harmony-events';
+import '@jswork/next-create-fetcher';
 
 const CLASS_NAME = 'ac-table';
 
@@ -142,3 +143,28 @@ export class AcTable extends React.Component<AcTableProps, any> {
     );
   }
 }
+
+export type AcTableMainProps = Omit<AcTableProps, 'fetcher'> & {
+  name: string;
+  dataPath?: string
+  totalPath?: string;
+};
+
+export const AcTableMain: FC<AcTableMainProps> = (props) => {
+  const { name, dataPath, totalPath, ...rest } = { dataPath: 'rows', totalPath: 'total', ...props };
+  const resourceId = `${name}_index`;
+  const fetcher = nx.createFetcher(resourceId, { dataPath, totalPath });
+
+  return (
+    <AcTable
+      size="middle"
+      rowKey="id"
+      bordered
+      name={name}
+      fetcher={fetcher}
+      pagination={{ showSizeChanger: true }}
+      {...rest}
+    />
+  );
+};
+

package/src/lib/transfer.tsx

@@ -9,7 +9,7 @@ type StdEventTarget = { target: { value: any } };
 type StdCallback = (inEvent: StdEventTarget) => void;
 type TemplateCallback = (item: { item: any }, options?: any) => React.ReactNode;
 
-type AcTransferProps = {
+export type AcTransferProps = {
   className?: string;
   items?: any[];
   template: TemplateCallback;

package/src/lib/tree-select.tsx

@@ -11,7 +11,7 @@ type StdCallback = (inEvent: StdEventTarget) => void;
 
 // @see: https://github.com/afeiship/react-ant-tree-select
 
-type AcTreeSelectProps = {
+export type AcTreeSelectProps = {
   className?: string;
   items?: any[];
   template?: any;

package/src/lib/tree.tsx

@@ -10,7 +10,7 @@ const DEFAULT_KV = {
   value: 'value',
 };
 
-type Props = {
+export type AcTreeProps = {
   className?: string;
   items?: any[];
   kv?: Record<string, string>;
@@ -19,7 +19,7 @@ type Props = {
   directory?: boolean;
 } & TreeProps;
 
-export class AcTree extends React.Component<Props> {
+export class AcTree extends React.Component<AcTreeProps> {
   static displayName = CLASS_NAME;
   static formSchema = CLASS_NAME;
   static defaultProps = {
@@ -46,7 +46,6 @@ export class AcTree extends React.Component<Props> {
 
   render() {
     const { className, children, items, template, itemsKey, directory, ...props } = this.props;
-
     const RootComp: any = directory ? Tree.DirectoryTree : Tree;
 
     if (items?.length === 0) return null;

package/src/lib/upload-dragger.tsx

@@ -11,7 +11,7 @@ type StdEventTarget = { target: { value: any } };
 type StdCallback = (inEvent: StdEventTarget) => void;
 type CustomRequest = (inEvent: any) => Promise<any>;
 
-type AcUploadDraggerProps = {
+export type AcUploadDraggerProps = {
   className?: string;
   value?: any[];
   defaultValue?: any[];

package/src/lib/upload-picture-card.tsx

@@ -4,10 +4,9 @@ import { Space, Upload } from 'antd';
 import cx from 'classnames';
 import { UploadOutlined } from '@ant-design/icons';
 
-import nx from '@jswork/next';
 import weibo2res from '@jswork/weibo2res';
-import '@jswork/next-gpid';
 import { AcAbstractUpload } from './_abstract-upload';
+import '@jswork/next-gpid';
 
 const CLASS_NAME = 'ac-upload-picture-card';
 const toWeiboPid = (inItem) => {

package/src/lib/upload-picture.tsx

@@ -4,7 +4,7 @@ import { UploadOutlined } from '@ant-design/icons';
 import { Upload, Button } from 'antd';
 import cx from 'classnames';
 import { AcAbstractUpload } from './_abstract-upload';
-import nx from '@jswork/next';
+import '@jswork/next-gpid';
 
 const CLASS_NAME = 'ac-upload-picture';
 

package/src/lib/upload.tsx

@@ -11,7 +11,7 @@ type StdEventTarget = { target: { value: any } };
 type StdCallback = (inEvent: StdEventTarget) => void;
 type CustomRequest = (inEvent: any) => Promise<any>;
 
-type AcUploadProps = {
+export type AcUploadProps = {
   className?: string;
   value?: number;
   onChange?: StdCallback;

package/src/main.ts

@@ -26,7 +26,7 @@ import { AcSelect, AcSelectFc } from './lib/select';
 import { AcSlider, AcSliderFc } from './lib/slider';
 import { AcSliderRange, AcSliderRangeFc } from './lib/slider-range';
 import { AcSwitch, AcSwitchFc } from './lib/switch';
-import { AcTable } from './lib/table';
+import { AcTable, AcTableMain } from './lib/table';
 import { AcTextarea, AcTextareaFc } from './lib/textarea';
 import { AcTimePicker, AcTimePickerFc } from './lib/time-picker';
 import { AcTransfer, AcTransferFc } from './lib/transfer';
@@ -37,6 +37,7 @@ import { AcUploadPicture, AcUploadPictureFc } from './lib/upload-picture';
 import { AcUploadPictureCard, AcUploadPictureCardFc } from './lib/upload-picture-card';
 import { AcUpload, AcUploadFc } from './lib/upload';
 
+import '@jswork/next';
 import './lib/alert';
 
 // commands
@@ -88,6 +89,7 @@ export {
   AcSliderRange,
   AcSwitch,
   AcTable,
+  AcTableMain,
   AcTextarea,
   AcTimePicker,
   AcTransfer,
@@ -98,7 +100,7 @@ export {
   AcUploadPictureCard,
   AcUpload,
 
-  // --- fc ---
+  // --- fc components ---
   AcCheckableTagFc,
   AcCheckableTagListFc,
   AcCheckboxFc,