@antdv-next/mobile 0.0.0-stage → 0.1.0

package/dist/masonry/style/index.css

@@ -0,0 +1,63 @@
+.am-masonry {
+  /* component tokens */
+  --am-masonry-columns: 2;
+  --am-masonry-gutter: var(--am-margin-xs);
+  --am-masonry-gutter-x: var(--am-masonry-gutter);
+  --am-masonry-gutter-y: var(--am-masonry-gutter-x);
+  --am-masonry-motion-duration: var(--am-motion-duration-slow);
+  --am-masonry-motion-ease: var(--am-motion-ease-out);
+  /* 1 in ltr, -1 in rtl: sign of the horizontal offset */
+  --am-masonry-direction: 1;
+
+  position: relative;
+  display: flex;
+  flex-flow: column wrap;
+  /* never laid out by flex (items are absolute); kept so the resolved px gutters can be read back */
+  gap: var(--am-masonry-gutter-y) var(--am-masonry-gutter-x);
+  box-sizing: border-box;
+  color: var(--am-color-text);
+  font-size: var(--am-font-size);
+  font-family: var(--am-font-family);
+  line-height: var(--am-line-height);
+}
+
+[dir='rtl'] .am-masonry {
+  --am-masonry-direction: -1;
+}
+
+.am-masonry > .am-masonry-item {
+  --am-masonry-item-column: 0;
+  --am-masonry-item-top: 0px;
+
+  position: absolute;
+  top: 0;
+  inset-inline-start: 0;
+  box-sizing: border-box;
+  width: calc((100% - (var(--am-masonry-columns) - 1) * var(--am-masonry-gutter-x)) / var(--am-masonry-columns));
+  /* a percentage inside translate is the item's own width: one step = width + gutter */
+  transform: translate3d(
+    calc(var(--am-masonry-item-column) * (100% + var(--am-masonry-gutter-x)) * var(--am-masonry-direction)),
+    var(--am-masonry-item-top),
+    0
+  );
+  transition: opacity var(--am-masonry-motion-duration) var(--am-masonry-motion-ease);
+}
+
+/* not placed yet (height unknown) */
+.am-masonry > .am-masonry-item-pending {
+  opacity: 0;
+  pointer-events: none;
+}
+
+/* placed for at least one frame: later moves are animated */
+.am-masonry > .am-masonry-item-motion {
+  transition:
+    opacity var(--am-masonry-motion-duration) var(--am-masonry-motion-ease),
+    transform var(--am-masonry-motion-duration) var(--am-masonry-motion-ease);
+}
+
+@media (prefers-reduced-motion: reduce) {
+  .am-masonry > .am-masonry-item {
+    transition: none;
+  }
+}

package/dist/message/Message.js

@@ -0,0 +1,4 @@
+import Message_vue_vue_type_script_setup_true_lang_default from "./Message.vue_vue_type_script_setup_true_lang.js";
+// src/message/Message.vue
+var Message_default = Message_vue_vue_type_script_setup_true_lang_default;
+export { Message_default as default };

package/dist/message/Message.vue.d.ts

@@ -0,0 +1,10 @@
+import type { MessageHolderProps } from './interface';
+import '../style';
+import './style/index.css';
+declare const __VLS_export: import("vue").DefineComponent<MessageHolderProps, {
+    nativeElement: import("vue").Ref<HTMLElement | undefined, HTMLElement | undefined>;
+}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<MessageHolderProps> & Readonly<{}>, {
+    notices: import("./interface").MessageNotice[];
+}, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>;
+declare const _default: typeof __VLS_export;
+export default _default;

package/dist/message/Message.vue_vue_type_script_setup_true_lang.js

@@ -0,0 +1,84 @@
+import Portal_default from "../_base/Portal.js";
+import Spinner_default from "../_base/Spinner.js";
+import { addUnit, isRenderable } from "../_util/index.js";
+import RenderNode_default from "../_util/RenderNode.js";
+import "../style/index2.js";
+import './style/index.css';/* empty css            */
+import { Fragment, TransitionGroup, computed, createBlock, createCommentVNode, createElementBlock, createElementVNode, createVNode, defineComponent, mergeProps, normalizeClass, normalizeStyle, onMounted, openBlock, ref, renderList, resolveDynamicComponent, unref, withCtx } from "vue";
+import { CheckCircleFilled, CloseCircleFilled, ExclamationCircleFilled, InfoCircleFilled } from "@antdv-next/icons";
+// src/message/Message.vue?vue&type=script&setup=true&lang.ts
+var _hoisted_1 = ["dir"];
+var _hoisted_2 = ["role", "onClick"];
+var _hoisted_3 = {
+	key: 0,
+	class: "am-message-icon"
+};
+var _hoisted_4 = { class: "am-message-text" };
+var Message_vue_vue_type_script_setup_true_lang_default = /*@__PURE__*/ defineComponent({
+	name: "AmMessage",
+	inheritAttrs: false,
+	__name: "Message",
+	props: {
+		notices: { default: () => [] },
+		top: {},
+		zIndex: {},
+		getContainer: {}
+	},
+	setup(__props, { expose: __expose }) {
+		const props = __props;
+		const rootRef = ref();
+		/** the holder is client-only: nothing is rendered on the server */
+		const mounted = ref(false);
+		onMounted(() => {
+			mounted.value = true;
+		});
+		const icons = {
+			info: InfoCircleFilled,
+			success: CheckCircleFilled,
+			error: CloseCircleFilled,
+			warning: ExclamationCircleFilled,
+			loading: Spinner_default
+		};
+		const rootStyle = computed(() => {
+			const top = addUnit(props.top);
+			return [{ zIndex: props.zIndex }, top ? { "--am-message-top": top } : void 0];
+		});
+		__expose({ nativeElement: rootRef });
+		return (_ctx, _cache) => {
+			return mounted.value ? (openBlock(), createBlock(unref(Portal_default), {
+				key: 0,
+				"get-container": __props.getContainer
+			}, {
+				default: withCtx(({ theme }) => [createElementVNode("div", mergeProps({
+					ref_key: "rootRef",
+					ref: rootRef
+				}, _ctx.$attrs, {
+					class: ["am-message", theme.class],
+					style: [theme.style, rootStyle.value],
+					dir: theme.dir
+				}), [createVNode(TransitionGroup, {
+					name: "am-message-motion",
+					appear: ""
+				}, {
+					default: withCtx(() => [(openBlock(true), createElementBlock(Fragment, null, renderList(__props.notices, (notice) => {
+						return openBlock(), createElementBlock("div", {
+							key: notice.id,
+							class: normalizeClass(["am-message-notice", [notice.type ? `am-message-notice-${notice.type}` : void 0, notice.class]]),
+							style: normalizeStyle(notice.style)
+						}, [createElementVNode("div", {
+							class: "am-message-notice-content",
+							role: notice.type === "error" ? "alert" : "status",
+							onClick: ($event) => notice.onClick?.($event)
+						}, [unref(isRenderable)(notice.icon) || notice.type ? (openBlock(), createElementBlock("span", _hoisted_3, [unref(isRenderable)(notice.icon) ? (openBlock(), createBlock(unref(RenderNode_default), {
+							key: 0,
+							node: notice.icon
+						}, null, 8, ["node"])) : notice.type ? (openBlock(), createBlock(resolveDynamicComponent(icons[notice.type]), { key: 1 })) : createCommentVNode("", true)])) : createCommentVNode("", true), createElementVNode("span", _hoisted_4, [createVNode(unref(RenderNode_default), { node: notice.content }, null, 8, ["node"])])], 8, _hoisted_2)], 6);
+					}), 128))]),
+					_: 1
+				})], 16, _hoisted_1)]),
+				_: 1
+			}, 8, ["get-container"])) : createCommentVNode("", true);
+		};
+	}
+});
+export { Message_vue_vue_type_script_setup_true_lang_default as default };

package/dist/message/api.d.ts

@@ -0,0 +1,3 @@
+import type { MessageApi } from './interface';
+declare const message: MessageApi;
+export default message;

package/dist/message/api.js

@@ -0,0 +1,157 @@
+import { inBrowser } from "../_util/index.js";
+import { nextZIndex } from "../_util/hooks/useZIndex.js";
+import { mountComponent } from "../_util/mount.js";
+import Message_default from "./Message.js";
+import { defineComponent, h, isVNode, shallowReactive, shallowRef } from "vue";
+// src/message/api.ts
+var DEFAULT_DURATION = 3;
+var seed = 0;
+function isArgsProps(content) {
+	return typeof content === "object" && content !== null && !Array.isArray(content) && !isVNode(content) && "content" in content;
+}
+function createManager(config, ensureHolder) {
+	const notices = shallowRef([]);
+	const zIndex = shallowRef();
+	const records = /* @__PURE__ */ new Map();
+	const holderProps = () => ({
+		notices: notices.value,
+		zIndex: zIndex.value,
+		top: config.top,
+		getContainer: config.getContainer
+	});
+	function remove(key, callClose) {
+		const record = records.get(key);
+		if (!record) return;
+		clearTimeout(record.timer);
+		records.delete(key);
+		notices.value = notices.value.filter((n) => n !== record.notice);
+		if (callClose) record.onClose?.();
+		record.resolvers.forEach((resolve) => resolve(true));
+	}
+	function open(args) {
+		const key = args.key ?? `am-message-${++seed}`;
+		let resolve;
+		const promise = new Promise((r) => {
+			resolve = r;
+		});
+		const close = () => remove(key, true);
+		const result = close;
+		result.then = (onFulfilled, onRejected) => promise.then(onFulfilled, onRejected);
+		if (!inBrowser) {
+			resolve(true);
+			return result;
+		}
+		ensureHolder(holderProps);
+		const prev = records.get(key);
+		clearTimeout(prev?.timer);
+		const notice = {
+			id: prev?.notice.id ?? ++seed,
+			key,
+			content: args.content,
+			type: args.type,
+			icon: args.icon,
+			class: args.class,
+			style: args.style,
+			onClick: args.onClick
+		};
+		const record = {
+			notice,
+			onClose: args.onClose,
+			resolvers: [...prev?.resolvers ?? [], resolve]
+		};
+		records.set(key, record);
+		if (prev) notices.value = notices.value.map((n) => n === prev.notice ? notice : n);
+		else {
+			zIndex.value = nextZIndex();
+			notices.value = [...notices.value, notice];
+			const { maxCount } = config;
+			if (typeof maxCount === "number" && maxCount > 0) while (notices.value.length > maxCount) remove(notices.value[0].key, true);
+		}
+		const duration = args.duration ?? config.duration ?? DEFAULT_DURATION;
+		if (duration > 0) record.timer = setTimeout(close, duration * 1e3);
+		return result;
+	}
+	function destroy(key) {
+		if (key !== void 0) {
+			remove(key, false);
+			return;
+		}
+		Array.from(records.keys()).forEach((k) => remove(k, false));
+	}
+	const typeOpen = (type) => (content, duration, onClose) => {
+		let args = isArgsProps(content) ? content : { content };
+		let mergedDuration;
+		let mergedOnClose = onClose;
+		if (typeof duration === "function") mergedOnClose = duration;
+		else mergedDuration = duration;
+		args = {
+			...args,
+			type
+		};
+		if (mergedDuration !== void 0 && args.duration === void 0) args.duration = mergedDuration;
+		if (mergedOnClose && !args.onClose) args.onClose = mergedOnClose;
+		return open(args);
+	};
+	return {
+		open,
+		destroy,
+		info: typeOpen("info"),
+		success: typeOpen("success"),
+		error: typeOpen("error"),
+		warning: typeOpen("warning"),
+		loading: typeOpen("loading"),
+		holderProps
+	};
+}
+var globalOptions = shallowReactive({});
+var holder;
+function ensureStaticHolder(holderProps) {
+	if (holder) {
+		const el = holder.instance?.nativeElement;
+		if (!el || el.isConnected) return;
+		holder.unmount();
+		holder = void 0;
+	}
+	const current = {
+		unmount: () => {},
+		instance: void 0
+	};
+	holder = current;
+	current.unmount = mountComponent(() => h(Message_default, {
+		...holderProps(),
+		ref: (instance) => {
+			if (instance) current.instance = instance;
+		}
+	}), globalOptions.appContext).unmount;
+}
+var staticManager = createManager(globalOptions, ensureStaticHolder);
+function pickInstance(manager) {
+	const { open, destroy, info, success, error, warning, loading } = manager;
+	return {
+		open,
+		destroy,
+		info,
+		success,
+		error,
+		warning,
+		loading
+	};
+}
+function useMessage(config = {}) {
+	const manager = createManager(config, () => {});
+	const ContextHolder = defineComponent({
+		name: "AmMessageContextHolder",
+		setup() {
+			return () => h(Message_default, manager.holderProps());
+		}
+	});
+	return [pickInstance(manager), ContextHolder];
+}
+var message = {
+	...pickInstance(staticManager),
+	config(options) {
+		Object.assign(globalOptions, options);
+	},
+	useMessage
+};
+export { message as default };

package/dist/message/index.d.ts

@@ -0,0 +1,3 @@
+import message from './api';
+export type * from './interface';
+export default message;

package/dist/message/index.js

@@ -0,0 +1,4 @@
+import message from "./api.js";
+// src/message/index.ts
+var message_default = message;
+export { message_default as default };

package/dist/message/interface.d.ts

@@ -0,0 +1,68 @@
+import type { AppContext, Component, CSSProperties } from 'vue';
+import type { Key, Numeric, VueNode } from '../_util/type';
+export type MessageNoticeType = 'info' | 'success' | 'error' | 'warning' | 'loading';
+export interface MessageConfigOptions {
+    /** Distance from the top of the viewport (the safe area is added automatically) */
+    top?: Numeric;
+    /** Default duration in seconds */
+    duration?: number;
+    /** Max messages shown at once; the earliest one is closed when exceeded */
+    maxCount?: number;
+    getContainer?: () => HTMLElement;
+    /** App context for globally registered components / provides inside the content (static usage) */
+    appContext?: AppContext;
+}
+export interface MessageArgsProps {
+    content: VueNode;
+    /** Seconds before the message closes itself, `0` keeps it open */
+    duration?: number;
+    type?: MessageNoticeType;
+    icon?: VueNode;
+    /** Messages with the same key are updated in place */
+    key?: Key;
+    class?: string;
+    style?: CSSProperties;
+    onClose?: () => void;
+    onClick?: (event: MouseEvent) => void;
+}
+export type MessageJointContent = VueNode | MessageArgsProps;
+/** Close handle: call it to close the message, `then` it to wait until it is closed. */
+export interface MessageType extends PromiseLike<boolean> {
+    (): void;
+}
+export type MessageTypeOpen = (content: MessageJointContent, 
+/** Seconds, or the `onClose` callback */
+duration?: number | (() => void), onClose?: () => void) => MessageType;
+export interface MessageInstance {
+    info: MessageTypeOpen;
+    success: MessageTypeOpen;
+    error: MessageTypeOpen;
+    warning: MessageTypeOpen;
+    loading: MessageTypeOpen;
+    open: (args: MessageArgsProps) => MessageType;
+    /** Close one message by key, or all of them */
+    destroy: (key?: Key) => void;
+}
+export interface MessageApi extends MessageInstance {
+    /** Global config of the static methods */
+    config: (options: MessageConfigOptions) => void;
+    /** `const [messageApi, ContextHolder] = message.useMessage()` */
+    useMessage: (config?: MessageConfigOptions) => [MessageInstance, Component];
+}
+/** One rendered message (internal contract between the api and the holder component) */
+export interface MessageNotice {
+    id: number;
+    key: Key;
+    content: VueNode;
+    type?: MessageNoticeType;
+    icon?: VueNode;
+    class?: string;
+    style?: CSSProperties;
+    onClick?: (event: MouseEvent) => void;
+}
+export interface MessageHolderProps {
+    notices?: MessageNotice[];
+    top?: Numeric;
+    zIndex?: number;
+    getContainer?: () => HTMLElement;
+}

package/dist/message/style/index.css

@@ -0,0 +1,105 @@
+.am-message {
+  --am-message-z-index: 2010;
+  --am-message-top: 8px;
+  --am-message-gap: var(--am-margin-xs);
+  --am-message-bg: var(--am-color-bg-elevated);
+  --am-message-color: var(--am-color-text);
+  --am-message-font-size: var(--am-font-size);
+  --am-message-padding: 9px var(--am-padding);
+  --am-message-border-radius: 999px;
+  --am-message-shadow: var(--am-box-shadow);
+  --am-message-max-width: calc(100% - 32px);
+  --am-message-icon-size: 16px;
+
+  position: fixed;
+  top: var(--am-message-top);
+  top: calc(var(--am-message-top) + constant(safe-area-inset-top));
+  top: calc(var(--am-message-top) + env(safe-area-inset-top));
+  right: 0;
+  left: 0;
+  z-index: var(--am-message-z-index);
+  box-sizing: border-box;
+  color: var(--am-message-color);
+  font-size: var(--am-message-font-size);
+  font-family: var(--am-font-family);
+  line-height: var(--am-line-height);
+  pointer-events: none;
+}
+
+.am-message-notice {
+  box-sizing: border-box;
+  width: 100%;
+  padding-bottom: var(--am-message-gap);
+  text-align: center;
+}
+
+.am-message-notice-content {
+  display: inline-flex;
+  gap: var(--am-padding-xs);
+  align-items: flex-start;
+  box-sizing: border-box;
+  max-width: var(--am-message-max-width);
+  padding: var(--am-message-padding);
+  text-align: start;
+  word-break: break-word;
+  background: var(--am-message-bg);
+  border-radius: var(--am-message-border-radius);
+  box-shadow: var(--am-message-shadow);
+  pointer-events: auto;
+}
+
+.am-message-icon {
+  display: inline-flex;
+  flex: none;
+  align-items: center;
+  height: calc(var(--am-message-font-size) * var(--am-line-height));
+  color: var(--am-color-info);
+  font-size: var(--am-message-icon-size);
+}
+
+.am-message-notice-success .am-message-icon {
+  color: var(--am-color-success);
+}
+
+.am-message-notice-error .am-message-icon {
+  color: var(--am-color-error);
+}
+
+.am-message-notice-warning .am-message-icon {
+  color: var(--am-color-warning);
+}
+
+.am-message-notice-loading .am-message-icon {
+  color: var(--am-color-primary);
+}
+
+.am-message-text {
+  min-width: 0;
+}
+
+/* slide-fade motion */
+.am-message-motion-enter-active,
+.am-message-motion-leave-active,
+.am-message-motion-move {
+  transition:
+    opacity var(--am-motion-duration-slow) var(--am-motion-ease-out),
+    transform var(--am-motion-duration-slow) var(--am-motion-ease-out);
+}
+
+.am-message-motion-enter-from,
+.am-message-motion-leave-to {
+  transform: translate3d(0, -100%, 0);
+  opacity: 0;
+}
+
+.am-message-motion-leave-active {
+  position: absolute;
+}
+
+@media (prefers-reduced-motion: reduce) {
+  .am-message-motion-enter-active,
+  .am-message-motion-leave-active,
+  .am-message-motion-move {
+    transition-duration: 0.01s;
+  }
+}

package/dist/modal/Modal.js

@@ -0,0 +1,4 @@
+import Modal_vue_vue_type_script_setup_true_lang_default from "./Modal.vue_vue_type_script_setup_true_lang.js";
+// src/modal/Modal.vue
+var Modal_default = Modal_vue_vue_type_script_setup_true_lang_default;
+export { Modal_default as default };

package/dist/modal/Modal.vue.d.ts

@@ -0,0 +1,60 @@
+import type { ModalAction, ModalProps, ModalSlots } from './interface';
+import '../style';
+import './style/index.css';
+type __VLS_Slots = ModalSlots;
+declare const __VLS_base: import("vue").DefineComponent<ModalProps, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {
+    cancel: (event?: Event | undefined) => any;
+    "update:open": (open: boolean) => any;
+    afterOpenChange: (open: boolean) => any;
+    action: (action: ModalAction, index: number) => any;
+    afterClose: () => any;
+    ok: (event: MouseEvent) => any;
+}, string, import("vue").PublicProps, Readonly<ModalProps> & Readonly<{
+    onCancel?: ((event?: Event | undefined) => any) | undefined;
+    "onUpdate:open"?: ((open: boolean) => any) | undefined;
+    onAfterOpenChange?: ((open: boolean) => any) | undefined;
+    onAction?: ((action: ModalAction, index: number) => any) | undefined;
+    onAfterClose?: (() => any) | undefined;
+    onOk?: ((event: MouseEvent) => any) | undefined;
+}>, {
+    footer: string | number | boolean | import("vue").VNode<import("vue").RendererNode, import("vue").RendererElement, {
+        [key: string]: any;
+    }> | import("vue").VNodeArrayChildren | (() => import("vue").VNodeChild) | null;
+    title: string | number | boolean | import("vue").VNode<import("vue").RendererNode, import("vue").RendererElement, {
+        [key: string]: any;
+    }> | import("vue").VNodeArrayChildren | (() => import("vue").VNodeChild) | null;
+    mask: boolean;
+    content: string | number | boolean | import("vue").VNode<import("vue").RendererNode, import("vue").RendererElement, {
+        [key: string]: any;
+    }> | import("vue").VNodeArrayChildren | (() => import("vue").VNodeChild) | null;
+    open: boolean;
+    getContainer: import("../index.ts").GetContainer;
+    closable: boolean;
+    destroyOnHidden: boolean;
+    maskClosable: boolean;
+    closeIcon: string | number | boolean | import("vue").VNode<import("vue").RendererNode, import("vue").RendererElement, {
+        [key: string]: any;
+    }> | import("vue").VNodeArrayChildren | (() => import("vue").VNodeChild) | null;
+    forceRender: boolean;
+    keyboard: boolean;
+    cancelText: string | number | boolean | import("vue").VNode<import("vue").RendererNode, import("vue").RendererElement, {
+        [key: string]: any;
+    }> | import("vue").VNodeArrayChildren | (() => import("vue").VNodeChild) | null;
+    closeOnAction: boolean;
+    okText: string | number | boolean | import("vue").VNode<import("vue").RendererNode, import("vue").RendererElement, {
+        [key: string]: any;
+    }> | import("vue").VNodeArrayChildren | (() => import("vue").VNodeChild) | null;
+    okType: import("./interface").ModalOkType;
+    confirmLoading: boolean;
+    okCancel: boolean;
+    centered: boolean;
+    scrollLock: boolean;
+}, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>;
+declare const __VLS_export: __VLS_WithSlots<typeof __VLS_base, __VLS_Slots>;
+declare const _default: typeof __VLS_export;
+export default _default;
+type __VLS_WithSlots<T, S> = T & {
+    new (): {
+        $slots: S;
+    };
+};