@carton-org/react-neumorphism
Version:
A React component library implementing the neumorphism design style
40 lines (39 loc) • 1.2 kB
JavaScript
import { jsxs as t, jsx as o } from "@emotion/react/jsx-runtime";
import { withTheme as f } from "@emotion/react";
import { forwardRef as p } from "react";
import n from "../Badge/Badge.js";
import a from "../Typography/Typography.js";
import { StyledContainer as u, StyledProgressBar as y, StyledProgress as B, StyledLabelContainer as l } from "./progressBar.styles.js";
const C = p(({
size: r = "sm",
progress: e,
label: i,
showLabel: d = !0,
insetLabel: m = !1,
progressBarColor: s,
...h
}, c) => /* @__PURE__ */ t(u, { ref: c, $size: r, ...h, children: [
d ? m ? /* @__PURE__ */ t(l, { children: [
/* @__PURE__ */ o(n, { inset: !0, size: r, children: i }),
/* @__PURE__ */ t(n, { inset: !0, size: r, children: [
e,
"%"
] })
] }) : /* @__PURE__ */ t(l, { children: [
/* @__PURE__ */ o(a, { size: r, children: i }),
/* @__PURE__ */ t(a, { size: r, children: [
e,
"%"
] })
] }) : null,
/* @__PURE__ */ o(y, { $size: r, children: /* @__PURE__ */ o(B, { initial: {
width: e
}, animate: {
width: `${e}%`
}, transition: {
duration: 0.3
}, $progressBarColor: s }) })
] })), j = f(C);
export {
j as default
};