@apexcura/ui-components 0.0.15-Beta82 → 0.0.15-Beta84

package/dist/index.js

@@ -328,10 +328,9 @@ var import_tinymce_react = require("@tinymce/tinymce-react");
 var import_react9 = __toESM(require("react"));
 var CkEditor = (props) => {
   const editorRef = (0, import_react8.useRef)(null);
-  const onHandleChange = () => {
+  const log = () => {
     if (editorRef.current) {
       let content = editorRef.current.getContent();
-      console.log(content);
       if (props.onChange) {
         props.onChange(content);
       }
@@ -370,10 +369,9 @@ var CkEditor = (props) => {
         ],
         toolbar: "undo redo | blocks | bold italic forecolor | alignleft aligncenter alignright alignjustify | bullist numlist outdent indent | removeformat | help",
         content_style: "body { font-family:Helvetica,Arial,sans-serif; font-size:14px }"
-      },
-      onChange: onHandleChange
+      }
     }
-  ));
+  ), /* @__PURE__ */ import_react9.default.createElement("button", { onClick: log }, "Log editor content"));
 };
 
 // src/Components/Editor.tsx
@@ -382,60 +380,22 @@ var import_ckeditor5_react = require("@ckeditor/ckeditor5-react");
 var import_ckeditor5_build_classic = __toESM(require("@ckeditor/ckeditor5-build-classic"));
 var Editor2 = (props) => {
   const [ckEditor, setckEditor] = (0, import_react10.useState)(null);
-  (0, import_react10.useEffect)(() => {
-    if (ckEditor) {
-      ckEditor.setData(props.value);
-    }
-  }, [props.value, ckEditor]);
+  console.log(ckEditor);
+  const onHandleData = (event2, ckEditor2) => {
+    props.onChange && props.onChange(ckEditor2.getData());
+  };
   return /* @__PURE__ */ import_react10.default.createElement(
     import_ckeditor5_react.CKEditor,
     {
       editor: import_ckeditor5_build_classic.default,
       config: {
-        plugins: [
-          "advlist",
-          "autolink",
-          "lists",
-          "link",
-          "image",
-          "charmap",
-          "preview",
-          "anchor",
-          "searchreplace",
-          "visualblocks",
-          "code",
-          "fullscreen",
-          "insertdatetime",
-          "media",
-          "table",
-          "code",
-          "help",
-          "wordcount"
-        ],
-        toolbar: {
-          items: [
-            "undo",
-            "redo",
-            "|",
-            "bold",
-            "italic",
-            "foreColor",
-            "|",
-            "alignLeft",
-            "alignCenter",
-            "alignRight",
-            "alignJustify",
-            "|",
-            "bulletedList",
-            "numberedList",
-            "outdent",
-            "indent",
-            "|",
-            "removeFormat",
-            "|",
-            "help"
-          ]
-        }
+        placeholder: `Enter Text`,
+        toolbar: [
+          "bold",
+          "bulletedList",
+          "numberedList",
+          "undo redo | blocks | bold italic forecolor | alignleft aligncenter alignright alignjustify | bullist numlist outdent indent | removeformat | help"
+        ]
       },
       data: props.value || "",
       onReady: (editor) => {
@@ -443,12 +403,12 @@ var Editor2 = (props) => {
           editor.setData(props.value);
           setckEditor(editor);
         } catch (error) {
-          console.error("Error setting CKEditor data:", error);
         }
       },
-      onChange: (event, editor) => {
-        const data = editor.getData();
-        props.onChange && props.onChange(data);
+      onChange: () => onHandleData(event, ckEditor),
+      onBlur: (event2, editor) => {
+      },
+      onFocus: (event2, editor) => {
       }
     }
   );
@@ -1230,7 +1190,7 @@ var SwitchElement = (props) => {
   const onChange = (checked) => {
     props.onChange && props.onChange(checked);
   };
-  return /* @__PURE__ */ import_react29.default.createElement(import_antd20.Switch, { defaultChecked: true, checkedChildren: props.checkedChildren, unCheckedChildren: props.unCheckedChildren, onChange });
+  return /* @__PURE__ */ import_react29.default.createElement(import_antd20.Switch, { defaultChecked: props.value, checkedChildren: props.checkedChildren, unCheckedChildren: props.unCheckedChildren, onChange });
 };
 
 // src/Components/Upload.tsx

package/dist/index.mjs

@@ -258,10 +258,9 @@ import { Editor } from "@tinymce/tinymce-react";
 import React8 from "react";
 var CkEditor = (props) => {
   const editorRef = useRef(null);
-  const onHandleChange = () => {
+  const log = () => {
     if (editorRef.current) {
       let content = editorRef.current.getContent();
-      console.log(content);
       if (props.onChange) {
         props.onChange(content);
       }
@@ -300,72 +299,33 @@ var CkEditor = (props) => {
         ],
         toolbar: "undo redo | blocks | bold italic forecolor | alignleft aligncenter alignright alignjustify | bullist numlist outdent indent | removeformat | help",
         content_style: "body { font-family:Helvetica,Arial,sans-serif; font-size:14px }"
-      },
-      onChange: onHandleChange
+      }
     }
-  ));
+  ), /* @__PURE__ */ React8.createElement("button", { onClick: log }, "Log editor content"));
 };
 
 // src/Components/Editor.tsx
-import React9, { useState as useState4, useEffect } from "react";
+import React9, { useState as useState4 } from "react";
 import { CKEditor } from "@ckeditor/ckeditor5-react";
 import ClassicEditor from "@ckeditor/ckeditor5-build-classic";
 var Editor2 = (props) => {
   const [ckEditor, setckEditor] = useState4(null);
-  useEffect(() => {
-    if (ckEditor) {
-      ckEditor.setData(props.value);
-    }
-  }, [props.value, ckEditor]);
+  console.log(ckEditor);
+  const onHandleData = (event2, ckEditor2) => {
+    props.onChange && props.onChange(ckEditor2.getData());
+  };
   return /* @__PURE__ */ React9.createElement(
     CKEditor,
     {
       editor: ClassicEditor,
       config: {
-        plugins: [
-          "advlist",
-          "autolink",
-          "lists",
-          "link",
-          "image",
-          "charmap",
-          "preview",
-          "anchor",
-          "searchreplace",
-          "visualblocks",
-          "code",
-          "fullscreen",
-          "insertdatetime",
-          "media",
-          "table",
-          "code",
-          "help",
-          "wordcount"
-        ],
-        toolbar: {
-          items: [
-            "undo",
-            "redo",
-            "|",
-            "bold",
-            "italic",
-            "foreColor",
-            "|",
-            "alignLeft",
-            "alignCenter",
-            "alignRight",
-            "alignJustify",
-            "|",
-            "bulletedList",
-            "numberedList",
-            "outdent",
-            "indent",
-            "|",
-            "removeFormat",
-            "|",
-            "help"
-          ]
-        }
+        placeholder: `Enter Text`,
+        toolbar: [
+          "bold",
+          "bulletedList",
+          "numberedList",
+          "undo redo | blocks | bold italic forecolor | alignleft aligncenter alignright alignjustify | bullist numlist outdent indent | removeformat | help"
+        ]
       },
       data: props.value || "",
       onReady: (editor) => {
@@ -373,12 +333,12 @@ var Editor2 = (props) => {
           editor.setData(props.value);
           setckEditor(editor);
         } catch (error) {
-          console.error("Error setting CKEditor data:", error);
         }
       },
-      onChange: (event, editor) => {
-        const data = editor.getData();
-        props.onChange && props.onChange(data);
+      onChange: () => onHandleData(event, ckEditor),
+      onBlur: (event2, editor) => {
+      },
+      onFocus: (event2, editor) => {
       }
     }
   );
@@ -597,7 +557,7 @@ var ButtonElement = (props) => {
 };
 
 // src/Components/AddMoreTable.tsx
-import React14, { useEffect as useEffect2, useState as useState5 } from "react";
+import React14, { useEffect, useState as useState5 } from "react";
 import { Table, Button } from "antd";
 import { PlusOutlined, DeleteOutlined } from "@ant-design/icons";
 var AddMoreTable = (props) => {
@@ -667,7 +627,7 @@ var AddMoreTable = (props) => {
       });
     });
   };
-  useEffect2(() => {
+  useEffect(() => {
   }, [rows]);
   const renderInputElement = (element, value) => {
     if (!element) return null;
@@ -810,12 +770,12 @@ var Navbar = (props) => {
 };
 
 // src/Components/TableElement.tsx
-import React20, { useState as useState6, useEffect as useEffect3 } from "react";
+import React20, { useState as useState6, useEffect as useEffect2 } from "react";
 import { Table as Table2 } from "antd";
 var TableElement = (props) => {
   const { thead, tbody } = props;
   const [dataSource, setDataSource] = useState6([]);
-  useEffect3(() => {
+  useEffect2(() => {
     if (tbody) {
       setDataSource(
         tbody.map((row, index) => ({
@@ -1160,7 +1120,7 @@ var SwitchElement = (props) => {
   const onChange = (checked) => {
     props.onChange && props.onChange(checked);
   };
-  return /* @__PURE__ */ React28.createElement(Switch, { defaultChecked: true, checkedChildren: props.checkedChildren, unCheckedChildren: props.unCheckedChildren, onChange });
+  return /* @__PURE__ */ React28.createElement(Switch, { defaultChecked: props.value, checkedChildren: props.checkedChildren, unCheckedChildren: props.unCheckedChildren, onChange });
 };
 
 // src/Components/Upload.tsx
@@ -1192,7 +1152,7 @@ var Upload2 = (props) => {
 };
 
 // src/Components/OtpElement.tsx
-import React30, { useState as useState11, useRef as useRef2, useEffect as useEffect4 } from "react";
+import React30, { useState as useState11, useRef as useRef2, useEffect as useEffect3 } from "react";
 import { Input as Input3 } from "antd";
 var OtpElement = (props) => {
   const length = props.length;
@@ -1229,7 +1189,7 @@ var OtpElement = (props) => {
       });
     }
   };
-  useEffect4(() => {
+  useEffect3(() => {
     inputRefs.current[0]?.focus();
   }, []);
   return /* @__PURE__ */ React30.createElement("div", { className: props.containerClassName }, Array.from({ length }).map((_, index) => /* @__PURE__ */ React30.createElement(
@@ -1481,7 +1441,7 @@ var HorizontalBarChart = (props) => {
 };
 
 // src/Components/LineChart.tsx
-import React34, { useEffect as useEffect5, useRef as useRef3 } from "react";
+import React34, { useEffect as useEffect4, useRef as useRef3 } from "react";
 import Chart from "chart.js/auto";
 var LineChart = (props) => {
   const chartRef = useRef3(null);
@@ -1492,7 +1452,7 @@ var LineChart = (props) => {
     { label: "Conversion Rate", data: [50, 100, 150, 180, 50] }
   ];
   const labels = ["Instagram", "Whatsapp", "Messages", "Telegram", "Linkedin"];
-  useEffect5(() => {
+  useEffect4(() => {
     if (chartRef.current) {
       if (chartInstance.current) {
         chartInstance.current.destroy();
@@ -1554,12 +1514,12 @@ var LineChart = (props) => {
 };
 
 // src/Components/DoubleBarChart.tsx
-import React35, { useEffect as useEffect6, useRef as useRef4 } from "react";
+import React35, { useEffect as useEffect5, useRef as useRef4 } from "react";
 import Chart2 from "chart.js/auto";
 var DoubleBarChart = (props) => {
   const chartRef = useRef4(null);
   const chartInstance = useRef4(null);
-  useEffect6(() => {
+  useEffect5(() => {
     if (chartRef.current) {
       if (chartInstance.current) {
         chartInstance.current.destroy();

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@apexcura/ui-components",
-  "version": "0.0.15-Beta82",
+  "version": "0.0.15-Beta84",
   "description": "Apex cura React components library",
   "keywords": [
     "apex cura",