import { u as x, h as T, j as s, S as k, e as C, l as y, f as S, g as L, T as W, P as B, t as R, C as w } from "./index-CsBCemCF.js";
import { memo as E, useCallback as P } from "react";
import { u as j } from "./useBasicWidgetState-KOlq_goV.js";
import { S as $, L as v, a as m } from "./checkbox-4WgCYqx1.js";
function X({
  element: e,
  disabled: a,
  widgetMgr: c,
  fragmentId: d
}) {
  const [f, g] = j({
    getStateFromWidgetMgr: H,
    getDefaultStateFromProto: M,
    getCurrStateFromProto: V,
    updateWidgetMgrState: I,
    element: e,
    widgetMgr: c,
    fragmentId: d
  }), p = P(
    (i) => {
      g({
        value: i.target.checked,
        fromUi: !0
      });
    },
    // ESLint complains if we remove this unnecessary dep.
    [g]
  ), t = x(), {
    colors: o,
    spacing: h,
    sizes: r
  } = t, u = T(t), b = a ? o.fadedText40 : o.bodyText;
  return /* @__PURE__ */ s.jsx(k, { className: "row-widget stCheckbox", "data-testid": "stCheckbox", children: /* @__PURE__ */ s.jsx($, { checked: f, disabled: a, onChange: p, "aria-label": e.label, checkmarkType: e.type === w.StyleType.TOGGLE ? m.toggle : m.default, labelPlacement: v.right, overrides: {
    Root: {
      style: ({
        $isFocusVisible: i
      }) => ({
        marginBottom: h.none,
        marginTop: h.none,
        backgroundColor: i ? o.darkenedBgMix25 : "",
        display: "flex",
        alignItems: "start"
      })
    },
    Toggle: {
      style: ({
        $checked: i
      }) => {
        let n = u ? o.bgColor : o.bodyText;
        return a && (n = u ? o.gray70 : o.gray90), {
          width: `calc(${r.checkbox} - ${t.spacing.twoXS})`,
          height: `calc(${r.checkbox} - ${t.spacing.twoXS})`,
          transform: i ? `translateX(${r.checkbox})` : "",
          backgroundColor: n,
          boxShadow: ""
        };
      }
    },
    ToggleTrack: {
      style: ({
        $checked: i,
        $isHovered: n
      }) => {
        let l = o.fadedText40;
        return n && !a && (l = o.fadedText20), i && !a && (l = o.primary), {
          marginRight: 0,
          marginLeft: 0,
          marginBottom: 0,
          marginTop: t.spacing.twoXS,
          paddingLeft: t.spacing.threeXS,
          paddingRight: t.spacing.threeXS,
          width: `calc(2 * ${r.checkbox})`,
          minWidth: `calc(2 * ${r.checkbox})`,
          height: r.checkbox,
          minHeight: r.checkbox,
          borderBottomLeftRadius: t.radii.full,
          borderTopLeftRadius: t.radii.full,
          borderBottomRightRadius: t.radii.full,
          borderTopRightRadius: t.radii.full,
          backgroundColor: l
        };
      }
    },
    Checkmark: {
      style: ({
        $isFocusVisible: i,
        $checked: n
      }) => {
        const l = n && !a ? o.primary : o.fadedText40;
        return {
          outline: 0,
          width: r.checkbox,
          height: r.checkbox,
          marginTop: t.spacing.twoXS,
          marginLeft: 0,
          marginBottom: 0,
          boxShadow: i && n ? `0 0 0 0.2rem ${R(o.primary, 0.5)}` : "",
          // This is painfully verbose, but baseweb seems to internally
          // use the long-hand version, which means we can't use the
          // shorthand names here as if we do we'll end up with warn
          // logs spamming us every time a checkbox is rendered.
          borderLeftWidth: r.borderWidth,
          borderRightWidth: r.borderWidth,
          borderTopWidth: r.borderWidth,
          borderBottomWidth: r.borderWidth,
          borderLeftColor: l,
          borderRightColor: l,
          borderTopColor: l,
          borderBottomColor: l
        };
      }
    },
    Label: {
      style: {
        lineHeight: t.lineHeights.small,
        paddingLeft: t.spacing.sm,
        position: "relative",
        color: b
      }
    }
  }, children: /* @__PURE__ */ s.jsxs(C, { visibility: y(e.labelVisibility?.value), "data-testid": "stWidgetLabel", children: [
    /* @__PURE__ */ s.jsx(S, { source: e.label, allowHTML: !1, isLabel: !0, largerLabel: !0 }),
    e.help && /* @__PURE__ */ s.jsx(L, { color: b, children: /* @__PURE__ */ s.jsx(W, { content: e.help, placement: B.TOP_RIGHT }) })
  ] }) }) });
}
function H(e, a) {
  return e.getBoolValue(a);
}
function M(e) {
  return e.default ?? null;
}
function V(e) {
  return e.value ?? null;
}
function I(e, a, c, d) {
  a.setBoolValue(e, c.value, {
    fromUi: c.fromUi
  }, d);
}
const z = E(X);
export {
  z as default
};
//# sourceMappingURL=index-BMwC0KGj.js.map
