sccoreui 4.4.7 → 4.5.0

package/dist/App.scss

@@ -507,8 +507,24 @@ div:has(ul.date_filter) .p-datepicker-footer {
   width: 18.063rem;
 }
 
-#fontFamily-1 {
-  border: 1px solid var(--gray-300);
+button[data-cmd='fontFamily']{
+  border: 1px solid var(--gray-300) !important;
+  &::before {
+    content: '';
+    border: 2px solid gray;
+    border-left: 0;
+    border-top: 0;
+    width: 6px;
+    height: 6px;
+    position: absolute;
+    right: 8px;
+    top: 39%;
+    transform: rotate(45deg);
+  }
+}
+
+button[data-cmd='fontFamily'] {
+  // border: 1px solid var(--gray-300);
 }
 
 .fr-toolbar .fr-btn-grp {
@@ -624,16 +640,16 @@ button#formatOLOptions-1.fr-active::before {
 }
 
 #fontFamily-1:before {
-  content: '';
-  border: 2px solid gray;
-  border-left: 0;
-  border-top: 0;
-  width: 6px;
-  height: 6px;
-  position: absolute;
-  right: 8px;
-  top: 39%;
-  transform: rotate(45deg);
+  // content: '';
+  // border: 2px solid gray;
+  // border-left: 0;
+  // border-top: 0;
+  // width: 6px;
+  // height: 6px;
+  // position: absolute;
+  // right: 8px;
+  // top: 39%;
+  // transform: rotate(45deg);
 }
 
 .fr-toolbar .fr-btn-grp {

package/dist/components/custom-color-picker/color-picker.js

@@ -0,0 +1,14 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+const jsx_runtime_1 = require("react/jsx-runtime");
+const react_1 = require("react");
+const react_color_1 = require("react-color");
+const CustomColorPicker = ({ onChange, defaultValue }) => {
+    const [color, setColor] = (0, react_1.useState)(defaultValue);
+    const handleColorChange = (newColor) => {
+        setColor(newColor.hex);
+        onChange(newColor);
+    };
+    return ((0, jsx_runtime_1.jsx)(jsx_runtime_1.Fragment, { children: (0, jsx_runtime_1.jsx)(react_color_1.ChromePicker, { color: color, onChange: handleColorChange }) }));
+};
+exports.default = CustomColorPicker;

package/dist/components/froala-editor/FroalaEditor.js

@@ -10,13 +10,14 @@ require("froala-editor/js/plugins.pkgd.min.js");
 // import { SvgComponent } from 'sccoreui';
 // import SvgComponent from '../../directives/svg-component';
 // import { Bold, Italic } from '../../assets/svg/svg';
-const FroalaTextEditor = () => {
+const FroalaTextEditor = ({ onChange, value }) => {
     const editorRef = (0, react_1.useRef)(null);
-    const html = ``;
-    const [editorContent, setEditorContent] = (0, react_1.useState)(html);
+    // const html = ``;
+    const [editorContent, setEditorContent] = (0, react_1.useState)(value);
     // Callback function to handle content changes
     const handleModelChange = (content) => {
         setEditorContent(content);
+        onChange(content);
     };
     // const handleKeyUp = () => {
     //   // Access the current content of the editor

package/dist/types/components/custom-color-picker/color-picker.d.ts

@@ -0,0 +1,3 @@
+import { CustomColorPickerTypes } from '../types/type';
+declare const CustomColorPicker: ({ onChange, defaultValue }: CustomColorPickerTypes) => import("react/jsx-runtime").JSX.Element;
+export default CustomColorPicker;

package/dist/types/components/froala-editor/FroalaEditor.d.ts

@@ -1,5 +1,6 @@
 import 'froala-editor/css/froala_editor.pkgd.min.css';
 import 'froala-editor/css/froala_style.min.css';
 import 'froala-editor/js/plugins.pkgd.min.js';
-declare const FroalaTextEditor: () => import("react/jsx-runtime").JSX.Element;
+import { FroalaTextEditorTypes } from '../types/type';
+declare const FroalaTextEditor: ({ onChange, value }: FroalaTextEditorTypes) => import("react/jsx-runtime").JSX.Element;
 export default FroalaTextEditor;

package/dist/types/components/types/type.d.ts

@@ -155,3 +155,11 @@ export interface TreeDropdownSelectTypes {
     expandedKeys: any;
     classNames?: any;
 }
+export interface CustomColorPickerTypes {
+    onChange?: any;
+    defaultValue: string;
+}
+export interface FroalaTextEditorTypes {
+    onChange?: any;
+    value: string;
+}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "sccoreui",
-  "version": "4.4.7",
+  "version": "4.5.0",
   "description": "ui-sccore",
   "main": "./dist/index.js",
   "module": "./dist/index.js",
@@ -39,6 +39,7 @@
     "primereact": "^9.5.0",
     "quill": "^1.3.7",
     "react": "^18.2.0",
+    "react-color": "^2.19.3",
     "react-dom": "^18.2.0",
     "react-froala-wysiwyg": "^4.1.2",
     "react-phone-number-input": "^3.3.6",