Merge pull request #718 from madeindjs/fix-custom-element

fix(ui): avoid bundling `injectionKeys` in custom components
writer · Jan 7, 2025 · a50852c · a50852c
2 parents 7b34e51 + d6fb5ec
commit a50852c
Show file tree

Hide file tree

Showing 19 changed files with 23 additions and 23 deletions.
diff --git a/src/ui/src/builder/BuilderApp.vue b/src/ui/src/builder/BuilderApp.vue
@@ -75,8 +75,8 @@
 import { computed, defineAsyncComponent, inject, onMounted } from "vue";
 import { useDragDropComponent } from "./useDragDropComponent";
 import { useComponentActions } from "./useComponentActions";
-import injectionKeys from "../injectionKeys";
-import { isPlatformMac } from "../core/detectPlatform";
+import injectionKeys from "@/injectionKeys";
+import { isPlatformMac } from "@/core/detectPlatform";
 import BuilderHeader from "./BuilderHeader.vue";
 import BuilderTooltip from "./BuilderTooltip.vue";
 import BuilderAsyncLoader from "./BuilderAsyncLoader.vue";

diff --git a/src/ui/src/builder/BuilderHeader.vue b/src/ui/src/builder/BuilderHeader.vue
@@ -64,7 +64,7 @@ import { Ref, computed, inject, ref } from "vue";
 import BuilderSwitcher from "./BuilderSwitcher.vue";
 import { useComponentActions } from "./useComponentActions";
 import BuilderModal, { ModalAction } from "./BuilderModal.vue";
-import injectionKeys from "../injectionKeys";
+import injectionKeys from "@/injectionKeys";
 import BuilderStateExplorer from "./BuilderStateExplorer.vue";
 
 const syncHealthIcon = ref(null);

diff --git a/src/ui/src/builder/BuilderSwitcher.vue b/src/ui/src/builder/BuilderSwitcher.vue
@@ -30,7 +30,7 @@
 
 <script setup lang="ts">
 import { computed, inject, Ref, ref } from "vue";
-import injectionKeys from "../injectionKeys";
+import injectionKeys from "@/injectionKeys";
 
 const wf = inject(injectionKeys.core);
 const ssbm = inject(injectionKeys.builderManager);

diff --git a/src/ui/src/builder/settings/BuilderFieldsColor.vue b/src/ui/src/builder/settings/BuilderFieldsColor.vue
@@ -43,7 +43,7 @@ import {
 } from "vue";
 import { Component } from "@/writerTypes";
 import { useComponentActions } from "../useComponentActions";
-import injectionKeys from "../../injectionKeys";
+import injectionKeys from "@/injectionKeys";
 import BuilderTemplateInput from "./BuilderTemplateInput.vue";
 import WdsTabs from "@/wds/WdsTabs.vue";
 import {

diff --git a/src/ui/src/builder/settings/BuilderFieldsKeyValue.vue b/src/ui/src/builder/settings/BuilderFieldsKeyValue.vue
@@ -71,7 +71,7 @@ import {
 	toRefs,
 	watch,
 } from "vue";
-import injectionKeys from "../../injectionKeys";
+import injectionKeys from "@/injectionKeys";
 import { useEvaluator } from "@/renderer/useEvaluator";
 import type { InstancePath } from "@/writerTypes";
 import BuilderFieldsObject from "./BuilderFieldsObject.vue";

diff --git a/src/ui/src/builder/settings/BuilderFieldsShadow.vue b/src/ui/src/builder/settings/BuilderFieldsShadow.vue
@@ -112,7 +112,7 @@ import {
 } from "vue";
 import { Component } from "@/writerTypes";
 import { useComponentActions } from "../useComponentActions";
-import injectionKeys from "../../injectionKeys";
+import injectionKeys from "@/injectionKeys";
 import BuilderTemplateInput from "./BuilderTemplateInput.vue";
 import WdsTabs from "@/wds/WdsTabs.vue";
 import {

diff --git a/src/ui/src/builder/settings/BuilderFieldsText.vue b/src/ui/src/builder/settings/BuilderFieldsText.vue
@@ -33,7 +33,7 @@
 import { toRefs, inject, computed } from "vue";
 import { Component, FieldControl } from "@/writerTypes";
 import { useComponentActions } from "../useComponentActions";
-import injectionKeys from "../../injectionKeys";
+import injectionKeys from "@/injectionKeys";
 import BuilderTemplateInput from "./BuilderTemplateInput.vue";
 
 const wf = inject(injectionKeys.core);

diff --git a/src/ui/src/builder/settings/BuilderFieldsWidth.vue b/src/ui/src/builder/settings/BuilderFieldsWidth.vue
@@ -53,7 +53,7 @@ import {
 } from "vue";
 import { Component } from "@/writerTypes";
 import { useComponentActions } from "../useComponentActions";
-import injectionKeys from "../../injectionKeys";
+import injectionKeys from "@/injectionKeys";
 import BuilderSelect from "../BuilderSelect.vue";
 import BuilderTemplateInput from "./BuilderTemplateInput.vue";
 import WdsTextInput from "@/wds/WdsTextInput.vue";

diff --git a/src/ui/src/builder/settings/BuilderSettings.vue b/src/ui/src/builder/settings/BuilderSettings.vue
@@ -59,7 +59,7 @@
 
 <script setup lang="ts">
 import { inject, computed, ref, watch } from "vue";
-import injectionKeys from "../../injectionKeys";
+import injectionKeys from "@/injectionKeys";
 
 import BuilderSettingsActions from "./BuilderSettingsActions.vue";
 import BuilderSettingsMain from "./BuilderSettingsMain.vue";

diff --git a/src/ui/src/builder/settings/BuilderSettingsAPICode.vue b/src/ui/src/builder/settings/BuilderSettingsAPICode.vue
@@ -63,7 +63,7 @@
 
 <script setup lang="ts">
 import { computed, inject, ref } from "vue";
-import injectionKeys from "../../injectionKeys";
+import injectionKeys from "@/injectionKeys";
 import BuilderModal, { ModalAction } from "../BuilderModal.vue";
 import BuilderEmbeddedCodeEditor from "../BuilderEmbeddedCodeEditor.vue";
 import WdsButton from "@/wds/WdsButton.vue";

diff --git a/src/ui/src/builder/settings/BuilderSettingsActions.vue b/src/ui/src/builder/settings/BuilderSettingsActions.vue
@@ -156,8 +156,8 @@
 import { computed, inject, onMounted, Ref, ref, watch } from "vue";
 import { useComponentActions } from "../useComponentActions";
 import { WriterComponentDefinition } from "@/writerTypes";
-import injectionKeys from "../../injectionKeys";
-import { getModifierKeyName } from "../../core/detectPlatform";
+import injectionKeys from "@/injectionKeys";
+import { getModifierKeyName } from "@/core/detectPlatform";
 import WdsButton from "@/wds/WdsButton.vue";
 import BuilderModal, { ModalAction } from "../BuilderModal.vue";
 

diff --git a/src/ui/src/builder/settings/BuilderSettingsBinding.vue b/src/ui/src/builder/settings/BuilderSettingsBinding.vue
@@ -23,7 +23,7 @@
 <script setup lang="ts">
 import { computed, inject } from "vue";
 import { useComponentActions } from "../useComponentActions";
-import injectionKeys from "../../injectionKeys";
+import injectionKeys from "@/injectionKeys";
 import BuilderTemplateInput from "./BuilderTemplateInput.vue";
 import WdsFieldWrapper from "@/wds/WdsFieldWrapper.vue";
 

diff --git a/src/ui/src/builder/settings/BuilderSettingsMain.vue b/src/ui/src/builder/settings/BuilderSettingsMain.vue
@@ -36,7 +36,7 @@
 
 <script setup lang="ts">
 import { inject, computed, watch, defineAsyncComponent } from "vue";
-import injectionKeys from "../../injectionKeys";
+import injectionKeys from "@/injectionKeys";
 
 import BuilderSettingsProperties from "./BuilderSettingsProperties.vue";
 import BuilderSettingsBinding from "./BuilderSettingsBinding.vue";

diff --git a/src/ui/src/builder/settings/BuilderSettingsProperties.vue b/src/ui/src/builder/settings/BuilderSettingsProperties.vue
@@ -113,7 +113,7 @@
 
 <script setup lang="ts">
 import { computed, inject } from "vue";
-import injectionKeys from "../../injectionKeys";
+import injectionKeys from "@/injectionKeys";
 import { parseInstancePathString } from "@/renderer/instancePath";
 import { FieldCategory, FieldType, InstancePath } from "@/writerTypes";
 import BuilderFieldsAlign from "./BuilderFieldsAlign.vue";

diff --git a/src/ui/src/builder/settings/BuilderSettingsVisibility.vue b/src/ui/src/builder/settings/BuilderSettingsVisibility.vue
@@ -47,7 +47,7 @@
 <script setup lang="ts">
 import { computed, inject } from "vue";
 import { useComponentActions } from "../useComponentActions";
-import injectionKeys from "../../injectionKeys";
+import injectionKeys from "@/injectionKeys";
 import BuilderTemplateInput from "./BuilderTemplateInput.vue";
 import WdsFieldWrapper from "@/wds/WdsFieldWrapper.vue";
 import BuilderSectionTitle from "./BuilderSectionTitle.vue";

diff --git a/src/ui/src/builder/settings/BuilderTemplateInput.vue b/src/ui/src/builder/settings/BuilderTemplateInput.vue
@@ -65,7 +65,7 @@
 
 <script setup lang="ts">
 import Fuse from "fuse.js";
-import injectionKeys from "../../injectionKeys";
+import injectionKeys from "@/injectionKeys";
 import {
 	PropType,
 	inject,

diff --git a/src/ui/src/renderer/ComponentProxy.vue b/src/ui/src/renderer/ComponentProxy.vue
@@ -1,7 +1,7 @@
 <script lang="ts">
 import { PropType, VNode, computed, h, inject, provide, ref, watch } from "vue";
-import { getTemplate } from "../core/templateMap";
-import injectionKeys from "../injectionKeys";
+import { getTemplate } from "@/core/templateMap";
+import injectionKeys from "@/injectionKeys";
 import { Component, InstancePath, InstancePathItem } from "@/writerTypes";
 import ChildlessPlaceholder from "./ChildlessPlaceholder.vue";
 import ComponentProxy from "./ComponentProxy.vue";

diff --git a/src/ui/src/renderer/RendererNotifications.vue b/src/ui/src/renderer/RendererNotifications.vue
@@ -40,8 +40,8 @@
 
 <script setup lang="ts">
 import { inject, onMounted, reactive, Ref, ref } from "vue";
-import injectionKeys from "../injectionKeys";
-import WdsButton from "../wds/WdsButton.vue";
+import injectionKeys from "@/injectionKeys";
+import WdsButton from "@/wds/WdsButton.vue";
 
 const MAX_ITEMS_IN_LIST = 100;
 const wf = inject(injectionKeys.core);

diff --git a/src/ui/vite.config.custom.ts b/src/ui/vite.config.custom.ts
@@ -29,7 +29,7 @@ export default defineConfig({
 			},
 		},
 		rollupOptions: {
-			external: ["vue", "../injectionKeys"],
+			external: ["vue", "@/injectionKeys"],
 			output: {
 				globals: {
 					vue: "vue",