@megha-ui/react 1.2.674 → 1.2.676

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

@@ -15,6 +15,7 @@ interface EditorProps {
         textColor?: boolean;
         linkOptions?: boolean;
     };
+    toolbarToggle?: any;
 }
 declare const TextEditor: React.FC<EditorProps>;
 export default TextEditor;

package/dist/components/texteditor/index.js

@@ -2,6 +2,7 @@ import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-run
 import { useRef, useEffect, useState } from "react";
 import { FaBold, FaItalic, FaUnderline, FaStrikethrough, FaImage, FaLink, FaUnlink, FaAlignLeft, FaAlignCenter, FaAlignRight, } from "react-icons/fa";
 import { MdFormatListBulleted, MdFormatListNumbered } from "react-icons/md";
+import { SiStyledcomponents } from "react-icons/si";
 const TextEditor = ({ value, onChange, enabledTools = {
     bold: true,
     italic: true,
@@ -14,7 +15,7 @@ const TextEditor = ({ value, onChange, enabledTools = {
     textAlign: true,
     textColor: true,
     linkOptions: true,
-}, }) => {
+}, toolbarToggle, }) => {
     const editorRef = useRef(null);
     const selectionRef = useRef(null);
     const [showImageDropdown, setShowImageDropdown] = useState(false);
@@ -30,6 +31,7 @@ const TextEditor = ({ value, onChange, enabledTools = {
     const IconAlignRight = FaAlignRight;
     const IconFormatListBulleted = MdFormatListBulleted;
     const IconFormatListNumbered = MdFormatListNumbered;
+    const [collapsed, setCollapsed] = useState(true);
     const wrapSelection = (tag) => {
         const selection = document.getSelection();
         if (!selection || selection.rangeCount === 0)
@@ -208,7 +210,12 @@ const TextEditor = ({ value, onChange, enabledTools = {
             borderRadius: "0.25rem",
             padding: "0.65rem",
             position: "relative",
-        }, children: [_jsxs("div", { style: {
+        }, children: [_jsx("div", { style: { position: "absolute", top: "-0.5rem", right: 0 }, children: _jsx("div", { className: "flex-grow-0 flex-shrink-0 flex items-center justify-center mr-2", onClick: () => setCollapsed((previous) => !previous), style: {
+                        background: "rgb(222, 222, 222)",
+                        borderRadius: "0.25rem",
+                        cursor: "pointer",
+                        padding: "0.25rem",
+                    }, children: toolbarToggle !== null && toolbarToggle !== void 0 ? toolbarToggle : _jsx(SiStyledcomponents, {}) }) }), !collapsed && (_jsxs("div", { style: {
                     display: "flex",
                     gap: "0.65rem",
                     marginBottom: "0.65rem",
@@ -220,7 +227,7 @@ const TextEditor = ({ value, onChange, enabledTools = {
                                             if (url)
                                                 insertImage(url);
                                             setShowImageDropdown(false);
-                                        }, style: dropdownItemStyle, children: "Insert from URL" }), _jsxs("label", { style: Object.assign(Object.assign({}, dropdownItemStyle), { cursor: "pointer" }), children: ["Upload from Computer", _jsx("input", { type: "file", accept: "image/*", onChange: handleImageUpload, style: { display: "none" } })] })] }))] })), enabledTools.linkOptions && (_jsxs(_Fragment, { children: [_jsx("button", { type: "button", onClick: insertLink, style: buttonStyle, children: _jsx(IconLink, {}) }), _jsx("button", { type: "button", onClick: removeLink, style: buttonStyle, children: _jsx(IconUnlink, {}) })] }))] }), _jsx("div", { ref: editorRef, contentEditable: true, onInput: updateContent, onClick: handleEditorClick, suppressContentEditableWarning: true, style: {
+                                        }, style: dropdownItemStyle, children: "Insert from URL" }), _jsxs("label", { style: Object.assign(Object.assign({}, dropdownItemStyle), { cursor: "pointer" }), children: ["Upload from Computer", _jsx("input", { type: "file", accept: "image/*", onChange: handleImageUpload, style: { display: "none" } })] })] }))] })), enabledTools.linkOptions && (_jsxs(_Fragment, { children: [_jsx("button", { type: "button", onClick: insertLink, style: buttonStyle, children: _jsx(IconLink, {}) }), _jsx("button", { type: "button", onClick: removeLink, style: buttonStyle, children: _jsx(IconUnlink, {}) })] }))] })), _jsx("div", { ref: editorRef, contentEditable: true, onInput: updateContent, onClick: handleEditorClick, suppressContentEditableWarning: true, style: {
                     height: "max-content",
                     padding: "0.65rem",
                     border: "1px solid var(--divider-strong, #ddd)",

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@megha-ui/react",
-  "version": "1.2.674",
+  "version": "1.2.676",
   "description": "A collection of reusable UI components for React applications, built with TypeScript.",
   "main": "./dist/index.js",
   "module": "./dist/index.js",