stream-chat-react/dist/components/Form/SwitchField.js

React components to create chat conversations or livestream style chat

import clsx from 'clsx';
import React, { useRef } from 'react';
export const SwitchField = ({ children, ...props }) => {
    const inputRef = useRef(null);
    const handleKeyUp = (event) => {
        if (![' ', 'Enter'].includes(event.key) || !inputRef.current)
            return;
        event.preventDefault();
        inputRef.current.click();
    };
    return (React.createElement("div", { className: clsx('str-chat__form__field str-chat__form__switch-field', {
            'str-chat__form__field str-chat__form__switch-field--disabled': props.disabled,
        }) },
        React.createElement("label", null,
            React.createElement("div", { className: 'str-chat__form__field str-chat__form__switch-field-content' }, children),
            React.createElement("input", { type: 'checkbox', ...props, ref: inputRef }),
            React.createElement("div", { className: clsx('str-chat__form__switch-field__switch', {
                    'str-chat__form__switch-field__switch--on': props.checked,
                }), onKeyUp: handleKeyUp, tabIndex: 0 },
                React.createElement("div", { className: 'str-chat__form__switch-field__switch-handle' })))));
};
export const SimpleSwitchField = ({ labelText, ...props }) => (React.createElement(SwitchField, { ...props },
    React.createElement("div", { className: 'str-chat__form__field str-chat__form__switch-field__text' }, labelText)));