@cynnie/ui-shadcn 0.1.0

package/dist/components/ui/table/TableCell.vue.d.ts

@@ -0,0 +1,21 @@
+import { HTMLAttributes } from 'vue';
+type __VLS_Props = {
+    class?: HTMLAttributes["class"];
+};
+declare function __VLS_template(): {
+    attrs: Partial<{}>;
+    slots: {
+        default?(_: {}): any;
+    };
+    refs: {};
+    rootEl: HTMLTableCellElement;
+};
+type __VLS_TemplateResult = ReturnType<typeof __VLS_template>;
+declare const __VLS_component: import('vue').DefineComponent<__VLS_Props, {}, {}, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {}, string, import('vue').PublicProps, Readonly<__VLS_Props> & Readonly<{}>, {}, {}, {}, {}, string, import('vue').ComponentProvideOptions, true, {}, HTMLTableCellElement>;
+declare const _default: __VLS_WithTemplateSlots<typeof __VLS_component, __VLS_TemplateResult["slots"]>;
+export default _default;
+type __VLS_WithTemplateSlots<T, S> = T & {
+    new (): {
+        $slots: S;
+    };
+};

package/dist/components/ui/table/TableHead.vue.d.ts

@@ -0,0 +1,21 @@
+import { HTMLAttributes } from 'vue';
+type __VLS_Props = {
+    class?: HTMLAttributes["class"];
+};
+declare function __VLS_template(): {
+    attrs: Partial<{}>;
+    slots: {
+        default?(_: {}): any;
+    };
+    refs: {};
+    rootEl: HTMLTableCellElement;
+};
+type __VLS_TemplateResult = ReturnType<typeof __VLS_template>;
+declare const __VLS_component: import('vue').DefineComponent<__VLS_Props, {}, {}, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {}, string, import('vue').PublicProps, Readonly<__VLS_Props> & Readonly<{}>, {}, {}, {}, {}, string, import('vue').ComponentProvideOptions, true, {}, HTMLTableCellElement>;
+declare const _default: __VLS_WithTemplateSlots<typeof __VLS_component, __VLS_TemplateResult["slots"]>;
+export default _default;
+type __VLS_WithTemplateSlots<T, S> = T & {
+    new (): {
+        $slots: S;
+    };
+};

package/dist/components/ui/table/TableHeader.vue.d.ts

@@ -0,0 +1,21 @@
+import { HTMLAttributes } from 'vue';
+type __VLS_Props = {
+    class?: HTMLAttributes["class"];
+};
+declare function __VLS_template(): {
+    attrs: Partial<{}>;
+    slots: {
+        default?(_: {}): any;
+    };
+    refs: {};
+    rootEl: HTMLTableSectionElement;
+};
+type __VLS_TemplateResult = ReturnType<typeof __VLS_template>;
+declare const __VLS_component: import('vue').DefineComponent<__VLS_Props, {}, {}, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {}, string, import('vue').PublicProps, Readonly<__VLS_Props> & Readonly<{}>, {}, {}, {}, {}, string, import('vue').ComponentProvideOptions, true, {}, HTMLTableSectionElement>;
+declare const _default: __VLS_WithTemplateSlots<typeof __VLS_component, __VLS_TemplateResult["slots"]>;
+export default _default;
+type __VLS_WithTemplateSlots<T, S> = T & {
+    new (): {
+        $slots: S;
+    };
+};

package/dist/components/ui/table/TableRow.vue.d.ts

@@ -0,0 +1,21 @@
+import { HTMLAttributes } from 'vue';
+type __VLS_Props = {
+    class?: HTMLAttributes["class"];
+};
+declare function __VLS_template(): {
+    attrs: Partial<{}>;
+    slots: {
+        default?(_: {}): any;
+    };
+    refs: {};
+    rootEl: HTMLTableRowElement;
+};
+type __VLS_TemplateResult = ReturnType<typeof __VLS_template>;
+declare const __VLS_component: import('vue').DefineComponent<__VLS_Props, {}, {}, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {}, string, import('vue').PublicProps, Readonly<__VLS_Props> & Readonly<{}>, {}, {}, {}, {}, string, import('vue').ComponentProvideOptions, true, {}, HTMLTableRowElement>;
+declare const _default: __VLS_WithTemplateSlots<typeof __VLS_component, __VLS_TemplateResult["slots"]>;
+export default _default;
+type __VLS_WithTemplateSlots<T, S> = T & {
+    new (): {
+        $slots: S;
+    };
+};

package/dist/components/ui/table/index.d.ts

@@ -0,0 +1,6 @@
+export { default as Table } from './Table.vue';
+export { default as TableBody } from './TableBody.vue';
+export { default as TableCell } from './TableCell.vue';
+export { default as TableHead } from './TableHead.vue';
+export { default as TableHeader } from './TableHeader.vue';
+export { default as TableRow } from './TableRow.vue';

package/dist/components/ui/textarea/Textarea.vue.d.ts

@@ -0,0 +1,13 @@
+import { HTMLAttributes } from 'vue';
+type __VLS_Props = {
+    class?: HTMLAttributes["class"];
+};
+type __VLS_PublicProps = {
+    modelValue?: any;
+} & __VLS_Props;
+declare const _default: import('vue').DefineComponent<__VLS_PublicProps, {}, {}, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {
+    "update:modelValue": (value: any) => any;
+}, string, import('vue').PublicProps, Readonly<__VLS_PublicProps> & Readonly<{
+    "onUpdate:modelValue"?: (value: any) => any;
+}>, {}, {}, {}, {}, string, import('vue').ComponentProvideOptions, true, {}, HTMLTextAreaElement>;
+export default _default;

package/dist/components/ui/textarea/index.d.ts

@@ -0,0 +1 @@
+export { default as Textarea } from './Textarea.vue';

package/dist/index.d.ts

@@ -0,0 +1,8 @@
+export { openDialog, renderDialogForm } from './utils/openDialog.js';
+export { uiMessage, Toaster } from './utils/uiMessage.js';
+export { createApis } from '@cynnie/ui-core';
+export { useOptions } from '@cynnie/ui-core';
+export { useDebounce, useThrottle, useAsyncLoading } from '@cynnie/ui-core';
+export type { DictOption, UseOptionsOptions, PageApis, PromiseFn, CreateApisOptions, FormItem, FormRules, TableColumn, DialogOptions, DialogHandle, } from '@cynnie/ui-core';
+export type { DescriptionItem } from './components/ProDescriptions/index.vue';
+export { ProTable, ProTableForm, ProFormBuilder, ProButton, ProCountdownButton, ProInput, ProSelect, ProCheckboxGroup, ProRadioGroup, ProModal, ProConfirmButton, ProDescriptions, } from './components/index.js';

package/dist/index.js

@@ -0,0 +1,65 @@
+import { t as Button_default } from "./button-BQVT6mY3.js";
+import { t as ProFormBuilder_default } from "./ProFormBuilder-CsNShZ0y.js";
+import { t as ProRadioGroup_default } from "./ProRadioGroup-CTxqLQjw.js";
+import { t as ProConfirmButton_default } from "./ProConfirmButton-zcvp7NcN.js";
+import { i as uiMessage, n as ProTableForm_default, r as Toaster, t as ProTable_default } from "./ProTable-CP1Mc52q.js";
+import { n as renderDialogForm, t as openDialog } from "./openDialog-CVp3qAfm.js";
+import { t as ProButton_default } from "./ProButton-BQWpTTCy.js";
+import { t as ProInput_default } from "./ProInput-D20F1Xx-.js";
+import { t as ProSelect_default } from "./ProSelect-DT0zjDjT.js";
+import { t as ProCheckboxGroup_default } from "./ProCheckboxGroup-DX6c9gx-.js";
+import { t as ProModal_default } from "./ProModal-DsIFQ8y5.js";
+import { t as ProDescriptions_default } from "./ProDescriptions-B1znLzkY.js";
+import { Fragment, createBlock, createCommentVNode, createElementBlock, createTextVNode, defineComponent, mergeProps, openBlock, ref, renderSlot, toDisplayString, unref, withCtx } from "vue";
+import { createApis, useAsyncLoading, useDebounce, useOptions, useThrottle } from "@cynnie/ui-core";
+var ProCountdownButton_default = /* @__PURE__ */ defineComponent({
+	name: "ProCountdownButton",
+	inheritAttrs: false,
+	__name: "ProCountdownButton",
+	props: {
+		seconds: { default: 60 },
+		countingText: { default: "{n}s 后重发" },
+		onClick: {}
+	},
+	setup(__props) {
+		const props = __props;
+		const remaining = ref(0);
+		let timer;
+		function stopTimer() {
+			if (timer) {
+				clearInterval(timer);
+				timer = void 0;
+			}
+		}
+		async function handleClick(...args) {
+			if (remaining.value > 0) return;
+			if (props.onClick) {
+				const result = props.onClick(...args);
+				if (result instanceof Promise) await result;
+			}
+			remaining.value = props.seconds;
+			timer = setInterval(() => {
+				remaining.value -= 1;
+				if (remaining.value <= 0) stopTimer();
+			}, 1e3);
+		}
+		return (_ctx, _cache) => {
+			return openBlock(), createBlock(unref(Button_default), mergeProps({
+				variant: "outline",
+				disabled: remaining.value > 0 || void 0
+			}, {
+				..._ctx.$attrs,
+				class: void 0
+			}, {
+				class: _ctx.$attrs.class,
+				onClick: handleClick
+			}), {
+				default: withCtx(() => [remaining.value > 0 ? (openBlock(), createElementBlock(Fragment, { key: 0 }, [createTextVNode(toDisplayString(props.countingText.replace("{n}", String(remaining.value))), 1)], 64)) : renderSlot(_ctx.$slots, "default", { key: 1 })]),
+				_: 3
+			}, 16, ["disabled", "class"]);
+		};
+	}
+});
+export { ProButton_default as ProButton, ProCheckboxGroup_default as ProCheckboxGroup, ProConfirmButton_default as ProConfirmButton, ProCountdownButton_default as ProCountdownButton, ProDescriptions_default as ProDescriptions, ProFormBuilder_default as ProFormBuilder, ProInput_default as ProInput, ProModal_default as ProModal, ProRadioGroup_default as ProRadioGroup, ProSelect_default as ProSelect, ProTable_default as ProTable, ProTableForm_default as ProTableForm, Toaster, createApis, openDialog, renderDialogForm, uiMessage, useAsyncLoading, useDebounce, useOptions, useThrottle };
+
+//# sourceMappingURL=index.js.map

package/dist/index.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.js","names":["$attrs"],"sources":["../src/components/ProButton/ProCountdownButton.vue","../src/components/ProButton/ProCountdownButton.vue"],"sourcesContent":["<script setup lang=\"ts\">\nimport { ref } from \"vue\";\nimport { Button } from \"../ui/button\";\n\ndefineOptions({\n  name: \"ProCountdownButton\",\n  inheritAttrs: false,\n});\n\nconst props = withDefaults(\n  defineProps<{\n    /** 倒计时秒数 */\n    seconds?: number;\n    /** 倒计时期间按钮文案，{} 会替换为剩余秒数 */\n    countingText?: string;\n    /** 点击处理函数：返回 Promise 且 resolve 后才开始倒计时（适合发验证码接口） */\n    onClick?: (...args: any[]) => any;\n  }>(),\n  {\n    seconds: 60,\n    countingText: \"{n}s 后重发\",\n  },\n);\n\nconst remaining = ref(0);\nlet timer: ReturnType<typeof setInterval> | undefined;\n\nfunction stopTimer() {\n  if (timer) {\n    clearInterval(timer);\n    timer = undefined;\n  }\n}\n\nasync function handleClick(...args: any[]) {\n  if (remaining.value > 0) return;\n\n  if (props.onClick) {\n    const result = props.onClick(...args);\n    if (result instanceof Promise) await result;\n  }\n\n  remaining.value = props.seconds;\n  timer = setInterval(() => {\n    remaining.value -= 1;\n    if (remaining.value <= 0) stopTimer();\n  }, 1000);\n}\n</script>\n\n<template>\n  <Button\n    variant=\"outline\"\n    :disabled=\"remaining > 0 || undefined\"\n    v-bind=\"{ ...$attrs, class: undefined }\"\n    :class=\"($attrs.class as any)\"\n    @click=\"handleClick\"\n  >\n    <template v-if=\"remaining > 0\">{{\n      props.countingText.replace(\"{n}\", String(remaining))\n    }}</template>\n    <slot v-else></slot>\n  </Button>\n</template>\n","<script setup lang=\"ts\">\nimport { ref } from \"vue\";\nimport { Button } from \"../ui/button\";\n\ndefineOptions({\n  name: \"ProCountdownButton\",\n  inheritAttrs: false,\n});\n\nconst props = withDefaults(\n  defineProps<{\n    /** 倒计时秒数 */\n    seconds?: number;\n    /** 倒计时期间按钮文案，{} 会替换为剩余秒数 */\n    countingText?: string;\n    /** 点击处理函数：返回 Promise 且 resolve 后才开始倒计时（适合发验证码接口） */\n    onClick?: (...args: any[]) => any;\n  }>(),\n  {\n    seconds: 60,\n    countingText: \"{n}s 后重发\",\n  },\n);\n\nconst remaining = ref(0);\nlet timer: ReturnType<typeof setInterval> | undefined;\n\nfunction stopTimer() {\n  if (timer) {\n    clearInterval(timer);\n    timer = undefined;\n  }\n}\n\nasync function handleClick(...args: any[]) {\n  if (remaining.value > 0) return;\n\n  if (props.onClick) {\n    const result = props.onClick(...args);\n    if (result instanceof Promise) await result;\n  }\n\n  remaining.value = props.seconds;\n  timer = setInterval(() => {\n    remaining.value -= 1;\n    if (remaining.value <= 0) stopTimer();\n  }, 1000);\n}\n</script>\n\n<template>\n  <Button\n    variant=\"outline\"\n    :disabled=\"remaining > 0 || undefined\"\n    v-bind=\"{ ...$attrs, class: undefined }\"\n    :class=\"($attrs.class as any)\"\n    @click=\"handleClick\"\n  >\n    <template v-if=\"remaining > 0\">{{\n      props.countingText.replace(\"{n}\", String(remaining))\n    }}</template>\n    <slot v-else></slot>\n  </Button>\n</template>\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;ECSA,MAAM,QAAQ;EAed,MAAM,YAAY,IAAI,EAAE;EACxB,IAAI;EAEJ,SAAS,YAAY;AACnB,OAAI,OAAO;AACT,kBAAc,MAAM;AACpB,YAAQ,KAAA;;;EAIZ,eAAe,YAAY,GAAG,MAAa;AACzC,OAAI,UAAU,QAAQ,EAAG;AAEzB,OAAI,MAAM,SAAS;IACjB,MAAM,SAAS,MAAM,QAAQ,GAAG,KAAK;AACrC,QAAI,kBAAkB,QAAS,OAAM;;AAGvC,aAAU,QAAQ,MAAM;AACxB,WAAQ,kBAAkB;AACxB,cAAU,SAAS;AACnB,QAAI,UAAU,SAAS,EAAG,YAAW;MACpC,IAAK;;;uBAKR,YAWS,MAAA,eAAA,EAXT,WAWS;IAVP,SAAQ;IACP,UAAU,UAAA,QAAS,KAAQ,KAAA;;OACfA,KAAAA;IAAM,OAAS,KAAA;IAAS,EAAA;IACpC,OAAQA,KAAAA,OAAO;IACf,SAAO;;2BAIK,CAFG,UAAA,QAAS,KAAA,WAAA,EAAzB,mBAEa,UAAA,EAAA,KAAA,GAAA,EAAA,CAAA,gBAAA,gBADX,MAAM,aAAa,QAAO,OAAQ,OAAO,UAAA,MAAS,CAAA,CAAA,EAAA,EAAA,CAAA,EAAA,GAAA,IAEpD,WAAoB,KAAA,QAAA,WAAA,EAAA,KAAA,GAAA,CAAA,CAAA,CAAA"}

package/dist/lib/utils.d.ts

@@ -0,0 +1,3 @@
+import { ClassValue } from 'clsx';
+/** shadcn 惯用的类名合并工具 */
+export declare function cn(...inputs: ClassValue[]): string;

package/dist/openDialog-CVp3qAfm.js

@@ -0,0 +1,95 @@
+import { t as Button_default } from "./button-BQVT6mY3.js";
+import { t as ProFormBuilder_default } from "./ProFormBuilder-CsNShZ0y.js";
+import { a as Dialog_default, i as DialogContent_default, n as DialogHeader_default, r as DialogFooter_default, t as DialogTitle_default } from "./DialogTitle-CCJNart2.js";
+import { t as Loader_default } from "./Loader-DZyMmrI8.js";
+import { createApp, defineComponent, h, reactive, ref } from "vue";
+var EMPTY_OBJ = Object.freeze({});
+function openDialog(component, props = EMPTY_OBJ, modelProps = EMPTY_OBJ) {
+	const { methodKey = "submit", onSubmit, ...restProps } = props;
+	const open = ref(true);
+	const instance = ref();
+	const container = document.createElement("div");
+	container.setAttribute("data-snowui-dialog-container", "");
+	const loading = ref(false);
+	document.body.appendChild(container);
+	const reactiveModelProps = reactive(modelProps);
+	async function handleOk() {
+		loading.value = true;
+		try {
+			let result;
+			if (onSubmit) result = await onSubmit(instance.value);
+			else if (instance.value?.[methodKey]) result = await instance.value[methodKey]();
+			open.value = false;
+			reactiveModelProps.onOk?.(result);
+		} catch {} finally {
+			loading.value = false;
+		}
+	}
+	function unmount() {
+		app.unmount();
+		document.body.removeChild(container);
+	}
+	function watchClose() {
+		const stop = setInterval(() => {
+			if (!open.value) {
+				clearInterval(stop);
+				setTimeout(unmount, 250);
+			}
+		}, 100);
+	}
+	const app = createApp(defineComponent({ setup() {
+		return () => {
+			const title = typeof reactiveModelProps.title === "function" ? reactiveModelProps.title() : reactiveModelProps.title;
+			const widthStyle = reactiveModelProps.width != null ? {
+				width: typeof reactiveModelProps.width === "number" ? `${reactiveModelProps.width}px` : reactiveModelProps.width,
+				maxWidth: "calc(100% - 2rem)"
+			} : void 0;
+			return h(Dialog_default, {
+				open: open.value,
+				"onUpdate:open": (value) => open.value = value
+			}, { default: () => h(DialogContent_default, {
+				style: widthStyle,
+				onEscapeKeyDown: (event) => {
+					reactiveModelProps.onCancel?.(event);
+				},
+				onInteractOutside: (event) => {
+					reactiveModelProps.onCancel?.(event);
+				}
+			}, { default: () => [
+				h(DialogHeader_default, {}, () => h(DialogTitle_default, {}, { default: () => title })),
+				h("div", { class: "py-1" }, [h(component, {
+					...restProps,
+					ref: instance
+				})]),
+				h(DialogFooter_default, { class: "gap-2" }, () => [h(Button_default, {
+					variant: "outline",
+					onClick: () => open.value = false
+				}, () => "取 消"), loading.value ? h(Button_default, { disabled: true }, () => [h(Loader_default, { class: "text-current" }), "确 定"]) : h(Button_default, { onClick: handleOk }, () => "确 定")])
+			] }) });
+		};
+	} }));
+	app.mount(container);
+	watchClose();
+	function close() {
+		open.value = false;
+	}
+	return { close };
+}
+function renderDialogForm(formProps, modelProps = EMPTY_OBJ) {
+	const reactiveFormProps = reactive(formProps);
+	return openDialog({ setup(_, { expose }) {
+		const formInstance = ref();
+		expose({ async submit() {
+			await formInstance.value?.validate?.();
+			return reactiveFormProps.modelValue;
+		} });
+		const FormComp = ProFormBuilder_default;
+		return () => h(FormComp, {
+			...reactiveFormProps,
+			ref: formInstance
+		});
+	} }, {}, modelProps);
+}
+export { renderDialogForm as n, openDialog as t };
+
+//# sourceMappingURL=openDialog-CVp3qAfm.js.map

package/dist/openDialog-CVp3qAfm.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"openDialog-CVp3qAfm.js","names":["result: any"],"sources":["../src/utils/openDialog.ts"],"sourcesContent":["import { type Component, h, createApp, reactive, ref, defineComponent } from \"vue\";\nimport { Dialog, DialogContent, DialogFooter, DialogHeader, DialogTitle, Button, Loader } from \"../components/ui/index.js\";\nimport ProFormBuilder from \"../components/ProFormBuilder/index.vue\";\nimport type { DialogHandle } from \"@cynnie/ui-core\";\n\n// 避免每次调用都创建新空对象\nconst EMPTY_OBJ = Object.freeze({});\n\n/** openDialog 的弹窗配置：与 antd / element 版的公共字段对齐（title / width / onOk / onCancel 等） */\ninterface ShadcnDialogProps extends Record<string, any> {\n  title?: any;\n  width?: string | number;\n  onOk?: (result?: any) => any;\n  onCancel?: (e?: any) => any;\n}\n\nexport function openDialog(\n  component: Component,\n  props: Record<string, any> = EMPTY_OBJ,\n  modelProps: ShadcnDialogProps = EMPTY_OBJ,\n): DialogHandle {\n  // 调用方可通过 props 传 methodKey / onSubmit 自定义确定按钮的行为：\n  // - methodKey：内容组件暴露的方法名，默认 'submit'\n  // - onSubmit：直接传函数（拿到内容组件实例），优先级高于 methodKey\n  const { methodKey = \"submit\", onSubmit, ...restProps } = props;\n  const open = ref(true);\n  const instance = ref<Record<string, any>>();\n  const container = document.createElement(\"div\");\n  container.setAttribute(\"data-snowui-dialog-container\", \"\");\n  const loading = ref(false);\n  document.body.appendChild(container);\n\n  // reactive 包一层：外部传 ref 的 title 等配置可动态响应\n  const reactiveModelProps = reactive(modelProps);\n\n  async function handleOk() {\n    loading.value = true;\n    try {\n      let result: any;\n      if (onSubmit) {\n        result = await onSubmit(instance.value);\n      } else if (instance.value?.[methodKey]) {\n        result = await instance.value[methodKey]();\n      }\n      open.value = false;\n      // 内容组件提交方法（或 onSubmit）的返回值交给 onOk\n      reactiveModelProps.onOk?.(result);\n    } catch {\n      // 提交失败（校验不通过 / 请求报错）保持弹窗打开\n    } finally {\n      loading.value = false;\n    }\n  }\n\n  function unmount() {\n    app.unmount();\n    document.body.removeChild(container);\n  }\n\n  // 关闭动画结束后再卸载\n  function watchClose() {\n    const stop = setInterval(() => {\n      if (!open.value) {\n        clearInterval(stop);\n        setTimeout(unmount, 250);\n      }\n    }, 100);\n  }\n\n  const DialogWithFooter = defineComponent({\n    setup() {\n      return () => {\n        const title =\n          typeof reactiveModelProps.title === \"function\"\n            ? (reactiveModelProps.title as any)()\n            : reactiveModelProps.title;\n        const widthStyle =\n          reactiveModelProps.width != null\n            ? {\n                width:\n                  typeof reactiveModelProps.width === \"number\"\n                    ? `${reactiveModelProps.width}px`\n                    : reactiveModelProps.width,\n                maxWidth: \"calc(100% - 2rem)\",\n              }\n            : undefined;\n        return h(\n          Dialog,\n          { open: open.value, \"onUpdate:open\": (value: boolean) => (open.value = value) },\n          {\n            default: () =>\n              h(\n                DialogContent,\n                {\n                  style: widthStyle,\n                  onEscapeKeyDown: (event: any) => {\n                    // ESC / 点遮罩关闭都走 onCancel，与 antd / element 版对齐\n                    reactiveModelProps.onCancel?.(event);\n                  },\n                  onInteractOutside: (event: any) => {\n                    reactiveModelProps.onCancel?.(event);\n                  },\n                },\n                {\n                  default: () => [\n                    h(DialogHeader, {}, () => h(DialogTitle, {}, { default: () => title })),\n                    h(\"div\", { class: \"py-1\" }, [h(component, { ...restProps, ref: instance })]),\n                    h(\n                      DialogFooter,\n                      { class: \"gap-2\" },\n                      () => [\n                        h(Button, { variant: \"outline\", onClick: () => (open.value = false) }, () => \"取 消\"),\n                        loading.value\n                          ? h(Button, { disabled: true }, () => [h(Loader, { class: \"text-current\" }), \"确 定\"])\n                          : h(Button, { onClick: handleOk }, () => \"确 定\"),\n                      ],\n                    ),\n                  ],\n                },\n              ),\n          },\n        );\n      };\n    },\n  });\n\n  const app = createApp(DialogWithFooter);\n  app.mount(container);\n  watchClose();\n\n  // 返回 close 方法，调用方可编程式关闭弹窗\n  function close() {\n    open.value = false;\n  }\n  return { close };\n}\n\n/**\n * 命令式弹窗表单：一行代码弹出一个「确定时自动校验」的表单弹窗。\n *\n * @param formProps  ProFormBuilder 的配置：formItems / rules / modelValue 等\n * @param modelProps 弹窗的配置（title / width / onOk 等）\n * @returns { close } 关闭弹窗\n *\n * @example\n * const { close } = renderDialogForm(\n *   { formItems: [{ label: '姓名', key: 'name' }], rules: { name: [{ required: true }] } },\n *   { title: '新增用户', onOk: (data) => console.log('提交', data) },\n * );\n */\nexport function renderDialogForm(formProps: Record<string, any>, modelProps: ShadcnDialogProps = EMPTY_OBJ): DialogHandle {\n  const reactiveFormProps = reactive(formProps);\n  return openDialog(\n    {\n      setup(_: any, { expose }: any) {\n        const formInstance = ref();\n        expose({\n          // 点确定时先跑表单校验，通过后把表单数据交给 onOk\n          async submit() {\n            await formInstance.value?.validate?.();\n            return reactiveFormProps.modelValue;\n          },\n        });\n        // formProps 是运行时动态对象，断言绕开 h() 对 .vue 组件的严格 props 推断\n        const FormComp = ProFormBuilder as unknown as Component;\n        return () => h(FormComp, { ...reactiveFormProps, ref: formInstance });\n      },\n    },\n    {},\n    modelProps,\n  );\n}\n"],"mappings":";;;;;AAMA,IAAM,YAAY,OAAO,OAAO,EAAE,CAAC;AAUnC,SAAgB,WACd,WACA,QAA6B,WAC7B,aAAgC,WAClB;CAId,MAAM,EAAE,YAAY,UAAU,UAAU,GAAG,cAAc;CACzD,MAAM,OAAO,IAAI,KAAK;CACtB,MAAM,WAAW,KAA0B;CAC3C,MAAM,YAAY,SAAS,cAAc,MAAM;AAC/C,WAAU,aAAa,gCAAgC,GAAG;CAC1D,MAAM,UAAU,IAAI,MAAM;AAC1B,UAAS,KAAK,YAAY,UAAU;CAGpC,MAAM,qBAAqB,SAAS,WAAW;CAE/C,eAAe,WAAW;AACxB,UAAQ,QAAQ;AAChB,MAAI;GACF,IAAIA;AACJ,OAAI,SACF,UAAS,MAAM,SAAS,SAAS,MAAM;YAC9B,SAAS,QAAQ,WAC1B,UAAS,MAAM,SAAS,MAAM,YAAY;AAE5C,QAAK,QAAQ;AAEb,sBAAmB,OAAO,OAAO;UAC3B,WAEE;AACR,WAAQ,QAAQ;;;CAIpB,SAAS,UAAU;AACjB,MAAI,SAAS;AACb,WAAS,KAAK,YAAY,UAAU;;CAItC,SAAS,aAAa;EACpB,MAAM,OAAO,kBAAkB;AAC7B,OAAI,CAAC,KAAK,OAAO;AACf,kBAAc,KAAK;AACnB,eAAW,SAAS,IAAI;;KAEzB,IAAI;;CA4DT,MAAM,MAAM,UAzDa,gBAAgB,EACvC,QAAQ;AACN,eAAa;GACX,MAAM,QACJ,OAAO,mBAAmB,UAAU,aAC/B,mBAAmB,OAAe,GACnC,mBAAmB;GACzB,MAAM,aACJ,mBAAmB,SAAS,OACxB;IACE,OACE,OAAO,mBAAmB,UAAU,WAChC,GAAG,mBAAmB,MAAM,MAC5B,mBAAmB;IACzB,UAAU;IACX,GACD,KAAA;AACN,UAAO,EACL,gBACA;IAAE,MAAM,KAAK;IAAO,kBAAkB,UAAoB,KAAK,QAAQ;IAAQ,EAC/E,EACE,eACE,EACE,uBACA;IACE,OAAO;IACP,kBAAkB,UAAe;AAE/B,wBAAmB,WAAW,MAAM;;IAEtC,oBAAoB,UAAe;AACjC,wBAAmB,WAAW,MAAM;;IAEvC,EACD,EACE,eAAe;IACb,EAAE,sBAAc,EAAE,QAAQ,EAAE,qBAAa,EAAE,EAAE,EAAE,eAAe,OAAO,CAAC,CAAC;IACvE,EAAE,OAAO,EAAE,OAAO,QAAQ,EAAE,CAAC,EAAE,WAAW;KAAE,GAAG;KAAW,KAAK;KAAU,CAAC,CAAC,CAAC;IAC5E,EACE,sBACA,EAAE,OAAO,SAAS,QACZ,CACJ,EAAE,gBAAQ;KAAE,SAAS;KAAW,eAAgB,KAAK,QAAQ;KAAQ,QAAQ,MAAM,EACnF,QAAQ,QACJ,EAAE,gBAAQ,EAAE,UAAU,MAAM,QAAQ,CAAC,EAAE,gBAAQ,EAAE,OAAO,gBAAgB,CAAC,EAAE,MAAM,CAAC,GAClF,EAAE,gBAAQ,EAAE,SAAS,UAAU,QAAQ,MAAM,CAClD,CACF;IACF,EACF,CACF,EACJ,CACF;;IAGN,CAAC,CAEqC;AACvC,KAAI,MAAM,UAAU;AACpB,aAAY;CAGZ,SAAS,QAAQ;AACf,OAAK,QAAQ;;AAEf,QAAO,EAAE,OAAO;;AAgBlB,SAAgB,iBAAiB,WAAgC,aAAgC,WAAyB;CACxH,MAAM,oBAAoB,SAAS,UAAU;AAC7C,QAAO,WACL,EACE,MAAM,GAAQ,EAAE,UAAe;EAC7B,MAAM,eAAe,KAAK;AAC1B,SAAO,EAEL,MAAM,SAAS;AACb,SAAM,aAAa,OAAO,YAAY;AACtC,UAAO,kBAAkB;KAE5B,CAAC;EAEF,MAAM,WAAW;AACjB,eAAa,EAAE,UAAU;GAAE,GAAG;GAAmB,KAAK;GAAc,CAAC;IAExE,EACD,EAAE,EACF,WACD"}

package/dist/utils/openDialog.d.ts

@@ -0,0 +1,25 @@
+import { Component } from 'vue';
+import { DialogHandle } from '@cynnie/ui-core';
+/** openDialog 的弹窗配置：与 antd / element 版的公共字段对齐（title / width / onOk / onCancel 等） */
+interface ShadcnDialogProps extends Record<string, any> {
+    title?: any;
+    width?: string | number;
+    onOk?: (result?: any) => any;
+    onCancel?: (e?: any) => any;
+}
+export declare function openDialog(component: Component, props?: Record<string, any>, modelProps?: ShadcnDialogProps): DialogHandle;
+/**
+ * 命令式弹窗表单：一行代码弹出一个「确定时自动校验」的表单弹窗。
+ *
+ * @param formProps  ProFormBuilder 的配置：formItems / rules / modelValue 等
+ * @param modelProps 弹窗的配置（title / width / onOk 等）
+ * @returns { close } 关闭弹窗
+ *
+ * @example
+ * const { close } = renderDialogForm(
+ *   { formItems: [{ label: '姓名', key: 'name' }], rules: { name: [{ required: true }] } },
+ *   { title: '新增用户', onOk: (data) => console.log('提交', data) },
+ * );
+ */
+export declare function renderDialogForm(formProps: Record<string, any>, modelProps?: ShadcnDialogProps): DialogHandle;
+export {};

package/dist/utils/openDialog.js

@@ -0,0 +1,2 @@
+import { n as renderDialogForm, t as openDialog } from "../openDialog-CVp3qAfm.js";
+export { openDialog, renderDialogForm };

package/dist/utils/uiMessage.d.ts

@@ -0,0 +1,8 @@
+import { Toaster, toast } from 'vue-sonner';
+export declare const uiMessage: {
+    success: (content: string) => any;
+    info: (content: string) => any;
+    error: (content: string) => any;
+    warning: (content: string) => any;
+};
+export { Toaster, toast };

package/dist/utils-Dg1mr-yh.js

@@ -0,0 +1,8 @@
+import { clsx } from "clsx";
+import { twMerge } from "tailwind-merge";
+function cn(...inputs) {
+	return twMerge(clsx(inputs));
+}
+export { cn as t };
+
+//# sourceMappingURL=utils-Dg1mr-yh.js.map

package/dist/utils-Dg1mr-yh.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"utils-Dg1mr-yh.js","names":[],"sources":["../src/lib/utils.ts"],"sourcesContent":["import { type ClassValue, clsx } from \"clsx\";\nimport { twMerge } from \"tailwind-merge\";\n\n/** shadcn 惯用的类名合并工具 */\nexport function cn(...inputs: ClassValue[]) {\n  return twMerge(clsx(inputs));\n}\n"],"mappings":";;AAIA,SAAgB,GAAG,GAAG,QAAsB;AAC1C,QAAO,QAAQ,KAAK,OAAO,CAAC"}

package/package.json

@@ -0,0 +1,108 @@
+{
+  "name": "@cynnie/ui-shadcn",
+  "version": "0.1.0",
+  "type": "module",
+  "description": "基于 shadcn-vue（reka-ui + Tailwind CSS v4）的 SnowUI 二次封装组件库，API 与 @cynnie/ui-antd / @cynnie/ui-element 对齐",
+  "license": "MIT",
+  "repository": {
+    "type": "git",
+    "url": "git+https://github.com/snowbitx/ui.git",
+    "directory": "packages/ui-shadcn"
+  },
+  "main": "./dist/index.js",
+  "module": "./dist/index.js",
+  "types": "./dist/index.d.ts",
+  "exports": {
+    ".": {
+      "types": "./dist/index.d.ts",
+      "import": "./dist/index.js"
+    },
+    "./style.css": "./src/style.css",
+    "./tailwind.preset.css": "./src/tailwind.preset.css",
+    "./components/ProTable": {
+      "types": "./dist/components/ProTable/index.vue.d.ts",
+      "import": "./dist/components/ProTable/index.js"
+    },
+    "./components/ProFormBuilder": {
+      "types": "./dist/components/ProFormBuilder/index.vue.d.ts",
+      "import": "./dist/components/ProFormBuilder/index.js"
+    },
+    "./utils/openDialog": {
+      "types": "./dist/utils/openDialog.d.ts",
+      "import": "./dist/utils/openDialog.js"
+    },
+    "./components/ProButton": {
+      "types": "./dist/components/ProButton/index.vue.d.ts",
+      "import": "./dist/components/ProButton/index.js"
+    },
+    "./components/ProInput": {
+      "types": "./dist/components/ProInput/index.vue.d.ts",
+      "import": "./dist/components/ProInput/index.js"
+    },
+    "./components/ProSelect": {
+      "types": "./dist/components/ProSelect/index.vue.d.ts",
+      "import": "./dist/components/ProSelect/index.js"
+    },
+    "./components/ProCheckboxGroup": {
+      "types": "./dist/components/ProCheckboxGroup/index.vue.d.ts",
+      "import": "./dist/components/ProCheckboxGroup/index.js"
+    },
+    "./components/ProRadioGroup": {
+      "types": "./dist/components/ProRadioGroup/index.vue.d.ts",
+      "import": "./dist/components/ProRadioGroup/index.js"
+    },
+    "./components/ProModal": {
+      "types": "./dist/components/ProModal/index.vue.d.ts",
+      "import": "./dist/components/ProModal/index.js"
+    },
+    "./components/ProConfirmButton": {
+      "types": "./dist/components/ProConfirmButton/index.vue.d.ts",
+      "import": "./dist/components/ProConfirmButton/index.js"
+    },
+    "./components/ProDescriptions": {
+      "types": "./dist/components/ProDescriptions/index.vue.d.ts",
+      "import": "./dist/components/ProDescriptions/index.js"
+    },
+    "./package.json": "./package.json"
+  },
+  "files": [
+    "dist",
+    "src/style.css",
+    "src/tailwind.preset.css"
+  ],
+  "publishConfig": {
+    "access": "public"
+  },
+  "sideEffects": false,
+  "peerDependencies": {
+    "tailwindcss": "^4.3.3",
+    "vue": "^3.5.17"
+  },
+  "dependencies": {
+    "class-variance-authority": "^0.7.1",
+    "clsx": "^2.1.1",
+    "lodash-es": "^4.17.21",
+    "lucide-vue-next": "^0.545.0",
+    "reka-ui": "^2.10.4",
+    "tailwind-merge": "^3.3.1",
+    "vue-sonner": "^2.0.9",
+    "@cynnie/ui-core": "^0.1.0"
+  },
+  "devDependencies": {
+    "@types/lodash-es": "^4.17.12",
+    "@vitejs/plugin-vue": "^6.0.0",
+    "@vitejs/plugin-vue-jsx": "^5.0.0",
+    "@vue/tsconfig": "^0.7.0",
+    "tailwindcss": "^4.3.3",
+    "tw-animate-css": "^1.4.0",
+    "vite": "npm:rolldown-vite@^7.3.1",
+    "vite-plugin-dts": "^4.5.4",
+    "vue": "^3.5.17",
+    "vue-tsc": "^2.2.10"
+  },
+  "scripts": {
+    "build": "vite build",
+    "format": "prettier --write src/",
+    "type-check": "vue-tsc --noEmit -p tsconfig.json"
+  }
+}

package/src/style.css

@@ -0,0 +1,14 @@
+/**
+ * SnowUI shadcn 版的全局样式（开箱即用入口）：
+ * - Tailwind CSS v4（@tailwindcss/vite 插件编译，@import "tailwindcss"）
+ * - tw-animate-css 提供 data-[state] 进出场动画工具类
+ * - 设计令牌与主题映射在同目录 tailwind.preset.css
+ *
+ * 使用方：`import "@cynnie/ui-shadcn/style.css"`。
+ * 已有自己的 Tailwind 入口、只要令牌的，用
+ * `@import "@cynnie/ui-shadcn/tailwind.preset.css"`。
+ * 与 antd / element 的 reset 样式互斥，切换 UI 模式时由使用方动态加载其一。
+ */
+@import "tailwindcss";
+@import "tw-animate-css";
+@import "./tailwind.preset.css";

package/src/tailwind.preset.css

@@ -0,0 +1,139 @@
+/**
+ * SnowUI shadcn 版的设计令牌与主题映射（不含 @import "tailwindcss"）：
+ * - shadcn 设计令牌（CSS variables，语义色 primary / destructive / muted ...）
+ * - @theme inline 把 CSS variables 映射成 Tailwind 语义色工具类
+ * - @layer base 的全局 reset
+ *
+ * 使用方二选一：
+ * 1. 已有自己的 Tailwind 入口，只要 SnowUI 令牌：
+ *    `@import "@cynnie/ui-shadcn/tailwind.preset.css";`
+ * 2. 想要开箱即用的完整样式：`import "@cynnie/ui-shadcn/style.css"`。
+ * 与 antd / element 的 reset 样式互斥，切换 UI 模式时由使用方动态加载其一。
+ */
+@custom-variant dark (&:is(.dark *));
+
+:root {
+  --radius: 0.625rem;
+  --background: oklch(1 0 0);
+  --foreground: oklch(0.141 0.005 285.823);
+  --card: oklch(1 0 0);
+  --card-foreground: oklch(0.141 0.005 285.823);
+  --popover: oklch(1 0 0);
+  --popover-foreground: oklch(0.141 0.005 285.823);
+  --primary: oklch(0.21 0.006 285.885);
+  --primary-foreground: oklch(0.985 0 0);
+  --secondary: oklch(0.967 0.001 286.375);
+  --secondary-foreground: oklch(0.21 0.006 285.885);
+  --muted: oklch(0.967 0.001 286.375);
+  --muted-foreground: oklch(0.552 0.016 285.938);
+  --accent: oklch(0.967 0.001 286.375);
+  --accent-foreground: oklch(0.21 0.006 285.885);
+  --destructive: oklch(0.577 0.245 27.325);
+  --border: oklch(0.92 0.004 286.32);
+  --input: oklch(0.92 0.004 286.32);
+  --ring: oklch(0.705 0.015 286.067);
+  --chart-1: oklch(0.646 0.222 41.116);
+  --chart-2: oklch(0.6 0.118 184.704);
+  --chart-3: oklch(0.398 0.07 227.392);
+  --chart-4: oklch(0.828 0.189 84.429);
+  --chart-5: oklch(0.769 0.188 70.08);
+  --sidebar: oklch(0.985 0 0);
+  --sidebar-foreground: oklch(0.141 0.005 285.823);
+  --sidebar-primary: oklch(0.21 0.006 285.885);
+  --sidebar-primary-foreground: oklch(0.985 0 0);
+  --sidebar-accent: oklch(0.967 0.001 286.375);
+  --sidebar-accent-foreground: oklch(0.21 0.006 285.885);
+  --sidebar-border: oklch(0.92 0.004 286.32);
+  --sidebar-ring: oklch(0.705 0.015 286.067);
+}
+
+.dark {
+  --background: oklch(0.141 0.005 285.823);
+  --foreground: oklch(0.985 0 0);
+  --card: oklch(0.21 0.006 285.885);
+  --card-foreground: oklch(0.985 0 0);
+  --popover: oklch(0.21 0.006 285.885);
+  --popover-foreground: oklch(0.985 0 0);
+  --primary: oklch(0.92 0.004 286.32);
+  --primary-foreground: oklch(0.21 0.006 285.885);
+  --secondary: oklch(0.274 0.006 286.033);
+  --secondary-foreground: oklch(0.985 0 0);
+  --muted: oklch(0.274 0.006 286.033);
+  --muted-foreground: oklch(0.705 0.015 286.067);
+  --accent: oklch(0.274 0.006 286.033);
+  --accent-foreground: oklch(0.985 0 0);
+  --destructive: oklch(0.704 0.191 22.216);
+  --border: oklch(1 0 0 / 10%);
+  --input: oklch(1 0 0 / 15%);
+  --ring: oklch(0.552 0.016 285.938);
+  --chart-1: oklch(0.488 0.243 264.376);
+  --chart-2: oklch(0.696 0.17 162.48);
+  --chart-3: oklch(0.769 0.188 70.08);
+  --chart-4: oklch(0.627 0.265 303.9);
+  --chart-5: oklch(0.645 0.246 16.439);
+  --sidebar: oklch(0.21 0.006 285.885);
+  --sidebar-foreground: oklch(0.985 0 0);
+  --sidebar-primary: oklch(0.488 0.243 264.376);
+  --sidebar-primary-foreground: oklch(0.985 0 0);
+  --sidebar-accent: oklch(0.274 0.006 286.033);
+  --sidebar-accent-foreground: oklch(0.985 0 0);
+  --sidebar-border: oklch(1 0 0 / 10%);
+  --sidebar-ring: oklch(0.552 0.016 285.938);
+}
+
+@theme inline {
+  --radius-sm: calc(var(--radius) - 4px);
+  --radius-md: calc(var(--radius) - 2px);
+  --radius-lg: var(--radius);
+  --radius-xl: calc(var(--radius) + 4px);
+  --color-background: var(--background);
+  --color-foreground: var(--foreground);
+  --color-card: var(--card);
+  --color-card-foreground: var(--card-foreground);
+  --color-popover: var(--popover);
+  --color-popover-foreground: var(--popover-foreground);
+  --color-primary: var(--primary);
+  --color-primary-foreground: var(--primary-foreground);
+  --color-secondary: var(--secondary);
+  --color-secondary-foreground: var(--secondary-foreground);
+  --color-muted: var(--muted);
+  --color-muted-foreground: var(--muted-foreground);
+  --color-accent: var(--accent);
+  --color-accent-foreground: var(--accent-foreground);
+  --color-destructive: var(--destructive);
+  --color-border: var(--border);
+  --color-input: var(--input);
+  --color-ring: var(--ring);
+  --color-chart-1: var(--chart-1);
+  --color-chart-2: var(--chart-2);
+  --color-chart-3: var(--chart-3);
+  --color-chart-4: var(--chart-4);
+  --color-chart-5: var(--chart-5);
+  --color-sidebar: var(--sidebar);
+  --color-sidebar-foreground: var(--sidebar-foreground);
+  --color-sidebar-primary: var(--sidebar-primary);
+  --color-sidebar-primary-foreground: var(--sidebar-primary-foreground);
+  --color-sidebar-accent: var(--sidebar-accent);
+  --color-sidebar-accent-foreground: var(--sidebar-accent-foreground);
+  --color-sidebar-border: var(--sidebar-border);
+  --color-sidebar-ring: var(--sidebar-ring);
+}
+
+@layer base {
+  * {
+    @apply border-border outline-ring/50;
+  }
+  body {
+    @apply bg-background text-foreground;
+  }
+}
+
+/* 独立 createApp 挂载的命令式弹窗容器：避免挂在文档流里产生滚动条位移 */
+[data-snowui-dialog-container] {
+  position: fixed;
+  top: 0;
+  left: 0;
+  width: 0;
+  height: 0;
+  overflow: visible;
+}