koval-ui/dist/src/lib/Skeleton/SkeletonShape.js

React components collection with minimalistic design. Supports theming, layout, and input validation.

"use client";
import { jsx as c } from "react/jsx-runtime";
import { forwardRef as u, useMemo as h } from "react";
import S from "classnames";
import { useLocalTheme as k } from "css-vars-hook";
import { useLinkRefs as d } from "../../internal/hooks/useLinkRefs.js";
import x from "./Skeleton.module.css.js";
import { normalizeUnit as t } from "./normalizeUnit.js";
const L = u(
  ({
    className: a,
    width: e = "fluid",
    height: o,
    borderRadius: r = 6,
    marginY: m = 0,
    marginX: s = 0,
    ...i
  }, f) => {
    const { LocalRoot: n, ref: l } = k();
    d(f, l);
    const p = h(
      () => ({
        width: t(e),
        height: t(o),
        "border-radius": r,
        "margin-y": m,
        "margin-x": s
      }),
      [r, o, s, m, e]
    );
    return /* @__PURE__ */ c(
      n,
      {
        ...i,
        theme: p,
        className: S(x.skeletonShape, a)
      }
    );
  }
);
L.displayName = "SkeletonShape";
export {
  L as SkeletonShape
};
//# sourceMappingURL=SkeletonShape.js.map