@4350pchris/vue-dynamic-client-only/dist/client-only.js

A Vue 3 component that renders its children only on the client using a dynamic component.

import { defineComponent as s, useSlots as a, defineAsyncComponent as c, h as p, ref as i, onMounted as m, openBlock as d, createBlock as u, unref as f, createCommentVNode as C } from "vue";
const y = /* @__PURE__ */ s({
  __name: "ClientOnly",
  props: {
    load: {}
  },
  setup(r) {
    const t = r, e = a(), l = c({
      loader: t.load,
      loadingComponent: e.fallback,
      errorComponent: e.error ?? (() => p("p", "Error loading component")),
      onError: (o) => {
        throw console.error("Component loading failed:", o), o;
      },
      suspensible: !1
    }), n = i(!1);
    return m(() => {
      n.value = !0;
    }), (o, _) => n.value ? (d(), u(f(l), { key: 0 })) : C("", !0);
  }
});
export {
  y as ClientOnly
};