@lax-wp/design-system 0.13.32 → 0.13.33-beta.0

package/dist/components/forms/md-input/RichMarkdownInput.es.js.map

@@ -1 +1 @@
-{"version":3,"file":"RichMarkdownInput.es.js","sources":["../../../../src/components/forms/md-input/RichMarkdownInput.tsx"],"sourcesContent":["import cn from \"classnames\";\nimport { forwardRef, useRef, useState } from \"react\";\nimport {\n\tFormatBold,\n\tFormatItalic,\n\tFormatUnderlined,\n\tFormatListBulleted,\n\tFormatListNumbered,\n\tOpenInFull,\n\tEdit,\n\tVisibilityOutlined,\n} from \"@mui/icons-material\";\nimport { Modal } from \"../../data-display/modal/Modal\";\nimport Button from \"../../button/Button\";\nimport { Tabs } from \"../../navigation/tabs/Tabs\";\nimport { MarkdownPreview } from \"./MarkdownPreview\";\nimport Tooltip from \"../../tooltip/Tooltip\";\nimport { AnimatePresence, motion } from \"framer-motion\";\nimport { Typography } from \"../../data-display/typography/Typography\";\nimport { InputLabel } from \"../shared/InputLabel\";\n\n/**\n * Props for the RichMarkdownInput component\n */\nexport interface RichMarkdownInputProps {\n\t/** Unique identifier for the markdown input */\n\tid?: string;\n\t/** Current markdown value */\n\tvalue?: string;\n\t/** Default value for the input */\n\tdefaultValue?: string;\n\t/** Placeholder text for the textarea */\n\tplaceholder?: string;\n\t/** Minimum number of visible text lines */\n\tminRows?: number;\n\t/** Maximum number of visible text lines */\n\tmaxRows?: number;\n\t/** Whether the input is disabled */\n\tisDisabled?: boolean;\n\t/** Additional CSS classes for the wrapper container */\n\tclassName?: string;\n\t/** Additional CSS classes for the textarea */\n\ttextareaClassName?: string;\n\t/** Additional CSS classes for the preview container */\n\tpreviewClassName?: string;\n\t/** Label text to display above the input */\n\tlabel?: string;\n\t/** Additional CSS classes for the label */\n\tlabelClassName?: string;\n\t/** Whether the field is required and the required indicator shows as conditional */\n\tisRequiredConditional?: boolean;\n\t/** Whether the field is required */\n\trequired?: boolean;\n\t/** Whether to show the preview button */\n\tshowPreviewOnModal?: boolean;\n\t/** Maximum character count */\n\tmaxLength?: number;\n\t/** Link target behavior: '_blank' for new tab, '_self' for current tab */\n\tlinkTarget?: '_blank' | '_self';\n\t/** Error message to display */\n\terrorMessage?: string;\n\t/** Tooltip text */\n\ttooltip?: string;\n\t/** Whether to preserve original case (no auto-lowercase) */\n\toriginalCase?: boolean;\n\t/** Icon to display at the end of the input */\n\tsuffixIcon?: React.ReactNode;\n\t/** Whether the input is clearable */\n\tisClearable?: boolean;\n\t/** Ref for the input element */\n\tinputref?: React.RefObject<HTMLTextAreaElement>;\n\t/** Whether to show the formatting help tooltip */\n\tshowFormattingHelp?: boolean;\n\t/** Keyboard event handler */\n\tonKeyDown?: (e: React.KeyboardEvent<HTMLTextAreaElement>) => void;\n\t/** Whether to remove indentation from lists and align all content to the left in preview */\n\tnoIndent?: boolean;\n\t/** Whether to display all content with uniform font size/weight (paragraph-like) while keeping formatting */\n\tshowMinimalPreview?: boolean;\n\t/** Whether to accept and render advanced content (code blocks, blockquotes, tables, images) in preview */\n\tacceptAdvanceContent?: boolean;\n\t/** Callback function called when the markdown value changes */\n\tonChange: (value: string) => void;\n}\n\n/**\n * The type of view for the rich markdown input\n */\ntype RichMarkdownInputViewType = \"edit\" | \"preview\";\n\n/**\n * The tabs for the rich markdown input\n */\nconst RichMarkdownInputTabs: RichMarkdownInputViewType[] = [\"edit\", \"preview\"];\n\n/**\n * Close icon for clearable input\n */\nconst CloseIcon = ({ className, size = 16 }: { className?: string; size?: number }) => (\n\t<svg\n\t\twidth={size}\n\t\theight={size}\n\t\tviewBox=\"0 0 24 24\"\n\t\tfill=\"none\"\n\t\tstroke=\"currentColor\"\n\t\tstrokeWidth=\"2\"\n\t\tstrokeLinecap=\"round\"\n\t\tstrokeLinejoin=\"round\"\n\t\tclassName={className}\n\t>\n\t\t<line x1=\"18\" y1=\"6\" x2=\"6\" y2=\"18\" />\n\t\t<line x1=\"6\" y1=\"6\" x2=\"18\" y2=\"18\" />\n\t</svg>\n);\n\n/**\n * A rich markdown input component with comprehensive formatting toolbar.\n * \n * **Text Formatting:**\n * - Bold (Ctrl+B) - Always visible\n * - Italic (Ctrl+I) - Always visible\n * - Underline (Ctrl+U) - Always visible\n * \n * **Lists:**\n * - Bullet lists - Always visible\n * - Numbered lists - Always visible\n * \n * **Features:**\n * - Edit/Preview toggle with icons\n * - Character counter (optional)\n * - Preview modal with scrolling\n * - Keyboard shortcuts\n * - Syntax highlighting for code blocks\n * - Responsive toolbar\n * - Dark mode support\n * - Configurable link target behavior\n * - Error message display\n * - Tooltip support\n * - Clear button (optional)\n * - Suffix icon support\n * - Custom keyboard handlers\n * - Minimal preview mode (uniform typography)\n * - Toggle advanced content in preview\n *\n * @example\n * ```tsx\n * <RichMarkdownInput\n *   value={markdown}\n *   onChange={setMarkdown}\n *   placeholder=\"Enter description...\"\n *   label=\"Description\"\n *   maxLength={300}\n *   linkTarget=\"_blank\"\n *   isClearable\n *   errorMessage=\"Invalid input\"\n *   tooltip=\"Use markdown formatting\"\n *   showMinimalPreview={false}\n *   acceptAdvanceContent={true}\n * />\n * ```\n */\nexport const RichMarkdownInput = forwardRef<\n\tHTMLTextAreaElement,\n\tRichMarkdownInputProps\n>(\n\t(\n\t\t{\n\t\t\tid,\n\t\t\tvalue = \"\",\n\t\t\tdefaultValue,\n\t\t\tonChange,\n\t\t\tplaceholder = \"Enter markdown content...\",\n\t\t\tminRows = 4,\n\t\t\tmaxRows = 20,\n\t\t\tisDisabled = false,\n\t\t\tclassName,\n\t\t\ttextareaClassName,\n\t\t\tpreviewClassName,\n\t\t\tlabel,\n\t\t\tlabelClassName,\n\t\t\tisRequiredConditional,\n\t\t\trequired = false,\n\t\t\tshowPreviewOnModal = false,\n\t\t\tmaxLength,\n\t\t\tlinkTarget = '_blank',\n\t\t\terrorMessage,\n\t\t\ttooltip,\n\t\t\toriginalCase,\n\t\t\tsuffixIcon,\n\t\t\tisClearable,\n\t\t\tinputref,\n\t\t\tshowFormattingHelp = true,\n\t\t\tonKeyDown,\n\t\t\tnoIndent = false,\n\t\t\tshowMinimalPreview = false,\n\t\t\tacceptAdvanceContent = true,\n\t\t},\n\t\tref\n\t) => {\n\t\tconst [mode, setMode] = useState<RichMarkdownInputViewType>(\"edit\");\n\t\tconst [isPreviewOpen, setIsPreviewOpen] = useState(false);\n\t\tconst textareaRef = useRef<HTMLTextAreaElement>(null);\n\t\tconst inputId = id || `rich-md-input-${Math.random().toString(36).slice(2, 11)}`;\n\n\t\tconst charCount = value.length;\n\n\t\t/**\n\t\t * Insert markdown syntax at cursor position\n\t\t */\n\t\tconst insertMarkdown = (before: string, after: string = \"\", placeholder: string = \"\") => {\n\t\t\tconst textarea = (ref as React.RefObject<HTMLTextAreaElement>)?.current || textareaRef.current;\n\t\t\tif (!textarea) return;\n\n\t\t\tconst start = textarea.selectionStart;\n\t\t\tconst end = textarea.selectionEnd;\n\t\t\tconst selectedText = value.substring(start, end);\n\t\t\tconst textToInsert = selectedText || placeholder;\n\n\t\t\tconst newValue = value.substring(0, start) + before + textToInsert + after + value.substring(end);\n\t\t\tonChange(newValue);\n\n\t\t\t// Set cursor position after insertion\n\t\t\tsetTimeout(() => {\n\t\t\t\tconst newCursorPos = start + before.length + (selectedText ? selectedText.length : 0);\n\t\t\t\ttextarea.focus();\n\t\t\t\ttextarea.setSelectionRange(newCursorPos, newCursorPos + (selectedText ? 0 : placeholder.length));\n\t\t\t}, 0);\n\t\t};\n\n\t\t/**\n\t\t * Insert list item at cursor position\n\t\t */\n\t\tconst insertList = (prefix: string) => {\n\t\t\tconst textarea = (ref as React.RefObject<HTMLTextAreaElement>)?.current || textareaRef.current;\n\t\t\tif (!textarea) return;\n\n\t\t\tconst start = textarea.selectionStart;\n\t\t\tconst end = textarea.selectionEnd;\n\t\t\tconst lines = value.split('\\n');\n\n\t\t\t// Find which line(s) are selected\n\t\t\tlet currentPos = 0;\n\t\t\tlet startLine = 0;\n\t\t\tlet endLine = 0;\n\n\t\t\tfor (let i = 0; i < lines.length; i++) {\n\t\t\t\tif (currentPos <= start && start <= currentPos + lines[i].length + 1) {\n\t\t\t\t\tstartLine = i;\n\t\t\t\t}\n\t\t\t\tif (currentPos <= end && end <= currentPos + lines[i].length + 1) {\n\t\t\t\t\tendLine = i;\n\t\t\t\t\tbreak;\n\t\t\t\t}\n\t\t\t\tcurrentPos += lines[i].length + 1;\n\t\t\t}\n\n\t\t\t// Add list markers to selected lines\n\t\t\tconst newLines = lines.map((line, index) => {\n\t\t\t\tif (index >= startLine && index <= endLine) {\n\t\t\t\t\tif (line.trim() === '') return line;\n\t\t\t\t\t// Check if line already has a list marker\n\t\t\t\t\tif (prefix === '- ' && line.trim().startsWith('- ')) {\n\t\t\t\t\t\treturn line.replace(/^\\s*-\\s+/, '');\n\t\t\t\t\t}\n\t\t\t\t\tif (prefix.match(/^\\d+\\.\\s/) && line.trim().match(/^\\d+\\.\\s/)) {\n\t\t\t\t\t\treturn line.replace(/^\\s*\\d+\\.\\s+/, '');\n\t\t\t\t\t}\n\t\t\t\t\treturn prefix + line.trim();\n\t\t\t\t}\n\t\t\t\treturn line;\n\t\t\t});\n\n\t\t\tonChange(newLines.join('\\n'));\n\n\t\t\tsetTimeout(() => {\n\t\t\t\ttextarea.focus();\n\t\t\t}, 0);\n\t\t};\n\n\t\t/**\n\t\t * Handle keyboard shortcuts\n\t\t */\n\t\tconst handleKeyDownInternal = (e: React.KeyboardEvent<HTMLTextAreaElement>) => {\n\t\t\t// Call external handler first\n\t\t\tonKeyDown?.(e);\n\n\t\t\tif (e.metaKey || e.ctrlKey) {\n\t\t\t\tswitch (e.key.toLowerCase()) {\n\t\t\t\t\tcase 'b':\n\t\t\t\t\t\te.preventDefault();\n\t\t\t\t\t\tinsertMarkdown('**', '**', 'bold text');\n\t\t\t\t\t\tbreak;\n\t\t\t\t\tcase 'i':\n\t\t\t\t\t\te.preventDefault();\n\t\t\t\t\t\tinsertMarkdown('*', '*', 'italic text');\n\t\t\t\t\t\tbreak;\n\t\t\t\t\tcase 'u':\n\t\t\t\t\t\te.preventDefault();\n\t\t\t\t\t\tinsertMarkdown('<u>', '</u>', 'underlined text');\n\t\t\t\t\t\tbreak;\n\t\t\t\t\tcase 'k':\n\t\t\t\t\t\te.preventDefault();\n\t\t\t\t\t\tinsertMarkdown('[', '](url)', 'link text');\n\t\t\t\t\t\tbreak;\n\t\t\t\t\tcase 'e':\n\t\t\t\t\t\te.preventDefault();\n\t\t\t\t\t\tinsertMarkdown('```', '```', 'code');\n\t\t\t\t\t\tbreak;\n\t\t\t\t}\n\t\t\t}\n\t\t};\n\n\t\t/**\n\t\t * Handle clear button click\n\t\t */\n\t\tconst handleClear = () => {\n\t\t\tonChange('');\n\t\t\tconst textarea = (ref as React.RefObject<HTMLTextAreaElement>)?.current || textareaRef.current;\n\t\t\ttextarea?.focus();\n\t\t};\n\n\t\t/**\n\t\t * Calculate dynamic rows based on content\n\t\t */\n\t\tconst calculateRows = () => {\n\t\t\tconst lineCount = (value.match(/\\n/g) || []).length + 1;\n\t\t\treturn Math.min(maxRows, Math.max(minRows, lineCount));\n\t\t};\n\n\t\tconst rows = calculateRows();\n\n\t\tconst content = (\n\t\t\t<div className={cn(\"flex flex-col\", className)}>\n\t\t\t\t<div className={`flex flex-row items-center ${label ? \"justify-between\" : \"justify-end\"} w-full`}>\n\t\t\t\t\t{/* Label */}\n\t\t\t\t\t{label && (\n\t\t\t\t\t\t<label\n\t\t\t\t\t\t\tid={inputId}\n\t\t\t\t\t\t\thtmlFor={inputId}\n\t\t\t\t\t\t\tclassName={`mb-1 text-xs font-medium text-gray-600 inline-flex items-center gap-1 ${!originalCase ? \"capitalize\" : \"\"\n\t\t\t\t\t\t\t\t} ${labelClassName || \"!uppercse\"}`}\n\t\t\t\t\t\t>\n\t\t\t\t\t\t\t<div className=\"flex flex-wrap items-center justify-between w-full\">\n\t\t\t\t\t\t\t\t<div className=\"inline-flex flex-wrap items-center gap-1\">\n\t\t\t\t\t\t\t\t\t<InputLabel label={label || \"\"} required={required || false} isRequiredConditional={isRequiredConditional || false} />\n\t\t\t\t\t\t\t\t</div>\n\t\t\t\t\t\t\t</div>\n\t\t\t\t\t\t</label>\n\t\t\t\t\t)}\n\n\t\t\t\t\t{/* Markdown Formatting Info */}\n\t\t\t\t\t{showFormattingHelp && (\n\t\t\t\t\t\t<Tooltip\n\t\t\t\t\t\t\tplacement=\"bottom-end\"\n\t\t\t\t\t\t\ttitle={\n\t\t\t\t\t\t\t\t<div className=\"flex flex-col items-start justify-center py-2 px-3 min-w-[220px] gap-2 bg-neutral-900 rounded-lg\">\n\t\t\t\t\t\t\t\t\t<div className=\"flex flex-col items-start justify-start gap-1 w-full\">\n\t\t\t\t\t\t\t\t\t\t<div className=\"flex flex-row items-start gap-1 ml-1\">\n\t\t\t\t\t\t\t\t\t\t\t<span className=\"text-white text-[18px] leading-[18px]\">•</span>\n\t\t\t\t\t\t\t\t\t\t\t<div className=\"flex flex-row justify-center items-center px-[3px] bg-neutral-700 rounded-sm\">\n\t\t\t\t\t\t\t\t\t\t\t\t<span className=\"text-neutral-300 text-xs font-medium leading-[18px] font-inter\">**bold**</span>\n\t\t\t\t\t\t\t\t\t\t\t</div>\n\t\t\t\t\t\t\t\t\t\t\t<span className=\"text-white text-xs font-medium leading-[18px] font-inter\">\n\t\t\t\t\t\t\t\t\t\t\t\t→ <strong>bold</strong> text\n\t\t\t\t\t\t\t\t\t\t\t</span>\n\t\t\t\t\t\t\t\t\t\t</div>\n\t\t\t\t\t\t\t\t\t\t<div className=\"flex flex-row items-start gap-1 ml-1\">\n\t\t\t\t\t\t\t\t\t\t\t<span className=\"text-white text-[18px] leading-[18px]\">•</span>\n\t\t\t\t\t\t\t\t\t\t\t<div className=\"flex flex-row justify-center items-center px-[3px] bg-neutral-700 rounded-sm\">\n\t\t\t\t\t\t\t\t\t\t\t\t<span className=\"text-neutral-300 text-xs font-medium leading-[18px] font-inter\">*italic*</span>\n\t\t\t\t\t\t\t\t\t\t\t</div>\n\t\t\t\t\t\t\t\t\t\t\t<span className=\"text-white text-xs font-medium leading-[18px] font-inter\">\n\t\t\t\t\t\t\t\t\t\t\t\t→ <em>italic</em> text\n\t\t\t\t\t\t\t\t\t\t\t</span>\n\t\t\t\t\t\t\t\t\t\t</div>\n\t\t\t\t\t\t\t\t\t\t<div className=\"flex flex-row items-start gap-1 ml-1\">\n\t\t\t\t\t\t\t\t\t\t\t<span className=\"text-white text-[18px] leading-[18px]\">•</span>\n\t\t\t\t\t\t\t\t\t\t\t<div className=\"flex flex-row justify-center items-center px-[3px] bg-neutral-700 rounded-sm\">\n\t\t\t\t\t\t\t\t\t\t\t\t<span className=\"text-neutral-300 text-xs font-medium leading-[18px] font-inter\">`code`</span>\n\t\t\t\t\t\t\t\t\t\t\t</div>\n\t\t\t\t\t\t\t\t\t\t\t<span className=\"text-white text-xs font-medium leading-[18px] font-inter\">\n\t\t\t\t\t\t\t\t\t\t\t\t→ <code>inline code</code>\n\t\t\t\t\t\t\t\t\t\t\t</span>\n\t\t\t\t\t\t\t\t\t\t</div>\n\t\t\t\t\t\t\t\t\t\t<div className=\"flex flex-row items-start gap-1 ml-1\">\n\t\t\t\t\t\t\t\t\t\t\t<span className=\"text-white text-[18px] leading-[18px]\">•</span>\n\t\t\t\t\t\t\t\t\t\t\t<div className=\"flex flex-row justify-center items-center px-[3px] bg-neutral-700 rounded-sm\">\n\t\t\t\t\t\t\t\t\t\t\t\t<span className=\"text-neutral-300 text-xs font-medium leading-[18px] font-inter\">&lt;u&gt;text&lt;/u&gt;</span>\n\t\t\t\t\t\t\t\t\t\t\t</div>\n\t\t\t\t\t\t\t\t\t\t\t<span className=\"text-white text-xs font-medium leading-[18px] font-inter\">\n\t\t\t\t\t\t\t\t\t\t\t\t→ <u>underline</u>\n\t\t\t\t\t\t\t\t\t\t\t</span>\n\t\t\t\t\t\t\t\t\t\t</div>\n\t\t\t\t\t\t\t\t\t\t<div className=\"flex flex-row items-start gap-1 ml-1\">\n\t\t\t\t\t\t\t\t\t\t\t<span className=\"text-white text-[18px] leading-[18px]\">•</span>\n\t\t\t\t\t\t\t\t\t\t\t<div className=\"flex flex-row justify-center items-center px-[3px] bg-neutral-700 rounded-sm\">\n\t\t\t\t\t\t\t\t\t\t\t\t<span className=\"text-neutral-300 text-xs font-medium leading-[18px] font-inter\">~~strike~~</span>\n\t\t\t\t\t\t\t\t\t\t\t</div>\n\t\t\t\t\t\t\t\t\t\t\t<span className=\"text-white text-xs font-medium leading-[18px] font-inter\">\n\t\t\t\t\t\t\t\t\t\t\t\t→ <del>strike</del>\n\t\t\t\t\t\t\t\t\t\t\t</span>\n\t\t\t\t\t\t\t\t\t\t</div>\n\t\t\t\t\t\t\t\t\t\t<div className=\"flex flex-row items-start gap-1 ml-1\">\n\t\t\t\t\t\t\t\t\t\t\t<span className=\"text-white text-[18px] leading-[18px]\">•</span>\n\t\t\t\t\t\t\t\t\t\t\t<div className=\"flex flex-row justify-center items-center px-[3px] bg-neutral-700 rounded-sm\">\n\t\t\t\t\t\t\t\t\t\t\t\t<span className=\"text-neutral-300 text-xs font-medium leading-[18px] font-inter\">- item</span>\n\t\t\t\t\t\t\t\t\t\t\t</div>\n\t\t\t\t\t\t\t\t\t\t\t<span className=\"text-white text-xs font-medium leading-[18px] font-inter\">\n\t\t\t\t\t\t\t\t\t\t\t\t→ bullet list\n\t\t\t\t\t\t\t\t\t\t\t</span>\n\t\t\t\t\t\t\t\t\t\t</div>\n\t\t\t\t\t\t\t\t\t\t<div className=\"flex flex-row items-start gap-1 ml-1\">\n\t\t\t\t\t\t\t\t\t\t\t<span className=\"text-white text-[18px] leading-[18px]\">•</span>\n\t\t\t\t\t\t\t\t\t\t\t<div className=\"flex flex-row justify-center items-center px-[3px] bg-neutral-700 rounded-sm\">\n\t\t\t\t\t\t\t\t\t\t\t\t<span className=\"text-neutral-300 text-xs font-medium leading-[18px] font-inter\">1. item</span>\n\t\t\t\t\t\t\t\t\t\t\t</div>\n\t\t\t\t\t\t\t\t\t\t\t<span className=\"text-white text-xs font-medium leading-[18px] font-inter\">\n\t\t\t\t\t\t\t\t\t\t\t\t→ numbered list\n\t\t\t\t\t\t\t\t\t\t\t</span>\n\t\t\t\t\t\t\t\t\t\t</div>\n\t\t\t\t\t\t\t\t\t\t{acceptAdvanceContent && (\n\t\t\t\t\t\t\t\t\t\t\t<div className=\"flex flex-row items-start gap-1 ml-1\">\n\t\t\t\t\t\t\t\t\t\t\t\t<span className=\"text-white text-[18px] leading-[18px]\">•</span>\n\t\t\t\t\t\t\t\t\t\t\t\t<div className=\"flex flex-row justify-center items-center px-[3px] bg-neutral-700 rounded-sm\">\n\t\t\t\t\t\t\t\t\t\t\t\t\t<span className=\"text-neutral-300 text-xs font-medium leading-[18px] font-inter\">## heading</span>\n\t\t\t\t\t\t\t\t\t\t\t\t</div>\n\t\t\t\t\t\t\t\t\t\t\t\t<span className=\"text-white text-xs font-medium leading-[18px] font-inter\">\n\t\t\t\t\t\t\t\t\t\t\t\t\t→ heading 2\n\t\t\t\t\t\t\t\t\t\t\t\t</span>\n\t\t\t\t\t\t\t\t\t\t\t</div>\n\t\t\t\t\t\t\t\t\t\t)}\n\t\t\t\t\t\t\t\t\t\t<div className=\"flex flex-row items-start gap-1 ml-1\">\n\t\t\t\t\t\t\t\t\t\t\t<span className=\"text-white text-[18px] leading-[18px]\">•</span>\n\t\t\t\t\t\t\t\t\t\t\t<div className=\"flex flex-row justify-center items-center px-[3px] bg-neutral-700 rounded-sm\">\n\t\t\t\t\t\t\t\t\t\t\t\t<span className=\"text-neutral-300 text-xs font-medium leading-[18px] font-inter\">[link](url)</span>\n\t\t\t\t\t\t\t\t\t\t\t</div>\n\t\t\t\t\t\t\t\t\t\t\t<span className=\"text-white text-xs font-medium leading-[18px] font-inter\">\n\t\t\t\t\t\t\t\t\t\t\t\t→ hyperlink\n\t\t\t\t\t\t\t\t\t\t\t</span>\n\t\t\t\t\t\t\t\t\t\t</div>\n\t\t\t\t\t\t\t\t\t</div>\n\n\t\t\t\t\t\t\t\t\t{acceptAdvanceContent && (\n\t\t\t\t\t\t\t\t\t\t<>\n\t\t\t\t\t\t\t\t\t\t\t<div className=\"flex flex-col items-start justify-start gap-1 w-full\">\n\t\t\t\t\t\t\t\t\t\t\t\t<div className=\"flex flex-row items-start gap-1 ml-1\">\n\t\t\t\t\t\t\t\t\t\t\t\t\t<span className=\"text-white text-[18px] leading-[18px]\">•</span>\n\t\t\t\t\t\t\t\t\t\t\t\t\t<div className=\"flex flex-row justify-center items-center px-[3px] bg-neutral-700 rounded-sm\">\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t<span className=\"text-neutral-300 text-xs font-medium leading-[18px] font-inter\">&gt; quote</span>\n\t\t\t\t\t\t\t\t\t\t\t\t\t</div>\n\t\t\t\t\t\t\t\t\t\t\t\t\t<span className=\"text-white text-xs font-medium leading-[18px] font-inter\">\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t→ blockquote\n\t\t\t\t\t\t\t\t\t\t\t\t\t</span>\n\t\t\t\t\t\t\t\t\t\t\t\t</div>\n\t\t\t\t\t\t\t\t\t\t\t\t<div className=\"flex flex-col items-start justify-start gap-0.5 w-full mt-0.5\">\n\t\t\t\t\t\t\t\t\t\t\t\t\t<div className=\"flex flex-row items-center gap-1 ml-1\">\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t<span className=\"text-white text-[18px] leading-[18px]\">•</span>\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t<span className=\"text-white text-xs font-medium leading-[18px] font-inter\">\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\tTable:\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t</span>\n\t\t\t\t\t\t\t\t\t\t\t\t\t</div>\n\t\t\t\t\t\t\t\t\t\t\t\t\t<div className=\"flex flex-col px-1 py-0.5 bg-neutral-700 ml-2 rounded-sm gap-0\">\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t<span className=\"text-neutral-300 text-xs font-medium leading-[18px] font-inter whitespace-nowrap\">| Header 1 | Header 2 | Header 3 |</span>\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t<span className=\"text-neutral-300 text-xs font-medium leading-[18px] font-inter whitespace-nowrap\">| :--- | :---: | ---: |</span>\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t<span className=\"text-neutral-300 text-xs font-medium leading-[18px] font-inter whitespace-nowrap\">| Left | Center | Right |</span>\n\t\t\t\t\t\t\t\t\t\t\t\t\t</div>\n\t\t\t\t\t\t\t\t\t\t\t\t</div>\n\t\t\t\t\t\t\t\t\t\t\t</div>\n\t\t\t\t\t\t\t\t\t\t</>\n\t\t\t\t\t\t\t\t\t)}\n\t\t\t\t\t\t\t\t</div>\n\t\t\t\t\t\t\t}\n\t\t\t\t\t\t>\n\t\t\t\t\t\t\t<Typography className=\"mb-2 text-xs font-medium text-primary-700 inline-flex items-center gap-1 cursor-pointer\">\n\t\t\t\t\t\t\t\tFormatting help ?\n\t\t\t\t\t\t\t</Typography>\n\t\t\t\t\t\t</Tooltip>\n\t\t\t\t\t)}\n\t\t\t\t</div>\n\n\t\t\t\t{/* Main Container */}\n\t\t\t\t<div className={cn(\n\t\t\t\t\t\"flex flex-col border shadow-[0px_1px_2px_rgba(0,0,0,0.05)] rounded-lg bg-white dark:bg-black-700 w-full\",\n\t\t\t\t\terrorMessage\n\t\t\t\t\t\t? \"border-red-300 focus-within:border-red-500 focus-within:shadow-[0_0_0_1.5px_var(--color-red-200)]\"\n\t\t\t\t\t\t: \"border-[#EAECF0] dark:border-black-600 focus-within:border-primary-600 dark:focus-within:border-primary-400 focus-within:shadow-[0_0_0_1.5px_var(--color-primary-100)] dark:focus-within:shadow-[0_0_0_1.5px_var(--color-primary-950)]\"\n\t\t\t\t)}>\n\t\t\t\t\t{/* Toolbar */}\n\t\t\t\t\t<div className={cn(\n\t\t\t\t\t\t\"flex flex-row justify-between items-center px-3 py-2 gap-2 h-11 rounded-t-lg bg-[#F9FAFB] dark:bg-black-600 border-b border-[#EAECF0] dark:border-black-600\"\n\t\t\t\t\t)}>\n\t\t\t\t\t\t{/* Left: Formatting Buttons */}\n\t\t\t\t\t\t<div className=\"flex items-center gap-2\">\n\t\t\t\t\t\t\t<Button\n\t\t\t\t\t\t\t\tid={`${inputId}-bold`}\n\t\t\t\t\t\t\t\ttype=\"button\"\n\t\t\t\t\t\t\t\tonClick={() => insertMarkdown('**', '**', 'bold text')}\n\t\t\t\t\t\t\t\tdisabled={isDisabled || mode === \"preview\"}\n\t\t\t\t\t\t\t\tclassName=\"!p-0.5 !min-w-0 !h-auto !rounded-md hover:!bg-neutral-200 dark:hover:!bg-black-500 hover:!scale-110 !transition-all !duration-200\"\n\t\t\t\t\t\t\t\tappearance=\"ghost\"\n\t\t\t\t\t\t\t\tstatus=\"no-background\"\n\t\t\t\t\t\t\t\ttitle=\"Bold (Ctrl+B)\"\n\t\t\t\t\t\t\t>\n\t\t\t\t\t\t\t\t<FormatBold sx={{ fontSize: 20, color: '#667085' }} className=\"dark:text-neutral-400\" />\n\t\t\t\t\t\t\t</Button>\n\n\t\t\t\t\t\t\t<Button\n\t\t\t\t\t\t\t\tid={`${inputId}-italic`}\n\t\t\t\t\t\t\t\ttype=\"button\"\n\t\t\t\t\t\t\t\tonClick={() => insertMarkdown('*', '*', 'italic text')}\n\t\t\t\t\t\t\t\tdisabled={isDisabled || mode === \"preview\"}\n\t\t\t\t\t\t\t\tclassName=\"!p-0.5 !min-w-0 !h-auto !rounded-md hover:!bg-neutral-200 dark:hover:!bg-black-500 hover:!scale-110 !transition-all !duration-200\"\n\t\t\t\t\t\t\t\tappearance=\"ghost\"\n\t\t\t\t\t\t\t\tstatus=\"no-background\"\n\t\t\t\t\t\t\t\ttitle=\"Italic (Ctrl+I)\"\n\t\t\t\t\t\t\t>\n\t\t\t\t\t\t\t\t<FormatItalic sx={{ fontSize: 20, color: '#667085' }} className=\"dark:text-neutral-400\" />\n\t\t\t\t\t\t\t</Button>\n\n\t\t\t\t\t\t\t<Button\n\t\t\t\t\t\t\t\tid={`${inputId}-underline`}\n\t\t\t\t\t\t\t\ttype=\"button\"\n\t\t\t\t\t\t\t\tonClick={() => insertMarkdown('<u>', '</u>', 'underlined text')}\n\t\t\t\t\t\t\t\tdisabled={isDisabled || mode === \"preview\"}\n\t\t\t\t\t\t\t\tclassName=\"!p-0.5 !min-w-0 !h-auto !rounded-md hover:!bg-neutral-200 dark:hover:!bg-black-500 hover:!scale-110 !transition-all !duration-200\"\n\t\t\t\t\t\t\t\tappearance=\"ghost\"\n\t\t\t\t\t\t\t\tstatus=\"no-background\"\n\t\t\t\t\t\t\t\ttitle=\"Underline (Ctrl+U)\"\n\t\t\t\t\t\t\t>\n\t\t\t\t\t\t\t\t<FormatUnderlined sx={{ fontSize: 20, color: '#667085' }} className=\"dark:text-neutral-400\" />\n\t\t\t\t\t\t\t</Button>\n\n\t\t\t\t\t\t\t<div className=\"w-px h-5 bg-[#EAECF0] dark:bg-black-500 rounded-full\" />\n\n\t\t\t\t\t\t\t<Button\n\t\t\t\t\t\t\t\tid={`${inputId}-numbered-list`}\n\t\t\t\t\t\t\t\ttype=\"button\"\n\t\t\t\t\t\t\t\tonClick={() => insertList('1. ')}\n\t\t\t\t\t\t\t\tdisabled={isDisabled || mode === \"preview\"}\n\t\t\t\t\t\t\t\tclassName=\"!p-0.5 !min-w-0 !h-auto !rounded-md hover:!bg-neutral-200 dark:hover:!bg-black-500 hover:!scale-110 !transition-all !duration-200\"\n\t\t\t\t\t\t\t\tappearance=\"ghost\"\n\t\t\t\t\t\t\t\tstatus=\"no-background\"\n\t\t\t\t\t\t\t\ttitle=\"Numbered List\"\n\t\t\t\t\t\t\t>\n\t\t\t\t\t\t\t\t<FormatListNumbered sx={{ fontSize: 20, color: '#667085' }} className=\"dark:text-neutral-400\" />\n\t\t\t\t\t\t\t</Button>\n\n\t\t\t\t\t\t\t<Button\n\t\t\t\t\t\t\t\tid={`${inputId}-bullet-list`}\n\t\t\t\t\t\t\t\ttype=\"button\"\n\t\t\t\t\t\t\t\tonClick={() => insertList('- ')}\n\t\t\t\t\t\t\t\tdisabled={isDisabled || mode === \"preview\"}\n\t\t\t\t\t\t\t\tclassName=\"!p-0.5 !min-w-0 !h-auto !rounded-md hover:!bg-neutral-200 dark:hover:!bg-black-500 hover:!scale-110 !transition-all !duration-200\"\n\t\t\t\t\t\t\t\tappearance=\"ghost\"\n\t\t\t\t\t\t\t\tstatus=\"no-background\"\n\t\t\t\t\t\t\t\ttitle=\"Bullet List\"\n\t\t\t\t\t\t\t>\n\t\t\t\t\t\t\t\t<FormatListBulleted sx={{ fontSize: 20, color: '#667085' }} className=\"dark:text-neutral-400\" />\n\t\t\t\t\t\t\t</Button>\n\t\t\t\t\t\t</div>\n\n\t\t\t\t\t\t<div className=\"flex items-center gap-2\">\n\t\t\t\t\t\t\t{/* Center: Character Count */}\n\t\t\t\t\t\t\t{maxLength && (\n\t\t\t\t\t\t\t\t<div className=\"flex items-center gap-3\">\n\t\t\t\t\t\t\t\t\t<span className=\"text-sm font-medium text-[#475467] dark:text-neutral-400\">\n\t\t\t\t\t\t\t\t\t\t{charCount}/{maxLength}\n\t\t\t\t\t\t\t\t\t</span>\n\t\t\t\t\t\t\t\t\t<div className=\"w-px h-6 bg-[#EAECF0] dark:bg-black-500 rounded-full\" />\n\t\t\t\t\t\t\t\t</div>\n\t\t\t\t\t\t\t)}\n\n\t\t\t\t\t\t\t{/* Right: Edit/Preview Toggle */}\n\t\t\t\t\t\t\t{showPreviewOnModal ? (\n\t\t\t\t\t\t\t\t<Button\n\t\t\t\t\t\t\t\t\tid={`${inputId}-expand`}\n\t\t\t\t\t\t\t\t\ttype=\"button\"\n\t\t\t\t\t\t\t\t\tonClick={() => setIsPreviewOpen(true)}\n\t\t\t\t\t\t\t\t\tdisabled={isDisabled}\n\t\t\t\t\t\t\t\t\tclassName=\"!p-0.5 !min-w-0 !h-auto ml-1 !rounded-md hover:!bg-neutral-200 dark:hover:!bg-black-500 hover:!scale-110 !transition-all !duration-200\"\n\t\t\t\t\t\t\t\t\tappearance=\"ghost\"\n\t\t\t\t\t\t\t\t\tstatus=\"no-background\"\n\t\t\t\t\t\t\t\t\ttitle=\"Expand Preview\"\n\t\t\t\t\t\t\t\t>\n\t\t\t\t\t\t\t\t\t<OpenInFull sx={{ fontSize: 16, color: '#667085' }} className=\"dark:text-neutral-400\" />\n\t\t\t\t\t\t\t\t</Button>\n\t\t\t\t\t\t\t) : (\n\t\t\t\t\t\t\t\t<Tabs<RichMarkdownInputViewType>\n\t\t\t\t\t\t\t\t\tvariant=\"switch\"\n\t\t\t\t\t\t\t\t\ttabs={RichMarkdownInputTabs}\n\t\t\t\t\t\t\t\t\tactiveTab={mode}\n\t\t\t\t\t\t\t\t\tonTabClick={(tab) => setMode(tab)}\n\t\t\t\t\t\t\t\t\theight=\"h-5\"\n\t\t\t\t\t\t\t\t\ticonsOnly\n\t\t\t\t\t\t\t\t\ttabIcons={{\n\t\t\t\t\t\t\t\t\t\tedit: (<Edit sx={{ fontSize: 16, color: '#667085' }} className=\"dark:text-neutral-400\" />),\n\t\t\t\t\t\t\t\t\t\tpreview: (\n\t\t\t\t\t\t\t\t\t\t\t<VisibilityOutlined sx={{ fontSize: 16, color: '#667085' }} className=\"dark:text-neutral-400\" />\n\t\t\t\t\t\t\t\t\t\t),\n\t\t\t\t\t\t\t\t\t}}\n\t\t\t\t\t\t\t\t\tclassName=\"rounded-lg\"\n\t\t\t\t\t\t\t\t/>\n\t\t\t\t\t\t\t)}\n\t\t\t\t\t\t</div>\n\t\t\t\t\t</div>\n\n\t\t\t\t\t{/* Content Area */}\n\t\t\t\t\t<div className=\"px-3 py-2 relative\">\n\t\t\t\t\t\t{mode === \"edit\" ? (\n\t\t\t\t\t\t\t<>\n\t\t\t\t\t\t\t\t<textarea\n\t\t\t\t\t\t\t\t\tref={(node) => {\n\t\t\t\t\t\t\t\t\t\t// Handle all refs: forwarded ref, internal ref, and inputref\n\t\t\t\t\t\t\t\t\t\tif (typeof ref === 'function') {\n\t\t\t\t\t\t\t\t\t\t\tref(node);\n\t\t\t\t\t\t\t\t\t\t} else if (ref) {\n\t\t\t\t\t\t\t\t\t\t\t(ref as React.MutableRefObject<HTMLTextAreaElement | null>).current = node;\n\t\t\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t\t\t\t(textareaRef as React.MutableRefObject<HTMLTextAreaElement | null>).current = node;\n\t\t\t\t\t\t\t\t\t\tif (inputref) {\n\t\t\t\t\t\t\t\t\t\t\t(inputref as React.MutableRefObject<HTMLTextAreaElement | null>).current = node;\n\t\t\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t\t\t}}\n\t\t\t\t\t\t\t\t\tid={inputId}\n\t\t\t\t\t\t\t\t\tvalue={value}\n\t\t\t\t\t\t\t\t\tdefaultValue={defaultValue}\n\t\t\t\t\t\t\t\t\tonChange={(e) => {\n\t\t\t\t\t\t\t\t\t\tconst newValue = originalCase ? e.target.value : e.target.value;\n\t\t\t\t\t\t\t\t\t\tif (!maxLength || newValue.length <= maxLength) {\n\t\t\t\t\t\t\t\t\t\t\tonChange(newValue);\n\t\t\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t\t\t}}\n\t\t\t\t\t\t\t\t\tonKeyDown={handleKeyDownInternal}\n\t\t\t\t\t\t\t\t\tplaceholder={placeholder}\n\t\t\t\t\t\t\t\t\trows={rows}\n\t\t\t\t\t\t\t\t\tdisabled={isDisabled}\n\t\t\t\t\t\t\t\t\trequired={required}\n\t\t\t\t\t\t\t\t\tmaxLength={maxLength}\n\t\t\t\t\t\t\t\t\tclassName={cn(\n\t\t\t\t\t\t\t\t\t\t// Base styles\n\t\t\t\t\t\t\t\t\t\t\"w-full bg-transparent !focus:ring-0 !focus:border-none\",\n\t\t\t\t\t\t\t\t\t\t\"font-inter font-medium text-sm leading-5\",\n\t\t\t\t\t\t\t\t\t\t\"text-[#101828] dark:text-neutral-100\",\n\t\t\t\t\t\t\t\t\t\t\"placeholder:text-neutral-400 dark:placeholder:text-neutral-500\",\n\t\t\t\t\t\t\t\t\t\t\"focus:outline-none resize-none\",\n\t\t\t\t\t\t\t\t\t\t// Hide scrollbar\n\t\t\t\t\t\t\t\t\t\t\"scrollbar-none\",\n\t\t\t\t\t\t\t\t\t\t\"[&::-webkit-scrollbar]:hidden\",\n\t\t\t\t\t\t\t\t\t\t\"[-ms-overflow-style:none]\",\n\t\t\t\t\t\t\t\t\t\t\"[scrollbar-width:none]\",\n\t\t\t\t\t\t\t\t\t\t// Disabled state\n\t\t\t\t\t\t\t\t\t\t{\n\t\t\t\t\t\t\t\t\t\t\t\"text-neutral-400 dark:text-neutral-500 cursor-not-allowed\": isDisabled,\n\t\t\t\t\t\t\t\t\t\t},\n\t\t\t\t\t\t\t\t\t\t// Add padding if suffix icons exist\n\t\t\t\t\t\t\t\t\t\t{\n\t\t\t\t\t\t\t\t\t\t\t\"pr-20\": isClearable || suffixIcon,\n\t\t\t\t\t\t\t\t\t\t},\n\t\t\t\t\t\t\t\t\t\ttextareaClassName\n\t\t\t\t\t\t\t\t\t)}\n\t\t\t\t\t\t\t\t/>\n\n\t\t\t\t\t\t\t\t{/* Suffix Icons */}\n\t\t\t\t\t\t\t\t{(isClearable || suffixIcon) && mode === \"edit\" && (\n\t\t\t\t\t\t\t\t\t<div className=\"absolute right-1 top-2 flex items-center gap-1\">\n\t\t\t\t\t\t\t\t\t\t{isClearable && value && (\n\t\t\t\t\t\t\t\t\t\t\t<button\n\t\t\t\t\t\t\t\t\t\t\t\tid={`btn-input-field-clear-${id}`}\n\t\t\t\t\t\t\t\t\t\t\t\tclassName=\"absolute inset-y-0 flex items-center cursor-pointer top-2 right-1 focus:outline-none\"\n\t\t\t\t\t\t\t\t\t\t\t\tonClick={handleClear}\n\t\t\t\t\t\t\t\t\t\t\t\ttype=\"button\"\n\t\t\t\t\t\t\t\t\t\t\t>\n\t\t\t\t\t\t\t\t\t\t\t\t<CloseIcon\n\t\t\t\t\t\t\t\t\t\t\t\t\tclassName=\"text-neutral-300 dark:text-black-500 hover:text-neutral-400 dark:hover:text-black-400 transition-colors\"\n\t\t\t\t\t\t\t\t\t\t\t\t\tsize={16}\n\t\t\t\t\t\t\t\t\t\t\t\t/>\n\t\t\t\t\t\t\t\t\t\t\t</button>\n\t\t\t\t\t\t\t\t\t\t)}\n\t\t\t\t\t\t\t\t\t\t{suffixIcon && <div className=\"flex items-center\">{suffixIcon}</div>}\n\t\t\t\t\t\t\t\t\t</div>\n\t\t\t\t\t\t\t\t)}\n\t\t\t\t\t\t\t</>\n\t\t\t\t\t\t) : (\n\t\t\t\t\t\t\t<div className=\"w-full min-h-[92px] max-h-[400px] overflow-y-auto\">\n\t\t\t\t\t\t\t\t<MarkdownPreview\n\t\t\t\t\t\t\t\t\tcontent={value}\n\t\t\t\t\t\t\t\t\tlinkTarget={linkTarget}\n\t\t\t\t\t\t\t\t\tclassName={previewClassName}\n\t\t\t\t\t\t\t\t\tnoIndent={noIndent}\n\t\t\t\t\t\t\t\t\tshowMinimalPreview={showMinimalPreview}\n\t\t\t\t\t\t\t\t\tacceptAdvanceContent={acceptAdvanceContent}\n\t\t\t\t\t\t\t\t/>\n\t\t\t\t\t\t\t</div>\n\t\t\t\t\t\t)}\n\t\t\t\t\t</div>\n\t\t\t\t</div>\n\n\t\t\t\t{/* Expanded Preview Modal */}\n\t\t\t\t<Modal\n\t\t\t\t\topen={isPreviewOpen}\n\t\t\t\t\tonCancel={() => setIsPreviewOpen(false)}\n\t\t\t\t\ttitle=\"Markdown Preview\"\n\t\t\t\t\twidth={900}\n\t\t\t\t\tfooter={null}\n\t\t\t\t>\n\t\t\t\t\t<div className=\"max-h-[calc(100vh-200px)] overflow-y-auto p-4\">\n\t\t\t\t\t\t<MarkdownPreview\n\t\t\t\t\t\t\tcontent={value}\n\t\t\t\t\t\t\tlinkTarget={linkTarget}\n\t\t\t\t\t\t\tclassName={previewClassName}\n\t\t\t\t\t\t\tnoIndent={noIndent}\n\t\t\t\t\t\t\tshowMinimalPreview={showMinimalPreview}\n\t\t\t\t\t\t\tacceptAdvanceContent={acceptAdvanceContent}\n\t\t\t\t\t\t/>\n\t\t\t\t\t</div>\n\t\t\t\t</Modal>\n\n\t\t\t\t<AnimatePresence>\n\t\t\t\t\t{errorMessage && (\n\t\t\t\t\t\t<motion.div\n\t\t\t\t\t\t\tinitial={{ opacity: 0, y: -10 }}\n\t\t\t\t\t\t\tanimate={{ opacity: 1, y: 0 }}\n\t\t\t\t\t\t\texit={{ opacity: 0, y: -10 }}\n\t\t\t\t\t\t\ttransition={{ duration: 0.2 }}\n\t\t\t\t\t\t>\n\t\t\t\t\t\t\t<Typography\n\t\t\t\t\t\t\t\tclassName=\"mt-1 text-error-500\"\n\t\t\t\t\t\t\t\tappearance=\"custom\"\n\t\t\t\t\t\t\t\tsize=\"extra-small\"\n\t\t\t\t\t\t\t\tvariant=\"medium\"\n\t\t\t\t\t\t\t>\n\t\t\t\t\t\t\t\t{errorMessage}\n\t\t\t\t\t\t\t</Typography>\n\t\t\t\t\t\t</motion.div>\n\t\t\t\t\t)}\n\t\t\t\t</AnimatePresence>\n\t\t\t</div>\n\t\t);\n\n\t\treturn tooltip ? (\n\t\t\t<Tooltip title={tooltip}>\n\t\t\t\t{content}\n\t\t\t</Tooltip>\n\t\t) : (\n\t\t\tcontent\n\t\t);\n\t}\n);\n\nRichMarkdownInput.displayName = \"RichMarkdownInput\";\n"],"names":["RichMarkdownInputTabs","CloseIcon","className","size","jsxs","jsx","RichMarkdownInput","forwardRef","id","value","defaultValue","onChange","placeholder","minRows","maxRows","isDisabled","textareaClassName","previewClassName","label","labelClassName","isRequiredConditional","required","showPreviewOnModal","maxLength","linkTarget","errorMessage","tooltip","originalCase","suffixIcon","isClearable","inputref","showFormattingHelp","onKeyDown","noIndent","showMinimalPreview","acceptAdvanceContent","ref","mode","setMode","useState","isPreviewOpen","setIsPreviewOpen","textareaRef","useRef","inputId","charCount","insertMarkdown","before","after","textarea","start","end","selectedText","textToInsert","newValue","newCursorPos","insertList","prefix","lines","currentPos","startLine","endLine","i","newLines","line","index","handleKeyDownInternal","e","handleClear","rows","lineCount","content","cn","InputLabel","Tooltip","Fragment","Typography","Button","FormatBold","FormatItalic","FormatUnderlined","FormatListNumbered","FormatListBulleted","OpenInFull","Tabs","tab","Edit","VisibilityOutlined","node","MarkdownPreview","Modal","AnimatePresence","motion"],"mappings":"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"}
+{"version":3,"file":"RichMarkdownInput.es.js","sources":["../../../../src/components/forms/md-input/RichMarkdownInput.tsx"],"sourcesContent":["import cn from \"classnames\";\nimport { forwardRef, useRef, useState } from \"react\";\nimport {\n\tFormatBold,\n\tFormatItalic,\n\tFormatUnderlined,\n\tFormatListBulleted,\n\tFormatListNumbered,\n\tOpenInFull,\n\tEdit,\n\tVisibilityOutlined,\n} from \"@mui/icons-material\";\nimport { Modal } from \"../../data-display/modal/Modal\";\nimport Button from \"../../button/Button\";\nimport { Tabs } from \"../../navigation/tabs/Tabs\";\nimport { MarkdownPreview } from \"./MarkdownPreview\";\nimport Tooltip from \"../../tooltip/Tooltip\";\nimport { AnimatePresence, motion } from \"framer-motion\";\nimport { Typography } from \"../../data-display/typography/Typography\";\nimport { InputLabel } from \"../shared/InputLabel\";\n\n/**\n * Props for the RichMarkdownInput component\n */\nexport interface RichMarkdownInputProps {\n\t/** Unique identifier for the markdown input */\n\tid?: string;\n\t/** Current markdown value */\n\tvalue?: string;\n\t/** Default value for the input */\n\tdefaultValue?: string;\n\t/** Placeholder text for the textarea */\n\tplaceholder?: string;\n\t/** Minimum number of visible text lines */\n\tminRows?: number;\n\t/** Maximum number of visible text lines */\n\tmaxRows?: number;\n\t/** Whether the input is disabled */\n\tisDisabled?: boolean;\n\t/** Additional CSS classes for the wrapper container */\n\tclassName?: string;\n\t/** Additional CSS classes for the textarea */\n\ttextareaClassName?: string;\n\t/** Additional CSS classes for the preview container */\n\tpreviewClassName?: string;\n\t/** Label text to display above the input */\n\tlabel?: string;\n\t/** Additional CSS classes for the label */\n\tlabelClassName?: string;\n\t/** Whether the field is required and the required indicator shows as conditional */\n\tisRequiredConditional?: boolean;\n\t/** Whether the field is required */\n\trequired?: boolean;\n\t/** Whether to show the preview button */\n\tshowPreviewOnModal?: boolean;\n\t/** Maximum character count */\n\tmaxLength?: number;\n\t/** Link target behavior: '_blank' for new tab, '_self' for current tab */\n\tlinkTarget?: '_blank' | '_self';\n\t/** Error message to display */\n\terrorMessage?: string;\n\t/** Tooltip text */\n\ttooltip?: string;\n\t/** Whether to preserve original case (no auto-lowercase) */\n\toriginalCase?: boolean;\n\t/** Icon to display at the end of the input */\n\tsuffixIcon?: React.ReactNode;\n\t/** Whether the input is clearable */\n\tisClearable?: boolean;\n\t/** Ref for the input element */\n\tinputref?: React.RefObject<HTMLTextAreaElement>;\n\t/** Whether to show the formatting help tooltip */\n\tshowFormattingHelp?: boolean;\n\t/** Keyboard event handler */\n\tonKeyDown?: (e: React.KeyboardEvent<HTMLTextAreaElement>) => void;\n\t/** Whether to remove indentation from lists and align all content to the left in preview */\n\tnoIndent?: boolean;\n\t/** Whether to display all content with uniform font size/weight (paragraph-like) while keeping formatting */\n\tshowMinimalPreview?: boolean;\n\t/** Whether to accept and render advanced content (code blocks, blockquotes, tables, images) in preview */\n\tacceptAdvanceContent?: boolean;\n\t/** Callback function called when the markdown value changes */\n\tonChange: (value: string) => void;\n}\n\n/**\n * The type of view for the rich markdown input\n */\ntype RichMarkdownInputViewType = \"edit\" | \"preview\";\n\n/**\n * The tabs for the rich markdown input\n */\nconst RichMarkdownInputTabs: RichMarkdownInputViewType[] = [\"edit\", \"preview\"];\n\n/**\n * Close icon for clearable input\n */\nconst CloseIcon = ({ className, size = 16 }: { className?: string; size?: number }) => (\n\t<svg\n\t\twidth={size}\n\t\theight={size}\n\t\tviewBox=\"0 0 24 24\"\n\t\tfill=\"none\"\n\t\tstroke=\"currentColor\"\n\t\tstrokeWidth=\"2\"\n\t\tstrokeLinecap=\"round\"\n\t\tstrokeLinejoin=\"round\"\n\t\tclassName={className}\n\t>\n\t\t<line x1=\"18\" y1=\"6\" x2=\"6\" y2=\"18\" />\n\t\t<line x1=\"6\" y1=\"6\" x2=\"18\" y2=\"18\" />\n\t</svg>\n);\n\n/**\n * A rich markdown input component with comprehensive formatting toolbar.\n * \n * **Text Formatting:**\n * - Bold (Ctrl+B) - Always visible\n * - Italic (Ctrl+I) - Always visible\n * - Underline (Ctrl+U) - Always visible\n * \n * **Lists:**\n * - Bullet lists - Always visible\n * - Numbered lists - Always visible\n * \n * **Features:**\n * - Edit/Preview toggle with icons\n * - Character counter (optional)\n * - Preview modal with scrolling\n * - Keyboard shortcuts\n * - Syntax highlighting for code blocks\n * - Responsive toolbar\n * - Dark mode support\n * - Configurable link target behavior\n * - Error message display\n * - Tooltip support\n * - Clear button (optional)\n * - Suffix icon support\n * - Custom keyboard handlers\n * - Minimal preview mode (uniform typography)\n * - Toggle advanced content in preview\n *\n * @example\n * ```tsx\n * <RichMarkdownInput\n *   value={markdown}\n *   onChange={setMarkdown}\n *   placeholder=\"Enter description...\"\n *   label=\"Description\"\n *   maxLength={300}\n *   linkTarget=\"_blank\"\n *   isClearable\n *   errorMessage=\"Invalid input\"\n *   tooltip=\"Use markdown formatting\"\n *   showMinimalPreview={false}\n *   acceptAdvanceContent={true}\n * />\n * ```\n */\nexport const RichMarkdownInput = forwardRef<\n\tHTMLTextAreaElement,\n\tRichMarkdownInputProps\n>(\n\t(\n\t\t{\n\t\t\tid,\n\t\t\tvalue = \"\",\n\t\t\tdefaultValue,\n\t\t\tonChange,\n\t\t\tplaceholder = \"Enter markdown content...\",\n\t\t\tminRows = 4,\n\t\t\tmaxRows = 20,\n\t\t\tisDisabled = false,\n\t\t\tclassName,\n\t\t\ttextareaClassName,\n\t\t\tpreviewClassName,\n\t\t\tlabel,\n\t\t\tlabelClassName,\n\t\t\tisRequiredConditional,\n\t\t\trequired = false,\n\t\t\tshowPreviewOnModal = false,\n\t\t\tmaxLength,\n\t\t\tlinkTarget = '_blank',\n\t\t\terrorMessage,\n\t\t\ttooltip,\n\t\t\toriginalCase,\n\t\t\tsuffixIcon,\n\t\t\tisClearable,\n\t\t\tinputref,\n\t\t\tshowFormattingHelp = true,\n\t\t\tonKeyDown,\n\t\t\tnoIndent = false,\n\t\t\tshowMinimalPreview = false,\n\t\t\tacceptAdvanceContent = true,\n\t\t},\n\t\tref\n\t) => {\n\t\tconst [mode, setMode] = useState<RichMarkdownInputViewType>(\"edit\");\n\t\tconst [isPreviewOpen, setIsPreviewOpen] = useState(false);\n\t\tconst textareaRef = useRef<HTMLTextAreaElement>(null);\n\t\tconst inputId = id || `rich-md-input-${Math.random().toString(36).slice(2, 11)}`;\n\n\t\tconst charCount = value.length;\n\n\t\t/**\n\t\t * Insert markdown syntax at cursor position\n\t\t */\n\t\tconst insertMarkdown = (before: string, after: string = \"\", placeholder: string = \"\") => {\n\t\t\tconst textarea = (ref as React.RefObject<HTMLTextAreaElement>)?.current || textareaRef.current;\n\t\t\tif (!textarea) return;\n\n\t\t\tconst start = textarea.selectionStart;\n\t\t\tconst end = textarea.selectionEnd;\n\t\t\tconst selectedText = value.substring(start, end);\n\t\t\tconst textToInsert = selectedText || placeholder;\n\n\t\t\tconst newValue = value.substring(0, start) + before + textToInsert + after + value.substring(end);\n\t\t\tonChange(newValue);\n\n\t\t\t// Set cursor position after insertion\n\t\t\tsetTimeout(() => {\n\t\t\t\tconst newCursorPos = start + before.length + (selectedText ? selectedText.length : 0);\n\t\t\t\ttextarea.focus();\n\t\t\t\ttextarea.setSelectionRange(newCursorPos, newCursorPos + (selectedText ? 0 : placeholder.length));\n\t\t\t}, 0);\n\t\t};\n\n\t\t/**\n\t\t * Insert list item at cursor position\n\t\t */\n\t\tconst insertList = (prefix: string) => {\n\t\t\tconst textarea = (ref as React.RefObject<HTMLTextAreaElement>)?.current || textareaRef.current;\n\t\t\tif (!textarea) return;\n\n\t\t\tconst start = textarea.selectionStart;\n\t\t\tconst end = textarea.selectionEnd;\n\t\t\tconst lines = value.split('\\n');\n\n\t\t\t// Find which line(s) are selected\n\t\t\tlet currentPos = 0;\n\t\t\tlet startLine = 0;\n\t\t\tlet endLine = 0;\n\n\t\t\tfor (let i = 0; i < lines.length; i++) {\n\t\t\t\tif (currentPos <= start && start <= currentPos + lines[i].length + 1) {\n\t\t\t\t\tstartLine = i;\n\t\t\t\t}\n\t\t\t\tif (currentPos <= end && end <= currentPos + lines[i].length + 1) {\n\t\t\t\t\tendLine = i;\n\t\t\t\t\tbreak;\n\t\t\t\t}\n\t\t\t\tcurrentPos += lines[i].length + 1;\n\t\t\t}\n\n\t\t\t// Add list markers to selected lines\n\t\t\tconst newLines = lines.map((line, index) => {\n\t\t\t\tif (index >= startLine && index <= endLine) {\n\t\t\t\t\tif (line.trim() === '') return line;\n\t\t\t\t\t// Check if line already has a list marker\n\t\t\t\t\tif (prefix === '- ' && line.trim().startsWith('- ')) {\n\t\t\t\t\t\treturn line.replace(/^\\s*-\\s+/, '');\n\t\t\t\t\t}\n\t\t\t\t\tif (prefix.match(/^\\d+\\.\\s/) && line.trim().match(/^\\d+\\.\\s/)) {\n\t\t\t\t\t\treturn line.replace(/^\\s*\\d+\\.\\s+/, '');\n\t\t\t\t\t}\n\t\t\t\t\treturn prefix + line.trim();\n\t\t\t\t}\n\t\t\t\treturn line;\n\t\t\t});\n\n\t\t\tonChange(newLines.join('\\n'));\n\n\t\t\tsetTimeout(() => {\n\t\t\t\ttextarea.focus();\n\t\t\t}, 0);\n\t\t};\n\n\t\t/**\n\t\t * Handle keyboard shortcuts\n\t\t */\n\t\tconst handleKeyDownInternal = (e: React.KeyboardEvent<HTMLTextAreaElement>) => {\n\t\t\t// Call external handler first\n\t\t\tonKeyDown?.(e);\n\n\t\t\tif (e.metaKey || e.ctrlKey) {\n\t\t\t\tswitch (e.key.toLowerCase()) {\n\t\t\t\t\tcase 'b':\n\t\t\t\t\t\te.preventDefault();\n\t\t\t\t\t\tinsertMarkdown('**', '**', 'bold text');\n\t\t\t\t\t\tbreak;\n\t\t\t\t\tcase 'i':\n\t\t\t\t\t\te.preventDefault();\n\t\t\t\t\t\tinsertMarkdown('*', '*', 'italic text');\n\t\t\t\t\t\tbreak;\n\t\t\t\t\tcase 'u':\n\t\t\t\t\t\te.preventDefault();\n\t\t\t\t\t\tinsertMarkdown('<u>', '</u>', 'underlined text');\n\t\t\t\t\t\tbreak;\n\t\t\t\t\tcase 'k':\n\t\t\t\t\t\te.preventDefault();\n\t\t\t\t\t\tinsertMarkdown('[', '](url)', 'link text');\n\t\t\t\t\t\tbreak;\n\t\t\t\t\tcase 'e':\n\t\t\t\t\t\te.preventDefault();\n\t\t\t\t\t\tinsertMarkdown('```', '```', 'code');\n\t\t\t\t\t\tbreak;\n\t\t\t\t}\n\t\t\t}\n\t\t};\n\n\t\t/**\n\t\t * Handle clear button click\n\t\t */\n\t\tconst handleClear = () => {\n\t\t\tonChange('');\n\t\t\tconst textarea = (ref as React.RefObject<HTMLTextAreaElement>)?.current || textareaRef.current;\n\t\t\ttextarea?.focus();\n\t\t};\n\n\t\t/**\n\t\t * Calculate dynamic rows based on content\n\t\t */\n\t\tconst calculateRows = () => {\n\t\t\tconst lineCount = (value.match(/\\n/g) || []).length + 1;\n\t\t\treturn Math.min(maxRows, Math.max(minRows, lineCount));\n\t\t};\n\n\t\tconst rows = calculateRows();\n\n\t\tconst content = (\n\t\t\t<div className={cn(\"flex flex-col\", className)}>\n\t\t\t\t<div className={`flex flex-row items-center ${label ? \"justify-between\" : \"justify-end\"} w-full`}>\n\t\t\t\t\t{/* Label */}\n\t\t\t\t\t{label && (\n\t\t\t\t\t\t<label\n\t\t\t\t\t\t\tid={inputId}\n\t\t\t\t\t\t\thtmlFor={inputId}\n\t\t\t\t\t\t\tclassName={`mb-1 text-xs font-medium text-gray-600 inline-flex items-center gap-1 ${!originalCase ? \"capitalize\" : \"\"\n\t\t\t\t\t\t\t\t} ${labelClassName || \"!uppercse\"}`}\n\t\t\t\t\t\t>\n\t\t\t\t\t\t\t<div className=\"flex flex-wrap items-center justify-between w-full\">\n\t\t\t\t\t\t\t\t<div className=\"inline-flex flex-wrap items-center gap-1\">\n\t\t\t\t\t\t\t\t\t<InputLabel label={label || \"\"} required={required || false} isRequiredConditional={isRequiredConditional || false} />\n\t\t\t\t\t\t\t\t</div>\n\t\t\t\t\t\t\t</div>\n\t\t\t\t\t\t</label>\n\t\t\t\t\t)}\n\n\t\t\t\t\t{/* Markdown Formatting Info */}\n\t\t\t\t\t{showFormattingHelp && (\n\t\t\t\t\t\t<Tooltip\n\t\t\t\t\t\t\tplacement=\"bottom-end\"\n\t\t\t\t\t\t\ttitle={\n\t\t\t\t\t\t\t\t<div className=\"flex flex-col items-start justify-center py-2 px-3 min-w-[220px] gap-2 bg-neutral-900 rounded-lg\">\n\t\t\t\t\t\t\t\t\t<div className=\"flex flex-col items-start justify-start gap-1 w-full\">\n\t\t\t\t\t\t\t\t\t\t<div className=\"flex flex-row items-start gap-1 ml-1\">\n\t\t\t\t\t\t\t\t\t\t\t<span className=\"text-white text-[18px] leading-4\">•</span>\n\t\t\t\t\t\t\t\t\t\t\t<div className=\"flex flex-row justify-center items-center px-[3px] bg-neutral-700 rounded-sm\">\n\t\t\t\t\t\t\t\t\t\t\t\t<span className=\"text-neutral-300 text-xs font-medium leading-4 font-inter\">**bold**</span>\n\t\t\t\t\t\t\t\t\t\t\t</div>\n\t\t\t\t\t\t\t\t\t\t\t<span className=\"text-white text-xs font-medium leading-4 font-inter\">\n\t\t\t\t\t\t\t\t\t\t\t\t→ <strong>bold</strong> text\n\t\t\t\t\t\t\t\t\t\t\t</span>\n\t\t\t\t\t\t\t\t\t\t</div>\n\t\t\t\t\t\t\t\t\t\t<div className=\"flex flex-row items-start gap-1 ml-1\">\n\t\t\t\t\t\t\t\t\t\t\t<span className=\"text-white text-[18px] leading-4\">•</span>\n\t\t\t\t\t\t\t\t\t\t\t<div className=\"flex flex-row justify-center items-center px-[3px] bg-neutral-700 rounded-sm\">\n\t\t\t\t\t\t\t\t\t\t\t\t<span className=\"text-neutral-300 text-xs font-medium leading-4 font-inter\">*italic*</span>\n\t\t\t\t\t\t\t\t\t\t\t</div>\n\t\t\t\t\t\t\t\t\t\t\t<span className=\"text-white text-xs font-medium leading-4 font-inter\">\n\t\t\t\t\t\t\t\t\t\t\t\t→ <em>italic</em> text\n\t\t\t\t\t\t\t\t\t\t\t</span>\n\t\t\t\t\t\t\t\t\t\t</div>\n\t\t\t\t\t\t\t\t\t\t<div className=\"flex flex-row items-start gap-1 ml-1\">\n\t\t\t\t\t\t\t\t\t\t\t<span className=\"text-white text-[18px] leading-4\">•</span>\n\t\t\t\t\t\t\t\t\t\t\t<div className=\"flex flex-row justify-center items-center px-[3px] bg-neutral-700 rounded-sm\">\n\t\t\t\t\t\t\t\t\t\t\t\t<span className=\"text-neutral-300 text-xs font-medium leading-4 font-inter\">`code`</span>\n\t\t\t\t\t\t\t\t\t\t\t</div>\n\t\t\t\t\t\t\t\t\t\t\t<span className=\"text-white text-xs font-medium leading-4 font-inter\">\n\t\t\t\t\t\t\t\t\t\t\t\t→ <code>inline code</code>\n\t\t\t\t\t\t\t\t\t\t\t</span>\n\t\t\t\t\t\t\t\t\t\t</div>\n\t\t\t\t\t\t\t\t\t\t<div className=\"flex flex-row items-start gap-1 ml-1\">\n\t\t\t\t\t\t\t\t\t\t\t<span className=\"text-white text-[18px] leading-4\">•</span>\n\t\t\t\t\t\t\t\t\t\t\t<div className=\"flex flex-row justify-center items-center px-[3px] bg-neutral-700 rounded-sm\">\n\t\t\t\t\t\t\t\t\t\t\t\t<span className=\"text-neutral-300 text-xs font-medium leading-4 font-inter\">&lt;u&gt;text&lt;/u&gt;</span>\n\t\t\t\t\t\t\t\t\t\t\t</div>\n\t\t\t\t\t\t\t\t\t\t\t<span className=\"text-white text-xs font-medium leading-4 font-inter\">\n\t\t\t\t\t\t\t\t\t\t\t\t→ <u>underline</u>\n\t\t\t\t\t\t\t\t\t\t\t</span>\n\t\t\t\t\t\t\t\t\t\t</div>\n\t\t\t\t\t\t\t\t\t\t<div className=\"flex flex-row items-start gap-1 ml-1\">\n\t\t\t\t\t\t\t\t\t\t\t<span className=\"text-white text-[18px] leading-4\">•</span>\n\t\t\t\t\t\t\t\t\t\t\t<div className=\"flex flex-row justify-center items-center px-[3px] bg-neutral-700 rounded-sm\">\n\t\t\t\t\t\t\t\t\t\t\t\t<span className=\"text-neutral-300 text-xs font-medium leading-4 font-inter\">~~strike~~</span>\n\t\t\t\t\t\t\t\t\t\t\t</div>\n\t\t\t\t\t\t\t\t\t\t\t<span className=\"text-white text-xs font-medium leading-4 font-inter\">\n\t\t\t\t\t\t\t\t\t\t\t\t→ <del>strike</del>\n\t\t\t\t\t\t\t\t\t\t\t</span>\n\t\t\t\t\t\t\t\t\t\t</div>\n\t\t\t\t\t\t\t\t\t\t<div className=\"flex flex-row items-start gap-1 ml-1\">\n\t\t\t\t\t\t\t\t\t\t\t<span className=\"text-white text-[18px] leading-4\">•</span>\n\t\t\t\t\t\t\t\t\t\t\t<div className=\"flex flex-row justify-center items-center px-[3px] bg-neutral-700 rounded-sm\">\n\t\t\t\t\t\t\t\t\t\t\t\t<span className=\"text-neutral-300 text-xs font-medium leading-4 font-inter\">- item</span>\n\t\t\t\t\t\t\t\t\t\t\t</div>\n\t\t\t\t\t\t\t\t\t\t\t<span className=\"text-white text-xs font-medium leading-4 font-inter\">\n\t\t\t\t\t\t\t\t\t\t\t\t→ bullet list\n\t\t\t\t\t\t\t\t\t\t\t</span>\n\t\t\t\t\t\t\t\t\t\t</div>\n\t\t\t\t\t\t\t\t\t\t<div className=\"flex flex-row items-start gap-1 ml-1\">\n\t\t\t\t\t\t\t\t\t\t\t<span className=\"text-white text-[18px] leading-4\">•</span>\n\t\t\t\t\t\t\t\t\t\t\t<div className=\"flex flex-row justify-center items-center px-[3px] bg-neutral-700 rounded-sm\">\n\t\t\t\t\t\t\t\t\t\t\t\t<span className=\"text-neutral-300 text-xs font-medium leading-4 font-inter\">1. item</span>\n\t\t\t\t\t\t\t\t\t\t\t</div>\n\t\t\t\t\t\t\t\t\t\t\t<span className=\"text-white text-xs font-medium leading-4 font-inter\">\n\t\t\t\t\t\t\t\t\t\t\t\t→ numbered list\n\t\t\t\t\t\t\t\t\t\t\t</span>\n\t\t\t\t\t\t\t\t\t\t</div>\n\t\t\t\t\t\t\t\t\t\t{acceptAdvanceContent && (\n\t\t\t\t\t\t\t\t\t\t\t<div className=\"flex flex-row items-start gap-1 ml-1\">\n\t\t\t\t\t\t\t\t\t\t\t\t<span className=\"text-white text-[18px] leading-4\">•</span>\n\t\t\t\t\t\t\t\t\t\t\t\t<div className=\"flex flex-row justify-center items-center px-[3px] bg-neutral-700 rounded-sm\">\n\t\t\t\t\t\t\t\t\t\t\t\t\t<span className=\"text-neutral-300 text-xs font-medium leading-4 font-inter\">## heading</span>\n\t\t\t\t\t\t\t\t\t\t\t\t</div>\n\t\t\t\t\t\t\t\t\t\t\t\t<span className=\"text-white text-xs font-medium leading-4 font-inter\">\n\t\t\t\t\t\t\t\t\t\t\t\t\t→ heading 2\n\t\t\t\t\t\t\t\t\t\t\t\t</span>\n\t\t\t\t\t\t\t\t\t\t\t</div>\n\t\t\t\t\t\t\t\t\t\t)}\n\t\t\t\t\t\t\t\t\t\t<div className=\"flex flex-row items-start gap-1 ml-1\">\n\t\t\t\t\t\t\t\t\t\t\t<span className=\"text-white text-[18px] leading-4\">•</span>\n\t\t\t\t\t\t\t\t\t\t\t<div className=\"flex flex-row justify-center items-center px-[3px] bg-neutral-700 rounded-sm\">\n\t\t\t\t\t\t\t\t\t\t\t\t<span className=\"text-neutral-300 text-xs font-medium leading-4 font-inter\">[link](url)</span>\n\t\t\t\t\t\t\t\t\t\t\t</div>\n\t\t\t\t\t\t\t\t\t\t\t<span className=\"text-white text-xs font-medium leading-4 font-inter\">\n\t\t\t\t\t\t\t\t\t\t\t\t→ hyperlink\n\t\t\t\t\t\t\t\t\t\t\t</span>\n\t\t\t\t\t\t\t\t\t\t</div>\n\t\t\t\t\t\t\t\t\t</div>\n\n\t\t\t\t\t\t\t\t\t{acceptAdvanceContent && (\n\t\t\t\t\t\t\t\t\t\t<>\n\t\t\t\t\t\t\t\t\t\t\t<div className=\"flex flex-col items-start justify-start gap-1 w-full\">\n\t\t\t\t\t\t\t\t\t\t\t\t<div className=\"flex flex-row items-start gap-1 ml-1\">\n\t\t\t\t\t\t\t\t\t\t\t\t\t<span className=\"text-white text-[18px] leading-4\">•</span>\n\t\t\t\t\t\t\t\t\t\t\t\t\t<div className=\"flex flex-row justify-center items-center px-[3px] bg-neutral-700 rounded-sm\">\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t<span className=\"text-neutral-300 text-xs font-medium leading-4 font-inter\">&gt; quote</span>\n\t\t\t\t\t\t\t\t\t\t\t\t\t</div>\n\t\t\t\t\t\t\t\t\t\t\t\t\t<span className=\"text-white text-xs font-medium leading-4 font-inter\">\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t→ blockquote\n\t\t\t\t\t\t\t\t\t\t\t\t\t</span>\n\t\t\t\t\t\t\t\t\t\t\t\t</div>\n\t\t\t\t\t\t\t\t\t\t\t\t<div className=\"flex flex-col items-start justify-start gap-0.5 w-full mt-0.5\">\n\t\t\t\t\t\t\t\t\t\t\t\t\t<div className=\"flex flex-row items-center gap-1 ml-1\">\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t<span className=\"text-white text-[18px] leading-4\">•</span>\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t<span className=\"text-white text-xs font-medium leading-4 font-inter\">\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\tTable:\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t</span>\n\t\t\t\t\t\t\t\t\t\t\t\t\t</div>\n\t\t\t\t\t\t\t\t\t\t\t\t\t<div className=\"flex flex-col px-1 py-0.5 bg-neutral-700 ml-2 rounded-sm gap-0\">\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t<span className=\"text-neutral-300 text-xs font-medium leading-4 font-inter whitespace-nowrap\">| Header 1 | Header 2 | Header 3 |</span>\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t<span className=\"text-neutral-300 text-xs font-medium leading-4 font-inter whitespace-nowrap\">| :--- | :---: | ---: |</span>\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t<span className=\"text-neutral-300 text-xs font-medium leading-4 font-inter whitespace-nowrap\">| Left | Center | Right |</span>\n\t\t\t\t\t\t\t\t\t\t\t\t\t</div>\n\t\t\t\t\t\t\t\t\t\t\t\t</div>\n\t\t\t\t\t\t\t\t\t\t\t</div>\n\t\t\t\t\t\t\t\t\t\t</>\n\t\t\t\t\t\t\t\t\t)}\n\t\t\t\t\t\t\t\t</div>\n\t\t\t\t\t\t\t}\n\t\t\t\t\t\t>\n\t\t\t\t\t\t\t<Typography className=\"mb-2 text-xs font-medium text-primary-700 inline-flex items-center gap-1 cursor-pointer\">\n\t\t\t\t\t\t\t\tFormatting help ?\n\t\t\t\t\t\t\t</Typography>\n\t\t\t\t\t\t</Tooltip>\n\t\t\t\t\t)}\n\t\t\t\t</div>\n\n\t\t\t\t{/* Main Container */}\n\t\t\t\t<div className={cn(\n\t\t\t\t\t\"flex flex-col border shadow-[0px_1px_2px_rgba(0,0,0,0.05)] rounded-lg bg-white dark:bg-black-700 w-full\",\n\t\t\t\t\terrorMessage\n\t\t\t\t\t\t? \"border-red-300 focus-within:border-red-500 focus-within:shadow-[0_0_0_1.5px_var(--color-red-200)]\"\n\t\t\t\t\t\t: \"border-[#EAECF0] dark:border-black-600 focus-within:border-primary-600 dark:focus-within:border-primary-400 focus-within:shadow-[0_0_0_1.5px_var(--color-primary-100)] dark:focus-within:shadow-[0_0_0_1.5px_var(--color-primary-950)]\"\n\t\t\t\t)}>\n\t\t\t\t\t{/* Toolbar */}\n\t\t\t\t\t<div className={cn(\n\t\t\t\t\t\t\"flex flex-row justify-between items-center px-3 py-2 gap-2 h-11 rounded-t-lg bg-[#F9FAFB] dark:bg-black-600 border-b border-[#EAECF0] dark:border-black-600\"\n\t\t\t\t\t)}>\n\t\t\t\t\t\t{/* Left: Formatting Buttons */}\n\t\t\t\t\t\t<div className=\"flex items-center gap-2\">\n\t\t\t\t\t\t\t<Button\n\t\t\t\t\t\t\t\tid={`${inputId}-bold`}\n\t\t\t\t\t\t\t\ttype=\"button\"\n\t\t\t\t\t\t\t\tonClick={() => insertMarkdown('**', '**', 'bold text')}\n\t\t\t\t\t\t\t\tdisabled={isDisabled || mode === \"preview\"}\n\t\t\t\t\t\t\t\tclassName=\"!p-0.5 !min-w-0 !h-auto !rounded-md hover:!bg-neutral-200 dark:hover:!bg-black-500 hover:!scale-110 !transition-all !duration-200\"\n\t\t\t\t\t\t\t\tappearance=\"ghost\"\n\t\t\t\t\t\t\t\tstatus=\"no-background\"\n\t\t\t\t\t\t\t\ttitle=\"Bold (Ctrl+B)\"\n\t\t\t\t\t\t\t>\n\t\t\t\t\t\t\t\t<FormatBold sx={{ fontSize: 20, color: '#667085' }} className=\"dark:text-neutral-400\" />\n\t\t\t\t\t\t\t</Button>\n\n\t\t\t\t\t\t\t<Button\n\t\t\t\t\t\t\t\tid={`${inputId}-italic`}\n\t\t\t\t\t\t\t\ttype=\"button\"\n\t\t\t\t\t\t\t\tonClick={() => insertMarkdown('*', '*', 'italic text')}\n\t\t\t\t\t\t\t\tdisabled={isDisabled || mode === \"preview\"}\n\t\t\t\t\t\t\t\tclassName=\"!p-0.5 !min-w-0 !h-auto !rounded-md hover:!bg-neutral-200 dark:hover:!bg-black-500 hover:!scale-110 !transition-all !duration-200\"\n\t\t\t\t\t\t\t\tappearance=\"ghost\"\n\t\t\t\t\t\t\t\tstatus=\"no-background\"\n\t\t\t\t\t\t\t\ttitle=\"Italic (Ctrl+I)\"\n\t\t\t\t\t\t\t>\n\t\t\t\t\t\t\t\t<FormatItalic sx={{ fontSize: 20, color: '#667085' }} className=\"dark:text-neutral-400\" />\n\t\t\t\t\t\t\t</Button>\n\n\t\t\t\t\t\t\t<Button\n\t\t\t\t\t\t\t\tid={`${inputId}-underline`}\n\t\t\t\t\t\t\t\ttype=\"button\"\n\t\t\t\t\t\t\t\tonClick={() => insertMarkdown('<u>', '</u>', 'underlined text')}\n\t\t\t\t\t\t\t\tdisabled={isDisabled || mode === \"preview\"}\n\t\t\t\t\t\t\t\tclassName=\"!p-0.5 !min-w-0 !h-auto !rounded-md hover:!bg-neutral-200 dark:hover:!bg-black-500 hover:!scale-110 !transition-all !duration-200\"\n\t\t\t\t\t\t\t\tappearance=\"ghost\"\n\t\t\t\t\t\t\t\tstatus=\"no-background\"\n\t\t\t\t\t\t\t\ttitle=\"Underline (Ctrl+U)\"\n\t\t\t\t\t\t\t>\n\t\t\t\t\t\t\t\t<FormatUnderlined sx={{ fontSize: 20, color: '#667085' }} className=\"dark:text-neutral-400\" />\n\t\t\t\t\t\t\t</Button>\n\n\t\t\t\t\t\t\t<div className=\"w-px h-5 bg-[#EAECF0] dark:bg-black-500 rounded-full\" />\n\n\t\t\t\t\t\t\t<Button\n\t\t\t\t\t\t\t\tid={`${inputId}-numbered-list`}\n\t\t\t\t\t\t\t\ttype=\"button\"\n\t\t\t\t\t\t\t\tonClick={() => insertList('1. ')}\n\t\t\t\t\t\t\t\tdisabled={isDisabled || mode === \"preview\"}\n\t\t\t\t\t\t\t\tclassName=\"!p-0.5 !min-w-0 !h-auto !rounded-md hover:!bg-neutral-200 dark:hover:!bg-black-500 hover:!scale-110 !transition-all !duration-200\"\n\t\t\t\t\t\t\t\tappearance=\"ghost\"\n\t\t\t\t\t\t\t\tstatus=\"no-background\"\n\t\t\t\t\t\t\t\ttitle=\"Numbered List\"\n\t\t\t\t\t\t\t>\n\t\t\t\t\t\t\t\t<FormatListNumbered sx={{ fontSize: 20, color: '#667085' }} className=\"dark:text-neutral-400\" />\n\t\t\t\t\t\t\t</Button>\n\n\t\t\t\t\t\t\t<Button\n\t\t\t\t\t\t\t\tid={`${inputId}-bullet-list`}\n\t\t\t\t\t\t\t\ttype=\"button\"\n\t\t\t\t\t\t\t\tonClick={() => insertList('- ')}\n\t\t\t\t\t\t\t\tdisabled={isDisabled || mode === \"preview\"}\n\t\t\t\t\t\t\t\tclassName=\"!p-0.5 !min-w-0 !h-auto !rounded-md hover:!bg-neutral-200 dark:hover:!bg-black-500 hover:!scale-110 !transition-all !duration-200\"\n\t\t\t\t\t\t\t\tappearance=\"ghost\"\n\t\t\t\t\t\t\t\tstatus=\"no-background\"\n\t\t\t\t\t\t\t\ttitle=\"Bullet List\"\n\t\t\t\t\t\t\t>\n\t\t\t\t\t\t\t\t<FormatListBulleted sx={{ fontSize: 20, color: '#667085' }} className=\"dark:text-neutral-400\" />\n\t\t\t\t\t\t\t</Button>\n\t\t\t\t\t\t</div>\n\n\t\t\t\t\t\t<div className=\"flex items-center gap-2\">\n\t\t\t\t\t\t\t{/* Center: Character Count */}\n\t\t\t\t\t\t\t{maxLength && (\n\t\t\t\t\t\t\t\t<div className=\"flex items-center gap-3\">\n\t\t\t\t\t\t\t\t\t<span className=\"text-sm font-medium text-[#475467] dark:text-neutral-400\">\n\t\t\t\t\t\t\t\t\t\t{charCount}/{maxLength}\n\t\t\t\t\t\t\t\t\t</span>\n\t\t\t\t\t\t\t\t\t<div className=\"w-px h-6 bg-[#EAECF0] dark:bg-black-500 rounded-full\" />\n\t\t\t\t\t\t\t\t</div>\n\t\t\t\t\t\t\t)}\n\n\t\t\t\t\t\t\t{/* Right: Edit/Preview Toggle */}\n\t\t\t\t\t\t\t{showPreviewOnModal ? (\n\t\t\t\t\t\t\t\t<Button\n\t\t\t\t\t\t\t\t\tid={`${inputId}-expand`}\n\t\t\t\t\t\t\t\t\ttype=\"button\"\n\t\t\t\t\t\t\t\t\tonClick={() => setIsPreviewOpen(true)}\n\t\t\t\t\t\t\t\t\tdisabled={isDisabled}\n\t\t\t\t\t\t\t\t\tclassName=\"!p-0.5 !min-w-0 !h-auto ml-1 !rounded-md hover:!bg-neutral-200 dark:hover:!bg-black-500 hover:!scale-110 !transition-all !duration-200\"\n\t\t\t\t\t\t\t\t\tappearance=\"ghost\"\n\t\t\t\t\t\t\t\t\tstatus=\"no-background\"\n\t\t\t\t\t\t\t\t\ttitle=\"Expand Preview\"\n\t\t\t\t\t\t\t\t>\n\t\t\t\t\t\t\t\t\t<OpenInFull sx={{ fontSize: 16, color: '#667085' }} className=\"dark:text-neutral-400\" />\n\t\t\t\t\t\t\t\t</Button>\n\t\t\t\t\t\t\t) : (\n\t\t\t\t\t\t\t\t<Tabs<RichMarkdownInputViewType>\n\t\t\t\t\t\t\t\t\tvariant=\"switch\"\n\t\t\t\t\t\t\t\t\ttabs={RichMarkdownInputTabs}\n\t\t\t\t\t\t\t\t\tactiveTab={mode}\n\t\t\t\t\t\t\t\t\tonTabClick={(tab) => setMode(tab)}\n\t\t\t\t\t\t\t\t\theight=\"h-5\"\n\t\t\t\t\t\t\t\t\ticonsOnly\n\t\t\t\t\t\t\t\t\ttabIcons={{\n\t\t\t\t\t\t\t\t\t\tedit: (<Edit sx={{ fontSize: 16, color: '#667085' }} className=\"dark:text-neutral-400\" />),\n\t\t\t\t\t\t\t\t\t\tpreview: (\n\t\t\t\t\t\t\t\t\t\t\t<VisibilityOutlined sx={{ fontSize: 16, color: '#667085' }} className=\"dark:text-neutral-400\" />\n\t\t\t\t\t\t\t\t\t\t),\n\t\t\t\t\t\t\t\t\t}}\n\t\t\t\t\t\t\t\t\tclassName=\"rounded-lg\"\n\t\t\t\t\t\t\t\t/>\n\t\t\t\t\t\t\t)}\n\t\t\t\t\t\t</div>\n\t\t\t\t\t</div>\n\n\t\t\t\t\t{/* Content Area */}\n\t\t\t\t\t<div className=\"px-3 py-2 relative\">\n\t\t\t\t\t\t{mode === \"edit\" ? (\n\t\t\t\t\t\t\t<>\n\t\t\t\t\t\t\t\t<textarea\n\t\t\t\t\t\t\t\t\tref={(node) => {\n\t\t\t\t\t\t\t\t\t\t// Handle all refs: forwarded ref, internal ref, and inputref\n\t\t\t\t\t\t\t\t\t\tif (typeof ref === 'function') {\n\t\t\t\t\t\t\t\t\t\t\tref(node);\n\t\t\t\t\t\t\t\t\t\t} else if (ref) {\n\t\t\t\t\t\t\t\t\t\t\t(ref as React.MutableRefObject<HTMLTextAreaElement | null>).current = node;\n\t\t\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t\t\t\t(textareaRef as React.MutableRefObject<HTMLTextAreaElement | null>).current = node;\n\t\t\t\t\t\t\t\t\t\tif (inputref) {\n\t\t\t\t\t\t\t\t\t\t\t(inputref as React.MutableRefObject<HTMLTextAreaElement | null>).current = node;\n\t\t\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t\t\t}}\n\t\t\t\t\t\t\t\t\tid={inputId}\n\t\t\t\t\t\t\t\t\tvalue={value}\n\t\t\t\t\t\t\t\t\tdefaultValue={defaultValue}\n\t\t\t\t\t\t\t\t\tonChange={(e) => {\n\t\t\t\t\t\t\t\t\t\tconst newValue = originalCase ? e.target.value : e.target.value;\n\t\t\t\t\t\t\t\t\t\tif (!maxLength || newValue.length <= maxLength) {\n\t\t\t\t\t\t\t\t\t\t\tonChange(newValue);\n\t\t\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t\t\t}}\n\t\t\t\t\t\t\t\t\tonKeyDown={handleKeyDownInternal}\n\t\t\t\t\t\t\t\t\tplaceholder={placeholder}\n\t\t\t\t\t\t\t\t\trows={rows}\n\t\t\t\t\t\t\t\t\tdisabled={isDisabled}\n\t\t\t\t\t\t\t\t\trequired={required}\n\t\t\t\t\t\t\t\t\tmaxLength={maxLength}\n\t\t\t\t\t\t\t\t\tclassName={cn(\n\t\t\t\t\t\t\t\t\t\t// Base styles\n\t\t\t\t\t\t\t\t\t\t\"w-full bg-transparent !focus:ring-0 !focus:border-none\",\n\t\t\t\t\t\t\t\t\t\t\"font-inter font-medium text-sm leading-5\",\n\t\t\t\t\t\t\t\t\t\t\"text-[#101828] dark:text-neutral-100\",\n\t\t\t\t\t\t\t\t\t\t\"placeholder:text-neutral-400 dark:placeholder:text-neutral-500\",\n\t\t\t\t\t\t\t\t\t\t\"focus:outline-none resize-none\",\n\t\t\t\t\t\t\t\t\t\t// Hide scrollbar\n\t\t\t\t\t\t\t\t\t\t\"scrollbar-none\",\n\t\t\t\t\t\t\t\t\t\t\"[&::-webkit-scrollbar]:hidden\",\n\t\t\t\t\t\t\t\t\t\t\"[-ms-overflow-style:none]\",\n\t\t\t\t\t\t\t\t\t\t\"[scrollbar-width:none]\",\n\t\t\t\t\t\t\t\t\t\t// Disabled state\n\t\t\t\t\t\t\t\t\t\t{\n\t\t\t\t\t\t\t\t\t\t\t\"text-neutral-400 dark:text-neutral-500 cursor-not-allowed\": isDisabled,\n\t\t\t\t\t\t\t\t\t\t},\n\t\t\t\t\t\t\t\t\t\t// Add padding if suffix icons exist\n\t\t\t\t\t\t\t\t\t\t{\n\t\t\t\t\t\t\t\t\t\t\t\"pr-20\": isClearable || suffixIcon,\n\t\t\t\t\t\t\t\t\t\t},\n\t\t\t\t\t\t\t\t\t\ttextareaClassName\n\t\t\t\t\t\t\t\t\t)}\n\t\t\t\t\t\t\t\t/>\n\n\t\t\t\t\t\t\t\t{/* Suffix Icons */}\n\t\t\t\t\t\t\t\t{(isClearable || suffixIcon) && mode === \"edit\" && (\n\t\t\t\t\t\t\t\t\t<div className=\"absolute right-1 top-2 flex items-center gap-1\">\n\t\t\t\t\t\t\t\t\t\t{isClearable && value && (\n\t\t\t\t\t\t\t\t\t\t\t<button\n\t\t\t\t\t\t\t\t\t\t\t\tid={`btn-input-field-clear-${id}`}\n\t\t\t\t\t\t\t\t\t\t\t\tclassName=\"absolute inset-y-0 flex items-center cursor-pointer top-2 right-1 focus:outline-none\"\n\t\t\t\t\t\t\t\t\t\t\t\tonClick={handleClear}\n\t\t\t\t\t\t\t\t\t\t\t\ttype=\"button\"\n\t\t\t\t\t\t\t\t\t\t\t>\n\t\t\t\t\t\t\t\t\t\t\t\t<CloseIcon\n\t\t\t\t\t\t\t\t\t\t\t\t\tclassName=\"text-neutral-300 dark:text-black-500 hover:text-neutral-400 dark:hover:text-black-400 transition-colors\"\n\t\t\t\t\t\t\t\t\t\t\t\t\tsize={16}\n\t\t\t\t\t\t\t\t\t\t\t\t/>\n\t\t\t\t\t\t\t\t\t\t\t</button>\n\t\t\t\t\t\t\t\t\t\t)}\n\t\t\t\t\t\t\t\t\t\t{suffixIcon && <div className=\"flex items-center\">{suffixIcon}</div>}\n\t\t\t\t\t\t\t\t\t</div>\n\t\t\t\t\t\t\t\t)}\n\t\t\t\t\t\t\t</>\n\t\t\t\t\t\t) : (\n\t\t\t\t\t\t\t<div className=\"w-full min-h-[92px] max-h-[400px] overflow-y-auto\">\n\t\t\t\t\t\t\t\t<MarkdownPreview\n\t\t\t\t\t\t\t\t\tcontent={value}\n\t\t\t\t\t\t\t\t\tlinkTarget={linkTarget}\n\t\t\t\t\t\t\t\t\tclassName={previewClassName}\n\t\t\t\t\t\t\t\t\tnoIndent={noIndent}\n\t\t\t\t\t\t\t\t\tshowMinimalPreview={showMinimalPreview}\n\t\t\t\t\t\t\t\t\tacceptAdvanceContent={acceptAdvanceContent}\n\t\t\t\t\t\t\t\t/>\n\t\t\t\t\t\t\t</div>\n\t\t\t\t\t\t)}\n\t\t\t\t\t</div>\n\t\t\t\t</div>\n\n\t\t\t\t{/* Expanded Preview Modal */}\n\t\t\t\t<Modal\n\t\t\t\t\topen={isPreviewOpen}\n\t\t\t\t\tonCancel={() => setIsPreviewOpen(false)}\n\t\t\t\t\ttitle=\"Markdown Preview\"\n\t\t\t\t\twidth={900}\n\t\t\t\t\tfooter={null}\n\t\t\t\t>\n\t\t\t\t\t<div className=\"max-h-[calc(100vh-200px)] overflow-y-auto p-4\">\n\t\t\t\t\t\t<MarkdownPreview\n\t\t\t\t\t\t\tcontent={value}\n\t\t\t\t\t\t\tlinkTarget={linkTarget}\n\t\t\t\t\t\t\tclassName={previewClassName}\n\t\t\t\t\t\t\tnoIndent={noIndent}\n\t\t\t\t\t\t\tshowMinimalPreview={showMinimalPreview}\n\t\t\t\t\t\t\tacceptAdvanceContent={acceptAdvanceContent}\n\t\t\t\t\t\t/>\n\t\t\t\t\t</div>\n\t\t\t\t</Modal>\n\n\t\t\t\t<AnimatePresence>\n\t\t\t\t\t{errorMessage && (\n\t\t\t\t\t\t<motion.div\n\t\t\t\t\t\t\tinitial={{ opacity: 0, y: -10 }}\n\t\t\t\t\t\t\tanimate={{ opacity: 1, y: 0 }}\n\t\t\t\t\t\t\texit={{ opacity: 0, y: -10 }}\n\t\t\t\t\t\t\ttransition={{ duration: 0.2 }}\n\t\t\t\t\t\t>\n\t\t\t\t\t\t\t<Typography\n\t\t\t\t\t\t\t\tclassName=\"mt-1 text-error-500\"\n\t\t\t\t\t\t\t\tappearance=\"custom\"\n\t\t\t\t\t\t\t\tsize=\"extra-small\"\n\t\t\t\t\t\t\t\tvariant=\"medium\"\n\t\t\t\t\t\t\t>\n\t\t\t\t\t\t\t\t{errorMessage}\n\t\t\t\t\t\t\t</Typography>\n\t\t\t\t\t\t</motion.div>\n\t\t\t\t\t)}\n\t\t\t\t</AnimatePresence>\n\t\t\t</div>\n\t\t);\n\n\t\treturn tooltip ? (\n\t\t\t<Tooltip title={tooltip}>\n\t\t\t\t{content}\n\t\t\t</Tooltip>\n\t\t) : (\n\t\t\tcontent\n\t\t);\n\t}\n);\n\nRichMarkdownInput.displayName = \"RichMarkdownInput\";\n"],"names":["RichMarkdownInputTabs","CloseIcon","className","size","jsxs","jsx","RichMarkdownInput","forwardRef","id","value","defaultValue","onChange","placeholder","minRows","maxRows","isDisabled","textareaClassName","previewClassName","label","labelClassName","isRequiredConditional","required","showPreviewOnModal","maxLength","linkTarget","errorMessage","tooltip","originalCase","suffixIcon","isClearable","inputref","showFormattingHelp","onKeyDown","noIndent","showMinimalPreview","acceptAdvanceContent","ref","mode","setMode","useState","isPreviewOpen","setIsPreviewOpen","textareaRef","useRef","inputId","charCount","insertMarkdown","before","after","textarea","start","end","selectedText","textToInsert","newValue","newCursorPos","insertList","prefix","lines","currentPos","startLine","endLine","i","newLines","line","index","handleKeyDownInternal","e","handleClear","rows","lineCount","content","cn","InputLabel","Tooltip","Fragment","Typography","Button","FormatBold","FormatItalic","FormatUnderlined","FormatListNumbered","FormatListBulleted","OpenInFull","Tabs","tab","Edit","VisibilityOutlined","node","MarkdownPreview","Modal","AnimatePresence","motion"],"mappings":"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"}

package/dist/components/forms/number-input-field/NumberInputField.cjs.js

@@ -1,2 +1,2 @@
-"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const n=require("react/jsx-runtime"),f=require("../../../_virtual/index.cjs.js"),x=require("react"),k=require("../../data-display/typography/Typography.cjs.js"),F=(r,i,e)=>{if(r==null||r==="")return"";const t=typeof r=="string"?parseFloat(r):r;if(isNaN(t))return String(r);const a=e!==void 0?t.toFixed(e):t;switch(i){case"comma":return Number(a).toLocaleString("en-US",{minimumFractionDigits:e,maximumFractionDigits:e});case"currency":return Number(a).toLocaleString("en-US",{style:"currency",currency:"USD",minimumFractionDigits:e??2,maximumFractionDigits:e??2});case"percent":return`${Number(a).toLocaleString("en-US",{minimumFractionDigits:e,maximumFractionDigits:e})}%`;default:return String(a)}},l=({label:r,className:i,disabled:e,onChange:t,value:a,numberFormat:u,precision:d=void 0,id:m,style:b,...p})=>{const[s,c]=x.useState(!1),g=()=>{c(!0)},y=o=>{c(!1),t?.(o.target.value)};return n.jsxs("div",{className:"flex flex-col gap-1",children:[r&&n.jsx(k.Typography,{size:"extra-small",variant:"regular",appearance:"subtitle",children:r}),n.jsx("input",{id:m,type:s?"number":"text",className:f("border border-neutral-200 dark:border-black-600 rounded-md block w-full px-3 py-1.5 h-[32px] font-medium text-sm text-neutral-900 dark:text-black-100","bg-white dark:bg-black-600 disabled:opacity-70 disabled:!bg-neutral-50 dark:disabled:!bg-black-800 dark:disabled:placeholder:!text-black-400","hover:border-primary-500 dark:hover:border-primary-400","focus:outline-none focus:ring-0 focus:border-primary-600 dark:focus:border-primary-400","focus:shadow-[0_0_0_1.5px_var(--color-primary-100)] dark:focus:shadow-[0_0_0_1.5px_var(--color-primary-950)]",i),disabled:e,onChange:({target:o})=>t&&t(o.value),onFocus:g,onBlur:y,value:!s&&u?F(a,u,d):a,style:{fontStyle:"inherit",...b},autoComplete:"off",...p})]})};l.displayName="NumberInputField";exports.NumberInputField=l;
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const n=require("react/jsx-runtime"),f=require("../../../_virtual/index.cjs.js"),x=require("react"),k=require("../../data-display/typography/Typography.cjs.js"),F=(r,i,e)=>{if(r==null||r==="")return"";const t=typeof r=="string"?parseFloat(r):r;if(isNaN(t))return String(r);const a=e!==void 0?t.toFixed(e):t;switch(i){case"comma":return Number(a).toLocaleString("en-US",{minimumFractionDigits:e,maximumFractionDigits:e});case"currency":return Number(a).toLocaleString("en-US",{style:"currency",currency:"USD",minimumFractionDigits:e??2,maximumFractionDigits:e??2});case"percent":return`${Number(a).toLocaleString("en-US",{minimumFractionDigits:e,maximumFractionDigits:e})}%`;default:return String(a)}},l=({label:r,className:i,disabled:e,onChange:t,value:a,numberFormat:u,precision:d=void 0,id:m,style:b,...p})=>{const[s,c]=x.useState(!1),g=()=>{c(!0)},y=o=>{c(!1),t?.(o.target.value)};return n.jsxs("div",{className:"flex flex-col gap-1",children:[r&&n.jsx(k.Typography,{size:"extra-small",variant:"regular",appearance:"subtitle",children:r}),n.jsx("input",{id:m,type:s?"number":"text",className:f("border border-neutral-200 dark:border-black-600 rounded-md block w-full px-3 py-1.5 h-8 font-medium text-sm text-neutral-900 dark:text-black-100","bg-white dark:bg-black-600 disabled:opacity-70 disabled:!bg-neutral-50 dark:disabled:!bg-black-800 dark:disabled:placeholder:!text-black-400","hover:border-primary-500 dark:hover:border-primary-400","focus:outline-none focus:ring-0 focus:border-primary-600 dark:focus:border-primary-400","focus:shadow-[0_0_0_1.5px_var(--color-primary-100)] dark:focus:shadow-[0_0_0_1.5px_var(--color-primary-950)]",i),disabled:e,onChange:({target:o})=>t&&t(o.value),onFocus:g,onBlur:y,value:!s&&u?F(a,u,d):a,style:{fontStyle:"inherit",...b},autoComplete:"off",...p})]})};l.displayName="NumberInputField";exports.NumberInputField=l;
 //# sourceMappingURL=NumberInputField.cjs.js.map

package/dist/components/forms/number-input-field/NumberInputField.cjs.js.map

@@ -1 +1 @@
-{"version":3,"file":"NumberInputField.cjs.js","sources":["../../../../src/components/forms/number-input-field/NumberInputField.tsx"],"sourcesContent":["import cn from \"classnames\";\nimport type { FC } from \"react\";\nimport { useState } from \"react\";\nimport { Typography } from \"../../data-display/typography/Typography\";\n\n/**\n * Format a number according to the specified format\n */\nconst formatNumber = (\n  value: string | number | undefined,\n  format: string,\n  precision?: number\n): string => {\n  if (value === undefined || value === null || value === \"\") {\n    return \"\";\n  }\n\n  const numValue = typeof value === \"string\" ? parseFloat(value) : value;\n\n  if (isNaN(numValue)) {\n    return String(value);\n  }\n\n  // Apply precision if specified\n  const preciseValue =\n    precision !== undefined ? numValue.toFixed(precision) : numValue;\n\n  // Format based on the format string\n  switch (format) {\n    case \"comma\":\n      return Number(preciseValue).toLocaleString(\"en-US\", {\n        minimumFractionDigits: precision,\n        maximumFractionDigits: precision,\n      });\n    case \"currency\":\n      return Number(preciseValue).toLocaleString(\"en-US\", {\n        style: \"currency\",\n        currency: \"USD\",\n        minimumFractionDigits: precision ?? 2,\n        maximumFractionDigits: precision ?? 2,\n      });\n    case \"percent\":\n      return `${Number(preciseValue).toLocaleString(\"en-US\", {\n        minimumFractionDigits: precision,\n        maximumFractionDigits: precision,\n      })}%`;\n    default:\n      return String(preciseValue);\n  }\n};\n\n/**\n * Props for the NumberInputField component\n */\nexport interface NumberInputFieldProps {\n  /** Label text to display above the input */\n  label?: string;\n  /** Additional CSS classes for the input */\n  className?: string;\n  /** Whether the input is disabled */\n  disabled?: boolean;\n  /** Callback when the value changes */\n  onChange?: (value: string | number) => void;\n  /** Current value of the input */\n  value?: string | number;\n  /** Placeholder text */\n  placeholder?: string;\n  /** Minimum allowed value */\n  min?: number;\n  /** Maximum allowed value */\n  max?: number;\n  /** Step increment for number input */\n  step?: number;\n  /** Number format type: 'comma', 'currency', 'percent' */\n  numberFormat?: string;\n  /** Number of decimal places */\n  precision?: number;\n  /** Unique identifier for the input */\n  id?: string;\n  /** Custom inline styles */\n  style?: React.CSSProperties;\n}\n\n/**\n * NumberInputField component provides a number input with optional formatting\n *\n * @example\n * ```tsx\n * <NumberInputField\n *   label=\"Amount\"\n *   value={1000}\n *   onChange={setValue}\n *   numberFormat=\"comma\"\n *   precision={2}\n * />\n * ```\n */\nexport const NumberInputField: FC<NumberInputFieldProps> = ({\n  label,\n  className,\n  disabled,\n  onChange,\n  value,\n  numberFormat,\n  precision = undefined,\n  id,\n  style,\n  ...props\n}) => {\n  const [isFocused, setIsFocused] = useState(false);\n\n  const onFocus = () => {\n    setIsFocused(true);\n  };\n\n  const onBlur = (e: React.FocusEvent<HTMLInputElement>) => {\n    setIsFocused(false);\n    onChange?.(e.target.value);\n  };\n\n  return (\n    <div className=\"flex flex-col gap-1\">\n      {label && (\n        <Typography size=\"extra-small\" variant=\"regular\" appearance=\"subtitle\">\n          {label}\n        </Typography>\n      )}\n      <input\n        id={id}\n        type={isFocused ? \"number\" : \"text\"}\n        className={cn(\n          \"border border-neutral-200 dark:border-black-600 rounded-md block w-full px-3 py-1.5 h-[32px] font-medium text-sm text-neutral-900 dark:text-black-100\",\n          \"bg-white dark:bg-black-600 disabled:opacity-70 disabled:!bg-neutral-50 dark:disabled:!bg-black-800 dark:disabled:placeholder:!text-black-400\",\n          \"hover:border-primary-500 dark:hover:border-primary-400\",\n          \"focus:outline-none focus:ring-0 focus:border-primary-600 dark:focus:border-primary-400\",\n          \"focus:shadow-[0_0_0_1.5px_var(--color-primary-100)] dark:focus:shadow-[0_0_0_1.5px_var(--color-primary-950)]\",\n          className\n        )}\n        disabled={disabled}\n        onChange={({ target }) => onChange && onChange(target.value)}\n        onFocus={onFocus}\n        onBlur={onBlur}\n        value={\n          !isFocused && numberFormat\n            ? formatNumber(value, numberFormat, precision)\n            : value\n        }\n        style={{\n          fontStyle: \"inherit\",\n          ...style,\n        }}\n        autoComplete=\"off\"\n        {...props}\n      />\n    </div>\n  );\n};\n\nNumberInputField.displayName = \"NumberInputField\";\n\n"],"names":["formatNumber","value","format","precision","numValue","preciseValue","NumberInputField","label","className","disabled","onChange","numberFormat","id","style","props","isFocused","setIsFocused","useState","onFocus","onBlur","e","jsxs","jsx","Typography","cn","target"],"mappings":"iPAQMA,EAAe,CACnBC,EACAC,EACAC,IACW,CACX,GAA2BF,GAAU,MAAQA,IAAU,GACrD,MAAO,GAGT,MAAMG,EAAW,OAAOH,GAAU,SAAW,WAAWA,CAAK,EAAIA,EAEjE,GAAI,MAAMG,CAAQ,EAChB,OAAO,OAAOH,CAAK,EAIrB,MAAMI,EACJF,IAAc,OAAYC,EAAS,QAAQD,CAAS,EAAIC,EAG1D,OAAQF,EAAA,CACN,IAAK,QACH,OAAO,OAAOG,CAAY,EAAE,eAAe,QAAS,CAClD,sBAAuBF,EACvB,sBAAuBA,CAAA,CACxB,EACH,IAAK,WACH,OAAO,OAAOE,CAAY,EAAE,eAAe,QAAS,CAClD,MAAO,WACP,SAAU,MACV,sBAAuBF,GAAa,EACpC,sBAAuBA,GAAa,CAAA,CACrC,EACH,IAAK,UACH,MAAO,GAAG,OAAOE,CAAY,EAAE,eAAe,QAAS,CACrD,sBAAuBF,EACvB,sBAAuBA,CAAA,CACxB,CAAC,IACJ,QACE,OAAO,OAAOE,CAAY,CAAA,CAEhC,EAgDaC,EAA8C,CAAC,CAC1D,MAAAC,EACA,UAAAC,EACA,SAAAC,EACA,SAAAC,EACA,MAAAT,EACA,aAAAU,EACA,UAAAR,EAAY,OACZ,GAAAS,EACA,MAAAC,EACA,GAAGC,CACL,IAAM,CACJ,KAAM,CAACC,EAAWC,CAAY,EAAIC,EAAAA,SAAS,EAAK,EAE1CC,EAAU,IAAM,CACpBF,EAAa,EAAI,CACnB,EAEMG,EAAUC,GAA0C,CACxDJ,EAAa,EAAK,EAClBN,IAAWU,EAAE,OAAO,KAAK,CAC3B,EAEA,OACEC,EAAAA,KAAC,MAAA,CAAI,UAAU,sBACZ,SAAA,CAAAd,GACCe,EAAAA,IAACC,cAAW,KAAK,cAAc,QAAQ,UAAU,WAAW,WACzD,SAAAhB,CAAA,CACH,EAEFe,EAAAA,IAAC,QAAA,CACC,GAAAV,EACA,KAAMG,EAAY,SAAW,OAC7B,UAAWS,EACT,wJACA,+IACA,yDACA,yFACA,+GACAhB,CAAA,EAEF,SAAAC,EACA,SAAU,CAAC,CAAE,OAAAgB,CAAA,IAAaf,GAAYA,EAASe,EAAO,KAAK,EAC3D,QAAAP,EACA,OAAAC,EACA,MACE,CAACJ,GAAaJ,EACVX,EAAaC,EAAOU,EAAcR,CAAS,EAC3CF,EAEN,MAAO,CACL,UAAW,UACX,GAAGY,CAAA,EAEL,aAAa,MACZ,GAAGC,CAAA,CAAA,CACN,EACF,CAEJ,EAEAR,EAAiB,YAAc"}
+{"version":3,"file":"NumberInputField.cjs.js","sources":["../../../../src/components/forms/number-input-field/NumberInputField.tsx"],"sourcesContent":["import cn from \"classnames\";\nimport type { FC } from \"react\";\nimport { useState } from \"react\";\nimport { Typography } from \"../../data-display/typography/Typography\";\n\n/**\n * Format a number according to the specified format\n */\nconst formatNumber = (\n  value: string | number | undefined,\n  format: string,\n  precision?: number\n): string => {\n  if (value === undefined || value === null || value === \"\") {\n    return \"\";\n  }\n\n  const numValue = typeof value === \"string\" ? parseFloat(value) : value;\n\n  if (isNaN(numValue)) {\n    return String(value);\n  }\n\n  // Apply precision if specified\n  const preciseValue =\n    precision !== undefined ? numValue.toFixed(precision) : numValue;\n\n  // Format based on the format string\n  switch (format) {\n    case \"comma\":\n      return Number(preciseValue).toLocaleString(\"en-US\", {\n        minimumFractionDigits: precision,\n        maximumFractionDigits: precision,\n      });\n    case \"currency\":\n      return Number(preciseValue).toLocaleString(\"en-US\", {\n        style: \"currency\",\n        currency: \"USD\",\n        minimumFractionDigits: precision ?? 2,\n        maximumFractionDigits: precision ?? 2,\n      });\n    case \"percent\":\n      return `${Number(preciseValue).toLocaleString(\"en-US\", {\n        minimumFractionDigits: precision,\n        maximumFractionDigits: precision,\n      })}%`;\n    default:\n      return String(preciseValue);\n  }\n};\n\n/**\n * Props for the NumberInputField component\n */\nexport interface NumberInputFieldProps {\n  /** Label text to display above the input */\n  label?: string;\n  /** Additional CSS classes for the input */\n  className?: string;\n  /** Whether the input is disabled */\n  disabled?: boolean;\n  /** Callback when the value changes */\n  onChange?: (value: string | number) => void;\n  /** Current value of the input */\n  value?: string | number;\n  /** Placeholder text */\n  placeholder?: string;\n  /** Minimum allowed value */\n  min?: number;\n  /** Maximum allowed value */\n  max?: number;\n  /** Step increment for number input */\n  step?: number;\n  /** Number format type: 'comma', 'currency', 'percent' */\n  numberFormat?: string;\n  /** Number of decimal places */\n  precision?: number;\n  /** Unique identifier for the input */\n  id?: string;\n  /** Custom inline styles */\n  style?: React.CSSProperties;\n}\n\n/**\n * NumberInputField component provides a number input with optional formatting\n *\n * @example\n * ```tsx\n * <NumberInputField\n *   label=\"Amount\"\n *   value={1000}\n *   onChange={setValue}\n *   numberFormat=\"comma\"\n *   precision={2}\n * />\n * ```\n */\nexport const NumberInputField: FC<NumberInputFieldProps> = ({\n  label,\n  className,\n  disabled,\n  onChange,\n  value,\n  numberFormat,\n  precision = undefined,\n  id,\n  style,\n  ...props\n}) => {\n  const [isFocused, setIsFocused] = useState(false);\n\n  const onFocus = () => {\n    setIsFocused(true);\n  };\n\n  const onBlur = (e: React.FocusEvent<HTMLInputElement>) => {\n    setIsFocused(false);\n    onChange?.(e.target.value);\n  };\n\n  return (\n    <div className=\"flex flex-col gap-1\">\n      {label && (\n        <Typography size=\"extra-small\" variant=\"regular\" appearance=\"subtitle\">\n          {label}\n        </Typography>\n      )}\n      <input\n        id={id}\n        type={isFocused ? \"number\" : \"text\"}\n        className={cn(\n          \"border border-neutral-200 dark:border-black-600 rounded-md block w-full px-3 py-1.5 h-8 font-medium text-sm text-neutral-900 dark:text-black-100\",\n          \"bg-white dark:bg-black-600 disabled:opacity-70 disabled:!bg-neutral-50 dark:disabled:!bg-black-800 dark:disabled:placeholder:!text-black-400\",\n          \"hover:border-primary-500 dark:hover:border-primary-400\",\n          \"focus:outline-none focus:ring-0 focus:border-primary-600 dark:focus:border-primary-400\",\n          \"focus:shadow-[0_0_0_1.5px_var(--color-primary-100)] dark:focus:shadow-[0_0_0_1.5px_var(--color-primary-950)]\",\n          className\n        )}\n        disabled={disabled}\n        onChange={({ target }) => onChange && onChange(target.value)}\n        onFocus={onFocus}\n        onBlur={onBlur}\n        value={\n          !isFocused && numberFormat\n            ? formatNumber(value, numberFormat, precision)\n            : value\n        }\n        style={{\n          fontStyle: \"inherit\",\n          ...style,\n        }}\n        autoComplete=\"off\"\n        {...props}\n      />\n    </div>\n  );\n};\n\nNumberInputField.displayName = \"NumberInputField\";\n\n"],"names":["formatNumber","value","format","precision","numValue","preciseValue","NumberInputField","label","className","disabled","onChange","numberFormat","id","style","props","isFocused","setIsFocused","useState","onFocus","onBlur","e","jsxs","jsx","Typography","cn","target"],"mappings":"iPAQMA,EAAe,CACnBC,EACAC,EACAC,IACW,CACX,GAA2BF,GAAU,MAAQA,IAAU,GACrD,MAAO,GAGT,MAAMG,EAAW,OAAOH,GAAU,SAAW,WAAWA,CAAK,EAAIA,EAEjE,GAAI,MAAMG,CAAQ,EAChB,OAAO,OAAOH,CAAK,EAIrB,MAAMI,EACJF,IAAc,OAAYC,EAAS,QAAQD,CAAS,EAAIC,EAG1D,OAAQF,EAAA,CACN,IAAK,QACH,OAAO,OAAOG,CAAY,EAAE,eAAe,QAAS,CAClD,sBAAuBF,EACvB,sBAAuBA,CAAA,CACxB,EACH,IAAK,WACH,OAAO,OAAOE,CAAY,EAAE,eAAe,QAAS,CAClD,MAAO,WACP,SAAU,MACV,sBAAuBF,GAAa,EACpC,sBAAuBA,GAAa,CAAA,CACrC,EACH,IAAK,UACH,MAAO,GAAG,OAAOE,CAAY,EAAE,eAAe,QAAS,CACrD,sBAAuBF,EACvB,sBAAuBA,CAAA,CACxB,CAAC,IACJ,QACE,OAAO,OAAOE,CAAY,CAAA,CAEhC,EAgDaC,EAA8C,CAAC,CAC1D,MAAAC,EACA,UAAAC,EACA,SAAAC,EACA,SAAAC,EACA,MAAAT,EACA,aAAAU,EACA,UAAAR,EAAY,OACZ,GAAAS,EACA,MAAAC,EACA,GAAGC,CACL,IAAM,CACJ,KAAM,CAACC,EAAWC,CAAY,EAAIC,EAAAA,SAAS,EAAK,EAE1CC,EAAU,IAAM,CACpBF,EAAa,EAAI,CACnB,EAEMG,EAAUC,GAA0C,CACxDJ,EAAa,EAAK,EAClBN,IAAWU,EAAE,OAAO,KAAK,CAC3B,EAEA,OACEC,EAAAA,KAAC,MAAA,CAAI,UAAU,sBACZ,SAAA,CAAAd,GACCe,EAAAA,IAACC,cAAW,KAAK,cAAc,QAAQ,UAAU,WAAW,WACzD,SAAAhB,CAAA,CACH,EAEFe,EAAAA,IAAC,QAAA,CACC,GAAAV,EACA,KAAMG,EAAY,SAAW,OAC7B,UAAWS,EACT,mJACA,+IACA,yDACA,yFACA,+GACAhB,CAAA,EAEF,SAAAC,EACA,SAAU,CAAC,CAAE,OAAAgB,CAAA,IAAaf,GAAYA,EAASe,EAAO,KAAK,EAC3D,QAAAP,EACA,OAAAC,EACA,MACE,CAACJ,GAAaJ,EACVX,EAAaC,EAAOU,EAAcR,CAAS,EAC3CF,EAEN,MAAO,CACL,UAAW,UACX,GAAGY,CAAA,EAEL,aAAa,MACZ,GAAGC,CAAA,CAAA,CACN,EACF,CAEJ,EAEAR,EAAiB,YAAc"}

package/dist/components/forms/number-input-field/NumberInputField.es.js

@@ -1,6 +1,6 @@
 import { jsxs as g, jsx as c } from "react/jsx-runtime";
-import x from "../../../_virtual/index.es.js";
-import { useState as y } from "react";
+import y from "../../../_virtual/index.es.js";
+import { useState as x } from "react";
 import { Typography as k } from "../../data-display/typography/Typography.es.js";
 const F = (r, o, t) => {
   if (r == null || r === "")
@@ -42,7 +42,7 @@ const F = (r, o, t) => {
   style: d,
   ...b
 }) => {
-  const [n, s] = y(!1), p = () => {
+  const [n, s] = x(!1), p = () => {
     s(!0);
   }, f = (i) => {
     s(!1), e?.(i.target.value);
@@ -54,8 +54,8 @@ const F = (r, o, t) => {
       {
         id: l,
         type: n ? "number" : "text",
-        className: x(
-          "border border-neutral-200 dark:border-black-600 rounded-md block w-full px-3 py-1.5 h-[32px] font-medium text-sm text-neutral-900 dark:text-black-100",
+        className: y(
+          "border border-neutral-200 dark:border-black-600 rounded-md block w-full px-3 py-1.5 h-8 font-medium text-sm text-neutral-900 dark:text-black-100",
           "bg-white dark:bg-black-600 disabled:opacity-70 disabled:!bg-neutral-50 dark:disabled:!bg-black-800 dark:disabled:placeholder:!text-black-400",
           "hover:border-primary-500 dark:hover:border-primary-400",
           "focus:outline-none focus:ring-0 focus:border-primary-600 dark:focus:border-primary-400",

package/dist/components/forms/number-input-field/NumberInputField.es.js.map

@@ -1 +1 @@
-{"version":3,"file":"NumberInputField.es.js","sources":["../../../../src/components/forms/number-input-field/NumberInputField.tsx"],"sourcesContent":["import cn from \"classnames\";\nimport type { FC } from \"react\";\nimport { useState } from \"react\";\nimport { Typography } from \"../../data-display/typography/Typography\";\n\n/**\n * Format a number according to the specified format\n */\nconst formatNumber = (\n  value: string | number | undefined,\n  format: string,\n  precision?: number\n): string => {\n  if (value === undefined || value === null || value === \"\") {\n    return \"\";\n  }\n\n  const numValue = typeof value === \"string\" ? parseFloat(value) : value;\n\n  if (isNaN(numValue)) {\n    return String(value);\n  }\n\n  // Apply precision if specified\n  const preciseValue =\n    precision !== undefined ? numValue.toFixed(precision) : numValue;\n\n  // Format based on the format string\n  switch (format) {\n    case \"comma\":\n      return Number(preciseValue).toLocaleString(\"en-US\", {\n        minimumFractionDigits: precision,\n        maximumFractionDigits: precision,\n      });\n    case \"currency\":\n      return Number(preciseValue).toLocaleString(\"en-US\", {\n        style: \"currency\",\n        currency: \"USD\",\n        minimumFractionDigits: precision ?? 2,\n        maximumFractionDigits: precision ?? 2,\n      });\n    case \"percent\":\n      return `${Number(preciseValue).toLocaleString(\"en-US\", {\n        minimumFractionDigits: precision,\n        maximumFractionDigits: precision,\n      })}%`;\n    default:\n      return String(preciseValue);\n  }\n};\n\n/**\n * Props for the NumberInputField component\n */\nexport interface NumberInputFieldProps {\n  /** Label text to display above the input */\n  label?: string;\n  /** Additional CSS classes for the input */\n  className?: string;\n  /** Whether the input is disabled */\n  disabled?: boolean;\n  /** Callback when the value changes */\n  onChange?: (value: string | number) => void;\n  /** Current value of the input */\n  value?: string | number;\n  /** Placeholder text */\n  placeholder?: string;\n  /** Minimum allowed value */\n  min?: number;\n  /** Maximum allowed value */\n  max?: number;\n  /** Step increment for number input */\n  step?: number;\n  /** Number format type: 'comma', 'currency', 'percent' */\n  numberFormat?: string;\n  /** Number of decimal places */\n  precision?: number;\n  /** Unique identifier for the input */\n  id?: string;\n  /** Custom inline styles */\n  style?: React.CSSProperties;\n}\n\n/**\n * NumberInputField component provides a number input with optional formatting\n *\n * @example\n * ```tsx\n * <NumberInputField\n *   label=\"Amount\"\n *   value={1000}\n *   onChange={setValue}\n *   numberFormat=\"comma\"\n *   precision={2}\n * />\n * ```\n */\nexport const NumberInputField: FC<NumberInputFieldProps> = ({\n  label,\n  className,\n  disabled,\n  onChange,\n  value,\n  numberFormat,\n  precision = undefined,\n  id,\n  style,\n  ...props\n}) => {\n  const [isFocused, setIsFocused] = useState(false);\n\n  const onFocus = () => {\n    setIsFocused(true);\n  };\n\n  const onBlur = (e: React.FocusEvent<HTMLInputElement>) => {\n    setIsFocused(false);\n    onChange?.(e.target.value);\n  };\n\n  return (\n    <div className=\"flex flex-col gap-1\">\n      {label && (\n        <Typography size=\"extra-small\" variant=\"regular\" appearance=\"subtitle\">\n          {label}\n        </Typography>\n      )}\n      <input\n        id={id}\n        type={isFocused ? \"number\" : \"text\"}\n        className={cn(\n          \"border border-neutral-200 dark:border-black-600 rounded-md block w-full px-3 py-1.5 h-[32px] font-medium text-sm text-neutral-900 dark:text-black-100\",\n          \"bg-white dark:bg-black-600 disabled:opacity-70 disabled:!bg-neutral-50 dark:disabled:!bg-black-800 dark:disabled:placeholder:!text-black-400\",\n          \"hover:border-primary-500 dark:hover:border-primary-400\",\n          \"focus:outline-none focus:ring-0 focus:border-primary-600 dark:focus:border-primary-400\",\n          \"focus:shadow-[0_0_0_1.5px_var(--color-primary-100)] dark:focus:shadow-[0_0_0_1.5px_var(--color-primary-950)]\",\n          className\n        )}\n        disabled={disabled}\n        onChange={({ target }) => onChange && onChange(target.value)}\n        onFocus={onFocus}\n        onBlur={onBlur}\n        value={\n          !isFocused && numberFormat\n            ? formatNumber(value, numberFormat, precision)\n            : value\n        }\n        style={{\n          fontStyle: \"inherit\",\n          ...style,\n        }}\n        autoComplete=\"off\"\n        {...props}\n      />\n    </div>\n  );\n};\n\nNumberInputField.displayName = \"NumberInputField\";\n\n"],"names":["formatNumber","value","format","precision","numValue","preciseValue","NumberInputField","label","className","disabled","onChange","numberFormat","id","style","props","isFocused","setIsFocused","useState","onFocus","onBlur","e","jsxs","jsx","Typography","cn","target"],"mappings":";;;;AAQA,MAAMA,IAAe,CACnBC,GACAC,GACAC,MACW;AACX,MAA2BF,KAAU,QAAQA,MAAU;AACrD,WAAO;AAGT,QAAMG,IAAW,OAAOH,KAAU,WAAW,WAAWA,CAAK,IAAIA;AAEjE,MAAI,MAAMG,CAAQ;AAChB,WAAO,OAAOH,CAAK;AAIrB,QAAMI,IACJF,MAAc,SAAYC,EAAS,QAAQD,CAAS,IAAIC;AAG1D,UAAQF,GAAA;AAAA,IACN,KAAK;AACH,aAAO,OAAOG,CAAY,EAAE,eAAe,SAAS;AAAA,QAClD,uBAAuBF;AAAA,QACvB,uBAAuBA;AAAA,MAAA,CACxB;AAAA,IACH,KAAK;AACH,aAAO,OAAOE,CAAY,EAAE,eAAe,SAAS;AAAA,QAClD,OAAO;AAAA,QACP,UAAU;AAAA,QACV,uBAAuBF,KAAa;AAAA,QACpC,uBAAuBA,KAAa;AAAA,MAAA,CACrC;AAAA,IACH,KAAK;AACH,aAAO,GAAG,OAAOE,CAAY,EAAE,eAAe,SAAS;AAAA,QACrD,uBAAuBF;AAAA,QACvB,uBAAuBA;AAAA,MAAA,CACxB,CAAC;AAAA,IACJ;AACE,aAAO,OAAOE,CAAY;AAAA,EAAA;AAEhC,GAgDaC,IAA8C,CAAC;AAAA,EAC1D,OAAAC;AAAA,EACA,WAAAC;AAAA,EACA,UAAAC;AAAA,EACA,UAAAC;AAAA,EACA,OAAAT;AAAA,EACA,cAAAU;AAAA,EACA,WAAAR,IAAY;AAAA,EACZ,IAAAS;AAAA,EACA,OAAAC;AAAA,EACA,GAAGC;AACL,MAAM;AACJ,QAAM,CAACC,GAAWC,CAAY,IAAIC,EAAS,EAAK,GAE1CC,IAAU,MAAM;AACpB,IAAAF,EAAa,EAAI;AAAA,EACnB,GAEMG,IAAS,CAACC,MAA0C;AACxD,IAAAJ,EAAa,EAAK,GAClBN,IAAWU,EAAE,OAAO,KAAK;AAAA,EAC3B;AAEA,SACE,gBAAAC,EAAC,OAAA,EAAI,WAAU,uBACZ,UAAA;AAAA,IAAAd,KACC,gBAAAe,EAACC,KAAW,MAAK,eAAc,SAAQ,WAAU,YAAW,YACzD,UAAAhB,EAAA,CACH;AAAA,IAEF,gBAAAe;AAAA,MAAC;AAAA,MAAA;AAAA,QACC,IAAAV;AAAA,QACA,MAAMG,IAAY,WAAW;AAAA,QAC7B,WAAWS;AAAA,UACT;AAAA,UACA;AAAA,UACA;AAAA,UACA;AAAA,UACA;AAAA,UACAhB;AAAA,QAAA;AAAA,QAEF,UAAAC;AAAA,QACA,UAAU,CAAC,EAAE,QAAAgB,EAAA,MAAaf,KAAYA,EAASe,EAAO,KAAK;AAAA,QAC3D,SAAAP;AAAA,QACA,QAAAC;AAAA,QACA,OACE,CAACJ,KAAaJ,IACVX,EAAaC,GAAOU,GAAcR,CAAS,IAC3CF;AAAA,QAEN,OAAO;AAAA,UACL,WAAW;AAAA,UACX,GAAGY;AAAA,QAAA;AAAA,QAEL,cAAa;AAAA,QACZ,GAAGC;AAAA,MAAA;AAAA,IAAA;AAAA,EACN,GACF;AAEJ;AAEAR,EAAiB,cAAc;"}
+{"version":3,"file":"NumberInputField.es.js","sources":["../../../../src/components/forms/number-input-field/NumberInputField.tsx"],"sourcesContent":["import cn from \"classnames\";\nimport type { FC } from \"react\";\nimport { useState } from \"react\";\nimport { Typography } from \"../../data-display/typography/Typography\";\n\n/**\n * Format a number according to the specified format\n */\nconst formatNumber = (\n  value: string | number | undefined,\n  format: string,\n  precision?: number\n): string => {\n  if (value === undefined || value === null || value === \"\") {\n    return \"\";\n  }\n\n  const numValue = typeof value === \"string\" ? parseFloat(value) : value;\n\n  if (isNaN(numValue)) {\n    return String(value);\n  }\n\n  // Apply precision if specified\n  const preciseValue =\n    precision !== undefined ? numValue.toFixed(precision) : numValue;\n\n  // Format based on the format string\n  switch (format) {\n    case \"comma\":\n      return Number(preciseValue).toLocaleString(\"en-US\", {\n        minimumFractionDigits: precision,\n        maximumFractionDigits: precision,\n      });\n    case \"currency\":\n      return Number(preciseValue).toLocaleString(\"en-US\", {\n        style: \"currency\",\n        currency: \"USD\",\n        minimumFractionDigits: precision ?? 2,\n        maximumFractionDigits: precision ?? 2,\n      });\n    case \"percent\":\n      return `${Number(preciseValue).toLocaleString(\"en-US\", {\n        minimumFractionDigits: precision,\n        maximumFractionDigits: precision,\n      })}%`;\n    default:\n      return String(preciseValue);\n  }\n};\n\n/**\n * Props for the NumberInputField component\n */\nexport interface NumberInputFieldProps {\n  /** Label text to display above the input */\n  label?: string;\n  /** Additional CSS classes for the input */\n  className?: string;\n  /** Whether the input is disabled */\n  disabled?: boolean;\n  /** Callback when the value changes */\n  onChange?: (value: string | number) => void;\n  /** Current value of the input */\n  value?: string | number;\n  /** Placeholder text */\n  placeholder?: string;\n  /** Minimum allowed value */\n  min?: number;\n  /** Maximum allowed value */\n  max?: number;\n  /** Step increment for number input */\n  step?: number;\n  /** Number format type: 'comma', 'currency', 'percent' */\n  numberFormat?: string;\n  /** Number of decimal places */\n  precision?: number;\n  /** Unique identifier for the input */\n  id?: string;\n  /** Custom inline styles */\n  style?: React.CSSProperties;\n}\n\n/**\n * NumberInputField component provides a number input with optional formatting\n *\n * @example\n * ```tsx\n * <NumberInputField\n *   label=\"Amount\"\n *   value={1000}\n *   onChange={setValue}\n *   numberFormat=\"comma\"\n *   precision={2}\n * />\n * ```\n */\nexport const NumberInputField: FC<NumberInputFieldProps> = ({\n  label,\n  className,\n  disabled,\n  onChange,\n  value,\n  numberFormat,\n  precision = undefined,\n  id,\n  style,\n  ...props\n}) => {\n  const [isFocused, setIsFocused] = useState(false);\n\n  const onFocus = () => {\n    setIsFocused(true);\n  };\n\n  const onBlur = (e: React.FocusEvent<HTMLInputElement>) => {\n    setIsFocused(false);\n    onChange?.(e.target.value);\n  };\n\n  return (\n    <div className=\"flex flex-col gap-1\">\n      {label && (\n        <Typography size=\"extra-small\" variant=\"regular\" appearance=\"subtitle\">\n          {label}\n        </Typography>\n      )}\n      <input\n        id={id}\n        type={isFocused ? \"number\" : \"text\"}\n        className={cn(\n          \"border border-neutral-200 dark:border-black-600 rounded-md block w-full px-3 py-1.5 h-8 font-medium text-sm text-neutral-900 dark:text-black-100\",\n          \"bg-white dark:bg-black-600 disabled:opacity-70 disabled:!bg-neutral-50 dark:disabled:!bg-black-800 dark:disabled:placeholder:!text-black-400\",\n          \"hover:border-primary-500 dark:hover:border-primary-400\",\n          \"focus:outline-none focus:ring-0 focus:border-primary-600 dark:focus:border-primary-400\",\n          \"focus:shadow-[0_0_0_1.5px_var(--color-primary-100)] dark:focus:shadow-[0_0_0_1.5px_var(--color-primary-950)]\",\n          className\n        )}\n        disabled={disabled}\n        onChange={({ target }) => onChange && onChange(target.value)}\n        onFocus={onFocus}\n        onBlur={onBlur}\n        value={\n          !isFocused && numberFormat\n            ? formatNumber(value, numberFormat, precision)\n            : value\n        }\n        style={{\n          fontStyle: \"inherit\",\n          ...style,\n        }}\n        autoComplete=\"off\"\n        {...props}\n      />\n    </div>\n  );\n};\n\nNumberInputField.displayName = \"NumberInputField\";\n\n"],"names":["formatNumber","value","format","precision","numValue","preciseValue","NumberInputField","label","className","disabled","onChange","numberFormat","id","style","props","isFocused","setIsFocused","useState","onFocus","onBlur","e","jsxs","jsx","Typography","cn","target"],"mappings":";;;;AAQA,MAAMA,IAAe,CACnBC,GACAC,GACAC,MACW;AACX,MAA2BF,KAAU,QAAQA,MAAU;AACrD,WAAO;AAGT,QAAMG,IAAW,OAAOH,KAAU,WAAW,WAAWA,CAAK,IAAIA;AAEjE,MAAI,MAAMG,CAAQ;AAChB,WAAO,OAAOH,CAAK;AAIrB,QAAMI,IACJF,MAAc,SAAYC,EAAS,QAAQD,CAAS,IAAIC;AAG1D,UAAQF,GAAA;AAAA,IACN,KAAK;AACH,aAAO,OAAOG,CAAY,EAAE,eAAe,SAAS;AAAA,QAClD,uBAAuBF;AAAA,QACvB,uBAAuBA;AAAA,MAAA,CACxB;AAAA,IACH,KAAK;AACH,aAAO,OAAOE,CAAY,EAAE,eAAe,SAAS;AAAA,QAClD,OAAO;AAAA,QACP,UAAU;AAAA,QACV,uBAAuBF,KAAa;AAAA,QACpC,uBAAuBA,KAAa;AAAA,MAAA,CACrC;AAAA,IACH,KAAK;AACH,aAAO,GAAG,OAAOE,CAAY,EAAE,eAAe,SAAS;AAAA,QACrD,uBAAuBF;AAAA,QACvB,uBAAuBA;AAAA,MAAA,CACxB,CAAC;AAAA,IACJ;AACE,aAAO,OAAOE,CAAY;AAAA,EAAA;AAEhC,GAgDaC,IAA8C,CAAC;AAAA,EAC1D,OAAAC;AAAA,EACA,WAAAC;AAAA,EACA,UAAAC;AAAA,EACA,UAAAC;AAAA,EACA,OAAAT;AAAA,EACA,cAAAU;AAAA,EACA,WAAAR,IAAY;AAAA,EACZ,IAAAS;AAAA,EACA,OAAAC;AAAA,EACA,GAAGC;AACL,MAAM;AACJ,QAAM,CAACC,GAAWC,CAAY,IAAIC,EAAS,EAAK,GAE1CC,IAAU,MAAM;AACpB,IAAAF,EAAa,EAAI;AAAA,EACnB,GAEMG,IAAS,CAACC,MAA0C;AACxD,IAAAJ,EAAa,EAAK,GAClBN,IAAWU,EAAE,OAAO,KAAK;AAAA,EAC3B;AAEA,SACE,gBAAAC,EAAC,OAAA,EAAI,WAAU,uBACZ,UAAA;AAAA,IAAAd,KACC,gBAAAe,EAACC,KAAW,MAAK,eAAc,SAAQ,WAAU,YAAW,YACzD,UAAAhB,EAAA,CACH;AAAA,IAEF,gBAAAe;AAAA,MAAC;AAAA,MAAA;AAAA,QACC,IAAAV;AAAA,QACA,MAAMG,IAAY,WAAW;AAAA,QAC7B,WAAWS;AAAA,UACT;AAAA,UACA;AAAA,UACA;AAAA,UACA;AAAA,UACA;AAAA,UACAhB;AAAA,QAAA;AAAA,QAEF,UAAAC;AAAA,QACA,UAAU,CAAC,EAAE,QAAAgB,EAAA,MAAaf,KAAYA,EAASe,EAAO,KAAK;AAAA,QAC3D,SAAAP;AAAA,QACA,QAAAC;AAAA,QACA,OACE,CAACJ,KAAaJ,IACVX,EAAaC,GAAOU,GAAcR,CAAS,IAC3CF;AAAA,QAEN,OAAO;AAAA,UACL,WAAW;AAAA,UACX,GAAGY;AAAA,QAAA;AAAA,QAEL,cAAa;AAAA,QACZ,GAAGC;AAAA,MAAA;AAAA,IAAA;AAAA,EACN,GACF;AAEJ;AAEAR,EAAiB,cAAc;"}

package/dist/components/forms/percentage-input/PercentageInputField.cjs.js

@@ -1,4 +1,4 @@
-"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("react/jsx-runtime"),s=require("../../../_virtual/index.cjs.js"),C=require("react"),T=require("antd"),G=require("react-i18next"),D=require("../../data-display/typography/Typography.cjs.js"),ee=require("../../data-display/label/Label.cjs.js"),$=require("@mui/icons-material"),te=require("../../icons/AIExtractedIndicator.cjs.js"),re=require("../../icons/AIStarIcon.cjs.js"),le=require("../../icons/HelpIcon.cjs.js"),_=require("../../tooltip/Tooltip.cjs.js"),l=require("../../../utils/confidenceScoreUtils.cjs.js"),ae=require("../shared/InputLabel.cjs.js"),z=C.forwardRef(({id:c,label:i,value:o,onChange:j,errorMessage:d,defaultValue:u,disabled:P,max:F,min:L,required:x=!1,isRequiredConditional:A=!1,bg:B,tags:E,color:H,className:M,originalCase:y=!1,tooltip:v,simpleMode:K=!1,inputFieldClassName:O="",isAiExtracted:R=!1,confidenceScore:m,confidenceType:a="high",confidenceTooltip:p,sourceMeta:U=[],onConfidenceScoreClick:J,isGTN:f=!1,gtnName:Q=null,inputStyle:k,withDollarSign:V=!0,labelClassName:I,isLiveField:W=!1,onBlur:N,onAddGTNToDocument:b,riskDetails:r,isRiskAnalysisOpen:g=!1,RiskDetailsCard:w,placeholder:X,...S},q)=>{const{t:Y}=G.useTranslation(),[n,h]=C.useState(!1),Z=t=>{b&&b({key:Q,value:t})};return K?e.jsxs("label",{id:c,className:`mb-1 text-xs font-medium text-gray-600 dark:text-neutral-200 inline-flex items-center gap-1 ${y?"":"capitalize"} ${I||""}`,children:[V&&e.jsx("span",{className:"absolute inset-y-0 left-1 flex items-center pl-3",children:"$"}),e.jsx("input",{...S,ref:q,onBlur:N,type:"number",required:x,className:s(O,"pl-8 h-[32px]"),onChange:t=>{j(t.target.value)},value:o,...u&&!o?{defaultValue:u}:{},id:c||i,style:k,autoComplete:"off"})]}):e.jsxs("div",{className:s("flex gap-0.5 relative",n&&f?"border rounded-lg border-primary-100 bg-primary-50 p-1":""),onMouseEnter:()=>h(!0),onMouseLeave:()=>h(!1),children:[f&&!n?e.jsx("div",{className:"w-1 h-1 bg-primary-600 rounded-full animate-blink mt-1.5"}):null,e.jsxs("div",{className:s("w-full flex flex-col",M),children:[e.jsx("label",{htmlFor:"text",className:`mb-1 text-xs font-medium text-gray-600 dark:text-neutral-300 inline-flex items-center gap-1 ${y?"":"uppercase"} ${I||""}`,children:e.jsxs("div",{className:"grid w-full grid-cols-[minmax(0,1fr)_auto] items-start gap-x-1",children:[e.jsxs("div",{className:"inline-flex min-w-0 items-center gap-1 flex-wrap dark:text-black-300",children:[e.jsx(ae.InputLabel,{label:i||"",required:x||!1,isRequiredConditional:A||!1}),W&&e.jsx($.BoltOutlined,{sx:{fontSize:16,color:"var(--color-primary-600)",rotate:"15deg"}}),R&&!l.shouldShowConfidenceScore(m)&&e.jsx(te.AIExtractedIndicator,{}),e.jsx(ee.Label,{labels:E}),v&&e.jsx(_,{placement:"top",title:v,children:e.jsx("div",{className:"cursor-pointer",children:e.jsx(le.HelpIcon,{})})})]}),e.jsxs("div",{className:"flex items-center gap-1 justify-self-end",children:[l.shouldShowConfidenceScore(m)&&a?e.jsx(_,{placement:"top-end",title:p??"",hideTooltip:p==null,className:"cursor-pointer",children:e.jsxs("div",{className:s("inline-flex min-w-[50px] items-center gap-1 rounded-md px-1 py-0.5",l.getConfidenceScoreBadgeClass(a)),onClick:()=>J?.(U),children:[e.jsx(re.AIStarIcon,{size:12,fill:l.getConfidenceScoreBadgeColor(a),fillSecondary:l.getConfidenceScoreBadgeFill(a)}),e.jsxs("span",{className:s("text-xs font-medium leading-4",l.getConfidenceScoreBadgeTextColor(a)),children:[m,"%"]})]})}):null,f&&n&&b?e.jsx("button",{id:"btn-percentage-input-add-to-document",className:"cursor-pointer",onClick:()=>Z(o?.toString()),type:"button",children:e.jsx(T.Tooltip,{placement:"top",title:Y("Add to document"),children:e.jsx($.NoteAddOutlined,{className:"text-primary-600",sx:{fontSize:16}})})}):null]})]})}),e.jsxs("label",{className:"relative block",children:[e.jsx("input",{...S,ref:q,onBlur:N,type:"number",required:x,disabled:P,min:L,max:F,className:`border ${d?"border-red-300":g&&r?.color?`border-${r.color}-300`:"border-gray-300"} ${B} h-[32px] text-gray-900 dark:bg-black-600 dark:text-neutral-200 text-sm rounded-lg focus:outline-none focus:ring-0 focus:border-[var(--color-primary-600)] dark:focus:border-[var(--color-primary-400)] focus:shadow-[0_0_0_1.5px_var(--color-primary-100)] dark:focus:shadow-[0_0_0_1.5px_var(--color-primary-950)] block w-full p-2.5 font-inter font-medium 
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("react/jsx-runtime"),s=require("../../../_virtual/index.cjs.js"),C=require("react"),T=require("antd"),G=require("react-i18next"),D=require("../../data-display/typography/Typography.cjs.js"),ee=require("../../data-display/label/Label.cjs.js"),$=require("@mui/icons-material"),te=require("../../icons/AIExtractedIndicator.cjs.js"),re=require("../../icons/AIStarIcon.cjs.js"),le=require("../../icons/HelpIcon.cjs.js"),_=require("../../tooltip/Tooltip.cjs.js"),l=require("../../../utils/confidenceScoreUtils.cjs.js"),ae=require("../shared/InputLabel.cjs.js"),z=C.forwardRef(({id:c,label:i,value:o,onChange:j,errorMessage:d,defaultValue:u,disabled:P,max:F,min:L,required:x=!1,isRequiredConditional:A=!1,bg:B,tags:E,color:H,className:M,originalCase:y=!1,tooltip:v,simpleMode:K=!1,inputFieldClassName:O="",isAiExtracted:R=!1,confidenceScore:m,confidenceType:a="high",confidenceTooltip:p,sourceMeta:U=[],onConfidenceScoreClick:J,isGTN:f=!1,gtnName:Q=null,inputStyle:k,withDollarSign:V=!0,labelClassName:I,isLiveField:W=!1,onBlur:N,onAddGTNToDocument:b,riskDetails:r,isRiskAnalysisOpen:g=!1,RiskDetailsCard:w,placeholder:X,...S},q)=>{const{t:Y}=G.useTranslation(),[n,h]=C.useState(!1),Z=t=>{b&&b({key:Q,value:t})};return K?e.jsxs("label",{id:c,className:`mb-1 text-xs font-medium text-gray-600 dark:text-neutral-200 inline-flex items-center gap-1 ${y?"":"capitalize"} ${I||""}`,children:[V&&e.jsx("span",{className:"absolute inset-y-0 left-1 flex items-center pl-3",children:"$"}),e.jsx("input",{...S,ref:q,onBlur:N,type:"number",required:x,className:s(O,"pl-8 h-8"),onChange:t=>{j(t.target.value)},value:o,...u&&!o?{defaultValue:u}:{},id:c||i,style:k,autoComplete:"off"})]}):e.jsxs("div",{className:s("flex gap-0.5 relative",n&&f?"border rounded-lg border-primary-100 bg-primary-50 p-1":""),onMouseEnter:()=>h(!0),onMouseLeave:()=>h(!1),children:[f&&!n?e.jsx("div",{className:"w-1 h-1 bg-primary-600 rounded-full animate-blink mt-1.5"}):null,e.jsxs("div",{className:s("w-full flex flex-col",M),children:[e.jsx("label",{htmlFor:"text",className:`mb-1 text-xs font-medium text-gray-600 dark:text-neutral-300 inline-flex items-center gap-1 ${y?"":"uppercase"} ${I||""}`,children:e.jsxs("div",{className:"grid w-full grid-cols-[minmax(0,1fr)_auto] items-start gap-x-1",children:[e.jsxs("div",{className:"inline-flex min-w-0 items-center gap-1 flex-wrap dark:text-black-300",children:[e.jsx(ae.InputLabel,{label:i||"",required:x||!1,isRequiredConditional:A||!1}),W&&e.jsx($.BoltOutlined,{sx:{fontSize:16,color:"var(--color-primary-600)",rotate:"15deg"}}),R&&!l.shouldShowConfidenceScore(m)&&e.jsx(te.AIExtractedIndicator,{}),e.jsx(ee.Label,{labels:E}),v&&e.jsx(_,{placement:"top",title:v,children:e.jsx("div",{className:"cursor-pointer",children:e.jsx(le.HelpIcon,{})})})]}),e.jsxs("div",{className:"flex items-center gap-1 justify-self-end",children:[l.shouldShowConfidenceScore(m)&&a?e.jsx(_,{placement:"top-end",title:p??"",hideTooltip:p==null,className:"cursor-pointer",children:e.jsxs("div",{className:s("inline-flex min-w-[50px] items-center gap-1 rounded-md px-1 py-0.5",l.getConfidenceScoreBadgeClass(a)),onClick:()=>J?.(U),children:[e.jsx(re.AIStarIcon,{size:12,fill:l.getConfidenceScoreBadgeColor(a),fillSecondary:l.getConfidenceScoreBadgeFill(a)}),e.jsxs("span",{className:s("text-xs font-medium leading-4",l.getConfidenceScoreBadgeTextColor(a)),children:[m,"%"]})]})}):null,f&&n&&b?e.jsx("button",{id:"btn-percentage-input-add-to-document",className:"cursor-pointer",onClick:()=>Z(o?.toString()),type:"button",children:e.jsx(T.Tooltip,{placement:"top",title:Y("Add to document"),children:e.jsx($.NoteAddOutlined,{className:"text-primary-600",sx:{fontSize:16}})})}):null]})]})}),e.jsxs("label",{className:"relative block",children:[e.jsx("input",{...S,ref:q,onBlur:N,type:"number",required:x,disabled:P,min:L,max:F,className:`border ${d?"border-red-300":g&&r?.color?`border-${r.color}-300`:"border-gray-300"} ${B} h-8 text-gray-900 dark:bg-black-600 dark:text-neutral-200 text-sm rounded-lg focus:outline-none focus:ring-0 focus:border-[var(--color-primary-600)] dark:focus:border-[var(--color-primary-400)] focus:shadow-[0_0_0_1.5px_var(--color-primary-100)] dark:focus:shadow-[0_0_0_1.5px_var(--color-primary-950)] block w-full p-2.5 font-inter font-medium 
               disabled:bg-neutral-50 dark:disabled:!bg-black-800 dark:disabled:placeholder:!text-black-400
               ${g&&r?.color&&`bg-${r.color}-50`}
               ${H||""}

package/dist/components/forms/percentage-input/PercentageInputField.cjs.js.map

@@ -1 +1 @@
-{"version":3,"file":"PercentageInputField.cjs.js","sources":["../../../../src/components/forms/percentage-input/PercentageInputField.tsx"],"sourcesContent":["/* eslint-disable @typescript-eslint/no-explicit-any */\nimport cn from \"classnames\";\nimport { forwardRef, useState } from \"react\";\nimport { Tooltip as AntTooltip } from \"antd\";\nimport { useTranslation } from 'react-i18next';\nimport { Typography } from \"../../data-display/typography/Typography\";\nimport { Label } from \"../../data-display/label/Label\";\nimport type { LabelType } from \"../../data-display/label/Label\";\nimport { BoltOutlined, NoteAddOutlined } from \"@mui/icons-material\";\nimport { AIExtractedIndicator } from \"../../icons/AIExtractedIndicator\";\nimport { AIStarIcon } from \"../../icons/AIStarIcon\";\nimport { HelpIcon } from \"../../icons/HelpIcon\";\nimport Tooltip from \"../../tooltip/Tooltip\";\nimport {\n  getConfidenceScoreBadgeClass,\n  getConfidenceScoreBadgeColor,\n  getConfidenceScoreBadgeFill,\n  getConfidenceScoreBadgeTextColor,\n  shouldShowConfidenceScore,\n} from \"../../../utils/confidenceScoreUtils\";\nimport { InputLabel } from \"../shared/InputLabel\";\n\n/**\n * Confidence score type\n */\nexport type ConfidenceScoreType = \"low\" | \"medium\" | \"high\";\n\nexport type SourceMetaBBox = {\n  b: number;\n  l: number;\n  r: number;\n  t: number;\n};\n\nexport type SourceMetaItem = {\n  bbox: SourceMetaBBox;\n  confidence_score?: number;\n  is_primary?: boolean;\n  match_score?: number;\n  match_type?: string;\n  page_height: number;\n  page_width: number;\n  source_page: number;\n  source_text?: string;\n};\n\n/**\n * Risk details interface for risk analysis integration\n */\nexport interface RiskDetails {\n  color?: string;\n  description?: string;\n  hexBgColor?: string;\n  hexBorderColor?: string;\n  [key: string]: any;\n}\n\n/**\n * Risk details card component props - generic to allow consumer-specific risk types\n */\nexport interface RiskDetailsCardProps<T = any> {\n  riskDetails: T;\n  maxWidth?: string;\n  showAllRisksSuggestions?: boolean;\n}\n\n/**\n * Props for the PercentageInputField component\n */\nexport interface PercentageInputFieldProps {\n  /** Unique identifier for the input */\n  id: string;\n  /** Label text to display above the input */\n  label?: string;\n  /** Current value of the input */\n  value: string;\n  /** Callback function called when value changes */\n  onChange: (data: any) => void;\n  /** Error message to display below the input */\n  errorMessage?: string;\n  /** Default value for the input */\n  defaultValue?: string;\n  /** Whether the input is disabled */\n  disabled?: boolean;\n  /** Maximum value allowed */\n  max?: number;\n  /** Minimum value allowed */\n  min?: number;\n  /** Whether the field is required */\n  required?: boolean;\n  /** Whether the required indicator shows as conditional (yellow instead of red) */\n  isRequiredConditional?: boolean;\n  /** Background color class */\n  bg?: string;\n  /** Tags/labels to display next to the label */\n  tags?: (string | LabelType)[];\n  /** Text color class */\n  color?: string;\n  /** Additional CSS classes for the wrapper */\n  className?: string;\n  /** Whether to preserve original case in the label */\n  originalCase?: boolean;\n  /** Tooltip text for the help icon */\n  tooltip?: string;\n  /** Whether to use simple mode (inline label style) */\n  simpleMode?: boolean;\n  /** Additional CSS classes for the input field */\n  inputFieldClassName?: string;\n  /** Whether the value was AI extracted */\n  isAiExtracted?: boolean;\n  /** Confidence percentage shown as a badge */\n  confidenceScore?: number;\n  /** Confidence classification for badge styling */\n  confidenceType?: ConfidenceScoreType;\n  /** Optional tooltip content for confidence badge */\n  confidenceTooltip?: React.ReactNode;\n  /** Source meta for confidence score */\n  sourceMeta?: SourceMetaItem[];\n  /** Handler fired when confidence score badge is clicked */\n  onConfidenceScoreClick?: (sourceMeta: SourceMetaItem[]) => void;\n  /** Whether this is a GTN (Global Term Name) field */\n  isGTN?: boolean;\n  /** GTN field name for document integration */\n  gtnName?: any;\n  /** Inline styles for the input element */\n  inputStyle?: React.CSSProperties;\n  /** Whether to show dollar sign (for simpleMode) */\n  withDollarSign?: boolean;\n  /** Additional CSS classes for the label */\n  labelClassName?: string;\n  /** Whether this is a live field */\n  isLiveField?: boolean;\n  /** Callback function called when input loses focus */\n  onBlur?: () => void;\n  /** Handler for adding GTN to document */\n  onAddGTNToDocument?: (keyValuePair: { key: string; value: string }) => void;\n  /** Risk details data */\n  riskDetails?: RiskDetails;\n  /** Whether risk analysis is open */\n  isRiskAnalysisOpen?: boolean;\n  /** Custom risk details card component */\n  RiskDetailsCard?: React.ComponentType<RiskDetailsCardProps<any>>;\n  /** Input placeholder */\n  placeholder?: string\n}\n\n/**\n * A highly customizable percentage input component with label, validation, and styling support.\n * Features GTN integration, risk analysis support, AI extraction indicator, and comprehensive prop support.\n *\n * @example\n * ```tsx\n * <PercentageInputField\n *   id=\"discount\"\n *   label=\"Discount Percentage\"\n *   value={discount}\n *   onChange={(value) => setDiscount(value)}\n *   required\n * />\n * ```\n */\nexport const PercentageInputField = forwardRef<\n  HTMLInputElement,\n  PercentageInputFieldProps\n>(\n  (\n    {\n      id,\n      label,\n      value,\n      onChange,\n      errorMessage,\n      defaultValue,\n      disabled,\n      max,\n      min,\n      required = false,\n      isRequiredConditional = false,\n      bg,\n      tags,\n      color,\n      className,\n      originalCase = false,\n      tooltip,\n      simpleMode = false,\n      inputFieldClassName = \"\",\n      isAiExtracted = false,\n      confidenceScore,\n      confidenceType = \"high\",\n      confidenceTooltip,\n      sourceMeta = [],\n      onConfidenceScoreClick,\n      isGTN = false,\n      gtnName = null,\n      inputStyle,\n      withDollarSign = true,\n      labelClassName,\n      isLiveField = false,\n      onBlur,\n      onAddGTNToDocument,\n      riskDetails,\n      isRiskAnalysisOpen = false,\n      RiskDetailsCard,\n      placeholder,\n      ...props\n    },\n    ref\n  ) => {\n    const { t } = useTranslation();\n    const [isHovered, setIsHovered] = useState(false);\n\n    const handleAddGTNToDocument = (_value: string) => {\n      if (onAddGTNToDocument) {\n        const keyValuePair = {\n          key: gtnName,\n          value: _value,\n        };\n        onAddGTNToDocument(keyValuePair);\n      }\n    };\n\n    // Simple mode rendering\n    if (simpleMode) {\n      return (\n        <label\n          id={id}\n          className={`mb-1 text-xs font-medium text-gray-600 dark:text-neutral-200 inline-flex items-center gap-1 ${\n            !originalCase ? \"capitalize\" : \"\"\n          } ${labelClassName || \"\"}`}\n        >\n          {withDollarSign && (\n            <span className=\"absolute inset-y-0 left-1 flex items-center pl-3\">\n              {\"$\"}\n            </span>\n          )}\n          <input\n            {...props}\n            ref={ref}\n            onBlur={onBlur}\n            type=\"number\"\n            required={required}\n            className={cn(inputFieldClassName, \"pl-8 h-[32px]\")}\n            onChange={(e) => {\n              onChange(e.target.value);\n            }}\n            value={value}\n            {...(defaultValue && !value ? { defaultValue: defaultValue } : {})}\n            id={id || label}\n            style={inputStyle}\n            autoComplete=\"off\"\n          />\n        </label>\n      );\n    }\n\n    // Full mode rendering\n    return (\n      <div\n        className={cn(\n          \"flex gap-0.5 relative\",\n          isHovered && isGTN\n            ? \"border rounded-lg border-primary-100 bg-primary-50 p-1\"\n            : \"\"\n        )}\n        onMouseEnter={() => setIsHovered(true)}\n        onMouseLeave={() => setIsHovered(false)}\n      >\n        {isGTN && !isHovered ? (\n          <div className=\"w-1 h-1 bg-primary-600 rounded-full animate-blink mt-1.5\" />\n        ) : null}\n        <div className={cn(\"w-full flex flex-col\", className)}>\n          <label\n            htmlFor=\"text\"\n            className={`mb-1 text-xs font-medium text-gray-600 dark:text-neutral-300 inline-flex items-center gap-1 ${\n              !originalCase ? \"uppercase\" : \"\"\n            } ${labelClassName || \"\"}`}\n          >\n            <div className=\"grid w-full grid-cols-[minmax(0,1fr)_auto] items-start gap-x-1\">\n              <div className=\"inline-flex min-w-0 items-center gap-1 flex-wrap dark:text-black-300\">\n              <InputLabel label={label || \"\"} required={required || false} isRequiredConditional={isRequiredConditional || false} />\n                {isLiveField && (\n                  <BoltOutlined\n                    sx={{\n                      fontSize: 16,\n                      color: \"var(--color-primary-600)\",\n                      rotate: \"15deg\",\n                    }}\n                  />\n                )}\n                {isAiExtracted && !shouldShowConfidenceScore(confidenceScore) && <AIExtractedIndicator />}\n                <Label labels={tags} />\n                {tooltip && (\n                  <Tooltip placement=\"top\" title={tooltip}>\n                    <div className=\"cursor-pointer\">\n                      <HelpIcon />\n                    </div>\n                  </Tooltip>\n                )}\n              </div>\n\n              <div className=\"flex items-center gap-1 justify-self-end\">\n                {(shouldShowConfidenceScore(confidenceScore) && confidenceType) ? (\n                  <Tooltip\n                    placement=\"top-end\"\n                    title={confidenceTooltip ?? \"\"}\n                    hideTooltip={confidenceTooltip === undefined || confidenceTooltip === null}\n                    className=\"cursor-pointer\"\n                  >\n                    <div\n                      className={cn(\n                        \"inline-flex min-w-[50px] items-center gap-1 rounded-md px-1 py-0.5\",\n                        getConfidenceScoreBadgeClass(confidenceType)\n                      )}\n                        onClick={() => onConfidenceScoreClick?.(sourceMeta)}\n                    >\n                      <AIStarIcon\n                        size={12}\n                        fill={getConfidenceScoreBadgeColor(confidenceType)}\n                        fillSecondary={getConfidenceScoreBadgeFill(confidenceType)}\n                      />\n                      <span className={cn(\"text-xs font-medium leading-4\", getConfidenceScoreBadgeTextColor(confidenceType))}>\n                        {confidenceScore}%\n                      </span>\n                    </div>\n                  </Tooltip>\n                ) : null}\n                {isGTN && isHovered && onAddGTNToDocument ? (\n                  <button\n                    id=\"btn-percentage-input-add-to-document\"\n                    className=\"cursor-pointer\"\n                    onClick={() => handleAddGTNToDocument(value?.toString())}\n                    type=\"button\"\n                  >\n                    <AntTooltip placement=\"top\" title={t(\"Add to document\")}>\n                      <NoteAddOutlined\n                        className=\"text-primary-600\"\n                        sx={{ fontSize: 16 }}\n                      />\n                    </AntTooltip>\n                  </button>\n                ) : null}\n              </div>\n            </div>\n          </label>\n          <label className=\"relative block\">\n            <input\n              {...props}\n              ref={ref}\n              onBlur={onBlur}\n              type=\"number\"\n              required={required}\n              disabled={disabled}\n              min={min}\n              max={max}\n              className={`border ${\n                errorMessage\n                  ? \"border-red-300\"\n                  : isRiskAnalysisOpen && riskDetails?.color\n                  ? `border-${riskDetails.color}-300`\n                  : \"border-gray-300\"\n              } ${bg} h-[32px] text-gray-900 dark:bg-black-600 dark:text-neutral-200 text-sm rounded-lg focus:outline-none focus:ring-0 focus:border-[var(--color-primary-600)] dark:focus:border-[var(--color-primary-400)] focus:shadow-[0_0_0_1.5px_var(--color-primary-100)] dark:focus:shadow-[0_0_0_1.5px_var(--color-primary-950)] block w-full p-2.5 font-inter font-medium \n              disabled:bg-neutral-50 dark:disabled:!bg-black-800 dark:disabled:placeholder:!text-black-400\n              ${\n                isRiskAnalysisOpen &&\n                riskDetails?.color &&\n                `bg-${riskDetails.color}-50`\n              }\n              ${color || \"\"}\n              `}\n              onChange={(e) => {\n                onChange(e.target.value);\n              }}\n              value={value}\n              defaultValue={defaultValue}\n              id={id || label}\n              style={inputStyle}\n              autoComplete=\"off\"\n              placeholder={placeholder}\n            />\n            <span className=\"absolute inset-y-0 right-3 flex items-center z-[1000px] h-full dark:text-black-100\">\n              %\n            </span>\n          </label>\n          {errorMessage && (\n            <Typography\n              className=\"text-error-500 mt-1\"\n              appearance=\"custom\"\n              size=\"extra-small\"\n              variant=\"medium\"\n            >\n              {errorMessage}\n            </Typography>\n          )}\n        </div>\n\n        {isHovered &&\n          riskDetails &&\n          isRiskAnalysisOpen &&\n          RiskDetailsCard && (\n            <div\n              role=\"tooltip\"\n              tabIndex={0}\n              className=\"absolute left-0 right-0 top-[95%] mt-1 z-50 bg-white dark:bg-black-600 rounded-xl\"\n              onClick={(e) => e.stopPropagation()}\n              onMouseDown={(e) => e.preventDefault()}\n              onKeyDown={(e) => {\n                if (e.key === \"Escape\") {\n                  setIsHovered(false);\n                }\n              }}\n            >\n              <RiskDetailsCard riskDetails={riskDetails} />\n            </div>\n          )}\n      </div>\n    );\n  }\n);\n\nPercentageInputField.displayName = \"PercentageInputField\";\n"],"names":["PercentageInputField","forwardRef","id","label","value","onChange","errorMessage","defaultValue","disabled","max","min","required","isRequiredConditional","bg","tags","color","className","originalCase","tooltip","simpleMode","inputFieldClassName","isAiExtracted","confidenceScore","confidenceType","confidenceTooltip","sourceMeta","onConfidenceScoreClick","isGTN","gtnName","inputStyle","withDollarSign","labelClassName","isLiveField","onBlur","onAddGTNToDocument","riskDetails","isRiskAnalysisOpen","RiskDetailsCard","placeholder","props","ref","t","useTranslation","isHovered","setIsHovered","useState","handleAddGTNToDocument","_value","jsxs","jsx","cn","e","InputLabel","BoltOutlined","shouldShowConfidenceScore","AIExtractedIndicator","Label","Tooltip","HelpIcon","getConfidenceScoreBadgeClass","AIStarIcon","getConfidenceScoreBadgeColor","getConfidenceScoreBadgeFill","getConfidenceScoreBadgeTextColor","AntTooltip","NoteAddOutlined","Typography"],"mappings":"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"}
+{"version":3,"file":"PercentageInputField.cjs.js","sources":["../../../../src/components/forms/percentage-input/PercentageInputField.tsx"],"sourcesContent":["/* eslint-disable @typescript-eslint/no-explicit-any */\nimport cn from \"classnames\";\nimport { forwardRef, useState } from \"react\";\nimport { Tooltip as AntTooltip } from \"antd\";\nimport { useTranslation } from 'react-i18next';\nimport { Typography } from \"../../data-display/typography/Typography\";\nimport { Label } from \"../../data-display/label/Label\";\nimport type { LabelType } from \"../../data-display/label/Label\";\nimport { BoltOutlined, NoteAddOutlined } from \"@mui/icons-material\";\nimport { AIExtractedIndicator } from \"../../icons/AIExtractedIndicator\";\nimport { AIStarIcon } from \"../../icons/AIStarIcon\";\nimport { HelpIcon } from \"../../icons/HelpIcon\";\nimport Tooltip from \"../../tooltip/Tooltip\";\nimport {\n  getConfidenceScoreBadgeClass,\n  getConfidenceScoreBadgeColor,\n  getConfidenceScoreBadgeFill,\n  getConfidenceScoreBadgeTextColor,\n  shouldShowConfidenceScore,\n} from \"../../../utils/confidenceScoreUtils\";\nimport { InputLabel } from \"../shared/InputLabel\";\n\n/**\n * Confidence score type\n */\nexport type ConfidenceScoreType = \"low\" | \"medium\" | \"high\";\n\nexport type SourceMetaBBox = {\n  b: number;\n  l: number;\n  r: number;\n  t: number;\n};\n\nexport type SourceMetaItem = {\n  bbox: SourceMetaBBox;\n  confidence_score?: number;\n  is_primary?: boolean;\n  match_score?: number;\n  match_type?: string;\n  page_height: number;\n  page_width: number;\n  source_page: number;\n  source_text?: string;\n};\n\n/**\n * Risk details interface for risk analysis integration\n */\nexport interface RiskDetails {\n  color?: string;\n  description?: string;\n  hexBgColor?: string;\n  hexBorderColor?: string;\n  [key: string]: any;\n}\n\n/**\n * Risk details card component props - generic to allow consumer-specific risk types\n */\nexport interface RiskDetailsCardProps<T = any> {\n  riskDetails: T;\n  maxWidth?: string;\n  showAllRisksSuggestions?: boolean;\n}\n\n/**\n * Props for the PercentageInputField component\n */\nexport interface PercentageInputFieldProps {\n  /** Unique identifier for the input */\n  id: string;\n  /** Label text to display above the input */\n  label?: string;\n  /** Current value of the input */\n  value: string;\n  /** Callback function called when value changes */\n  onChange: (data: any) => void;\n  /** Error message to display below the input */\n  errorMessage?: string;\n  /** Default value for the input */\n  defaultValue?: string;\n  /** Whether the input is disabled */\n  disabled?: boolean;\n  /** Maximum value allowed */\n  max?: number;\n  /** Minimum value allowed */\n  min?: number;\n  /** Whether the field is required */\n  required?: boolean;\n  /** Whether the required indicator shows as conditional (yellow instead of red) */\n  isRequiredConditional?: boolean;\n  /** Background color class */\n  bg?: string;\n  /** Tags/labels to display next to the label */\n  tags?: (string | LabelType)[];\n  /** Text color class */\n  color?: string;\n  /** Additional CSS classes for the wrapper */\n  className?: string;\n  /** Whether to preserve original case in the label */\n  originalCase?: boolean;\n  /** Tooltip text for the help icon */\n  tooltip?: string;\n  /** Whether to use simple mode (inline label style) */\n  simpleMode?: boolean;\n  /** Additional CSS classes for the input field */\n  inputFieldClassName?: string;\n  /** Whether the value was AI extracted */\n  isAiExtracted?: boolean;\n  /** Confidence percentage shown as a badge */\n  confidenceScore?: number;\n  /** Confidence classification for badge styling */\n  confidenceType?: ConfidenceScoreType;\n  /** Optional tooltip content for confidence badge */\n  confidenceTooltip?: React.ReactNode;\n  /** Source meta for confidence score */\n  sourceMeta?: SourceMetaItem[];\n  /** Handler fired when confidence score badge is clicked */\n  onConfidenceScoreClick?: (sourceMeta: SourceMetaItem[]) => void;\n  /** Whether this is a GTN (Global Term Name) field */\n  isGTN?: boolean;\n  /** GTN field name for document integration */\n  gtnName?: any;\n  /** Inline styles for the input element */\n  inputStyle?: React.CSSProperties;\n  /** Whether to show dollar sign (for simpleMode) */\n  withDollarSign?: boolean;\n  /** Additional CSS classes for the label */\n  labelClassName?: string;\n  /** Whether this is a live field */\n  isLiveField?: boolean;\n  /** Callback function called when input loses focus */\n  onBlur?: () => void;\n  /** Handler for adding GTN to document */\n  onAddGTNToDocument?: (keyValuePair: { key: string; value: string }) => void;\n  /** Risk details data */\n  riskDetails?: RiskDetails;\n  /** Whether risk analysis is open */\n  isRiskAnalysisOpen?: boolean;\n  /** Custom risk details card component */\n  RiskDetailsCard?: React.ComponentType<RiskDetailsCardProps<any>>;\n  /** Input placeholder */\n  placeholder?: string\n}\n\n/**\n * A highly customizable percentage input component with label, validation, and styling support.\n * Features GTN integration, risk analysis support, AI extraction indicator, and comprehensive prop support.\n *\n * @example\n * ```tsx\n * <PercentageInputField\n *   id=\"discount\"\n *   label=\"Discount Percentage\"\n *   value={discount}\n *   onChange={(value) => setDiscount(value)}\n *   required\n * />\n * ```\n */\nexport const PercentageInputField = forwardRef<\n  HTMLInputElement,\n  PercentageInputFieldProps\n>(\n  (\n    {\n      id,\n      label,\n      value,\n      onChange,\n      errorMessage,\n      defaultValue,\n      disabled,\n      max,\n      min,\n      required = false,\n      isRequiredConditional = false,\n      bg,\n      tags,\n      color,\n      className,\n      originalCase = false,\n      tooltip,\n      simpleMode = false,\n      inputFieldClassName = \"\",\n      isAiExtracted = false,\n      confidenceScore,\n      confidenceType = \"high\",\n      confidenceTooltip,\n      sourceMeta = [],\n      onConfidenceScoreClick,\n      isGTN = false,\n      gtnName = null,\n      inputStyle,\n      withDollarSign = true,\n      labelClassName,\n      isLiveField = false,\n      onBlur,\n      onAddGTNToDocument,\n      riskDetails,\n      isRiskAnalysisOpen = false,\n      RiskDetailsCard,\n      placeholder,\n      ...props\n    },\n    ref\n  ) => {\n    const { t } = useTranslation();\n    const [isHovered, setIsHovered] = useState(false);\n\n    const handleAddGTNToDocument = (_value: string) => {\n      if (onAddGTNToDocument) {\n        const keyValuePair = {\n          key: gtnName,\n          value: _value,\n        };\n        onAddGTNToDocument(keyValuePair);\n      }\n    };\n\n    // Simple mode rendering\n    if (simpleMode) {\n      return (\n        <label\n          id={id}\n          className={`mb-1 text-xs font-medium text-gray-600 dark:text-neutral-200 inline-flex items-center gap-1 ${\n            !originalCase ? \"capitalize\" : \"\"\n          } ${labelClassName || \"\"}`}\n        >\n          {withDollarSign && (\n            <span className=\"absolute inset-y-0 left-1 flex items-center pl-3\">\n              {\"$\"}\n            </span>\n          )}\n          <input\n            {...props}\n            ref={ref}\n            onBlur={onBlur}\n            type=\"number\"\n            required={required}\n            className={cn(inputFieldClassName, \"pl-8 h-8\")}\n            onChange={(e) => {\n              onChange(e.target.value);\n            }}\n            value={value}\n            {...(defaultValue && !value ? { defaultValue: defaultValue } : {})}\n            id={id || label}\n            style={inputStyle}\n            autoComplete=\"off\"\n          />\n        </label>\n      );\n    }\n\n    // Full mode rendering\n    return (\n      <div\n        className={cn(\n          \"flex gap-0.5 relative\",\n          isHovered && isGTN\n            ? \"border rounded-lg border-primary-100 bg-primary-50 p-1\"\n            : \"\"\n        )}\n        onMouseEnter={() => setIsHovered(true)}\n        onMouseLeave={() => setIsHovered(false)}\n      >\n        {isGTN && !isHovered ? (\n          <div className=\"w-1 h-1 bg-primary-600 rounded-full animate-blink mt-1.5\" />\n        ) : null}\n        <div className={cn(\"w-full flex flex-col\", className)}>\n          <label\n            htmlFor=\"text\"\n            className={`mb-1 text-xs font-medium text-gray-600 dark:text-neutral-300 inline-flex items-center gap-1 ${\n              !originalCase ? \"uppercase\" : \"\"\n            } ${labelClassName || \"\"}`}\n          >\n            <div className=\"grid w-full grid-cols-[minmax(0,1fr)_auto] items-start gap-x-1\">\n              <div className=\"inline-flex min-w-0 items-center gap-1 flex-wrap dark:text-black-300\">\n              <InputLabel label={label || \"\"} required={required || false} isRequiredConditional={isRequiredConditional || false} />\n                {isLiveField && (\n                  <BoltOutlined\n                    sx={{\n                      fontSize: 16,\n                      color: \"var(--color-primary-600)\",\n                      rotate: \"15deg\",\n                    }}\n                  />\n                )}\n                {isAiExtracted && !shouldShowConfidenceScore(confidenceScore) && <AIExtractedIndicator />}\n                <Label labels={tags} />\n                {tooltip && (\n                  <Tooltip placement=\"top\" title={tooltip}>\n                    <div className=\"cursor-pointer\">\n                      <HelpIcon />\n                    </div>\n                  </Tooltip>\n                )}\n              </div>\n\n              <div className=\"flex items-center gap-1 justify-self-end\">\n                {(shouldShowConfidenceScore(confidenceScore) && confidenceType) ? (\n                  <Tooltip\n                    placement=\"top-end\"\n                    title={confidenceTooltip ?? \"\"}\n                    hideTooltip={confidenceTooltip === undefined || confidenceTooltip === null}\n                    className=\"cursor-pointer\"\n                  >\n                    <div\n                      className={cn(\n                        \"inline-flex min-w-[50px] items-center gap-1 rounded-md px-1 py-0.5\",\n                        getConfidenceScoreBadgeClass(confidenceType)\n                      )}\n                        onClick={() => onConfidenceScoreClick?.(sourceMeta)}\n                    >\n                      <AIStarIcon\n                        size={12}\n                        fill={getConfidenceScoreBadgeColor(confidenceType)}\n                        fillSecondary={getConfidenceScoreBadgeFill(confidenceType)}\n                      />\n                      <span className={cn(\"text-xs font-medium leading-4\", getConfidenceScoreBadgeTextColor(confidenceType))}>\n                        {confidenceScore}%\n                      </span>\n                    </div>\n                  </Tooltip>\n                ) : null}\n                {isGTN && isHovered && onAddGTNToDocument ? (\n                  <button\n                    id=\"btn-percentage-input-add-to-document\"\n                    className=\"cursor-pointer\"\n                    onClick={() => handleAddGTNToDocument(value?.toString())}\n                    type=\"button\"\n                  >\n                    <AntTooltip placement=\"top\" title={t(\"Add to document\")}>\n                      <NoteAddOutlined\n                        className=\"text-primary-600\"\n                        sx={{ fontSize: 16 }}\n                      />\n                    </AntTooltip>\n                  </button>\n                ) : null}\n              </div>\n            </div>\n          </label>\n          <label className=\"relative block\">\n            <input\n              {...props}\n              ref={ref}\n              onBlur={onBlur}\n              type=\"number\"\n              required={required}\n              disabled={disabled}\n              min={min}\n              max={max}\n              className={`border ${\n                errorMessage\n                  ? \"border-red-300\"\n                  : isRiskAnalysisOpen && riskDetails?.color\n                  ? `border-${riskDetails.color}-300`\n                  : \"border-gray-300\"\n              } ${bg} h-8 text-gray-900 dark:bg-black-600 dark:text-neutral-200 text-sm rounded-lg focus:outline-none focus:ring-0 focus:border-[var(--color-primary-600)] dark:focus:border-[var(--color-primary-400)] focus:shadow-[0_0_0_1.5px_var(--color-primary-100)] dark:focus:shadow-[0_0_0_1.5px_var(--color-primary-950)] block w-full p-2.5 font-inter font-medium \n              disabled:bg-neutral-50 dark:disabled:!bg-black-800 dark:disabled:placeholder:!text-black-400\n              ${\n                isRiskAnalysisOpen &&\n                riskDetails?.color &&\n                `bg-${riskDetails.color}-50`\n              }\n              ${color || \"\"}\n              `}\n              onChange={(e) => {\n                onChange(e.target.value);\n              }}\n              value={value}\n              defaultValue={defaultValue}\n              id={id || label}\n              style={inputStyle}\n              autoComplete=\"off\"\n              placeholder={placeholder}\n            />\n            <span className=\"absolute inset-y-0 right-3 flex items-center z-[1000px] h-full dark:text-black-100\">\n              %\n            </span>\n          </label>\n          {errorMessage && (\n            <Typography\n              className=\"text-error-500 mt-1\"\n              appearance=\"custom\"\n              size=\"extra-small\"\n              variant=\"medium\"\n            >\n              {errorMessage}\n            </Typography>\n          )}\n        </div>\n\n        {isHovered &&\n          riskDetails &&\n          isRiskAnalysisOpen &&\n          RiskDetailsCard && (\n            <div\n              role=\"tooltip\"\n              tabIndex={0}\n              className=\"absolute left-0 right-0 top-[95%] mt-1 z-50 bg-white dark:bg-black-600 rounded-xl\"\n              onClick={(e) => e.stopPropagation()}\n              onMouseDown={(e) => e.preventDefault()}\n              onKeyDown={(e) => {\n                if (e.key === \"Escape\") {\n                  setIsHovered(false);\n                }\n              }}\n            >\n              <RiskDetailsCard riskDetails={riskDetails} />\n            </div>\n          )}\n      </div>\n    );\n  }\n);\n\nPercentageInputField.displayName = \"PercentageInputField\";\n"],"names":["PercentageInputField","forwardRef","id","label","value","onChange","errorMessage","defaultValue","disabled","max","min","required","isRequiredConditional","bg","tags","color","className","originalCase","tooltip","simpleMode","inputFieldClassName","isAiExtracted","confidenceScore","confidenceType","confidenceTooltip","sourceMeta","onConfidenceScoreClick","isGTN","gtnName","inputStyle","withDollarSign","labelClassName","isLiveField","onBlur","onAddGTNToDocument","riskDetails","isRiskAnalysisOpen","RiskDetailsCard","placeholder","props","ref","t","useTranslation","isHovered","setIsHovered","useState","handleAddGTNToDocument","_value","jsxs","jsx","cn","e","InputLabel","BoltOutlined","shouldShowConfidenceScore","AIExtractedIndicator","Label","Tooltip","HelpIcon","getConfidenceScoreBadgeClass","AIStarIcon","getConfidenceScoreBadgeColor","getConfidenceScoreBadgeFill","getConfidenceScoreBadgeTextColor","AntTooltip","NoteAddOutlined","Typography"],"mappings":"2oBAiKaA,EAAuBC,EAAAA,WAIlC,CACE,CACE,GAAAC,EACA,MAAAC,EACA,MAAAC,EACA,SAAAC,EACA,aAAAC,EACA,aAAAC,EACA,SAAAC,EACA,IAAAC,EACA,IAAAC,EACA,SAAAC,EAAW,GACX,sBAAAC,EAAwB,GACxB,GAAAC,EACA,KAAAC,EACA,MAAAC,EACA,UAAAC,EACA,aAAAC,EAAe,GACf,QAAAC,EACA,WAAAC,EAAa,GACb,oBAAAC,EAAsB,GACtB,cAAAC,EAAgB,GAChB,gBAAAC,EACA,eAAAC,EAAiB,OACjB,kBAAAC,EACA,WAAAC,EAAa,CAAA,EACb,uBAAAC,EACA,MAAAC,EAAQ,GACR,QAAAC,EAAU,KACV,WAAAC,EACA,eAAAC,EAAiB,GACjB,eAAAC,EACA,YAAAC,EAAc,GACd,OAAAC,EACA,mBAAAC,EACA,YAAAC,EACA,mBAAAC,EAAqB,GACrB,gBAAAC,EACA,YAAAC,EACA,GAAGC,CAAA,EAELC,IACG,CACH,KAAM,CAAE,EAAAC,CAAA,EAAMC,iBAAA,EACR,CAACC,EAAWC,CAAY,EAAIC,EAAAA,SAAS,EAAK,EAE1CC,EAA0BC,GAAmB,CAC7Cb,GAKFA,EAJqB,CACnB,IAAKN,EACL,MAAOmB,CAAA,CAEsB,CAEnC,EAGA,OAAI5B,EAEA6B,EAAAA,KAAC,QAAA,CACC,GAAA9C,EACA,UAAW,+FACRe,EAA8B,GAAf,YAClB,IAAIc,GAAkB,EAAE,GAEvB,SAAA,CAAAD,GACCmB,EAAAA,IAAC,OAAA,CAAK,UAAU,mDACb,SAAA,IACH,EAEFA,EAAAA,IAAC,QAAA,CACE,GAAGV,EACJ,IAAAC,EACA,OAAAP,EACA,KAAK,SACL,SAAAtB,EACA,UAAWuC,EAAG9B,EAAqB,UAAU,EAC7C,SAAW+B,GAAM,CACf9C,EAAS8C,EAAE,OAAO,KAAK,CACzB,EACA,MAAA/C,EACC,GAAIG,GAAgB,CAACH,EAAQ,CAAE,aAAAG,CAAA,EAA+B,CAAA,EAC/D,GAAIL,GAAMC,EACV,MAAO0B,EACP,aAAa,KAAA,CAAA,CACf,CAAA,CAAA,EAOJmB,EAAAA,KAAC,MAAA,CACC,UAAWE,EACT,wBACAP,GAAahB,EACT,yDACA,EAAA,EAEN,aAAc,IAAMiB,EAAa,EAAI,EACrC,aAAc,IAAMA,EAAa,EAAK,EAErC,SAAA,CAAAjB,GAAS,CAACgB,EACTM,MAAC,MAAA,CAAI,UAAU,2DAA2D,EACxE,YACH,MAAA,CAAI,UAAWC,EAAG,uBAAwBlC,CAAS,EAClD,SAAA,CAAAiC,EAAAA,IAAC,QAAA,CACC,QAAQ,OACR,UAAW,+FACRhC,EAA6B,GAAd,WAClB,IAAIc,GAAkB,EAAE,GAExB,SAAAiB,EAAAA,KAAC,MAAA,CAAI,UAAU,iEACb,SAAA,CAAAA,EAAAA,KAAC,MAAA,CAAI,UAAU,uEACf,SAAA,CAAAC,EAAAA,IAACG,GAAAA,WAAA,CAAW,MAAOjD,GAAS,GAAI,SAAUQ,GAAY,GAAO,sBAAuBC,GAAyB,EAAA,CAAO,EACjHoB,GACCiB,EAAAA,IAACI,EAAAA,aAAA,CACC,GAAI,CACF,SAAU,GACV,MAAO,2BACP,OAAQ,OAAA,CACV,CAAA,EAGHhC,GAAiB,CAACiC,EAAAA,0BAA0BhC,CAAe,SAAMiC,GAAAA,qBAAA,EAAqB,EACvFN,EAAAA,IAACO,GAAAA,MAAA,CAAM,OAAQ1C,CAAA,CAAM,EACpBI,GACC+B,EAAAA,IAACQ,EAAA,CAAQ,UAAU,MAAM,MAAOvC,EAC9B,SAAA+B,EAAAA,IAAC,MAAA,CAAI,UAAU,iBACb,SAAAA,EAAAA,IAACS,YAAA,CAAA,CAAS,EACZ,CAAA,CACF,CAAA,EAEJ,EAEAV,EAAAA,KAAC,MAAA,CAAI,UAAU,2CACX,SAAA,CAAAM,4BAA0BhC,CAAe,GAAKC,EAC9C0B,EAAAA,IAACQ,EAAA,CACC,UAAU,UACV,MAAOjC,GAAqB,GAC5B,YAAgDA,GAAsB,KACtE,UAAU,iBAEV,SAAAwB,EAAAA,KAAC,MAAA,CACC,UAAWE,EACT,qEACAS,EAAAA,6BAA6BpC,CAAc,CAAA,EAE3C,QAAS,IAAMG,IAAyBD,CAAU,EAEpD,SAAA,CAAAwB,EAAAA,IAACW,GAAAA,WAAA,CACC,KAAM,GACN,KAAMC,EAAAA,6BAA6BtC,CAAc,EACjD,cAAeuC,EAAAA,4BAA4BvC,CAAc,CAAA,CAAA,EAE3DyB,OAAC,QAAK,UAAWE,EAAG,gCAAiCa,mCAAiCxC,CAAc,CAAC,EAClG,SAAA,CAAAD,EAAgB,GAAA,CAAA,CACnB,CAAA,CAAA,CAAA,CACF,CAAA,EAEA,KACHK,GAASgB,GAAaT,EACrBe,EAAAA,IAAC,SAAA,CACC,GAAG,uCACH,UAAU,iBACV,QAAS,IAAMH,EAAuB1C,GAAO,UAAU,EACvD,KAAK,SAEL,eAAC4D,UAAA,CAAW,UAAU,MAAM,MAAOvB,EAAE,iBAAiB,EACpD,SAAAQ,EAAAA,IAACgB,EAAAA,gBAAA,CACC,UAAU,mBACV,GAAI,CAAE,SAAU,EAAA,CAAG,CAAA,CACrB,CACF,CAAA,CAAA,EAEA,IAAA,CAAA,CACN,CAAA,CAAA,CACF,CAAA,CAAA,EAEFjB,EAAAA,KAAC,QAAA,CAAM,UAAU,iBACf,SAAA,CAAAC,EAAAA,IAAC,QAAA,CACE,GAAGV,EACJ,IAAAC,EACA,OAAAP,EACA,KAAK,SACL,SAAAtB,EACA,SAAAH,EACA,IAAAE,EACA,IAAAD,EACA,UAAW,UACTH,EACI,iBACA8B,GAAsBD,GAAa,MACnC,UAAUA,EAAY,KAAK,OAC3B,iBACN,IAAItB,CAAE;AAAA;AAAA,gBAGJuB,GACAD,GAAa,OACb,MAAMA,EAAY,KAAK,KACzB;AAAA,gBACEpB,GAAS,EAAE;AAAA,gBAEb,SAAWoC,GAAM,CACf9C,EAAS8C,EAAE,OAAO,KAAK,CACzB,EACA,MAAA/C,EACA,aAAAG,EACA,GAAIL,GAAMC,EACV,MAAO0B,EACP,aAAa,MACb,YAAAS,CAAA,CAAA,EAEFW,EAAAA,IAAC,OAAA,CAAK,UAAU,qFAAqF,SAAA,GAAA,CAErG,CAAA,EACF,EACC3C,GACC2C,EAAAA,IAACiB,EAAAA,WAAA,CACC,UAAU,sBACV,WAAW,SACX,KAAK,cACL,QAAQ,SAEP,SAAA5D,CAAA,CAAA,CACH,EAEJ,EAECqC,GACCR,GACAC,GACAC,GACEY,EAAAA,IAAC,MAAA,CACC,KAAK,UACL,SAAU,EACV,UAAU,oFACV,QAAUE,GAAMA,EAAE,gBAAA,EAClB,YAAcA,GAAMA,EAAE,eAAA,EACtB,UAAYA,GAAM,CACZA,EAAE,MAAQ,UACZP,EAAa,EAAK,CAEtB,EAEA,SAAAK,EAAAA,IAACZ,GAAgB,YAAAF,CAAA,CAA0B,CAAA,CAAA,CAC7C,CAAA,CAAA,CAIV,CACF,EAEAnC,EAAqB,YAAc"}

package/dist/components/forms/percentage-input/PercentageInputField.es.js

@@ -74,7 +74,7 @@ const ce = Z(
               onBlur: C,
               type: "number",
               required: p,
-              className: o(M, "pl-8 h-[32px]"),
+              className: o(M, "pl-8 h-8"),
               onChange: (r) => {
                 y(r.target.value);
               },
@@ -187,7 +187,7 @@ const ce = Z(
                   disabled: P,
                   min: F,
                   max: B,
-                  className: `border ${s ? "border-red-300" : g && l?.color ? `border-${l.color}-300` : "border-gray-300"} ${E} h-[32px] text-gray-900 dark:bg-black-600 dark:text-neutral-200 text-sm rounded-lg focus:outline-none focus:ring-0 focus:border-[var(--color-primary-600)] dark:focus:border-[var(--color-primary-400)] focus:shadow-[0_0_0_1.5px_var(--color-primary-100)] dark:focus:shadow-[0_0_0_1.5px_var(--color-primary-950)] block w-full p-2.5 font-inter font-medium 
+                  className: `border ${s ? "border-red-300" : g && l?.color ? `border-${l.color}-300` : "border-gray-300"} ${E} h-8 text-gray-900 dark:bg-black-600 dark:text-neutral-200 text-sm rounded-lg focus:outline-none focus:ring-0 focus:border-[var(--color-primary-600)] dark:focus:border-[var(--color-primary-400)] focus:shadow-[0_0_0_1.5px_var(--color-primary-100)] dark:focus:shadow-[0_0_0_1.5px_var(--color-primary-950)] block w-full p-2.5 font-inter font-medium 
               disabled:bg-neutral-50 dark:disabled:!bg-black-800 dark:disabled:placeholder:!text-black-400
               ${g && l?.color && `bg-${l.color}-50`}
               ${L || ""}