carbon-react
Version:
A library of reusable React components for easily building user interfaces.
2 lines (1 loc) • 1.23 kB
JavaScript
import{jsxs as e,Fragment as r,jsx as t}from"react/jsx-runtime";import{useState as o,useEffect as a,useCallback as n,useMemo as c}from"react";import{useLexicalComposerContext as i}from"@lexical/react/LexicalComposerContext";import{$getRoot as l}from"lexical";import{StyledCharacterCounter as m,VisuallyHiddenCharacterCounter as s}from"./character-counter.style.js";import u from"../../../../../hooks/__internal__/useDebounce/useDebounce.js";import p from"../../../../../hooks/__internal__/useLocale/useLocale.js";const d=({isFocused:d,maxChars:h,namespace:f,marginTop:x})=>{const[_,g]=o(""),[C]=i();a((()=>{C.registerUpdateListener((({editorState:e})=>{e.read((()=>{const e=l().getChildren().map((e=>e.getTextContent())).join("\n\n");g(e)}))}))}),[C]);const j=p(),L=n((e=>new Intl.NumberFormat(j.locale()).format(e)),[j]),[b,v]=o(0),T=c((()=>{const e=h-(_?_.length:0);return e>=0?e:0}),[_,h]),k=u((e=>{v(e||0)}),2e3);return a((()=>{k(T)}),[T,k]),e(r,{children:[t(m,{"data-role":`${f}-character-limit`,marginTop:null!=x?x:"var(--spacing050)",children:j.textEditor.characterCounter(L(T))}),t(s,{id:`${f}-live-character-counter`,"aria-live":d?"polite":"off",children:j.textEditor.characterCounter(L(b))})]})};export{d as default};