@robot-admin/naive-ui-components 0.4.3 → 0.4.5

package/dist/C_Draggable2.js

@@ -1,295 +1,2 @@
-import { t as export_helper_default } from "./export-helper.js";
-import { Fragment, computed, createCommentVNode, createElementBlock, createElementVNode, createVNode, defineComponent, isRef, mergeProps, nextTick, normalizeClass, openBlock, readonly, ref, renderList, renderSlot, toDisplayString, unref, withCtx } from "vue";
-import { VueDraggable } from "vue-draggable-plus";
-
-//#region src/components/C_Draggable/composables/useDraggableLayout.ts
-function useDraggableLayout(props, emit) {
-	const isDragging = ref(false);
-	const internalList = computed({
-		get: () => props.modelValue ?? [],
-		set: (value) => {
-			emit("update:modelValue", value);
-			emit("list-change", value);
-		}
-	});
-	const isEmpty = computed(() => (props.modelValue ?? []).length === 0);
-	const listClasses = computed(() => [
-		"c-draggable-list",
-		props.listClass,
-		`layout-${props.layout}`,
-		{ "flex-wrap": props.flexWrap && (props.layout === "horizontal" || props.layout === "flex-wrap") }
-	]);
-	const listStyles = computed(() => {
-		const styles = {
-			"--gap": typeof props.gap === "number" ? `${props.gap}px` : props.gap ?? "8px",
-			"--grid-columns": props.gridColumns ?? 4,
-			"--justify-content": props.justifyContent ?? "flex-start",
-			"--align-items": props.alignItems ?? "stretch",
-			...props.customStyles
-		};
-		if (props.gridRows) styles["--grid-rows"] = props.gridRows;
-		return styles;
-	});
-	const draggableOptions = computed(() => {
-		const options = {
-			disabled: props.disabled,
-			group: props.group,
-			sort: props.sort,
-			animation: props.animation,
-			delay: props.delay,
-			ghostClass: props.ghostClass,
-			chosenClass: props.chosenClass,
-			dragClass: props.dragClass,
-			swapThreshold: props.swapThreshold,
-			invertSwap: props.invertSwap,
-			direction: props.direction,
-			forceFallback: false
-		};
-		if (props.handle) options.handle = props.handle;
-		else if (props.showHandle) options.handle = ".drag-handle";
-		return options;
-	});
-	const getItemKey = (item, index) => props.itemKey ? props.itemKey(item, index) : item.id ?? index;
-	const getItemTitle = (item) => {
-		if (props.itemTitle) return props.itemTitle(item);
-		return item.title || item.name || item.label || String(item.id) || "未命名项目";
-	};
-	const getItemDescription = (item) => {
-		if (props.itemDescription) return props.itemDescription(item);
-		return item.description || "";
-	};
-	const getItemClass = (_index) => [
-		"c-draggable-item",
-		props.itemClass,
-		{ "is-disabled": props.disabled }
-	];
-	const handleStart = (event) => {
-		isDragging.value = true;
-		const item = internalList.value[event.oldIndex];
-		if (item) emit("drag-start", {
-			oldIndex: event.oldIndex,
-			newIndex: event.oldIndex,
-			item
-		});
-	};
-	const handleEnd = (event) => {
-		const item = internalList.value[event.newIndex];
-		if (item) emit("drag-end", {
-			oldIndex: event.oldIndex,
-			newIndex: event.newIndex,
-			item
-		});
-		nextTick(() => {
-			isDragging.value = false;
-		});
-	};
-	const handleAdd = (event) => {
-		const item = internalList.value[event.newIndex];
-		if (item) emit("item-add", item, event.newIndex);
-	};
-	const handleRemove = (event) => {
-		if (event.item) emit("item-remove", event.item, event.oldIndex);
-	};
-	const handleUpdate = (_event) => {};
-	const addItem = (item, index) => {
-		const list = [...internalList.value];
-		if (typeof index === "number" && index >= 0 && index <= list.length) list.splice(index, 0, item);
-		else list.push(item);
-		internalList.value = list;
-	};
-	const removeItem = (index) => {
-		if (index >= 0 && index < internalList.value.length) {
-			const list = [...internalList.value];
-			const [removed] = list.splice(index, 1);
-			internalList.value = list;
-			return removed;
-		}
-		return null;
-	};
-	const moveItem = (fromIndex, toIndex) => {
-		const list = internalList.value;
-		if (fromIndex >= 0 && fromIndex < list.length && toIndex >= 0 && toIndex < list.length && fromIndex !== toIndex) {
-			const newList = [...list];
-			const [item] = newList.splice(fromIndex, 1);
-			newList.splice(toIndex, 0, item);
-			internalList.value = newList;
-			return true;
-		}
-		return false;
-	};
-	const updateList = (newList) => {
-		internalList.value = [...newList];
-	};
-	const clear = () => {
-		internalList.value = [];
-	};
-	const getItem = (index) => internalList.value[index];
-	const findIndex = (predicate) => internalList.value.findIndex(predicate);
-	return {
-		isDragging,
-		internalList,
-		isEmpty,
-		listClasses,
-		listStyles,
-		draggableOptions,
-		getItemKey,
-		getItemTitle,
-		getItemDescription,
-		getItemClass,
-		handleStart,
-		handleEnd,
-		handleAdd,
-		handleRemove,
-		handleUpdate,
-		addItem,
-		removeItem,
-		moveItem,
-		updateList,
-		clear,
-		getItem,
-		findIndex
-	};
-}
-
-//#endregion
-//#region src/components/C_Draggable/index.vue?vue&type=script&setup=true&lang.ts
-const _hoisted_1 = ["data-index"];
-const _hoisted_2 = { class: "default-item" };
-const _hoisted_3 = {
-	key: 0,
-	class: "drag-handle"
-};
-const _hoisted_4 = { class: "item-content" };
-const _hoisted_5 = { class: "item-title" };
-const _hoisted_6 = {
-	key: 0,
-	class: "item-description"
-};
-const _hoisted_7 = {
-	key: 0,
-	class: "empty-state"
-};
-const _hoisted_8 = { class: "default-empty" };
-const _hoisted_9 = { class: "empty-text" };
-var index_vue_vue_type_script_setup_true_lang_default = /* @__PURE__ */ defineComponent({
-	name: "C_Draggable",
-	__name: "index",
-	props: {
-		modelValue: { default: () => [] },
-		disabled: {
-			type: Boolean,
-			default: false
-		},
-		group: { default: "default" },
-		sort: {
-			type: Boolean,
-			default: true
-		},
-		animation: { default: 200 },
-		delay: { default: 0 },
-		handle: { default: "" },
-		showHandle: {
-			type: Boolean,
-			default: false
-		},
-		ghostClass: { default: "sortable-ghost" },
-		chosenClass: { default: "sortable-chosen" },
-		dragClass: { default: "sortable-drag" },
-		wrapperClass: { default: "" },
-		listClass: { default: "" },
-		itemClass: { default: "" },
-		showEmptyState: {
-			type: Boolean,
-			default: true
-		},
-		emptyText: { default: "暂无数据" },
-		itemKey: {},
-		itemTitle: {},
-		itemDescription: {},
-		swapThreshold: { default: 1 },
-		invertSwap: {
-			type: Boolean,
-			default: false
-		},
-		direction: { default: "vertical" },
-		layout: { default: "vertical" },
-		gridColumns: { default: 4 },
-		gridRows: { default: void 0 },
-		gap: { default: "8px" },
-		flexWrap: {
-			type: Boolean,
-			default: false
-		},
-		justifyContent: { default: "flex-start" },
-		alignItems: { default: "stretch" },
-		customStyles: { default: () => ({}) }
-	},
-	emits: [
-		"update:modelValue",
-		"drag-start",
-		"drag-end",
-		"item-add",
-		"item-remove",
-		"list-change"
-	],
-	setup(__props, { expose: __expose, emit: __emit }) {
-		const { isDragging, internalList, isEmpty, listClasses, listStyles, draggableOptions, getItemKey, getItemTitle, getItemDescription, getItemClass, handleStart, handleEnd, handleAdd, handleRemove, handleUpdate, addItem, removeItem, moveItem, updateList, clear, getItem, findIndex } = useDraggableLayout(__props, __emit);
-		__expose({
-			isDragging: readonly(isDragging),
-			list: readonly(internalList),
-			isEmpty: readonly(isEmpty),
-			addItem,
-			removeItem,
-			moveItem,
-			updateList,
-			clear,
-			getItem,
-			findIndex
-		});
-		return (_ctx, _cache) => {
-			return openBlock(), createElementBlock("div", { class: normalizeClass(["c-draggable-wrapper", _ctx.wrapperClass]) }, [createVNode(unref(VueDraggable), mergeProps({
-				modelValue: unref(internalList),
-				"onUpdate:modelValue": _cache[0] || (_cache[0] = ($event) => isRef(internalList) ? internalList.value = $event : null)
-			}, unref(draggableOptions), {
-				class: unref(listClasses),
-				style: unref(listStyles),
-				onStart: unref(handleStart),
-				onEnd: unref(handleEnd),
-				onAdd: unref(handleAdd),
-				onRemove: unref(handleRemove),
-				onUpdate: unref(handleUpdate)
-			}), {
-				default: withCtx(() => [(openBlock(true), createElementBlock(Fragment, null, renderList(unref(internalList), (item, index) => {
-					return openBlock(), createElementBlock("div", {
-						key: unref(getItemKey)(item, index),
-						class: normalizeClass(unref(getItemClass)(index)),
-						"data-index": index
-					}, [renderSlot(_ctx.$slots, "default", {
-						item,
-						index,
-						isDragging: unref(isDragging),
-						isDisabled: _ctx.disabled
-					}, () => [createElementVNode("div", _hoisted_2, [_ctx.showHandle ? (openBlock(), createElementBlock("div", _hoisted_3, _cache[1] || (_cache[1] = [createElementVNode("div", { class: "i-mdi:drag-vertical" }, null, -1)]))) : createCommentVNode("v-if", true), createElementVNode("div", _hoisted_4, [createElementVNode("div", _hoisted_5, toDisplayString(unref(getItemTitle)(item)), 1), unref(getItemDescription)(item) ? (openBlock(), createElementBlock("div", _hoisted_6, toDisplayString(unref(getItemDescription)(item)), 1)) : createCommentVNode("v-if", true)])])], true)], 10, _hoisted_1);
-				}), 128))]),
-				_: 3
-			}, 16, [
-				"modelValue",
-				"class",
-				"style",
-				"onStart",
-				"onEnd",
-				"onAdd",
-				"onRemove",
-				"onUpdate"
-			]), unref(isEmpty) && _ctx.showEmptyState ? (openBlock(), createElementBlock("div", _hoisted_7, [renderSlot(_ctx.$slots, "empty", {}, () => [createElementVNode("div", _hoisted_8, [_cache[2] || (_cache[2] = createElementVNode("div", { class: "empty-icon i-mdi:inbox-outline" }, null, -1)), createElementVNode("p", _hoisted_9, toDisplayString(_ctx.emptyText), 1)])], true)])) : createCommentVNode("v-if", true)], 2);
-		};
-	}
-});
-
-//#endregion
-//#region src/components/C_Draggable/index.vue
-var C_Draggable_default = /* @__PURE__ */ export_helper_default(index_vue_vue_type_script_setup_true_lang_default, [["__scopeId", "data-v-2c965573"]]);
-
-//#endregion
-export { useDraggableLayout as n, C_Draggable_default as t };
+import{t as e}from"./export-helper.js";import{Fragment as t,computed as n,createCommentVNode as r,createElementBlock as i,createElementVNode as a,createVNode as o,defineComponent as s,isRef as c,mergeProps as l,nextTick as u,normalizeClass as d,openBlock as f,readonly as p,ref as m,renderList as h,renderSlot as g,toDisplayString as _,unref as v,withCtx as y}from"vue";import{VueDraggable as b}from"vue-draggable-plus";function x(e,t){let r=m(!1),i=n({get:()=>e.modelValue??[],set:e=>{t(`update:modelValue`,e),t(`list-change`,e)}});return{isDragging:r,internalList:i,isEmpty:n(()=>(e.modelValue??[]).length===0),listClasses:n(()=>[`c-draggable-list`,e.listClass,`layout-${e.layout}`,{"flex-wrap":e.flexWrap&&(e.layout===`horizontal`||e.layout===`flex-wrap`)}]),listStyles:n(()=>{let t={"--gap":typeof e.gap==`number`?`${e.gap}px`:e.gap??`8px`,"--grid-columns":e.gridColumns??4,"--justify-content":e.justifyContent??`flex-start`,"--align-items":e.alignItems??`stretch`,...e.customStyles};return e.gridRows&&(t[`--grid-rows`]=e.gridRows),t}),draggableOptions:n(()=>{let t={disabled:e.disabled,group:e.group,sort:e.sort,animation:e.animation,delay:e.delay,ghostClass:e.ghostClass,chosenClass:e.chosenClass,dragClass:e.dragClass,swapThreshold:e.swapThreshold,invertSwap:e.invertSwap,direction:e.direction,forceFallback:!1};return e.handle?t.handle=e.handle:e.showHandle&&(t.handle=`.drag-handle`),t}),getItemKey:(t,n)=>e.itemKey?e.itemKey(t,n):t.id??n,getItemTitle:t=>e.itemTitle?e.itemTitle(t):t.title||t.name||t.label||String(t.id)||`未命名项目`,getItemDescription:t=>e.itemDescription?e.itemDescription(t):t.description||``,getItemClass:t=>[`c-draggable-item`,e.itemClass,{"is-disabled":e.disabled}],handleStart:e=>{r.value=!0;let n=i.value[e.oldIndex];n&&t(`drag-start`,{oldIndex:e.oldIndex,newIndex:e.oldIndex,item:n})},handleEnd:e=>{let n=i.value[e.newIndex];n&&t(`drag-end`,{oldIndex:e.oldIndex,newIndex:e.newIndex,item:n}),u(()=>{r.value=!1})},handleAdd:e=>{let n=i.value[e.newIndex];n&&t(`item-add`,n,e.newIndex)},handleRemove:e=>{e.item&&t(`item-remove`,e.item,e.oldIndex)},handleUpdate:e=>{},addItem:(e,t)=>{let n=[...i.value];typeof t==`number`&&t>=0&&t<=n.length?n.splice(t,0,e):n.push(e),i.value=n},removeItem:e=>{if(e>=0&&e<i.value.length){let t=[...i.value],[n]=t.splice(e,1);return i.value=t,n}return null},moveItem:(e,t)=>{let n=i.value;if(e>=0&&e<n.length&&t>=0&&t<n.length&&e!==t){let r=[...n],[a]=r.splice(e,1);return r.splice(t,0,a),i.value=r,!0}return!1},updateList:e=>{i.value=[...e]},clear:()=>{i.value=[]},getItem:e=>i.value[e],findIndex:e=>i.value.findIndex(e)}}const S=[`data-index`],C={class:`default-item`},w={key:0,class:`drag-handle`},T={class:`item-content`},E={class:`item-title`},D={key:0,class:`item-description`},O={key:0,class:`empty-state`},k={class:`default-empty`},A={class:`empty-text`};var j=e(s({name:`C_Draggable`,__name:`index`,props:{modelValue:{default:()=>[]},disabled:{type:Boolean,default:!1},group:{default:`default`},sort:{type:Boolean,default:!0},animation:{default:200},delay:{default:0},handle:{default:``},showHandle:{type:Boolean,default:!1},ghostClass:{default:`sortable-ghost`},chosenClass:{default:`sortable-chosen`},dragClass:{default:`sortable-drag`},wrapperClass:{default:``},listClass:{default:``},itemClass:{default:``},showEmptyState:{type:Boolean,default:!0},emptyText:{default:`暂无数据`},itemKey:{},itemTitle:{},itemDescription:{},swapThreshold:{default:1},invertSwap:{type:Boolean,default:!1},direction:{default:`vertical`},layout:{default:`vertical`},gridColumns:{default:4},gridRows:{default:void 0},gap:{default:`8px`},flexWrap:{type:Boolean,default:!1},justifyContent:{default:`flex-start`},alignItems:{default:`stretch`},customStyles:{default:()=>({})}},emits:[`update:modelValue`,`drag-start`,`drag-end`,`item-add`,`item-remove`,`list-change`],setup(e,{expose:n,emit:s}){let{isDragging:u,internalList:m,isEmpty:j,listClasses:M,listStyles:N,draggableOptions:P,getItemKey:F,getItemTitle:I,getItemDescription:L,getItemClass:R,handleStart:z,handleEnd:B,handleAdd:V,handleRemove:H,handleUpdate:U,addItem:W,removeItem:G,moveItem:K,updateList:q,clear:J,getItem:Y,findIndex:X}=x(e,s);return n({isDragging:p(u),list:p(m),isEmpty:p(j),addItem:W,removeItem:G,moveItem:K,updateList:q,clear:J,getItem:Y,findIndex:X}),(e,n)=>(f(),i(`div`,{class:d([`c-draggable-wrapper`,e.wrapperClass])},[o(v(b),l({modelValue:v(m),"onUpdate:modelValue":n[0]||=e=>c(m)?m.value=e:null},v(P),{class:v(M),style:v(N),onStart:v(z),onEnd:v(B),onAdd:v(V),onRemove:v(H),onUpdate:v(U)}),{default:y(()=>[(f(!0),i(t,null,h(v(m),(t,o)=>(f(),i(`div`,{key:v(F)(t,o),class:d(v(R)(o)),"data-index":o},[g(e.$slots,`default`,{item:t,index:o,isDragging:v(u),isDisabled:e.disabled},()=>[a(`div`,C,[e.showHandle?(f(),i(`div`,w,n[1]||=[a(`div`,{class:`i-mdi:drag-vertical`},null,-1)])):r(`v-if`,!0),a(`div`,T,[a(`div`,E,_(v(I)(t)),1),v(L)(t)?(f(),i(`div`,D,_(v(L)(t)),1)):r(`v-if`,!0)])])],!0)],10,S))),128))]),_:3},16,[`modelValue`,`class`,`style`,`onStart`,`onEnd`,`onAdd`,`onRemove`,`onUpdate`]),v(j)&&e.showEmptyState?(f(),i(`div`,O,[g(e.$slots,`empty`,{},()=>[a(`div`,k,[n[2]||=a(`div`,{class:`empty-icon i-mdi:inbox-outline`},null,-1),a(`p`,A,_(e.emptyText),1)])],!0)])):r(`v-if`,!0)],2))}}),[[`__scopeId`,`data-v-2c965573`]]);export{x as n,j as t};
 //# sourceMappingURL=C_Draggable2.js.map

package/dist/C_Draggable2.js.map

@@ -1 +1 @@
-{"version":3,"file":"C_Draggable2.js","names":["wrapperClass","disabled","showHandle","showEmptyState","emptyText"],"sources":["../src/components/C_Draggable/composables/useDraggableLayout.ts","../src/components/C_Draggable/index.vue","../src/components/C_Draggable/index.vue","../src/components/C_Draggable/index.vue"],"sourcesContent":["import { ref, computed, nextTick } from \"vue\";\r\nimport type { DraggableItem, DragEvent, DraggableProps } from \"../types\";\r\n\r\ntype EmitFn = {\r\n  (event: \"update:modelValue\", value: DraggableItem[]): void;\r\n  (event: \"drag-start\", dragEvent: DragEvent): void;\r\n  (event: \"drag-end\", dragEvent: DragEvent): void;\r\n  (event: \"item-add\", item: DraggableItem, index: number): void;\r\n  (event: \"item-remove\", item: DraggableItem, index: number): void;\r\n  (event: \"list-change\", list: DraggableItem[]): void;\r\n};\r\n\r\nexport function useDraggableLayout(props: DraggableProps, emit: EmitFn) {\r\n  const isDragging = ref(false);\r\n\r\n  const internalList = computed({\r\n    get: () => props.modelValue ?? [],\r\n    set: (value: DraggableItem[]) => {\r\n      emit(\"update:modelValue\", value);\r\n      emit(\"list-change\", value);\r\n    },\r\n  });\r\n\r\n  const isEmpty = computed(() => (props.modelValue ?? []).length === 0);\r\n\r\n  const listClasses = computed(() => [\r\n    \"c-draggable-list\",\r\n    props.listClass,\r\n    `layout-${props.layout}`,\r\n    {\r\n      \"flex-wrap\":\r\n        props.flexWrap &&\r\n        (props.layout === \"horizontal\" || props.layout === \"flex-wrap\"),\r\n    },\r\n  ]);\r\n\r\n  const listStyles = computed(() => {\r\n    const styles: Record<string, string | number> = {\r\n      \"--gap\":\r\n        typeof props.gap === \"number\" ? `${props.gap}px` : (props.gap ?? \"8px\"),\r\n      \"--grid-columns\": props.gridColumns ?? 4,\r\n      \"--justify-content\": props.justifyContent ?? \"flex-start\",\r\n      \"--align-items\": props.alignItems ?? \"stretch\",\r\n      ...props.customStyles,\r\n    };\r\n    if (props.gridRows) {\r\n      styles[\"--grid-rows\"] = props.gridRows;\r\n    }\r\n    return styles;\r\n  });\r\n\r\n  const draggableOptions = computed(() => {\r\n    const options: Record<string, any> = {\r\n      disabled: props.disabled,\r\n      group: props.group,\r\n      sort: props.sort,\r\n      animation: props.animation,\r\n      delay: props.delay,\r\n      ghostClass: props.ghostClass,\r\n      chosenClass: props.chosenClass,\r\n      dragClass: props.dragClass,\r\n      swapThreshold: props.swapThreshold,\r\n      invertSwap: props.invertSwap,\r\n      direction: props.direction,\r\n      forceFallback: false,\r\n    };\r\n    if (props.handle) {\r\n      options.handle = props.handle;\r\n    } else if (props.showHandle) {\r\n      options.handle = \".drag-handle\";\r\n    }\r\n    return options;\r\n  });\r\n\r\n  const getItemKey = (item: DraggableItem, index: number): string | number =>\r\n    props.itemKey ? props.itemKey(item, index) : (item.id ?? index);\r\n\r\n  const getItemTitle = (item: DraggableItem): string => {\r\n    if (props.itemTitle) return props.itemTitle(item);\r\n    return (\r\n      item.title || item.name || item.label || String(item.id) || \"未命名项目\"\r\n    );\r\n  };\r\n\r\n  const getItemDescription = (item: DraggableItem): string => {\r\n    if (props.itemDescription) return props.itemDescription(item);\r\n    return item.description || \"\";\r\n  };\r\n\r\n  const getItemClass = (_index: number) => [\r\n    \"c-draggable-item\",\r\n    props.itemClass,\r\n    { \"is-disabled\": props.disabled },\r\n  ];\r\n\r\n  const handleStart = (event: any) => {\r\n    isDragging.value = true;\r\n    const item = internalList.value[event.oldIndex];\r\n    if (item) {\r\n      emit(\"drag-start\", {\r\n        oldIndex: event.oldIndex,\r\n        newIndex: event.oldIndex,\r\n        item,\r\n      } as DragEvent);\r\n    }\r\n  };\r\n\r\n  const handleEnd = (event: any) => {\r\n    const item = internalList.value[event.newIndex];\r\n    if (item) {\r\n      emit(\"drag-end\", {\r\n        oldIndex: event.oldIndex,\r\n        newIndex: event.newIndex,\r\n        item,\r\n      } as DragEvent);\r\n    }\r\n    nextTick(() => {\r\n      isDragging.value = false;\r\n    });\r\n  };\r\n\r\n  const handleAdd = (event: any) => {\r\n    const item = internalList.value[event.newIndex];\r\n    if (item) emit(\"item-add\", item, event.newIndex);\r\n  };\r\n\r\n  const handleRemove = (event: any) => {\r\n    if (event.item) emit(\"item-remove\", event.item, event.oldIndex);\r\n  };\r\n\r\n  const handleUpdate = (_event: any) => {};\r\n\r\n  const addItem = (item: DraggableItem, index?: number): void => {\r\n    const list = [...internalList.value];\r\n    if (typeof index === \"number\" && index >= 0 && index <= list.length) {\r\n      list.splice(index, 0, item);\r\n    } else {\r\n      list.push(item);\r\n    }\r\n    internalList.value = list;\r\n  };\r\n\r\n  const removeItem = (index: number): DraggableItem | null => {\r\n    if (index >= 0 && index < internalList.value.length) {\r\n      const list = [...internalList.value];\r\n      const [removed] = list.splice(index, 1);\r\n      internalList.value = list;\r\n      return removed;\r\n    }\r\n    return null;\r\n  };\r\n\r\n  const moveItem = (fromIndex: number, toIndex: number): boolean => {\r\n    const list = internalList.value;\r\n    if (\r\n      fromIndex >= 0 &&\r\n      fromIndex < list.length &&\r\n      toIndex >= 0 &&\r\n      toIndex < list.length &&\r\n      fromIndex !== toIndex\r\n    ) {\r\n      const newList = [...list];\r\n      const [item] = newList.splice(fromIndex, 1);\r\n      newList.splice(toIndex, 0, item);\r\n      internalList.value = newList;\r\n      return true;\r\n    }\r\n    return false;\r\n  };\r\n\r\n  const updateList = (newList: DraggableItem[]): void => {\r\n    internalList.value = [...newList];\r\n  };\r\n\r\n  const clear = (): void => {\r\n    internalList.value = [];\r\n  };\r\n\r\n  const getItem = (index: number): DraggableItem | undefined =>\r\n    internalList.value[index];\r\n\r\n  const findIndex = (predicate: (item: DraggableItem) => boolean): number =>\r\n    internalList.value.findIndex(predicate);\r\n\r\n  return {\r\n    isDragging,\r\n    internalList,\r\n    isEmpty,\r\n    listClasses,\r\n    listStyles,\r\n    draggableOptions,\r\n    getItemKey,\r\n    getItemTitle,\r\n    getItemDescription,\r\n    getItemClass,\r\n    handleStart,\r\n    handleEnd,\r\n    handleAdd,\r\n    handleRemove,\r\n    handleUpdate,\r\n    addItem,\r\n    removeItem,\r\n    moveItem,\r\n    updateList,\r\n    clear,\r\n    getItem,\r\n    findIndex,\r\n  };\r\n}\r\n","/* unplugin-vue-components disabled */<!--\r\n * @Author: ChenYu ycyplus@gmail.com\r\n * @Date: 2025-06-25\r\n * @Description: 拖拽组件 - 基于 vue-draggable-plus 封装（薄 UI 壳 + useDraggableLayout 引擎）\r\n * @Migration: naive-ui-components 组件库迁移版本\r\n * Copyright (c) 2025 by CHENY, All Rights Reserved.\r\n-->\r\n<template>\r\n  <div class=\"c-draggable-wrapper\" :class=\"wrapperClass\">\r\n    <VueDraggable\r\n      v-model=\"internalList\"\r\n      v-bind=\"draggableOptions\"\r\n      :class=\"listClasses\"\r\n      :style=\"listStyles\"\r\n      @start=\"handleStart\"\r\n      @end=\"handleEnd\"\r\n      @add=\"handleAdd\"\r\n      @remove=\"handleRemove\"\r\n      @update=\"handleUpdate\"\r\n    >\r\n      <div\r\n        v-for=\"(item, index) in internalList\"\r\n        :key=\"getItemKey(item, index)\"\r\n        :class=\"getItemClass(index)\"\r\n        :data-index=\"index\"\r\n      >\r\n        <slot\r\n          :item=\"item\"\r\n          :index=\"index\"\r\n          :is-dragging=\"isDragging\"\r\n          :is-disabled=\"disabled\"\r\n        >\r\n          <div class=\"default-item\">\r\n            <div v-if=\"showHandle\" class=\"drag-handle\">\r\n              <div class=\"i-mdi:drag-vertical\"></div>\r\n            </div>\r\n            <div class=\"item-content\">\r\n              <div class=\"item-title\">{{ getItemTitle(item) }}</div>\r\n              <div v-if=\"getItemDescription(item)\" class=\"item-description\">\r\n                {{ getItemDescription(item) }}\r\n              </div>\r\n            </div>\r\n          </div>\r\n        </slot>\r\n      </div>\r\n    </VueDraggable>\r\n\r\n    <div v-if=\"isEmpty && showEmptyState\" class=\"empty-state\">\r\n      <slot name=\"empty\">\r\n        <div class=\"default-empty\">\r\n          <div class=\"empty-icon i-mdi:inbox-outline\"></div>\r\n          <p class=\"empty-text\">{{ emptyText }}</p>\r\n        </div>\r\n      </slot>\r\n    </div>\r\n  </div>\r\n</template>\r\n\r\n<script setup lang=\"ts\">\r\nimport { readonly } from \"vue\";\r\nimport { VueDraggable } from \"vue-draggable-plus\";\r\nimport { useDraggableLayout } from \"./composables/useDraggableLayout\";\r\nimport type { DraggableProps, DraggableEmits } from \"./types\";\r\n\r\ndefineOptions({ name: \"C_Draggable\" });\r\n\r\nconst props = withDefaults(defineProps<DraggableProps>(), {\r\n  modelValue: () => [],\r\n  disabled: false,\r\n  group: \"default\",\r\n  sort: true,\r\n  animation: 200,\r\n  delay: 0,\r\n  handle: \"\",\r\n  showHandle: false,\r\n  ghostClass: \"sortable-ghost\",\r\n  chosenClass: \"sortable-chosen\",\r\n  dragClass: \"sortable-drag\",\r\n  wrapperClass: \"\",\r\n  listClass: \"\",\r\n  itemClass: \"\",\r\n  showEmptyState: true,\r\n  emptyText: \"暂无数据\",\r\n  swapThreshold: 1,\r\n  invertSwap: false,\r\n  direction: \"vertical\",\r\n  layout: \"vertical\",\r\n  gridColumns: 4,\r\n  gridRows: undefined,\r\n  gap: \"8px\",\r\n  flexWrap: false,\r\n  justifyContent: \"flex-start\",\r\n  alignItems: \"stretch\",\r\n  customStyles: () => ({}),\r\n});\r\n\r\nconst emit = defineEmits<DraggableEmits>();\r\n\r\nconst {\r\n  isDragging,\r\n  internalList,\r\n  isEmpty,\r\n  listClasses,\r\n  listStyles,\r\n  draggableOptions,\r\n  getItemKey,\r\n  getItemTitle,\r\n  getItemDescription,\r\n  getItemClass,\r\n  handleStart,\r\n  handleEnd,\r\n  handleAdd,\r\n  handleRemove,\r\n  handleUpdate,\r\n  addItem,\r\n  removeItem,\r\n  moveItem,\r\n  updateList,\r\n  clear,\r\n  getItem,\r\n  findIndex,\r\n} = useDraggableLayout(props, emit);\r\n\r\ndefineExpose({\r\n  isDragging: readonly(isDragging),\r\n  list: readonly(internalList),\r\n  isEmpty: readonly(isEmpty),\r\n  addItem,\r\n  removeItem,\r\n  moveItem,\r\n  updateList,\r\n  clear,\r\n  getItem,\r\n  findIndex,\r\n});\r\n</script>\r\n\r\n<style lang=\"scss\" scoped>\r\n@use \"./index.scss\";\r\n</style>\r\n","/* unplugin-vue-components disabled */<!--\r\n * @Author: ChenYu ycyplus@gmail.com\r\n * @Date: 2025-06-25\r\n * @Description: 拖拽组件 - 基于 vue-draggable-plus 封装（薄 UI 壳 + useDraggableLayout 引擎）\r\n * @Migration: naive-ui-components 组件库迁移版本\r\n * Copyright (c) 2025 by CHENY, All Rights Reserved.\r\n-->\r\n<template>\r\n  <div class=\"c-draggable-wrapper\" :class=\"wrapperClass\">\r\n    <VueDraggable\r\n      v-model=\"internalList\"\r\n      v-bind=\"draggableOptions\"\r\n      :class=\"listClasses\"\r\n      :style=\"listStyles\"\r\n      @start=\"handleStart\"\r\n      @end=\"handleEnd\"\r\n      @add=\"handleAdd\"\r\n      @remove=\"handleRemove\"\r\n      @update=\"handleUpdate\"\r\n    >\r\n      <div\r\n        v-for=\"(item, index) in internalList\"\r\n        :key=\"getItemKey(item, index)\"\r\n        :class=\"getItemClass(index)\"\r\n        :data-index=\"index\"\r\n      >\r\n        <slot\r\n          :item=\"item\"\r\n          :index=\"index\"\r\n          :is-dragging=\"isDragging\"\r\n          :is-disabled=\"disabled\"\r\n        >\r\n          <div class=\"default-item\">\r\n            <div v-if=\"showHandle\" class=\"drag-handle\">\r\n              <div class=\"i-mdi:drag-vertical\"></div>\r\n            </div>\r\n            <div class=\"item-content\">\r\n              <div class=\"item-title\">{{ getItemTitle(item) }}</div>\r\n              <div v-if=\"getItemDescription(item)\" class=\"item-description\">\r\n                {{ getItemDescription(item) }}\r\n              </div>\r\n            </div>\r\n          </div>\r\n        </slot>\r\n      </div>\r\n    </VueDraggable>\r\n\r\n    <div v-if=\"isEmpty && showEmptyState\" class=\"empty-state\">\r\n      <slot name=\"empty\">\r\n        <div class=\"default-empty\">\r\n          <div class=\"empty-icon i-mdi:inbox-outline\"></div>\r\n          <p class=\"empty-text\">{{ emptyText }}</p>\r\n        </div>\r\n      </slot>\r\n    </div>\r\n  </div>\r\n</template>\r\n\r\n<script setup lang=\"ts\">\r\nimport { readonly } from \"vue\";\r\nimport { VueDraggable } from \"vue-draggable-plus\";\r\nimport { useDraggableLayout } from \"./composables/useDraggableLayout\";\r\nimport type { DraggableProps, DraggableEmits } from \"./types\";\r\n\r\ndefineOptions({ name: \"C_Draggable\" });\r\n\r\nconst props = withDefaults(defineProps<DraggableProps>(), {\r\n  modelValue: () => [],\r\n  disabled: false,\r\n  group: \"default\",\r\n  sort: true,\r\n  animation: 200,\r\n  delay: 0,\r\n  handle: \"\",\r\n  showHandle: false,\r\n  ghostClass: \"sortable-ghost\",\r\n  chosenClass: \"sortable-chosen\",\r\n  dragClass: \"sortable-drag\",\r\n  wrapperClass: \"\",\r\n  listClass: \"\",\r\n  itemClass: \"\",\r\n  showEmptyState: true,\r\n  emptyText: \"暂无数据\",\r\n  swapThreshold: 1,\r\n  invertSwap: false,\r\n  direction: \"vertical\",\r\n  layout: \"vertical\",\r\n  gridColumns: 4,\r\n  gridRows: undefined,\r\n  gap: \"8px\",\r\n  flexWrap: false,\r\n  justifyContent: \"flex-start\",\r\n  alignItems: \"stretch\",\r\n  customStyles: () => ({}),\r\n});\r\n\r\nconst emit = defineEmits<DraggableEmits>();\r\n\r\nconst {\r\n  isDragging,\r\n  internalList,\r\n  isEmpty,\r\n  listClasses,\r\n  listStyles,\r\n  draggableOptions,\r\n  getItemKey,\r\n  getItemTitle,\r\n  getItemDescription,\r\n  getItemClass,\r\n  handleStart,\r\n  handleEnd,\r\n  handleAdd,\r\n  handleRemove,\r\n  handleUpdate,\r\n  addItem,\r\n  removeItem,\r\n  moveItem,\r\n  updateList,\r\n  clear,\r\n  getItem,\r\n  findIndex,\r\n} = useDraggableLayout(props, emit);\r\n\r\ndefineExpose({\r\n  isDragging: readonly(isDragging),\r\n  list: readonly(internalList),\r\n  isEmpty: readonly(isEmpty),\r\n  addItem,\r\n  removeItem,\r\n  moveItem,\r\n  updateList,\r\n  clear,\r\n  getItem,\r\n  findIndex,\r\n});\r\n</script>\r\n\r\n<style lang=\"scss\" scoped>\r\n@use \"./index.scss\";\r\n</style>\r\n","<!--\r\n * @Author: ChenYu ycyplus@gmail.com\r\n * @Date: 2025-06-25\r\n * @Description: 拖拽组件 - 基于 vue-draggable-plus 封装（薄 UI 壳 + useDraggableLayout 引擎）\r\n * @Migration: naive-ui-components 组件库迁移版本\r\n * Copyright (c) 2025 by CHENY, All Rights Reserved.\r\n-->\r\n<template>\r\n  <div class=\"c-draggable-wrapper\" :class=\"wrapperClass\">\r\n    <VueDraggable\r\n      v-model=\"internalList\"\r\n      v-bind=\"draggableOptions\"\r\n      :class=\"listClasses\"\r\n      :style=\"listStyles\"\r\n      @start=\"handleStart\"\r\n      @end=\"handleEnd\"\r\n      @add=\"handleAdd\"\r\n      @remove=\"handleRemove\"\r\n      @update=\"handleUpdate\"\r\n    >\r\n      <div\r\n        v-for=\"(item, index) in internalList\"\r\n        :key=\"getItemKey(item, index)\"\r\n        :class=\"getItemClass(index)\"\r\n        :data-index=\"index\"\r\n      >\r\n        <slot\r\n          :item=\"item\"\r\n          :index=\"index\"\r\n          :is-dragging=\"isDragging\"\r\n          :is-disabled=\"disabled\"\r\n        >\r\n          <div class=\"default-item\">\r\n            <div v-if=\"showHandle\" class=\"drag-handle\">\r\n              <div class=\"i-mdi:drag-vertical\"></div>\r\n            </div>\r\n            <div class=\"item-content\">\r\n              <div class=\"item-title\">{{ getItemTitle(item) }}</div>\r\n              <div v-if=\"getItemDescription(item)\" class=\"item-description\">\r\n                {{ getItemDescription(item) }}\r\n              </div>\r\n            </div>\r\n          </div>\r\n        </slot>\r\n      </div>\r\n    </VueDraggable>\r\n\r\n    <div v-if=\"isEmpty && showEmptyState\" class=\"empty-state\">\r\n      <slot name=\"empty\">\r\n        <div class=\"default-empty\">\r\n          <div class=\"empty-icon i-mdi:inbox-outline\"></div>\r\n          <p class=\"empty-text\">{{ emptyText }}</p>\r\n        </div>\r\n      </slot>\r\n    </div>\r\n  </div>\r\n</template>\r\n\r\n<script setup lang=\"ts\">\r\nimport { readonly } from \"vue\";\r\nimport { VueDraggable } from \"vue-draggable-plus\";\r\nimport { useDraggableLayout } from \"./composables/useDraggableLayout\";\r\nimport type { DraggableProps, DraggableEmits } from \"./types\";\r\n\r\ndefineOptions({ name: \"C_Draggable\" });\r\n\r\nconst props = withDefaults(defineProps<DraggableProps>(), {\r\n  modelValue: () => [],\r\n  disabled: false,\r\n  group: \"default\",\r\n  sort: true,\r\n  animation: 200,\r\n  delay: 0,\r\n  handle: \"\",\r\n  showHandle: false,\r\n  ghostClass: \"sortable-ghost\",\r\n  chosenClass: \"sortable-chosen\",\r\n  dragClass: \"sortable-drag\",\r\n  wrapperClass: \"\",\r\n  listClass: \"\",\r\n  itemClass: \"\",\r\n  showEmptyState: true,\r\n  emptyText: \"暂无数据\",\r\n  swapThreshold: 1,\r\n  invertSwap: false,\r\n  direction: \"vertical\",\r\n  layout: \"vertical\",\r\n  gridColumns: 4,\r\n  gridRows: undefined,\r\n  gap: \"8px\",\r\n  flexWrap: false,\r\n  justifyContent: \"flex-start\",\r\n  alignItems: \"stretch\",\r\n  customStyles: () => ({}),\r\n});\r\n\r\nconst emit = defineEmits<DraggableEmits>();\r\n\r\nconst {\r\n  isDragging,\r\n  internalList,\r\n  isEmpty,\r\n  listClasses,\r\n  listStyles,\r\n  draggableOptions,\r\n  getItemKey,\r\n  getItemTitle,\r\n  getItemDescription,\r\n  getItemClass,\r\n  handleStart,\r\n  handleEnd,\r\n  handleAdd,\r\n  handleRemove,\r\n  handleUpdate,\r\n  addItem,\r\n  removeItem,\r\n  moveItem,\r\n  updateList,\r\n  clear,\r\n  getItem,\r\n  findIndex,\r\n} = useDraggableLayout(props, emit);\r\n\r\ndefineExpose({\r\n  isDragging: readonly(isDragging),\r\n  list: readonly(internalList),\r\n  isEmpty: readonly(isEmpty),\r\n  addItem,\r\n  removeItem,\r\n  moveItem,\r\n  updateList,\r\n  clear,\r\n  getItem,\r\n  findIndex,\r\n});\r\n</script>\r\n\r\n<style lang=\"scss\" scoped>\r\n@use \"./index.scss\";\r\n</style>\r\n"],"mappings":"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"}
+{"version":3,"file":"C_Draggable2.js","names":["wrapperClass","disabled","showHandle","showEmptyState","emptyText"],"sources":["../src/components/C_Draggable/composables/useDraggableLayout.ts","../src/components/C_Draggable/index.vue","../src/components/C_Draggable/index.vue","../src/components/C_Draggable/index.vue"],"sourcesContent":["import { ref, computed, nextTick } from \"vue\";\r\nimport type { DraggableItem, DragEvent, DraggableProps } from \"../types\";\r\n\r\ntype EmitFn = {\r\n  (event: \"update:modelValue\", value: DraggableItem[]): void;\r\n  (event: \"drag-start\", dragEvent: DragEvent): void;\r\n  (event: \"drag-end\", dragEvent: DragEvent): void;\r\n  (event: \"item-add\", item: DraggableItem, index: number): void;\r\n  (event: \"item-remove\", item: DraggableItem, index: number): void;\r\n  (event: \"list-change\", list: DraggableItem[]): void;\r\n};\r\n\r\nexport function useDraggableLayout(props: DraggableProps, emit: EmitFn) {\r\n  const isDragging = ref(false);\r\n\r\n  const internalList = computed({\r\n    get: () => props.modelValue ?? [],\r\n    set: (value: DraggableItem[]) => {\r\n      emit(\"update:modelValue\", value);\r\n      emit(\"list-change\", value);\r\n    },\r\n  });\r\n\r\n  const isEmpty = computed(() => (props.modelValue ?? []).length === 0);\r\n\r\n  const listClasses = computed(() => [\r\n    \"c-draggable-list\",\r\n    props.listClass,\r\n    `layout-${props.layout}`,\r\n    {\r\n      \"flex-wrap\":\r\n        props.flexWrap &&\r\n        (props.layout === \"horizontal\" || props.layout === \"flex-wrap\"),\r\n    },\r\n  ]);\r\n\r\n  const listStyles = computed(() => {\r\n    const styles: Record<string, string | number> = {\r\n      \"--gap\":\r\n        typeof props.gap === \"number\" ? `${props.gap}px` : (props.gap ?? \"8px\"),\r\n      \"--grid-columns\": props.gridColumns ?? 4,\r\n      \"--justify-content\": props.justifyContent ?? \"flex-start\",\r\n      \"--align-items\": props.alignItems ?? \"stretch\",\r\n      ...props.customStyles,\r\n    };\r\n    if (props.gridRows) {\r\n      styles[\"--grid-rows\"] = props.gridRows;\r\n    }\r\n    return styles;\r\n  });\r\n\r\n  const draggableOptions = computed(() => {\r\n    const options: Record<string, any> = {\r\n      disabled: props.disabled,\r\n      group: props.group,\r\n      sort: props.sort,\r\n      animation: props.animation,\r\n      delay: props.delay,\r\n      ghostClass: props.ghostClass,\r\n      chosenClass: props.chosenClass,\r\n      dragClass: props.dragClass,\r\n      swapThreshold: props.swapThreshold,\r\n      invertSwap: props.invertSwap,\r\n      direction: props.direction,\r\n      forceFallback: false,\r\n    };\r\n    if (props.handle) {\r\n      options.handle = props.handle;\r\n    } else if (props.showHandle) {\r\n      options.handle = \".drag-handle\";\r\n    }\r\n    return options;\r\n  });\r\n\r\n  const getItemKey = (item: DraggableItem, index: number): string | number =>\r\n    props.itemKey ? props.itemKey(item, index) : (item.id ?? index);\r\n\r\n  const getItemTitle = (item: DraggableItem): string => {\r\n    if (props.itemTitle) return props.itemTitle(item);\r\n    return (\r\n      item.title || item.name || item.label || String(item.id) || \"未命名项目\"\r\n    );\r\n  };\r\n\r\n  const getItemDescription = (item: DraggableItem): string => {\r\n    if (props.itemDescription) return props.itemDescription(item);\r\n    return item.description || \"\";\r\n  };\r\n\r\n  const getItemClass = (_index: number) => [\r\n    \"c-draggable-item\",\r\n    props.itemClass,\r\n    { \"is-disabled\": props.disabled },\r\n  ];\r\n\r\n  const handleStart = (event: any) => {\r\n    isDragging.value = true;\r\n    const item = internalList.value[event.oldIndex];\r\n    if (item) {\r\n      emit(\"drag-start\", {\r\n        oldIndex: event.oldIndex,\r\n        newIndex: event.oldIndex,\r\n        item,\r\n      } as DragEvent);\r\n    }\r\n  };\r\n\r\n  const handleEnd = (event: any) => {\r\n    const item = internalList.value[event.newIndex];\r\n    if (item) {\r\n      emit(\"drag-end\", {\r\n        oldIndex: event.oldIndex,\r\n        newIndex: event.newIndex,\r\n        item,\r\n      } as DragEvent);\r\n    }\r\n    nextTick(() => {\r\n      isDragging.value = false;\r\n    });\r\n  };\r\n\r\n  const handleAdd = (event: any) => {\r\n    const item = internalList.value[event.newIndex];\r\n    if (item) emit(\"item-add\", item, event.newIndex);\r\n  };\r\n\r\n  const handleRemove = (event: any) => {\r\n    if (event.item) emit(\"item-remove\", event.item, event.oldIndex);\r\n  };\r\n\r\n  const handleUpdate = (_event: any) => {};\r\n\r\n  const addItem = (item: DraggableItem, index?: number): void => {\r\n    const list = [...internalList.value];\r\n    if (typeof index === \"number\" && index >= 0 && index <= list.length) {\r\n      list.splice(index, 0, item);\r\n    } else {\r\n      list.push(item);\r\n    }\r\n    internalList.value = list;\r\n  };\r\n\r\n  const removeItem = (index: number): DraggableItem | null => {\r\n    if (index >= 0 && index < internalList.value.length) {\r\n      const list = [...internalList.value];\r\n      const [removed] = list.splice(index, 1);\r\n      internalList.value = list;\r\n      return removed;\r\n    }\r\n    return null;\r\n  };\r\n\r\n  const moveItem = (fromIndex: number, toIndex: number): boolean => {\r\n    const list = internalList.value;\r\n    if (\r\n      fromIndex >= 0 &&\r\n      fromIndex < list.length &&\r\n      toIndex >= 0 &&\r\n      toIndex < list.length &&\r\n      fromIndex !== toIndex\r\n    ) {\r\n      const newList = [...list];\r\n      const [item] = newList.splice(fromIndex, 1);\r\n      newList.splice(toIndex, 0, item);\r\n      internalList.value = newList;\r\n      return true;\r\n    }\r\n    return false;\r\n  };\r\n\r\n  const updateList = (newList: DraggableItem[]): void => {\r\n    internalList.value = [...newList];\r\n  };\r\n\r\n  const clear = (): void => {\r\n    internalList.value = [];\r\n  };\r\n\r\n  const getItem = (index: number): DraggableItem | undefined =>\r\n    internalList.value[index];\r\n\r\n  const findIndex = (predicate: (item: DraggableItem) => boolean): number =>\r\n    internalList.value.findIndex(predicate);\r\n\r\n  return {\r\n    isDragging,\r\n    internalList,\r\n    isEmpty,\r\n    listClasses,\r\n    listStyles,\r\n    draggableOptions,\r\n    getItemKey,\r\n    getItemTitle,\r\n    getItemDescription,\r\n    getItemClass,\r\n    handleStart,\r\n    handleEnd,\r\n    handleAdd,\r\n    handleRemove,\r\n    handleUpdate,\r\n    addItem,\r\n    removeItem,\r\n    moveItem,\r\n    updateList,\r\n    clear,\r\n    getItem,\r\n    findIndex,\r\n  };\r\n}\r\n","/* unplugin-vue-components disabled */<!--\r\n * @Author: ChenYu ycyplus@gmail.com\r\n * @Date: 2025-06-25\r\n * @Description: 拖拽组件 - 基于 vue-draggable-plus 封装（薄 UI 壳 + useDraggableLayout 引擎）\r\n * @Migration: naive-ui-components 组件库迁移版本\r\n * Copyright (c) 2025 by CHENY, All Rights Reserved.\r\n-->\r\n<template>\r\n  <div class=\"c-draggable-wrapper\" :class=\"wrapperClass\">\r\n    <VueDraggable\r\n      v-model=\"internalList\"\r\n      v-bind=\"draggableOptions\"\r\n      :class=\"listClasses\"\r\n      :style=\"listStyles\"\r\n      @start=\"handleStart\"\r\n      @end=\"handleEnd\"\r\n      @add=\"handleAdd\"\r\n      @remove=\"handleRemove\"\r\n      @update=\"handleUpdate\"\r\n    >\r\n      <div\r\n        v-for=\"(item, index) in internalList\"\r\n        :key=\"getItemKey(item, index)\"\r\n        :class=\"getItemClass(index)\"\r\n        :data-index=\"index\"\r\n      >\r\n        <slot\r\n          :item=\"item\"\r\n          :index=\"index\"\r\n          :is-dragging=\"isDragging\"\r\n          :is-disabled=\"disabled\"\r\n        >\r\n          <div class=\"default-item\">\r\n            <div v-if=\"showHandle\" class=\"drag-handle\">\r\n              <div class=\"i-mdi:drag-vertical\"></div>\r\n            </div>\r\n            <div class=\"item-content\">\r\n              <div class=\"item-title\">{{ getItemTitle(item) }}</div>\r\n              <div v-if=\"getItemDescription(item)\" class=\"item-description\">\r\n                {{ getItemDescription(item) }}\r\n              </div>\r\n            </div>\r\n          </div>\r\n        </slot>\r\n      </div>\r\n    </VueDraggable>\r\n\r\n    <div v-if=\"isEmpty && showEmptyState\" class=\"empty-state\">\r\n      <slot name=\"empty\">\r\n        <div class=\"default-empty\">\r\n          <div class=\"empty-icon i-mdi:inbox-outline\"></div>\r\n          <p class=\"empty-text\">{{ emptyText }}</p>\r\n        </div>\r\n      </slot>\r\n    </div>\r\n  </div>\r\n</template>\r\n\r\n<script setup lang=\"ts\">\r\nimport { readonly } from \"vue\";\r\nimport { VueDraggable } from \"vue-draggable-plus\";\r\nimport { useDraggableLayout } from \"./composables/useDraggableLayout\";\r\nimport type { DraggableProps, DraggableEmits } from \"./types\";\r\n\r\ndefineOptions({ name: \"C_Draggable\" });\r\n\r\nconst props = withDefaults(defineProps<DraggableProps>(), {\r\n  modelValue: () => [],\r\n  disabled: false,\r\n  group: \"default\",\r\n  sort: true,\r\n  animation: 200,\r\n  delay: 0,\r\n  handle: \"\",\r\n  showHandle: false,\r\n  ghostClass: \"sortable-ghost\",\r\n  chosenClass: \"sortable-chosen\",\r\n  dragClass: \"sortable-drag\",\r\n  wrapperClass: \"\",\r\n  listClass: \"\",\r\n  itemClass: \"\",\r\n  showEmptyState: true,\r\n  emptyText: \"暂无数据\",\r\n  swapThreshold: 1,\r\n  invertSwap: false,\r\n  direction: \"vertical\",\r\n  layout: \"vertical\",\r\n  gridColumns: 4,\r\n  gridRows: undefined,\r\n  gap: \"8px\",\r\n  flexWrap: false,\r\n  justifyContent: \"flex-start\",\r\n  alignItems: \"stretch\",\r\n  customStyles: () => ({}),\r\n});\r\n\r\nconst emit = defineEmits<DraggableEmits>();\r\n\r\nconst {\r\n  isDragging,\r\n  internalList,\r\n  isEmpty,\r\n  listClasses,\r\n  listStyles,\r\n  draggableOptions,\r\n  getItemKey,\r\n  getItemTitle,\r\n  getItemDescription,\r\n  getItemClass,\r\n  handleStart,\r\n  handleEnd,\r\n  handleAdd,\r\n  handleRemove,\r\n  handleUpdate,\r\n  addItem,\r\n  removeItem,\r\n  moveItem,\r\n  updateList,\r\n  clear,\r\n  getItem,\r\n  findIndex,\r\n} = useDraggableLayout(props, emit);\r\n\r\ndefineExpose({\r\n  isDragging: readonly(isDragging),\r\n  list: readonly(internalList),\r\n  isEmpty: readonly(isEmpty),\r\n  addItem,\r\n  removeItem,\r\n  moveItem,\r\n  updateList,\r\n  clear,\r\n  getItem,\r\n  findIndex,\r\n});\r\n</script>\r\n\r\n<style lang=\"scss\" scoped>\r\n@use \"./index.scss\";\r\n</style>\r\n","/* unplugin-vue-components disabled */<!--\r\n * @Author: ChenYu ycyplus@gmail.com\r\n * @Date: 2025-06-25\r\n * @Description: 拖拽组件 - 基于 vue-draggable-plus 封装（薄 UI 壳 + useDraggableLayout 引擎）\r\n * @Migration: naive-ui-components 组件库迁移版本\r\n * Copyright (c) 2025 by CHENY, All Rights Reserved.\r\n-->\r\n<template>\r\n  <div class=\"c-draggable-wrapper\" :class=\"wrapperClass\">\r\n    <VueDraggable\r\n      v-model=\"internalList\"\r\n      v-bind=\"draggableOptions\"\r\n      :class=\"listClasses\"\r\n      :style=\"listStyles\"\r\n      @start=\"handleStart\"\r\n      @end=\"handleEnd\"\r\n      @add=\"handleAdd\"\r\n      @remove=\"handleRemove\"\r\n      @update=\"handleUpdate\"\r\n    >\r\n      <div\r\n        v-for=\"(item, index) in internalList\"\r\n        :key=\"getItemKey(item, index)\"\r\n        :class=\"getItemClass(index)\"\r\n        :data-index=\"index\"\r\n      >\r\n        <slot\r\n          :item=\"item\"\r\n          :index=\"index\"\r\n          :is-dragging=\"isDragging\"\r\n          :is-disabled=\"disabled\"\r\n        >\r\n          <div class=\"default-item\">\r\n            <div v-if=\"showHandle\" class=\"drag-handle\">\r\n              <div class=\"i-mdi:drag-vertical\"></div>\r\n            </div>\r\n            <div class=\"item-content\">\r\n              <div class=\"item-title\">{{ getItemTitle(item) }}</div>\r\n              <div v-if=\"getItemDescription(item)\" class=\"item-description\">\r\n                {{ getItemDescription(item) }}\r\n              </div>\r\n            </div>\r\n          </div>\r\n        </slot>\r\n      </div>\r\n    </VueDraggable>\r\n\r\n    <div v-if=\"isEmpty && showEmptyState\" class=\"empty-state\">\r\n      <slot name=\"empty\">\r\n        <div class=\"default-empty\">\r\n          <div class=\"empty-icon i-mdi:inbox-outline\"></div>\r\n          <p class=\"empty-text\">{{ emptyText }}</p>\r\n        </div>\r\n      </slot>\r\n    </div>\r\n  </div>\r\n</template>\r\n\r\n<script setup lang=\"ts\">\r\nimport { readonly } from \"vue\";\r\nimport { VueDraggable } from \"vue-draggable-plus\";\r\nimport { useDraggableLayout } from \"./composables/useDraggableLayout\";\r\nimport type { DraggableProps, DraggableEmits } from \"./types\";\r\n\r\ndefineOptions({ name: \"C_Draggable\" });\r\n\r\nconst props = withDefaults(defineProps<DraggableProps>(), {\r\n  modelValue: () => [],\r\n  disabled: false,\r\n  group: \"default\",\r\n  sort: true,\r\n  animation: 200,\r\n  delay: 0,\r\n  handle: \"\",\r\n  showHandle: false,\r\n  ghostClass: \"sortable-ghost\",\r\n  chosenClass: \"sortable-chosen\",\r\n  dragClass: \"sortable-drag\",\r\n  wrapperClass: \"\",\r\n  listClass: \"\",\r\n  itemClass: \"\",\r\n  showEmptyState: true,\r\n  emptyText: \"暂无数据\",\r\n  swapThreshold: 1,\r\n  invertSwap: false,\r\n  direction: \"vertical\",\r\n  layout: \"vertical\",\r\n  gridColumns: 4,\r\n  gridRows: undefined,\r\n  gap: \"8px\",\r\n  flexWrap: false,\r\n  justifyContent: \"flex-start\",\r\n  alignItems: \"stretch\",\r\n  customStyles: () => ({}),\r\n});\r\n\r\nconst emit = defineEmits<DraggableEmits>();\r\n\r\nconst {\r\n  isDragging,\r\n  internalList,\r\n  isEmpty,\r\n  listClasses,\r\n  listStyles,\r\n  draggableOptions,\r\n  getItemKey,\r\n  getItemTitle,\r\n  getItemDescription,\r\n  getItemClass,\r\n  handleStart,\r\n  handleEnd,\r\n  handleAdd,\r\n  handleRemove,\r\n  handleUpdate,\r\n  addItem,\r\n  removeItem,\r\n  moveItem,\r\n  updateList,\r\n  clear,\r\n  getItem,\r\n  findIndex,\r\n} = useDraggableLayout(props, emit);\r\n\r\ndefineExpose({\r\n  isDragging: readonly(isDragging),\r\n  list: readonly(internalList),\r\n  isEmpty: readonly(isEmpty),\r\n  addItem,\r\n  removeItem,\r\n  moveItem,\r\n  updateList,\r\n  clear,\r\n  getItem,\r\n  findIndex,\r\n});\r\n</script>\r\n\r\n<style lang=\"scss\" scoped>\r\n@use \"./index.scss\";\r\n</style>\r\n","<!--\r\n * @Author: ChenYu ycyplus@gmail.com\r\n * @Date: 2025-06-25\r\n * @Description: 拖拽组件 - 基于 vue-draggable-plus 封装（薄 UI 壳 + useDraggableLayout 引擎）\r\n * @Migration: naive-ui-components 组件库迁移版本\r\n * Copyright (c) 2025 by CHENY, All Rights Reserved.\r\n-->\r\n<template>\r\n  <div class=\"c-draggable-wrapper\" :class=\"wrapperClass\">\r\n    <VueDraggable\r\n      v-model=\"internalList\"\r\n      v-bind=\"draggableOptions\"\r\n      :class=\"listClasses\"\r\n      :style=\"listStyles\"\r\n      @start=\"handleStart\"\r\n      @end=\"handleEnd\"\r\n      @add=\"handleAdd\"\r\n      @remove=\"handleRemove\"\r\n      @update=\"handleUpdate\"\r\n    >\r\n      <div\r\n        v-for=\"(item, index) in internalList\"\r\n        :key=\"getItemKey(item, index)\"\r\n        :class=\"getItemClass(index)\"\r\n        :data-index=\"index\"\r\n      >\r\n        <slot\r\n          :item=\"item\"\r\n          :index=\"index\"\r\n          :is-dragging=\"isDragging\"\r\n          :is-disabled=\"disabled\"\r\n        >\r\n          <div class=\"default-item\">\r\n            <div v-if=\"showHandle\" class=\"drag-handle\">\r\n              <div class=\"i-mdi:drag-vertical\"></div>\r\n            </div>\r\n            <div class=\"item-content\">\r\n              <div class=\"item-title\">{{ getItemTitle(item) }}</div>\r\n              <div v-if=\"getItemDescription(item)\" class=\"item-description\">\r\n                {{ getItemDescription(item) }}\r\n              </div>\r\n            </div>\r\n          </div>\r\n        </slot>\r\n      </div>\r\n    </VueDraggable>\r\n\r\n    <div v-if=\"isEmpty && showEmptyState\" class=\"empty-state\">\r\n      <slot name=\"empty\">\r\n        <div class=\"default-empty\">\r\n          <div class=\"empty-icon i-mdi:inbox-outline\"></div>\r\n          <p class=\"empty-text\">{{ emptyText }}</p>\r\n        </div>\r\n      </slot>\r\n    </div>\r\n  </div>\r\n</template>\r\n\r\n<script setup lang=\"ts\">\r\nimport { readonly } from \"vue\";\r\nimport { VueDraggable } from \"vue-draggable-plus\";\r\nimport { useDraggableLayout } from \"./composables/useDraggableLayout\";\r\nimport type { DraggableProps, DraggableEmits } from \"./types\";\r\n\r\ndefineOptions({ name: \"C_Draggable\" });\r\n\r\nconst props = withDefaults(defineProps<DraggableProps>(), {\r\n  modelValue: () => [],\r\n  disabled: false,\r\n  group: \"default\",\r\n  sort: true,\r\n  animation: 200,\r\n  delay: 0,\r\n  handle: \"\",\r\n  showHandle: false,\r\n  ghostClass: \"sortable-ghost\",\r\n  chosenClass: \"sortable-chosen\",\r\n  dragClass: \"sortable-drag\",\r\n  wrapperClass: \"\",\r\n  listClass: \"\",\r\n  itemClass: \"\",\r\n  showEmptyState: true,\r\n  emptyText: \"暂无数据\",\r\n  swapThreshold: 1,\r\n  invertSwap: false,\r\n  direction: \"vertical\",\r\n  layout: \"vertical\",\r\n  gridColumns: 4,\r\n  gridRows: undefined,\r\n  gap: \"8px\",\r\n  flexWrap: false,\r\n  justifyContent: \"flex-start\",\r\n  alignItems: \"stretch\",\r\n  customStyles: () => ({}),\r\n});\r\n\r\nconst emit = defineEmits<DraggableEmits>();\r\n\r\nconst {\r\n  isDragging,\r\n  internalList,\r\n  isEmpty,\r\n  listClasses,\r\n  listStyles,\r\n  draggableOptions,\r\n  getItemKey,\r\n  getItemTitle,\r\n  getItemDescription,\r\n  getItemClass,\r\n  handleStart,\r\n  handleEnd,\r\n  handleAdd,\r\n  handleRemove,\r\n  handleUpdate,\r\n  addItem,\r\n  removeItem,\r\n  moveItem,\r\n  updateList,\r\n  clear,\r\n  getItem,\r\n  findIndex,\r\n} = useDraggableLayout(props, emit);\r\n\r\ndefineExpose({\r\n  isDragging: readonly(isDragging),\r\n  list: readonly(internalList),\r\n  isEmpty: readonly(isEmpty),\r\n  addItem,\r\n  removeItem,\r\n  moveItem,\r\n  updateList,\r\n  clear,\r\n  getItem,\r\n  findIndex,\r\n});\r\n</script>\r\n\r\n<style lang=\"scss\" scoped>\r\n@use \"./index.scss\";\r\n</style>\r\n"],"mappings":"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"}

package/dist/C_Editor.cjs

@@ -1,4 +1 @@
-Object.defineProperty(exports, Symbol.toStringTag, { value: 'Module' });
-const require_C_Editor = require('./C_Editor.js');
-
-exports.C_Editor = require_C_Editor.C_Editor_default;
+Object.defineProperty(exports,Symbol.toStringTag,{value:`Module`});const e=require(`./C_Editor.js`);exports.C_Editor=e.t;

package/dist/C_Editor.js

@@ -1,3 +1 @@
-import { t as C_Editor_default } from "./C_Editor2.js";
-
-export { C_Editor_default as C_Editor };
+import{t as e}from"./C_Editor2.js";export{e as C_Editor};

package/dist/C_Editor.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"C_Editor.js","names":["editorId"],"sources":["../src/components/C_Editor/index.vue","../src/components/C_Editor/index.vue","../src/components/C_Editor/index.vue"],"sourcesContent":["/* unplugin-vue-components disabled */<!--\r\n * @Author: ChenYu ycyplus@gmail.com\r\n * @Date: 2025-06-01\r\n * @Description: 富文本编辑器组件（简化主题版）\r\n * @Migration: naive-ui-components 组件库迁移版本\r\n * Copyright (c) 2025 by CHENY, All Rights Reserved.\r\n-->\r\n<template>\r\n  <div\r\n    ref=\"editorContainer\"\r\n    :id=\"editorId\"\r\n    v-show=\"isInitialized\"\r\n    class=\"w-full\"\r\n    :class=\"{ 'editor-dark': isDark }\"\r\n    @focusin=\"handleEditorFocus\"\r\n    @focusout=\"handleEditorBlur\"\r\n  ></div>\r\n</template>\r\n\r\n<script setup lang=\"ts\">\r\nimport {\r\n  ref,\r\n  computed,\r\n  watch,\r\n  nextTick,\r\n  onMounted,\r\n  onBeforeUnmount,\r\n  readonly,\r\n} from \"vue\";\r\nimport E from \"wangeditor\";\r\n\r\ndefineOptions({ name: \"C_Editor\" });\r\n\r\ninterface Props {\r\n  editorId: string;\r\n  modelValue?: string;\r\n  placeholder?: string;\r\n  disabled?: boolean;\r\n  readonly?: boolean;\r\n  height?: number;\r\n  theme?: \"light\" | \"dark\";\r\n}\r\n\r\ninterface Emits {\r\n  (e: \"update:modelValue\", value: string): void;\r\n  (e: \"editor-mounted\", editor: any): void;\r\n  (e: \"editor-change\", html: string): void;\r\n}\r\n\r\nconst props = withDefaults(defineProps<Props>(), {\r\n  modelValue: \"\",\r\n  placeholder: \"\",\r\n  disabled: false,\r\n  readonly: false,\r\n  height: 240,\r\n  theme: \"light\",\r\n});\r\n\r\nconst emit = defineEmits<Emits>();\r\n\r\nconst editorContainer = ref<HTMLElement | null>(null);\r\nconst editorInstance = ref<any>(null);\r\nconst isInitialized = ref<boolean>(false);\r\n\r\nconst isDark = computed(() => props.theme === \"dark\");\r\n\r\nconst initializeEditor = (): void => {\r\n  if (!editorContainer.value || isInitialized.value) return;\r\n\r\n  try {\r\n    const editor = new E(editorContainer.value);\r\n    const editorConfig = editor.config as any;\r\n    editorConfig.placeholder = props.placeholder;\r\n    editorConfig.height = props.height - 50;\r\n\r\n    editorConfig.onchange = (html: string) => {\r\n      emit(\"update:modelValue\", html);\r\n      emit(\"editor-change\", html);\r\n    };\r\n\r\n    editor.create();\r\n\r\n    nextTick(() => {\r\n      if (props.modelValue) {\r\n        editor.txt.html(props.modelValue);\r\n      }\r\n      if (props.readonly) {\r\n        editor.disable();\r\n      }\r\n      editorInstance.value = editor;\r\n      isInitialized.value = true;\r\n      emit(\"editor-mounted\", editor);\r\n    });\r\n  } catch (error) {\r\n    console.error(`[C_Editor] 编辑器初始化失败: ${props.editorId}`, error);\r\n  }\r\n};\r\n\r\nconst destroyEditor = (): void => {\r\n  if (editorInstance.value && isInitialized.value) {\r\n    try {\r\n      editorInstance.value.destroy();\r\n      editorInstance.value = null;\r\n      isInitialized.value = false;\r\n    } catch (error) {\r\n      console.error(`[C_Editor] 编辑器销毁失败: ${props.editorId}`, error);\r\n    }\r\n  }\r\n};\r\n\r\nconst setContent = (html: string): void => {\r\n  if (editorInstance.value && isInitialized.value) {\r\n    try {\r\n      editorInstance.value.txt.html(html);\r\n    } catch (error) {\r\n      console.warn(`[C_Editor] 设置编辑器内容失败: ${props.editorId}`, error);\r\n    }\r\n  }\r\n};\r\n\r\nconst getContent = (): string => {\r\n  if (editorInstance.value && isInitialized.value) {\r\n    try {\r\n      return editorInstance.value.txt.html();\r\n    } catch (error) {\r\n      console.warn(`[C_Editor] 获取编辑器内容失败: ${props.editorId}`, error);\r\n      return \"\";\r\n    }\r\n  }\r\n  return \"\";\r\n};\r\n\r\nwatch(\r\n  () => props.modelValue,\r\n  (newValue) => {\r\n    if (editorInstance.value && isInitialized.value) {\r\n      const currentContent = editorInstance.value.txt.html();\r\n      if (currentContent !== newValue) {\r\n        editorInstance.value.txt.html(newValue || \"\");\r\n      }\r\n    }\r\n  },\r\n);\r\n\r\nwatch(\r\n  () => props.disabled,\r\n  (disabled) => {\r\n    if (editorInstance.value && isInitialized.value) {\r\n      try {\r\n        if (disabled) editorInstance.value.disable();\r\n        else editorInstance.value.enable();\r\n      } catch (error) {\r\n        console.warn(`[C_Editor] 设置编辑器状态失败`, error);\r\n      }\r\n    }\r\n  },\r\n);\r\n\r\nwatch(\r\n  () => props.readonly,\r\n  (readonlyVal) => {\r\n    if (editorInstance.value && isInitialized.value) {\r\n      try {\r\n        if (readonlyVal) editorInstance.value.disable();\r\n        else editorInstance.value.enable();\r\n      } catch (error) {\r\n        console.warn(`[C_Editor] 设置编辑器只读状态失败`, error);\r\n      }\r\n    }\r\n  },\r\n);\r\n\r\nconst handleEditorFocus = (): void => {\r\n  if (!editorContainer.value) return;\r\n  const container = editorContainer.value.closest(\r\n    \".form-demo\",\r\n  ) as HTMLElement | null;\r\n  if (container) {\r\n    container.classList.add(\"editor-focused\");\r\n    const containerWidth = container.scrollWidth;\r\n    container.style.maxWidth = `${containerWidth}px`;\r\n  }\r\n};\r\n\r\nconst handleEditorBlur = (): void => {\r\n  if (!editorContainer.value) return;\r\n  const container = editorContainer.value.closest(\r\n    \".form-demo\",\r\n  ) as HTMLElement | null;\r\n  if (container) {\r\n    container.classList.remove(\"editor-focused\");\r\n    container.style.maxWidth = \"\";\r\n  }\r\n};\r\n\r\nonMounted(() => {\r\n  nextTick(() => {\r\n    initializeEditor();\r\n  });\r\n});\r\n\r\nonBeforeUnmount(() => {\r\n  destroyEditor();\r\n});\r\n\r\ndefineExpose({\r\n  initializeEditor,\r\n  destroyEditor,\r\n  setContent,\r\n  getContent,\r\n  handleEditorFocus,\r\n  handleEditorBlur,\r\n  editorInstance: readonly(editorInstance),\r\n  isInitialized: readonly(isInitialized),\r\n});\r\n</script>\r\n\r\n<style scoped>\r\n/* 暗色主题样式 */\r\n.editor-dark :deep(.w-e-toolbar) {\r\n  background-color: #1f2937 !important;\r\n  border-color: #374151 !important;\r\n}\r\n\r\n.editor-dark :deep(.w-e-toolbar .w-e-menu .w-e-menu-item) {\r\n  color: #e5e7eb !important;\r\n}\r\n\r\n.editor-dark :deep(.w-e-toolbar .w-e-menu .w-e-menu-item:hover) {\r\n  background-color: #374151 !important;\r\n  color: #ffffff !important;\r\n}\r\n\r\n.editor-dark :deep(.w-e-toolbar .w-e-menu .w-e-menu-item.w-e-active) {\r\n  background-color: #2080f0 !important;\r\n  color: #ffffff !important;\r\n}\r\n\r\n.editor-dark :deep(.w-e-text-container) {\r\n  background-color: #111827 !important;\r\n  border-color: #374151 !important;\r\n}\r\n\r\n.editor-dark :deep(.w-e-text-container .w-e-text) {\r\n  background-color: #303033 !important;\r\n  color: #e5e7eb !important;\r\n}\r\n\r\n.editor-dark :deep(.w-e-text-container .w-e-text:focus) {\r\n  background-color: #111827 !important;\r\n  color: #e5e7eb !important;\r\n}\r\n\r\n:deep(.w-e-toolbar),\r\n:deep(.w-e-text-container) {\r\n  max-width: 100% !important;\r\n  overflow-x: auto !important;\r\n  box-sizing: border-box !important;\r\n}\r\n\r\n:deep(.w-e-text) {\r\n  max-width: 100% !important;\r\n  word-wrap: break-word !important;\r\n  overflow-wrap: break-word !important;\r\n}\r\n\r\n:deep(.w-e-toolbar),\r\n:deep(.w-e-text-container),\r\n:deep(.w-e-text) {\r\n  transition:\r\n    background-color 0.3s ease,\r\n    border-color 0.3s ease,\r\n    color 0.3s ease !important;\r\n}\r\n\r\n.editor-focused {\r\n  overflow: hidden !important;\r\n  max-width: 100% !important;\r\n}\r\n</style>\r\n","/* unplugin-vue-components disabled */<!--\r\n * @Author: ChenYu ycyplus@gmail.com\r\n * @Date: 2025-06-01\r\n * @Description: 富文本编辑器组件（简化主题版）\r\n * @Migration: naive-ui-components 组件库迁移版本\r\n * Copyright (c) 2025 by CHENY, All Rights Reserved.\r\n-->\r\n<template>\r\n  <div\r\n    ref=\"editorContainer\"\r\n    :id=\"editorId\"\r\n    v-show=\"isInitialized\"\r\n    class=\"w-full\"\r\n    :class=\"{ 'editor-dark': isDark }\"\r\n    @focusin=\"handleEditorFocus\"\r\n    @focusout=\"handleEditorBlur\"\r\n  ></div>\r\n</template>\r\n\r\n<script setup lang=\"ts\">\r\nimport {\r\n  ref,\r\n  computed,\r\n  watch,\r\n  nextTick,\r\n  onMounted,\r\n  onBeforeUnmount,\r\n  readonly,\r\n} from \"vue\";\r\nimport E from \"wangeditor\";\r\n\r\ndefineOptions({ name: \"C_Editor\" });\r\n\r\ninterface Props {\r\n  editorId: string;\r\n  modelValue?: string;\r\n  placeholder?: string;\r\n  disabled?: boolean;\r\n  readonly?: boolean;\r\n  height?: number;\r\n  theme?: \"light\" | \"dark\";\r\n}\r\n\r\ninterface Emits {\r\n  (e: \"update:modelValue\", value: string): void;\r\n  (e: \"editor-mounted\", editor: any): void;\r\n  (e: \"editor-change\", html: string): void;\r\n}\r\n\r\nconst props = withDefaults(defineProps<Props>(), {\r\n  modelValue: \"\",\r\n  placeholder: \"\",\r\n  disabled: false,\r\n  readonly: false,\r\n  height: 240,\r\n  theme: \"light\",\r\n});\r\n\r\nconst emit = defineEmits<Emits>();\r\n\r\nconst editorContainer = ref<HTMLElement | null>(null);\r\nconst editorInstance = ref<any>(null);\r\nconst isInitialized = ref<boolean>(false);\r\n\r\nconst isDark = computed(() => props.theme === \"dark\");\r\n\r\nconst initializeEditor = (): void => {\r\n  if (!editorContainer.value || isInitialized.value) return;\r\n\r\n  try {\r\n    const editor = new E(editorContainer.value);\r\n    const editorConfig = editor.config as any;\r\n    editorConfig.placeholder = props.placeholder;\r\n    editorConfig.height = props.height - 50;\r\n\r\n    editorConfig.onchange = (html: string) => {\r\n      emit(\"update:modelValue\", html);\r\n      emit(\"editor-change\", html);\r\n    };\r\n\r\n    editor.create();\r\n\r\n    nextTick(() => {\r\n      if (props.modelValue) {\r\n        editor.txt.html(props.modelValue);\r\n      }\r\n      if (props.readonly) {\r\n        editor.disable();\r\n      }\r\n      editorInstance.value = editor;\r\n      isInitialized.value = true;\r\n      emit(\"editor-mounted\", editor);\r\n    });\r\n  } catch (error) {\r\n    console.error(`[C_Editor] 编辑器初始化失败: ${props.editorId}`, error);\r\n  }\r\n};\r\n\r\nconst destroyEditor = (): void => {\r\n  if (editorInstance.value && isInitialized.value) {\r\n    try {\r\n      editorInstance.value.destroy();\r\n      editorInstance.value = null;\r\n      isInitialized.value = false;\r\n    } catch (error) {\r\n      console.error(`[C_Editor] 编辑器销毁失败: ${props.editorId}`, error);\r\n    }\r\n  }\r\n};\r\n\r\nconst setContent = (html: string): void => {\r\n  if (editorInstance.value && isInitialized.value) {\r\n    try {\r\n      editorInstance.value.txt.html(html);\r\n    } catch (error) {\r\n      console.warn(`[C_Editor] 设置编辑器内容失败: ${props.editorId}`, error);\r\n    }\r\n  }\r\n};\r\n\r\nconst getContent = (): string => {\r\n  if (editorInstance.value && isInitialized.value) {\r\n    try {\r\n      return editorInstance.value.txt.html();\r\n    } catch (error) {\r\n      console.warn(`[C_Editor] 获取编辑器内容失败: ${props.editorId}`, error);\r\n      return \"\";\r\n    }\r\n  }\r\n  return \"\";\r\n};\r\n\r\nwatch(\r\n  () => props.modelValue,\r\n  (newValue) => {\r\n    if (editorInstance.value && isInitialized.value) {\r\n      const currentContent = editorInstance.value.txt.html();\r\n      if (currentContent !== newValue) {\r\n        editorInstance.value.txt.html(newValue || \"\");\r\n      }\r\n    }\r\n  },\r\n);\r\n\r\nwatch(\r\n  () => props.disabled,\r\n  (disabled) => {\r\n    if (editorInstance.value && isInitialized.value) {\r\n      try {\r\n        if (disabled) editorInstance.value.disable();\r\n        else editorInstance.value.enable();\r\n      } catch (error) {\r\n        console.warn(`[C_Editor] 设置编辑器状态失败`, error);\r\n      }\r\n    }\r\n  },\r\n);\r\n\r\nwatch(\r\n  () => props.readonly,\r\n  (readonlyVal) => {\r\n    if (editorInstance.value && isInitialized.value) {\r\n      try {\r\n        if (readonlyVal) editorInstance.value.disable();\r\n        else editorInstance.value.enable();\r\n      } catch (error) {\r\n        console.warn(`[C_Editor] 设置编辑器只读状态失败`, error);\r\n      }\r\n    }\r\n  },\r\n);\r\n\r\nconst handleEditorFocus = (): void => {\r\n  if (!editorContainer.value) return;\r\n  const container = editorContainer.value.closest(\r\n    \".form-demo\",\r\n  ) as HTMLElement | null;\r\n  if (container) {\r\n    container.classList.add(\"editor-focused\");\r\n    const containerWidth = container.scrollWidth;\r\n    container.style.maxWidth = `${containerWidth}px`;\r\n  }\r\n};\r\n\r\nconst handleEditorBlur = (): void => {\r\n  if (!editorContainer.value) return;\r\n  const container = editorContainer.value.closest(\r\n    \".form-demo\",\r\n  ) as HTMLElement | null;\r\n  if (container) {\r\n    container.classList.remove(\"editor-focused\");\r\n    container.style.maxWidth = \"\";\r\n  }\r\n};\r\n\r\nonMounted(() => {\r\n  nextTick(() => {\r\n    initializeEditor();\r\n  });\r\n});\r\n\r\nonBeforeUnmount(() => {\r\n  destroyEditor();\r\n});\r\n\r\ndefineExpose({\r\n  initializeEditor,\r\n  destroyEditor,\r\n  setContent,\r\n  getContent,\r\n  handleEditorFocus,\r\n  handleEditorBlur,\r\n  editorInstance: readonly(editorInstance),\r\n  isInitialized: readonly(isInitialized),\r\n});\r\n</script>\r\n\r\n<style scoped>\r\n/* 暗色主题样式 */\r\n.editor-dark :deep(.w-e-toolbar) {\r\n  background-color: #1f2937 !important;\r\n  border-color: #374151 !important;\r\n}\r\n\r\n.editor-dark :deep(.w-e-toolbar .w-e-menu .w-e-menu-item) {\r\n  color: #e5e7eb !important;\r\n}\r\n\r\n.editor-dark :deep(.w-e-toolbar .w-e-menu .w-e-menu-item:hover) {\r\n  background-color: #374151 !important;\r\n  color: #ffffff !important;\r\n}\r\n\r\n.editor-dark :deep(.w-e-toolbar .w-e-menu .w-e-menu-item.w-e-active) {\r\n  background-color: #2080f0 !important;\r\n  color: #ffffff !important;\r\n}\r\n\r\n.editor-dark :deep(.w-e-text-container) {\r\n  background-color: #111827 !important;\r\n  border-color: #374151 !important;\r\n}\r\n\r\n.editor-dark :deep(.w-e-text-container .w-e-text) {\r\n  background-color: #303033 !important;\r\n  color: #e5e7eb !important;\r\n}\r\n\r\n.editor-dark :deep(.w-e-text-container .w-e-text:focus) {\r\n  background-color: #111827 !important;\r\n  color: #e5e7eb !important;\r\n}\r\n\r\n:deep(.w-e-toolbar),\r\n:deep(.w-e-text-container) {\r\n  max-width: 100% !important;\r\n  overflow-x: auto !important;\r\n  box-sizing: border-box !important;\r\n}\r\n\r\n:deep(.w-e-text) {\r\n  max-width: 100% !important;\r\n  word-wrap: break-word !important;\r\n  overflow-wrap: break-word !important;\r\n}\r\n\r\n:deep(.w-e-toolbar),\r\n:deep(.w-e-text-container),\r\n:deep(.w-e-text) {\r\n  transition:\r\n    background-color 0.3s ease,\r\n    border-color 0.3s ease,\r\n    color 0.3s ease !important;\r\n}\r\n\r\n.editor-focused {\r\n  overflow: hidden !important;\r\n  max-width: 100% !important;\r\n}\r\n</style>\r\n","<!--\r\n * @Author: ChenYu ycyplus@gmail.com\r\n * @Date: 2025-06-01\r\n * @Description: 富文本编辑器组件（简化主题版）\r\n * @Migration: naive-ui-components 组件库迁移版本\r\n * Copyright (c) 2025 by CHENY, All Rights Reserved.\r\n-->\r\n<template>\r\n  <div\r\n    ref=\"editorContainer\"\r\n    :id=\"editorId\"\r\n    v-show=\"isInitialized\"\r\n    class=\"w-full\"\r\n    :class=\"{ 'editor-dark': isDark }\"\r\n    @focusin=\"handleEditorFocus\"\r\n    @focusout=\"handleEditorBlur\"\r\n  ></div>\r\n</template>\r\n\r\n<script setup lang=\"ts\">\r\nimport {\r\n  ref,\r\n  computed,\r\n  watch,\r\n  nextTick,\r\n  onMounted,\r\n  onBeforeUnmount,\r\n  readonly,\r\n} from \"vue\";\r\nimport E from \"wangeditor\";\r\n\r\ndefineOptions({ name: \"C_Editor\" });\r\n\r\ninterface Props {\r\n  editorId: string;\r\n  modelValue?: string;\r\n  placeholder?: string;\r\n  disabled?: boolean;\r\n  readonly?: boolean;\r\n  height?: number;\r\n  theme?: \"light\" | \"dark\";\r\n}\r\n\r\ninterface Emits {\r\n  (e: \"update:modelValue\", value: string): void;\r\n  (e: \"editor-mounted\", editor: any): void;\r\n  (e: \"editor-change\", html: string): void;\r\n}\r\n\r\nconst props = withDefaults(defineProps<Props>(), {\r\n  modelValue: \"\",\r\n  placeholder: \"\",\r\n  disabled: false,\r\n  readonly: false,\r\n  height: 240,\r\n  theme: \"light\",\r\n});\r\n\r\nconst emit = defineEmits<Emits>();\r\n\r\nconst editorContainer = ref<HTMLElement | null>(null);\r\nconst editorInstance = ref<any>(null);\r\nconst isInitialized = ref<boolean>(false);\r\n\r\nconst isDark = computed(() => props.theme === \"dark\");\r\n\r\nconst initializeEditor = (): void => {\r\n  if (!editorContainer.value || isInitialized.value) return;\r\n\r\n  try {\r\n    const editor = new E(editorContainer.value);\r\n    const editorConfig = editor.config as any;\r\n    editorConfig.placeholder = props.placeholder;\r\n    editorConfig.height = props.height - 50;\r\n\r\n    editorConfig.onchange = (html: string) => {\r\n      emit(\"update:modelValue\", html);\r\n      emit(\"editor-change\", html);\r\n    };\r\n\r\n    editor.create();\r\n\r\n    nextTick(() => {\r\n      if (props.modelValue) {\r\n        editor.txt.html(props.modelValue);\r\n      }\r\n      if (props.readonly) {\r\n        editor.disable();\r\n      }\r\n      editorInstance.value = editor;\r\n      isInitialized.value = true;\r\n      emit(\"editor-mounted\", editor);\r\n    });\r\n  } catch (error) {\r\n    console.error(`[C_Editor] 编辑器初始化失败: ${props.editorId}`, error);\r\n  }\r\n};\r\n\r\nconst destroyEditor = (): void => {\r\n  if (editorInstance.value && isInitialized.value) {\r\n    try {\r\n      editorInstance.value.destroy();\r\n      editorInstance.value = null;\r\n      isInitialized.value = false;\r\n    } catch (error) {\r\n      console.error(`[C_Editor] 编辑器销毁失败: ${props.editorId}`, error);\r\n    }\r\n  }\r\n};\r\n\r\nconst setContent = (html: string): void => {\r\n  if (editorInstance.value && isInitialized.value) {\r\n    try {\r\n      editorInstance.value.txt.html(html);\r\n    } catch (error) {\r\n      console.warn(`[C_Editor] 设置编辑器内容失败: ${props.editorId}`, error);\r\n    }\r\n  }\r\n};\r\n\r\nconst getContent = (): string => {\r\n  if (editorInstance.value && isInitialized.value) {\r\n    try {\r\n      return editorInstance.value.txt.html();\r\n    } catch (error) {\r\n      console.warn(`[C_Editor] 获取编辑器内容失败: ${props.editorId}`, error);\r\n      return \"\";\r\n    }\r\n  }\r\n  return \"\";\r\n};\r\n\r\nwatch(\r\n  () => props.modelValue,\r\n  (newValue) => {\r\n    if (editorInstance.value && isInitialized.value) {\r\n      const currentContent = editorInstance.value.txt.html();\r\n      if (currentContent !== newValue) {\r\n        editorInstance.value.txt.html(newValue || \"\");\r\n      }\r\n    }\r\n  },\r\n);\r\n\r\nwatch(\r\n  () => props.disabled,\r\n  (disabled) => {\r\n    if (editorInstance.value && isInitialized.value) {\r\n      try {\r\n        if (disabled) editorInstance.value.disable();\r\n        else editorInstance.value.enable();\r\n      } catch (error) {\r\n        console.warn(`[C_Editor] 设置编辑器状态失败`, error);\r\n      }\r\n    }\r\n  },\r\n);\r\n\r\nwatch(\r\n  () => props.readonly,\r\n  (readonlyVal) => {\r\n    if (editorInstance.value && isInitialized.value) {\r\n      try {\r\n        if (readonlyVal) editorInstance.value.disable();\r\n        else editorInstance.value.enable();\r\n      } catch (error) {\r\n        console.warn(`[C_Editor] 设置编辑器只读状态失败`, error);\r\n      }\r\n    }\r\n  },\r\n);\r\n\r\nconst handleEditorFocus = (): void => {\r\n  if (!editorContainer.value) return;\r\n  const container = editorContainer.value.closest(\r\n    \".form-demo\",\r\n  ) as HTMLElement | null;\r\n  if (container) {\r\n    container.classList.add(\"editor-focused\");\r\n    const containerWidth = container.scrollWidth;\r\n    container.style.maxWidth = `${containerWidth}px`;\r\n  }\r\n};\r\n\r\nconst handleEditorBlur = (): void => {\r\n  if (!editorContainer.value) return;\r\n  const container = editorContainer.value.closest(\r\n    \".form-demo\",\r\n  ) as HTMLElement | null;\r\n  if (container) {\r\n    container.classList.remove(\"editor-focused\");\r\n    container.style.maxWidth = \"\";\r\n  }\r\n};\r\n\r\nonMounted(() => {\r\n  nextTick(() => {\r\n    initializeEditor();\r\n  });\r\n});\r\n\r\nonBeforeUnmount(() => {\r\n  destroyEditor();\r\n});\r\n\r\ndefineExpose({\r\n  initializeEditor,\r\n  destroyEditor,\r\n  setContent,\r\n  getContent,\r\n  handleEditorFocus,\r\n  handleEditorBlur,\r\n  editorInstance: readonly(editorInstance),\r\n  isInitialized: readonly(isInitialized),\r\n});\r\n</script>\r\n\r\n<style scoped>\r\n/* 暗色主题样式 */\r\n.editor-dark :deep(.w-e-toolbar) {\r\n  background-color: #1f2937 !important;\r\n  border-color: #374151 !important;\r\n}\r\n\r\n.editor-dark :deep(.w-e-toolbar .w-e-menu .w-e-menu-item) {\r\n  color: #e5e7eb !important;\r\n}\r\n\r\n.editor-dark :deep(.w-e-toolbar .w-e-menu .w-e-menu-item:hover) {\r\n  background-color: #374151 !important;\r\n  color: #ffffff !important;\r\n}\r\n\r\n.editor-dark :deep(.w-e-toolbar .w-e-menu .w-e-menu-item.w-e-active) {\r\n  background-color: #2080f0 !important;\r\n  color: #ffffff !important;\r\n}\r\n\r\n.editor-dark :deep(.w-e-text-container) {\r\n  background-color: #111827 !important;\r\n  border-color: #374151 !important;\r\n}\r\n\r\n.editor-dark :deep(.w-e-text-container .w-e-text) {\r\n  background-color: #303033 !important;\r\n  color: #e5e7eb !important;\r\n}\r\n\r\n.editor-dark :deep(.w-e-text-container .w-e-text:focus) {\r\n  background-color: #111827 !important;\r\n  color: #e5e7eb !important;\r\n}\r\n\r\n:deep(.w-e-toolbar),\r\n:deep(.w-e-text-container) {\r\n  max-width: 100% !important;\r\n  overflow-x: auto !important;\r\n  box-sizing: border-box !important;\r\n}\r\n\r\n:deep(.w-e-text) {\r\n  max-width: 100% !important;\r\n  word-wrap: break-word !important;\r\n  overflow-wrap: break-word !important;\r\n}\r\n\r\n:deep(.w-e-toolbar),\r\n:deep(.w-e-text-container),\r\n:deep(.w-e-text) {\r\n  transition:\r\n    background-color 0.3s ease,\r\n    border-color 0.3s ease,\r\n    color 0.3s ease !important;\r\n}\r\n\r\n.editor-focused {\r\n  overflow: hidden !important;\r\n  max-width: 100% !important;\r\n}\r\n</style>\r\n"],"mappings":"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"}