chore: moves AnonymousComponent to XAnonymous

Signed-off-by: John Cowen <[email protected]>
kumahq · Jan 22, 2025 · 8c2b4c8 · 8c2b4c8
1 parent 7fef92f
commit 8c2b4c8
Show file tree

Hide file tree

Showing 5 changed files with 41 additions and 4 deletions.
diff --git a/packages/kuma-gui/src/app/common/StatusBadge.vue b/packages/kuma-gui/src/app/common/StatusBadge.vue
@@ -1,5 +1,5 @@
 <template>
-  <component :is="props.status === 'not_available' ? KTooltip : AnonymousComponent">
+  <component :is="props.status === 'not_available' ? KTooltip : XAnonymous">
     <XBadge
       class="status-badge"
       :appearance="BADGE_APPEARANCE[props.status]"
@@ -21,10 +21,11 @@
 import { KTooltip } from '@kong/kongponents'
 
 import { useI18n } from '@/app/application'
-import AnonymousComponent from '@/app/application/components/anonymous-component/AnonymousComponent.vue'
+import XAnonymous from '@/app/x/components/x-anonymous/XAnonymous.vue'
 import { StatusKeyword } from '@/types/index.d'
 import type { BadgeAppearance } from '@kong/kongponents'
 
+
 const { t } = useI18n()
 
 const BADGE_APPEARANCE: Record<StatusKeyword | 'disabled', BadgeAppearance> = {

diff --git a/packages/kuma-gui/src/app/x/components/x-anonymous/README.md b/packages/kuma-gui/src/app/x/components/x-anonymous/README.md
@@ -0,0 +1,33 @@
+# XAnonymous
+
+A completely empty component with no DOM elements at all i.e:
+
+```vue
+<template>
+  <slot name="default" />
+</template>
+```
+
+Mostly used for conditionally rendering an element:
+
+```vue
+  <component :is="true ? XTooltip : XAnonymous">
+    <strong>Tooltipped</strong>
+    <template
+      v-if="true"
+      #content
+    >
+      The tooltip
+    </template>
+  </component>
+  <component :is="false ? XTooltip : XAnonymous">
+    <strong>Not Tooltipped</strong>
+    <template
+      v-if="false"
+      #content
+    >
+      The tooltip
+    </template>
+  </component>
+```
+
diff --git a/...nonymous-component/AnonymousComponent.vue → ...p/x/components/x-anonymous/XAnonymous.vue b/...nonymous-component/AnonymousComponent.vue → ...p/x/components/x-anonymous/XAnonymous.vue
diff --git a/packages/kuma-gui/src/app/x/components/x-icon/XIcon.vue b/packages/kuma-gui/src/app/x/components/x-icon/XIcon.vue
@@ -1,6 +1,6 @@
 <template>
   <component
-    :is="slots.default ? KTooltip : AnonymousComponent"
+    :is="slots.default ? KTooltip : XAnonymous"
     :placement="props.placement"
   >
     <!-- we hardcode decorative to false for the moment due to an issue with kong/icons -->
@@ -52,7 +52,7 @@ import { KTooltip, PopPlacements } from '@kong/kongponents'
 import { useSlots, useAttrs } from 'vue'
 
 import { uniqueId } from '@/app/application'
-import AnonymousComponent from '@/app/application/components/anonymous-component/AnonymousComponent.vue'
+import XAnonymous from '@/app/x/components/x-anonymous/XAnonymous.vue'
 
 defineOptions({
   inheritAttrs: false,

diff --git a/packages/kuma-gui/src/app/x/index.ts b/packages/kuma-gui/src/app/x/index.ts
@@ -4,6 +4,7 @@ import XAboutCard from './components/x-about-card/XAboutCard.vue'
 import XAction from './components/x-action/XAction.vue'
 import XActionGroup from './components/x-action-group/XActionGroup.vue'
 import XAlert from './components/x-alert/XAlert.vue'
+import XAnonymous from './components/x-anonymous/XAnonymous.vue'
 import XBadge from './components/x-badge/XBadge.vue'
 import XBreadcrumbs from './components/x-breadcrumbs/XBreadcrumbs.vue'
 import XCodeBlock from './components/x-code-block/XCodeBlock.vue'
@@ -38,6 +39,7 @@ declare module 'vue' {
     XTooltip: typeof KTooltip
     //
     XAlert: typeof XAlert
+    XAnonymous: typeof XAnonymous
     XIcon: typeof XIcon
     XI18n: typeof XI18n
     XInput: typeof XInput
@@ -91,6 +93,7 @@ export const services = (app: Record<string, Token>): ServiceDefinition[] => {
           //
           ['XAction', XAction],
           ['XActionGroup', XActionGroup],
+          ['XAnonymous', XAnonymous],
           ['XBadge', XBadge],
           ['XBreadcrumbs', XBreadcrumbs],
           ['XCopyButton', XCopyButton],