chore(typescript): application.js, applicationable.js converted to ty…

…pescript (#4551)

* rename files

* application.ts, applicationable.ts

* fix(application): update types

typeof _uid === 'number'

src/components/Vuetify/mixins/application.ts

@@ -0,0 +1,38 @@
+export type TargetProp = 'bar' | 'bottom' | 'footer' | 'left' | 'right' | 'top'
+
+interface TargetPropValues {
+  [uid: string]: number
+}
+
+export default {
+  bar: 0,
+  bottom: 0,
+  footer: 0,
+  left: 0,
+  right: 0,
+  top: 0,
+  components: {
+    bar: {} as TargetPropValues,
+    bottom: {} as TargetPropValues,
+    footer: {} as TargetPropValues,
+    left: {} as TargetPropValues,
+    right: {} as TargetPropValues,
+    top: {} as TargetPropValues
+  },
+  bind (uid: number, target: TargetProp, value: number): void {
+    if (!this.components[target]) return
+
+    this.components[target] = { [uid]: value }
+    this.update(target)
+  },
+  unbind (uid: number, target: TargetProp): void {
+    if (this.components[target][uid] == null) return
+
+    delete (this.components as any)[target][uid]
+    this.update(target)
+  },
+  update (target: TargetProp): void {
+    this[target] = Object.values(this.components[target])
+      .reduce((acc: number, cur: number): number => (acc + cur), 0)
+  }
+}

src/mixins/applicationable.js → src/mixins/applicationable.ts

@@ -1,26 +1,28 @@
 import { factory as PositionableFactory } from './positionable'
+import { TargetProp } from 'src/components/Vuetify/mixins/application'
 
-export default function applicationable (value, events = []) {
+// Util
+import mixins from '../util/mixins'
+
+export default function applicationable (value: TargetProp, events = []) {
   /* @vue/component */
-  return {
+  return mixins(PositionableFactory(['absolute', 'fixed'])).extend({
     name: 'applicationable',
 
-    mixins: [PositionableFactory(['absolute', 'fixed'])],
-
     props: {
       app: Boolean
     },
 
     computed: {
-      applicationProperty () {
+      applicationProperty (): TargetProp {
         return value
       }
     },
 
     watch: {
       // If previous value was app
       // reset the provided prop
-      app (x, prev) {
+      app (x: boolean, prev: boolean) {
         prev
           ? this.removeApplication(true)
           : this.callUpdate()
@@ -60,15 +62,15 @@ export default function applicationable (value, events = []) {
           this.updateApplication()
         )
       },
-      removeApplication (force) {
+      removeApplication (force = false) {
         if (!force && !this.app) return
 
         this.$vuetify.application.unbind(
           this._uid,
           this.applicationProperty
         )
       },
-      updateApplication: () => {}
+      updateApplication: () => 0
     }
-  }
+  })
 }

types/index.d.ts

@@ -54,7 +54,7 @@ export interface VuetifyObject extends Vue {
 declare module 'vue/types/vue' {
   export interface Vue {
     $vuetify: VuetifyObject
-    _uid: string
+    _uid: number
   }
 }
 
@@ -92,6 +92,9 @@ export interface VuetifyApplication {
   left: number
   right: number
   top: number
+  bind (uid: number, target: string, value: number): void
+  unbind (uid: number, target: string): void
+  update (target: string): void
 }
 
 export interface VuetifyBreakpoint {