@tailor-cms/ce-modal-edit 2.0.0 → 2.0.1

package/dist/index.cjs

@@ -2305,8 +2305,7 @@ function isEmpty(value) {
 }
 //#endregion
 //#region src/components/Edit.vue?vue&type=script&setup=true&lang.ts
-var _hoisted_1 = { class: "text-title-small" };
-var _hoisted_2 = { class: "pa-6 text-center" };
+var _hoisted_1 = { class: "tce-modal" };
 var Edit_vue_vue_type_script_setup_true_lang_default = /* @__PURE__ */ (0, vue.defineComponent)({
 	__name: "Edit",
 	props: {
@@ -2339,49 +2338,29 @@ var Edit_vue_vue_type_script_setup_true_lang_default = /* @__PURE__ */ (0, vue.d
 			});
 		});
 		return (_ctx, _cache) => {
-			const _component_VIcon = (0, vue.resolveComponent)("VIcon");
-			const _component_VToolbar = (0, vue.resolveComponent)("VToolbar");
 			const _component_VAlert = (0, vue.resolveComponent)("VAlert");
 			const _component_TailorEmbeddedContainer = (0, vue.resolveComponent)("TailorEmbeddedContainer");
-			const _component_VCard = (0, vue.resolveComponent)("VCard");
-			return (0, vue.openBlock)(), (0, vue.createBlock)(_component_VCard, {
-				class: "tce-modal my-2",
-				color: "grey-lighten-5"
+			return (0, vue.openBlock)(), (0, vue.createElementBlock)("div", _hoisted_1, [!hasElements.value ? ((0, vue.openBlock)(), (0, vue.createBlock)(_component_VAlert, {
+				key: 0,
+				color: "primary-darken-1",
+				icon: "mdi-information-outline",
+				variant: "tonal",
+				prominent: ""
 			}, {
-				default: (0, vue.withCtx)(() => [(0, vue.createVNode)(_component_VToolbar, {
-					class: "px-4",
-					color: "primary-darken-2",
-					height: "36"
-				}, {
-					default: (0, vue.withCtx)(() => [(0, vue.createVNode)(_component_VIcon, {
-						icon: (0, vue.unref)(manifest$1).ui.icon,
-						color: "secondary-lighten-2",
-						size: "18",
-						start: ""
-					}, null, 8, ["icon"]), (0, vue.createElementVNode)("span", _hoisted_1, (0, vue.toDisplayString)((0, vue.unref)(manifest$1).name), 1)]),
-					_: 1
-				}), (0, vue.createElementVNode)("div", _hoisted_2, [!hasElements.value ? ((0, vue.openBlock)(), (0, vue.createBlock)(_component_VAlert, {
-					key: 0,
-					color: "primary-darken-1",
-					icon: "mdi-information-outline",
-					variant: "tonal",
-					prominent: ""
-				}, {
-					default: (0, vue.withCtx)(() => [..._cache[2] || (_cache[2] = [(0, vue.createTextVNode)(" Click the button below to add content element. ", -1)])]),
-					_: 1
-				})) : (0, vue.createCommentVNode)("", true), (0, vue.createVNode)(_component_TailorEmbeddedContainer, {
-					"allowed-element-config": __props.embedElementConfig,
-					container: __props.element.data,
-					"is-readonly": __props.isReadonly,
-					onDelete: _cache[0] || (_cache[0] = ($event) => deleteEmbed($event)),
-					onSave: _cache[1] || (_cache[1] = ($event) => saveEmbed($event.embeds))
-				}, null, 8, [
-					"allowed-element-config",
-					"container",
-					"is-readonly"
-				])])]),
+				default: (0, vue.withCtx)(() => [..._cache[2] || (_cache[2] = [(0, vue.createTextVNode)(" Click the button below to add content element. ", -1)])]),
 				_: 1
-			});
+			})) : (0, vue.createCommentVNode)("", true), (0, vue.createVNode)(_component_TailorEmbeddedContainer, {
+				"allowed-element-config": __props.embedElementConfig,
+				container: __props.element.data,
+				"is-readonly": __props.isReadonly,
+				class: "text-center",
+				onDelete: _cache[0] || (_cache[0] = ($event) => deleteEmbed($event)),
+				onSave: _cache[1] || (_cache[1] = ($event) => saveEmbed($event.embeds))
+			}, null, 8, [
+				"allowed-element-config",
+				"container",
+				"is-readonly"
+			])]);
 		};
 	}
 });
@@ -2394,7 +2373,7 @@ var _plugin_vue_export_helper_default = (sfc, props) => {
 };
 //#endregion
 //#region src/components/Edit.vue
-var Edit_default = /* @__PURE__ */ _plugin_vue_export_helper_default(Edit_vue_vue_type_script_setup_true_lang_default, [["__scopeId", "data-v-26a760fe"]]);
+var Edit_default = /* @__PURE__ */ _plugin_vue_export_helper_default(Edit_vue_vue_type_script_setup_true_lang_default, [["__scopeId", "data-v-d4445f44"]]);
 //#endregion
 //#region src/components/TopToolbar.vue
 var TopToolbar_default = /* @__PURE__ */ (0, vue.defineComponent)({
@@ -2405,6 +2384,10 @@ var TopToolbar_default = /* @__PURE__ */ (0, vue.defineComponent)({
 		const elementBus = (0, vue.inject)("$elementBus");
 		const form = (0, vue.ref)();
 		const title = (0, vue.ref)(props.element.data.title);
+		(0, vue.watch)(() => props.element.data.title, (value) => {
+			if (value === title.value) return;
+			title.value = value;
+		});
 		(0, vue.watch)(title, debounce(async () => {
 			if (!form.value) return;
 			const { valid } = await form.value.validate();

package/dist/index.css

@@ -1,5 +1,4 @@
 
-.tce-modal[data-v-26a760fe] {
-  font-family: Arial, Helvetica, sans-serif;
-  font-size: 1rem;
+.tce-modal[data-v-d4445f44] {
+  text-align: left;
 }

package/dist/index.js

@@ -1,4 +1,4 @@
-import { computed, createBlock, createCommentVNode, createElementVNode, createTextVNode, createVNode, defineComponent, inject, openBlock, ref, resolveComponent, toDisplayString, unref, watch, withCtx } from "vue";
+import { computed, createBlock, createCommentVNode, createElementBlock, createTextVNode, createVNode, defineComponent, inject, openBlock, ref, resolveComponent, watch, withCtx } from "vue";
 import './index.css';//#region ../../node_modules/.pnpm/uuid@14.0.0/node_modules/uuid/dist/stringify.js
 var byteToHex = [];
 for (let i = 0; i < 256; ++i) byteToHex.push((i + 256).toString(16).slice(1));
@@ -2301,8 +2301,7 @@ function isEmpty(value) {
 }
 //#endregion
 //#region src/components/Edit.vue?vue&type=script&setup=true&lang.ts
-var _hoisted_1 = { class: "text-title-small" };
-var _hoisted_2 = { class: "pa-6 text-center" };
+var _hoisted_1 = { class: "tce-modal" };
 var Edit_vue_vue_type_script_setup_true_lang_default = /* @__PURE__ */ defineComponent({
 	__name: "Edit",
 	props: {
@@ -2335,49 +2334,29 @@ var Edit_vue_vue_type_script_setup_true_lang_default = /* @__PURE__ */ defineCom
 			});
 		});
 		return (_ctx, _cache) => {
-			const _component_VIcon = resolveComponent("VIcon");
-			const _component_VToolbar = resolveComponent("VToolbar");
 			const _component_VAlert = resolveComponent("VAlert");
 			const _component_TailorEmbeddedContainer = resolveComponent("TailorEmbeddedContainer");
-			const _component_VCard = resolveComponent("VCard");
-			return openBlock(), createBlock(_component_VCard, {
-				class: "tce-modal my-2",
-				color: "grey-lighten-5"
+			return openBlock(), createElementBlock("div", _hoisted_1, [!hasElements.value ? (openBlock(), createBlock(_component_VAlert, {
+				key: 0,
+				color: "primary-darken-1",
+				icon: "mdi-information-outline",
+				variant: "tonal",
+				prominent: ""
 			}, {
-				default: withCtx(() => [createVNode(_component_VToolbar, {
-					class: "px-4",
-					color: "primary-darken-2",
-					height: "36"
-				}, {
-					default: withCtx(() => [createVNode(_component_VIcon, {
-						icon: unref(manifest$1).ui.icon,
-						color: "secondary-lighten-2",
-						size: "18",
-						start: ""
-					}, null, 8, ["icon"]), createElementVNode("span", _hoisted_1, toDisplayString(unref(manifest$1).name), 1)]),
-					_: 1
-				}), createElementVNode("div", _hoisted_2, [!hasElements.value ? (openBlock(), createBlock(_component_VAlert, {
-					key: 0,
-					color: "primary-darken-1",
-					icon: "mdi-information-outline",
-					variant: "tonal",
-					prominent: ""
-				}, {
-					default: withCtx(() => [..._cache[2] || (_cache[2] = [createTextVNode(" Click the button below to add content element. ", -1)])]),
-					_: 1
-				})) : createCommentVNode("", true), createVNode(_component_TailorEmbeddedContainer, {
-					"allowed-element-config": __props.embedElementConfig,
-					container: __props.element.data,
-					"is-readonly": __props.isReadonly,
-					onDelete: _cache[0] || (_cache[0] = ($event) => deleteEmbed($event)),
-					onSave: _cache[1] || (_cache[1] = ($event) => saveEmbed($event.embeds))
-				}, null, 8, [
-					"allowed-element-config",
-					"container",
-					"is-readonly"
-				])])]),
+				default: withCtx(() => [..._cache[2] || (_cache[2] = [createTextVNode(" Click the button below to add content element. ", -1)])]),
 				_: 1
-			});
+			})) : createCommentVNode("", true), createVNode(_component_TailorEmbeddedContainer, {
+				"allowed-element-config": __props.embedElementConfig,
+				container: __props.element.data,
+				"is-readonly": __props.isReadonly,
+				class: "text-center",
+				onDelete: _cache[0] || (_cache[0] = ($event) => deleteEmbed($event)),
+				onSave: _cache[1] || (_cache[1] = ($event) => saveEmbed($event.embeds))
+			}, null, 8, [
+				"allowed-element-config",
+				"container",
+				"is-readonly"
+			])]);
 		};
 	}
 });
@@ -2390,7 +2369,7 @@ var _plugin_vue_export_helper_default = (sfc, props) => {
 };
 //#endregion
 //#region src/components/Edit.vue
-var Edit_default = /* @__PURE__ */ _plugin_vue_export_helper_default(Edit_vue_vue_type_script_setup_true_lang_default, [["__scopeId", "data-v-26a760fe"]]);
+var Edit_default = /* @__PURE__ */ _plugin_vue_export_helper_default(Edit_vue_vue_type_script_setup_true_lang_default, [["__scopeId", "data-v-d4445f44"]]);
 //#endregion
 //#region src/components/TopToolbar.vue
 var TopToolbar_default = /* @__PURE__ */ defineComponent({
@@ -2401,6 +2380,10 @@ var TopToolbar_default = /* @__PURE__ */ defineComponent({
 		const elementBus = inject("$elementBus");
 		const form = ref();
 		const title = ref(props.element.data.title);
+		watch(() => props.element.data.title, (value) => {
+			if (value === title.value) return;
+			title.value = value;
+		});
 		watch(title, debounce(async () => {
 			if (!form.value) return;
 			const { valid } = await form.value.validate();

package/package.json

@@ -3,7 +3,7 @@
   "description": "Tailor CMS modal authoring component",
   "author": "Studion <info@gostudion.com> (https://github.com/tailor-cms)",
   "type": "module",
-  "version": "2.0.0",
+  "version": "2.0.1",
   "exports": {
     ".": {
       "import": "./dist/index.js",
@@ -27,7 +27,7 @@
     "vite-plugin-lib-inject-css": "^2.2.2",
     "vue-tsc": "^3.2.7",
     "vuetify": "^4.0.6",
-    "@tailor-cms/ce-modal-manifest": "2.0.0"
+    "@tailor-cms/ce-modal-manifest": "2.0.1"
   },
   "dependencies": {
     "@tailor-cms/cek-common": "2.0.1",