@wix/design-system/dist/esm/LiveRegion/LiveRegion.js

@wix/design-system

import React, { forwardRef } from 'react';
import PropTypes from 'prop-types';
import { classes } from './LiveRegion.st.css.js';
/** LiveRegion */
const LiveRegion = forwardRef(({ dataHook }, ref) => {
    const initialState = {
        message: '',
        role: 'status',
    };
    const [state, setState] = React.useReducer((currentState, newState) => ({
        ...currentState,
        ...newState,
    }), initialState);
    const broadcast = ({ message: newMessage, role = 'status', }) => {
        if (state.message === newMessage) {
            // FIXME: Announcing same message multiple times doesn't work on NVDA screen reader
            setState({ message: newMessage + ' ', role });
        }
        else {
            setState({ message: newMessage, role });
        }
    };
    React.useImperativeHandle(ref, () => ({
        broadcast,
    }));
    return (React.createElement("div", { "data-hook": dataHook, className: classes.root, role: state.role, "aria-relevant": "all" }, state.message));
});
LiveRegion.displayName = 'LiveRegion';
LiveRegion.propTypes = {
    dataHook: PropTypes.string,
    className: PropTypes.string,
};
export default LiveRegion;
//# sourceMappingURL=LiveRegion.js.map