@zboson/ui 0.0.0-stage → 0.0.2

package/dist/tour/interface.d.ts

@@ -0,0 +1,116 @@
+import { VueNode } from "../_util/type.js";
+import { SemanticClassNames, SemanticClassNamesType, SemanticStyles, SemanticStylesType } from "../_util/hooks/useMergeSemantic.js";
+import "../_util/hooks/index.js";
+import { ComponentBaseProps } from "../config-provider/context.js";
+import { ButtonProps } from "../button/Button.js";
+import "../button/index.js";
+import { CSSProperties, StyleValue } from "vue";
+import { TourProps as TourProps$1, TourStepProps as TourStepProps$1 } from "@v-c/tour";
+//#region src/tour/interface.d.ts
+type TourSemanticName = keyof TourSemanticClassNames & keyof TourSemanticStyles;
+interface TourSemanticClassNames {
+  root?: string;
+  cover?: string;
+  mask?: string;
+  section?: string;
+  footer?: string;
+  actions?: string;
+  indicator?: string;
+  indicators?: string;
+  header?: string;
+  title?: string;
+  description?: string;
+  close?: string;
+}
+interface TourSemanticStyles {
+  root?: CSSProperties;
+  cover?: CSSProperties;
+  mask?: CSSProperties;
+  section?: CSSProperties;
+  footer?: CSSProperties;
+  actions?: CSSProperties;
+  indicator?: CSSProperties;
+  indicators?: CSSProperties;
+  header?: CSSProperties;
+  title?: CSSProperties;
+  description?: CSSProperties;
+  close?: CSSProperties;
+}
+type TourClassNamesType = SemanticClassNamesType<TourProps, TourSemanticClassNames>;
+type TourStylesType = SemanticStylesType<TourProps, TourSemanticStyles>;
+interface TourProps extends ComponentBaseProps, Omit<TourProps$1, 'classNames' | 'styles' | 'renderPanel' | 'rootClassName' | 'onClose' | 'onFinish' | 'onChange' | 'onPopupAlign' | 'className'> {
+  steps?: TourStepProps[];
+  prefixCls?: string;
+  current?: number;
+  indicatorsRender?: (current: number, total: number) => any;
+  actionsRender?: (originNode: any, info: {
+    current: number;
+    total: number;
+  }) => any;
+  type?: 'default' | 'primary';
+  classes?: TourClassNamesType;
+  styles?: TourStylesType;
+}
+interface TourEmits {
+  'change': (current: number) => void;
+  'close': (current: number) => void;
+  'finish': () => void;
+  'update:open': (open: boolean) => void;
+  'update:current': (current: number) => void;
+  'popupAlign': (el: HTMLElement, info: any) => void;
+}
+interface TourSlots {
+  actionsRender: (originNode: any, info: {
+    current: number;
+    total: number;
+  }) => any;
+  indicatorsRender: (current: number, total: number) => any;
+  nextButton: (params: {
+    current: number;
+    isFirst: boolean;
+    isLast: boolean;
+  }) => any;
+  prevButton: (params: {
+    current: number;
+    isFirst: boolean;
+    isLast: boolean;
+  }) => any;
+  coverRender: (params: {
+    step: TourStepProps;
+    index: number;
+  }) => any;
+  titleRender: (params: {
+    step: TourStepProps;
+    index: number;
+  }) => any;
+  descriptionRender: (params: {
+    step: TourStepProps;
+    index: number;
+  }) => any;
+}
+interface TourStepProps extends Omit<TourStepProps$1, 'className'> {
+  cover?: VueNode;
+  nextButtonProps?: {
+    children?: VueNode;
+    onClick?: ButtonProps['onClick'];
+    class?: string;
+    style?: StyleValue;
+  };
+  prevButtonProps?: {
+    children?: VueNode;
+    onClick?: ButtonProps['onClick'];
+    class?: string;
+    style?: StyleValue;
+  };
+  type?: 'default' | 'primary';
+  classes?: SemanticClassNames<TourSemanticName>;
+  styles?: SemanticStyles<TourSemanticName>;
+  class?: string;
+}
+interface TourLocale {
+  Next: string;
+  Previous: string;
+  Finish: string;
+}
+//#endregion
+export { TourClassNamesType, TourEmits, TourLocale, TourProps, TourSemanticClassNames, TourSemanticName, TourSemanticStyles, TourSlots, TourStepProps, TourStylesType };

package/dist/tour/interface.js

@@ -0,0 +1 @@
+export {};

package/dist/tour/panelRender.d.ts

@@ -0,0 +1,26 @@
+import { TourProps, TourStepProps } from "./interface.js";
+//#region src/tour/panelRender.d.ts
+interface TourPanelProps {
+  stepProps: Omit<TourStepProps, 'closable' | 'classNames'> & {
+    closable?: Exclude<TourStepProps['closable'], boolean>;
+  };
+  current: number;
+  type?: TourProps['type'];
+  indicatorsRender?: TourProps['indicatorsRender'];
+  classes?: TourProps['classes'];
+  styles?: TourProps['styles'];
+  actionsRender?: TourProps['actionsRender'];
+  prevButtonProps?: (params: {
+    current: number;
+    isFirst: boolean;
+    isLast: boolean;
+  }) => any;
+  nextButtonProps?: (params: {
+    current: number;
+    isFirst: boolean;
+    isLast: boolean;
+  }) => any;
+}
+declare const TourPanel: import("vue").DefineSetupFnComponent<TourPanelProps, {}, {}, TourPanelProps & {}, import("vue").PublicProps>;
+//#endregion
+export { TourPanel as default };

package/dist/tour/panelRender.js

@@ -0,0 +1,164 @@
+import { getSlotPropsFnRun } from "../_util/tools.js";
+import localeValues from "../locale/en_US.js";
+import useLocale from "../locale/useLocale.js";
+import button_default from "../button/index.js";
+import isNonNullable from "../_util/isNonNullable.js";
+import { Fragment, createVNode, defineComponent, mergeProps } from "vue";
+import { clsx } from "@v-c/util";
+import { filterEmpty } from "@v-c/util/dist/props-util";
+import { CloseOutlined } from "@zboson/icons";
+import pickAttrs from "@v-c/util/dist/pickAttrs";
+//#region src/tour/panelRender.tsx
+const TourPanel = /* @__PURE__ */ defineComponent((props) => {
+	const [contextLocaleGlobal] = useLocale("global", localeValues.global);
+	const [contextLocaleTour] = useLocale("Tour", localeValues.Tour);
+	return () => {
+		const { stepProps, current, type, indicatorsRender, actionsRender } = props;
+		const { prefixCls, total = 1, title, onClose, onPrev, onNext, onFinish, cover, description, nextButtonProps, prevButtonProps, type: stepType, closable, classes = {}, styles = {} } = stepProps;
+		const ariaProps = pickAttrs(closable ?? {}, true);
+		const mergedType = stepType ?? type;
+		const resolvedCloseIcon = getSlotPropsFnRun({}, { closeIcon: closable?.closeIcon }, "closeIcon");
+		const mergedCloseIcon = createVNode("button", mergeProps({
+			"type": "button",
+			"onClick": onClose,
+			"class": clsx(`${prefixCls}-close`, classes.close),
+			"style": styles.close,
+			"aria-label": contextLocaleGlobal?.value.close
+		}, ariaProps), [resolvedCloseIcon || createVNode(CloseOutlined, { "class": `${prefixCls}-close-icon` }, null)]);
+		const isLastStep = current === total - 1;
+		const prevBtnClick = (e) => {
+			onPrev?.();
+			prevButtonProps?.onClick?.(e);
+		};
+		const nextBtnClick = (e) => {
+			if (isLastStep) onFinish?.();
+			else onNext?.();
+			nextButtonProps?.onClick?.(e);
+		};
+		const _title = getSlotPropsFnRun({}, { title }, "title");
+		const headerNode = isNonNullable(_title) ? createVNode("div", {
+			"class": clsx(`${prefixCls}-header`, classes.header),
+			"style": styles.header
+		}, [createVNode("div", {
+			"class": clsx(`${prefixCls}-title`, classes.title),
+			"style": styles.title
+		}, [_title])]) : null;
+		const _description = getSlotPropsFnRun({}, { description }, "description");
+		const descriptionNode = isNonNullable(_description) ? createVNode("div", {
+			"class": clsx(`${prefixCls}-description`, classes.description),
+			"style": styles.description
+		}, [_description]) : null;
+		const _cover = getSlotPropsFnRun({}, { cover }, "cover");
+		const coverNode = isNonNullable(_cover) ? createVNode("div", {
+			"class": clsx(`${prefixCls}-cover`, classes.cover),
+			"style": styles.cover
+		}, [_cover]) : null;
+		let mergedIndicatorNode;
+		if (indicatorsRender) mergedIndicatorNode = indicatorsRender(current, total);
+		else mergedIndicatorNode = [...Array.from({ length: total }).keys()].map((stepItem, index) => createVNode("span", {
+			"key": stepItem,
+			"class": clsx(index === current && `${prefixCls}-indicator-active`, `${prefixCls}-indicator`, classes.indicator),
+			"style": styles.indicator
+		}, null));
+		const mainBtnType = mergedType === "primary" ? "default" : "primary";
+		const secondaryBtnProps = {
+			type: "default",
+			ghost: mergedType === "primary"
+		};
+		const prevButtonPropsChild = getSlotPropsFnRun({}, prevButtonProps ?? {}, "children");
+		let _prevBtn = props?.prevButtonProps?.({
+			current,
+			isFirst: current === 0,
+			isLast: isLastStep
+		});
+		_prevBtn = Array.isArray(_prevBtn) ? _prevBtn : [_prevBtn];
+		_prevBtn = filterEmpty(_prevBtn).filter(Boolean);
+		if (!_prevBtn.length) _prevBtn = prevButtonPropsChild;
+		const nextButtonPropsChild = getSlotPropsFnRun({}, nextButtonProps ?? {}, "children");
+		let _nextBtn = props?.nextButtonProps?.({
+			current,
+			isFirst: current === 0,
+			isLast: isLastStep
+		});
+		_nextBtn = Array.isArray(_nextBtn) ? _nextBtn : [_nextBtn];
+		_nextBtn = filterEmpty(_nextBtn).filter(Boolean);
+		if (!_nextBtn.length) _nextBtn = nextButtonPropsChild;
+		const { children: _prevChildren, onClick: _prevOnClick, ...prevBtnRest } = prevButtonProps ?? {};
+		const { children: _nextChildren, onClick: _nextOnClick, ...nextBtnRest } = nextButtonProps ?? {};
+		const defaultActionsNode = createVNode(Fragment, null, [current !== 0 ? createVNode(button_default, mergeProps({ "size": "small" }, secondaryBtnProps, prevBtnRest, {
+			"onClick": prevBtnClick,
+			"class": clsx(`${prefixCls}-prev-btn`, prevButtonProps?.class)
+		}), { default: () => [_prevBtn ?? contextLocaleTour?.value?.Previous] }) : null, createVNode(button_default, mergeProps({
+			"size": "small",
+			"type": mainBtnType
+		}, nextBtnRest, {
+			"onClick": nextBtnClick,
+			"class": clsx(`${prefixCls}-next-btn`, nextButtonProps?.class)
+		}), { default: () => [_nextBtn ?? (isLastStep ? contextLocaleTour?.value?.Finish : contextLocaleTour?.value?.Next)] })]);
+		return createVNode("div", { "class": `${prefixCls}-panel` }, [createVNode("div", {
+			"class": clsx(`${prefixCls}-section`, classes.section),
+			"style": styles.section
+		}, [
+			closable && mergedCloseIcon,
+			coverNode,
+			headerNode,
+			descriptionNode,
+			createVNode("div", {
+				"class": clsx(`${prefixCls}-footer`, classes.footer),
+				"style": styles.footer
+			}, [total > 1 && createVNode("div", {
+				"class": clsx(`${prefixCls}-indicators`, classes.indicators),
+				"style": styles.indicators
+			}, [mergedIndicatorNode]), createVNode("div", {
+				"class": clsx(`${prefixCls}-actions`, classes.actions),
+				"style": styles.actions
+			}, [actionsRender ? actionsRender(defaultActionsNode, {
+				current,
+				total
+			}) : defaultActionsNode])])
+		])]);
+	};
+}, {
+	props: {
+		stepProps: {
+			type: Object,
+			required: true
+		},
+		current: {
+			type: Number,
+			required: true
+		},
+		type: {
+			type: String,
+			required: false
+		},
+		indicatorsRender: {
+			type: Function,
+			required: false
+		},
+		classes: {
+			type: [Object, Function],
+			required: false
+		},
+		styles: {
+			type: [Object, Function],
+			required: false
+		},
+		actionsRender: {
+			type: Function,
+			required: false
+		},
+		prevButtonProps: {
+			type: Function,
+			required: false
+		},
+		nextButtonProps: {
+			type: Function,
+			required: false
+		}
+	},
+	name: "TourPanel",
+	inheritAttrs: false
+});
+//#endregion
+export { TourPanel as default };

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

@@ -0,0 +1,35 @@
+import { SeedToken } from "../../theme/interface/seeds.js";
+import { AliasToken } from "../../theme/interface/alias.js";
+import { ArrowToken } from "../../style/roundedArrow.js";
+import { ArrowOffsetToken } from "../../style/placementArrow.js";
+import { ComponentTokenMap } from "../../theme/interface/components.js";
+import { GetDefaultToken } from "../../theme/interface/cssinjs-utils.js";
+import "../../theme/interface/index.js";
+import "../../theme/internal.js";
+//#region src/tour/style/index.d.ts
+interface ComponentToken extends ArrowOffsetToken, ArrowToken {
+  /**
+   * @desc 弹层 z-index
+   * @descEN Tour popup z-index
+   */
+  zIndexPopup: number;
+  /**
+   * @desc 关闭按钮尺寸
+   * @descEN Close button size
+   */
+  closeBtnSize: number;
+  /**
+   * @desc Primary 模式上一步按钮背景色
+   * @descEN Background color of previous button in primary type
+   */
+  primaryPrevBtnBg: string;
+  /**
+   * @desc Primary 模式下一步按钮悬浮背景色
+   * @descEN Hover background color of next button in primary type
+   */
+  primaryNextBtnHoverBg: string;
+}
+declare const prepareComponentToken: GetDefaultToken<'Tour'>;
+declare const _default: (prefixCls: import("vue").Ref<string>, rootCls?: import("vue").Ref<string | undefined>, tokenResult?: import("@zboson/cssinjs").UseTokenReturn<ComponentTokenMap, AliasToken, SeedToken> | undefined) => readonly [import("vue").Ref<string, string>, import("vue").ComputedRef<string | undefined>];
+//#endregion
+export { ComponentToken, _default as default, prepareComponentToken };

package/dist/tour/style/index.js

@@ -0,0 +1,161 @@
+import { genFocusStyle, resetComponent } from "../../style/index.js";
+import { genCssVar, genStyleHooks } from "../../theme/util/genStyleUtils.js";
+import { mergeToken } from "../../theme/internal.js";
+import { getArrowToken } from "../../style/roundedArrow.js";
+import getArrowStyle, { getArrowOffsetToken } from "../../style/placementArrow.js";
+import { unit } from "@zboson/cssinjs";
+import { FastColor } from "@ant-design/fast-color";
+//#region src/tour/style/index.ts
+const genBaseStyle = (token) => {
+	const { componentCls, padding, paddingXS, borderRadius, borderRadiusXS, colorPrimary, colorFill, indicatorHeight, indicatorWidth, boxShadowTertiary, zIndexPopup, colorBgElevated, fontWeightStrong, marginXS, colorTextLightSolid, tourBorderRadius, colorWhite, primaryNextBtnHoverBg, closeBtnSize, motionDurationSlow, antCls, primaryPrevBtnBg, motionDurationMid } = token;
+	const [varName, varRef] = genCssVar(antCls, "tooltip");
+	return [{
+		[componentCls]: {
+			...resetComponent(token),
+			position: "absolute",
+			zIndex: zIndexPopup,
+			maxWidth: "fit-content",
+			visibility: "visible",
+			width: 520,
+			[varName("arrow-background-color")]: colorBgElevated,
+			"&-pure": {
+				maxWidth: "100%",
+				position: "relative"
+			},
+			[`&${componentCls}-hidden`]: { display: "none" },
+			[`${componentCls}-panel`]: { position: "relative" },
+			[`${componentCls}-section`]: {
+				textAlign: "start",
+				textDecoration: "none",
+				borderRadius: tourBorderRadius,
+				boxShadow: boxShadowTertiary,
+				position: "relative",
+				backgroundColor: colorBgElevated,
+				border: "none",
+				backgroundClip: "padding-box",
+				[`${componentCls}-close`]: {
+					position: "absolute",
+					top: padding,
+					insetInlineEnd: padding,
+					color: token.colorIcon,
+					background: "none",
+					border: "none",
+					width: closeBtnSize,
+					height: closeBtnSize,
+					borderRadius: token.borderRadiusSM,
+					transition: ["color", "background-color"].map((prop) => `${prop} ${motionDurationMid}`).join(", "),
+					display: "flex",
+					alignItems: "center",
+					justifyContent: "center",
+					cursor: "pointer",
+					"&:hover": {
+						color: token.colorIconHover,
+						backgroundColor: token.colorBgTextHover
+					},
+					"&:active": { backgroundColor: token.colorBgTextActive },
+					...genFocusStyle(token)
+				},
+				[`${componentCls}-cover`]: {
+					textAlign: "center",
+					padding: `${unit(token.calc(padding).add(closeBtnSize).add(paddingXS).equal())} ${unit(padding)} 0`,
+					img: { width: "100%" }
+				},
+				[`${componentCls}-header`]: {
+					padding: `${unit(padding)} ${unit(padding)} ${unit(paddingXS)}`,
+					width: `calc(100% - ${unit(closeBtnSize)})`,
+					wordBreak: "break-word",
+					[`${componentCls}-title`]: { fontWeight: fontWeightStrong }
+				},
+				[`${componentCls}-description`]: {
+					padding: `0 ${unit(padding)}`,
+					wordWrap: "break-word"
+				},
+				[`${componentCls}-footer`]: {
+					padding: `${unit(paddingXS)} ${unit(padding)} ${unit(padding)}`,
+					textAlign: "end",
+					borderRadius: `0 0 ${unit(borderRadiusXS)} ${unit(borderRadiusXS)}`,
+					display: "flex",
+					[`${componentCls}-indicators`]: {
+						display: "inline-block",
+						[`${componentCls}-indicator`]: {
+							width: indicatorWidth,
+							height: indicatorHeight,
+							display: "inline-block",
+							borderRadius: "50%",
+							background: colorFill,
+							"&:not(:last-child)": { marginInlineEnd: indicatorHeight },
+							"&-active": { background: colorPrimary }
+						}
+					},
+					[`${componentCls}-actions`]: {
+						marginInlineStart: "auto",
+						[`${antCls}-btn`]: { marginInlineStart: marginXS }
+					}
+				}
+			},
+			[`${componentCls}-primary, &${componentCls}-primary`]: {
+				[varName("arrow-background-color")]: colorPrimary,
+				[`${componentCls}-section`]: {
+					color: colorTextLightSolid,
+					textAlign: "start",
+					textDecoration: "none",
+					backgroundColor: colorPrimary,
+					borderRadius,
+					boxShadow: boxShadowTertiary,
+					[`${componentCls}-close`]: { color: colorTextLightSolid },
+					[`${componentCls}-indicators`]: { [`${componentCls}-indicator`]: {
+						background: primaryPrevBtnBg,
+						"&-active": { background: colorTextLightSolid }
+					} },
+					[`${componentCls}-prev-btn`]: {
+						color: colorTextLightSolid,
+						borderColor: primaryPrevBtnBg,
+						backgroundColor: colorPrimary,
+						"&:hover": {
+							color: colorTextLightSolid,
+							backgroundColor: primaryPrevBtnBg,
+							borderColor: "transparent"
+						}
+					},
+					[`${componentCls}-next-btn`]: {
+						color: colorPrimary,
+						borderColor: "transparent",
+						background: colorWhite,
+						"&:hover": { background: primaryNextBtnHoverBg }
+					}
+				}
+			}
+		},
+		[`${componentCls}-mask`]: { [`${componentCls}-placeholder-animated`]: { transition: `all ${motionDurationSlow}` } },
+		[[
+			"&-placement-left",
+			"&-placement-leftTop",
+			"&-placement-leftBottom",
+			"&-placement-right",
+			"&-placement-rightTop",
+			"&-placement-rightBottom"
+		].join(",")]: { [`${componentCls}-section`]: { borderRadius: token.min(tourBorderRadius, 8) } }
+	}, getArrowStyle(token, varRef("arrow-background-color"))];
+};
+const prepareComponentToken = (token) => ({
+	zIndexPopup: token.zIndexPopupBase + 70,
+	closeBtnSize: token.fontSize * token.lineHeight,
+	primaryPrevBtnBg: new FastColor(token.colorTextLightSolid).setA(.15).toRgbString(),
+	primaryNextBtnHoverBg: new FastColor(token.colorBgTextHover).onBackground(token.colorWhite).toRgbString(),
+	...getArrowOffsetToken({
+		contentRadius: token.borderRadiusLG,
+		limitVerticalRadius: true
+	}),
+	...getArrowToken(token)
+});
+var style_default = genStyleHooks("Tour", (token) => {
+	const { borderRadiusLG } = token;
+	const tourToken = mergeToken(token, {
+		indicatorWidth: 6,
+		indicatorHeight: 6,
+		tourBorderRadius: borderRadiusLG
+	});
+	return genBaseStyle(tourToken);
+}, prepareComponentToken);
+//#endregion
+export { style_default as default, prepareComponentToken };

package/dist/transfer/Actions.d.ts

@@ -0,0 +1,19 @@
+import { VueNode } from "../_util/type.js";
+import { DirectionType } from "../config-provider/context.js";
+import { CSSProperties } from "vue";
+//#region src/transfer/Actions.d.ts
+interface TransferOperationProps {
+  class?: string;
+  actions: VueNode[];
+  moveToLeft?: (event: MouseEvent) => void;
+  moveToRight?: (event: MouseEvent) => void;
+  leftActive?: boolean;
+  rightActive?: boolean;
+  style?: CSSProperties;
+  disabled?: boolean;
+  direction?: DirectionType;
+  oneWay?: boolean;
+}
+declare const Actions: import("vue").DefineSetupFnComponent<TransferOperationProps, {}, {}, TransferOperationProps & {}, import("vue").PublicProps>;
+//#endregion
+export { TransferOperationProps, Actions as default };

package/dist/transfer/Actions.js

@@ -0,0 +1,156 @@
+import button_default from "../button/index.js";
+import { cloneVNode, createVNode, defineComponent, isVNode, mergeProps } from "vue";
+import { LeftOutlined, RightOutlined } from "@zboson/icons";
+//#region src/transfer/Actions.tsx
+function _isSlot(s) {
+	return typeof s === "function" || Object.prototype.toString.call(s) === "[object Object]" && !isVNode(s);
+}
+function getArrowIcon(type, direction) {
+	const isRight = type === "right";
+	if (direction !== "rtl") return isRight ? createVNode(RightOutlined, null, null) : createVNode(LeftOutlined, null, null);
+	return isRight ? createVNode(LeftOutlined, null, null) : createVNode(RightOutlined, null, null);
+}
+const Action = /* @__PURE__ */ defineComponent((props) => {
+	return () => {
+		const isRight = props.type === "right";
+		const button = isRight ? props.actions[0] : props.actions[1];
+		const moveHandler = isRight ? props.moveToRight : props.moveToLeft;
+		const active = isRight ? props.rightActive : props.leftActive;
+		const icon = getArrowIcon(props.type, props.direction);
+		if (isVNode(button)) {
+			const nodeProps = button.props || {};
+			const mergedDisabled = nodeProps.disabled || props.disabled || !active;
+			const onClick = (event) => {
+				if (mergedDisabled) {
+					event.preventDefault();
+					return;
+				}
+				nodeProps?.onClick?.(event);
+				moveHandler?.(event);
+			};
+			const cloned = cloneVNode(button, {
+				disabled: mergedDisabled,
+				onClick
+			});
+			if (cloned.props) cloned.props.onClick = onClick;
+			return cloned;
+		}
+		return createVNode(button_default, {
+			"type": "primary",
+			"size": "small",
+			"disabled": props.disabled || !active,
+			"onClick": (event) => moveHandler?.(event),
+			"icon": icon
+		}, _isSlot(button) ? button : { default: () => [button] });
+	};
+}, {
+	props: {
+		type: {
+			type: String,
+			required: true
+		},
+		actions: {
+			type: Array,
+			required: true
+		},
+		moveToLeft: {
+			type: Function,
+			required: false
+		},
+		moveToRight: {
+			type: Function,
+			required: false
+		},
+		leftActive: {
+			type: Boolean,
+			required: false,
+			default: void 0
+		},
+		rightActive: {
+			type: Boolean,
+			required: false,
+			default: void 0
+		},
+		direction: {
+			type: [String, null],
+			required: false
+		},
+		disabled: {
+			type: Boolean,
+			required: false,
+			default: void 0
+		}
+	},
+	name: "ATransferAction",
+	inheritAttrs: false
+});
+const Actions = /* @__PURE__ */ defineComponent((props) => {
+	return () => {
+		const { class: className, style, oneWay, actions, ...restProps } = props;
+		return createVNode("div", {
+			"class": className,
+			"style": style
+		}, [
+			createVNode(Action, mergeProps({
+				"type": "right",
+				"actions": actions
+			}, restProps), null),
+			!oneWay && createVNode(Action, mergeProps({
+				"type": "left",
+				"actions": actions
+			}, restProps), null),
+			actions.slice(oneWay ? 1 : 2).map((node) => node)
+		]);
+	};
+}, {
+	props: {
+		class: {
+			type: String,
+			required: false
+		},
+		actions: {
+			type: Array,
+			required: true
+		},
+		moveToLeft: {
+			type: Function,
+			required: false
+		},
+		moveToRight: {
+			type: Function,
+			required: false
+		},
+		leftActive: {
+			type: Boolean,
+			required: false,
+			default: void 0
+		},
+		rightActive: {
+			type: Boolean,
+			required: false,
+			default: void 0
+		},
+		style: {
+			type: Object,
+			required: false
+		},
+		disabled: {
+			type: Boolean,
+			required: false,
+			default: void 0
+		},
+		direction: {
+			type: [String, null],
+			required: false
+		},
+		oneWay: {
+			type: Boolean,
+			required: false,
+			default: void 0
+		}
+	},
+	name: "ATransferOperation",
+	inheritAttrs: false
+});
+//#endregion
+export { Actions as default };

package/dist/transfer/ListBody.d.ts

@@ -0,0 +1,9 @@
+import { KeyWiseTransferItem, RenderedItem, TransferListBodyProps } from "./interface.js";
+//#region src/transfer/ListBody.d.ts
+type ExistPagination = Exclude<TransferListBodyProps<KeyWiseTransferItem>['pagination'], boolean>;
+interface ListBodyRef<RecordType extends KeyWiseTransferItem> {
+  items?: RenderedItem<RecordType>[];
+}
+declare const TransferListBody: import("vue").DefineSetupFnComponent<TransferListBodyProps<KeyWiseTransferItem>, {}, {}, TransferListBodyProps<KeyWiseTransferItem> & {}, import("vue").PublicProps>;
+//#endregion
+export { ExistPagination, ListBodyRef, TransferListBody as default };