@hitachivantara/uikit-react-core/dist/esm/BaseSwitch/BaseSwitch.js

Core React components for the NEXT Design System.

import { jsx } from "react/jsx-runtime";
import { forwardRef, useState, useCallback } from "react";
import MuiSwitch from "@mui/material/Switch";
import { useDefaultProps } from "@hitachivantara/uikit-react-utils";
import { useClasses } from "./BaseSwitch.styles.js";
import { staticClasses } from "./BaseSwitch.styles.js";
const HvBaseSwitch = forwardRef(
  function HvBaseSwitch2(props, ref) {
    const {
      classes: classesProp,
      className,
      id,
      name,
      value = "on",
      required = false,
      readOnly = false,
      disabled = false,
      checked,
      defaultChecked,
      onChange,
      inputProps,
      onFocusVisible,
      onBlur,
      ...others
    } = useDefaultProps("HvBaseSwitch", props);
    const { classes, cx } = useClasses(classesProp);
    const [focusVisible, setFocusVisible] = useState(false);
    const onFocusVisibleCallback = useCallback(
      (evt) => {
        setFocusVisible(true);
        onFocusVisible?.(evt);
      },
      [onFocusVisible]
    );
    const onBlurCallback = useCallback(
      (evt) => {
        setFocusVisible(false);
        onBlur?.(evt);
      },
      [onBlur]
    );
    const onLocalChange = useCallback(
      (evt) => {
        if (readOnly) {
          return;
        }
        onChange?.(evt, evt.target.checked, value);
      },
      [onChange, readOnly, value]
    );
    return /* @__PURE__ */ jsx(
      MuiSwitch,
      {
        ref,
        id,
        name,
        className: cx(
          classes.root,
          {
            [classes.disabled]: disabled,
            [classes.readOnly]: readOnly,
            [classes.focusVisible]: focusVisible
          },
          className
        ),
        color: "default",
        disabled,
        required,
        readOnly,
        onChange: onLocalChange,
        value,
        checked,
        defaultChecked,
        classes: {
          root: classes.switch,
          switchBase: classes.switchBase,
          checked: classes.checked,
          track: classes.track,
          thumb: classes.thumb,
          disabled: classes.disabled
        },
        inputProps,
        onFocusVisible: onFocusVisibleCallback,
        onBlur: onBlurCallback,
        ...others
      }
    );
  }
);
export {
  HvBaseSwitch,
  staticClasses as baseSwitchClasses
};