@a11y-hud/vue 0.1.0

package/LICENSE

@@ -0,0 +1,26 @@
+MIT License
+
+Copyright (c) 2026 Arthur Vasconcelos
+
+Permission is hereby granted, free of charge, to any person obtaining a copy
+of this software and associated documentation files (the "Software"), to deal
+in the Software without restriction, including without limitation the rights
+to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
+copies of the Software, and to permit persons to whom the Software is
+furnished to do so, subject to the following conditions:
+
+The above copyright notice and this permission notice shall be included in all
+copies or substantial portions of the Software.
+
+THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
+IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
+FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
+AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
+LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
+OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
+SOFTWARE.
+
+---
+
+This software includes icons from Lucide (https://lucide.dev/).
+See LICENSE-ICONS.md for details.

package/dist/index.cjs

@@ -0,0 +1,102 @@
+'use strict';
+
+var vue = require('vue');
+var a11yHud = require('a11y-hud');
+
+// src/component.ts
+function useA11yHud(options = {}) {
+  const instanceRef = vue.shallowRef(null);
+  const elementRef = vue.shallowRef(null);
+  vue.onMounted(() => {
+    const { theme, autoScan, debounce } = options;
+    const instance = a11yHud.mount({
+      ...theme !== void 0 && { theme },
+      ...autoScan !== void 0 && { autoScan },
+      ...debounce !== void 0 && { debounce }
+    });
+    instanceRef.value = instance;
+    elementRef.value = document.querySelector("a11y-hud");
+  });
+  vue.onUnmounted(() => {
+    instanceRef.value?.unmount();
+    instanceRef.value = null;
+    elementRef.value = null;
+  });
+  vue.watch(
+    () => options.theme,
+    (newTheme) => {
+      if (newTheme !== void 0) instanceRef.value?.setTheme(newTheme);
+    },
+    { flush: "post" }
+  );
+  vue.watch(
+    () => options.autoScan,
+    (newAutoScan) => {
+      const el = elementRef.value;
+      if (!el) return;
+      if (newAutoScan === false) {
+        el.removeAttribute("auto-scan");
+      } else {
+        el.setAttribute("auto-scan", "");
+      }
+    },
+    { flush: "post" }
+  );
+  vue.watch(
+    () => options.debounce,
+    (newDebounce) => {
+      const el = elementRef.value;
+      if (!el || newDebounce === void 0) return;
+      el.setAttribute("debounce", String(newDebounce));
+    },
+    { flush: "post" }
+  );
+  vue.watchPostEffect(() => {
+    const instance = instanceRef.value;
+    if (!instance) return;
+    const el = elementRef.value;
+    if (el) {
+      el.scopeElement = options.scope?.value ?? void 0;
+    }
+    void instance.runScan();
+  });
+  function runScan() {
+    return instanceRef.value?.runScan() ?? Promise.resolve(null);
+  }
+  function setTheme(theme) {
+    instanceRef.value?.setTheme(theme);
+  }
+  return { runScan, setTheme };
+}
+
+// src/component.ts
+var A11yHud = vue.defineComponent({
+  name: "A11yHud",
+  props: {
+    theme: {
+      type: String,
+      default: void 0
+    },
+    scope: {
+      type: Object,
+      default: void 0
+    },
+    autoScan: {
+      type: Boolean,
+      default: void 0
+    },
+    debounce: {
+      type: Number,
+      default: void 0
+    }
+  },
+  setup(props) {
+    useA11yHud(props);
+    return () => null;
+  }
+});
+
+exports.A11yHud = A11yHud;
+exports.useA11yHud = useA11yHud;
+//# sourceMappingURL=index.cjs.map
+//# sourceMappingURL=index.cjs.map

package/dist/index.cjs.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../src/composable.ts","../src/component.ts"],"names":["shallowRef","onMounted","mount","onUnmounted","watch","watchPostEffect","defineComponent"],"mappings":";;;;;;AAKO,SAAS,UAAA,CAAW,OAAA,GAA6B,EAAC,EAAqB;AAC5E,EAAA,MAAM,WAAA,GAAcA,eAAmC,IAAI,CAAA;AAC3D,EAAA,MAAM,UAAA,GAAaA,eAAkC,IAAI,CAAA;AAEzD,EAAAC,aAAA,CAAU,MAAM;AACd,IAAA,MAAM,EAAE,KAAA,EAAO,QAAA,EAAU,QAAA,EAAS,GAAI,OAAA;AACtC,IAAA,MAAM,WAAWC,aAAA,CAAM;AAAA,MACrB,GAAI,KAAA,KAAU,MAAA,IAAa,EAAE,KAAA,EAAM;AAAA,MACnC,GAAI,QAAA,KAAa,MAAA,IAAa,EAAE,QAAA,EAAS;AAAA,MACzC,GAAI,QAAA,KAAa,MAAA,IAAa,EAAE,QAAA;AAAS,KAC1C,CAAA;AACD,IAAA,WAAA,CAAY,KAAA,GAAQ,QAAA;AACpB,IAAA,UAAA,CAAW,KAAA,GAAQ,QAAA,CAAS,aAAA,CAA8B,UAAU,CAAA;AAAA,EACtE,CAAC,CAAA;AAED,EAAAC,eAAA,CAAY,MAAM;AAChB,IAAA,WAAA,CAAY,OAAO,OAAA,EAAQ;AAC3B,IAAA,WAAA,CAAY,KAAA,GAAQ,IAAA;AACpB,IAAA,UAAA,CAAW,KAAA,GAAQ,IAAA;AAAA,EACrB,CAAC,CAAA;AAED,EAAAC,SAAA;AAAA,IACE,MAAM,OAAA,CAAQ,KAAA;AAAA,IACd,CAAC,QAAA,KAAa;AACZ,MAAA,IAAI,QAAA,KAAa,MAAA,EAAW,WAAA,CAAY,KAAA,EAAO,SAAS,QAAQ,CAAA;AAAA,IAClE,CAAA;AAAA,IACA,EAAE,OAAO,MAAA;AAAO,GAClB;AAEA,EAAAA,SAAA;AAAA,IACE,MAAM,OAAA,CAAQ,QAAA;AAAA,IACd,CAAC,WAAA,KAAgB;AACf,MAAA,MAAM,KAAK,UAAA,CAAW,KAAA;AACtB,MAAA,IAAI,CAAC,EAAA,EAAI;AACT,MAAA,IAAI,gBAAgB,KAAA,EAAO;AACzB,QAAA,EAAA,CAAG,gBAAgB,WAAW,CAAA;AAAA,MAChC,CAAA,MAAO;AACL,QAAA,EAAA,CAAG,YAAA,CAAa,aAAa,EAAE,CAAA;AAAA,MACjC;AAAA,IACF,CAAA;AAAA,IACA,EAAE,OAAO,MAAA;AAAO,GAClB;AAEA,EAAAA,SAAA;AAAA,IACE,MAAM,OAAA,CAAQ,QAAA;AAAA,IACd,CAAC,WAAA,KAAgB;AACf,MAAA,MAAM,KAAK,UAAA,CAAW,KAAA;AACtB,MAAA,IAAI,CAAC,EAAA,IAAM,WAAA,KAAgB,MAAA,EAAW;AACtC,MAAA,EAAA,CAAG,YAAA,CAAa,UAAA,EAAY,MAAA,CAAO,WAAW,CAAC,CAAA;AAAA,IACjD,CAAA;AAAA,IACA,EAAE,OAAO,MAAA;AAAO,GAClB;AAEA,EAAAC,mBAAA,CAAgB,MAAM;AACpB,IAAA,MAAM,WAAW,WAAA,CAAY,KAAA;AAC7B,IAAA,IAAI,CAAC,QAAA,EAAU;AACf,IAAA,MAAM,KAAK,UAAA,CAAW,KAAA;AACtB,IAAA,IAAI,EAAA,EAAI;AACN,MAAA,EAAA,CAAG,YAAA,GAAe,OAAA,CAAQ,KAAA,EAAO,KAAA,IAAS,MAAA;AAAA,IAC5C;AACA,IAAA,KAAK,SAAS,OAAA,EAAQ;AAAA,EACxB,CAAC,CAAA;AAED,EAAA,SAAS,OAAA,GAA+B;AACtC,IAAA,OAAO,YAAY,KAAA,EAAO,OAAA,EAAQ,IAAK,OAAA,CAAQ,QAAQ,IAA6B,CAAA;AAAA,EACtF;AAEA,EAAA,SAAS,SAAS,KAAA,EAAoB;AACpC,IAAA,WAAA,CAAY,KAAA,EAAO,SAAS,KAAK,CAAA;AAAA,EACnC;AAEA,EAAA,OAAO,EAAE,SAAS,QAAA,EAAS;AAC7B;;;ACvEO,IAAM,UAAUC,mBAAA,CAAgB;AAAA,EACrC,IAAA,EAAM,SAAA;AAAA,EACN,KAAA,EAAO;AAAA,IACL,KAAA,EAAO;AAAA,MACL,IAAA,EAAM,MAAA;AAAA,MACN,OAAA,EAAS;AAAA,KACX;AAAA,IACA,KAAA,EAAO;AAAA,MACL,IAAA,EAAM,MAAA;AAAA,MACN,OAAA,EAAS;AAAA,KACX;AAAA,IACA,QAAA,EAAU;AAAA,MACR,IAAA,EAAM,OAAA;AAAA,MACN,OAAA,EAAS;AAAA,KACX;AAAA,IACA,QAAA,EAAU;AAAA,MACR,IAAA,EAAM,MAAA;AAAA,MACN,OAAA,EAAS;AAAA;AACX,GACF;AAAA,EACA,MAAM,KAAA,EAAO;AACX,IAAA,UAAA,CAAW,KAAqB,CAAA;AAChC,IAAA,OAAO,MAAM,IAAA;AAAA,EACf;AACF,CAAC","file":"index.cjs","sourcesContent":["import type { A11yHudElement, A11yHudInstance, AxeResults, Theme } from \"a11y-hud\";\nimport { mount } from \"a11y-hud\";\nimport { onMounted, onUnmounted, shallowRef, watch, watchPostEffect } from \"vue\";\nimport type { UseA11yHudOptions, UseA11yHudReturn } from \"./types.js\";\n\nexport function useA11yHud(options: UseA11yHudOptions = {}): UseA11yHudReturn {\n  const instanceRef = shallowRef<A11yHudInstance | null>(null);\n  const elementRef = shallowRef<A11yHudElement | null>(null);\n\n  onMounted(() => {\n    const { theme, autoScan, debounce } = options;\n    const instance = mount({\n      ...(theme !== undefined && { theme }),\n      ...(autoScan !== undefined && { autoScan }),\n      ...(debounce !== undefined && { debounce }),\n    });\n    instanceRef.value = instance;\n    elementRef.value = document.querySelector<A11yHudElement>(\"a11y-hud\");\n  });\n\n  onUnmounted(() => {\n    instanceRef.value?.unmount();\n    instanceRef.value = null;\n    elementRef.value = null;\n  });\n\n  watch(\n    () => options.theme,\n    (newTheme) => {\n      if (newTheme !== undefined) instanceRef.value?.setTheme(newTheme);\n    },\n    { flush: \"post\" }\n  );\n\n  watch(\n    () => options.autoScan,\n    (newAutoScan) => {\n      const el = elementRef.value;\n      if (!el) return;\n      if (newAutoScan === false) {\n        el.removeAttribute(\"auto-scan\");\n      } else {\n        el.setAttribute(\"auto-scan\", \"\");\n      }\n    },\n    { flush: \"post\" }\n  );\n\n  watch(\n    () => options.debounce,\n    (newDebounce) => {\n      const el = elementRef.value;\n      if (!el || newDebounce === undefined) return;\n      el.setAttribute(\"debounce\", String(newDebounce));\n    },\n    { flush: \"post\" }\n  );\n\n  watchPostEffect(() => {\n    const instance = instanceRef.value;\n    if (!instance) return;\n    const el = elementRef.value;\n    if (el) {\n      el.scopeElement = options.scope?.value ?? undefined;\n    }\n    void instance.runScan();\n  });\n\n  function runScan(): Promise<AxeResults> {\n    return instanceRef.value?.runScan() ?? Promise.resolve(null as unknown as AxeResults);\n  }\n\n  function setTheme(theme: Theme): void {\n    instanceRef.value?.setTheme(theme);\n  }\n\n  return { runScan, setTheme };\n}\n","import type { Theme } from \"a11y-hud\";\nimport type { PropType, Ref } from \"vue\";\nimport { defineComponent } from \"vue\";\nimport { useA11yHud } from \"./composable.js\";\nimport type { A11yHudProps } from \"./types.js\";\n\nexport const A11yHud = defineComponent({\n  name: \"A11yHud\",\n  props: {\n    theme: {\n      type: String as PropType<Theme>,\n      default: undefined,\n    },\n    scope: {\n      type: Object as PropType<Ref<Element | null>>,\n      default: undefined,\n    },\n    autoScan: {\n      type: Boolean as PropType<boolean>,\n      default: undefined,\n    },\n    debounce: {\n      type: Number as PropType<number>,\n      default: undefined,\n    },\n  },\n  setup(props) {\n    useA11yHud(props as A11yHudProps);\n    return () => null;\n  },\n});\n"]}

package/dist/index.d.cts

@@ -0,0 +1,60 @@
+import * as vue from 'vue';
+import { PropType, Ref } from 'vue';
+import { Theme, AxeResults } from 'a11y-hud';
+
+declare const A11yHud: vue.DefineComponent<vue.ExtractPropTypes<{
+    theme: {
+        type: PropType<Theme>;
+        default: undefined;
+    };
+    scope: {
+        type: PropType<Ref<Element | null>>;
+        default: undefined;
+    };
+    autoScan: {
+        type: PropType<boolean>;
+        default: undefined;
+    };
+    debounce: {
+        type: PropType<number>;
+        default: undefined;
+    };
+}>, () => null, {}, {}, {}, vue.ComponentOptionsMixin, vue.ComponentOptionsMixin, {}, string, vue.PublicProps, Readonly<vue.ExtractPropTypes<{
+    theme: {
+        type: PropType<Theme>;
+        default: undefined;
+    };
+    scope: {
+        type: PropType<Ref<Element | null>>;
+        default: undefined;
+    };
+    autoScan: {
+        type: PropType<boolean>;
+        default: undefined;
+    };
+    debounce: {
+        type: PropType<number>;
+        default: undefined;
+    };
+}>> & Readonly<{}>, {
+    theme: Theme;
+    autoScan: boolean;
+    debounce: number;
+    scope: Ref<Element | null, Element | null>;
+}, {}, {}, {}, string, vue.ComponentProvideOptions, true, {}, any>;
+
+interface UseA11yHudOptions {
+    theme?: Theme;
+    scope?: Ref<Element | null>;
+    autoScan?: boolean;
+    debounce?: number;
+}
+type A11yHudProps = UseA11yHudOptions;
+interface UseA11yHudReturn {
+    runScan(): Promise<AxeResults>;
+    setTheme(theme: Theme): void;
+}
+
+declare function useA11yHud(options?: UseA11yHudOptions): UseA11yHudReturn;
+
+export { A11yHud, type A11yHudProps, type UseA11yHudOptions, type UseA11yHudReturn, useA11yHud };

package/dist/index.d.ts

@@ -0,0 +1,60 @@
+import * as vue from 'vue';
+import { PropType, Ref } from 'vue';
+import { Theme, AxeResults } from 'a11y-hud';
+
+declare const A11yHud: vue.DefineComponent<vue.ExtractPropTypes<{
+    theme: {
+        type: PropType<Theme>;
+        default: undefined;
+    };
+    scope: {
+        type: PropType<Ref<Element | null>>;
+        default: undefined;
+    };
+    autoScan: {
+        type: PropType<boolean>;
+        default: undefined;
+    };
+    debounce: {
+        type: PropType<number>;
+        default: undefined;
+    };
+}>, () => null, {}, {}, {}, vue.ComponentOptionsMixin, vue.ComponentOptionsMixin, {}, string, vue.PublicProps, Readonly<vue.ExtractPropTypes<{
+    theme: {
+        type: PropType<Theme>;
+        default: undefined;
+    };
+    scope: {
+        type: PropType<Ref<Element | null>>;
+        default: undefined;
+    };
+    autoScan: {
+        type: PropType<boolean>;
+        default: undefined;
+    };
+    debounce: {
+        type: PropType<number>;
+        default: undefined;
+    };
+}>> & Readonly<{}>, {
+    theme: Theme;
+    autoScan: boolean;
+    debounce: number;
+    scope: Ref<Element | null, Element | null>;
+}, {}, {}, {}, string, vue.ComponentProvideOptions, true, {}, any>;
+
+interface UseA11yHudOptions {
+    theme?: Theme;
+    scope?: Ref<Element | null>;
+    autoScan?: boolean;
+    debounce?: number;
+}
+type A11yHudProps = UseA11yHudOptions;
+interface UseA11yHudReturn {
+    runScan(): Promise<AxeResults>;
+    setTheme(theme: Theme): void;
+}
+
+declare function useA11yHud(options?: UseA11yHudOptions): UseA11yHudReturn;
+
+export { A11yHud, type A11yHudProps, type UseA11yHudOptions, type UseA11yHudReturn, useA11yHud };

package/dist/index.js

@@ -0,0 +1,99 @@
+import { defineComponent, shallowRef, onMounted, onUnmounted, watch, watchPostEffect } from 'vue';
+import { mount } from 'a11y-hud';
+
+// src/component.ts
+function useA11yHud(options = {}) {
+  const instanceRef = shallowRef(null);
+  const elementRef = shallowRef(null);
+  onMounted(() => {
+    const { theme, autoScan, debounce } = options;
+    const instance = mount({
+      ...theme !== void 0 && { theme },
+      ...autoScan !== void 0 && { autoScan },
+      ...debounce !== void 0 && { debounce }
+    });
+    instanceRef.value = instance;
+    elementRef.value = document.querySelector("a11y-hud");
+  });
+  onUnmounted(() => {
+    instanceRef.value?.unmount();
+    instanceRef.value = null;
+    elementRef.value = null;
+  });
+  watch(
+    () => options.theme,
+    (newTheme) => {
+      if (newTheme !== void 0) instanceRef.value?.setTheme(newTheme);
+    },
+    { flush: "post" }
+  );
+  watch(
+    () => options.autoScan,
+    (newAutoScan) => {
+      const el = elementRef.value;
+      if (!el) return;
+      if (newAutoScan === false) {
+        el.removeAttribute("auto-scan");
+      } else {
+        el.setAttribute("auto-scan", "");
+      }
+    },
+    { flush: "post" }
+  );
+  watch(
+    () => options.debounce,
+    (newDebounce) => {
+      const el = elementRef.value;
+      if (!el || newDebounce === void 0) return;
+      el.setAttribute("debounce", String(newDebounce));
+    },
+    { flush: "post" }
+  );
+  watchPostEffect(() => {
+    const instance = instanceRef.value;
+    if (!instance) return;
+    const el = elementRef.value;
+    if (el) {
+      el.scopeElement = options.scope?.value ?? void 0;
+    }
+    void instance.runScan();
+  });
+  function runScan() {
+    return instanceRef.value?.runScan() ?? Promise.resolve(null);
+  }
+  function setTheme(theme) {
+    instanceRef.value?.setTheme(theme);
+  }
+  return { runScan, setTheme };
+}
+
+// src/component.ts
+var A11yHud = defineComponent({
+  name: "A11yHud",
+  props: {
+    theme: {
+      type: String,
+      default: void 0
+    },
+    scope: {
+      type: Object,
+      default: void 0
+    },
+    autoScan: {
+      type: Boolean,
+      default: void 0
+    },
+    debounce: {
+      type: Number,
+      default: void 0
+    }
+  },
+  setup(props) {
+    useA11yHud(props);
+    return () => null;
+  }
+});
+
+export { A11yHud, useA11yHud };
+//# sourceMappingURL=index.js.map
+//# sourceMappingURL=index.js.map

package/dist/index.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../src/composable.ts","../src/component.ts"],"names":[],"mappings":"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","file":"index.js","sourcesContent":["import type { A11yHudElement, A11yHudInstance, AxeResults, Theme } from \"a11y-hud\";\nimport { mount } from \"a11y-hud\";\nimport { onMounted, onUnmounted, shallowRef, watch, watchPostEffect } from \"vue\";\nimport type { UseA11yHudOptions, UseA11yHudReturn } from \"./types.js\";\n\nexport function useA11yHud(options: UseA11yHudOptions = {}): UseA11yHudReturn {\n  const instanceRef = shallowRef<A11yHudInstance | null>(null);\n  const elementRef = shallowRef<A11yHudElement | null>(null);\n\n  onMounted(() => {\n    const { theme, autoScan, debounce } = options;\n    const instance = mount({\n      ...(theme !== undefined && { theme }),\n      ...(autoScan !== undefined && { autoScan }),\n      ...(debounce !== undefined && { debounce }),\n    });\n    instanceRef.value = instance;\n    elementRef.value = document.querySelector<A11yHudElement>(\"a11y-hud\");\n  });\n\n  onUnmounted(() => {\n    instanceRef.value?.unmount();\n    instanceRef.value = null;\n    elementRef.value = null;\n  });\n\n  watch(\n    () => options.theme,\n    (newTheme) => {\n      if (newTheme !== undefined) instanceRef.value?.setTheme(newTheme);\n    },\n    { flush: \"post\" }\n  );\n\n  watch(\n    () => options.autoScan,\n    (newAutoScan) => {\n      const el = elementRef.value;\n      if (!el) return;\n      if (newAutoScan === false) {\n        el.removeAttribute(\"auto-scan\");\n      } else {\n        el.setAttribute(\"auto-scan\", \"\");\n      }\n    },\n    { flush: \"post\" }\n  );\n\n  watch(\n    () => options.debounce,\n    (newDebounce) => {\n      const el = elementRef.value;\n      if (!el || newDebounce === undefined) return;\n      el.setAttribute(\"debounce\", String(newDebounce));\n    },\n    { flush: \"post\" }\n  );\n\n  watchPostEffect(() => {\n    const instance = instanceRef.value;\n    if (!instance) return;\n    const el = elementRef.value;\n    if (el) {\n      el.scopeElement = options.scope?.value ?? undefined;\n    }\n    void instance.runScan();\n  });\n\n  function runScan(): Promise<AxeResults> {\n    return instanceRef.value?.runScan() ?? Promise.resolve(null as unknown as AxeResults);\n  }\n\n  function setTheme(theme: Theme): void {\n    instanceRef.value?.setTheme(theme);\n  }\n\n  return { runScan, setTheme };\n}\n","import type { Theme } from \"a11y-hud\";\nimport type { PropType, Ref } from \"vue\";\nimport { defineComponent } from \"vue\";\nimport { useA11yHud } from \"./composable.js\";\nimport type { A11yHudProps } from \"./types.js\";\n\nexport const A11yHud = defineComponent({\n  name: \"A11yHud\",\n  props: {\n    theme: {\n      type: String as PropType<Theme>,\n      default: undefined,\n    },\n    scope: {\n      type: Object as PropType<Ref<Element | null>>,\n      default: undefined,\n    },\n    autoScan: {\n      type: Boolean as PropType<boolean>,\n      default: undefined,\n    },\n    debounce: {\n      type: Number as PropType<number>,\n      default: undefined,\n    },\n  },\n  setup(props) {\n    useA11yHud(props as A11yHudProps);\n    return () => null;\n  },\n});\n"]}

package/package.json

@@ -0,0 +1,71 @@
+{
+  "name": "@a11y-hud/vue",
+  "version": "0.1.0",
+  "description": "Vue adapter for a11y-hud — run axe-core accessibility audits in your Vue app with no DevTools required.",
+  "type": "module",
+  "exports": {
+    ".": {
+      "types": "./dist/index.d.ts",
+      "import": "./dist/index.js",
+      "require": "./dist/index.cjs"
+    }
+  },
+  "main": "./dist/index.cjs",
+  "module": "./dist/index.js",
+  "types": "./dist/index.d.ts",
+  "files": [
+    "dist",
+    "LICENSE",
+    "README.md"
+  ],
+  "dependencies": {
+    "a11y-hud": "0.1.1"
+  },
+  "peerDependencies": {
+    "vue": ">=3.4"
+  },
+  "devDependencies": {
+    "@playwright/test": "^1.49.1",
+    "@vue/test-utils": "^2.4.6",
+    "@vitejs/plugin-vue": "^6.0.5",
+    "@vitest/coverage-v8": "^4.1.5",
+    "jsdom": "^29.1.1",
+    "tsup": "^8.3.5",
+    "vue": "^3.5.0",
+    "vitest": "^4.1.5"
+  },
+  "engines": {
+    "node": ">=22"
+  },
+  "license": "MIT",
+  "homepage": "https://github.com/arthurvasconcelos/a11y-hud#readme",
+  "repository": {
+    "type": "git",
+    "url": "git+https://github.com/arthurvasconcelos/a11y-hud.git",
+    "directory": "packages/vue"
+  },
+  "bugs": {
+    "url": "https://github.com/arthurvasconcelos/a11y-hud/issues"
+  },
+  "keywords": [
+    "accessibility",
+    "a11y",
+    "axe",
+    "axe-core",
+    "wcag",
+    "vue",
+    "vue3",
+    "dev-tools",
+    "overlay",
+    "hud"
+  ],
+  "scripts": {
+    "build": "tsup",
+    "dev": "tsup --watch",
+    "test": "vitest run",
+    "test:watch": "vitest",
+    "test:coverage": "vitest run --coverage",
+    "test:e2e": "playwright test",
+    "typecheck": "tsc --noEmit"
+  }
+}