antdv-next 0.0.111 → 1.0.0-alpha.1

package/dist/transfer/interface.d.ts

@@ -0,0 +1,161 @@
+import { VueNode } from "../_util/type.js";
+import { SemanticClassNames, SemanticClassNamesType, SemanticStyles, SemanticStylesType } from "../_util/hooks/useMergeSemantic.js";
+import "../_util/hooks/index.js";
+import { InputStatus } from "../_util/statusUtils.js";
+import { ComponentBaseProps } from "../config-provider/context.js";
+import { CSSProperties } from "vue";
+
+//#region src/transfer/interface.d.ts
+type TransferKey = string | number;
+type PaginationType = boolean | {
+  pageSize?: number;
+  simple?: boolean;
+  showSizeChanger?: boolean;
+  showLessItems?: boolean;
+};
+type TransferDirection = 'left' | 'right';
+interface RenderResultObject {
+  label: VueNode;
+  value: string;
+}
+type RenderResult = VueNode | RenderResultObject | string | null;
+interface TransferItem {
+  key?: TransferKey;
+  title?: string;
+  description?: string;
+  disabled?: boolean;
+  [name: string]: any;
+}
+type KeyWise<T> = T & {
+  key: TransferKey;
+};
+type KeyWiseTransferItem = KeyWise<TransferItem>;
+type TransferRender<RecordType> = (item: RecordType) => RenderResult;
+interface ListStyle {
+  direction: TransferDirection;
+}
+type SelectAllLabel = VueNode | ((info: {
+  selectedCount: number;
+  totalCount: number;
+}) => VueNode);
+interface TransferLocale {
+  titles?: VueNode[];
+  notFoundContent?: VueNode | VueNode[];
+  searchPlaceholder: string;
+  itemUnit: string;
+  itemsUnit: string;
+  remove?: string;
+  selectAll?: string;
+  deselectAll?: string;
+  selectCurrent?: string;
+  selectInvert?: string;
+  removeAll?: string;
+  removeCurrent?: string;
+}
+interface TransferSearchOption {
+  placeholder?: string;
+  defaultValue?: string;
+}
+type TransferSemanticName = 'root' | 'section' | 'header' | 'title' | 'body' | 'list' | 'item' | 'itemIcon' | 'itemContent' | 'footer' | 'actions';
+type TransferClassNamesType = SemanticClassNamesType<TransferProps, TransferSemanticName>;
+type TransferStylesType = SemanticStylesType<TransferProps, TransferSemanticName>;
+interface TransferListProps<RecordType> extends TransferLocale {
+  prefixCls: string;
+  style?: CSSProperties;
+  classes?: SemanticClassNames<TransferSemanticName>;
+  styles?: SemanticStyles<TransferSemanticName>;
+  titleText: VueNode;
+  dataSource: RecordType[];
+  filterOption?: (filterText: string, item: RecordType, direction: TransferDirection) => boolean;
+  checkedKeys: TransferKey[];
+  handleFilter: (e: Event) => void;
+  onItemSelect: (key: TransferKey, check: boolean, e?: MouseEvent) => void;
+  onItemSelectAll: (dataSource: TransferKey[], checkAll: boolean | 'replace') => void;
+  onItemRemove?: (keys: TransferKey[]) => void;
+  handleClear: () => void;
+  render?: TransferRender<RecordType>;
+  labelRender?: (item: RecordType) => any;
+  showSearch?: boolean | TransferSearchOption;
+  renderList?: (props: TransferListBodyProps<RecordType>) => any;
+  footer?: (props: TransferListProps<RecordType>, info?: {
+    direction: TransferDirection;
+  }) => any;
+  onScroll: (e: Event) => void;
+  disabled?: boolean;
+  direction: TransferDirection;
+  showSelectAll?: boolean;
+  selectAllLabel?: SelectAllLabel;
+  showRemove?: boolean;
+  pagination?: PaginationType;
+  selectionsIcon?: VueNode;
+}
+interface RenderedItem<RecordType> {
+  renderedText: string;
+  renderedEl: VueNode;
+  item: RecordType;
+}
+declare const OmitProps: readonly ["handleFilter", "handleClear", "checkedKeys"];
+type OmitProp = (typeof OmitProps)[number];
+type PartialTransferListProps<RecordType> = Omit<TransferListProps<RecordType>, OmitProp>;
+interface TransferListBodyProps<RecordType> extends PartialTransferListProps<RecordType> {
+  filteredItems: RecordType[];
+  filteredRenderItems: RenderedItem<RecordType>[];
+  selectedKeys: TransferKey[];
+}
+interface TransferCustomListBodyProps<RecordType> extends TransferListBodyProps<RecordType> {}
+interface TransferProps<RecordType = any> extends ComponentBaseProps {
+  /** @deprecated Please use `styles.section` instead. */
+  listStyle?: ((style: ListStyle) => CSSProperties) | CSSProperties;
+  /** @deprecated Please use `styles.actions` instead. */
+  operationStyle?: CSSProperties;
+  classes?: TransferClassNamesType;
+  styles?: TransferStylesType;
+  disabled?: boolean;
+  dataSource?: RecordType[];
+  targetKeys?: TransferKey[];
+  selectedKeys?: TransferKey[];
+  render?: TransferRender<RecordType>;
+  labelRender?: (item: RecordType) => any;
+  titles?: VueNode[];
+  /** @deprecated Please use `actions` instead. */
+  operations?: VueNode[];
+  actions?: VueNode[];
+  showSearch?: boolean | TransferSearchOption;
+  filterOption?: (inputValue: string, item: RecordType, direction: TransferDirection) => boolean;
+  locale?: Partial<TransferLocale>;
+  footer?: (props: TransferListProps<RecordType>, info?: {
+    direction: TransferDirection;
+  }) => any;
+  rowKey?: (record: RecordType) => TransferKey;
+  showSelectAll?: boolean;
+  selectAllLabels?: SelectAllLabel[];
+  oneWay?: boolean;
+  pagination?: PaginationType;
+  status?: InputStatus;
+  selectionsIcon?: VueNode;
+}
+interface TransferEmits {
+  'change': (targetKeys: TransferKey[], direction: TransferDirection, moveKeys: TransferKey[]) => void;
+  'selectChange': (sourceSelectedKeys: TransferKey[], targetSelectedKeys: TransferKey[]) => void;
+  'search': (direction: TransferDirection, value: string) => void;
+  'scroll': (direction: TransferDirection, e: Event) => void;
+  'update:targetKeys': (targetKeys: TransferKey[]) => void;
+  'update:selectedKeys': (selectedKeys: TransferKey[]) => void;
+  [key: string]: (...args: any[]) => void;
+}
+interface TransferSlots<RecordType = any> {
+  default?: (props: TransferCustomListBodyProps<RecordType>) => any;
+  render?: (item: RecordType) => any;
+  labelRender?: (item: RecordType) => any;
+  footer?: (props: {
+    props: TransferListProps<RecordType>;
+    info?: {
+      direction: TransferDirection;
+    };
+  }) => any;
+  selectionsIcon?: () => any;
+  titles?: () => any;
+  actions?: () => any;
+}
+//#endregion
+export { KeyWise, KeyWiseTransferItem, ListStyle, PaginationType, RenderResult, RenderResultObject, SelectAllLabel, TransferClassNamesType, TransferCustomListBodyProps, TransferDirection, TransferEmits, TransferItem, TransferKey, TransferListBodyProps, TransferListProps, TransferLocale, TransferProps, TransferRender, TransferSearchOption, TransferSemanticName, TransferSlots, TransferStylesType };

package/dist/transfer/interface.js

@@ -0,0 +1,9 @@
+//#region src/transfer/interface.ts
+const OmitProps = [
+	"handleFilter",
+	"handleClear",
+	"checkedKeys"
+];
+
+//#endregion
+export { OmitProps };

package/dist/transfer/search.d.ts

@@ -0,0 +1,24 @@
+import { VueNode } from "../_util/type.js";
+import * as vue263 from "vue";
+import { SlotsType } from "vue";
+
+//#region src/transfer/search.d.ts
+interface TransferSearchProps {
+  prefixCls?: string;
+  placeholder?: string;
+  value?: string;
+  disabled?: boolean;
+}
+interface TransferSearchEmits {
+  change: (e: Event) => void;
+  clear: () => void;
+  [key: string]: (...args: any[]) => void;
+}
+interface TransferSearchSlots {
+  prefix?: () => VueNode;
+}
+declare const Search: vue263.DefineSetupFnComponent<TransferSearchProps, TransferSearchEmits, SlotsType<TransferSearchSlots>, TransferSearchProps & {
+  [x: `on${Capitalize<string>}`]: ((...args: any[]) => any) | undefined;
+}, vue263.PublicProps>;
+//#endregion
+export { Search, TransferSearchEmits, TransferSearchProps, TransferSearchSlots };

package/dist/transfer/search.js

@@ -0,0 +1,46 @@
+import Input_default from "../input/Input.js";
+import { createVNode, defineComponent } from "vue";
+import { SearchOutlined } from "@antdv-next/icons";
+
+//#region src/transfer/search.tsx
+const Search = /* @__PURE__ */ defineComponent((props, { emit, slots }) => {
+	const handleChange = (e) => {
+		emit("change", e);
+		if (!(e?.target)?.value) emit("clear");
+	};
+	return () => createVNode(Input_default, {
+		"placeholder": props.placeholder || "",
+		"class": props.prefixCls,
+		"value": props.value,
+		"onChange": handleChange,
+		"disabled": props.disabled,
+		"allowClear": true,
+		"prefix": slots?.prefix?.() ?? createVNode(SearchOutlined, null, null)
+	}, null);
+}, {
+	emits: ["change", "clear"],
+	props: {
+		prefixCls: {
+			type: String,
+			required: false
+		},
+		placeholder: {
+			type: String,
+			required: false
+		},
+		value: {
+			type: String,
+			required: false
+		},
+		disabled: {
+			type: Boolean,
+			required: false
+		}
+	},
+	name: "ATransferSearch",
+	inheritAttrs: false
+});
+var search_default = Search;
+
+//#endregion
+export { search_default as default };

package/dist/transfer/style/index.d.ts

@@ -0,0 +1,38 @@
+import "../../theme/internal.js";
+import "vue";
+
+//#region src/transfer/style/index.d.ts
+interface ComponentToken {
+  /**
+   * @desc 列表宽度
+   * @descEN Width of list
+   */
+  listWidth: number | string;
+  /**
+   * @desc 大号列表宽度
+   * @descEN Width of large list
+   */
+  listWidthLG: number | string;
+  /**
+   * @desc 列表高度
+   * @descEN Height of list
+   */
+  listHeight: number | string;
+  /**
+   * @desc 列表项高度
+   * @descEN Height of list item
+   */
+  itemHeight: number | string;
+  /**
+   * @desc 列表项纵向内边距
+   * @descEN Vertical padding of list item
+   */
+  itemPaddingBlock: number | string;
+  /**
+   * @desc 顶部高度
+   * @descEN Height of header
+   */
+  headerHeight: number | string;
+}
+//#endregion
+export { ComponentToken };

package/dist/transfer/style/index.js

@@ -0,0 +1,213 @@
+import { operationUnit, resetComponent, resetIcon, textEllipsis } from "../../style/index.js";
+import { genStyleHooks } from "../../theme/util/genStyleUtils.js";
+import { mergeToken } from "../../theme/internal.js";
+import { unit } from "@antdv-next/cssinjs";
+
+//#region src/transfer/style/index.ts
+const genTransferCustomizeStyle = (token) => {
+	const { antCls, componentCls, listHeight, controlHeightLG } = token;
+	const tableCls = `${antCls}-table`;
+	const inputCls = `${antCls}-input`;
+	return { [`${componentCls}-customize-list`]: {
+		[`${componentCls}-section`]: {
+			flex: "1 1 50%",
+			width: "auto",
+			height: "auto",
+			minHeight: listHeight,
+			minWidth: 0
+		},
+		[`${tableCls}-wrapper`]: {
+			[`${tableCls}-small`]: {
+				border: 0,
+				borderRadius: 0,
+				[`${tableCls}-selection-column`]: {
+					width: controlHeightLG,
+					minWidth: controlHeightLG
+				}
+			},
+			[`${tableCls}-pagination${tableCls}-pagination`]: {
+				margin: 0,
+				padding: token.paddingXS
+			}
+		},
+		[`${inputCls}[disabled]`]: { backgroundColor: "transparent" }
+	} };
+};
+function genTransferStatusColor(token, color) {
+	const { componentCls, colorBorder } = token;
+	return { [`${componentCls}-section`]: {
+		borderColor: color,
+		[`${componentCls}-list-search:not([disabled])`]: { borderColor: colorBorder }
+	} };
+}
+const genTransferStatusStyle = (token) => {
+	const { componentCls } = token;
+	return {
+		[`${componentCls}-status-error`]: { ...genTransferStatusColor(token, token.colorError) },
+		[`${componentCls}-status-warning`]: { ...genTransferStatusColor(token, token.colorWarning) }
+	};
+};
+const genTransferListStyle = (token) => {
+	const { componentCls, colorBorder, colorSplit, lineWidth, itemHeight, headerHeight, transferHeaderVerticalPadding, itemPaddingBlock, controlItemBgActive, colorTextDisabled, colorTextSecondary, listHeight, listWidth, listWidthLG, fontSizeIcon, marginXS, paddingSM, lineType, antCls, iconCls, motionDurationSlow, controlItemBgHover, borderRadiusLG, colorBgContainer, colorText, controlItemBgActiveHover } = token;
+	const contentBorderRadius = unit(token.calc(borderRadiusLG).sub(lineWidth).equal());
+	return {
+		"display": "flex",
+		"flexDirection": "column",
+		"width": listWidth,
+		"height": listHeight,
+		"border": `${unit(lineWidth)} ${lineType} ${colorBorder}`,
+		"borderRadius": token.borderRadiusLG,
+		"&-with-pagination": {
+			width: listWidthLG,
+			height: "auto"
+		},
+		[`${componentCls}-list`]: {
+			"&-search": { [`${iconCls}-search`]: { color: colorTextDisabled } },
+			"&-header": {
+				"display": "flex",
+				"flex": "none",
+				"alignItems": "center",
+				"height": headerHeight,
+				"padding": `${unit(token.calc(transferHeaderVerticalPadding).sub(lineWidth).equal())} ${unit(paddingSM)} ${unit(transferHeaderVerticalPadding)}`,
+				"color": colorText,
+				"background": colorBgContainer,
+				"borderBottom": `${unit(lineWidth)} ${lineType} ${colorSplit}`,
+				"borderRadius": `${unit(borderRadiusLG)} ${unit(borderRadiusLG)} 0 0`,
+				"> *:not(:last-child)": { marginInlineEnd: 4 },
+				"> *": { flex: "none" },
+				"&-title": {
+					...textEllipsis,
+					flex: "0 1 auto",
+					textAlign: "end",
+					marginInlineStart: "auto"
+				},
+				"&-dropdown": {
+					...resetIcon(),
+					"fontSize": fontSizeIcon,
+					"transform": "translateY(10%)",
+					"cursor": "pointer",
+					"&[disabled]": { cursor: "not-allowed" }
+				}
+			},
+			"&-body": {
+				"display": "flex",
+				"flex": "auto",
+				"flexDirection": "column",
+				"fontSize": token.fontSize,
+				"minHeight": 0,
+				"&-search-wrapper": {
+					position: "relative",
+					flex: "none",
+					padding: paddingSM
+				}
+			},
+			"&-content": {
+				"flex": "auto",
+				"margin": 0,
+				"padding": 0,
+				"overflow": "auto",
+				"listStyle": "none",
+				"borderRadius": `0 0 ${contentBorderRadius} ${contentBorderRadius}`,
+				"&-item": {
+					"display": "flex",
+					"alignItems": "center",
+					"minHeight": itemHeight,
+					"padding": `${unit(itemPaddingBlock)} ${unit(paddingSM)}`,
+					"transition": `all ${motionDurationSlow}`,
+					"> *:not(:last-child)": { marginInlineEnd: marginXS },
+					"> *": { flex: "none" },
+					"&-text": {
+						...textEllipsis,
+						flex: "auto"
+					},
+					"&-remove": {
+						...operationUnit(token),
+						"color": colorBorder,
+						"&:hover, &:focus": { color: colorTextSecondary }
+					},
+					[`&:not(${componentCls}-list-content-item-disabled)`]: {
+						"&:hover": {
+							backgroundColor: controlItemBgHover,
+							cursor: "pointer"
+						},
+						[`&${componentCls}-list-content-item-checked:hover`]: { backgroundColor: controlItemBgActiveHover }
+					},
+					"&-checked": { backgroundColor: controlItemBgActive },
+					"&-disabled": {
+						color: colorTextDisabled,
+						cursor: "not-allowed"
+					}
+				},
+				[`&-show-remove ${componentCls}-list-content-item:not(${componentCls}-list-content-item-disabled):hover`]: {
+					background: "transparent",
+					cursor: "default"
+				}
+			},
+			"&-pagination": {
+				padding: token.paddingXS,
+				textAlign: "end",
+				borderTop: `${unit(lineWidth)} ${lineType} ${colorSplit}`,
+				[`${antCls}-pagination-options`]: { paddingInlineEnd: token.paddingXS }
+			},
+			"&-body-not-found": {
+				flex: "none",
+				width: "100%",
+				margin: "auto 0",
+				color: colorTextDisabled,
+				textAlign: "center"
+			},
+			"&-footer": { borderTop: `${unit(lineWidth)} ${lineType} ${colorSplit}` },
+			"&-checkbox": { lineHeight: 1 }
+		}
+	};
+};
+const genTransferStyle = (token) => {
+	const { antCls, iconCls, componentCls, marginXS, marginXXS, fontSizeIcon, colorBgContainerDisabled } = token;
+	return { [componentCls]: {
+		...resetComponent(token),
+		position: "relative",
+		display: "flex",
+		alignItems: "stretch",
+		[`${componentCls}-disabled`]: { [`${componentCls}-section`]: { background: colorBgContainerDisabled } },
+		[`${componentCls}-section`]: genTransferListStyle(token),
+		[`${componentCls}-actions`]: {
+			display: "flex",
+			flex: "none",
+			flexDirection: "column",
+			alignSelf: "center",
+			margin: `0 ${unit(marginXS)}`,
+			verticalAlign: "middle",
+			gap: marginXXS,
+			[`${antCls}-btn ${iconCls}`]: { fontSize: fontSizeIcon }
+		}
+	} };
+};
+const genTransferRTLStyle = (token) => {
+	const { componentCls } = token;
+	return { [`${componentCls}-rtl`]: { direction: "rtl" } };
+};
+const prepareComponentToken = (token) => {
+	const { fontSize, lineHeight, controlHeight, controlHeightLG, lineWidth } = token;
+	const fontHeight = Math.round(fontSize * lineHeight);
+	return {
+		listWidth: 180,
+		listHeight: 200,
+		listWidthLG: 250,
+		headerHeight: controlHeightLG,
+		itemHeight: controlHeight,
+		itemPaddingBlock: (controlHeight - fontHeight) / 2,
+		transferHeaderVerticalPadding: Math.ceil((controlHeightLG - lineWidth - fontHeight) / 2)
+	};
+};
+var style_default = genStyleHooks("Transfer", (token) => {
+	const transferToken = mergeToken(token);
+	return [
+		genTransferStyle(transferToken),
+		genTransferCustomizeStyle(transferToken),
+		genTransferStatusStyle(transferToken),
+		genTransferRTLStyle(transferToken)
+	];
+}, prepareComponentToken);
+
+//#endregion
+export { style_default as default };

package/dist/tree/DirectoryTree.d.ts

@@ -0,0 +1,17 @@
+import { TreeEmits, TreeProps as TreeProps$1, TreeSlots } from "./Tree.js";
+import * as vue287 from "vue";
+import { SlotsType } from "vue";
+import { BasicDataNode, DataNode } from "@v-c/tree";
+
+//#region src/tree/DirectoryTree.d.ts
+type ExpandAction = false | 'click' | 'doubleClick';
+interface DirectoryTreeProps<T extends BasicDataNode = DataNode> extends TreeProps$1<T> {
+  expandAction?: ExpandAction;
+}
+interface DirectoryTreeEmits extends TreeEmits {}
+interface DirectoryTreeSlots extends TreeSlots {}
+declare const DirectoryTree: vue287.DefineSetupFnComponent<DirectoryTreeProps<DataNode>, DirectoryTreeEmits, SlotsType<DirectoryTreeSlots>, DirectoryTreeProps<DataNode> & {
+  [x: `on${Capitalize<string>}`]: ((...args: any[]) => any) | undefined;
+}, vue287.PublicProps>;
+//#endregion
+export { DirectoryTree, DirectoryTreeEmits, DirectoryTreeProps, DirectoryTreeSlots, ExpandAction };