import { r as p, m as k, M as T, j as n, b6 as y, b7 as C, aJ as S, H as $, aV as L, aK as w, ap as R, ao as W, b8 as B } from "./index-6wLGsgHc.js";
import { S as v } from "./useBasicWidgetState-DqA4I-I_-Cy-zNgyc.js";
import { v as H, y as M, T as u } from "./checkbox-i_07yegq-Ddxf-k8R.js";
function V({
  element: e,
  disabled: a,
  widgetMgr: s,
  fragmentId: c
}) {
  const [f, g] = v({
    getStateFromWidgetMgr: j,
    getDefaultStateFromProto: X,
    getCurrStateFromProto: I,
    updateWidgetMgrState: P,
    element: e,
    widgetMgr: s,
    fragmentId: c
  }), x = p.useCallback(
    (i) => {
      g({
        value: i.target.checked,
        fromUi: !0
      });
    },
    // ESLint complains if we remove this unnecessary dep.
    [g]
  ), t = k(), {
    colors: o,
    spacing: h,
    sizes: r
  } = t, b = T(t), m = a ? o.fadedText40 : o.bodyText;
  return /* @__PURE__ */ n.jsx(y, {
    className: "row-widget stCheckbox",
    "data-testid": "stCheckbox",
    children: /* @__PURE__ */ n.jsx(H, {
      checked: f,
      disabled: a,
      onChange: x,
      "aria-label": e.label,
      checkmarkType: e.type === B.StyleType.TOGGLE ? u.toggle : u.default,
      labelPlacement: M.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 d = b ? o.bgColor : o.bodyText;
            return a && (d = b ? o.gray70 : o.gray90), {
              width: `calc(${r.checkbox} - ${t.spacing.twoXS})`,
              height: `calc(${r.checkbox} - ${t.spacing.twoXS})`,
              transform: i ? `translateX(${r.checkbox})` : "",
              backgroundColor: d,
              boxShadow: ""
            };
          }
        },
        ToggleTrack: {
          style: ({
            $checked: i,
            $isHovered: d
          }) => {
            let l = o.fadedText40;
            return d && !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: d
          }) => {
            const l = d && !a ? o.primary : o.fadedText40;
            return {
              outline: 0,
              width: r.checkbox,
              height: r.checkbox,
              marginTop: t.spacing.twoXS,
              marginLeft: 0,
              marginBottom: 0,
              boxShadow: i && d ? `0 0 0 0.2rem ${W(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: m
          }
        }
      },
      children: /* @__PURE__ */ n.jsxs(C, {
        visibility: S(e.labelVisibility?.value),
        "data-testid": "stWidgetLabel",
        children: [/* @__PURE__ */ n.jsx($, {
          source: e.label,
          allowHTML: !1,
          isLabel: !0,
          largerLabel: !0
        }), e.help && /* @__PURE__ */ n.jsx(L, {
          color: m,
          children: /* @__PURE__ */ n.jsx(w, {
            content: e.help,
            placement: R.TOP_RIGHT
          })
        })]
      })
    })
  });
}
function j(e, a) {
  return e.getBoolValue(a);
}
function X(e) {
  return e.default ?? null;
}
function I(e) {
  return e.value ?? null;
}
function P(e, a, s, c) {
  a.setBoolValue(e, s.value, {
    fromUi: s.fromUi
  }, c);
}
const G = p.memo(V);
export {
  G as default
};
//# sourceMappingURL=index-p-pTZlQx-DHhUO7WL.js.map
