@12-apps/ui 6.11.0 → 6.11.1

package/dist/form/RichTextEditor.js

@@ -1,556 +1,12 @@
-import "../chunk-PZ5AY32C.js";
-
-// src/components/form/RichTextEditor/RichTextEditor.tsx
+import "../chunk-WMY276HD.js";
 import {
-  alpha as alpha2,
-  Box as Box2,
-  Paper,
-  useTheme
-} from "@mui/material";
-import { forwardRef } from "react";
-
-// src/components/form/RichTextEditor/RichTextEditor.hooks.ts
-import DOMPurify from "dompurify";
-import { useCallback, useEffect, useRef, useState } from "react";
-
-// src/components/form/RichTextEditor/RichTextEditor.dom.ts
-var wrapSelection = (range, tagName) => {
-  const selectedText = range.toString();
-  if (!selectedText) return;
-  const wrapper = document.createElement(tagName);
-  wrapper.appendChild(document.createTextNode(selectedText));
-  range.deleteContents();
-  range.insertNode(wrapper);
-  const newRange = document.createRange();
-  newRange.setStartAfter(wrapper);
-  newRange.collapse(true);
-  const selection = window.getSelection();
-  selection?.removeAllRanges();
-  selection?.addRange(newRange);
-};
-var wrapSelectionWithLink = (range, url) => {
-  const selectedText = range.toString();
-  if (!selectedText) return;
-  const link = document.createElement("a");
-  link.href = url.startsWith("http") ? url : `https://${url}`;
-  link.target = "_blank";
-  link.rel = "noopener noreferrer";
-  link.appendChild(document.createTextNode(selectedText));
-  range.deleteContents();
-  range.insertNode(link);
-  const newRange = document.createRange();
-  newRange.setStartAfter(link);
-  newRange.collapse(true);
-  const selection = window.getSelection();
-  selection?.removeAllRanges();
-  selection?.addRange(newRange);
-};
-var insertImage = (range, src) => {
-  const img = document.createElement("img");
-  img.src = src;
-  img.style.maxWidth = "100%";
-  img.style.height = "auto";
-  range.deleteContents();
-  range.insertNode(img);
-  const newRange = document.createRange();
-  newRange.setStartAfter(img);
-  newRange.collapse(true);
-  const selection = window.getSelection();
-  selection?.removeAllRanges();
-  selection?.addRange(newRange);
-};
-var blockElementFor = (range) => {
-  const node = range.commonAncestorContainer;
-  return node.nodeType === globalThis.Node.TEXT_NODE ? node.parentElement : node;
-};
-var removeFromList = (block) => {
-  const listItem = block.closest("li");
-  if (!listItem?.parentElement) return;
-  listItem.parentElement.replaceChild(
-    document.createTextNode(listItem.textContent || ""),
-    listItem
-  );
-};
-var wrapInList = (range, listType) => {
-  const list = document.createElement(listType);
-  const listItem = document.createElement("li");
-  listItem.appendChild(document.createTextNode(range.toString() || "List item"));
-  list.appendChild(listItem);
-  range.deleteContents();
-  range.insertNode(list);
-  const newRange = document.createRange();
-  newRange.selectNodeContents(listItem);
-  newRange.collapse(false);
-  const selection = window.getSelection();
-  selection?.removeAllRanges();
-  selection?.addRange(newRange);
-};
-var toggleList = (range, listType, editor) => {
-  if (!editor) return;
-  const block = blockElementFor(range);
-  if (!block) return;
-  if (block.closest(listType)) {
-    removeFromList(block);
-    return;
-  }
-  wrapInList(range, listType);
-};
-
-// src/components/form/RichTextEditor/RichTextEditor.format.ts
-var WRAP_TAGS = {
-  bold: "strong",
-  italic: "em",
-  underline: "u",
-  strikethrough: "s"
-};
-var LIST_TAGS = {
-  insertOrderedList: "ol",
-  insertUnorderedList: "ul"
-};
-var BLOCK_TAGS = /* @__PURE__ */ new Set(["pre", "blockquote"]);
-var applyFormatToRange = ({
-  formatType,
-  value,
-  range,
-  editor
-}) => {
-  const wrapTag = WRAP_TAGS[formatType];
-  if (wrapTag) {
-    wrapSelection(range, wrapTag);
-    return;
-  }
-  const listTag = LIST_TAGS[formatType];
-  if (listTag) {
-    toggleList(range, listTag, editor);
-    return;
-  }
-  if (formatType === "createLink" && value) {
-    wrapSelectionWithLink(range, value);
-    return;
-  }
-  if (formatType === "insertImage" && value) {
-    insertImage(range, value);
-    return;
-  }
-  if (formatType === "formatBlock" && value && BLOCK_TAGS.has(value)) {
-    wrapSelection(range, value);
-  }
-};
-
-// src/components/form/RichTextEditor/RichTextEditor.hooks.ts
-var SANITIZE_CONFIG = {
-  ALLOWED_TAGS: [
-    "p",
-    "br",
-    "strong",
-    "em",
-    "u",
-    "s",
-    "a",
-    "img",
-    "ul",
-    "ol",
-    "li",
-    "blockquote",
-    "pre",
-    "code",
-    "h1",
-    "h2",
-    "h3",
-    "h4",
-    "h5",
-    "h6",
-    "span",
-    "div"
-  ],
-  ALLOWED_ATTR: ["href", "src", "alt", "target", "rel", "style", "class"],
-  ALLOW_DATA_ATTR: false,
-  KEEP_CONTENT: true
-};
-var textLengthOf = (html) => {
-  const probe = document.createElement("div");
-  probe.innerHTML = html;
-  return probe.textContent?.length || 0;
-};
-var useEditorContent = ({
-  editorRef,
-  value,
-  onChange,
-  maxLength
-}) => {
-  const [content, setContent] = useState(value ?? "");
-  const handleContentChange = useCallback(() => {
-    if (!editorRef.current) return;
-    const newContent = editorRef.current.innerHTML;
-    if (maxLength && (editorRef.current.textContent || "").length > maxLength) {
-      editorRef.current.innerHTML = content;
-      return;
-    }
-    setContent(newContent);
-    onChange?.(newContent);
-  }, [maxLength, onChange, content, editorRef]);
-  return { content, handleContentChange };
-};
-var useFocusState = ({ onFocus, onBlur }) => {
-  const [isFocused, setIsFocused] = useState(false);
-  const handleFocus = useCallback(() => {
-    setIsFocused(true);
-    onFocus?.();
-  }, [onFocus]);
-  const handleBlur = useCallback(() => {
-    setIsFocused(false);
-    onBlur?.();
-  }, [onBlur]);
-  return { isFocused, handleFocus, handleBlur };
-};
-var useRichTextEditor = ({
-  value,
-  onChange,
-  onFocus,
-  onBlur,
-  disabled,
-  readOnly,
-  maxLength
-}) => {
-  const editorRef = useRef(null);
-  const { content, handleContentChange } = useEditorContent({
-    editorRef,
-    value,
-    onChange,
-    maxLength
-  });
-  const { isFocused, handleFocus, handleBlur } = useFocusState({ onFocus, onBlur });
-  const applyFormat = useCallback(
-    (formatType, formatValue) => {
-      if (disabled || readOnly || !editorRef.current) return;
-      const selection = window.getSelection();
-      if (!selection || selection.rangeCount === 0) {
-        editorRef.current.focus();
-        return;
-      }
-      applyFormatToRange({
-        formatType,
-        value: formatValue,
-        range: selection.getRangeAt(0),
-        editor: editorRef.current
-      });
-      handleContentChange();
-      editorRef.current.focus();
-    },
-    [disabled, readOnly, handleContentChange]
-  );
-  const sanitizedContent = DOMPurify.sanitize(content, SANITIZE_CONFIG);
-  useEffect(() => {
-    if (editorRef.current && editorRef.current.innerHTML !== sanitizedContent) {
-      editorRef.current.innerHTML = sanitizedContent;
-    }
-  }, [sanitizedContent]);
-  return {
-    editorRef,
-    isFocused,
-    characterCount: textLengthOf(sanitizedContent),
-    handleContentChange,
-    handleFocus,
-    handleBlur,
-    applyFormat
-  };
-};
-
-// src/components/form/RichTextEditor/RichTextEditorToolbar.tsx
-import Code from "@mui/icons-material/Code";
-import FormatBold from "@mui/icons-material/FormatBold";
-import FormatItalic from "@mui/icons-material/FormatItalic";
-import FormatListBulleted from "@mui/icons-material/FormatListBulleted";
-import FormatListNumbered from "@mui/icons-material/FormatListNumbered";
-import FormatQuote from "@mui/icons-material/FormatQuote";
-import FormatStrikethrough from "@mui/icons-material/FormatStrikethrough";
-import FormatUnderlined from "@mui/icons-material/FormatUnderlined";
-import Image from "@mui/icons-material/Image";
-import Link from "@mui/icons-material/Link";
-import { alpha, Box, Divider, IconButton, Toolbar, Tooltip, Typography } from "@mui/material";
-import React from "react";
-import { Fragment, jsx, jsxs } from "react/jsx-runtime";
-var GROUPS = [
-  [
-    { key: "bold", icon: /* @__PURE__ */ jsx(FormatBold, {}), tooltip: "Bold", command: "bold" },
-    { key: "italic", icon: /* @__PURE__ */ jsx(FormatItalic, {}), tooltip: "Italic", command: "italic" },
-    { key: "underline", icon: /* @__PURE__ */ jsx(FormatUnderlined, {}), tooltip: "Underline", command: "underline" },
-    {
-      key: "strikethrough",
-      icon: /* @__PURE__ */ jsx(FormatStrikethrough, {}),
-      tooltip: "Strikethrough",
-      command: "strikethrough"
-    }
-  ],
-  [
-    {
-      key: "orderedList",
-      icon: /* @__PURE__ */ jsx(FormatListNumbered, {}),
-      tooltip: "Numbered List",
-      command: "insertOrderedList"
-    },
-    {
-      key: "unorderedList",
-      icon: /* @__PURE__ */ jsx(FormatListBulleted, {}),
-      tooltip: "Bulleted List",
-      command: "insertUnorderedList"
-    }
-  ],
-  [
-    { key: "link", icon: /* @__PURE__ */ jsx(Link, {}), tooltip: "Insert Link", command: "createLink" },
-    { key: "image", icon: /* @__PURE__ */ jsx(Image, {}), tooltip: "Insert Image", command: "insertImage" },
-    {
-      key: "codeBlock",
-      icon: /* @__PURE__ */ jsx(Code, {}),
-      tooltip: "Code Block",
-      command: "formatBlock",
-      commandValue: "pre"
-    },
-    {
-      key: "quote",
-      icon: /* @__PURE__ */ jsx(FormatQuote, {}),
-      tooltip: "Quote",
-      command: "formatBlock",
-      commandValue: "blockquote"
-    }
-  ]
-];
-var PROMPTS = {
-  createLink: { message: "Enter URL:", initial: "https://" },
-  insertImage: { message: "Enter image URL:" }
-};
-var Separator = () => /* @__PURE__ */ jsx(Divider, { orientation: "vertical", flexItem: true, sx: { mx: 0.5 } });
-var ToolbarGroups = ({ config, disabled, readOnly, onRun }) => {
-  const groupIsActive = (group) => group.some((item) => config[item.key]);
-  return /* @__PURE__ */ jsx(Fragment, { children: GROUPS.map((group, groupIndex) => /* @__PURE__ */ jsxs(React.Fragment, { children: [
-    groupIsActive(group) && GROUPS.slice(0, groupIndex).some(groupIsActive) && /* @__PURE__ */ jsx(Separator, {}),
-    group.filter((item) => config[item.key]).map((item) => /* @__PURE__ */ jsx(Tooltip, { title: item.tooltip, children: /* @__PURE__ */ jsx(
-      IconButton,
-      {
-        size: "small",
-        onClick: () => onRun(item.command, item.commandValue),
-        disabled: disabled || readOnly,
-        "aria-label": item.tooltip,
-        "data-testid": `toolbar-${item.key}`,
-        children: item.icon
-      }
-    ) }, item.key))
-  ] }, group[0]?.key ?? groupIndex)) });
-};
-var RichTextEditorToolbar = ({
-  config,
-  disabled,
-  readOnly,
-  maxLength,
-  characterCount,
-  editorRef,
-  onFormat
-}) => {
-  const run = (command, commandValue) => {
-    const prompt = PROMPTS[command];
-    if (!prompt) {
-      onFormat(command, commandValue);
-      return;
-    }
-    const answer = window.prompt(prompt.message, prompt.initial);
-    if (answer) onFormat(command, answer);
-  };
-  return /* @__PURE__ */ jsxs(
-    Toolbar,
-    {
-      variant: "dense",
-      "data-testid": "editor-toolbar",
-      sx: {
-        minHeight: 48,
-        px: 1,
-        borderBottom: (theme) => `1px solid ${theme.palette.divider}`,
-        backgroundColor: (theme) => alpha(theme.palette.background.paper, 0.8)
-      },
-      children: [
-        /* @__PURE__ */ jsx(ToolbarGroups, { config, disabled, readOnly, onRun: run }),
-        config.customItems && config.customItems.length > 0 && /* @__PURE__ */ jsxs(Fragment, { children: [
-          /* @__PURE__ */ jsx(Separator, {}),
-          config.customItems.map((item) => /* @__PURE__ */ jsx(Tooltip, { title: item.label, children: /* @__PURE__ */ jsx(
-            IconButton,
-            {
-              size: "small",
-              onClick: () => item.action(editorRef.current),
-              disabled: item.disabled || disabled || readOnly,
-              "aria-label": item.label,
-              "data-testid": `toolbar-custom-${item.id}`,
-              children: item.icon
-            }
-          ) }, item.id))
-        ] }),
-        /* @__PURE__ */ jsx(Box, { sx: { flexGrow: 1 } }),
-        maxLength && /* @__PURE__ */ jsxs(
-          Typography,
-          {
-            variant: "caption",
-            color: characterCount > maxLength * 0.8 ? "error" : "text.secondary",
-            sx: { mr: 1 },
-            "data-testid": "editor-counter",
-            children: [
-              characterCount,
-              "/",
-              maxLength
-            ]
-          }
-        )
-      ]
-    }
-  );
-};
-
-// src/components/form/RichTextEditor/RichTextEditor.tsx
-import { jsx as jsx2, jsxs as jsxs2 } from "react/jsx-runtime";
-var DEFAULT_TOOLBAR = {
-  bold: true,
-  italic: true,
-  underline: true,
-  strikethrough: false,
-  orderedList: true,
-  unorderedList: true,
-  link: true,
-  image: false,
-  codeBlock: false,
-  quote: false,
-  customItems: []
-};
-var RICH_TEXT_DEFAULTS = {
-  value: "",
-  placeholder: "Start typing...",
-  disabled: false,
-  readOnly: false,
-  toolbar: {},
-  height: 300
-};
-var definedProps = (props) => Object.fromEntries(
-  Object.entries(props).filter(([, v]) => v !== void 0)
-);
-var editorContentSx = (theme, disabled, placeholder, height) => ({
-  minHeight: typeof height === "number" ? `${height}px` : height,
-  p: 2,
-  outline: "none",
-  cursor: disabled ? "not-allowed" : "text",
-  "&:empty::before": {
-    content: `"${placeholder}"`,
-    color: theme.palette.text.disabled,
-    pointerEvents: "none"
-  },
-  "& p": {
-    margin: "8px 0",
-    "&:first-of-type": { marginTop: 0 },
-    "&:last-of-type": { marginBottom: 0 }
-  },
-  "& ul, & ol": { marginLeft: theme.spacing(2) },
-  "& blockquote": {
-    borderLeft: `4px solid ${theme.palette.primary.main}`,
-    paddingLeft: theme.spacing(2),
-    margin: `${theme.spacing(1)} 0`,
-    fontStyle: "italic",
-    backgroundColor: alpha2(theme.palette.primary.main, 0.05)
-  },
-  "& pre": {
-    backgroundColor: alpha2(theme.palette.text.primary, 0.08),
-    padding: theme.spacing(1),
-    borderRadius: 1,
-    fontFamily: 'Monaco, Menlo, "Ubuntu Mono", monospace',
-    fontSize: "0.875rem",
-    overflow: "auto"
-  },
-  "& a": { color: theme.palette.primary.main, textDecoration: "underline" }
-});
-var shellSx = (theme, isFocused, disabled) => ({
-  border: `1px solid ${alpha2(theme.palette.divider, 0.12)}`,
-  borderRadius: 1,
-  overflow: "hidden",
-  transition: "border-color 0.2s ease-in-out",
-  ...isFocused && {
-    borderColor: theme.palette.primary.main,
-    boxShadow: `0 0 0 2px ${alpha2(theme.palette.primary.main, 0.2)}`
-  },
-  ...disabled && {
-    backgroundColor: theme.palette.action.disabledBackground,
-    color: theme.palette.text.disabled
-  }
-});
-var RichTextEditor = forwardRef(
-  (editorProps, ref) => {
-    const {
-      value,
-      onChange,
-      placeholder,
-      disabled,
-      readOnly,
-      toolbar,
-      height,
-      maxLength,
-      onFocus,
-      onBlur,
-      className,
-      "data-testid": testId,
-      "aria-label": ariaLabel,
-      "aria-describedby": ariaDescribedBy,
-      ...props
-    } = { ...RICH_TEXT_DEFAULTS, ...definedProps(editorProps) };
-    const theme = useTheme();
-    const toolbarConfig = { ...DEFAULT_TOOLBAR, ...toolbar };
-    const editor = useRichTextEditor({
-      value,
-      onChange,
-      onFocus,
-      onBlur,
-      disabled,
-      readOnly,
-      maxLength
-    });
-    return /* @__PURE__ */ jsxs2(
-      Paper,
-      {
-        ref,
-        className,
-        "data-testid": testId || "rich-text-editor",
-        elevation: 1,
-        sx: shellSx(theme, editor.isFocused, Boolean(disabled)),
-        ...props,
-        children: [
-          /* @__PURE__ */ jsx2(
-            RichTextEditorToolbar,
-            {
-              config: toolbarConfig,
-              disabled: Boolean(disabled),
-              readOnly: Boolean(readOnly),
-              maxLength,
-              characterCount: editor.characterCount,
-              editorRef: editor.editorRef,
-              onFormat: editor.applyFormat
-            }
-          ),
-          /* @__PURE__ */ jsx2(
-            Box2,
-            {
-              ref: editor.editorRef,
-              contentEditable: !disabled && !readOnly,
-              onInput: editor.handleContentChange,
-              onFocus: editor.handleFocus,
-              onBlur: editor.handleBlur,
-              role: "textbox",
-              "aria-label": ariaLabel || "Rich text editor",
-              "aria-describedby": ariaDescribedBy,
-              "aria-multiline": "true",
-              tabIndex: disabled ? -1 : 0,
-              "data-testid": "editor-content",
-              suppressContentEditableWarning: true,
-              sx: editorContentSx(theme, Boolean(disabled), placeholder, height)
-            }
-          )
-        ]
-      }
-    );
-  }
-);
-RichTextEditor.displayName = "RichTextEditor";
+  RichTextEditor
+} from "../chunk-TJT4KVMD.js";
+import "../chunk-DU4ZMVNY.js";
+import "../chunk-774B27QA.js";
+import "../chunk-UZOG6HNN.js";
+import "../chunk-33LAPBYB.js";
+import "../chunk-PZ5AY32C.js";
 export {
   RichTextEditor,
   RichTextEditor as default

package/dist/form/RichTextEditor.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../src/components/form/RichTextEditor/RichTextEditor.tsx","../../src/components/form/RichTextEditor/RichTextEditor.hooks.ts","../../src/components/form/RichTextEditor/RichTextEditor.dom.ts","../../src/components/form/RichTextEditor/RichTextEditor.format.ts","../../src/components/form/RichTextEditor/RichTextEditorToolbar.tsx"],"sourcesContent":["import {\n  alpha,\n  Box,\n  Paper,\n  useTheme } from '@mui/material';\nimport React, { forwardRef } from 'react';\n\nimport type { Theme } from '@mui/material';\nimport { useRichTextEditor } from './RichTextEditor.hooks';\nimport type { RichTextEditorProps, ToolbarConfig } from './RichTextEditor.types';\nimport { RichTextEditorToolbar } from './RichTextEditorToolbar';\n\nconst DEFAULT_TOOLBAR: Required<Omit<ToolbarConfig, 'customItems'>> & Pick<ToolbarConfig, 'customItems'> = {\n  bold: true,\n  italic: true,\n  underline: true,\n  strikethrough: false,\n  orderedList: true,\n  unorderedList: true,\n  link: true,\n  image: false,\n  codeBlock: false,\n  quote: false,\n  customItems: [] };\n\nconst RICH_TEXT_DEFAULTS: Partial<RichTextEditorProps> = {\n  value: '',\n  placeholder: 'Start typing...',\n  disabled: false,\n  readOnly: false,\n  toolbar: {},\n  height: 300 };\n\n// Strips explicitly-undefined props before the merge, so `prop={undefined}`\n// still falls back to the default as a destructuring default would.\nconst definedProps = (props: RichTextEditorProps): Partial<RichTextEditorProps> =>\n  Object.fromEntries(\n    Object.entries(props).filter(([, v]) => v !== undefined),\n  ) as Partial<RichTextEditorProps>;\n\n// Simple inline formats are a tag swap; lists and the value-carrying formats\n// need their own handling. This was one nine-case switch.\nconst editorContentSx = (theme: Theme, disabled: boolean, placeholder?: string, height?: string | number) => ({\n  minHeight: typeof height === 'number' ? `${height}px` : height,\n  p: 2,\n  outline: 'none',\n  cursor: disabled ? 'not-allowed' : 'text',\n  '&:empty::before': {\n    content: `\"${placeholder}\"`,\n    color: theme.palette.text.disabled,\n    pointerEvents: 'none' },\n  '& p': {\n    margin: '8px 0',\n    '&:first-of-type': { marginTop: 0 },\n    '&:last-of-type': { marginBottom: 0 } },\n  '& ul, & ol': { marginLeft: theme.spacing(2) },\n  '& blockquote': {\n    borderLeft: `4px solid ${theme.palette.primary.main}`,\n    paddingLeft: theme.spacing(2),\n    margin: `${theme.spacing(1)} 0`,\n    fontStyle: 'italic',\n    backgroundColor: alpha(theme.palette.primary.main, 0.05) },\n  '& pre': {\n    backgroundColor: alpha(theme.palette.text.primary, 0.08),\n    padding: theme.spacing(1),\n    borderRadius: 1,\n    fontFamily: 'Monaco, Menlo, \"Ubuntu Mono\", monospace',\n    fontSize: '0.875rem',\n    overflow: 'auto' },\n  '& a': { color: theme.palette.primary.main, textDecoration: 'underline' } });\n\nconst shellSx = (theme: Theme, isFocused: boolean, disabled: boolean) => ({\n  border: `1px solid ${alpha(theme.palette.divider, 0.12)}`,\n  borderRadius: 1,\n  overflow: 'hidden',\n  transition: 'border-color 0.2s ease-in-out',\n  ...(isFocused && {\n    borderColor: theme.palette.primary.main,\n    boxShadow: `0 0 0 2px ${alpha(theme.palette.primary.main, 0.2)}` }),\n  ...(disabled && {\n    backgroundColor: theme.palette.action.disabledBackground,\n    color: theme.palette.text.disabled }) });\n\nexport const RichTextEditor = forwardRef<HTMLDivElement, RichTextEditorProps>(\n  (editorProps, ref) => {\n    const {\n      value,\n      onChange,\n      placeholder,\n      disabled,\n      readOnly,\n      toolbar,\n      height,\n      maxLength,\n      onFocus,\n      onBlur,\n      className,\n      'data-testid': testId,\n      'aria-label': ariaLabel,\n      'aria-describedby': ariaDescribedBy,\n      ...props\n    } = { ...RICH_TEXT_DEFAULTS, ...definedProps(editorProps) } as RichTextEditorProps;\n\n    const theme = useTheme();\n    const toolbarConfig = { ...DEFAULT_TOOLBAR, ...toolbar };\n    const editor = useRichTextEditor({\n      value,\n      onChange,\n      onFocus,\n      onBlur,\n      disabled,\n      readOnly,\n      maxLength });\n\n    return (\n      <Paper\n        ref={ref}\n        className={className}\n        data-testid={testId || 'rich-text-editor'}\n        elevation={1}\n        sx={shellSx(theme, editor.isFocused, Boolean(disabled))}\n        {...props}\n      >\n        <RichTextEditorToolbar\n          config={toolbarConfig}\n          disabled={Boolean(disabled)}\n          readOnly={Boolean(readOnly)}\n          maxLength={maxLength}\n          characterCount={editor.characterCount}\n          editorRef={editor.editorRef}\n          onFormat={editor.applyFormat}\n        />\n\n        <Box\n          ref={editor.editorRef}\n          contentEditable={!disabled && !readOnly}\n          onInput={editor.handleContentChange}\n          onFocus={editor.handleFocus}\n          onBlur={editor.handleBlur}\n          role=\"textbox\"\n          aria-label={ariaLabel || 'Rich text editor'}\n          aria-describedby={ariaDescribedBy}\n          aria-multiline=\"true\"\n          tabIndex={disabled ? -1 : 0}\n          data-testid=\"editor-content\"\n          suppressContentEditableWarning\n          sx={editorContentSx(theme, Boolean(disabled), placeholder, height)}\n        />\n      </Paper>\n    );\n  },\n);\n\nRichTextEditor.displayName = 'RichTextEditor';\n\nexport default RichTextEditor;","import DOMPurify from 'dompurify';\nimport type React from 'react';\nimport { useCallback, useEffect, useRef, useState } from 'react';\n\nimport { applyFormatToRange } from './RichTextEditor.format';\n\n// Deliberately narrow: anything not listed is stripped, and no data-* attributes\n// survive, so pasted markup cannot smuggle in behaviour.\nconst SANITIZE_CONFIG = {\n  ALLOWED_TAGS: [\n    'p', 'br', 'strong', 'em', 'u', 's', 'a', 'img', 'ul', 'ol', 'li',\n    'blockquote', 'pre', 'code', 'h1', 'h2', 'h3', 'h4', 'h5', 'h6', 'span', 'div',\n  ],\n  ALLOWED_ATTR: ['href', 'src', 'alt', 'target', 'rel', 'style', 'class'],\n  ALLOW_DATA_ATTR: false,\n  KEEP_CONTENT: true,\n};\n\nconst textLengthOf = (html: string): number => {\n  const probe = document.createElement('div');\n  probe.innerHTML = html;\n  return probe.textContent?.length || 0;\n};\n\n// The editable content and the limit that guards it.\nconst useEditorContent = ({\n  editorRef,\n  value,\n  onChange,\n  maxLength,\n}: {\n  editorRef: React.RefObject<HTMLDivElement | null>;\n  value?: string;\n  onChange?: (value: string) => void;\n  maxLength?: number;\n}) => {\n  const [content, setContent] = useState(value ?? '');\n\n  const handleContentChange = useCallback(() => {\n    if (!editorRef.current) return;\n\n    const newContent = editorRef.current.innerHTML;\n\n    // Over the limit, put the last accepted content back rather than truncating\n    // mid-markup.\n    if (maxLength && (editorRef.current.textContent || '').length > maxLength) {\n      editorRef.current.innerHTML = content;\n      return;\n    }\n\n    setContent(newContent);\n    onChange?.(newContent);\n  }, [maxLength, onChange, content, editorRef]);\n\n  return { content, handleContentChange };\n};\n\nconst useFocusState = ({ onFocus, onBlur }: { onFocus?: () => void; onBlur?: () => void }) => {\n  const [isFocused, setIsFocused] = useState(false);\n\n  const handleFocus = useCallback(() => {\n    setIsFocused(true);\n    onFocus?.();\n  }, [onFocus]);\n\n  const handleBlur = useCallback(() => {\n    setIsFocused(false);\n    onBlur?.();\n  }, [onBlur]);\n\n  return { isFocused, handleFocus, handleBlur };\n};\n\nexport const useRichTextEditor = ({\n  value,\n  onChange,\n  onFocus,\n  onBlur,\n  disabled,\n  readOnly,\n  maxLength,\n}: {\n  value?: string;\n  onChange?: (value: string) => void;\n  onFocus?: () => void;\n  onBlur?: () => void;\n  disabled?: boolean;\n  readOnly?: boolean;\n  maxLength?: number;\n}) => {\n  const editorRef = useRef<HTMLDivElement>(null);\n  const { content, handleContentChange } = useEditorContent({\n    editorRef,\n    value,\n    onChange,\n    maxLength,\n  });\n  const { isFocused, handleFocus, handleBlur } = useFocusState({ onFocus, onBlur });\n\n  const applyFormat = useCallback(\n    (formatType: string, formatValue?: string) => {\n      if (disabled || readOnly || !editorRef.current) return;\n\n      const selection = window.getSelection();\n      // Nothing selected: give the editor focus so the next keystroke lands.\n      if (!selection || selection.rangeCount === 0) {\n        editorRef.current.focus();\n        return;\n      }\n\n      applyFormatToRange({\n        formatType,\n        value: formatValue,\n        range: selection.getRangeAt(0),\n        editor: editorRef.current,\n      });\n\n      handleContentChange();\n      editorRef.current.focus();\n    },\n    [disabled, readOnly, handleContentChange],\n  );\n\n  const sanitizedContent = DOMPurify.sanitize(content, SANITIZE_CONFIG);\n\n  // Reflect the sanitized result back when it differs from what is on screen.\n  useEffect(() => {\n    if (editorRef.current && editorRef.current.innerHTML !== sanitizedContent) {\n      editorRef.current.innerHTML = sanitizedContent;\n    }\n  }, [sanitizedContent]);\n\n  return {\n    editorRef,\n    isFocused,\n    characterCount: textLengthOf(sanitizedContent),\n    handleContentChange,\n    handleFocus,\n    handleBlur,\n    applyFormat,\n  };\n};\n","// Selection surgery for the editor. Each of these mutates the DOM around a\n// Range and then rebuilds the selection, so the caret ends up where the user\n// expects rather than at the start of the document.\n\nexport const wrapSelection = (range: globalThis.Range, tagName: string) => {\n  const selectedText = range.toString();\n  if (!selectedText) return;\n  \n  const wrapper = document.createElement(tagName);\n  wrapper.appendChild(document.createTextNode(selectedText));\n  \n  range.deleteContents();\n  range.insertNode(wrapper);\n  \n  // Move cursor after inserted element\n  const newRange = document.createRange();\n  newRange.setStartAfter(wrapper);\n  newRange.collapse(true);\n  \n  const selection = window.getSelection();\n  selection?.removeAllRanges();\n  selection?.addRange(newRange);\n};\n\nexport const wrapSelectionWithLink = (range: globalThis.Range, url: string) => {\n  const selectedText = range.toString();\n  if (!selectedText) return;\n  \n  const link = document.createElement('a');\n  link.href = url.startsWith('http') ? url : `https://${url}`;\n  link.target = '_blank';\n  link.rel = 'noopener noreferrer';\n  link.appendChild(document.createTextNode(selectedText));\n  \n  range.deleteContents();\n  range.insertNode(link);\n  \n  // Move cursor after inserted element\n  const newRange = document.createRange();\n  newRange.setStartAfter(link);\n  newRange.collapse(true);\n  \n  const selection = window.getSelection();\n  selection?.removeAllRanges();\n  selection?.addRange(newRange);\n};\n\nexport const insertImage = (range: globalThis.Range, src: string) => {\n  const img = document.createElement('img');\n  img.src = src;\n  img.style.maxWidth = '100%';\n  img.style.height = 'auto';\n  \n  range.deleteContents();\n  range.insertNode(img);\n  \n  // Move cursor after inserted element\n  const newRange = document.createRange();\n  newRange.setStartAfter(img);\n  newRange.collapse(true);\n  \n  const selection = window.getSelection();\n  selection?.removeAllRanges();\n  selection?.addRange(newRange);\n};\n\n// Resolves to the nearest element, since a collapsed selection reports its text\n// node as the common ancestor.\nconst blockElementFor = (range: globalThis.Range): globalThis.Element | null => {\n  const node = range.commonAncestorContainer;\n\n  return node.nodeType === globalThis.Node.TEXT_NODE\n    ? node.parentElement\n    : (node as globalThis.Element);\n};\n\n// Unwraps the item back to plain text, keeping its content.\nconst removeFromList = (block: globalThis.Element) => {\n  const listItem = block.closest('li');\n  if (!listItem?.parentElement) return;\n\n  listItem.parentElement.replaceChild(\n    document.createTextNode(listItem.textContent || ''),\n    listItem,\n  );\n};\n\nconst wrapInList = (range: globalThis.Range, listType: 'ol' | 'ul') => {\n  const list = document.createElement(listType);\n  const listItem = document.createElement('li');\n\n  listItem.appendChild(document.createTextNode(range.toString() || 'List item'));\n  list.appendChild(listItem);\n\n  range.deleteContents();\n  range.insertNode(list);\n\n  // Move cursor inside list item\n  const newRange = document.createRange();\n  newRange.selectNodeContents(listItem);\n  newRange.collapse(false);\n\n  const selection = window.getSelection();\n  selection?.removeAllRanges();\n  selection?.addRange(newRange);\n};\n\nexport const toggleList = (\n  range: globalThis.Range,\n  listType: 'ol' | 'ul',\n  editor: HTMLElement | null,\n) => {\n  if (!editor) return;\n\n  const block = blockElementFor(range);\n  if (!block) return;\n\n  if (block.closest(listType)) {\n    removeFromList(block);\n    return;\n  }\n\n  wrapInList(range, listType);\n};\n","import {\n  insertImage,\n  toggleList,\n  wrapSelection,\n  wrapSelectionWithLink,\n} from './RichTextEditor.dom';\n\nconst WRAP_TAGS: Record<string, string> = {\n  bold: 'strong',\n  italic: 'em',\n  underline: 'u',\n  strikethrough: 's',\n};\n\nconst LIST_TAGS: Record<string, 'ol' | 'ul'> = {\n  insertOrderedList: 'ol',\n  insertUnorderedList: 'ul',\n};\n\n// formatBlock is the only format whose value names the tag, and only these two\n// are accepted.\nconst BLOCK_TAGS = new Set(['pre', 'blockquote']);\n\nexport const applyFormatToRange = ({\n  formatType,\n  value,\n  range,\n  editor,\n}: {\n  formatType: string;\n  value?: string;\n  range: globalThis.Range;\n  editor: HTMLElement | null;\n}) => {\n  const wrapTag = WRAP_TAGS[formatType];\n  if (wrapTag) {\n    wrapSelection(range, wrapTag);\n    return;\n  }\n\n  const listTag = LIST_TAGS[formatType];\n  if (listTag) {\n    toggleList(range, listTag, editor);\n    return;\n  }\n\n  if (formatType === 'createLink' && value) {\n    wrapSelectionWithLink(range, value);\n    return;\n  }\n\n  if (formatType === 'insertImage' && value) {\n    insertImage(range, value);\n    return;\n  }\n\n  if (formatType === 'formatBlock' && value && BLOCK_TAGS.has(value)) {\n    wrapSelection(range, value);\n  }\n};\n\n","import Code from '@mui/icons-material/Code';\nimport FormatBold from '@mui/icons-material/FormatBold';\nimport FormatItalic from '@mui/icons-material/FormatItalic';\nimport FormatListBulleted from '@mui/icons-material/FormatListBulleted';\nimport FormatListNumbered from '@mui/icons-material/FormatListNumbered';\nimport FormatQuote from '@mui/icons-material/FormatQuote';\nimport FormatStrikethrough from '@mui/icons-material/FormatStrikethrough';\nimport FormatUnderlined from '@mui/icons-material/FormatUnderlined';\nimport Image from '@mui/icons-material/Image';\nimport Link from '@mui/icons-material/Link';\nimport { alpha, Box, Divider, IconButton, Toolbar, Tooltip, Typography } from '@mui/material';\nimport type { FC, ReactElement } from 'react';\nimport React from 'react';\n\nimport type { ToolbarConfig } from './RichTextEditor.types';\n\ntype ResolvedToolbar = Required<Omit<ToolbarConfig, 'customItems'>> &\n  Pick<ToolbarConfig, 'customItems'>;\n\n// The button groups, in render order. A separator is drawn between two groups\n// only when both actually have something switched on.\nconst GROUPS: Array<Array<{ key: keyof ResolvedToolbar; icon: ReactElement; tooltip: string; command: string; commandValue?: string }>> = [\n  [\n    { key: 'bold', icon: <FormatBold />, tooltip: 'Bold', command: 'bold' },\n    { key: 'italic', icon: <FormatItalic />, tooltip: 'Italic', command: 'italic' },\n    { key: 'underline', icon: <FormatUnderlined />, tooltip: 'Underline', command: 'underline' },\n    {\n      key: 'strikethrough',\n      icon: <FormatStrikethrough />,\n      tooltip: 'Strikethrough',\n      command: 'strikethrough',\n    },\n  ],\n  [\n    {\n      key: 'orderedList',\n      icon: <FormatListNumbered />,\n      tooltip: 'Numbered List',\n      command: 'insertOrderedList',\n    },\n    {\n      key: 'unorderedList',\n      icon: <FormatListBulleted />,\n      tooltip: 'Bulleted List',\n      command: 'insertUnorderedList',\n    },\n  ],\n  [\n    { key: 'link', icon: <Link />, tooltip: 'Insert Link', command: 'createLink' },\n    { key: 'image', icon: <Image />, tooltip: 'Insert Image', command: 'insertImage' },\n    {\n      key: 'codeBlock',\n      icon: <Code />,\n      tooltip: 'Code Block',\n      command: 'formatBlock',\n      commandValue: 'pre',\n    },\n    {\n      key: 'quote',\n      icon: <FormatQuote />,\n      tooltip: 'Quote',\n      command: 'formatBlock',\n      commandValue: 'blockquote',\n    },\n  ],\n];\n\n// Link and image need a target before they can run.\nconst PROMPTS: Record<string, { message: string; initial?: string }> = {\n  createLink: { message: 'Enter URL:', initial: 'https://' },\n  insertImage: { message: 'Enter image URL:' },\n};\n\nconst Separator: FC = () => <Divider orientation=\"vertical\" flexItem sx={{ mx: 0.5 }} />;\n\nexport interface RichTextEditorToolbarProps {\n  config: ResolvedToolbar;\n  disabled: boolean;\n  readOnly: boolean;\n  maxLength?: number;\n  characterCount: number;\n  editorRef: React.RefObject<HTMLDivElement | null>;\n  onFormat: (command: string, value?: string) => void;\n}\n\nconst ToolbarGroups: FC<{\n  config: ResolvedToolbar;\n  disabled: boolean;\n  readOnly: boolean;\n  onRun: (command: string, commandValue?: string) => void;\n}> = ({ config, disabled, readOnly, onRun }) => {\n  const groupIsActive = (group: (typeof GROUPS)[number]) => group.some((item) => config[item.key]);\n\n  return (\n    <>\n      {GROUPS.map((group, groupIndex) => (\n        <React.Fragment key={group[0]?.key ?? groupIndex}>\n          {groupIsActive(group) && GROUPS.slice(0, groupIndex).some(groupIsActive) && <Separator />}\n          {group\n            .filter((item) => config[item.key])\n            .map((item) => (\n              <Tooltip key={item.key} title={item.tooltip}>\n                <IconButton\n                  size=\"small\"\n                  onClick={() => onRun(item.command, item.commandValue)}\n                  disabled={disabled || readOnly}\n                  aria-label={item.tooltip}\n                  data-testid={`toolbar-${item.key}`}\n                >\n                  {item.icon}\n                </IconButton>\n              </Tooltip>\n            ))}\n        </React.Fragment>\n      ))}\n    </>\n  );\n};\n\nexport const RichTextEditorToolbar: FC<RichTextEditorToolbarProps> = ({\n  config,\n  disabled,\n  readOnly,\n  maxLength,\n  characterCount,\n  editorRef,\n  onFormat,\n}) => {\n  const run = (command: string, commandValue?: string) => {\n    const prompt = PROMPTS[command];\n    if (!prompt) {\n      onFormat(command, commandValue);\n      return;\n    }\n\n    const answer = window.prompt(prompt.message, prompt.initial);\n    if (answer) onFormat(command, answer);\n  };\n\n  return (\n    <Toolbar\n      variant=\"dense\"\n      data-testid=\"editor-toolbar\"\n      sx={{\n        minHeight: 48,\n        px: 1,\n        borderBottom: (theme) => `1px solid ${theme.palette.divider}`,\n        backgroundColor: (theme) => alpha(theme.palette.background.paper, 0.8),\n      }}\n    >\n      <ToolbarGroups config={config} disabled={disabled} readOnly={readOnly} onRun={run} />\n\n      {config.customItems && config.customItems.length > 0 && (\n        <>\n          <Separator />\n          {config.customItems.map((item) => (\n            <Tooltip key={item.id} title={item.label}>\n              <IconButton\n                size=\"small\"\n                onClick={() => item.action(editorRef.current)}\n                disabled={item.disabled || disabled || readOnly}\n                aria-label={item.label}\n                data-testid={`toolbar-custom-${item.id}`}\n              >\n                {item.icon}\n              </IconButton>\n            </Tooltip>\n          ))}\n        </>\n      )}\n\n      <Box sx={{ flexGrow: 1 }} />\n\n      {maxLength && (\n        <Typography\n          variant=\"caption\"\n          // Turns red in the last fifth of the allowance.\n          color={characterCount > maxLength * 0.8 ? 'error' : 'text.secondary'}\n          sx={{ mr: 1 }}\n          data-testid=\"editor-counter\"\n        >\n          {characterCount}/{maxLength}\n        </Typography>\n      )}\n    </Toolbar>\n  );\n};\n"],"mappings":"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","names":["alpha","Box","jsx","jsxs","alpha","Box"]}
+{"version":3,"sources":[],"sourcesContent":[],"mappings":"","names":[]}