@done-coding/admin-core 0.17.1-alpha.0 → 0.18.1-alpha.0

package/es/components/display/TabsHeader.vue2.mjs

@@ -1,75 +1,104 @@
-import { defineComponent as L, toRefs as $, useModel as z, ref as K, computed as n, watch as T, openBlock as i, createElementBlock as o, normalizeClass as y, Fragment as g, renderList as R, unref as S, renderSlot as B, createTextVNode as A, toDisplayString as D, normalizeStyle as H, createCommentVNode as I, mergeModels as N, nextTick as V } from "vue";
-import { useActivated as F } from "../../hooks/activated.mjs";
-const W = ["onClick"], q = /* @__PURE__ */ L({
+import { defineComponent, toRefs, useModel, ref, computed, watch, openBlock, createElementBlock, normalizeClass, Fragment, renderList, unref, renderSlot, createTextVNode, toDisplayString, normalizeStyle, createCommentVNode, mergeModels, nextTick } from "vue";
+import { useActivated } from "../../hooks/activated.mjs";
+const _hoisted_1 = ["onClick"];
+const _sfc_main = /* @__PURE__ */ defineComponent({
   __name: "TabsHeader",
-  props: /* @__PURE__ */ N({
+  props: /* @__PURE__ */ mergeModels({
     tabs: {},
     level: { default: 1 },
     variant: {}
   }, {
-    activeKey: {},
-    activeKeyModifiers: {}
+    "activeKey": {},
+    "activeKeyModifiers": {}
   }),
   emits: ["update:activeKey"],
-  setup(v) {
-    const u = v, { tabs: b, level: k, variant: h } = $(u), s = z(v, "activeKey"), l = /* @__PURE__ */ new Map(), d = K(0), m = n(
-      () => Math.min(Math.max(Math.floor(k.value), 1), 4)
-    ), w = n(() => `tabs-main-bar--l${m.value}`), M = {
+  setup(__props) {
+    const props = __props;
+    const { tabs, level, variant } = toRefs(props);
+    const activeKey = useModel(__props, "activeKey");
+    const tabElMap = /* @__PURE__ */ new Map();
+    const bump = ref(0);
+    const levelClamp = computed(
+      () => Math.min(Math.max(Math.floor(level.value), 1), 4)
+    );
+    const levelClass = computed(() => `tabs-main-bar--l${levelClamp.value}`);
+    const variantDefaultByLevel = {
       1: "card",
       2: "indicator",
       3: "indicator-compact",
       4: "plain"
-    }, r = n(
-      () => h.value ?? M[m.value]
-    ), C = n(
-      () => `tabs-main-bar--variant-${r.value}`
-    ), x = n(
-      () => r.value === "indicator" || r.value === "indicator-compact"
-    ), _ = n(() => {
-      const [, e] = [d.value, s.value], a = e ? l.get(e) : void 0;
-      return a ? {
-        width: `${a.offsetWidth}px`,
-        transform: `translateX(${a.offsetLeft}px)`
-      } : { width: "0px" };
-    }), E = (e, a) => {
-      a instanceof HTMLElement ? l.set(e, a) : l.delete(e);
-    }, c = () => {
-      V(() => {
-        d.value++;
+    };
+    const variantResolved = computed(
+      () => variant.value ?? variantDefaultByLevel[levelClamp.value]
+    );
+    const variantClass = computed(
+      () => `tabs-main-bar--variant-${variantResolved.value}`
+    );
+    const showIndicator = computed(
+      () => variantResolved.value === "indicator" || variantResolved.value === "indicator-compact"
+    );
+    const indicatorStyle = computed(() => {
+      const [, key] = [bump.value, activeKey.value];
+      const el = key ? tabElMap.get(key) : void 0;
+      if (!el) return { width: "0px" };
+      return {
+        width: `${el.offsetWidth}px`,
+        transform: `translateX(${el.offsetLeft}px)`
+      };
+    });
+    const collectTabEl = (key, el) => {
+      if (el instanceof HTMLElement) tabElMap.set(key, el);
+      else tabElMap.delete(key);
+    };
+    const scheduleIndicatorRecalc = () => {
+      nextTick(() => {
+        bump.value++;
       });
-    }, f = () => c();
-    return F((e) => {
-      e.isActivated ? (c(), window.addEventListener("resize", f)) : window.removeEventListener("resize", f);
-    }), T(
-      () => u.tabs,
-      () => c(),
+    };
+    const onResize = () => scheduleIndicatorRecalc();
+    useActivated((info) => {
+      if (info.isActivated) {
+        scheduleIndicatorRecalc();
+        window.addEventListener("resize", onResize);
+      } else {
+        window.removeEventListener("resize", onResize);
+      }
+    });
+    watch(
+      () => props.tabs,
+      () => scheduleIndicatorRecalc(),
       { flush: "post" }
-    ), (e, a) => (i(), o("div", {
-      class: y(["tabs-main-bar", [w.value, C.value]])
-    }, [
-      (i(!0), o(g, null, R(S(b), (t) => (i(), o("button", {
-        key: t.key,
-        ref_for: !0,
-        ref: (p) => E(t.key, p),
-        type: "button",
-        class: y(["tabs-main-bar-item", { "tabs-main-bar-item_active": t.key === s.value }]),
-        onClick: (p) => s.value = t.key
+    );
+    return (_ctx, _cache) => {
+      return openBlock(), createElementBlock("div", {
+        class: normalizeClass(["tabs-main-bar", [levelClass.value, variantClass.value]])
       }, [
-        B(e.$slots, t.key, {
-          tab: t,
-          active: t.key === s.value
-        }, () => [
-          A(D(t.title), 1)
-        ], !0)
-      ], 10, W))), 128)),
-      x.value ? (i(), o("div", {
-        key: 0,
-        class: "tabs-main-bar-indicator",
-        style: H(_.value)
-      }, null, 4)) : I("", !0)
-    ], 2));
+        (openBlock(true), createElementBlock(Fragment, null, renderList(unref(tabs), (tab) => {
+          return openBlock(), createElementBlock("button", {
+            key: tab.key,
+            ref_for: true,
+            ref: (el) => collectTabEl(tab.key, el),
+            type: "button",
+            class: normalizeClass(["tabs-main-bar-item", { "tabs-main-bar-item_active": tab.key === activeKey.value }]),
+            onClick: ($event) => activeKey.value = tab.key
+          }, [
+            renderSlot(_ctx.$slots, tab.key, {
+              tab,
+              active: tab.key === activeKey.value
+            }, () => [
+              createTextVNode(toDisplayString(tab.title), 1)
+            ], true)
+          ], 10, _hoisted_1);
+        }), 128)),
+        showIndicator.value ? (openBlock(), createElementBlock("div", {
+          key: 0,
+          class: "tabs-main-bar-indicator",
+          style: normalizeStyle(indicatorStyle.value)
+        }, null, 4)) : createCommentVNode("", true)
+      ], 2);
+    };
   }
 });
 export {
-  q as default
+  _sfc_main as default
 };

package/es/components/display/TabsMain.vue.mjs

@@ -1,22 +1,22 @@
-import { defineComponent as K, inject as O, toRefs as j, useModel as x, useSlots as z, ref as D, computed as T, h as G, provide as J, watch as W, unref as a, openBlock as u, createBlock as v, createSlots as C, renderList as m, withCtx as s, renderSlot as d, normalizeProps as f, guardReactiveProps as c, resolveDynamicComponent as X, mergeProps as Y, KeepAlive as Z, createCommentVNode as ee, createVNode as te, createElementVNode as ae, mergeModels as ne } from "vue";
-import { useRoute as oe, useRouter as re } from "vue-router";
-import ie from "./TabsRefineFlow.vue.mjs";
-import le from "./TabsNaturalFlow.vue.mjs";
-import se from "./TabsHeader.vue.mjs";
-import ue from "./TabsTile.vue.mjs";
-import { watchTabToQuery as ve, getTabQuery as pe } from "./use-tabs-query-sync.mjs";
-import { TABS_MAIN_VISUAL_LEVEL as q } from "../../inject/key.mjs";
-import { useActivated as me } from "../../hooks/activated.mjs";
-const He = /* @__PURE__ */ K({
+import { defineComponent, inject, toRefs, useModel, useSlots, ref, computed, h, provide, watch, unref, openBlock, createBlock, createSlots, renderList, withCtx, renderSlot, normalizeProps, guardReactiveProps, resolveDynamicComponent, mergeProps, KeepAlive, createCommentVNode, createVNode, createElementVNode, mergeModels } from "vue";
+import { useRoute, useRouter } from "vue-router";
+import _sfc_main$1 from "./TabsRefineFlow.vue.mjs";
+import _sfc_main$2 from "./TabsNaturalFlow.vue.mjs";
+import TabsHeader from "./TabsHeader.vue.mjs";
+import TabsTile from "./TabsTile.vue.mjs";
+import { watchTabToQuery, getTabQuery } from "./use-tabs-query-sync.mjs";
+import { TABS_MAIN_VISUAL_LEVEL } from "../../inject/key.mjs";
+import { useActivated } from "../../hooks/activated.mjs";
+const _sfc_main = /* @__PURE__ */ defineComponent({
   __name: "TabsMain",
-  props: /* @__PURE__ */ ne({
+  props: /* @__PURE__ */ mergeModels({
     tabs: {},
     viewportHeight: {},
     minHeight: { default: 100 },
     channel: {},
     parentChannel: {},
     padding: {},
-    refine: { type: Boolean, default: !1 },
+    refine: { type: Boolean, default: false },
     refineReduceHeight: { default: 0 },
     variant: {},
     queryKey: {},
@@ -25,134 +25,165 @@ const He = /* @__PURE__ */ K({
     navMode: {},
     navOffset: {}
   }, {
-    modelValue: {},
-    modelModifiers: {}
+    "modelValue": {},
+    "modelModifiers": {}
   }),
   emits: ["update:modelValue"],
-  setup(y) {
-    const r = y, h = O(q, 0) + 1, {
-      viewportHeight: g,
-      minHeight: b,
-      channel: M,
-      parentChannel: k,
-      padding: R,
-      refine: p,
-      refineReduceHeight: $,
-      variant: L,
-      tabs: i,
-      tile: A,
-      navPosition: B,
-      navMode: P,
-      navOffset: S
-    } = j(r), o = x(y, "modelValue"), w = oe(), N = re();
-    let V = !1;
-    me((n) => {
-      if (!n.isActivated) return;
-      const t = r.queryKey ? pe(w, r.queryKey) : void 0;
-      t && (o.value = t), V = !0;
-    }), ve({
-      model: o,
-      route: w,
-      router: N,
-      queryKey: () => r.queryKey,
-      ready: () => V
+  setup(__props) {
+    const props = __props;
+    const parentVisualLevel = inject(TABS_MAIN_VISUAL_LEVEL, 0);
+    const selfVisualLevel = parentVisualLevel + 1;
+    const {
+      viewportHeight,
+      minHeight,
+      channel,
+      parentChannel,
+      padding,
+      refine,
+      refineReduceHeight,
+      variant,
+      tabs,
+      tile,
+      navPosition,
+      navMode,
+      navOffset
+    } = toRefs(props);
+    const model = useModel(__props, "modelValue");
+    const route = useRoute();
+    const router = useRouter();
+    let queryReady = false;
+    useActivated((info) => {
+      if (!info.isActivated) return;
+      const activeFromQuery = props.queryKey ? getTabQuery(route, props.queryKey) : void 0;
+      if (activeFromQuery) model.value = activeFromQuery;
+      queryReady = true;
     });
-    const _ = z(), H = D(void 0), E = T(
-      () => p.value ? ie : le
-    ), Q = T(
-      () => p.value ? {
-        viewportHeight: g.value,
-        minHeight: b.value,
-        channel: M.value,
-        parentChannel: k.value,
-        padding: R.value,
-        refineReduceHeight: $.value
+    watchTabToQuery({
+      model,
+      route,
+      router,
+      queryKey: () => props.queryKey,
+      ready: () => queryReady
+    });
+    const slots = useSlots();
+    const contentViewportHeight = ref(void 0);
+    const wrapperComponent = computed(
+      () => refine.value ? _sfc_main$1 : _sfc_main$2
+    );
+    const wrapperProps = computed(
+      () => refine.value ? {
+        viewportHeight: viewportHeight.value,
+        minHeight: minHeight.value,
+        channel: channel.value,
+        parentChannel: parentChannel.value,
+        padding: padding.value,
+        refineReduceHeight: refineReduceHeight.value
       } : {}
-    ), U = (n) => r.tabs.find((t) => t.key === n), F = (n) => {
-      H.value = n;
-    }, I = K({
+    );
+    const tabByKey = (key) => props.tabs.find((tab) => tab.key === key);
+    const onViewportHeightChange = (value) => {
+      contentViewportHeight.value = value;
+    };
+    const TabPane = defineComponent({
       name: "TabsMainPane",
       props: {
-        paneKey: { type: String, required: !0 },
-        viewportHeight: { type: Number, required: !1 }
+        paneKey: { type: String, required: true },
+        viewportHeight: { type: Number, required: false }
       },
-      setup(n) {
+      setup(paneProps) {
         return () => {
-          const t = _[n.paneKey], e = U(n.paneKey);
-          return t ? t({
-            tab: e,
-            active: !0,
-            viewportHeight: n.viewportHeight
-          }) : e != null && e.component ? G(e.component) : null;
+          const slotFn = slots[paneProps.paneKey];
+          const tab = tabByKey(paneProps.paneKey);
+          if (slotFn)
+            return slotFn({
+              tab,
+              active: true,
+              viewportHeight: paneProps.viewportHeight
+            });
+          if (tab == null ? void 0 : tab.component) return h(tab.component);
+          return null;
         };
       }
     });
-    return J(q, h), W(
-      [o, () => r.tabs],
+    provide(TABS_MAIN_VISUAL_LEVEL, selfVisualLevel);
+    watch(
+      [model, () => props.tabs],
       () => {
-        !(!!o.value && r.tabs.some((t) => t.key === o.value)) && r.tabs.length && (o.value = r.tabs[0].key);
+        const valid = !!model.value && props.tabs.some((tab) => tab.key === model.value);
+        if (!valid && props.tabs.length) {
+          model.value = props.tabs[0].key;
+        }
       },
-      { immediate: !0 }
-    ), (n, t) => a(A) ? (u(), v(ue, {
-      key: 0,
-      modelValue: o.value,
-      "onUpdate:modelValue": t[0] || (t[0] = (e) => o.value = e),
-      class: "dc-tabs-main",
-      tabs: a(i),
-      refine: a(p),
-      "viewport-height": a(g),
-      "min-height": a(b),
-      "parent-channel": a(k),
-      "nav-position": a(B),
-      "nav-mode": a(P),
-      "nav-offset": a(S)
-    }, C({ _: 2 }, [
-      m(a(i), (e) => ({
-        name: e.key,
-        fn: s((l) => [
-          d(n.$slots, e.key, f(c(l)))
-        ])
-      })),
-      m(a(i), (e) => ({
-        name: `header-${e.key}`,
-        fn: s((l) => [
-          d(n.$slots, `header-${e.key}`, f(c(l)))
-        ])
-      }))
-    ]), 1032, ["modelValue", "tabs", "refine", "viewport-height", "min-height", "parent-channel", "nav-position", "nav-mode", "nav-offset"])) : (u(), v(X(E.value), Y({
-      key: 1,
-      class: "dc-tabs-main"
-    }, Q.value, { onViewportHeightChange: F }), {
-      header: s(() => [
-        te(se, {
-          "active-key": o.value,
-          "onUpdate:activeKey": t[1] || (t[1] = (e) => o.value = e),
-          tabs: a(i),
-          level: h,
-          variant: a(L)
-        }, C({ _: 2 }, [
-          m(a(i), (e) => ({
-            name: e.key,
-            fn: s((l) => [
-              d(n.$slots, `header-${e.key}`, f(c(l)))
+      { immediate: true }
+    );
+    return (_ctx, _cache) => {
+      return unref(tile) ? (openBlock(), createBlock(TabsTile, {
+        key: 0,
+        modelValue: model.value,
+        "onUpdate:modelValue": _cache[0] || (_cache[0] = ($event) => model.value = $event),
+        class: "dc-tabs-main",
+        tabs: unref(tabs),
+        refine: unref(refine),
+        "viewport-height": unref(viewportHeight),
+        "min-height": unref(minHeight),
+        "parent-channel": unref(parentChannel),
+        "nav-position": unref(navPosition),
+        "nav-mode": unref(navMode),
+        "nav-offset": unref(navOffset)
+      }, createSlots({ _: 2 }, [
+        renderList(unref(tabs), (tab) => {
+          return {
+            name: tab.key,
+            fn: withCtx((scope) => [
+              renderSlot(_ctx.$slots, tab.key, normalizeProps(guardReactiveProps(scope)))
+            ])
+          };
+        }),
+        renderList(unref(tabs), (tab) => {
+          return {
+            name: `header-${tab.key}`,
+            fn: withCtx((scope) => [
+              renderSlot(_ctx.$slots, `header-${tab.key}`, normalizeProps(guardReactiveProps(scope)))
             ])
-          }))
-        ]), 1032, ["active-key", "tabs", "variant"]),
-        t[2] || (t[2] = ae("div", { style: { height: "8px" } }, null, -1))
-      ]),
-      default: s(() => [
-        (u(), v(Z, null, [
-          o.value ? (u(), v(a(I), {
-            key: o.value,
-            "pane-key": o.value,
-            "viewport-height": H.value
-          }, null, 8, ["pane-key", "viewport-height"])) : ee("", !0)
-        ], 1024))
-      ]),
-      _: 3
-    }, 16));
+          };
+        })
+      ]), 1032, ["modelValue", "tabs", "refine", "viewport-height", "min-height", "parent-channel", "nav-position", "nav-mode", "nav-offset"])) : (openBlock(), createBlock(resolveDynamicComponent(wrapperComponent.value), mergeProps({
+        key: 1,
+        class: "dc-tabs-main"
+      }, wrapperProps.value, { onViewportHeightChange }), {
+        header: withCtx(() => [
+          createVNode(TabsHeader, {
+            "active-key": model.value,
+            "onUpdate:activeKey": _cache[1] || (_cache[1] = ($event) => model.value = $event),
+            tabs: unref(tabs),
+            level: selfVisualLevel,
+            variant: unref(variant)
+          }, createSlots({ _: 2 }, [
+            renderList(unref(tabs), (tab) => {
+              return {
+                name: tab.key,
+                fn: withCtx((scope) => [
+                  renderSlot(_ctx.$slots, `header-${tab.key}`, normalizeProps(guardReactiveProps(scope)))
+                ])
+              };
+            })
+          ]), 1032, ["active-key", "tabs", "variant"]),
+          _cache[2] || (_cache[2] = createElementVNode("div", { style: { "height": "8px" } }, null, -1))
+        ]),
+        default: withCtx(() => [
+          (openBlock(), createBlock(KeepAlive, null, [
+            model.value ? (openBlock(), createBlock(unref(TabPane), {
+              key: model.value,
+              "pane-key": model.value,
+              "viewport-height": contentViewportHeight.value
+            }, null, 8, ["pane-key", "viewport-height"])) : createCommentVNode("", true)
+          ], 1024))
+        ]),
+        _: 3
+      }, 16));
+    };
   }
 });
 export {
-  He as default
+  _sfc_main as default
 };

package/es/components/display/TabsMain.vue2.mjs

@@ -1,4 +1,4 @@
-import f from "./TabsMain.vue.mjs";
+import _sfc_main from "./TabsMain.vue.mjs";
 export {
-  f as default
+  _sfc_main as default
 };

package/es/components/display/TabsNaturalFlow.vue.mjs

@@ -1,17 +1,21 @@
-import { defineComponent as s, onMounted as a, openBlock as r, createElementBlock as i, renderSlot as t } from "vue";
-const l = { class: "tabs-natural-flow" }, p = /* @__PURE__ */ s({
+import { defineComponent, onMounted, openBlock, createElementBlock, renderSlot } from "vue";
+const _hoisted_1 = { class: "tabs-natural-flow" };
+const _sfc_main = /* @__PURE__ */ defineComponent({
   __name: "TabsNaturalFlow",
   emits: ["viewportHeightChange"],
-  setup(c, { emit: o }) {
-    const n = o;
-    return a(() => {
-      n("viewportHeightChange", void 0);
-    }), (e, d) => (r(), i("div", l, [
-      t(e.$slots, "header"),
-      t(e.$slots, "default")
-    ]));
+  setup(__props, { emit: __emit }) {
+    const emits = __emit;
+    onMounted(() => {
+      emits("viewportHeightChange", void 0);
+    });
+    return (_ctx, _cache) => {
+      return openBlock(), createElementBlock("div", _hoisted_1, [
+        renderSlot(_ctx.$slots, "header"),
+        renderSlot(_ctx.$slots, "default")
+      ]);
+    };
   }
 });
 export {
-  p as default
+  _sfc_main as default
 };

package/es/components/display/TabsNaturalFlow.vue2.mjs

@@ -1,4 +1,4 @@
-import f from "./TabsNaturalFlow.vue.mjs";
+import _sfc_main from "./TabsNaturalFlow.vue.mjs";
 export {
-  f as default
+  _sfc_main as default
 };

package/es/components/display/TabsRefineFlow.vue.mjs

@@ -1,8 +1,9 @@
-import { defineComponent as f, ref as H, computed as i, provide as u, watch as v, openBlock as w, createElementBlock as C, createVNode as _, createSlots as V, withCtx as a, createElementVNode as S, normalizeStyle as b, renderSlot as r } from "vue";
-import x from "./HeightProvider.vue.mjs";
-import { useChannelViewportHeight as E } from "../../hooks/use-channel-viewport-height.mjs";
-import { SCOPE_VIEWPORT_MAX_HEIGHT as $ } from "../../inject/key.mjs";
-const y = { class: "tabs-refine-flow" }, z = /* @__PURE__ */ f({
+import { defineComponent, ref, computed, provide, watch, openBlock, createElementBlock, createVNode, createSlots, withCtx, createElementVNode, normalizeStyle, renderSlot } from "vue";
+import _sfc_main$1 from "./HeightProvider.vue.mjs";
+import { useChannelViewportHeight } from "../../hooks/use-channel-viewport-height.mjs";
+import { SCOPE_VIEWPORT_MAX_HEIGHT } from "../../inject/key.mjs";
+const _hoisted_1 = { class: "tabs-refine-flow" };
+const _sfc_main = /* @__PURE__ */ defineComponent({
   __name: "TabsRefineFlow",
   props: {
     viewportHeight: {},
@@ -13,52 +14,64 @@ const y = { class: "tabs-refine-flow" }, z = /* @__PURE__ */ f({
     refineReduceHeight: { default: 0 }
   },
   emits: ["viewportHeightChange"],
-  setup(n, { emit: d }) {
-    const t = n, l = d, { viewportHeightFinal: h, nearestScope: p } = E(t), o = H(0), s = i(() => t.padding[0] + t.padding[2]), c = i(() => ({
-      padding: t.padding.map((e) => `${e}px`).join(" "),
+  setup(__props, { emit: __emit }) {
+    const props = __props;
+    const emits = __emit;
+    const { viewportHeightFinal, nearestScope } = useChannelViewportHeight(props);
+    const childViewportHeightChange = ref(0);
+    const paddingVertical = computed(() => props.padding[0] + props.padding[2]);
+    const paddingWrapStyle = computed(() => ({
+      padding: props.padding.map((n) => `${n}px`).join(" "),
       boxSizing: "border-box"
-    })), g = i(
+    }));
+    const heightProviderViewportHeight = computed(
       () => Math.max(
-        h.value - s.value - t.refineReduceHeight,
+        viewportHeightFinal.value - paddingVertical.value - props.refineReduceHeight,
         0
       )
-    ), m = (e) => {
-      o.value = e, l("viewportHeightChange", e);
+    );
+    const onChildViewportHeightChange = (height) => {
+      childViewportHeightChange.value = height;
+      emits("viewportHeightChange", height);
     };
-    return u($, {
-      scope: t.channel,
-      viewportMaxHeight: i(() => o.value),
-      parent: p
-    }), v(
+    provide(SCOPE_VIEWPORT_MAX_HEIGHT, {
+      scope: props.channel,
+      viewportMaxHeight: computed(() => childViewportHeightChange.value),
+      parent: nearestScope
+    });
+    watch(
       // eslint-disable-next-line vue/no-setup-props-destructure
-      () => t.channel,
+      () => props.channel,
       () => console.error("[TabsMain] channel 不支持响应式变更,当前值已忽略。")
-    ), (e, M) => (w(), C("div", y, [
-      _(x, {
-        viewportHeight: g.value,
-        minHeight: n.minHeight,
-        onChildViewportHeightChange: m
-      }, V({
-        default: a(() => [
-          S("div", {
-            style: b(c.value)
-          }, [
-            r(e.$slots, "default")
-          ], 4)
-        ]),
-        _: 2
-      }, [
-        e.$slots.header ? {
-          name: "header",
-          fn: a(() => [
-            r(e.$slots, "header")
+    );
+    return (_ctx, _cache) => {
+      return openBlock(), createElementBlock("div", _hoisted_1, [
+        createVNode(_sfc_main$1, {
+          viewportHeight: heightProviderViewportHeight.value,
+          minHeight: __props.minHeight,
+          onChildViewportHeightChange
+        }, createSlots({
+          default: withCtx(() => [
+            createElementVNode("div", {
+              style: normalizeStyle(paddingWrapStyle.value)
+            }, [
+              renderSlot(_ctx.$slots, "default")
+            ], 4)
           ]),
-          key: "0"
-        } : void 0
-      ]), 1032, ["viewportHeight", "minHeight"])
-    ]));
+          _: 2
+        }, [
+          _ctx.$slots.header ? {
+            name: "header",
+            fn: withCtx(() => [
+              renderSlot(_ctx.$slots, "header")
+            ]),
+            key: "0"
+          } : void 0
+        ]), 1032, ["viewportHeight", "minHeight"])
+      ]);
+    };
   }
 });
 export {
-  z as default
+  _sfc_main as default
 };