Merge pull request #681 from nature-heart-software/dev

release
nature-heart-software · Jan 1, 2024 · 5c7b0eb · 5c7b0eb
2 parents 9217e8e + 7aa0e02
commit 5c7b0eb
Show file tree

Hide file tree

Showing 3 changed files with 32 additions and 19 deletions.
diff --git a/apps/app/src/modules/electron-window-manager/index.ts b/apps/app/src/modules/electron-window-manager/index.ts
@@ -1,9 +1,9 @@
-export type Instance = {
+export type ElectronWindowManagerInstance = {
   name: string
   window: Electron.BrowserWindow
 }
 export type Instances = {
-  [key: string]: Instance
+  [key: string]: ElectronWindowManagerInstance
 }
 
 const ElectronWindowManager = () => {
@@ -12,7 +12,7 @@ const ElectronWindowManager = () => {
   async function registerInstance(
     name: string,
     createWindow: (winName: string) => Promise<Electron.BrowserWindow>,
-  ): Promise<Instance> {
+  ): Promise<ElectronWindowManagerInstance> {
     const window = await createWindow(name)
     instances[name] = {
       name,
@@ -21,11 +21,11 @@ const ElectronWindowManager = () => {
     return instances[name]
   }
 
-  function getInstanceByName(name: string): Instance | undefined {
+  function getInstanceByName(name: string): ElectronWindowManagerInstance | undefined {
     return instances[name]
   }
 
-  function getInstances(): Instance[] {
+  function getInstances(): ElectronWindowManagerInstance[] {
     return Object.values(instances)
   }
 

diff --git a/apps/app/src/teams/messenger/components/NvMessengerLinksBar.vue b/apps/app/src/teams/messenger/components/NvMessengerLinksBar.vue
@@ -4,7 +4,7 @@
     <template #reference>
       <a href="https://github.com/nature-heart-software/izabela" target="_blank">
         <span class="hidden">GitHub</span>
-        <NvButton icon-name="info" type="plain"/>
+        <NvButton icon-name="info" type="plain" />
       </a>
     </template>
   </NvTooltip>
@@ -15,16 +15,16 @@
         <template #reference>
           <a href="https://github.com/nature-heart-software/izabela" target="_blank">
             <span class="hidden">GitHub</span>
-            <NvButton icon-name="github-alt" size="sm"/>
+            <NvButton icon-name="github-alt" size="sm" />
           </a>
         </template>
       </NvTooltip>
       <NvTooltip>
         <NvText>Follow on Twitter</NvText>
         <template #reference>
-          <a href="https://twitter.com/wurielle" target="_blank">
+          <a href="https://twitter.com/joyfuldeceased" target="_blank">
             <span class="hidden">Twitter</span>
-            <NvButton icon-name="twitter-alt" size="sm"/>
+            <NvButton icon-name="twitter-alt" size="sm" />
           </a>
         </template>
       </NvTooltip>
@@ -33,12 +33,13 @@
         <template #reference>
           <a href="https://discord.gg/BmWtmYmaeQ" target="_blank">
             <span class="hidden">Discord</span>
-            <NvButton icon-name="discord" size="sm"/>
+            <NvButton icon-name="discord" size="sm" />
           </a>
         </template>
       </NvTooltip>
     </NvGroup>
   </NvCard>
 </template>
 <script lang="ts" setup>
-import { NvButton, NvCard, NvGroup, NvText, NvTooltip } from '@packages/ui'</script>
+import { NvButton, NvCard, NvGroup, NvText, NvTooltip } from '@packages/ui'
+</script>
diff --git a/packages/ui/src/components/overlay/Tooltip/NvTooltip.vue b/packages/ui/src/components/overlay/Tooltip/NvTooltip.vue
@@ -1,22 +1,23 @@
 <template>
-  <StTooltip v-bind="props">
-    <tippy v-bind="tippyProps">
-      <slot name="reference"/>
+  <StTooltip ref="tooltip" v-bind="props">
+    <tippy ref="tippyInstance" v-bind="tippyProps">
+      <slot name="reference" />
       <template #content>
-        <slot/>
+        <slot />
       </template>
     </tippy>
   </StTooltip>
 </template>
 <script lang="ts" setup>
-import { defineProps } from 'vue'
+import { defineProps, ref, watch } from 'vue'
 import { StTooltip } from './tooltip.styled'
 import { props as propsDefinition } from './tooltip.shared'
-import { Tippy } from 'vue-tippy'
+import { Tippy, TippyInstance, TippyOptions } from 'vue-tippy'
 import tokens from '@/styles/tokens'
+import { MaybeElement, useFocusWithin } from '@vueuse/core'
 
 const props = defineProps(propsDefinition)
-const tippyProps: typeof props['tippyOptions'] = {
+const tippyProps: TippyOptions = {
   trigger: 'mouseenter focus',
   delay: [250, 0],
   interactive: false,
@@ -26,5 +27,16 @@ const tippyProps: typeof props['tippyOptions'] = {
   theme: `tooltip`,
   maxWidth: 300,
   ...props.tippyOptions,
-}
+} as TippyOptions
+const tooltip = ref<MaybeElement>()
+const tippyInstance = ref<TippyInstance>()
+const { focused } = useFocusWithin(tooltip)
+watch(focused, (value) => {
+  const instance = tippyInstance.value
+  if (value) {
+    if (instance && 'disable' in instance) instance.disable()
+  } else {
+    if (instance && 'enable' in instance) instance.enable()
+  }
+})
 </script>