'use strict';

var clsx = require('clsx');
var contexts = require('../inputs/contexts.js');
var jsxRuntime = require('react/jsx-runtime');

const Switch = props => {
  const inputAttributes = contexts.useInputAttributes({
    nonLabelable: true
  });
  const {
    checked,
    className,
    id = inputAttributes.id,
    'aria-label': ariaLabel,
    'aria-labelledby': ariaLabelledbyProp,
    onClick,
    disabled
  } = props;
  const handleKeyDown = event => {
    if (event.key === ' ') {
      event.preventDefault();
      onClick();
    }
  };
  const ariaLabelledby = (ariaLabel ? undefined : ariaLabelledbyProp) ?? inputAttributes['aria-labelledby'];
  return /*#__PURE__*/jsxRuntime.jsxs("span", {
    className: clsx.clsx('np-switch', {
      'np-switch--unchecked': !checked,
      'np-switch--checked': checked,
      disabled
    }, className),
    tabIndex: 0,
    role: "switch",
    "aria-checked": checked,
    "aria-label": ariaLabel,
    ...inputAttributes,
    "aria-labelledby": ariaLabelledby,
    id: id,
    "aria-disabled": disabled,
    onClick: !disabled ? onClick : undefined,
    onKeyDown: !disabled ? handleKeyDown : undefined,
    children: [/*#__PURE__*/jsxRuntime.jsx("span", {
      className: "np-switch--thumb"
    }), /*#__PURE__*/jsxRuntime.jsx("input", {
      type: "checkbox",
      checked: checked,
      readOnly: true
    })]
  });
};

module.exports = Switch;
//# sourceMappingURL=Switch.js.map
