chore: consolidate new foundation and archive v1 (#1495)

2026-09-07 12:32:57 -05:00
parent 9a5fbdbda7 5d27700026
commit 127a54fdff
3511 changed files with 727899 additions and 10 deletions
@@ -0,0 +1,58 @@
+---
+category: Elements
+---
+
+# useMutationObserver
+
+Watch for changes being made to the DOM tree. [MutationObserver MDN](https://developer.mozilla.org/en-US/docs/Web/API/MutationObserver)
+
+## Usage
+
+```vue
+<script setup lang="ts">
+import { useMutationObserver } from '@vueuse/core';
+import { ref, useTemplateRef } from 'vue';
+
+const el = useTemplateRef('el');
+const messages = ref([]);
+
+useMutationObserver(
+  el,
+  (mutations) => {
+    if (mutations[0]) messages.value.push(mutations[0].attributeName);
+  },
+  {
+    attributes: true,
+  },
+);
+</script>
+
+<template>
+  <div ref="el">Hello VueUse</div>
+</template>
+```
+
+## Type Declarations
+
+```ts
+export interface UseMutationObserverOptions extends MutationObserverInit, ConfigurableWindow {}
+/**
+ * Watch for changes being made to the DOM tree.
+ *
+ * @see https://vueuse.org/useMutationObserver
+ * @see https://developer.mozilla.org/en-US/docs/Web/API/MutationObserver MutationObserver MDN
+ * @param target
+ * @param callback
+ * @param options
+ */
+export declare function useMutationObserver(
+  target: MaybeComputedElementRef | MaybeComputedElementRef[] | MaybeRefOrGetter<MaybeElement[]>,
+  callback: MutationCallback,
+  options?: UseMutationObserverOptions,
+): {
+  isSupported: ComputedRef<boolean>;
+  stop: () => void;
+  takeRecords: () => MutationRecord[] | undefined;
+};
+export type UseMutationObserverReturn = ReturnType<typeof useMutationObserver>;
+```