Global API Methods

/**
 * Install a plugin into Vue
 * @param plugin - Plugin object with install method
 * @param options - Plugin options
 * @returns Vue constructor for chaining
 */
use<Options>(plugin: Plugin<Options>, ...options: Options[]): CompatVue;
use<Options>(plugin: Plugin<Options>, options: Options): CompatVue;

interface Plugin<Options = any> {
  install(app: CompatVue, ...options: Options[]): void;
}

import Vue from "@vue/compat";

// Install plugin with options
Vue.use(MyPlugin, { 
  option1: true, 
  option2: "value" 
});

// Plugin definition
const MyPlugin = {
  install(Vue, options) {
    Vue.prototype.$myMethod = function() {
      // Plugin functionality
    };
  }
};

/**
 * Get registered global component
 * @param name - Component name
 * @returns Component definition or undefined
 */
component(name: string): Component | undefined;

/**
 * Register global component
 * @param name - Component name
 * @param component - Component definition
 * @returns Vue constructor for chaining
 */
component(name: string, component: Component): CompatVue;

// Register global component
Vue.component('my-component', {
  template: '<div>My Component</div>'
});

// Retrieve component
const MyComponent = Vue.component('my-component');

/**
 * Get registered global directive
 * @param name - Directive name
 * @returns Directive definition or undefined
 */
directive<T = any, V = any>(name: string): Directive<T, V> | undefined;

/**
 * Register global directive
 * @param name - Directive name
 * @param directive - Directive definition
 * @returns Vue constructor for chaining
 */
directive<T = any, V = any>(name: string, directive: Directive<T, V>): CompatVue;

interface Directive<T = any, V = any> {
  beforeMount?(el: T, binding: DirectiveBinding<V>): void;
  mounted?(el: T, binding: DirectiveBinding<V>): void;
  beforeUpdate?(el: T, binding: DirectiveBinding<V>): void;
  updated?(el: T, binding: DirectiveBinding<V>): void;
  beforeUnmount?(el: T, binding: DirectiveBinding<V>): void;
  unmounted?(el: T, binding: DirectiveBinding<V>): void;
}

// Register global directive
Vue.directive('focus', {
  mounted(el) {
    el.focus();
  }
});

// Use in template: <input v-focus>

/**
 * Apply a global mixin to all components
 * @param mixin - Mixin object with component options
 * @returns Vue constructor for chaining
 */
mixin(mixin: ComponentOptions): CompatVue;

// Apply global mixin
Vue.mixin({
  created() {
    console.log('Component created via global mixin');
  },
  methods: {
    $log(message) {
      console.log(`[${this.$options.name}] ${message}`);
    }
  }
});

/**
 * Compile template string into render function
 * @param template - Template string or DOM element
 * @returns Compiled render function
 */
compile(template: string): RenderFunction;

interface RenderFunction {
  (context: any): VNode;
  _rc?: boolean; // Runtime compiled marker
}

const render = Vue.compile('<div>{{ message }}</div>');

// Use compiled render function
const component = new Vue({
  data() {
    return { message: 'Hello' };
  },
  render
});

/**
 * Vue version string
 */
version: string;

/**
 * Next tick utility for DOM updates
 */
nextTick: typeof nextTick;

/**
 * Global configuration object
 */
config: AppConfig & LegacyConfig;

/**
 * Create a subclass of Vue constructor
 * @param options - Component options for the subclass
 * @returns Extended Vue constructor
 * @deprecated Use defineComponent or extends option instead
 */
extend(options?: ComponentOptions): CompatVue;

// Vue 2 pattern (deprecated)
const MyComponent = Vue.extend({
  data() {
    return { count: 0 };
  },
  template: '<div>{{ count }}</div>'
});

// Vue 3 equivalent
import { defineComponent } from 'vue';
const MyComponent = defineComponent({
  data() {
    return { count: 0 };
  },
  template: '<div>{{ count }}</div>'
});

/**
 * Reactively set a property on an object
 * @param target - Target object
 * @param key - Property key
 * @param value - Value to set
 * @deprecated No longer needed in Vue 3 reactivity system
 */
set(target: any, key: PropertyKey, value: any): void;

/**
 * Reactively delete a property from an object
 * @param target - Target object
 * @param key - Property key to delete
 * @deprecated No longer needed in Vue 3 reactivity system
 */
delete(target: any, key: PropertyKey): void;

/**
 * Make an object reactive
 * @deprecated Use reactive() from Vue 3 instead
 */
observable: typeof reactive;

// Vue 2 pattern (still works in compat)
const state = Vue.observable({ count: 0 });

// Vue 3 equivalent
import { reactive } from 'vue';
const state = reactive({ count: 0 });

/**
 * Register or retrieve filters
 * @param name - Filter name
 * @param arg - Filter function (when registering)
 * @returns null (filters are removed in Vue 3)
 * @deprecated Filters are removed in Vue 3
 */
filter(name: string, arg?: any): null;

/**
 * Internal component identifier
 */
cid: number;

/**
 * Global options object
 */
options: ComponentOptions;

/**
 * Internal utilities
 * @deprecated Private APIs are no longer available
 */
util: any;

/**
 * Reference to parent constructor
 */
super: CompatVue;