@momentum-ui/react-collaboration
Version:
Cisco Momentum UI Framework for React Collaboration Applications
40 lines • 1.74 kB
JavaScript
var __assign = (this && this.__assign) || function () {
__assign = Object.assign || function(t) {
for (var s, i = 1, n = arguments.length; i < n; i++) {
s = arguments[i];
for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p))
t[p] = s[p];
}
return t;
};
return __assign.apply(this, arguments);
};
import React, { forwardRef } from 'react';
import classnames from 'classnames';
import { useSwitch } from '@react-aria/switch';
import { useToggleState } from '@react-stately/toggle';
import { STYLE } from './Toggle.constants';
import './Toggle.style.scss';
/**
* The Toggle component. Also known as Switch.
* @deprecated Use the equivalent from momentum.design (NPM: `@momentum-design/components/dist/react`)
*/
var Toggle = function (props, providedRef) {
var _a;
var id = props.id, className = props.className, style = props.style, isDisabled = props.isDisabled;
var internalRef = React.useRef();
var ref = providedRef || internalRef;
var state = useToggleState(props);
var inputProps = useSwitch(props, state, ref).inputProps;
return (React.createElement("input", __assign({ className: classnames(STYLE.toggle, className, (_a = {},
_a[STYLE.on] = state.isSelected,
_a[STYLE.off] = !state.isSelected,
_a)), id: id, style: style, "data-disabled": !!isDisabled, "data-selected": state.isSelected }, inputProps, { ref: ref })));
};
/**
* @deprecated Use the equivalent from momentum.design (NPM: `@momentum-design/components/dist/react`)
*/
var ToggleWithRef = forwardRef(Toggle);
ToggleWithRef.displayName = 'Toggle';
export default ToggleWithRef;
//# sourceMappingURL=Toggle.js.map