@gct-paas/core-web 0.1.5-test.1 → 0.1.6-dev.0

package/es/components/label-design/stage/stage-canvas.vue.d.ts

@@ -0,0 +1,183 @@
+type __VLS_Props = {
+    schema?: IObject[];
+};
+declare const _default: import('vue').DefineComponent<__VLS_Props, {}, {}, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {
+    movingItem: (...args: any[]) => void;
+    updatePBarcodeWidth: (...args: any[]) => void;
+}, string, import('vue').PublicProps, Readonly<__VLS_Props> & Readonly<{
+    onMovingItem?: ((...args: any[]) => any) | undefined;
+    onUpdatePBarcodeWidth?: ((...args: any[]) => any) | undefined;
+}>, {}, {}, {}, {}, string, import('vue').ComponentProvideOptions, false, {
+    mrContainerRef: ({
+        $: import('vue').ComponentInternalInstance;
+        $data: {};
+        $props: Partial<{
+            activeElements: unknown[];
+            snapTracking: boolean;
+            zoom: number;
+            isDesign: boolean;
+        }> & Omit<{
+            readonly activeElements: unknown[];
+            readonly snapTracking: boolean;
+            readonly zoom: number;
+            readonly isDesign: boolean;
+            readonly onArrows?: ((...args: any[]) => any) | undefined;
+            readonly onClearselection?: ((...args: any[]) => any) | undefined;
+            readonly onCopy?: ((...args: any[]) => any) | undefined;
+            readonly onCut?: ((...args: any[]) => any) | undefined;
+            readonly onDelete?: ((...args: any[]) => any) | undefined;
+            readonly onDrop?: ((...args: any[]) => any) | undefined;
+            readonly onMovestop?: ((...args: any[]) => any) | undefined;
+            readonly onMoving?: ((...args: any[]) => any) | undefined;
+            readonly onMovingItem?: ((...args: any[]) => any) | undefined;
+            readonly onPaste?: ((...args: any[]) => any) | undefined;
+            readonly onRedo?: ((...args: any[]) => any) | undefined;
+            readonly onResizestop?: ((...args: any[]) => any) | undefined;
+            readonly onRotatestop?: ((...args: any[]) => any) | undefined;
+            readonly onRotating?: ((...args: any[]) => any) | undefined;
+            readonly onSelectstop?: ((...args: any[]) => any) | undefined;
+            readonly onUndo?: ((...args: any[]) => any) | undefined;
+        } & import('vue').VNodeProps & import('vue').AllowedComponentProps & import('vue').ComponentCustomProps, "activeElements" | "isDesign" | "snapTracking" | "zoom">;
+        $attrs: import('vue').Attrs;
+        $refs: {
+            [x: string]: unknown;
+        } & {
+            elementRef: HTMLDivElement;
+            selectionArea: HTMLDivElement;
+            sublineT: HTMLDivElement;
+            sublineB: HTMLDivElement;
+            sublineY: HTMLDivElement;
+            sublineL: HTMLDivElement;
+            sublineR: HTMLDivElement;
+            sublineX: HTMLDivElement;
+        };
+        $slots: Readonly<{
+            [name: string]: import('vue').Slot<any> | undefined;
+        }>;
+        $root: import('vue').ComponentPublicInstance | null;
+        $parent: import('vue').ComponentPublicInstance | null;
+        $host: Element | null;
+        $emit: ((event: "arrows", ...args: any[]) => void) & ((event: "clearselection", ...args: any[]) => void) & ((event: "copy", ...args: any[]) => void) & ((event: "cut", ...args: any[]) => void) & ((event: "delete", ...args: any[]) => void) & ((event: "drop", ...args: any[]) => void) & ((event: "movestop", ...args: any[]) => void) & ((event: "moving", ...args: any[]) => void) & ((event: "movingItem", ...args: any[]) => void) & ((event: "paste", ...args: any[]) => void) & ((event: "redo", ...args: any[]) => void) & ((event: "resizestop", ...args: any[]) => void) & ((event: "rotatestop", ...args: any[]) => void) & ((event: "rotating", ...args: any[]) => void) & ((event: "selectstop", ...args: any[]) => void) & ((event: "undo", ...args: any[]) => void);
+        $el: HTMLDivElement;
+        $options: import('vue').ComponentOptionsBase<Readonly<import('vue').ExtractPropTypes<{
+            activeElements: {
+                type: ArrayConstructor;
+                default: () => never[];
+            };
+            snapTracking: {
+                type: BooleanConstructor;
+                default: boolean;
+            };
+            zoom: {
+                type: NumberConstructor;
+                default: number;
+            };
+            isDesign: {
+                type: BooleanConstructor;
+                default: boolean;
+            };
+        }>> & Readonly<{
+            onArrows?: ((...args: any[]) => any) | undefined;
+            onClearselection?: ((...args: any[]) => any) | undefined;
+            onCopy?: ((...args: any[]) => any) | undefined;
+            onCut?: ((...args: any[]) => any) | undefined;
+            onDelete?: ((...args: any[]) => any) | undefined;
+            onDrop?: ((...args: any[]) => any) | undefined;
+            onMovestop?: ((...args: any[]) => any) | undefined;
+            onMoving?: ((...args: any[]) => any) | undefined;
+            onMovingItem?: ((...args: any[]) => any) | undefined;
+            onPaste?: ((...args: any[]) => any) | undefined;
+            onRedo?: ((...args: any[]) => any) | undefined;
+            onResizestop?: ((...args: any[]) => any) | undefined;
+            onRotatestop?: ((...args: any[]) => any) | undefined;
+            onRotating?: ((...args: any[]) => any) | undefined;
+            onSelectstop?: ((...args: any[]) => any) | undefined;
+            onUndo?: ((...args: any[]) => any) | undefined;
+        }>, {}, {}, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {
+            arrows: (...args: any[]) => void;
+            clearselection: (...args: any[]) => void;
+            copy: (...args: any[]) => void;
+            cut: (...args: any[]) => void;
+            delete: (...args: any[]) => void;
+            drop: (...args: any[]) => void;
+            movestop: (...args: any[]) => void;
+            moving: (...args: any[]) => void;
+            movingItem: (...args: any[]) => void;
+            paste: (...args: any[]) => void;
+            redo: (...args: any[]) => void;
+            resizestop: (...args: any[]) => void;
+            rotatestop: (...args: any[]) => void;
+            rotating: (...args: any[]) => void;
+            selectstop: (...args: any[]) => void;
+            undo: (...args: any[]) => void;
+        }, string, {
+            activeElements: unknown[];
+            snapTracking: boolean;
+            zoom: number;
+            isDesign: boolean;
+        }, {}, string, {}, import('vue').GlobalComponents, import('vue').GlobalDirectives, string, import('vue').ComponentProvideOptions> & {
+            beforeCreate?: (() => void)[] | (() => void);
+            created?: (() => void)[] | (() => void);
+            beforeMount?: (() => void)[] | (() => void);
+            mounted?: (() => void)[] | (() => void);
+            beforeUpdate?: (() => void)[] | (() => void);
+            updated?: (() => void)[] | (() => void);
+            activated?: (() => void)[] | (() => void);
+            deactivated?: (() => void)[] | (() => void);
+            beforeDestroy?: (() => void)[] | (() => void);
+            beforeUnmount?: (() => void)[] | (() => void);
+            destroyed?: (() => void)[] | (() => void);
+            unmounted?: (() => void)[] | (() => void);
+            renderTracked?: ((e: import('vue').DebuggerEvent) => void)[] | ((e: import('vue').DebuggerEvent) => void);
+            renderTriggered?: ((e: import('vue').DebuggerEvent) => void)[] | ((e: import('vue').DebuggerEvent) => void);
+            errorCaptured?: ((err: unknown, instance: import('vue').ComponentPublicInstance | null, info: string) => boolean | void)[] | ((err: unknown, instance: import('vue').ComponentPublicInstance | null, info: string) => boolean | void);
+        };
+        $forceUpdate: () => void;
+        $nextTick: typeof import('vue').nextTick;
+        $watch<T extends string | ((...args: any) => any)>(source: T, cb: T extends (...args: any) => infer R ? (...args: [R, R, import('@vue/reactivity').OnCleanup]) => any : (...args: [any, any, import('@vue/reactivity').OnCleanup]) => any, options?: import('vue').WatchOptions): import('vue').WatchStopHandle;
+    } & Readonly<{
+        activeElements: unknown[];
+        snapTracking: boolean;
+        zoom: number;
+        isDesign: boolean;
+    }> & Omit<Readonly<import('vue').ExtractPropTypes<{
+        activeElements: {
+            type: ArrayConstructor;
+            default: () => never[];
+        };
+        snapTracking: {
+            type: BooleanConstructor;
+            default: boolean;
+        };
+        zoom: {
+            type: NumberConstructor;
+            default: number;
+        };
+        isDesign: {
+            type: BooleanConstructor;
+            default: boolean;
+        };
+    }>> & Readonly<{
+        onArrows?: ((...args: any[]) => any) | undefined;
+        onClearselection?: ((...args: any[]) => any) | undefined;
+        onCopy?: ((...args: any[]) => any) | undefined;
+        onCut?: ((...args: any[]) => any) | undefined;
+        onDelete?: ((...args: any[]) => any) | undefined;
+        onDrop?: ((...args: any[]) => any) | undefined;
+        onMovestop?: ((...args: any[]) => any) | undefined;
+        onMoving?: ((...args: any[]) => any) | undefined;
+        onMovingItem?: ((...args: any[]) => any) | undefined;
+        onPaste?: ((...args: any[]) => any) | undefined;
+        onRedo?: ((...args: any[]) => any) | undefined;
+        onResizestop?: ((...args: any[]) => any) | undefined;
+        onRotatestop?: ((...args: any[]) => any) | undefined;
+        onRotating?: ((...args: any[]) => any) | undefined;
+        onSelectstop?: ((...args: any[]) => any) | undefined;
+        onUndo?: ((...args: any[]) => any) | undefined;
+    }>, "activeElements" | "isDesign" | "snapTracking" | "zoom"> & import('vue').ShallowUnwrapRef<{}> & {} & import('vue').ComponentCustomProperties & {} & {
+        $slots: {
+            default?(_: {}): any;
+        };
+    }) | null;
+}, HTMLDivElement>;
+export default _default;

package/es/components/label-design/stage/stage-canvas.vue.mjs

@@ -0,0 +1,6 @@
+import stage_canvas_vue_vue_type_script_setup_true_lang_default from "./stage-canvas.vue_vue_type_script_setup_true_lang.mjs";
+import './stage-canvas.vue_vue_type_style_index_0_lang.css';/* empty css                                                  */
+//#region src/components/label-design/stage/stage-canvas.vue
+var stage_canvas_default = stage_canvas_vue_vue_type_script_setup_true_lang_default;
+//#endregion
+export { stage_canvas_default as default };

package/es/components/label-design/stage/stage-canvas.vue_vue_type_script_setup_true_lang.mjs

@@ -0,0 +1,292 @@
+import { fixElementToParentBounds, getComputedProp } from "../helper/positionDimension.mjs";
+import { usePage } from "../hooks/usePage.mjs";
+import { useDesigner } from "../hooks/useDesigner.mjs";
+import MrContainer_default from "../components/mr-vue/MrContainer.vue.mjs";
+import StageEl_default from "./StageEl.vue.mjs";
+import { Fragment, computed, createBlock, createElementBlock, defineComponent, normalizeClass, normalizeStyle, openBlock, ref, renderList, unref, watch, withCtx } from "vue";
+import { cloneDeep } from "lodash-es";
+//#region src/components/label-design/stage/stage-canvas.vue?vue&type=script&setup=true&lang.ts
+var stage_canvas_vue_vue_type_script_setup_true_lang_default = /* @__PURE__ */ defineComponent({
+	__name: "stage-canvas",
+	props: { schema: {} },
+	emits: ["movingItem", "updatePBarcodeWidth"],
+	setup(__props, { emit: __emit }) {
+		const emit = __emit;
+		const defProps = __props;
+		const DROP_BORDER = {
+			width: "2px",
+			style: "solid",
+			color: "#f1867f"
+		};
+		const { selectedElements, snapTracking, selectedPage, zoom, moveElement, rebaseSelectedElements, resizeElement, rotateElement, addSelectedElements, clearSelectedElements, removeElement, registerElement, resizeBarcodeWidth, isModal } = useDesigner();
+		const { project } = usePage();
+		const mrContainerRef = ref();
+		const dropContainer = ref();
+		const clipboard = ref([]);
+		const defaultBorder = ref({
+			width: "",
+			style: "",
+			color: ""
+		});
+		watch(dropContainer, (newVal, oldVal) => {
+			if (oldVal) {
+				oldVal.style.borderWidth = defaultBorder.value.width;
+				oldVal.style.borderStyle = defaultBorder.value.style;
+				oldVal.style.borderColor = defaultBorder.value.color;
+			}
+			if (newVal) {
+				defaultBorder.value.width = newVal.style.borderWidth;
+				defaultBorder.value.style = newVal.style.borderStyle;
+				defaultBorder.value.color = newVal.style.borderColor;
+				newVal.style.borderWidth = DROP_BORDER.width;
+				newVal.style.borderStyle = DROP_BORDER.style;
+				newVal.style.borderColor = DROP_BORDER.color;
+			}
+		});
+		const selectSchema = computed(() => {
+			return isModal.value ? defProps.schema : selectedPage.value;
+		});
+		const focusCanvas = () => {
+			mrContainerRef.value.$el.focus();
+		};
+		const pageStyles = computed(() => {
+			return {
+				height: isNaN(Number(project.value.height)) ? project.value.height : project.value.height + "px",
+				width: isNaN(Number(project.value.width)) ? project.value.width : project.value.width + "px",
+				overflow: "hidden"
+			};
+		});
+		const arrowsHandler = ({ direction, shiftKey }) => {
+			if (selectedElements.value.length > 0) {
+				let diff = shiftKey ? 10 : 1;
+				let addedTop = 0;
+				let addedBottom = 0;
+				let addedLeft = 0;
+				let addedRight = 0;
+				switch (direction) {
+					case "up":
+						addedTop -= diff;
+						addedBottom += diff;
+						addedLeft = addedRight = 0;
+						break;
+					case "down":
+						addedBottom -= diff;
+						addedTop += diff;
+						addedLeft = addedRight = 0;
+						break;
+					case "left":
+						addedLeft -= diff;
+						addedRight += diff;
+						addedTop = addedBottom = 0;
+						break;
+					case "right":
+						addedRight -= diff;
+						addedLeft += diff;
+						addedTop = addedBottom = 0;
+						break;
+				}
+				const parentH = parseInt(window.getComputedStyle(mrContainerRef.value.$el).height);
+				const parentW = parseInt(window.getComputedStyle(mrContainerRef.value.$el).width);
+				selectedElements.value.map((el) => {
+					let compTop = getComputedProp("top", el);
+					let compBottom = getComputedProp("bottom", el);
+					let compLeft = getComputedProp("left", el);
+					let compRight = getComputedProp("right", el);
+					let top = addedTop && compTop + addedTop >= 0 && compBottom + addedBottom >= 0 ? compTop + addedTop : null;
+					let bottom = addedBottom && compBottom + addedBottom >= 0 && compTop + addedTop >= 0 ? compBottom + addedBottom : null;
+					let left = addedLeft && compLeft + addedLeft >= 0 && compRight + addedRight >= 0 ? compLeft + addedLeft : null;
+					let right = addedRight && compRight + addedRight >= 0 && compLeft + addedLeft >= 0 ? compRight + addedRight : null;
+					if (top || bottom || left || right) moveElement({
+						elId: el.id,
+						pageId: project.value.id,
+						top: top ? typeof el.top === "string" && el.top.indexOf("%") > -1 ? top / parentH * 100 + "%" : top : top,
+						bottom: bottom ? typeof el.bottom === "string" && el.bottom.indexOf("%") > -1 ? bottom / parentH * 100 + "%" : bottom : bottom,
+						left: left ? typeof el.left === "string" && el.left.indexOf("%") > -1 ? left / parentW * 100 + "%" : left : left,
+						right: right ? typeof el.right === "string" && el.right.indexOf("%") > -1 ? right / parentW * 100 + "%" : right : right
+					});
+				});
+				rebaseSelectedElements();
+			}
+		};
+		const movingHandler = (_absMouseX, _absMouseY) => {};
+		const moveStopHandler = (moveStopData) => {
+			moveStopData.moveElData.map((moveData) => {
+				moveElement({
+					...moveData,
+					pageId: project.value.id,
+					parentId: null,
+					mouseX: moveStopData.relMouseX,
+					mouseY: moveStopData.relMouseY
+				});
+			});
+			rebaseSelectedElements();
+			dropContainer.value = void 0;
+		};
+		const resizeStopHandler = (resStopData) => {
+			resStopData.map((resElData) => resizeElement({
+				...resElData,
+				pageId: project.value.id
+			}));
+			rebaseSelectedElements();
+		};
+		const rotateStopHandler = (rotStopData) => {
+			rotStopData.map((rotElData) => rotateElement({
+				...rotElData,
+				pageId: project.value.id
+			}));
+			rebaseSelectedElements();
+		};
+		const selectStopHandler = (selectionBox) => {
+			if (selectionBox.top === selectionBox.bottom && selectionBox.left === selectionBox.right || selectedPage.value.length === 0) return;
+			let selectedElements = [];
+			selectedPage.value.forEach((childEl) => {
+				const child = childEl;
+				let childTop = getComputedProp("top", child);
+				let childLeft = getComputedProp("left", child);
+				let childBottom = getComputedProp("height", child, project.value) + childTop;
+				let childRight = getComputedProp("width", child, project.value) + childLeft;
+				if (childTop >= selectionBox.top && childLeft >= selectionBox.left && childBottom <= selectionBox.bottom && childRight <= selectionBox.right) selectedElements.push(child);
+			});
+			if (selectedElements.length > 0) addSelectedElements(selectedElements);
+		};
+		const clearSelectionHandler = () => {
+			if (selectedElements.value.length > 0) clearSelectedElements();
+		};
+		const deleteHandler = () => {
+			if (selectedElements.value.length > 0) selectedElements.value.forEach((el) => {
+				removeElement({
+					page: project.value,
+					elId: el.id
+				});
+			});
+		};
+		const copyHandler = () => {
+			if (selectedElements.value.length > 0) {
+				clipboard.value = [];
+				selectedElements.value.map((el) => clipboard.value.push(cloneDeep(el)));
+			}
+		};
+		const cutHandler = () => {
+			if (selectedElements.value.length > 0) {
+				clipboard.value = [];
+				selectedElements.value.map((el) => {
+					clipboard.value.push(cloneDeep(el));
+					removeElement({
+						page: project.value,
+						elId: el.id
+					});
+				});
+			}
+		};
+		const pasteHandler = () => {
+			if (clipboard.value.length > 0) {
+				clearSelectedElements();
+				clipboard.value.map((el) => {
+					el.left += 10;
+					el.top += 10;
+					for (let key in el.attrs) {
+						if (el.attrs[key].tag) el.attrs[key].tag = "";
+						if (el.attrs[key].tagValueArray) el.attrs[key].tagValueArray = [];
+						if (key === "alarmGroupId") el.attrs[key].value = "";
+					}
+					registerElement({
+						pageId: project.value.id,
+						el
+					});
+				});
+			}
+		};
+		const dropHandler = (e) => {
+			if (window.DragTreeTableOutDropData) return false;
+			const maineggRect = mrContainerRef.value.$el.getBoundingClientRect();
+			let element = JSON.parse(e.dataTransfer.getData("text/plain"));
+			let height = getComputedProp("height", element, project.value);
+			let width = getComputedProp("width", element, project.value);
+			let top = e.pageY - maineggRect.top - height / 2 * zoom.value;
+			let left = e.pageX - maineggRect.left - width / 2 * zoom.value;
+			top = Math.round(top / zoom.value);
+			left = Math.round(left / zoom.value);
+			const fixedElement = fixElementToParentBounds({
+				top,
+				left,
+				height,
+				width
+			}, project.value);
+			element = {
+				...element,
+				...fixedElement
+			};
+			clearSelectedElements();
+			registerElement({
+				pageId: project.value.id,
+				el: element
+			});
+			focusCanvas();
+		};
+		const updatePBarcodeWidth = ({ width, rotateWidth, height, elId }) => {
+			resizeBarcodeWidth({
+				width,
+				rotateWidth,
+				height,
+				elId,
+				pageId: project.value.id
+			});
+			emit("updatePBarcodeWidth", {
+				width,
+				rotateWidth,
+				height,
+				elId,
+				pageId: project.value.id
+			});
+			rebaseSelectedElements();
+		};
+		function movingItem(x, y, w, h) {
+			emit("movingItem", x, y, w, h);
+		}
+		return (_ctx, _cache) => {
+			return openBlock(), createBlock(MrContainer_default, {
+				id: unref(project)?.id,
+				ref_key: "mrContainerRef",
+				ref: mrContainerRef,
+				zoom: unref(zoom),
+				style: normalizeStyle(pageStyles.value),
+				class: normalizeClass([{ stage: true }]),
+				"is-design": true,
+				"active-elements": unref(selectedElements),
+				"snap-tracking": unref(snapTracking),
+				onArrows: arrowsHandler,
+				onMoving: movingHandler,
+				onMovingItem: movingItem,
+				onMovestop: moveStopHandler,
+				onResizestop: resizeStopHandler,
+				onRotatestop: rotateStopHandler,
+				onSelectstop: selectStopHandler,
+				onClearselection: clearSelectionHandler,
+				onDelete: deleteHandler,
+				onCopy: copyHandler,
+				onCut: cutHandler,
+				onPaste: pasteHandler,
+				onDrop: dropHandler,
+				onUndo: _cache[0] || (_cache[0] = ($event) => _ctx.$root?.$emit("undo")),
+				onRedo: _cache[1] || (_cache[1] = ($event) => _ctx.$root?.$emit("redo"))
+			}, {
+				default: withCtx(() => [(openBlock(true), createElementBlock(Fragment, null, renderList(selectSchema.value, (element) => {
+					return openBlock(), createBlock(StageEl_default, {
+						key: element.id,
+						elem: element,
+						onUpdatePBarcodeWidth: updatePBarcodeWidth
+					}, null, 8, ["elem"]);
+				}), 128))]),
+				_: 1
+			}, 8, [
+				"id",
+				"zoom",
+				"style",
+				"active-elements",
+				"snap-tracking"
+			]);
+		};
+	}
+});
+//#endregion
+export { stage_canvas_vue_vue_type_script_setup_true_lang_default as default };

package/es/components/label-design/stage/stage-canvas.vue_vue_type_style_index_0_lang.css

@@ -0,0 +1,5 @@
+
+html.droppable,
+html.droppable * {
+  cursor: copy !important;
+}

package/es/components/label-design/stage/stage-header.vue.d.ts

@@ -0,0 +1,2 @@
+declare const _default: import('vue').DefineComponent<{}, {}, {}, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {}, string, import('vue').PublicProps, Readonly<{}> & Readonly<{}>, {}, {}, {}, {}, string, import('vue').ComponentProvideOptions, true, {}, HTMLDivElement>;
+export default _default;

package/es/components/label-design/stage/stage-header.vue.mjs

@@ -0,0 +1,12 @@
+import _plugin_vue_export_helper_default from "../../../_virtual/_plugin-vue_export-helper.mjs";
+import './stage-header.vue_vue_type_style_index_0_scoped_bc7a9820_lang.css';/* empty css                                                                   */
+import { createElementBlock, openBlock } from "vue";
+//#region src/components/label-design/stage/stage-header.vue
+var _sfc_main = {};
+var _hoisted_1 = { class: "designer-stage-header" };
+function _sfc_render(_ctx, _cache) {
+	return openBlock(), createElementBlock("div", _hoisted_1);
+}
+var stage_header_default = /* @__PURE__ */ _plugin_vue_export_helper_default(_sfc_main, [["render", _sfc_render], ["__scopeId", "data-v-bc7a9820"]]);
+//#endregion
+export { stage_header_default as default };

package/es/components/label-design/stage/stage-header.vue_vue_type_style_index_0_scoped_bc7a9820_lang.css

@@ -0,0 +1,7 @@
+.designer-stage-header[data-v-bc7a9820] {
+  display: flex;
+  justify-content: space-between;
+  align-items: center;
+  padding-left: 16px;
+  border-bottom: 1px solid #e0e3ea;
+}

package/es/components/label-design/stage/stage-view.vue.d.ts

@@ -0,0 +1,6 @@
+import { ProjectType } from '../hooks/usePage';
+type __VLS_Props = {
+    project: ProjectType;
+};
+declare const _default: import('vue').DefineComponent<__VLS_Props, {}, {}, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {}, string, import('vue').PublicProps, Readonly<__VLS_Props> & Readonly<{}>, {}, {}, {}, {}, string, import('vue').ComponentProvideOptions, false, {}, HTMLDivElement>;
+export default _default;

package/es/components/label-design/stage/stage-view.vue.mjs

@@ -0,0 +1,5 @@
+import stage_view_vue_vue_type_script_setup_true_lang_default from "./stage-view.vue_vue_type_script_setup_true_lang.mjs";
+//#region src/components/label-design/stage/stage-view.vue
+var stage_view_default = stage_view_vue_vue_type_script_setup_true_lang_default;
+//#endregion
+export { stage_view_default as default };

package/es/components/label-design/stage/stage-view.vue_vue_type_script_setup_true_lang.mjs

@@ -0,0 +1,48 @@
+import "../hooks/usePage.mjs";
+import MrContainer_default from "../components/mr-vue/MrContainer.vue.mjs";
+import StageElv_default from "./StageElv.vue.mjs";
+import { Fragment, computed, createBlock, createElementBlock, defineComponent, normalizeClass, normalizeStyle, openBlock, renderList, withCtx } from "vue";
+//#region src/components/label-design/stage/stage-view.vue?vue&type=script&setup=true&lang.ts
+var stage_view_vue_vue_type_script_setup_true_lang_default = /* @__PURE__ */ defineComponent({
+	__name: "stage-view",
+	props: { project: {} },
+	setup(__props) {
+		const props = __props;
+		const projectObj = computed(() => {
+			return {
+				...props.project,
+				id: props.project.id + "_" + (/* @__PURE__ */ new Date()).getTime()
+			};
+		});
+		const pageStyles = computed(() => {
+			const newProject = props.project;
+			return {
+				...newProject.styles || {},
+				height: isNaN(Number(newProject.height)) ? newProject.height : newProject.height + "px",
+				width: isNaN(Number(newProject.width)) ? newProject.width : newProject.width + "px",
+				zoom: 1,
+				overflow: "hidden"
+			};
+		});
+		return (_ctx, _cache) => {
+			return openBlock(), createBlock(MrContainer_default, {
+				id: projectObj.value?.id,
+				zoom: 1,
+				style: normalizeStyle(pageStyles.value),
+				class: normalizeClass([{ stage: true }]),
+				"snap-tracking": false,
+				"is-design": false
+			}, {
+				default: withCtx(() => [(openBlock(true), createElementBlock(Fragment, null, renderList(projectObj.value?.page, (element) => {
+					return openBlock(), createBlock(StageElv_default, {
+						key: "view_" + element.id,
+						elem: element
+					}, null, 8, ["elem"]);
+				}), 128))]),
+				_: 1
+			}, 8, ["id", "style"]);
+		};
+	}
+});
+//#endregion
+export { stage_view_vue_vue_type_script_setup_true_lang_default as default };

package/es/components/label-design/stage/stage.vue.mjs

@@ -0,0 +1,7 @@
+import _plugin_vue_export_helper_default from "../../../_virtual/_plugin-vue_export-helper.mjs";
+import stage_vue_vue_type_script_setup_true_lang_default from "./stage.vue_vue_type_script_setup_true_lang.mjs";
+import './stage.vue_vue_type_style_index_0_scoped_142d3d35_lang.css';/* empty css                                                            */
+//#region src/components/label-design/stage/stage.vue
+var stage_default = /* @__PURE__ */ _plugin_vue_export_helper_default(stage_vue_vue_type_script_setup_true_lang_default, [["__scopeId", "data-v-142d3d35"]]);
+//#endregion
+export { stage_default as default };