x-prop-tree 0.8.31 → 0.8.33

package/dist/{i18n-en.iiploulp.js → i18n-en.l2rmrsld.js}

@@ -4,6 +4,11 @@ import { t as __exportAll } from "./rolldown-runtime.c6i0pdwe.js";
 var en_exports = /* @__PURE__ */ __exportAll({ default: () => en_default });
 var en_default = { "x-prop-tree": {
 	copy: "Copy",
+	dlg: { saveChange: {
+		title: "Save Changes",
+		text: "Do you want to save the changes?"
+	} },
+	json: "JSON",
 	jsonEditor: "JSON Editor",
 	noAdaptSlot: "No Adapt Slot",
 	noComp: "No Comp",

package/dist/{i18n-zhHans.bb5g1fpp.js → i18n-zhHans.mlbij4hp.js}

@@ -4,6 +4,11 @@ import { t as __exportAll } from "./rolldown-runtime.c6i0pdwe.js";
 var zhHans_exports = /* @__PURE__ */ __exportAll({ default: () => zhHans_default });
 var zhHans_default = { "x-prop-tree": {
 	copy: "拷贝",
+	dlg: { saveChange: {
+		title: "保存变化",
+		text: "你想要保存变化吗？"
+	} },
+	json: "JSON",
 	jsonEditor: "JSON编辑器",
 	noAdaptSlot: "没有适配插槽",
 	noComp: "没有组件",
@@ -12,7 +17,8 @@ var zhHans_default = { "x-prop-tree": {
 	reset: "重置",
 	selectAdaptSlot: "选择适配插槽",
 	selectComp: "选择组件",
-	selectSlot: "选择插槽"
+	selectSlot: "选择插槽",
+	structuredData: "结构化数据"
 } };
 
 //#endregion

package/dist/index.d.ts

@@ -2,6 +2,13 @@
 export declare function loadLocaleMessagePropTree(locale: string): Promise<{
   'x-prop-tree': {
     copy: string;
+    dlg: {
+      saveChange: {
+        title: string;
+        text: string;
+      };
+    };
+    json: string;
     jsonEditor: string;
     noAdaptSlot: string;
     noComp: string;

package/dist/index.js

@@ -1,7 +1,7 @@
 (function(){try{document.getElementById(`x-prop-tree`)?.remove();const e = document.createElement(`style`);e.setAttribute(`id`, `x-prop-tree`);const t = document.createTextNode(``);e.appendChild(t);document.head.appendChild(e);}catch(e){console.error('rolldown-plugin-inject-css', e);}})()
 import { n as isEqual, r as cloneDeep, t as omit } from "./vendor.mu9vrf3y.js";
 import { Fragment, computed, createBlock, createCommentVNode, createElementBlock, createElementVNode, createTextVNode, createVNode, defineComponent, h, inject, isRef, mergeModels, mergeProps, normalizeStyle, onBeforeUnmount, onMounted, onUnmounted, openBlock, provide, ref, renderList, renderSlot, resolveComponent, resolveDirective, toDisplayString, unref, useId, useModel, useTemplateRef, watch, watchEffect, withCtx, withDirectives, withKeys, withModifiers } from "vue";
-import { eventBus, globalObjects, injectDark, injectLocale, openNumberDlg, openPromptDlg, useColor, useSystem, useViewStack } from "x-essential-lib";
+import { eventBus, globalObjects, injectDark, injectLocale, openConfirmDlg, openNumberDlg, openPromptDlg, useColor, useSystem, useViewStack } from "x-essential-lib";
 import { getElement, getItems, getPropertyDefault, getPropertyDefaultArray, getTag, getTypes, isHexColor, isThemeColor, makeSlotId, parseNumberUnit, pkgs, rules, themeColors, unwrapSlotId } from "x-runtime-lib";
 import { getListEntry, setCollapse, tidyList } from "x-group-list";
 import { useI18n } from "vue-i18n";
@@ -1698,43 +1698,24 @@ var icon_default = index_vue_vue_type_script_setup_true_lang_default$11;
 //#region src/components/values/json/editor.vue?vue&type=script&setup=true&lang.ts
 var editor_vue_vue_type_script_setup_true_lang_default = /*@__PURE__*/ defineComponent({
 	__name: "editor",
-	props: {
-		"modelValue": {
-			type: String,
-			required: true
-		},
-		"modelModifiers": {},
-		"lock": {
-			type: Boolean,
-			required: true
-		},
-		"lockModifiers": {},
-		"scale": {
-			type: Number,
-			required: true
-		},
-		"scaleModifiers": {}
-	},
-	emits: [
-		"update:modelValue",
-		"update:lock",
-		"update:scale"
-	],
+	props: { json: {
+		type: String,
+		required: true
+	} },
 	setup(__props, { expose: __expose }) {
-		const json = useModel(__props, "modelValue");
-		const lock = useModel(__props, "lock");
-		const scale = useModel(__props, "scale");
 		const dark = injectDark();
 		const locale = injectLocale();
 		const version = injectVersion();
+		const lock = ref(false);
+		const scale = ref(1);
 		const target = useTemplateRef("target");
 		function onReady() {
-			const object = JSON.parse(json.value);
+			const object = JSON.parse(__props.json);
 			target.value?.load(object);
 		}
 		function save() {
 			const object = target.value.save();
-			json.value = JSON.stringify(object, null, 2);
+			return JSON.stringify(object, null, 2);
 		}
 		__expose({ save });
 		return (_ctx, _cache) => {
@@ -1795,8 +1776,6 @@ var index_vue_vue_type_script_setup_true_lang_default$10 = /*@__PURE__*/ defineC
 		const { backgroundColor0, backgroundColor1, backgroundColor2 } = useColor();
 		const json = useModel(__props, "modelValue");
 		const emit = __emit;
-		const lock = ref(false);
-		const scale = ref(1);
 		const contStyle = computed(() => {
 			let h = 48;
 			if (sysBarAvail.value) h += 24;
@@ -1806,17 +1785,21 @@ var index_vue_vue_type_script_setup_true_lang_default$10 = /*@__PURE__*/ defineC
 				height: `calc(100% - ${h}px)`
 			};
 		});
-		const title = computed(() => {
-			return t("x-prop-tree.jsonEditor");
-		});
 		const { open } = useViewStack(`propTreejsonEditorDlg${useId()}`);
-		onUnmounted(() => {
-			open.value = false;
-		});
 		const editor = useTemplateRef("editor");
-		watch(open, (val) => {
-			if (!val) editor.value?.save();
-		});
+		async function onClose() {
+			try {
+				const newJson = editor.value.save();
+				if (isEqual(newJson, json.value)) return;
+				if (!await openConfirmDlg({
+					title: t("x-prop-tree.dlg.saveChange.title"),
+					text: t("x-prop-tree.dlg.saveChange.text")
+				})) return;
+				json.value = newJson;
+			} finally {
+				open.value = false;
+			}
+		}
 		return (_ctx, _cache) => {
 			const _component_v_btn = resolveComponent("v-btn");
 			const _component_v_sheet = resolveComponent("v-sheet");
@@ -1824,20 +1807,20 @@ var index_vue_vue_type_script_setup_true_lang_default$10 = /*@__PURE__*/ defineC
 			const _component_v_dialog = resolveComponent("v-dialog");
 			return openBlock(), createBlock(_component_v_dialog, {
 				modelValue: unref(open),
-				"onUpdate:modelValue": _cache[5] || (_cache[5] = ($event) => isRef(open) ? open.value = $event : null),
+				"onUpdate:modelValue": _cache[1] || (_cache[1] = ($event) => isRef(open) ? open.value = $event : null),
 				attach: "",
 				fullscreen: "",
 				"no-click-animation": "",
 				persistent: "",
 				transition: "dialog-bottom-transition",
-				onKeydown: _cache[6] || (_cache[6] = withKeys(withModifiers(($event) => open.value = false, ["stop", "prevent"]), ["esc"]))
+				onKeydown: withKeys(withModifiers(onClose, ["stop", "prevent"]), ["esc"])
 			}, {
 				activator: withCtx(({ props: activatorProps }) => [createVNode(_component_v_btn, mergeProps(activatorProps, {
 					block: "",
 					density: "comfortable",
 					readonly: __props.readonly
 				}), {
-					default: withCtx(() => [createTextVNode(toDisplayString(title.value), 1)]),
+					default: withCtx(() => [createTextVNode(toDisplayString(unref(t)("x-prop-tree.json")), 1)]),
 					_: 1
 				}, 16, ["readonly"]), __props.hasDelete ? (openBlock(), createBlock(_component_v_btn, {
 					key: 0,
@@ -1868,9 +1851,9 @@ var index_vue_vue_type_script_setup_true_lang_default$10 = /*@__PURE__*/ defineC
 									density: "comfortable",
 									icon: "mdi-close",
 									variant: "text",
-									onClick: _cache[1] || (_cache[1] = ($event) => open.value = false)
+									onClick: onClose
 								}),
-								createElementVNode("span", _hoisted_1$10, toDisplayString(title.value), 1),
+								createElementVNode("span", _hoisted_1$10, toDisplayString(unref(t)("x-prop-tree.jsonEditor")), 1),
 								createVNode(_component_v_spacer)
 							]),
 							_: 1
@@ -1878,22 +1861,13 @@ var index_vue_vue_type_script_setup_true_lang_default$10 = /*@__PURE__*/ defineC
 						createElementVNode("div", { style: normalizeStyle(contStyle.value) }, [createVNode(editor_default, {
 							ref_key: "editor",
 							ref: editor,
-							modelValue: json.value,
-							"onUpdate:modelValue": _cache[2] || (_cache[2] = ($event) => json.value = $event),
-							lock: lock.value,
-							"onUpdate:lock": _cache[3] || (_cache[3] = ($event) => lock.value = $event),
-							scale: scale.value,
-							"onUpdate:scale": _cache[4] || (_cache[4] = ($event) => scale.value = $event)
-						}, null, 8, [
-							"modelValue",
-							"lock",
-							"scale"
-						])], 4)
+							json: json.value
+						}, null, 8, ["json"])], 4)
 					]),
 					_: 1
 				}, 8, ["color"])]),
 				_: 1
-			}, 8, ["modelValue"]);
+			}, 8, ["modelValue", "onKeydown"]);
 		};
 	}
 });
@@ -3584,8 +3558,8 @@ const install = (app) => {
 //#endregion
 //#region src/i18n/index.ts
 async function loadLocaleMessagePropTree(locale) {
-	if (locale === "en") return (await import("./i18n-en.iiploulp.js").then((n) => n.t)).default;
-	else if (locale === "zhHans") return (await import("./i18n-zhHans.bb5g1fpp.js").then((n) => n.t)).default;
+	if (locale === "en") return (await import("./i18n-en.l2rmrsld.js").then((n) => n.t)).default;
+	else if (locale === "zhHans") return (await import("./i18n-zhHans.mlbij4hp.js").then((n) => n.t)).default;
 	else throw new Error(`invalid locale=${locale}`);
 }
 

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "x-prop-tree",
-  "version": "0.8.31",
+  "version": "0.8.33",
   "files": [
     "dist"
   ],
@@ -43,11 +43,11 @@
     "vue": "^3.5.42",
     "vue-i18n": "^11.4.10",
     "vuetify": "^4.2.1",
-    "x-block-lib": "^0.11.7",
+    "x-block-lib": "^0.11.11",
     "x-error-lib": "^0.6.5",
     "x-essential-lib": "^0.10.40",
     "x-group-list": "^0.4.19",
-    "x-runtime-lib": "^0.10.3",
+    "x-runtime-lib": "^0.10.5",
     "x-state-lib": "^0.4.5"
   }
 }