t-fighting-design/es/header/src/index2.js

Fighting design can quickly build interactive interfaces in vue3 applications, which looks good.

import { defineComponent as o, computed as d, openBlock as p, createElementBlock as c, normalizeStyle as l, unref as f, renderSlot as i } from "vue";
import { Props as m } from "./index3.js";
import { sizeChange as r } from "../../_utils/index3.js";
const h = o({
  name: "FHeader"
}), y = /* @__PURE__ */ o({
  ...h,
  props: m,
  setup(n) {
    const a = n, s = d(() => {
      const { height: e, padding: t } = a;
      return {
        "--f-header-height": r(e),
        "--f-header-padding": r(t)
      };
    });
    return (e, t) => (p(), c("header", {
      class: "f-header",
      style: l(f(s))
    }, [
      i(e.$slots, "default")
    ], 4));
  }
});
export {
  y as default
};