react-text-forge 1.1.1 → 1.2.0

package/LICENSE.txt

@@ -0,0 +1,21 @@
+MIT License
+
+Copyright (c) 2025 Jahylis
+
+Permission is hereby granted, free of charge, to any person obtaining a copy
+of this software and associated documentation files (the "Software"), to deal
+in the Software without restriction, including without limitation the rights
+to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
+copies of the Software, and to permit persons to whom the Software is
+furnished to do so, subject to the following conditions:
+
+The above copyright notice and this permission notice shall be included in all
+copies or substantial portions of the Software.
+
+THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
+IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
+FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
+AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
+LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
+OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
+SOFTWARE.

package/README.md

@@ -11,7 +11,7 @@ npm install react-texte-forge
 ```
 ## Utilisation
 
-Voici un exemple de base pour utiliser ReactTextForge dans votre application React :
+Voici un exemple pour utiliser ReactTextForge par défaut dans votre application React :
 
 ```jsx
 import React, { useState } from "react";
@@ -26,6 +26,22 @@ export default function App() {
 }
 ```
 
+Par défaut, des couleurs sont données à l'éditeur: noire pour les images et les bordures, blanche pour l'arrière-plan
+Vous pouvez personnaliser ces couleurs comme ceci :
+
+```jsx
+import React, { useState } from "react";
+import ReactTextForge from "./components/ReactTextForge";
+
+export default function App() {
+    const [value, setValue] = useState({});
+
+    return (
+        <ReactTextForge value={value} setValue={setValue} imageColor='#FFF' backgroundColor='#4a91e4' />
+    );
+}
+```
+
 ## Licence
 Ce projet est sous licence MIT.
 

package/dist/components/FormatButton.d.ts

@@ -3,11 +3,13 @@ export default FormatButton;
  * Ce composant permet d'afficher la liste des boutons de fonctionnalité
  *
  * @param {object} props
- * @param {string} activeBlock - Type de bloc actif
- * @param {object} editor - Éditeur de texte
- * @param {string} format - format de texte sélectionné
- * @param {bool} isActive - état du format (actif ou non)
- * @param {function} onMouseDown - Fonction déclenchée lors du clic de la souris
+ * @param {string} props.activeMarks - Liste des marques appliquées
+ * @param {string} props.format - format de texte sélectionné
+ * @param {bool} props.isActive - état du format (actif ou non)
  * @returns {JSX.Element}
  */
-declare function FormatButton({ activeBlock, editor, format, isActive, onMouseDown }: object): JSX.Element;
+declare function FormatButton({ activeMarks, format, isActive }: {
+    activeMarks: string;
+    format: string;
+    isActive: bool;
+}): JSX.Element;

package/dist/components/ReactTextForge.d.ts

@@ -4,11 +4,17 @@ export default ReactTextForge;
  *
  * @param {object} props
  * @param {object} props.value - contenu textuel
+ * @param {string} props.borderColor - couleur de bordure des éléments
+ * @param {string} props.backgroundColor - couleur d'arrière-plan
+ * @param {string} props.imageColor - couleur des images
  * @param {function} props.setValue - change l'état du contenu
  *
  * @returns {JSX.Element }
  */
-declare function ReactTextForge({ value, setValue }: {
+declare function ReactTextForge({ value, setValue, borderColor, backgroundColor, imageColor }: {
     value: object;
+    borderColor: string;
+    backgroundColor: string;
+    imageColor: string;
     setValue: Function;
 }): JSX.Element;

package/dist/components/ReactTextForgeContext.d.ts

@@ -0,0 +1,8 @@
+export function ReactTextForgeProvider({ backgroundColor, borderColor, imageColor, editor, children }: {
+    backgroundColor: any;
+    borderColor: any;
+    imageColor: any;
+    editor: any;
+    children: any;
+}): import("react/jsx-runtime").JSX.Element;
+export function useReactTextForgeContext(): any;

package/dist/components/Toolbar.d.ts

@@ -3,12 +3,10 @@ export default Toolbar;
  * Ce composant permet d'afficher la barre d'outils
  *
  * @param {object} props
- * @param {object} props.editor - éditeur de texte
  * @param {object} props.activeMarks - Toutes les options (actifs ou non)
  *
  * @returns {JSX.Element }
  */
-declare function Toolbar({ editor, activeMarks }: {
-    editor: object;
+declare function Toolbar({ activeMarks }: {
     activeMarks: object;
 }): JSX.Element;

package/dist/components/functions/deserializeDocx.d.ts

@@ -0,0 +1,2 @@
+export default deserializeDocx;
+declare function deserializeDocx(doc: any): any[];

package/dist/components/utils/CustomEditor.d.ts

@@ -27,6 +27,12 @@ declare namespace CustomEditor {
      * @returns {boolean}
      */
     function isSelectionInList(editor: object): boolean;
+    /**
+     * Permet de définir la puce utilisée dans une liste à puces (non-ordonnée ou numérotée)
+     * @param {object} editor - éditeur de texte
+     * @returns {string}
+     */
+    function getListStyleType(editor: object): string;
     /**
      * Permet de gérer l'application et la désapplication du bloc défini
      * @param {object} editor - éditeur de texte

package/dist/components/utils/Images.d.ts

@@ -0,0 +1,24 @@
+/**
+ * @license
+ * Copyright (c) 2025 Jahylis
+ *
+ * This file is part of ReactTextForge.
+ *
+ * ReactTextForge is free software: you can redistribute it and/or modify
+ * it under the terms of the MIT License as published by
+ * the Open Source Initiative.
+ *
+ * ReactTextForge is distributed in the hope that it will be useful,
+ * but WITHOUT ANY WARRANTY; without even the implied warranty of
+ * MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the
+ * MIT License for more details.
+ *
+ * You should have received a copy of the MIT License
+ * along with ReactTextForge. If not, see <https://opensource.org/licenses/MIT>.
+ *
+ * For any questions or suggestions, please contact: administrateur@nhumeria.fr
+ */
+export default function Images({ format, imageColor }: {
+    format: any;
+    imageColor: any;
+}): import("react/jsx-runtime").JSX.Element;

package/dist/components/utils/color.d.ts

@@ -0,0 +1,21 @@
+/**
+ * @license
+ * Copyright (c) 2025 Jahylis
+ *
+ * This file is part of ReactTextForge.
+ *
+ * ReactTextForge is free software: you can redistribute it and/or modify
+ * it under the terms of the MIT License as published by
+ * the Open Source Initiative.
+ *
+ * ReactTextForge is distributed in the hope that it will be useful,
+ * but WITHOUT ANY WARRANTY; without even the implied warranty of
+ * MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the
+ * MIT License for more details.
+ *
+ * You should have received a copy of the MIT License
+ * along with ReactTextForge. If not, see <https://opensource.org/licenses/MIT>.
+ *
+ * For any questions or suggestions, please contact: administrateur@nhumeria.fr
+ */
+export function isDarkColor(color: any): boolean;

package/dist/components/utils/dropdown/BlockListDropdown.d.ts

@@ -3,16 +3,14 @@ export default BlockListDropdown;
  * Ce composant affiche le formulaire de changement de puces (liste non-ordonnée ou numérotée)
  *
  * @param {object} props
- * @param {string} props.editor - éditeur de texte
  * @param {string} props.format - format sélectionné
- * @param {string} props.isActive - État de la liste sélectionnée
+ * @param {bool} props.isActive - état du format (actif ou non)
  * @param {function} props.onMouseDown - Permet de définir l'élément comme une liste
  *
  * @returns {JSX.Element}
  */
-declare function BlockListDropdown({ editor, format, isActive, onMouseDown }: {
-    editor: string;
+declare function BlockListDropdown({ format, isActive, onMouseDown }: {
     format: string;
-    isActive: string;
+    isActive: bool;
     onMouseDown: Function;
 }): JSX.Element;

package/dist/components/utils/dropdown/BlockTypeDropdown.d.ts

@@ -2,13 +2,7 @@ export default BlockTypeDropdown;
 /**
  * Ce composant affiche le formulaire de changement de type de bloc (paragraphe, titre ou sous-titre)
  *
- * @param {object} props
- * @param {string} props.activeBlock - type de bloc sélectionné
- * @param {function} props.onChange - Permet de changer le type de bloc
  *
  * @returns {JSX.Element}
  */
-declare function BlockTypeDropdown({ activeBlock, onChange }: {
-    activeBlock: string;
-    onChange: Function;
-}): JSX.Element;
+declare function BlockTypeDropdown(): JSX.Element;

package/dist/components/utils/dropdown/ContainerDropdown.d.ts

@@ -1,5 +1,5 @@
 /**
- * Ce composant permet d'afficher un menu déroulant en fonction de la fonctionnalité sélectionnée
+ * Ce composant permet d'afficher un menu déroulant à partir de la fonctionnalité sélectionnée
  *
  * @param {object} props
  * @param {boolean} props.disabled - Active/désactive le bouton d'activation

package/dist/components/utils/dropdown/FontSizeDropdown.d.ts

@@ -3,14 +3,18 @@ export default FontSizeDropdown;
  * Ce composant affiche le formulaire de sélection de la taille de police
  *
  * @param {object} props
+ * @param {string} props.backgroundColor - couleur d'arrière-plan
  * @param {boolean} props.disabled - État du bouton (actif/inactif)
  * @param {string} props.fontFamilySelected - taille sélectionnée
+ * @param {string} props.imageColor - couleur des images
  * @param {func} props.onSelectFontFamily - Fonction permettant de changer la taille de police
  *
  * @returns {JSX.Element}
  */
 declare function FontSizeDropdown({ disabled, sizeSelected, onSelectSize }: {
+    backgroundColor: string;
     disabled: boolean;
     fontFamilySelected: string;
+    imageColor: string;
     onSelectFontFamily: func;
 }): JSX.Element;

package/dist/components/utils/dropdown/LanguageDropdown.d.ts

@@ -2,14 +2,6 @@ export default LanguageDropdown;
 /**
  * Ce composant permet de gérer l'affichage du formulaire de sélection de langage de code
  *
- * @param {object} props
- * @param {object} props.editor | éditeur de texte
- * @param {string} props.selectedLanguage | langage sélectionné dans le bloc courant
- * @param {function} props.setSelectedLanguage | Modificateur du langage
  * @returns {JSX.Element}
  */
-declare function LanguageDropdown({ editor, selectedLanguage, setSelectedLanguage }: {
-    editor: object;
-    selectedLanguage: string;
-    setSelectedLanguage: Function;
-}): JSX.Element;
+declare function LanguageDropdown(): JSX.Element;

package/dist/components/utils/dropdown/TableDropdown.d.ts

@@ -2,11 +2,6 @@ export default TableDropdown;
 /**
  * Ce composant permet de gérer l'affichage du formulaire de création de tableau
  *
- * @param {object} props
- * @param {object} props.editor | éditeur de texte
- *
  * @returns {JSX.Element}
  */
-declare function TableDropdown({ editor }: {
-    editor: object;
-}): JSX.Element;
+declare function TableDropdown(): JSX.Element;

package/dist/components/utils/elements/BlockquoteElement.d.ts

@@ -1,4 +1,24 @@
 export default BlockquoteElement;
+/**
+ * @license
+ * Copyright (c) 2025 Jahylis
+ *
+ * This file is part of ReactTextForge.
+ *
+ * ReactTextForge is free software: you can redistribute it and/or modify
+ * it under the terms of the MIT License as published by
+ * the Open Source Initiative.
+ *
+ * ReactTextForge is distributed in the hope that it will be useful,
+ * but WITHOUT ANY WARRANTY; without even the implied warranty of
+ * MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the
+ * MIT License for more details.
+ *
+ * You should have received a copy of the MIT License
+ * along with ReactTextForge. If not, see <https://opensource.org/licenses/MIT>.
+ *
+ * For any questions or suggestions, please contact: administrateur@nhumeria.fr
+ */
 /**
  * Permet de générer une citation
  *

package/dist/components/utils/elements/DefaultElement.d.ts

@@ -1,4 +1,24 @@
 export default DefaultElement;
+/**
+ * @license
+ * Copyright (c) 2025 Jahylis
+ *
+ * This file is part of ReactTextForge.
+ *
+ * ReactTextForge is free software: you can redistribute it and/or modify
+ * it under the terms of the MIT License as published by
+ * the Open Source Initiative.
+ *
+ * ReactTextForge is distributed in the hope that it will be useful,
+ * but WITHOUT ANY WARRANTY; without even the implied warranty of
+ * MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the
+ * MIT License for more details.
+ *
+ * You should have received a copy of the MIT License
+ * along with ReactTextForge. If not, see <https://opensource.org/licenses/MIT>.
+ *
+ * For any questions or suggestions, please contact: administrateur@nhumeria.fr
+ */
 /**
  * Permet de générer un paragraphe (bloc par défaut)
  *

package/dist/components/utils/elements/ListElement.d.ts

@@ -1,4 +1,24 @@
 export default ListElement;
+/**
+ * @license
+ * Copyright (c) 2025 Jahylis
+ *
+ * This file is part of ReactTextForge.
+ *
+ * ReactTextForge is free software: you can redistribute it and/or modify
+ * it under the terms of the MIT License as published by
+ * the Open Source Initiative.
+ *
+ * ReactTextForge is distributed in the hope that it will be useful,
+ * but WITHOUT ANY WARRANTY; without even the implied warranty of
+ * MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the
+ * MIT License for more details.
+ *
+ * You should have received a copy of the MIT License
+ * along with ReactTextForge. If not, see <https://opensource.org/licenses/MIT>.
+ *
+ * For any questions or suggestions, please contact: administrateur@nhumeria.fr
+ */
 /**
  * Permet de générer une liste
  *

package/dist/components/utils/form/BulletTypeSelector.d.ts

@@ -4,11 +4,13 @@ export default BulletTypeSelector;
  *
  * @param {object} props
  * @param {function} props.onChange - permet de définir la nouvelle puce
- * @param {string} props.selectedType - puce sélectionnée
+ * @param {object} props.selectStyle - style appliqué pour l'élément
+ * @param {object} props.toggleForm - Affiche le formulaire
  *
  * @returns {JSX.Element}
  */
-declare function BulletTypeSelector({ onChange, selectedType }: {
+declare function BulletTypeSelector({ onChange, selectStyle, toggleForm }: {
     onChange: Function;
-    selectedType: string;
+    selectStyle: object;
+    toggleForm: object;
 }): JSX.Element;

package/dist/components/utils/form/HistoryForm.d.ts

@@ -1,10 +1,6 @@
 /**
  * Ce composant permet d'afficher les boutons de gestion de l'historique
  *
- * @param {object} props
- * @param {object} props.editor | Éditeur courant
  * @returns {JSX.Element}
  */
-export default function HistoryForm({ editor }: {
-    editor: object;
-}): JSX.Element;
+export default function HistoryForm(): JSX.Element;

package/dist/components/utils/form/ImageForm.d.ts

@@ -2,11 +2,6 @@ export default ImageForm;
 /**
  * Permet de générer le formulaire d'insertion d'images
  *
- * @param {object} props
- * @param {object} props.editor - éditeur de texte
- *
  * @returns {JSX.Element}
  */
-declare function ImageForm({ editor }: {
-    editor: object;
-}): JSX.Element;
+declare function ImageForm(): JSX.Element;

package/dist/components/utils/form/LinkForm.d.ts

@@ -9,7 +9,7 @@ export default LinkForm;
  *
  * @returns {JSX.Element}
  */
-declare function LinkForm({ editor, onClose, initialUrl, isOpenInNewTab }: {
+declare function LinkForm({ onClose, initialUrl, isOpenInNewTab }: {
     onClose: Function;
     initialUrl: string;
     isOpenInNewTab: boolean;

package/dist/components/utils/form/NumeredTypeSelector.d.ts

@@ -4,11 +4,13 @@ export default NumeredTypeSelector;
  *
  * @param {object} props
  * @param {function} props.onChange - permet de définir la nouvelle puce
- * @param {string} props.selectedType - puce sélectionnée
+ * @param {object} props.selectStyle - style appliqué pour l'élément
+ * @param {object} props.toggleForm - Affiche le formulaire
  *
  * @returns {JSX.Element}
  */
-declare function NumeredTypeSelector({ onChange, selectedType }: {
+declare function NumeredTypeSelector({ onChange, selectStyle, toggleForm }: {
     onChange: Function;
-    selectedType: string;
+    selectStyle: object;
+    toggleForm: object;
 }): JSX.Element;

package/dist/components/utils/form/TableForm.d.ts

@@ -3,12 +3,10 @@ export default TableForm;
  * Permet de générer le formulaire de création de tableau
  *
  * @param {object} props
- * @param {function} props.onChange - permet de définir la nouvelle puce
- * @param {string} props.selectedType - puce sélectionnée
+ * @param {function} props.onClose - ferme le formulaire
  *
  * @returns {JSX.Element}
  */
-declare function TableForm({ editor, onClose }: {
-    onChange: Function;
-    selectedType: string;
+declare function TableForm({ onClose }: {
+    onClose: Function;
 }): JSX.Element;

package/dist/react-text-forge.css

@@ -5,4 +5,4 @@ pre code.hljs{display:block;overflow-x:auto;padding:1em}code.hljs{padding:3px 5p
   Author: (c) Henri Vandersleyen <hvandersleyen@gmail.com>
   License: see project LICENSE
   Touched: 2022
-*/.hljs-meta,.hljs-comment{color:#565f89}.hljs-tag,.hljs-doctag,.hljs-selector-id,.hljs-selector-class,.hljs-regexp,.hljs-template-tag,.hljs-selector-pseudo,.hljs-selector-attr,.hljs-variable.language_,.hljs-deletion{color:#f7768e}.hljs-variable,.hljs-template-variable,.hljs-number,.hljs-literal,.hljs-type,.hljs-params,.hljs-link{color:#ff9e64}.hljs-built_in,.hljs-attribute{color:#e0af68}.hljs-selector-tag{color:#2ac3de}.hljs-keyword,.hljs-title.function_,.hljs-title,.hljs-title.class_,.hljs-title.class_.inherited__,.hljs-subst,.hljs-property{color:#7dcfff}.hljs-selector-tag{color:#73daca}.hljs-quote,.hljs-string,.hljs-symbol,.hljs-bullet,.hljs-addition{color:#9ece6a}.hljs-code,.hljs-formula,.hljs-section{color:#7aa2f7}.hljs-name,.hljs-keyword,.hljs-operator,.hljs-char.escape_,.hljs-attr{color:#bb9af7}.hljs-punctuation{color:#c0caf5}.hljs{background:#1a1b26;color:#9aa5ce}.hljs-emphasis{font-style:italic}.hljs-strong{font-weight:700}.toolbar{display:flex;gap:5px;margin-bottom:10px;flex-wrap:wrap}.tool{padding:5px;display:flex;justify-content:center;align-items:center;border:1px solid #ccc;border-radius:3px;cursor:pointer;outline:none}.tool--active{background-color:#656d85}.tool--active:hover{background-color:#535a6e}.tool--inactive{background-color:#f9f9f9}.tool--inactive:hover{background-color:#d1cccc}.tool--arrow{background:none;border:none;cursor:pointer;font-size:12px;margin-left:4px}.tool img{cursor:pointer;width:15px;height:15px}.react-text-forge{width:80%;margin:0 auto;border:1px solid #ccc;padding:10px;border-radius:5px;position:relative}@keyframes blink{0%,to{opacity:1}50%{opacity:0}}.react-text-forge .editor{min-height:200px;border:1px solid #ddd;padding:10px;border-radius:5px;outline:none}.react-text-forge .editor a{pointer-events:auto;cursor:pointer}.react-text-forge .editor img{max-height:200px}.react-text-forge .editor table{width:100%;border-collapse:collapse}.react-text-forge .editor table th,.react-text-forge .editor table td{border:1px solid #ddd;padding:8px}.react-text-forge .editor table th{background-color:#f2f2f2}.react-text-forge .editor table tr:nth-child(2n){background-color:#f9f9f9}.react-text-forge .editor table tr:hover{background-color:#f1f1f1}.react-text-forge .color-picker-popup{position:relative}.react-text-forge .color-picker-popup .sketch-picker{position:absolute;top:100%;z-index:2}.react-text-forge .bullet-type-selector{display:inline-block;margin-left:8px}.react-text-forge .bullet-type-option{background:#f0f0f0;border:1px solid #ccc;border-radius:4px;padding:4px 8px;margin:2px;cursor:pointer}.react-text-forge .bullet-type-option:hover{background:#e0e0e0}.react-text-forge .dropdown{position:relative;display:flex}.react-text-forge .dropdown-toggle{background:none;border:none;cursor:pointer;padding:0}.react-text-forge .dropdown-menu{position:absolute;top:100%;background:#fff;border:1px solid #ccc;box-shadow:0 2px 8px #0000001a;list-style:none;height:100px;overflow-y:scroll;padding:10px 0;margin:5px 0;z-index:1000}.react-text-forge .dropdown-menu li{min-width:200px;width:max-content;height:20px;padding:5px 10px;line-height:20px;cursor:pointer}.react-text-forge .dropdown-menu li:hover{background:#f0f0f0}.react-text-forge pre{background-color:#6e6565;border:1px solid #ddd;border-radius:4px;padding:10px;overflow-x:auto;font-family:Consolas,Monaco,Courier New,monospace;font-size:14px;line-height:1.4;margin:1em 0}.react-text-forge .link-form{position:absolute;top:40px;left:0;background-color:#fff;border:1px solid #ccc;border-radius:4px;box-shadow:0 2px 10px #0000001a;padding:16px;z-index:10}.react-text-forge .link-form input[type=text]{width:calc(100% - 22px);padding:8px;margin-bottom:10px;border:1px solid #ccc;border-radius:4px}.react-text-forge .link-form label{display:flex;align-items:center;margin-bottom:10px}.react-text-forge .link-form label input[type=checkbox]{margin-right:8px}.react-text-forge .link-form .link-form-actions{display:flex;justify-content:flex-end;gap:8px}.react-text-forge .link-form .link-form-actions button{padding:8px 16px;border:none;border-radius:4px;cursor:pointer}.react-text-forge .link-form .link-form-actions button:first-child{background-color:#007bff;color:#fff}.react-text-forge .link-form .link-form-actions button:last-child{background-color:#6c757d;color:#fff}.react-text-forge .image-upload-container{position:relative}.react-text-forge .hidden-file-input{display:none}.react-text-forge .table-grid-form{display:flex;flex-direction:column;align-items:center;height:fit-content;width:fit-content;overflow:visible;padding:0;border:0}.react-text-forge .table-grid-form .grid-container{display:grid;grid-template-columns:repeat(5,20px);grid-template-rows:repeat(5,20px);gap:2px}.react-text-forge .table-grid-form .grid-cell{width:20px;height:20px;background-color:#ddd;border:1px solid #ccc}.react-text-forge .table-grid-form .grid-cell.hovered{background-color:#007bff}.react-text-forge .table-grid-form .table-size-indicator{margin-top:10px;font-size:14px}.react-text-forge ::selection{background:#0078d74d;color:#000}.react-text-forge ::-moz-selection{background:#0078d74d;color:#000}
+*/.hljs-meta,.hljs-comment{color:#565f89}.hljs-tag,.hljs-doctag,.hljs-selector-id,.hljs-selector-class,.hljs-regexp,.hljs-template-tag,.hljs-selector-pseudo,.hljs-selector-attr,.hljs-variable.language_,.hljs-deletion{color:#f7768e}.hljs-variable,.hljs-template-variable,.hljs-number,.hljs-literal,.hljs-type,.hljs-params,.hljs-link{color:#ff9e64}.hljs-built_in,.hljs-attribute{color:#e0af68}.hljs-selector-tag{color:#2ac3de}.hljs-keyword,.hljs-title.function_,.hljs-title,.hljs-title.class_,.hljs-title.class_.inherited__,.hljs-subst,.hljs-property{color:#7dcfff}.hljs-selector-tag{color:#73daca}.hljs-quote,.hljs-string,.hljs-symbol,.hljs-bullet,.hljs-addition{color:#9ece6a}.hljs-code,.hljs-formula,.hljs-section{color:#7aa2f7}.hljs-name,.hljs-keyword,.hljs-operator,.hljs-char.escape_,.hljs-attr{color:#bb9af7}.hljs-punctuation{color:#c0caf5}.hljs{background:#1a1b26;color:#9aa5ce}.hljs-emphasis{font-style:italic}.hljs-strong{font-weight:700}.toolbar{display:flex;gap:5px;margin-bottom:10px;flex-wrap:wrap}.toolbar>div{display:flex}.toolbar>select,.toolbar>select:focus{outline:none;border:none;background:none}.toolbar>select option,.toolbar>select:focus option{border:none;outline:none;background:none;padding:0}.tool{padding:5px;display:flex;justify-content:center;align-items:center;border:none;border-radius:3px;background:none;cursor:pointer;outline:none}.tool--arrow{background:none;border:none;cursor:pointer;font-size:12px;margin-left:4px;position:relative;bottom:4px;height:18px;padding:0}.tool img,.tool svg{cursor:pointer;width:15px;height:15px}.react-text-forge{width:80%;margin:0 auto;border:1px solid;padding:10px;border-radius:5px;position:relative}@keyframes blink{0%,to{opacity:1}50%{opacity:0}}.react-text-forge .editor{min-height:200px;border:1px solid #ddd;padding:10px;border-radius:5px;outline:none}.react-text-forge .editor a{pointer-events:auto;cursor:pointer}.react-text-forge .editor img{max-height:200px}.react-text-forge .editor table{width:100%;table-layout:fixed;border-collapse:collapse}.react-text-forge .editor table tr{display:flex;width:100%}.react-text-forge .editor table th,.react-text-forge .editor table td{display:block;flex-grow:1;height:40px;max-height:40px;border:1px solid;border-color:inherit;padding:8px;overflow-y:scroll}.react-text-forge .color-picker-popup{position:relative}.react-text-forge .color-picker-popup .sketch-picker{position:absolute;top:100%;z-index:2}.react-text-forge .bullet-type-selector{display:inline-block;margin-left:8px}.react-text-forge .bullet-type-option{background:#f0f0f0;border:1px solid #ccc;border-radius:4px;padding:4px 8px;margin:2px;cursor:pointer}.react-text-forge .bullet-type-option:hover{background:#e0e0e0}.react-text-forge .dropdown{position:relative;display:flex}.react-text-forge .dropdown-toggle{background:none;border:none;cursor:pointer;padding:0}.react-text-forge .dropdown-menu{position:absolute;top:100%;background:#fff;border:1px solid #ccc;box-shadow:0 2px 8px #0000001a;list-style:none;height:100px;overflow-y:scroll;padding:10px 0;margin:5px 0;z-index:1000}.react-text-forge .dropdown-menu li{min-width:200px;width:max-content;height:20px;padding:5px 10px;line-height:20px;cursor:pointer}.react-text-forge .dropdown-menu li:hover{background:#f0f0f0}.react-text-forge pre{background-color:#6e6565;border:1px solid #ddd;border-radius:4px;padding:10px;overflow-x:auto;font-family:Consolas,Monaco,Courier New,monospace;font-size:14px;line-height:1.4;margin:1em 0}.react-text-forge .link-form{position:absolute;top:40px;left:0;background-color:#fff;border:1px solid #ccc;border-radius:4px;box-shadow:0 2px 10px #0000001a;padding:16px;z-index:10}.react-text-forge .link-form input[type=text]{width:calc(100% - 22px);padding:8px;margin-bottom:10px;border:1px solid #ccc;border-radius:4px}.react-text-forge .link-form label{display:flex;align-items:center;margin-bottom:10px}.react-text-forge .link-form label input[type=checkbox]{margin-right:8px}.react-text-forge .link-form-actions{display:flex;justify-content:flex-end;gap:8px}.react-text-forge .link-form-actions button{padding:8px 16px;border:none;border-radius:4px;cursor:pointer}.react-text-forge .image-upload-container{position:relative}.react-text-forge .hidden-file-input{display:none}.react-text-forge .table-grid-form{display:flex;flex-direction:column;align-items:center;height:fit-content;width:fit-content;overflow:visible;padding:0;border:0}.react-text-forge .table-grid-form .grid-container{display:grid;grid-template-columns:repeat(5,20px);grid-template-rows:repeat(5,20px);gap:2px}.react-text-forge .table-grid-form .grid-cell{width:20px;height:20px;background-color:#ddd;border:1px solid #ccc}.react-text-forge .table-grid-form .grid-cell.hovered{background-color:#007bff}.react-text-forge .table-grid-form .table-size-indicator{margin-top:10px;font-size:14px}.react-text-forge ::selection{background:#0078d74d;color:#000}.react-text-forge ::-moz-selection{background:#0078d74d;color:#000}.react-text-forge a{font-weight:500;color:#646cff;text-decoration:inherit}.react-text-forge a:hover{color:#535bf2}