@arkyn/components 1.3.117 → 1.3.119

package/dist/components/RichText/index.d.ts

@@ -6,7 +6,7 @@ type RichTextProps = {
     enforceCharacterLimit?: boolean;
     defaultValue?: string;
     isError?: boolean;
-    onChangeCharactersCount: (e: number) => void;
+    onChangeCharactersCount?: (e: number) => void;
     onChange?: (value: Descendant[]) => void;
     onValueChange?: (value: string) => void;
 };

package/dist/components/RichText/index.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/components/RichText/index.tsx"],"names":[],"mappings":"AAeA,OAAO,EAAgB,UAAU,EAAoB,MAAM,OAAO,CAAC;AAanE,OAAO,cAAc,CAAC;AAGtB,KAAK,aAAa,GAAG;IACnB,IAAI,EAAE,MAAM,CAAC;IACb,QAAQ,CAAC,EAAE,MAAM,CAAC;IAClB,qBAAqB,CAAC,EAAE,OAAO,CAAC;IAChC,YAAY,CAAC,EAAE,MAAM,CAAC;IACtB,OAAO,CAAC,EAAE,OAAO,CAAC;IAClB,uBAAuB,EAAE,CAAC,CAAC,EAAE,MAAM,KAAK,IAAI,CAAC;IAC7C,QAAQ,CAAC,EAAE,CAAC,KAAK,EAAE,UAAU,EAAE,KAAK,IAAI,CAAC;IACzC,aAAa,CAAC,EAAE,CAAC,KAAK,EAAE,MAAM,KAAK,IAAI,CAAC;CACzC,CAAC;AAEF,iBAAS,QAAQ,CAAC,EAChB,IAAI,EACJ,YAAY,EACZ,qBAA6B,EAC7B,uBAAuB,EACvB,QAAe,EACf,aAAa,EACb,QAAQ,EACR,OAAO,EAAE,WAAW,GACrB,EAAE,aAAa,2CAkHf;AAED,OAAO,EAAE,QAAQ,EAAE,CAAC"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/components/RichText/index.tsx"],"names":[],"mappings":"AAeA,OAAO,EAAgB,UAAU,EAAoB,MAAM,OAAO,CAAC;AAanE,OAAO,cAAc,CAAC;AAGtB,KAAK,aAAa,GAAG;IACnB,IAAI,EAAE,MAAM,CAAC;IACb,QAAQ,CAAC,EAAE,MAAM,CAAC;IAClB,qBAAqB,CAAC,EAAE,OAAO,CAAC;IAChC,YAAY,CAAC,EAAE,MAAM,CAAC;IACtB,OAAO,CAAC,EAAE,OAAO,CAAC;IAClB,uBAAuB,CAAC,EAAE,CAAC,CAAC,EAAE,MAAM,KAAK,IAAI,CAAC;IAC9C,QAAQ,CAAC,EAAE,CAAC,KAAK,EAAE,UAAU,EAAE,KAAK,IAAI,CAAC;IACzC,aAAa,CAAC,EAAE,CAAC,KAAK,EAAE,MAAM,KAAK,IAAI,CAAC;CACzC,CAAC;AAEF,iBAAS,QAAQ,CAAC,EAChB,IAAI,EACJ,YAAY,EACZ,qBAA6B,EAC7B,uBAAuB,EACvB,QAAe,EACf,aAAa,EACb,QAAQ,EACR,OAAO,EAAE,WAAW,GACrB,EAAE,aAAa,2CAqHf;AAED,OAAO,EAAE,QAAQ,EAAE,CAAC"}

package/dist/components/RichText/index.js

@@ -16,8 +16,12 @@ import { INITIAL_VALUE } from "./template/INITIAL_VALUE";
 import "./styles.css";
 import { useFormController } from "../Form/FormController";
 function RichText({ name, defaultValue, enforceCharacterLimit = false, onChangeCharactersCount, maxLimit = 2000, onValueChange, onChange, isError: baseIsError, }) {
-    const [charactersCount, setCharactersCount] = useState(0);
-    const [editorValue, setEditorValue] = useState(defaultValue ? JSON.parse(defaultValue) : INITIAL_VALUE);
+    function extractText(nodes) {
+        return nodes.map((n) => Node.string(n)).join("");
+    }
+    const defaultNodes = defaultValue ? JSON.parse(defaultValue) : INITIAL_VALUE;
+    const [charactersCount, setCharactersCount] = useState(extractText(defaultNodes).length);
+    const [editorValue, setEditorValue] = useState(defaultNodes);
     const [onFocus, setOnFocus] = useState(false);
     const { id, inputRef, error } = useFormController();
     const baseRef = useRef(null);
@@ -26,9 +30,6 @@ function RichText({ name, defaultValue, enforceCharacterLimit = false, onChangeC
     const editor = useMemo(() => withHistory(withReact(createEditor())), []);
     const renderLeaf = useCallback(Leaf, []);
     const renderElement = useCallback(Element, []);
-    function extractText(nodes) {
-        return nodes.map((n) => Node.string(n)).join("");
-    }
     function handleChange(value) {
         const text = extractText(value);
         setCharactersCount(text.length);
@@ -47,7 +48,7 @@ function RichText({ name, defaultValue, enforceCharacterLimit = false, onChangeC
     const focusClass = onFocus ? "focusTrue" : "focusFalse";
     const errorClass = isError
         ? "errorTrue"
-        : maxLimit === charactersCount
+        : maxLimit < charactersCount
             ? "errorTrue"
             : "errorFalse";
     const className = `arkynRichText ${errorClass} ${focusClass}`;

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@arkyn/components",
-  "version": "1.3.117",
+  "version": "1.3.119",
   "main": "./dist/bundle.js",
   "types": "./dist/index.d.ts",
   "author": "Lucas Gonçalves",

package/src/components/RichText/index.tsx

@@ -35,7 +35,7 @@ type RichTextProps = {
   enforceCharacterLimit?: boolean;
   defaultValue?: string;
   isError?: boolean;
-  onChangeCharactersCount: (e: number) => void;
+  onChangeCharactersCount?: (e: number) => void;
   onChange?: (value: Descendant[]) => void;
   onValueChange?: (value: string) => void;
 };
@@ -50,10 +50,17 @@ function RichText({
   onChange,
   isError: baseIsError,
 }: RichTextProps) {
-  const [charactersCount, setCharactersCount] = useState(0);
-  const [editorValue, setEditorValue] = useState<Descendant[]>(
-    defaultValue ? JSON.parse(defaultValue) : INITIAL_VALUE
+  function extractText(nodes: Descendant[]) {
+    return nodes.map((n) => Node.string(n)).join("");
+  }
+
+  const defaultNodes = defaultValue ? JSON.parse(defaultValue) : INITIAL_VALUE;
+
+  const [charactersCount, setCharactersCount] = useState(
+    extractText(defaultNodes).length
   );
+
+  const [editorValue, setEditorValue] = useState<Descendant[]>(defaultNodes);
   const [onFocus, setOnFocus] = useState(false);
 
   const { id, inputRef, error } = useFormController();
@@ -68,10 +75,6 @@ function RichText({
   const renderLeaf = useCallback(Leaf, []);
   const renderElement = useCallback(Element, []);
 
-  function extractText(nodes: Descendant[]) {
-    return nodes.map((n) => Node.string(n)).join("");
-  }
-
   function handleChange(value: Descendant[]) {
     const text = extractText(value);
     setCharactersCount(text.length);
@@ -94,7 +97,7 @@ function RichText({
   const focusClass = onFocus ? "focusTrue" : "focusFalse";
   const errorClass = isError
     ? "errorTrue"
-    : maxLimit === charactersCount
+    : maxLimit < charactersCount
     ? "errorTrue"
     : "errorFalse";