@rh-support/components 2.5.226 → 2.5.231

package/lib/esm/RichTextEditor/RichTextEditor.js

@@ -1,463 +0,0 @@
-var __awaiter = (this && this.__awaiter) || function (thisArg, _arguments, P, generator) {
-    function adopt(value) { return value instanceof P ? value : new P(function (resolve) { resolve(value); }); }
-    return new (P || (P = Promise))(function (resolve, reject) {
-        function fulfilled(value) { try { step(generator.next(value)); } catch (e) { reject(e); } }
-        function rejected(value) { try { step(generator["throw"](value)); } catch (e) { reject(e); } }
-        function step(result) { result.done ? resolve(result.value) : adopt(result.value).then(fulfilled, rejected); }
-        step((generator = generator.apply(thisArg, _arguments || [])).next());
-    });
-};
-import './richTextEditor.css';
-import { Button, ButtonVariant, Dropdown, DropdownItem, DropdownList, FormGroup, MenuToggle, Modal, ModalBody, ModalFooter, ModalHeader, ModalVariant, TextInput, Toolbar, ToolbarGroup, } from '@patternfly/react-core';
-import AlignCenterIcon from '@patternfly/react-icons/dist/js/icons/align-center-icon';
-import AlignJustifyIcon from '@patternfly/react-icons/dist/js/icons/align-justify-icon';
-import AlignLeftIcon from '@patternfly/react-icons/dist/js/icons/align-left-icon';
-import AlignRightIcon from '@patternfly/react-icons/dist/js/icons/align-right-icon';
-import CaretDownIcon from '@patternfly/react-icons/dist/js/icons/caret-down-icon';
-import IndentIcon from '@patternfly/react-icons/dist/js/icons/indent-icon';
-import LinkIcon from '@patternfly/react-icons/dist/js/icons/link-icon';
-import ListOlIcon from '@patternfly/react-icons/dist/js/icons/list-ol-icon';
-import ListUlIcon from '@patternfly/react-icons/dist/js/icons/list-ul-icon';
-import OutdentIcon from '@patternfly/react-icons/dist/js/icons/outdent-icon';
-import RemoveFormatIcon from '@patternfly/react-icons/dist/js/icons/remove-format-icon';
-import StrikethroughIcon from '@patternfly/react-icons/dist/js/icons/strikethrough-icon';
-import React, { useCallback, useEffect, useRef, useState } from 'react';
-import { useTranslation } from 'react-i18next';
-import { ToastNotification } from '../ToastNotification';
-import { useQuillEditor } from './useQuillEditor';
-const defaultCharLimit = 32000;
-const defaultMinCharsForCounter = 31800;
-const ALLOWED_IMAGE_TYPES = new Set(['image/jpeg', 'image/png', 'image/gif', 'image/svg+xml']);
-const IMAGE_SIZE_LIMIT = 2 * 1024 * 1024; // 2 MB
-export function RichTextEditor(props) {
-    const { t } = useTranslation();
-    const { value, onChange, onChangePlainText, placeholder = '', disabled = false, className = '', id = 'rich-text-editor', hideToolbar = false, charLimit = defaultCharLimit, minCharsForCounter = defaultMinCharsForCounter, onCharLimitExceeded, height, onFocus, onBlur, bindEditor, 'aria-label': ariaLabel, onImageUpload, } = props;
-    const [isHeadingDropdownOpen, setIsHeadingDropdownOpen] = useState(false);
-    const [charCount, setCharCount] = useState(0);
-    const charLimitExceededRef = useRef(false);
-    const [isLinkModalOpen, setIsLinkModalOpen] = useState(false);
-    const [linkUrl, setLinkUrl] = useState('');
-    const [linkText, setLinkText] = useState('');
-    const savedSelectionRef = useRef(null);
-    const [isImageModalOpen, setIsImageModalOpen] = useState(false);
-    const [imageUrl, setImageUrl] = useState('');
-    const [imageUrlError, setImageUrlError] = useState('');
-    const savedImageSelectionRef = useRef(null);
-    const [, setIsImageUploading] = useState(false);
-    const fileInputRef = useRef(null);
-    const { editorRef, quillRef, activeFormat, setActiveFormat, setContents, setReadOnly } = useQuillEditor({
-        placeholder,
-        readOnly: disabled,
-        onChange: (html) => {
-            onChange(html);
-        },
-        onChangePlainText: (text) => {
-            onChangePlainText === null || onChangePlainText === void 0 ? void 0 : onChangePlainText(text);
-            setCharCount(text.length);
-        },
-        onFocus,
-        onBlur,
-    });
-    // Sync external value into Quill when it changes externally
-    useEffect(() => {
-        setContents(value);
-    }, [value, setContents]);
-    // Sync disabled state
-    useEffect(() => {
-        setReadOnly(disabled);
-    }, [disabled, setReadOnly]);
-    // Bind editor ref externally
-    useEffect(() => {
-        if (quillRef.current && bindEditor) {
-            bindEditor(quillRef.current);
-        }
-    }, [bindEditor, quillRef]);
-    // Character limit exceeded callback
-    useEffect(() => {
-        const exceeded = charCount > charLimit;
-        if (exceeded !== charLimitExceededRef.current) {
-            charLimitExceededRef.current = exceeded;
-            onCharLimitExceeded === null || onCharLimitExceeded === void 0 ? void 0 : onCharLimitExceeded(exceeded);
-        }
-    }, [charCount, charLimit, onCharLimitExceeded]);
-    const onImageUploadRef = useRef(onImageUpload);
-    onImageUploadRef.current = onImageUpload;
-    useEffect(() => {
-        const editorEl = editorRef.current;
-        if (!editorEl || !onImageUploadRef.current)
-            return;
-        const handlePaste = (e) => __awaiter(this, void 0, void 0, function* () {
-            var _a;
-            if (!((_a = e.clipboardData) === null || _a === void 0 ? void 0 : _a.items))
-                return;
-            const imageItem = Array.from(e.clipboardData.items).find((item) => item.type.startsWith('image/') && ALLOWED_IMAGE_TYPES.has(item.type));
-            if (!imageItem)
-                return;
-            const file = imageItem.getAsFile();
-            if (!file)
-                return;
-            if (file.size > IMAGE_SIZE_LIMIT) {
-                e.preventDefault();
-                e.stopPropagation();
-                return;
-            }
-            e.preventDefault();
-            e.stopPropagation();
-            const quill = quillRef.current;
-            if (!quill)
-                return;
-            const range = quill.getSelection() || { index: quill.getLength() - 1, length: 0 };
-            setIsImageUploading(true);
-            try {
-                const url = yield onImageUploadRef.current(file);
-                if (url) {
-                    quill.insertEmbed(range.index, 'image', url);
-                    quill.setSelection(range.index + 1, 0, 'silent');
-                }
-            }
-            catch (_b) {
-                // Error handled by the consumer's upload implementation
-            }
-            finally {
-                setIsImageUploading(false);
-            }
-        });
-        editorEl.addEventListener('paste', handlePaste);
-        return () => {
-            editorEl.removeEventListener('paste', handlePaste);
-        };
-        // eslint-disable-next-line react-hooks/exhaustive-deps
-    }, [editorRef, quillRef]);
-    const formatToggle = useCallback((format, value) => {
-        const quill = quillRef.current;
-        if (!quill)
-            return;
-        const selection = quill.getSelection();
-        if (!selection)
-            return;
-        const newValue = value !== null && value !== void 0 ? value : !activeFormat[format];
-        quill.format(format, newValue);
-        setActiveFormat((prev) => {
-            const next = Object.assign({}, prev);
-            if (newValue) {
-                next[format] = newValue;
-            }
-            else {
-                delete next[format];
-            }
-            return next;
-        });
-    }, [activeFormat, quillRef, setActiveFormat]);
-    const onLinkClick = useCallback(() => {
-        const quill = quillRef.current;
-        if (!quill)
-            return;
-        const range = quill.getSelection();
-        if (!range)
-            return;
-        if (activeFormat.link) {
-            quill.format('link', false);
-            setActiveFormat((prev) => {
-                const next = Object.assign({}, prev);
-                delete next.link;
-                return next;
-            });
-        }
-        else {
-            savedSelectionRef.current = { index: range.index, length: range.length };
-            setLinkText(range.length > 0 ? quill.getText(range.index, range.length).trim() : '');
-            setLinkUrl('');
-            setIsLinkModalOpen(true);
-        }
-    }, [activeFormat, quillRef, setActiveFormat]);
-    const onLinkInsert = useCallback(() => {
-        const quill = quillRef.current;
-        const saved = savedSelectionRef.current;
-        const url = linkUrl.trim();
-        const text = linkText.trim() || url;
-        if (!quill || !saved || !url)
-            return;
-        if (saved.length > 0) {
-            quill.setSelection(saved.index, saved.length, 'silent');
-            quill.format('link', url);
-        }
-        else {
-            quill.insertText(saved.index, text, 'link', url, 'user');
-            quill.setSelection(saved.index + text.length, 0, 'silent');
-        }
-        setActiveFormat((prev) => (Object.assign(Object.assign({}, prev), { link: url })));
-        savedSelectionRef.current = null;
-        setIsLinkModalOpen(false);
-        setLinkUrl('');
-        setLinkText('');
-    }, [linkUrl, linkText, quillRef, setActiveFormat]);
-    const onLinkCancel = useCallback(() => {
-        savedSelectionRef.current = null;
-        setIsLinkModalOpen(false);
-        setLinkText('');
-        setLinkUrl('');
-    }, []);
-    const handleFileInputChange = useCallback((e) => __awaiter(this, void 0, void 0, function* () {
-        var _a;
-        const file = (_a = e.target.files) === null || _a === void 0 ? void 0 : _a[0];
-        if (fileInputRef.current)
-            fileInputRef.current.value = '';
-        if (!file || !onImageUpload)
-            return;
-        if (!ALLOWED_IMAGE_TYPES.has(file.type)) {
-            ToastNotification.addDangerMessage(t('Invalid file type. Only JPEG, PNG, GIF, and SVG images are allowed.'));
-            return;
-        }
-        if (file.size > IMAGE_SIZE_LIMIT) {
-            ToastNotification.addDangerMessage(t('File is too large. Maximum size is 2 MB.'));
-            return;
-        }
-        const quill = quillRef.current;
-        const saved = savedImageSelectionRef.current;
-        if (!quill || !saved)
-            return;
-        setIsImageUploading(true);
-        try {
-            const url = yield onImageUpload(file);
-            if (url) {
-                quill.focus();
-                quill.setSelection(saved.index, saved.length, 'silent');
-                quill.insertEmbed(saved.index, 'image', url);
-            }
-        }
-        catch (_b) {
-            ToastNotification.addDangerMessage(t('Failed to upload image.'));
-        }
-        finally {
-            setIsImageUploading(false);
-            savedImageSelectionRef.current = null;
-        }
-    }), [onImageUpload, quillRef, t]);
-    const onImageInsert = useCallback(() => {
-        const quill = quillRef.current;
-        const saved = savedImageSelectionRef.current;
-        if (!quill || !saved || !imageUrl.trim())
-            return;
-        const url = imageUrl.trim();
-        try {
-            const parsed = new URL(url);
-            if (parsed.hostname !== 'redhat.com' && !parsed.hostname.endsWith('.redhat.com')) {
-                setImageUrlError(t('Only *.redhat.com URLs are allowed'));
-                return;
-            }
-        }
-        catch (_a) {
-            setImageUrlError(t('Only *.redhat.com URLs are allowed'));
-            return;
-        }
-        quill.setSelection(saved.index, saved.length, 'silent');
-        quill.insertEmbed(saved.index, 'image', url);
-        savedImageSelectionRef.current = null;
-        setIsImageModalOpen(false);
-        setImageUrl('');
-        setImageUrlError('');
-    }, [imageUrl, quillRef, t]);
-    const onImageCancel = useCallback(() => {
-        savedImageSelectionRef.current = null;
-        setIsImageModalOpen(false);
-        setImageUrl('');
-        setImageUrlError('');
-    }, []);
-    const onImageUrlChange = useCallback((_e, val) => {
-        setImageUrl(val);
-        if (val.trim()) {
-            try {
-                const parsed = new URL(val.trim());
-                if (parsed.hostname !== 'redhat.com' && !parsed.hostname.endsWith('.redhat.com')) {
-                    setImageUrlError(t('Only *.redhat.com URLs are allowed'));
-                }
-                else {
-                    setImageUrlError('');
-                }
-            }
-            catch (_a) {
-                setImageUrlError(t('Only *.redhat.com URLs are allowed'));
-            }
-        }
-        else {
-            setImageUrlError('');
-        }
-    }, [t]);
-    const onImageUrlKeyDown = useCallback((e) => {
-        if (e.key === 'Enter') {
-            e.preventDefault();
-            onImageInsert();
-        }
-    }, [onImageInsert]);
-    const onLinkTextChange = useCallback((_e, val) => {
-        setLinkText(val);
-    }, []);
-    const onLinkUrlChange = useCallback((_e, val) => {
-        setLinkUrl(val);
-    }, []);
-    const onLinkUrlKeyDown = useCallback((e) => {
-        if (e.key === 'Enter') {
-            e.preventDefault();
-            onLinkInsert();
-        }
-    }, [onLinkInsert]);
-    const onToolbarMouseDown = useCallback((e) => {
-        e.preventDefault();
-    }, []);
-    const onBoldClick = useCallback(() => formatToggle('bold'), [formatToggle]);
-    const onItalicClick = useCallback(() => formatToggle('italic'), [formatToggle]);
-    const onUnderlineClick = useCallback(() => formatToggle('underline'), [formatToggle]);
-    const onStrikethroughClick = useCallback(() => formatToggle('strike'), [formatToggle]);
-    const onIndentClick = useCallback(() => {
-        const quill = quillRef.current;
-        if (!quill)
-            return;
-        const range = quill.getSelection();
-        if (!range)
-            return;
-        const current = quill.getFormat(range).indent || 0;
-        quill.format('indent', current + 1);
-        setActiveFormat((prev) => (Object.assign(Object.assign({}, prev), { indent: current + 1 })));
-    }, [quillRef, setActiveFormat]);
-    const onOutdentClick = useCallback(() => {
-        const quill = quillRef.current;
-        if (!quill)
-            return;
-        const range = quill.getSelection();
-        if (!range)
-            return;
-        const current = quill.getFormat(range).indent || 0;
-        if (current > 0) {
-            quill.format('indent', current - 1 || false);
-            setActiveFormat((prev) => (Object.assign(Object.assign({}, prev), { indent: current - 1 || false })));
-        }
-    }, [quillRef, setActiveFormat]);
-    const onAlignClick = useCallback((alignment) => {
-        const quill = quillRef.current;
-        if (!quill)
-            return;
-        const range = quill.getSelection();
-        if (!range)
-            return;
-        const currentAlign = activeFormat.align || false;
-        const newValue = currentAlign === alignment ? false : alignment;
-        quill.format('align', newValue);
-        setActiveFormat((prev) => {
-            const next = Object.assign({}, prev);
-            if (newValue) {
-                next.align = newValue;
-            }
-            else {
-                delete next.align;
-            }
-            return next;
-        });
-    }, [activeFormat.align, quillRef, setActiveFormat]);
-    const onAlignLeftClick = useCallback(() => onAlignClick(false), [onAlignClick]);
-    const onAlignCenterClick = useCallback(() => onAlignClick('center'), [onAlignClick]);
-    const onAlignRightClick = useCallback(() => onAlignClick('right'), [onAlignClick]);
-    const onAlignJustifyClick = useCallback(() => onAlignClick('justify'), [onAlignClick]);
-    const onRemoveFormatClick = useCallback(() => {
-        const quill = quillRef.current;
-        if (!quill)
-            return;
-        const range = quill.getSelection();
-        if (!range)
-            return;
-        if (range.length === 0) {
-            const [line, offset] = quill.getLine(range.index);
-            if (line) {
-                quill.removeFormat(range.index - offset, line.length());
-            }
-        }
-        else {
-            quill.removeFormat(range.index, range.length);
-        }
-        setActiveFormat(quill.getFormat(range));
-    }, [quillRef, setActiveFormat]);
-    const onHeadingSelect = useCallback(() => setIsHeadingDropdownOpen(false), []);
-    const onHeadingToggleClick = useCallback(() => setIsHeadingDropdownOpen((prev) => !prev), []);
-    const onHeading1Click = useCallback(() => formatToggle('header', 1), [formatToggle]);
-    const onHeading2Click = useCallback(() => formatToggle('header', 2), [formatToggle]);
-    const onHeading3Click = useCallback(() => formatToggle('header', 3), [formatToggle]);
-    const onHeadingNormalClick = useCallback(() => formatToggle('header', false), [formatToggle]);
-    const onBulletListClick = useCallback(() => formatToggle('list', activeFormat.list === 'bullet' ? false : 'bullet'), [formatToggle, activeFormat.list]);
-    const onOrderedListClick = useCallback(() => formatToggle('list', activeFormat.list === 'ordered' ? false : 'ordered'), [formatToggle, activeFormat.list]);
-    const headingToggleRenderer = useCallback((toggleRef) => {
-        const headingLevel = activeFormat.header;
-        const label = headingLevel ? `Heading ${headingLevel}` : 'Normal';
-        return (React.createElement(MenuToggle, { ref: toggleRef, onClick: onHeadingToggleClick, isDisabled: disabled, variant: "plain", "aria-label": `Text style: ${label}`, className: `richtext-toolbar-btn ${headingLevel ? 'pf-m-active' : ''}` },
-            React.createElement("span", { className: "toggle-content" },
-                label,
-                " ",
-                React.createElement(CaretDownIcon, { className: "dropdown-caret" }))));
-    }, [activeFormat.header, disabled, onHeadingToggleClick]);
-    const editorStyle = {};
-    if (height) {
-        editorStyle.height = typeof height === 'number' ? `${height}px` : height;
-    }
-    const showCounter = charCount >= minCharsForCounter;
-    const isOverLimit = charCount > charLimit;
-    return (React.createElement("div", { id: id, className: `richtext-editor-container ${disabled ? 'richtext-editor-container--disabled' : ''} ${className}` },
-        !hideToolbar && (React.createElement(Toolbar, { className: "richtext-toolbar", role: "toolbar", "aria-label": "Formatting options", onMouseDown: onToolbarMouseDown },
-            React.createElement(ToolbarGroup, { className: "richtext-toolbar-left-section" },
-                React.createElement(Button, { variant: ButtonVariant.plain, isClicked: !!activeFormat.bold, isDisabled: disabled, onClick: onBoldClick, "aria-label": "Bold", "aria-pressed": !!activeFormat.bold, className: "richtext-toolbar-btn" },
-                    React.createElement("strong", null, "B")),
-                React.createElement(Button, { variant: ButtonVariant.plain, isClicked: !!activeFormat.italic, isDisabled: disabled, onClick: onItalicClick, "aria-label": "Italic", "aria-pressed": !!activeFormat.italic, className: "richtext-toolbar-btn" },
-                    React.createElement("em", null, "I")),
-                React.createElement(Button, { variant: ButtonVariant.plain, isClicked: !!activeFormat.underline, isDisabled: disabled, onClick: onUnderlineClick, "aria-label": "Underline", "aria-pressed": !!activeFormat.underline, className: "richtext-toolbar-btn" },
-                    React.createElement("u", null, "U")),
-                React.createElement(Button, { icon: React.createElement(StrikethroughIcon, null), variant: ButtonVariant.plain, isClicked: !!activeFormat.strike, isDisabled: disabled, onClick: onStrikethroughClick, "aria-label": "Strikethrough", "aria-pressed": !!activeFormat.strike, className: "richtext-toolbar-btn" }),
-                React.createElement("div", { className: "btn-group-separator" }),
-                React.createElement(Dropdown, { isOpen: isHeadingDropdownOpen, onSelect: onHeadingSelect, onOpenChange: setIsHeadingDropdownOpen, toggle: headingToggleRenderer },
-                    React.createElement(DropdownList, null,
-                        React.createElement(DropdownItem, { key: "h1", onClick: onHeading1Click }, "Heading 1"),
-                        React.createElement(DropdownItem, { key: "h2", onClick: onHeading2Click }, "Heading 2"),
-                        React.createElement(DropdownItem, { key: "h3", onClick: onHeading3Click }, "Heading 3"),
-                        React.createElement(DropdownItem, { key: "normal", onClick: onHeadingNormalClick }, "Normal"))),
-                React.createElement("div", { className: "btn-group-separator" }),
-                React.createElement(Button, { icon: React.createElement(ListUlIcon, null), variant: ButtonVariant.plain, isClicked: activeFormat.list === 'bullet', isDisabled: disabled, onClick: onBulletListClick, "aria-label": "Bullet List", "aria-pressed": activeFormat.list === 'bullet', className: "richtext-toolbar-btn" }),
-                React.createElement(Button, { icon: React.createElement(ListOlIcon, null), variant: ButtonVariant.plain, isClicked: activeFormat.list === 'ordered', isDisabled: disabled, onClick: onOrderedListClick, "aria-label": "Ordered List", "aria-pressed": activeFormat.list === 'ordered', className: "richtext-toolbar-btn" }),
-                React.createElement(Button, { icon: React.createElement(IndentIcon, null), variant: ButtonVariant.plain, isDisabled: disabled, onClick: onIndentClick, "aria-label": "Indent", className: "richtext-toolbar-btn" }),
-                React.createElement(Button, { icon: React.createElement(OutdentIcon, null), variant: ButtonVariant.plain, isDisabled: disabled, onClick: onOutdentClick, "aria-label": "Outdent", className: "richtext-toolbar-btn" }),
-                React.createElement("div", { className: "btn-group-separator" }),
-                React.createElement(Button, { icon: React.createElement(AlignLeftIcon, null), variant: ButtonVariant.plain, isClicked: !activeFormat.align, isDisabled: disabled, onClick: onAlignLeftClick, "aria-label": "Align Left", "aria-pressed": !activeFormat.align, className: "richtext-toolbar-btn" }),
-                React.createElement(Button, { icon: React.createElement(AlignCenterIcon, null), variant: ButtonVariant.plain, isClicked: activeFormat.align === 'center', isDisabled: disabled, onClick: onAlignCenterClick, "aria-label": "Align Center", "aria-pressed": activeFormat.align === 'center', className: "richtext-toolbar-btn" }),
-                React.createElement(Button, { icon: React.createElement(AlignRightIcon, null), variant: ButtonVariant.plain, isClicked: activeFormat.align === 'right', isDisabled: disabled, onClick: onAlignRightClick, "aria-label": "Align Right", "aria-pressed": activeFormat.align === 'right', className: "richtext-toolbar-btn" }),
-                React.createElement(Button, { icon: React.createElement(AlignJustifyIcon, null), variant: ButtonVariant.plain, isClicked: activeFormat.align === 'justify', isDisabled: disabled, onClick: onAlignJustifyClick, "aria-label": "Justify", "aria-pressed": activeFormat.align === 'justify', className: "richtext-toolbar-btn" }),
-                React.createElement("div", { className: "btn-group-separator" }),
-                React.createElement(Button, { icon: React.createElement(LinkIcon, null), variant: ButtonVariant.plain, isClicked: !!activeFormat.link, isDisabled: disabled, onClick: onLinkClick, "aria-label": "Link", "aria-pressed": !!activeFormat.link, className: "richtext-toolbar-btn" }),
-                React.createElement(Button, { icon: React.createElement(RemoveFormatIcon, null), variant: ButtonVariant.plain, isDisabled: disabled, onClick: onRemoveFormatClick, "aria-label": "Remove Format", className: "richtext-toolbar-btn" })))),
-        React.createElement("div", { ref: editorRef, role: "textbox", className: "richtext-editor-content", style: editorStyle, "aria-label": ariaLabel, tabIndex: -1, onClick: () => { var _a, _b; return (_b = (_a = editorRef.current) === null || _a === void 0 ? void 0 : _a.querySelector('[contenteditable="true"]')) === null || _b === void 0 ? void 0 : _b.focus(); }, onKeyDown: (e) => {
-                var _a, _b;
-                if (e.key === 'Enter' || e.key === ' ') {
-                    (_b = (_a = editorRef.current) === null || _a === void 0 ? void 0 : _a.querySelector('[contenteditable="true"]')) === null || _b === void 0 ? void 0 : _b.focus();
-                }
-            } }),
-        showCounter && (React.createElement("div", { className: `richtext-char-counter ${isOverLimit ? 'richtext-char-counter--exceeded' : ''}` },
-            charCount,
-            "/",
-            charLimit)),
-        React.createElement(Modal, { variant: ModalVariant.small, isOpen: isLinkModalOpen, onClose: onLinkCancel, "aria-labelledby": "insert-link-title" },
-            React.createElement(ModalHeader, { title: "Insert link", labelId: "insert-link-title" }),
-            React.createElement(ModalBody, null,
-                React.createElement(FormGroup, { label: "Display text", fieldId: "link-text-input" },
-                    React.createElement(TextInput, { id: "link-text-input", value: linkText, onChange: onLinkTextChange, placeholder: "Link text (defaults to URL)" })),
-                React.createElement(FormGroup, { label: "URL", isRequired: true, fieldId: "link-url-input" },
-                    React.createElement(TextInput, { id: "link-url-input", type: "url", value: linkUrl, onChange: onLinkUrlChange, placeholder: "https://", onKeyDown: onLinkUrlKeyDown }))),
-            React.createElement(ModalFooter, null,
-                React.createElement(Button, { variant: ButtonVariant.primary, onClick: onLinkInsert, isDisabled: !linkUrl.trim() }, "Insert"),
-                React.createElement(Button, { variant: ButtonVariant.link, onClick: onLinkCancel }, "Cancel"))),
-        React.createElement("input", { ref: fileInputRef, type: "file", accept: "image/jpeg,image/png,image/gif,image/svg+xml", style: { display: 'none' }, onChange: handleFileInputChange, tabIndex: -1 }),
-        !onImageUpload && (React.createElement(Modal, { variant: ModalVariant.small, isOpen: isImageModalOpen, onClose: onImageCancel, "aria-labelledby": "insert-image-title" },
-            React.createElement(ModalHeader, { title: "Insert image", labelId: "insert-image-title" }),
-            React.createElement(ModalBody, null,
-                React.createElement(FormGroup, { label: "Image URL", isRequired: true, fieldId: "image-url-input" },
-                    React.createElement(TextInput, { id: "image-url-input", type: "url", value: imageUrl, validated: imageUrlError ? 'error' : 'default', onChange: onImageUrlChange, placeholder: "https://example.redhat.com/image.png", onKeyDown: onImageUrlKeyDown }),
-                    imageUrlError && (React.createElement(FormGroup, null,
-                        React.createElement("span", { className: "pf-v6-u-danger-color-100 pf-v6-u-font-size-sm" }, imageUrlError))))),
-            React.createElement(ModalFooter, null,
-                React.createElement(Button, { variant: ButtonVariant.primary, onClick: onImageInsert, isDisabled: !imageUrl.trim() || !!imageUrlError }, "Insert"),
-                React.createElement(Button, { variant: ButtonVariant.link, onClick: onImageCancel }, "Cancel"))))));
-}
-export default RichTextEditor;

package/lib/esm/RichTextEditor/index.d.ts

@@ -1,4 +0,0 @@
-export * from './RichTextEditor';
-export { useQuillEditor } from './useQuillEditor';
-export type { UseQuillEditorOptions } from './useQuillEditor';
-//# sourceMappingURL=index.d.ts.map

package/lib/esm/RichTextEditor/index.d.ts.map

@@ -1 +0,0 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/RichTextEditor/index.ts"],"names":[],"mappings":"AAAA,cAAc,kBAAkB,CAAC;AACjC,OAAO,EAAE,cAAc,EAAE,MAAM,kBAAkB,CAAC;AAClD,YAAY,EAAE,qBAAqB,EAAE,MAAM,kBAAkB,CAAC"}

package/lib/esm/RichTextEditor/index.js

@@ -1,2 +0,0 @@
-export * from './RichTextEditor';
-export { useQuillEditor } from './useQuillEditor';

package/lib/esm/RichTextEditor/richTextEditor.css

@@ -1,153 +0,0 @@
-.richtext-editor-container {
-    background: var(--pf-t--global--background--color--primary--default, #fff);
-    border: 1px solid var(--pf-t--global--border--color--default, #d2d2d2);
-    border-radius: var(--pf-t--global--border--radius--small, 3px);
-    display: block;
-    min-height: 100px;
-}
-
-.richtext-editor-container--disabled {
-    background: var(--pf-t--global--background--color--disabled--default, #f0f0f0);
-    pointer-events: none;
-}
-
-.richtext-editor-content {
-    resize: vertical;
-    overflow: auto;
-    font-size: 15px;
-    min-width: 100%;
-    outline: none;
-    border: none;
-    min-height: 100px;
-}
-
-.richtext-editor-content.ql-container,
-.richtext-editor-container .ql-container.ql-container {
-    border: none !important;
-    outline: none !important;
-    font-size: 15px;
-}
-
-.richtext-editor-content .ql-editor {
-    padding: 0.8rem;
-    outline: none;
-    border: none;
-    min-height: 100px;
-}
-
-.richtext-editor-content .ql-editor:focus {
-    outline: none;
-    border: none;
-    box-shadow: none;
-}
-
-.richtext-editor-content:empty::before {
-    content: attr(data-placeholder);
-    color: var(--pf-t--global--text--color--placeholder, #6a6e73);
-    pointer-events: none;
-}
-
-.richtext-editor-content ul,
-.richtext-editor-content ol {
-    padding-left: 24px;
-}
-
-.richtext-editor-content li[data-list='bullet'] {
-    list-style-type: disc;
-}
-
-.richtext-editor-content li[data-list='ordered'] {
-    list-style-type: decimal;
-}
-
-.richtext-editor-content .ql-align-center {
-    text-align: center;
-}
-
-.richtext-editor-content .ql-align-right {
-    text-align: right;
-}
-
-.richtext-editor-content .ql-align-justify {
-    text-align: justify;
-}
-
-.richtext-editor-content .ql-indent-1 {
-    padding-left: 3em;
-}
-
-.richtext-editor-content .ql-indent-2 {
-    padding-left: 6em;
-}
-
-.richtext-editor-content .ql-indent-3 {
-    padding-left: 9em;
-}
-
-.richtext-editor-content .ql-indent-4 {
-    padding-left: 12em;
-}
-
-.richtext-editor-content .ql-indent-5 {
-    padding-left: 15em;
-}
-
-.richtext-editor-content a {
-    color: var(--pf-t--global--text--color--link--default, #0066cc);
-    text-decoration: underline;
-}
-
-.richtext-editor-content img {
-    max-width: 100%;
-    height: auto;
-    display: block;
-    margin: 8px 0;
-}
-
-.richtext-editor-container.is-private .richtext-editor-content {
-    background-color: #f5eeee;
-}
-
-.richtext-toolbar {
-    border-bottom: 1px solid var(--pf-t--global--border--color--default, #d2d2d2);
-    padding: 4px 8px;
-}
-
-.richtext-toolbar-left-section {
-    display: flex;
-    align-items: center;
-    flex-wrap: wrap;
-    gap: 2px;
-}
-
-.btn-group-separator {
-    display: inline-block;
-    width: 1px;
-    height: 24px;
-    margin: 0 8px;
-    background-color: var(--pf-t--global--border--color--default, #ccc);
-}
-
-.toggle-content {
-    display: inline-flex;
-    align-items: center;
-    gap: 4px;
-    font-size: 14px;
-}
-
-.dropdown-caret {
-    font-size: 12px;
-}
-
-.richtext-char-counter {
-    padding: 4px 8px;
-    font-size: 12px;
-    text-align: right;
-    color: var(--pf-t--global--text--color--subtle, #6a6e73);
-    border-top: 1px solid var(--pf-t--global--border--color--default, #d2d2d2);
-}
-
-.richtext-char-counter--exceeded {
-    color: var(--pf-t--global--color--status--danger--default, #c9190b);
-    font-weight: bold;
-}

package/lib/esm/RichTextEditor/useQuillEditor.d.ts

@@ -1,20 +0,0 @@
-import Quill from 'quill';
-export interface UseQuillEditorOptions {
-    placeholder?: string;
-    readOnly?: boolean;
-    onChange?: (html: string) => void;
-    onChangePlainText?: (text: string) => void;
-    onSelectionChange?: (format: Record<string, unknown>) => void;
-    onFocus?: () => void;
-    onBlur?: () => void;
-}
-export declare function useQuillEditor(options: UseQuillEditorOptions): {
-    editorRef: import("react").MutableRefObject<HTMLDivElement>;
-    quillRef: import("react").MutableRefObject<Quill>;
-    activeFormat: Record<string, unknown>;
-    setActiveFormat: import("react").Dispatch<import("react").SetStateAction<Record<string, unknown>>>;
-    setContents: (html: string) => void;
-    setReadOnly: (readOnly: boolean) => void;
-    getPlainText: () => string;
-};
-//# sourceMappingURL=useQuillEditor.d.ts.map

package/lib/esm/RichTextEditor/useQuillEditor.d.ts.map

@@ -1 +0,0 @@
-{"version":3,"file":"useQuillEditor.d.ts","sourceRoot":"","sources":["../../../src/RichTextEditor/useQuillEditor.ts"],"names":[],"mappings":"AACA,OAAO,KAAK,MAAM,OAAO,CAAC;AAG1B,MAAM,WAAW,qBAAqB;IAClC,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,QAAQ,CAAC,EAAE,CAAC,IAAI,EAAE,MAAM,KAAK,IAAI,CAAC;IAClC,iBAAiB,CAAC,EAAE,CAAC,IAAI,EAAE,MAAM,KAAK,IAAI,CAAC;IAC3C,iBAAiB,CAAC,EAAE,CAAC,MAAM,EAAE,MAAM,CAAC,MAAM,EAAE,OAAO,CAAC,KAAK,IAAI,CAAC;IAC9D,OAAO,CAAC,EAAE,MAAM,IAAI,CAAC;IACrB,MAAM,CAAC,EAAE,MAAM,IAAI,CAAC;CACvB;AAID,wBAAgB,cAAc,CAAC,OAAO,EAAE,qBAAqB;;;;;wBAwDlB,MAAM;4BAgBF,OAAO;;EASrD"}