@rufous/ui 0.1.92 → 0.1.94

package/dist/main.cjs

@@ -28732,6 +28732,7 @@ __export(main_exports, {
   RufousBirdIcon: () => rufousBirdIcon_default,
   RufousLauncherIcon: () => rufousLauncherBird_default,
   RufousLogoLoader: () => RufousLogoLoader,
+  RufousTextContent: () => RufousTextContent,
   RufousTextEditor: () => RufousTextEditor,
   RufousThemeProvider: () => RufousThemeProvider,
   Select: () => Select,
@@ -49677,20 +49678,29 @@ function createSpellCheckPlugin() {
   let debounceTimer = null;
   let viewRef = null;
   const runCheck = (view) => {
-    if (!typo || !view.dom?.isConnected) return;
-    const { doc: doc3 } = view.state;
-    const misspelled = findMisspelled(doc3);
-    const decos = misspelled.map(
-      ({ from, to, word }) => Decoration.inline(from, to, {
-        class: "rf-spell-error",
-        nodeName: "span",
-        "data-spell-word": word
-      })
-    );
-    const decorationSet = DecorationSet.create(doc3, decos);
-    const tr = view.state.tr.setMeta(spellCheckPluginKey, { decorations: decorationSet });
-    tr.setMeta("addToHistory", false);
-    view.dispatch(tr);
+    try {
+      if (!typo || !view?.dom?.isConnected || !view.state) return;
+      const { doc: doc3 } = view.state;
+      if (!doc3 || doc3.content.size <= 4) {
+        const tr2 = view.state.tr.setMeta(spellCheckPluginKey, { decorations: DecorationSet.empty });
+        tr2.setMeta("addToHistory", false);
+        view.dispatch(tr2);
+        return;
+      }
+      const misspelled = findMisspelled(doc3);
+      const decos = misspelled.map(
+        ({ from, to, word }) => Decoration.inline(from, to, {
+          class: "rf-spell-error",
+          nodeName: "span",
+          "data-spell-word": word
+        })
+      );
+      const decorationSet = DecorationSet.create(doc3, decos);
+      const tr = view.state.tr.setMeta(spellCheckPluginKey, { decorations: decorationSet });
+      tr.setMeta("addToHistory", false);
+      view.dispatch(tr);
+    } catch {
+    }
   };
   const scheduleCheck = (view) => {
     if (debounceTimer) clearTimeout(debounceTimer);
@@ -49702,16 +49712,33 @@ function createSpellCheckPlugin() {
       init() {
         return DecorationSet.empty;
       },
-      apply(tr, oldDecos) {
+      apply(tr, oldDecos, _oldState, newState) {
         const meta = tr.getMeta(spellCheckPluginKey);
         if (meta?.decorations) return meta.decorations;
-        if (tr.docChanged) return oldDecos.map(tr.mapping, tr.doc);
+        if (tr.docChanged) {
+          if (newState.doc.content.size <= 4) return DecorationSet.empty;
+          if (oldDecos === DecorationSet.empty) return DecorationSet.empty;
+          try {
+            const mapped = oldDecos.map(tr.mapping, tr.doc);
+            if (!mapped || typeof mapped.find !== "function") return DecorationSet.empty;
+            return mapped;
+          } catch {
+            return DecorationSet.empty;
+          }
+        }
         return oldDecos;
       }
     },
     props: {
       decorations(state) {
-        return spellCheckPluginKey.getState(state);
+        try {
+          const decos = spellCheckPluginKey.getState(state);
+          if (!decos || decos === DecorationSet.empty) return DecorationSet.empty;
+          decos.find();
+          return decos;
+        } catch {
+          return DecorationSet.empty;
+        }
       }
     },
     view(editorView) {
@@ -49855,6 +49882,14 @@ var RufousTextEditor = ({
   style
 }) => {
   const mentionSuggestion = (0, import_react60.useMemo)(() => createMentionSuggestion(mentions), [mentions]);
+  const onChangeRef = (0, import_react60.useRef)(onChange);
+  const onBlurRef = (0, import_react60.useRef)(onBlur);
+  (0, import_react60.useEffect)(() => {
+    onChangeRef.current = onChange;
+  }, [onChange]);
+  (0, import_react60.useEffect)(() => {
+    onBlurRef.current = onBlur;
+  }, [onBlur]);
   const editor = (0, import_react61.useEditor)({
     editable,
     extensions: [
@@ -49944,16 +49979,19 @@ var RufousTextEditor = ({
     },
     content: initialContent || "",
     onUpdate: ({ editor: e }) => {
-      if (onChange) {
-        onChange(e.getHTML(), e.getJSON());
-      }
-    },
-    onBlur: ({ editor: e }) => {
-      if (onBlur) {
-        onBlur(e.getHTML(), e.getJSON());
-      }
+      onChangeRef.current?.(e.getHTML(), e.getJSON());
     }
   });
+  (0, import_react60.useEffect)(() => {
+    if (!editor) return;
+    const handler = () => {
+      onBlurRef.current?.(editor.getHTML(), editor.getJSON());
+    };
+    editor.on("blur", handler);
+    return () => {
+      editor.off("blur", handler);
+    };
+  }, [editor]);
   const [linkModalOpen, setLinkModalOpen] = (0, import_react60.useState)(false);
   const [linkUrl, setLinkUrl] = (0, import_react60.useState)("");
   const [linkText, setLinkText] = (0, import_react60.useState)("");
@@ -50234,6 +50272,14 @@ var RufousTextEditor = ({
     }
   ), "No follow"))), /* @__PURE__ */ import_react60.default.createElement("div", { className: "link-modal-footer" }, /* @__PURE__ */ import_react60.default.createElement("button", { className: "link-modal-btn-unlink", onClick: handleLinkRemove }, "Unlink"), /* @__PURE__ */ import_react60.default.createElement("button", { className: "link-modal-btn-apply", onClick: handleLinkSubmit }, "Update"))))));
 };
+var RufousTextContent = ({ content, className, style }) => /* @__PURE__ */ import_react60.default.createElement(
+  "div",
+  {
+    className: `rf-rte-content ${className || ""}`,
+    style,
+    dangerouslySetInnerHTML: { __html: content }
+  }
+);
 // Annotate the CommonJS export names for ESM import in node:
 0 && (module.exports = {
   APP_THEMES,
@@ -50333,6 +50379,7 @@ var RufousTextEditor = ({
   RufousBirdIcon,
   RufousLauncherIcon,
   RufousLogoLoader,
+  RufousTextContent,
   RufousTextEditor,
   RufousThemeProvider,
   Select,

package/dist/main.css

@@ -16289,6 +16289,178 @@ svg.jodit-icon {
   background: #f3f4f6;
   color: #374151;
 }
+.rf-rte-content {
+  font-size: 16px;
+  line-height: 1.75;
+  color: #1e293b;
+  text-align: left;
+  word-wrap: break-word;
+  overflow-wrap: break-word;
+}
+.rf-rte-content h1 {
+  font-size: 2em;
+  font-weight: 700;
+  margin: 1em 0 0.4em;
+  line-height: 1.2;
+}
+.rf-rte-content h2 {
+  font-size: 1.5em;
+  font-weight: 600;
+  margin: 0.8em 0 0.4em;
+  line-height: 1.3;
+}
+.rf-rte-content h3 {
+  font-size: 1.25em;
+  font-weight: 600;
+  margin: 0.6em 0 0.3em;
+  line-height: 1.4;
+}
+.rf-rte-content h4 {
+  font-size: 1.1em;
+  font-weight: 600;
+  margin: 0.5em 0 0.25em;
+}
+.rf-rte-content h5 {
+  font-size: 1em;
+  font-weight: 600;
+  margin: 0.5em 0 0.25em;
+}
+.rf-rte-content h6 {
+  font-size: 0.9em;
+  font-weight: 600;
+  margin: 0.5em 0 0.25em;
+  text-transform: uppercase;
+  letter-spacing: 0.05em;
+}
+.rf-rte-content p {
+  margin: 0.5em 0;
+}
+.rf-rte-content ul,
+.rf-rte-content ol {
+  padding-left: 24px;
+  margin: 0.5em 0;
+}
+.rf-rte-content li {
+  margin: 0.25em 0;
+}
+.rf-rte-content ul[data-type=taskList] {
+  list-style: none;
+  padding-left: 24px;
+}
+.rf-rte-content ul[data-type=taskList] li {
+  display: flex;
+  align-items: flex-start;
+  gap: 8px;
+  margin: 4px 0;
+}
+.rf-rte-content blockquote {
+  border-left: 3px solid #6366f1;
+  margin: 0.8em 0;
+  padding: 0.4em 0 0.4em 16px;
+  color: #4b5563;
+  background: #f9fafb;
+  border-radius: 0 4px 4px 0;
+}
+.rf-rte-content code {
+  background: #f3f4f6;
+  border-radius: 4px;
+  padding: 2px 6px;
+  font-size: 0.9em;
+  color: #e11d48;
+  font-family:
+    "Fira Code",
+    "Consolas",
+    monospace;
+}
+.rf-rte-content pre {
+  background: #1e1e2e;
+  color: #cdd6f4;
+  border-radius: 8px;
+  padding: 16px;
+  margin: 0.8em 0;
+  overflow-x: auto;
+}
+.rf-rte-content pre code {
+  background: none;
+  color: inherit;
+  padding: 0;
+  font-size: 0.9em;
+}
+.rf-rte-content hr {
+  border: none;
+  border-top: 2px solid #e5e7eb;
+  margin: 1.5em 0;
+}
+.rf-rte-content strong {
+  font-weight: 700;
+}
+.rf-rte-content em {
+  font-style: italic;
+}
+.rf-rte-content s {
+  text-decoration: line-through;
+  color: #9ca3af;
+}
+.rf-rte-content u {
+  text-decoration: underline;
+}
+.rf-rte-content mark {
+  border-radius: 2px;
+  padding: 1px 2px;
+}
+.rf-rte-content table {
+  border-collapse: collapse;
+  width: 100%;
+  margin: 0.8em 0;
+  overflow: hidden;
+  border-radius: 4px;
+}
+.rf-rte-content table td,
+.rf-rte-content table th {
+  border: 1px solid #d1d5db;
+  padding: 8px 12px;
+  min-width: 80px;
+  vertical-align: top;
+}
+.rf-rte-content table th {
+  background: #f3f4f6;
+  font-weight: 600;
+  text-align: left;
+}
+.rf-rte-content img {
+  max-width: 100%;
+  height: auto;
+  border-radius: 8px;
+  margin: 0.8em 0;
+}
+.rf-rte-content video {
+  max-width: 100%;
+}
+.rf-rte-content div[data-youtube-video] {
+  margin: 0.8em 0;
+}
+.rf-rte-content div[data-youtube-video] iframe {
+  border-radius: 8px;
+  max-width: 100%;
+}
+.rf-rte-content .editor-link {
+  color: #6366f1;
+  text-decoration: underline;
+  text-underline-offset: 2px;
+  cursor: pointer;
+}
+.rf-rte-content .editor-link:hover {
+  color: #4f46e5;
+}
+.rf-rte-content .mention {
+  background: #fef2f2;
+  color: #991b1b;
+  border-radius: 4px;
+  padding: 1px 4px;
+  font-weight: 600;
+  font-size: 0.95em;
+  white-space: nowrap;
+}
 /*! Bundled license information:
 
 jodit/es5/jodit.min.css:

package/dist/main.d.cts

@@ -1699,6 +1699,12 @@ interface RufousTextEditorProps {
     style?: React__default.CSSProperties;
 }
 declare const RufousTextEditor: React__default.FC<RufousTextEditorProps>;
+interface RufousTextContentProps {
+    content: string;
+    className?: string;
+    style?: React__default.CSSProperties;
+}
+declare const RufousTextContent: React__default.FC<RufousTextContentProps>;
 
 interface MentionItemData {
     id: string;
@@ -1706,4 +1712,4 @@ interface MentionItemData {
     avatar?: string;
 }
 
-export { APP_THEMES, Accordion, AccordionDetails, type AccordionDetailsProps, type AccordionProps, AccordionSummary, type AccordionSummaryProps, type Action, ActivateUserIcon, AddButton, AddressLookup, ArchivedIcon, AssignGroupIcon, Autocomplete, type AutocompleteProps, Avatar, AvatarGroup, type AvatarGroupProps, type AvatarProps, BaseDialog, Box, type BoxProps, Breadcrumbs, type BreadcrumbsProps, Button, type ButtonProps, CameraIcon, CancelButton, Card, CardActions, type CardActionsProps, CardContent, type CardContentProps, CardHeader, type CardHeaderProps, CardMedia, type CardMediaProps, type CardProps, Checkbox, type CheckboxProps, Chip, type ChipProps, CircularProgress, CircularProgressIcon, type CircularProgressIconProps, CloseIcon, Collapse, type CollapseProps, type Column, CopyIcon, DataGrid, type DataGridProps, DateField, type DateFieldProps, type DateFormatString, DateRangeField, type DateRangeFieldProps, type DateRangeValue, DifficultyAllIcon, DifficultyEasyIcon, DifficultyHardIcon, DifficultyMediumIcon, Divider, type DividerProps, DollarIcon, DownloadIcon, DownloadPdfIcon, Drawer, type DrawerProps, EditChatIcon, EditIcon, EngagementIcon, Fade, type FadeProps, FunctionIcon, Grid, type GridProps, Grow, type GrowProps, HelpOutlinedIcon, HierarchyIcon, IconButton, type IconButtonProps, ImageField, type ImageFieldProps, InactiveGroupIcon, IndustryIcon, InvoiceIcon, Link, type LinkProps, List, ListItem, ListItemButton, type ListItemButtonProps, ListItemIcon, type ListItemIconProps, type ListItemProps, ListItemText, type ListItemTextProps, type ListProps, ListSubheader, type ListSubheaderProps, LocationPinIcon, LogsIcon, type MentionItem, Menu, MenuDivider, MenuItem, type MenuItemProps, MenuList, type MenuListProps, type MenuProps, MinExperienceIcon, NineDotMenuIcon, NotificationIcon, Paper, type PaperProps, PhoneField, type PhoneFieldProps, Popover, type PopoverProps, Popper, type PopperProps, ProjectIcon, QualificationsIcon, QuestionStatusAllIcon, QuestionStatusPrivateIcon, QuestionStatusPublicIcon, QuestionTypeAllIcon, QuestionTypeCodingIcon, QuestionTypeDescriptiveIcon, QuestionTypeMultipleIcon, QuestionTypeSingleIcon, Radio, RadioGroup, type RadioGroupProps, type RadioProps, Rating, type RatingProps, RefreshIcon, ResendInviteIcon, RichTextEditor, type RichTextEditorProps, RolesIcon, RufousAiIcon, RufousBirdIcon, RufousLauncherIcon, RufousLogoLoader, type RufousLogoLoaderProps, RufousTextEditor, type MentionItemData as RufousTextEditorMentionItem, type RufousTextEditorProps, RufousThemeProvider, Select, type SelectProps, SidebarIcon, Skeleton, type SkeletonProps, Slide, type SlideProps, Slider, type SliderProps, Snackbar, type SnackbarProps, SoftSkillsIcon, type SortDirection, Stack, type StackProps, StandardButton, Step, StepButton, type StepButtonProps, StepContent, type StepContentProps, StepLabel, type StepLabelProps, type StepProps, Stepper, type StepperProps, SubmitButton, SubscribeIcon, SuspendUserIcon, Switch, type SwitchProps, type SxProp, Tab, TabPanel, type TabPanelProps, type TabProps, Tabs, type TabsProps, TechnicalSkillsIcon, TextField, type TextFieldProps, TickIcon, TimerIcon, ToggleButton, ToggleButtonGroup, type ToggleButtonGroupProps, type ToggleButtonProps, Tooltip, type TooltipProps, TrashIcon, Typography, type TypographyProps, UnArchivedIcon, UnsubscribeIcon, UploadIcon, UserAssignIcon, ViewIcon, WorkItemIcon, Zoom, type ZoomProps, useRufousTheme };
+export { APP_THEMES, Accordion, AccordionDetails, type AccordionDetailsProps, type AccordionProps, AccordionSummary, type AccordionSummaryProps, type Action, ActivateUserIcon, AddButton, AddressLookup, ArchivedIcon, AssignGroupIcon, Autocomplete, type AutocompleteProps, Avatar, AvatarGroup, type AvatarGroupProps, type AvatarProps, BaseDialog, Box, type BoxProps, Breadcrumbs, type BreadcrumbsProps, Button, type ButtonProps, CameraIcon, CancelButton, Card, CardActions, type CardActionsProps, CardContent, type CardContentProps, CardHeader, type CardHeaderProps, CardMedia, type CardMediaProps, type CardProps, Checkbox, type CheckboxProps, Chip, type ChipProps, CircularProgress, CircularProgressIcon, type CircularProgressIconProps, CloseIcon, Collapse, type CollapseProps, type Column, CopyIcon, DataGrid, type DataGridProps, DateField, type DateFieldProps, type DateFormatString, DateRangeField, type DateRangeFieldProps, type DateRangeValue, DifficultyAllIcon, DifficultyEasyIcon, DifficultyHardIcon, DifficultyMediumIcon, Divider, type DividerProps, DollarIcon, DownloadIcon, DownloadPdfIcon, Drawer, type DrawerProps, EditChatIcon, EditIcon, EngagementIcon, Fade, type FadeProps, FunctionIcon, Grid, type GridProps, Grow, type GrowProps, HelpOutlinedIcon, HierarchyIcon, IconButton, type IconButtonProps, ImageField, type ImageFieldProps, InactiveGroupIcon, IndustryIcon, InvoiceIcon, Link, type LinkProps, List, ListItem, ListItemButton, type ListItemButtonProps, ListItemIcon, type ListItemIconProps, type ListItemProps, ListItemText, type ListItemTextProps, type ListProps, ListSubheader, type ListSubheaderProps, LocationPinIcon, LogsIcon, type MentionItem, Menu, MenuDivider, MenuItem, type MenuItemProps, MenuList, type MenuListProps, type MenuProps, MinExperienceIcon, NineDotMenuIcon, NotificationIcon, Paper, type PaperProps, PhoneField, type PhoneFieldProps, Popover, type PopoverProps, Popper, type PopperProps, ProjectIcon, QualificationsIcon, QuestionStatusAllIcon, QuestionStatusPrivateIcon, QuestionStatusPublicIcon, QuestionTypeAllIcon, QuestionTypeCodingIcon, QuestionTypeDescriptiveIcon, QuestionTypeMultipleIcon, QuestionTypeSingleIcon, Radio, RadioGroup, type RadioGroupProps, type RadioProps, Rating, type RatingProps, RefreshIcon, ResendInviteIcon, RichTextEditor, type RichTextEditorProps, RolesIcon, RufousAiIcon, RufousBirdIcon, RufousLauncherIcon, RufousLogoLoader, type RufousLogoLoaderProps, RufousTextContent, type RufousTextContentProps, RufousTextEditor, type MentionItemData as RufousTextEditorMentionItem, type RufousTextEditorProps, RufousThemeProvider, Select, type SelectProps, SidebarIcon, Skeleton, type SkeletonProps, Slide, type SlideProps, Slider, type SliderProps, Snackbar, type SnackbarProps, SoftSkillsIcon, type SortDirection, Stack, type StackProps, StandardButton, Step, StepButton, type StepButtonProps, StepContent, type StepContentProps, StepLabel, type StepLabelProps, type StepProps, Stepper, type StepperProps, SubmitButton, SubscribeIcon, SuspendUserIcon, Switch, type SwitchProps, type SxProp, Tab, TabPanel, type TabPanelProps, type TabProps, Tabs, type TabsProps, TechnicalSkillsIcon, TextField, type TextFieldProps, TickIcon, TimerIcon, ToggleButton, ToggleButtonGroup, type ToggleButtonGroupProps, type ToggleButtonProps, Tooltip, type TooltipProps, TrashIcon, Typography, type TypographyProps, UnArchivedIcon, UnsubscribeIcon, UploadIcon, UserAssignIcon, ViewIcon, WorkItemIcon, Zoom, type ZoomProps, useRufousTheme };

package/dist/main.d.ts

@@ -1699,6 +1699,12 @@ interface RufousTextEditorProps {
     style?: React__default.CSSProperties;
 }
 declare const RufousTextEditor: React__default.FC<RufousTextEditorProps>;
+interface RufousTextContentProps {
+    content: string;
+    className?: string;
+    style?: React__default.CSSProperties;
+}
+declare const RufousTextContent: React__default.FC<RufousTextContentProps>;
 
 interface MentionItemData {
     id: string;
@@ -1706,4 +1712,4 @@ interface MentionItemData {
     avatar?: string;
 }
 
-export { APP_THEMES, Accordion, AccordionDetails, type AccordionDetailsProps, type AccordionProps, AccordionSummary, type AccordionSummaryProps, type Action, ActivateUserIcon, AddButton, AddressLookup, ArchivedIcon, AssignGroupIcon, Autocomplete, type AutocompleteProps, Avatar, AvatarGroup, type AvatarGroupProps, type AvatarProps, BaseDialog, Box, type BoxProps, Breadcrumbs, type BreadcrumbsProps, Button, type ButtonProps, CameraIcon, CancelButton, Card, CardActions, type CardActionsProps, CardContent, type CardContentProps, CardHeader, type CardHeaderProps, CardMedia, type CardMediaProps, type CardProps, Checkbox, type CheckboxProps, Chip, type ChipProps, CircularProgress, CircularProgressIcon, type CircularProgressIconProps, CloseIcon, Collapse, type CollapseProps, type Column, CopyIcon, DataGrid, type DataGridProps, DateField, type DateFieldProps, type DateFormatString, DateRangeField, type DateRangeFieldProps, type DateRangeValue, DifficultyAllIcon, DifficultyEasyIcon, DifficultyHardIcon, DifficultyMediumIcon, Divider, type DividerProps, DollarIcon, DownloadIcon, DownloadPdfIcon, Drawer, type DrawerProps, EditChatIcon, EditIcon, EngagementIcon, Fade, type FadeProps, FunctionIcon, Grid, type GridProps, Grow, type GrowProps, HelpOutlinedIcon, HierarchyIcon, IconButton, type IconButtonProps, ImageField, type ImageFieldProps, InactiveGroupIcon, IndustryIcon, InvoiceIcon, Link, type LinkProps, List, ListItem, ListItemButton, type ListItemButtonProps, ListItemIcon, type ListItemIconProps, type ListItemProps, ListItemText, type ListItemTextProps, type ListProps, ListSubheader, type ListSubheaderProps, LocationPinIcon, LogsIcon, type MentionItem, Menu, MenuDivider, MenuItem, type MenuItemProps, MenuList, type MenuListProps, type MenuProps, MinExperienceIcon, NineDotMenuIcon, NotificationIcon, Paper, type PaperProps, PhoneField, type PhoneFieldProps, Popover, type PopoverProps, Popper, type PopperProps, ProjectIcon, QualificationsIcon, QuestionStatusAllIcon, QuestionStatusPrivateIcon, QuestionStatusPublicIcon, QuestionTypeAllIcon, QuestionTypeCodingIcon, QuestionTypeDescriptiveIcon, QuestionTypeMultipleIcon, QuestionTypeSingleIcon, Radio, RadioGroup, type RadioGroupProps, type RadioProps, Rating, type RatingProps, RefreshIcon, ResendInviteIcon, RichTextEditor, type RichTextEditorProps, RolesIcon, RufousAiIcon, RufousBirdIcon, RufousLauncherIcon, RufousLogoLoader, type RufousLogoLoaderProps, RufousTextEditor, type MentionItemData as RufousTextEditorMentionItem, type RufousTextEditorProps, RufousThemeProvider, Select, type SelectProps, SidebarIcon, Skeleton, type SkeletonProps, Slide, type SlideProps, Slider, type SliderProps, Snackbar, type SnackbarProps, SoftSkillsIcon, type SortDirection, Stack, type StackProps, StandardButton, Step, StepButton, type StepButtonProps, StepContent, type StepContentProps, StepLabel, type StepLabelProps, type StepProps, Stepper, type StepperProps, SubmitButton, SubscribeIcon, SuspendUserIcon, Switch, type SwitchProps, type SxProp, Tab, TabPanel, type TabPanelProps, type TabProps, Tabs, type TabsProps, TechnicalSkillsIcon, TextField, type TextFieldProps, TickIcon, TimerIcon, ToggleButton, ToggleButtonGroup, type ToggleButtonGroupProps, type ToggleButtonProps, Tooltip, type TooltipProps, TrashIcon, Typography, type TypographyProps, UnArchivedIcon, UnsubscribeIcon, UploadIcon, UserAssignIcon, ViewIcon, WorkItemIcon, Zoom, type ZoomProps, useRufousTheme };
+export { APP_THEMES, Accordion, AccordionDetails, type AccordionDetailsProps, type AccordionProps, AccordionSummary, type AccordionSummaryProps, type Action, ActivateUserIcon, AddButton, AddressLookup, ArchivedIcon, AssignGroupIcon, Autocomplete, type AutocompleteProps, Avatar, AvatarGroup, type AvatarGroupProps, type AvatarProps, BaseDialog, Box, type BoxProps, Breadcrumbs, type BreadcrumbsProps, Button, type ButtonProps, CameraIcon, CancelButton, Card, CardActions, type CardActionsProps, CardContent, type CardContentProps, CardHeader, type CardHeaderProps, CardMedia, type CardMediaProps, type CardProps, Checkbox, type CheckboxProps, Chip, type ChipProps, CircularProgress, CircularProgressIcon, type CircularProgressIconProps, CloseIcon, Collapse, type CollapseProps, type Column, CopyIcon, DataGrid, type DataGridProps, DateField, type DateFieldProps, type DateFormatString, DateRangeField, type DateRangeFieldProps, type DateRangeValue, DifficultyAllIcon, DifficultyEasyIcon, DifficultyHardIcon, DifficultyMediumIcon, Divider, type DividerProps, DollarIcon, DownloadIcon, DownloadPdfIcon, Drawer, type DrawerProps, EditChatIcon, EditIcon, EngagementIcon, Fade, type FadeProps, FunctionIcon, Grid, type GridProps, Grow, type GrowProps, HelpOutlinedIcon, HierarchyIcon, IconButton, type IconButtonProps, ImageField, type ImageFieldProps, InactiveGroupIcon, IndustryIcon, InvoiceIcon, Link, type LinkProps, List, ListItem, ListItemButton, type ListItemButtonProps, ListItemIcon, type ListItemIconProps, type ListItemProps, ListItemText, type ListItemTextProps, type ListProps, ListSubheader, type ListSubheaderProps, LocationPinIcon, LogsIcon, type MentionItem, Menu, MenuDivider, MenuItem, type MenuItemProps, MenuList, type MenuListProps, type MenuProps, MinExperienceIcon, NineDotMenuIcon, NotificationIcon, Paper, type PaperProps, PhoneField, type PhoneFieldProps, Popover, type PopoverProps, Popper, type PopperProps, ProjectIcon, QualificationsIcon, QuestionStatusAllIcon, QuestionStatusPrivateIcon, QuestionStatusPublicIcon, QuestionTypeAllIcon, QuestionTypeCodingIcon, QuestionTypeDescriptiveIcon, QuestionTypeMultipleIcon, QuestionTypeSingleIcon, Radio, RadioGroup, type RadioGroupProps, type RadioProps, Rating, type RatingProps, RefreshIcon, ResendInviteIcon, RichTextEditor, type RichTextEditorProps, RolesIcon, RufousAiIcon, RufousBirdIcon, RufousLauncherIcon, RufousLogoLoader, type RufousLogoLoaderProps, RufousTextContent, type RufousTextContentProps, RufousTextEditor, type MentionItemData as RufousTextEditorMentionItem, type RufousTextEditorProps, RufousThemeProvider, Select, type SelectProps, SidebarIcon, Skeleton, type SkeletonProps, Slide, type SlideProps, Slider, type SliderProps, Snackbar, type SnackbarProps, SoftSkillsIcon, type SortDirection, Stack, type StackProps, StandardButton, Step, StepButton, type StepButtonProps, StepContent, type StepContentProps, StepLabel, type StepLabelProps, type StepProps, Stepper, type StepperProps, SubmitButton, SubscribeIcon, SuspendUserIcon, Switch, type SwitchProps, type SxProp, Tab, TabPanel, type TabPanelProps, type TabProps, Tabs, type TabsProps, TechnicalSkillsIcon, TextField, type TextFieldProps, TickIcon, TimerIcon, ToggleButton, ToggleButtonGroup, type ToggleButtonGroupProps, type ToggleButtonProps, Tooltip, type TooltipProps, TrashIcon, Typography, type TypographyProps, UnArchivedIcon, UnsubscribeIcon, UploadIcon, UserAssignIcon, ViewIcon, WorkItemIcon, Zoom, type ZoomProps, useRufousTheme };

package/dist/main.js

@@ -8721,7 +8721,7 @@ var PhoneField = forwardRef10(function PhoneField2(props, ref) {
 PhoneField.displayName = "PhoneField";
 
 // lib/RufousTextEditor/RufousTextEditor.tsx
-import React117, { useMemo as useMemo4, useCallback as useCallback14, useState as useState35 } from "react";
+import React117, { useMemo as useMemo4, useCallback as useCallback14, useState as useState35, useRef as useRef31, useEffect as useEffect28 } from "react";
 import { useEditor, EditorContent, EditorContext, FloatingMenu, BubbleMenu } from "@tiptap/react";
 import StarterKit from "@tiptap/starter-kit";
 import Placeholder from "@tiptap/extension-placeholder";
@@ -21008,20 +21008,29 @@ function createSpellCheckPlugin() {
   let debounceTimer = null;
   let viewRef = null;
   const runCheck = (view) => {
-    if (!typo || !view.dom?.isConnected) return;
-    const { doc: doc3 } = view.state;
-    const misspelled = findMisspelled(doc3);
-    const decos = misspelled.map(
-      ({ from, to, word }) => Decoration.inline(from, to, {
-        class: "rf-spell-error",
-        nodeName: "span",
-        "data-spell-word": word
-      })
-    );
-    const decorationSet = DecorationSet.create(doc3, decos);
-    const tr = view.state.tr.setMeta(spellCheckPluginKey, { decorations: decorationSet });
-    tr.setMeta("addToHistory", false);
-    view.dispatch(tr);
+    try {
+      if (!typo || !view?.dom?.isConnected || !view.state) return;
+      const { doc: doc3 } = view.state;
+      if (!doc3 || doc3.content.size <= 4) {
+        const tr2 = view.state.tr.setMeta(spellCheckPluginKey, { decorations: DecorationSet.empty });
+        tr2.setMeta("addToHistory", false);
+        view.dispatch(tr2);
+        return;
+      }
+      const misspelled = findMisspelled(doc3);
+      const decos = misspelled.map(
+        ({ from, to, word }) => Decoration.inline(from, to, {
+          class: "rf-spell-error",
+          nodeName: "span",
+          "data-spell-word": word
+        })
+      );
+      const decorationSet = DecorationSet.create(doc3, decos);
+      const tr = view.state.tr.setMeta(spellCheckPluginKey, { decorations: decorationSet });
+      tr.setMeta("addToHistory", false);
+      view.dispatch(tr);
+    } catch {
+    }
   };
   const scheduleCheck = (view) => {
     if (debounceTimer) clearTimeout(debounceTimer);
@@ -21033,16 +21042,33 @@ function createSpellCheckPlugin() {
       init() {
         return DecorationSet.empty;
       },
-      apply(tr, oldDecos) {
+      apply(tr, oldDecos, _oldState, newState) {
         const meta = tr.getMeta(spellCheckPluginKey);
         if (meta?.decorations) return meta.decorations;
-        if (tr.docChanged) return oldDecos.map(tr.mapping, tr.doc);
+        if (tr.docChanged) {
+          if (newState.doc.content.size <= 4) return DecorationSet.empty;
+          if (oldDecos === DecorationSet.empty) return DecorationSet.empty;
+          try {
+            const mapped = oldDecos.map(tr.mapping, tr.doc);
+            if (!mapped || typeof mapped.find !== "function") return DecorationSet.empty;
+            return mapped;
+          } catch {
+            return DecorationSet.empty;
+          }
+        }
         return oldDecos;
       }
     },
     props: {
       decorations(state) {
-        return spellCheckPluginKey.getState(state);
+        try {
+          const decos = spellCheckPluginKey.getState(state);
+          if (!decos || decos === DecorationSet.empty) return DecorationSet.empty;
+          decos.find();
+          return decos;
+        } catch {
+          return DecorationSet.empty;
+        }
       }
     },
     view(editorView) {
@@ -21186,6 +21212,14 @@ var RufousTextEditor = ({
   style
 }) => {
   const mentionSuggestion = useMemo4(() => createMentionSuggestion(mentions), [mentions]);
+  const onChangeRef = useRef31(onChange);
+  const onBlurRef = useRef31(onBlur);
+  useEffect28(() => {
+    onChangeRef.current = onChange;
+  }, [onChange]);
+  useEffect28(() => {
+    onBlurRef.current = onBlur;
+  }, [onBlur]);
   const editor = useEditor({
     editable,
     extensions: [
@@ -21275,16 +21309,19 @@ var RufousTextEditor = ({
     },
     content: initialContent || "",
     onUpdate: ({ editor: e }) => {
-      if (onChange) {
-        onChange(e.getHTML(), e.getJSON());
-      }
-    },
-    onBlur: ({ editor: e }) => {
-      if (onBlur) {
-        onBlur(e.getHTML(), e.getJSON());
-      }
+      onChangeRef.current?.(e.getHTML(), e.getJSON());
     }
   });
+  useEffect28(() => {
+    if (!editor) return;
+    const handler = () => {
+      onBlurRef.current?.(editor.getHTML(), editor.getJSON());
+    };
+    editor.on("blur", handler);
+    return () => {
+      editor.off("blur", handler);
+    };
+  }, [editor]);
   const [linkModalOpen, setLinkModalOpen] = useState35(false);
   const [linkUrl, setLinkUrl] = useState35("");
   const [linkText, setLinkText] = useState35("");
@@ -21565,6 +21602,14 @@ var RufousTextEditor = ({
     }
   ), "No follow"))), /* @__PURE__ */ React117.createElement("div", { className: "link-modal-footer" }, /* @__PURE__ */ React117.createElement("button", { className: "link-modal-btn-unlink", onClick: handleLinkRemove }, "Unlink"), /* @__PURE__ */ React117.createElement("button", { className: "link-modal-btn-apply", onClick: handleLinkSubmit }, "Update"))))));
 };
+var RufousTextContent = ({ content, className, style }) => /* @__PURE__ */ React117.createElement(
+  "div",
+  {
+    className: `rf-rte-content ${className || ""}`,
+    style,
+    dangerouslySetInnerHTML: { __html: content }
+  }
+);
 export {
   APP_THEMES,
   Accordion,
@@ -21663,6 +21708,7 @@ export {
   rufousBirdIcon_default as RufousBirdIcon,
   rufousLauncherBird_default as RufousLauncherIcon,
   RufousLogoLoader,
+  RufousTextContent,
   RufousTextEditor,
   RufousThemeProvider,
   Select,

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "@rufous/ui",
   "private": false,
-  "version": "0.1.92",
+  "version": "0.1.94",
   "type": "module",
   "description": "Experimental: A lightweight React UI component library (Beta)",
   "style": "./dist/main.css",