@carton-org/react-neumorphism/dist/components/Toggle/Toggle.js

A React component library implementing the neumorphism design style

import { jsxs as m, jsx as t } from "@emotion/react/jsx-runtime";
import { forwardRef as s } from "react";
import { withTheme as y } from "@emotion/react";
import k from "../Typography/Typography.js";
import { StyledToggleContainer as I, StyledToggleWrapper as S, StyledToggleInput as x, StyledToggleButton as v } from "./toggle.styles.js";
import { useForwardRef as w } from "../../hooks/useForwardRef.js";
const R = s(({
  id: l,
  label: c,
  size: n = "sm",
  rounded: g = !1,
  border: d = !1,
  checked: o = !1,
  icons: e,
  onChange: h,
  disabled: r = !1,
  labelStyle: p,
  toggleStyle: $,
  ...a
}, i) => {
  const f = w(i), u = (e == null ? void 0 : e.checkedIcon) !== void 0 && e.uncheckedIcon !== void 0, T = () => {
    r || f.current.click();
  };
  return /* @__PURE__ */ m(I, { $toggleStyle: $, children: [
    c !== void 0 && /* @__PURE__ */ t("label", { htmlFor: l, children: /* @__PURE__ */ t(k, { size: n, labelStyle: p, children: c }) }),
    /* @__PURE__ */ m(S, { $size: n, $rounded: g, $border: d, $checked: o, $disabled: r, children: [
      /* @__PURE__ */ t(x, { $disabled: r, id: l, name: l, ref: f, type: "checkbox", checked: o, onChange: h, disabled: r, ...a }),
      /* @__PURE__ */ t(v, { onClick: T, $size: n, $rounded: g, $border: d, $checked: o, $disabled: r, children: u && (o ? e.checkedIcon : e.uncheckedIcon) })
    ] })
  ] });
}), q = y(R);
export {
  q as default
};