import { jsxs, Fragment, jsx } from "react/jsx-runtime";
import { Root, Thumb } from "@radix-ui/react-switch";
import * as React from "react";
import { useBindingState } from "../../form/hooks/useBindingState.js";
import { concat } from "../../utils/classNames.js";
import "../../utils/globals.js";
import "zod";
import { useDidUpdateEffect } from "../../hooks/useDidUpdateEffect.js";
import { useArmstrongConfig } from "../config/config.context.js";
import { Label } from "../label/label.component.js";
import { ValidationErrors } from "../validationErrors/validationErrors.component.js";
import "./switch.theme.css.js";
const Switch = React.forwardRef(
  ({ bind, checked, onCheckedChange, defaultChecked, disabled, className, labelClassName, label, validationErrorMessages, validationErrorsClassName, scrollValidationErrorsIntoView, validationMode, displaySize, labelId, required, requiredIndicator, autoValidate, ...nativeProps }, ref) => {
    const generatedId = React.useId();
    const id = nativeProps.id ?? generatedId;
    const [boundValue, setBoundValue, bindConfig] = useBindingState(bind, {
      value: checked,
      onChange: onCheckedChange,
      validationErrorMessages,
      validationMode,
      autoValidate
    });
    const globals = useArmstrongConfig({
      validationMode: bindConfig.validationMode,
      scrollValidationErrorsIntoView,
      inputDisplaySize: displaySize,
      requiredIndicator,
      autoValidate: bindConfig.autoValidate
    });
    const onCheckedChangeInternal = React.useCallback((newValue) => {
      setBoundValue == null ? void 0 : setBoundValue(newValue);
    }, [setBoundValue]);
    useDidUpdateEffect(() => {
      if (globals.autoValidate) {
        bindConfig.validate();
      }
      bindConfig.setTouched(true);
    }, [boundValue]);
    return jsxs(Fragment, { children: [jsxs("div", { className: concat("arm-switch-container", className), "data-disabled": disabled, children: [jsx(Root, { ...nativeProps, className: "arm-switch", id, ref, disabled, defaultChecked, onCheckedChange: onCheckedChangeInternal, checked: boundValue ?? void 0, "data-size": globals.inputDisplaySize, children: jsx(Thumb, { className: "arm-switch-nub" }) }), jsx(Label, { id: labelId, required, requiredIndicator: globals.requiredIndicator, className: concat(labelClassName, "arm-switch-label"), "data-disabled": disabled, htmlFor: id, displaySize: globals.inputDisplaySize, children: label })] }), bindConfig.validationErrorMessages && bindConfig.shouldShowValidationErrorMessage && jsx(ValidationErrors, { className: validationErrorsClassName, validationMode: globals.validationMode, validationErrors: bindConfig.validationErrorMessages, scrollIntoView: globals.scrollValidationErrorsIntoView })] });
  }
  // type assertion to ensure generic works with RefForwarded component
  // DO NOT CHANGE TYPE WITHOUT CHANGING THIS, FIND TYPE BY INSPECTING React.forwardRef
);
Switch.displayName = "Switch";
export {
  Switch
};
//# sourceMappingURL=switch.component.js.map
