@workday/canvas-kit-labs-react
Version:
Canvas Kit Labs is an incubator for new and experimental components. Since we have a rather rigorous process for getting components in at a production level, it can be valuable to make them available earlier while we continuously iterate on the API/functi
19 lines (18 loc) • 924 B
JavaScript
import React, { useState, useEffect } from 'react';
import styled from '@emotion/styled';
import { accessibleHide } from '@workday/canvas-kit-react/common';
const Container = styled('div')(accessibleHide);
export const Status = ({ ariaLive = 'polite', role = 'status', ariaRelevant = 'additions', expireMilliseconds = 500, announcementText = '', ariaAtomic, }) => {
const [displayText, setDisplayText] = useState(announcementText);
useEffect(() => {
if (!announcementText) {
return;
}
setDisplayText(announcementText);
const clearText = setTimeout(() => setDisplayText(''), expireMilliseconds);
return () => {
clearTimeout(clearText);
};
}, [announcementText, expireMilliseconds]);
return (React.createElement(Container, { "aria-live": ariaLive, role: role, "aria-relevant": ariaRelevant, "aria-atomic": ariaAtomic }, displayText));
};