tiptap-editor-custom-stg 1.0.7 → 1.0.9

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (6) hide show
  1. package/dist/index.css +1 -1
  2. package/dist/index.js +141 -86
  3. package/dist/index.js.map +1 -1
  4. package/dist/index.mjs +124 -69
  5. package/dist/index.mjs.map +1 -1
  6. package/package.json +1 -1
package/dist/index.css CHANGED
@@ -1 +1 @@
1
- .tiptap-editor-wrapper{border:1px solid #e5e7eb;border-radius:.75rem;overflow:hidden;font-size:15px;font-family:"Inter",-apple-system,BlinkMacSystemFont,"Segoe UI",Helvetica,Arial,sans-serif;background:#fff;box-shadow:0 1px 3px 0 rgba(0,0,0,.05),0 1px 2px -1px rgba(0,0,0,.05)}.tiptap-editor-wrapper .tiptap-toolbar{display:flex;flex-wrap:wrap;align-items:center;gap:.25rem;padding:.35rem .75rem;background:#fff;border-bottom:1px solid #f3f4f6}.tiptap-editor-wrapper .tiptap-toolbar button{display:inline-flex;align-items:center;justify-content:center;width:32px;height:32px;padding:0;border:none;border-radius:.375rem;background:rgba(0,0,0,0);cursor:pointer;color:#4b5563;font-size:14px;font-weight:500;transition:all .15s ease;line-height:1}.tiptap-editor-wrapper .tiptap-toolbar button:hover:not(:disabled){background:#f3f4f6;color:#111827}.tiptap-editor-wrapper .tiptap-toolbar button.is-active{background:#e5e7eb;color:#111827}.tiptap-editor-wrapper .tiptap-toolbar button:disabled{opacity:.4;cursor:not-allowed}.tiptap-editor-wrapper .tiptap-toolbar button.toolbar-button-dropdown{width:30px;padding:0 2px 0 4px;gap:1px}.tiptap-editor-wrapper .tiptap-toolbar button.toolbar-button-dropdown .dropdown-arrow{width:9px;height:9px;opacity:.6;margin-left:-2px}.tiptap-editor-wrapper .tiptap-toolbar button svg{width:18px;height:18px}.tiptap-editor-wrapper .tiptap-toolbar .toolbar-divider{width:1px;height:20px;background:#e5e7eb;margin:0 .5rem;flex-shrink:0}.tiptap-editor-wrapper .tiptap-toolbar .toolbar-select-wrapper{position:relative;display:inline-flex;align-items:center}.tiptap-editor-wrapper .tiptap-toolbar .toolbar-select{appearance:none;height:32px;border:none;border-radius:.375rem;background:rgba(0,0,0,0);font-size:14.5px;cursor:pointer;padding:0 1.5rem 0 .5rem;color:#4b5563;font-family:inherit;font-weight:500;transition:all .15s ease}.tiptap-editor-wrapper .tiptap-toolbar .toolbar-select:hover{background:#f3f4f6;color:#111827}.tiptap-editor-wrapper .tiptap-toolbar .toolbar-select:focus{outline:none;box-shadow:0 0 0 2px rgba(15,98,254,.2)}.tiptap-editor-wrapper .tiptap-toolbar .select-caret{position:absolute;right:.5rem;pointer-events:none;width:16px;height:16px;fill:#6b7280}.tiptap-editor-wrapper .tiptap-highlight-menu{position:absolute;top:110%;left:50%;transform:translateX(-50%);background:#fff;border:1px solid #e5e7eb;border-radius:9999px;padding:4px;display:flex;gap:6px;box-shadow:0 4px 6px -1px rgba(0,0,0,.1),0 2px 4px -1px rgba(0,0,0,.06);z-index:100}.tiptap-editor-wrapper .tiptap-highlight-menu .color-swatch{width:18px !important;height:18px !important;min-width:18px !important;min-height:18px !important;border-radius:50% !important;border:1px solid rgba(0,0,0,.1) !important;cursor:pointer;padding:0 !important;background-color:#fff;display:flex;align-items:center;justify-content:center;transition:transform .1s ease}.tiptap-editor-wrapper .tiptap-highlight-menu .color-swatch:hover{transform:scale(1.2)}.tiptap-editor-wrapper .tiptap-highlight-menu .color-swatch.clear-swatch{background-color:rgba(0,0,0,0) !important;border:1px solid #d1d5db !important}.tiptap-editor-wrapper .tiptap-highlight-menu .color-swatch svg{width:12px;height:12px;color:#6b7280}.tiptap-editor-wrapper .tiptap-font-menu{position:absolute;top:110%;left:0;background:#fff;border:1px solid #e5e7eb;border-radius:8px;padding:4px;box-shadow:0 10px 15px -3px rgba(0,0,0,.1),0 4px 6px -2px rgba(0,0,0,.05);z-index:100;min-width:180px;max-height:300px;overflow-y:auto}.tiptap-editor-wrapper .tiptap-font-menu .font-option{width:100%;text-align:left;padding:8px 12px;border-radius:4px;background:none;border:none;font-size:14px;color:#374151;cursor:pointer;transition:all .15s ease}.tiptap-editor-wrapper .tiptap-font-menu .font-option:hover:not(.is-active){background:#f3f4f6;color:#111827}.tiptap-editor-wrapper .tiptap-font-menu .font-option.is-active{background:#0062ff;color:#fff;font-weight:500}.tiptap-editor-wrapper .tiptap-heading-menu{position:absolute;top:110%;left:0;background:#fff;border:1px solid #e5e7eb;border-radius:8px;padding:4px;box-shadow:0 10px 15px -3px rgba(0,0,0,.1),0 4px 6px -2px rgba(0,0,0,.05);z-index:100;min-width:140px}.tiptap-editor-wrapper .tiptap-heading-menu .heading-option{width:100%;text-align:left;padding:6px 12px;border-radius:4px;background:none;border:none;font-size:14px;color:#374151;cursor:pointer;transition:all .15s ease}.tiptap-editor-wrapper .tiptap-heading-menu .heading-option:hover{background:#f3f4f6;color:#111827}.tiptap-editor-wrapper .tiptap-heading-menu .heading-option.is-active{background:#eff6ff;color:#2563eb;font-weight:600}.tiptap-editor-wrapper .tiptap-heading-menu .heading-option.h1{font-size:1.35rem;font-weight:700}.tiptap-editor-wrapper .tiptap-heading-menu .heading-option.h2{font-size:1.25rem;font-weight:600}.tiptap-editor-wrapper .tiptap-heading-menu .heading-option.h3{font-size:1.15rem;font-weight:600}.tiptap-editor-wrapper .tiptap-heading-menu .heading-option.h4{font-size:1.05rem;font-weight:600}.tiptap-editor-wrapper .tiptap-heading-menu .heading-option.h5{font-size:1rem;font-weight:600}.tiptap-editor-wrapper .tiptap-heading-menu .heading-option.h6{font-size:.9rem;font-weight:600}.tiptap-editor-wrapper .tiptap-color-picker{position:absolute;top:110%;left:50%;transform:translateX(-50%);background:#fff;border:1px solid #e5e7eb;border-radius:10px;padding:10px;box-shadow:0 10px 15px -3px rgba(0,0,0,.1),0 4px 6px -2px rgba(0,0,0,.05);z-index:100;width:160px}.tiptap-editor-wrapper .tiptap-color-picker .color-remove-btn{width:100%;display:flex;align-items:center;justify-content:center;gap:8px;padding:8px;margin-bottom:8px;background:#fdfdfd;border:1px solid #e5e7eb;border-radius:6px;font-size:13px;color:#4b5563;cursor:pointer;transition:all .15s ease}.tiptap-editor-wrapper .tiptap-color-picker .color-remove-btn:hover{background:#f3f4f6;border-color:#d1d5db;color:#111827}.tiptap-editor-wrapper .tiptap-color-picker .color-remove-btn svg{width:14px;height:14px}.tiptap-editor-wrapper .tiptap-color-picker .color-grid{display:grid;grid-template-columns:repeat(5, 1fr);gap:4px}.tiptap-editor-wrapper .tiptap-color-picker .color-grid .color-swatch{width:24px !important;height:24px !important;min-width:24px !important;min-height:24px !important;border-radius:4px !important;border:1px solid rgba(0,0,0,.08) !important;padding:0 !important;cursor:pointer;transition:transform .15s ease,border-color .15s ease}.tiptap-editor-wrapper .tiptap-color-picker .color-grid .color-swatch:hover{transform:scale(1.15);border-color:rgba(0,0,0,.2) !important;z-index:2}.tiptap-editor-wrapper .tiptap-link-menu{position:absolute;top:110%;left:50%;transform:translateX(-50%);background:#fff;border:1px solid #e5e7eb;border-radius:8px;padding:4px;display:flex;align-items:center;gap:2px;box-shadow:0 4px 6px -1px rgba(0,0,0,.1),0 2px 4px -1px rgba(0,0,0,.06);z-index:100;width:300px}.tiptap-editor-wrapper .tiptap-link-menu input{flex:1;border:1px solid #d1d5db;border-radius:4px;padding:4px 8px;font-size:14px;outline:none;transition:border-color .15s ease}.tiptap-editor-wrapper .tiptap-link-menu input:focus{border-color:#3b82f6;box-shadow:0 0 0 1px #3b82f6}.tiptap-editor-wrapper .tiptap-link-menu button{width:28px !important;height:28px !important;padding:0 !important;min-width:28px !important;border-radius:4px !important;display:flex;align-items:center;justify-content:center}.tiptap-editor-wrapper .tiptap-link-menu button svg{width:14px;height:14px}.tiptap-editor-wrapper .tiptap-link-menu button.link-submit-btn{color:#22c55e}.tiptap-editor-wrapper .tiptap-link-menu button.link-submit-btn:hover{background:#dcfce7}.tiptap-editor-wrapper .tiptap-link-menu button.link-clear-btn{color:#ef4444}.tiptap-editor-wrapper .tiptap-link-menu button.link-clear-btn:hover{background:#fee2e2}.tiptap-editor-wrapper .tiptap-table-menu{position:absolute;top:110%;left:0;background:#fff;border:1px solid #e5e7eb;border-radius:8px;padding:8px;box-shadow:0 10px 15px -3px rgba(0,0,0,.1),0 4px 6px -2px rgba(0,0,0,.05);z-index:100;min-width:200px}.tiptap-editor-wrapper .tiptap-table-menu .table-grid-picker-wrapper{padding:4px;background:#fff}.tiptap-editor-wrapper .tiptap-table-menu .table-grid-picker-wrapper .table-grid-picker{display:flex;flex-direction:column;gap:2px;padding-bottom:8px}.tiptap-editor-wrapper .tiptap-table-menu .table-grid-picker-wrapper .grid-row{display:flex;gap:2px}.tiptap-editor-wrapper .tiptap-table-menu .table-grid-picker-wrapper .grid-cell{width:16px;height:16px;border:1px solid #d1d5db;border-radius:1px;cursor:pointer;transition:background-color .1s,border-color .1s}.tiptap-editor-wrapper .tiptap-table-menu .table-grid-picker-wrapper .grid-cell:hover{border-color:#3b82f6}.tiptap-editor-wrapper .tiptap-table-menu .table-grid-picker-wrapper .grid-cell.is-active{background-color:#bfdbfe;border-color:#3b82f6}.tiptap-editor-wrapper .tiptap-table-menu .table-grid-picker-wrapper .table-grid-label{text-align:center;font-size:13px;color:#4b5563;font-weight:500;border-top:1px solid #f3f4f6;padding-top:8px;margin-top:2px}.tiptap-editor-wrapper .tiptap-table-menu .table-menu-item{width:100%;display:flex;align-items:center;gap:8px;padding:8px 12px;border-radius:4px;background:none;border:none;font-size:13px;color:#374151;transition:background .15s ease;white-space:nowrap;cursor:pointer}.tiptap-editor-wrapper .tiptap-table-menu .table-menu-item:hover{background:#f3f4f6}.tiptap-editor-wrapper .tiptap-table-menu .table-menu-item svg{width:16px;height:16px;color:#6b7280}.tiptap-editor-wrapper .tiptap-table-menu .table-menu-grid{display:grid;grid-template-columns:repeat(3, 1fr);gap:6px}.tiptap-editor-wrapper .tiptap-table-menu .table-menu-grid button{width:32px !important;height:32px !important;padding:0 !important;min-width:32px !important;display:flex;align-items:center;justify-content:center;border-radius:4px;background:#f9fafb !important;border:1px solid #e5e7eb !important;color:#4b5563 !important;cursor:pointer}.tiptap-editor-wrapper .tiptap-table-menu .table-menu-grid button:hover{background:#f3f4f6 !important;border-color:#d1d5db !important}.tiptap-editor-wrapper .tiptap-table-menu .table-menu-grid button.danger{color:#ef4444 !important}.tiptap-editor-wrapper .tiptap-table-menu .table-menu-grid button.danger:hover{background:#fee2e2 !important;border-color:#fca5a5 !important}.tiptap-editor-wrapper .tiptap-table-menu .table-menu-grid button svg{width:16px;height:16px}.tiptap-editor-wrapper .ProseMirror{min-height:300px;padding:1.5rem;color:#1f2937;outline:none;line-height:1.7}.tiptap-editor-wrapper .ProseMirror p.is-editor-empty:first-child::before{color:#9ca3af;content:attr(data-placeholder);float:left;height:0;pointer-events:none}.tiptap-editor-wrapper .ProseMirror h1,.tiptap-editor-wrapper .ProseMirror h2,.tiptap-editor-wrapper .ProseMirror h3,.tiptap-editor-wrapper .ProseMirror h4{line-height:1.2;color:#111827}.tiptap-editor-wrapper .ProseMirror h1{font-size:2.25rem;font-weight:700;margin:1em 0 .5em}.tiptap-editor-wrapper .ProseMirror h2{font-size:1.875rem;font-weight:600;margin:1em 0 .5em}.tiptap-editor-wrapper .ProseMirror h3{font-size:1.5rem;font-weight:600;margin:1em 0 .5em}.tiptap-editor-wrapper .ProseMirror h4{font-size:1.25rem;font-weight:600;margin:1em 0 .5em}.tiptap-editor-wrapper .ProseMirror [style*="font-size: 0.7em"],.tiptap-editor-wrapper .ProseMirror .text-tiny{font-size:.7em}.tiptap-editor-wrapper .ProseMirror [style*="font-size: 0.85em"],.tiptap-editor-wrapper .ProseMirror .text-small{font-size:.85em}.tiptap-editor-wrapper .ProseMirror [style*="font-size: 1.4em"],.tiptap-editor-wrapper .ProseMirror .text-big{font-size:1.4em}.tiptap-editor-wrapper .ProseMirror [style*="font-size: 1.8em"],.tiptap-editor-wrapper .ProseMirror .text-huge{font-size:1.8em}.tiptap-editor-wrapper .ProseMirror p:nth-child(1){margin:0 0}.tiptap-editor-wrapper .ProseMirror p{margin:.5em 0}.tiptap-editor-wrapper .ProseMirror ul{list-style-type:disc;padding-left:1.5rem;margin:.5em 0}.tiptap-editor-wrapper .ProseMirror ol{list-style-type:decimal;padding-left:1.5rem;margin:.5em 0}.tiptap-editor-wrapper .ProseMirror blockquote{border-left:4px solid #e5e7eb;padding-left:1rem;margin:1em 0;color:#4b5563;font-style:italic}.tiptap-editor-wrapper .ProseMirror code{background:#f3f4f6;border-radius:4px;padding:.2rem .4rem;font-family:ui-monospace,SFMono-Regular,Menlo,Monaco,Consolas,monospace;font-size:.875em}.tiptap-editor-wrapper .ProseMirror pre{background:#111827;color:#f3f4f6;border-radius:.5rem;padding:1rem;overflow-x:auto;margin:1em 0}.tiptap-editor-wrapper .ProseMirror pre code{background:none;padding:0;color:inherit}.tiptap-editor-wrapper .ProseMirror img{max-width:100%;height:auto;display:block;margin:1rem 0;border-radius:.375rem;box-shadow:0 1px 3px 0 rgba(0,0,0,.1)}.tiptap-editor-wrapper .ProseMirror a{color:#2563eb;text-decoration:underline;text-underline-offset:2px;font-weight:500;cursor:pointer}.tiptap-editor-wrapper .ProseMirror a:hover{color:#1d4ed8}.tiptap-editor-wrapper .ProseMirror a[data-attachment=true]{display:inline-flex;align-items:center;gap:.375rem;padding:.25rem .6rem;background:#f3f4f6;border:1px solid #e5e7eb;border-radius:.375rem;font-size:14px;text-decoration:none;color:#111827;font-weight:500;transition:all .15s ease}.tiptap-editor-wrapper .ProseMirror a[data-attachment=true]::before{content:"📎";font-size:13px;opacity:.7}.tiptap-editor-wrapper .ProseMirror a[data-attachment=true]:hover{background:#e5e7eb;border-color:#d1d5db}.tiptap-editor-wrapper .ProseMirror mark{background-color:#fde047;border-radius:.125rem;padding:.125rem .25rem;color:#854d0e}.tiptap-editor-wrapper .ProseMirror sup{vertical-align:super;font-size:.75em}.tiptap-editor-wrapper .ProseMirror sub{vertical-align:sub;font-size:.75em}.tiptap-editor-wrapper .ProseMirror table{border-collapse:collapse;table-layout:fixed;width:100%;margin:1.5rem 0;overflow:hidden}.tiptap-editor-wrapper .ProseMirror table td,.tiptap-editor-wrapper .ProseMirror table th{min-width:1em;border:1px solid #ced4da;padding:8px 12px;vertical-align:top;box-sizing:border-box;position:relative}.tiptap-editor-wrapper .ProseMirror table td>*,.tiptap-editor-wrapper .ProseMirror table th>*{margin-bottom:0}.tiptap-editor-wrapper .ProseMirror table th{font-weight:bold;text-align:left;background-color:#f8f9fa}.tiptap-editor-wrapper .ProseMirror table .selectedCell:after{z-index:2;position:absolute;content:"";left:0;right:0;top:0;bottom:0;background:rgba(200,200,255,.4);pointer-events:none}.tiptap-editor-wrapper .ProseMirror table .column-resize-handle{position:absolute;right:-2px;top:0;bottom:-2px;width:4px;background-color:#adf;pointer-events:none}.tiptap-editor-wrapper .ProseMirror .tableWrapper{overflow-x:auto;margin:1.5rem 0}.tiptap-editor-wrapper.read-only .tiptap-toolbar{background:#f3f3f3;pointer-events:none}.tiptap-editor-wrapper.read-only .tiptap-toolbar button,.tiptap-editor-wrapper.read-only .tiptap-toolbar .toolbar-select{opacity:.5;filter:grayscale(1)}.tiptap-editor-wrapper.read-only .ProseMirror{background:#f3f3f3;color:#6b7280;cursor:default;min-height:300px}.tiptap-editor-wrapper .tiptap-toolbar.toolbar-disabled{background:#f3f3f3;border-bottom-color:#e5e7eb}.tiptap-editor-wrapper .tiptap-toolbar.toolbar-disabled *{cursor:not-allowed !important}.tiptap-editor-wrapper .tiptap-loading-bar{height:3px;background:linear-gradient(90deg, #0f62fe 0%, #4589ff 50%, #0f62fe 100%);background-size:200% 100%;animation:tiptap-loading-anim 1.2s linear infinite;border-radius:0}@keyframes tiptap-loading-anim{0%{background-position:200% 0}100%{background-position:-200% 0}}.tiptap-hidden-input{display:none !important}
1
+ .tiptap-editor-wrapper{border:1px solid #e5e7eb;border-radius:.75rem;overflow:hidden;font-size:15px;font-family:"Inter",-apple-system,BlinkMacSystemFont,"Segoe UI",Helvetica,Arial,sans-serif;background:#fff;box-shadow:0 1px 3px 0 rgba(0,0,0,.05),0 1px 2px -1px rgba(0,0,0,.05)}.tiptap-editor-wrapper .tiptap-toolbar{display:flex;flex-wrap:wrap;align-items:center;gap:.25rem;padding:.35rem .75rem;background:#fff;border-bottom:1px solid #f3f4f6}.tiptap-editor-wrapper .tiptap-toolbar button{display:inline-flex;align-items:center;justify-content:center;width:32px;height:32px;padding:0;border:none;border-radius:.375rem;background:rgba(0,0,0,0);cursor:pointer;color:#4b5563;font-size:14px;font-weight:500;transition:all .15s ease;line-height:1}.tiptap-editor-wrapper .tiptap-toolbar button:hover:not(:disabled){background:#f3f4f6;color:#111827}.tiptap-editor-wrapper .tiptap-toolbar button.is-active{background:#e5e7eb;color:#111827}.tiptap-editor-wrapper .tiptap-toolbar button:disabled{opacity:.4;cursor:not-allowed}.tiptap-editor-wrapper .tiptap-toolbar button.toolbar-button-dropdown{width:30px;padding:0 2px 0 4px;gap:1px}.tiptap-editor-wrapper .tiptap-toolbar button.toolbar-button-dropdown .dropdown-arrow{width:9px;height:9px;opacity:.6;margin-left:-2px}.tiptap-editor-wrapper .tiptap-toolbar button svg{width:18px;height:18px}.tiptap-editor-wrapper .tiptap-toolbar .toolbar-divider{width:1px;height:20px;background:#e5e7eb;margin:0 .5rem;flex-shrink:0}.tiptap-editor-wrapper .tiptap-toolbar .toolbar-select-wrapper{position:relative;display:inline-flex;align-items:center}.tiptap-editor-wrapper .tiptap-toolbar .toolbar-select{appearance:none;height:32px;border:none;border-radius:.375rem;background:rgba(0,0,0,0);font-size:14.5px;cursor:pointer;padding:0 1.5rem 0 .5rem;color:#4b5563;font-family:inherit;font-weight:500;transition:all .15s ease}.tiptap-editor-wrapper .tiptap-toolbar .toolbar-select:hover{background:#f3f4f6;color:#111827}.tiptap-editor-wrapper .tiptap-toolbar .toolbar-select:focus{outline:none;box-shadow:0 0 0 2px rgba(15,98,254,.2)}.tiptap-editor-wrapper .tiptap-toolbar .select-caret{position:absolute;right:.5rem;pointer-events:none;width:16px;height:16px;fill:#6b7280}.tiptap-editor-wrapper .tiptap-highlight-menu{position:absolute;top:110%;left:50%;transform:translateX(-50%);background:#fff;border:1px solid #e5e7eb;border-radius:9999px;padding:4px;display:flex;gap:6px;box-shadow:0 4px 6px -1px rgba(0,0,0,.1),0 2px 4px -1px rgba(0,0,0,.06);z-index:100}.tiptap-editor-wrapper .tiptap-highlight-menu .color-swatch{width:18px !important;height:18px !important;min-width:18px !important;min-height:18px !important;border-radius:50% !important;border:1px solid rgba(0,0,0,.1) !important;cursor:pointer;padding:0 !important;background-color:#fff;display:flex;align-items:center;justify-content:center;transition:transform .1s ease}.tiptap-editor-wrapper .tiptap-highlight-menu .color-swatch:hover{transform:scale(1.2)}.tiptap-editor-wrapper .tiptap-highlight-menu .color-swatch.clear-swatch{background-color:rgba(0,0,0,0) !important;border:1px solid #d1d5db !important}.tiptap-editor-wrapper .tiptap-highlight-menu .color-swatch svg{width:12px;height:12px;color:#6b7280}.tiptap-editor-wrapper .tiptap-font-menu{position:absolute;top:110%;left:0;background:#fff;border:1px solid #e5e7eb;border-radius:8px;padding:4px;box-shadow:0 10px 15px -3px rgba(0,0,0,.1),0 4px 6px -2px rgba(0,0,0,.05);z-index:100;min-width:180px;max-height:300px;overflow-y:auto}.tiptap-editor-wrapper .tiptap-font-menu .font-option{width:100%;text-align:left;padding:8px 12px;border-radius:4px;background:none;border:none;font-size:14px;color:#374151;cursor:pointer;transition:all .15s ease}.tiptap-editor-wrapper .tiptap-font-menu .font-option:hover:not(.is-active){background:#f3f4f6;color:#111827}.tiptap-editor-wrapper .tiptap-font-menu .font-option.is-active{background:#0062ff;color:#fff;font-weight:500}.tiptap-editor-wrapper .tiptap-heading-menu{position:absolute;top:110%;left:0;background:#fff;border:1px solid #e5e7eb;border-radius:8px;padding:4px;box-shadow:0 10px 15px -3px rgba(0,0,0,.1),0 4px 6px -2px rgba(0,0,0,.05);z-index:100;min-width:140px}.tiptap-editor-wrapper .tiptap-heading-menu .heading-option{width:100%;text-align:left;padding:6px 12px;border-radius:4px;background:none;border:none;font-size:14px;color:#374151;cursor:pointer;transition:all .15s ease}.tiptap-editor-wrapper .tiptap-heading-menu .heading-option:hover{background:#f3f4f6;color:#111827}.tiptap-editor-wrapper .tiptap-heading-menu .heading-option.is-active{background:#eff6ff;color:#2563eb;font-weight:600}.tiptap-editor-wrapper .tiptap-heading-menu .heading-option.h1{font-size:1.35rem;font-weight:700}.tiptap-editor-wrapper .tiptap-heading-menu .heading-option.h2{font-size:1.25rem;font-weight:600}.tiptap-editor-wrapper .tiptap-heading-menu .heading-option.h3{font-size:1.15rem;font-weight:600}.tiptap-editor-wrapper .tiptap-heading-menu .heading-option.h4{font-size:1.05rem;font-weight:600}.tiptap-editor-wrapper .tiptap-heading-menu .heading-option.h5{font-size:1rem;font-weight:600}.tiptap-editor-wrapper .tiptap-heading-menu .heading-option.h6{font-size:.9rem;font-weight:600}.tiptap-editor-wrapper .tiptap-color-picker{position:absolute;top:110%;left:50%;transform:translateX(-50%);background:#fff;border:1px solid #e5e7eb;border-radius:10px;padding:10px;box-shadow:0 10px 15px -3px rgba(0,0,0,.1),0 4px 6px -2px rgba(0,0,0,.05);z-index:100;width:160px}.tiptap-editor-wrapper .tiptap-color-picker .color-remove-btn{width:100%;display:flex;align-items:center;justify-content:center;gap:8px;padding:8px;margin-bottom:8px;background:#fdfdfd;border:1px solid #e5e7eb;border-radius:6px;font-size:13px;color:#4b5563;cursor:pointer;transition:all .15s ease}.tiptap-editor-wrapper .tiptap-color-picker .color-remove-btn:hover{background:#f3f4f6;border-color:#d1d5db;color:#111827}.tiptap-editor-wrapper .tiptap-color-picker .color-remove-btn svg{width:14px;height:14px}.tiptap-editor-wrapper .tiptap-color-picker .color-grid{display:grid;grid-template-columns:repeat(5, 1fr);gap:4px}.tiptap-editor-wrapper .tiptap-color-picker .color-grid .color-swatch{width:24px !important;height:24px !important;min-width:24px !important;min-height:24px !important;border-radius:4px !important;border:1px solid rgba(0,0,0,.08) !important;padding:0 !important;cursor:pointer;transition:transform .15s ease,border-color .15s ease}.tiptap-editor-wrapper .tiptap-color-picker .color-grid .color-swatch:hover{transform:scale(1.15);border-color:rgba(0,0,0,.2) !important;z-index:2}.tiptap-editor-wrapper .tiptap-link-menu{position:absolute;top:110%;left:50%;transform:translateX(-50%);box-sizing:border-box;background:#fff;border:1px solid #e5e7eb;border-radius:8px;padding:4px;display:flex;align-items:center;gap:2px;box-shadow:0 4px 6px -1px rgba(0,0,0,.1),0 2px 4px -1px rgba(0,0,0,.06);z-index:100;width:300px;max-width:calc(100vw - 32px)}.tiptap-editor-wrapper .tiptap-link-menu.align-start{left:0;transform:none}.tiptap-editor-wrapper .tiptap-link-menu.align-end{right:0;left:auto;transform:none}.tiptap-editor-wrapper .tiptap-link-menu input{flex:1;min-width:0;border:1px solid #d1d5db;border-radius:4px;padding:4px 8px;font-size:14px;outline:none;transition:border-color .15s ease}.tiptap-editor-wrapper .tiptap-link-menu input:focus{border-color:#3b82f6;box-shadow:0 0 0 1px #3b82f6}.tiptap-editor-wrapper .tiptap-link-menu button{width:28px !important;height:28px !important;padding:0 !important;min-width:28px !important;border-radius:4px !important;display:flex;align-items:center;justify-content:center}.tiptap-editor-wrapper .tiptap-link-menu button svg{width:14px;height:14px}.tiptap-editor-wrapper .tiptap-link-menu button.link-submit-btn{color:#22c55e}.tiptap-editor-wrapper .tiptap-link-menu button.link-submit-btn:hover{background:#dcfce7}.tiptap-editor-wrapper .tiptap-link-menu button.link-clear-btn{color:#ef4444}.tiptap-editor-wrapper .tiptap-link-menu button.link-clear-btn:hover{background:#fee2e2}.tiptap-editor-wrapper .tiptap-table-menu{position:absolute;top:110%;left:0;background:#fff;border:1px solid #e5e7eb;border-radius:8px;padding:8px;box-shadow:0 10px 15px -3px rgba(0,0,0,.1),0 4px 6px -2px rgba(0,0,0,.05);z-index:100;min-width:200px}.tiptap-editor-wrapper .tiptap-table-menu .table-grid-picker-wrapper{padding:4px;background:#fff}.tiptap-editor-wrapper .tiptap-table-menu .table-grid-picker-wrapper .table-grid-picker{display:flex;flex-direction:column;gap:2px;padding-bottom:8px}.tiptap-editor-wrapper .tiptap-table-menu .table-grid-picker-wrapper .grid-row{display:flex;gap:2px}.tiptap-editor-wrapper .tiptap-table-menu .table-grid-picker-wrapper .grid-cell{width:16px;height:16px;border:1px solid #d1d5db;border-radius:1px;cursor:pointer;transition:background-color .1s,border-color .1s}.tiptap-editor-wrapper .tiptap-table-menu .table-grid-picker-wrapper .grid-cell:hover{border-color:#3b82f6}.tiptap-editor-wrapper .tiptap-table-menu .table-grid-picker-wrapper .grid-cell.is-active{background-color:#bfdbfe;border-color:#3b82f6}.tiptap-editor-wrapper .tiptap-table-menu .table-grid-picker-wrapper .table-grid-label{text-align:center;font-size:13px;color:#4b5563;font-weight:500;border-top:1px solid #f3f4f6;padding-top:8px;margin-top:2px}.tiptap-editor-wrapper .tiptap-table-menu .table-menu-item{width:100%;display:flex;align-items:center;gap:8px;padding:8px 12px;border-radius:4px;background:none;border:none;font-size:13px;color:#374151;transition:background .15s ease;white-space:nowrap;cursor:pointer}.tiptap-editor-wrapper .tiptap-table-menu .table-menu-item:hover{background:#f3f4f6}.tiptap-editor-wrapper .tiptap-table-menu .table-menu-item svg{width:16px;height:16px;color:#6b7280}.tiptap-editor-wrapper .tiptap-table-menu .table-menu-grid{display:grid;grid-template-columns:repeat(3, 1fr);gap:6px}.tiptap-editor-wrapper .tiptap-table-menu .table-menu-grid button{width:32px !important;height:32px !important;padding:0 !important;min-width:32px !important;display:flex;align-items:center;justify-content:center;border-radius:4px;background:#f9fafb !important;border:1px solid #e5e7eb !important;color:#4b5563 !important;cursor:pointer}.tiptap-editor-wrapper .tiptap-table-menu .table-menu-grid button:hover{background:#f3f4f6 !important;border-color:#d1d5db !important}.tiptap-editor-wrapper .tiptap-table-menu .table-menu-grid button.danger{color:#ef4444 !important}.tiptap-editor-wrapper .tiptap-table-menu .table-menu-grid button.danger:hover{background:#fee2e2 !important;border-color:#fca5a5 !important}.tiptap-editor-wrapper .tiptap-table-menu .table-menu-grid button svg{width:16px;height:16px}.tiptap-editor-wrapper .ProseMirror{min-height:300px;padding:1.5rem;color:#1f2937;outline:none;line-height:1.7}.tiptap-editor-wrapper .ProseMirror p.is-editor-empty:first-child::before{color:#9ca3af;content:attr(data-placeholder);float:left;height:0;pointer-events:none}.tiptap-editor-wrapper .ProseMirror h1,.tiptap-editor-wrapper .ProseMirror h2,.tiptap-editor-wrapper .ProseMirror h3,.tiptap-editor-wrapper .ProseMirror h4{line-height:1.2;color:#111827}.tiptap-editor-wrapper .ProseMirror h1{font-size:2.25rem;font-weight:700;margin:1em 0 .5em}.tiptap-editor-wrapper .ProseMirror h2{font-size:1.875rem;font-weight:600;margin:1em 0 .5em}.tiptap-editor-wrapper .ProseMirror h3{font-size:1.5rem;font-weight:600;margin:1em 0 .5em}.tiptap-editor-wrapper .ProseMirror h4{font-size:1.25rem;font-weight:600;margin:1em 0 .5em}.tiptap-editor-wrapper .ProseMirror [style*="font-size: 0.7em"],.tiptap-editor-wrapper .ProseMirror .text-tiny{font-size:.7em}.tiptap-editor-wrapper .ProseMirror [style*="font-size: 0.85em"],.tiptap-editor-wrapper .ProseMirror .text-small{font-size:.85em}.tiptap-editor-wrapper .ProseMirror [style*="font-size: 1.4em"],.tiptap-editor-wrapper .ProseMirror .text-big{font-size:1.4em}.tiptap-editor-wrapper .ProseMirror [style*="font-size: 1.8em"],.tiptap-editor-wrapper .ProseMirror .text-huge{font-size:1.8em}.tiptap-editor-wrapper .ProseMirror p:nth-child(1){margin:0 0}.tiptap-editor-wrapper .ProseMirror p{margin:.5em 0}.tiptap-editor-wrapper .ProseMirror ul{list-style-type:disc;padding-left:1.5rem;margin:.5em 0}.tiptap-editor-wrapper .ProseMirror ol{list-style-type:decimal;padding-left:1.5rem;margin:.5em 0}.tiptap-editor-wrapper .ProseMirror blockquote{border-left:4px solid #e5e7eb;padding-left:1rem;margin:1em 0;color:#4b5563;font-style:italic}.tiptap-editor-wrapper .ProseMirror code{background:#f3f4f6;border-radius:4px;padding:.2rem .4rem;font-family:ui-monospace,SFMono-Regular,Menlo,Monaco,Consolas,monospace;font-size:.875em}.tiptap-editor-wrapper .ProseMirror pre{background:#111827;color:#f3f4f6;border-radius:.5rem;padding:1rem;overflow-x:auto;margin:1em 0}.tiptap-editor-wrapper .ProseMirror pre code{background:none;padding:0;color:inherit}.tiptap-editor-wrapper .ProseMirror img{max-width:100%;height:auto;display:block;margin:1rem 0;border-radius:.375rem;box-shadow:0 1px 3px 0 rgba(0,0,0,.1)}.tiptap-editor-wrapper .ProseMirror a{color:#2563eb;text-decoration:underline;text-underline-offset:2px;font-weight:500;cursor:pointer}.tiptap-editor-wrapper .ProseMirror a:hover{color:#1d4ed8}.tiptap-editor-wrapper .ProseMirror a[data-attachment=true]{display:inline-flex;align-items:center;gap:.375rem;padding:.25rem .6rem;background:#f3f4f6;border:1px solid #e5e7eb;border-radius:.375rem;font-size:14px;text-decoration:none;color:#111827;font-weight:500;transition:all .15s ease}.tiptap-editor-wrapper .ProseMirror a[data-attachment=true]::before{content:"📎";font-size:13px;opacity:.7}.tiptap-editor-wrapper .ProseMirror a[data-attachment=true]:hover{background:#e5e7eb;border-color:#d1d5db}.tiptap-editor-wrapper .ProseMirror mark{background-color:#fde047;border-radius:.125rem;padding:.125rem .25rem;color:#854d0e}.tiptap-editor-wrapper .ProseMirror sup{vertical-align:super;font-size:.75em}.tiptap-editor-wrapper .ProseMirror sub{vertical-align:sub;font-size:.75em}.tiptap-editor-wrapper .ProseMirror table{border-collapse:collapse;table-layout:fixed;width:100%;margin:1.5rem 0;overflow:hidden}.tiptap-editor-wrapper .ProseMirror table td,.tiptap-editor-wrapper .ProseMirror table th{min-width:1em;border:1px solid #ced4da;padding:8px 12px;vertical-align:top;box-sizing:border-box;position:relative}.tiptap-editor-wrapper .ProseMirror table td>*,.tiptap-editor-wrapper .ProseMirror table th>*{margin-bottom:0}.tiptap-editor-wrapper .ProseMirror table th{font-weight:bold;text-align:left;background-color:#f8f9fa}.tiptap-editor-wrapper .ProseMirror table .selectedCell:after{z-index:2;position:absolute;content:"";left:0;right:0;top:0;bottom:0;background:rgba(200,200,255,.4);pointer-events:none}.tiptap-editor-wrapper .ProseMirror table .column-resize-handle{position:absolute;right:-2px;top:0;bottom:-2px;width:4px;background-color:#adf;pointer-events:none}.tiptap-editor-wrapper .ProseMirror .tableWrapper{overflow-x:auto;margin:1.5rem 0}.tiptap-editor-wrapper.read-only .tiptap-toolbar{background:#f3f3f3;pointer-events:none}.tiptap-editor-wrapper.read-only .tiptap-toolbar button,.tiptap-editor-wrapper.read-only .tiptap-toolbar .toolbar-select{opacity:.5;filter:grayscale(1)}.tiptap-editor-wrapper.read-only .ProseMirror{background:#f3f3f3;color:#6b7280;cursor:default;min-height:300px}.tiptap-editor-wrapper .tiptap-toolbar.toolbar-disabled{background:#f3f3f3;border-bottom-color:#e5e7eb}.tiptap-editor-wrapper .tiptap-toolbar.toolbar-disabled *{cursor:not-allowed !important}.tiptap-editor-wrapper .tiptap-loading-bar{height:3px;background:linear-gradient(90deg, #0f62fe 0%, #4589ff 50%, #0f62fe 100%);background-size:200% 100%;animation:tiptap-loading-anim 1.2s linear infinite;border-radius:0}@keyframes tiptap-loading-anim{0%{background-position:200% 0}100%{background-position:-200% 0}}.tiptap-hidden-input{display:none !important}
package/dist/index.js CHANGED
@@ -42,8 +42,8 @@ __export(index_exports, {
42
42
  module.exports = __toCommonJS(index_exports);
43
43
 
44
44
  // src/TiptapEditor.tsx
45
- var import_react = __toESM(require("react"));
46
- var import_react2 = require("@tiptap/react");
45
+ var import_react2 = __toESM(require("react"));
46
+ var import_react3 = require("@tiptap/react");
47
47
 
48
48
  // src/extensions.ts
49
49
  var import_starter_kit = __toESM(require("@tiptap/starter-kit"));
@@ -115,6 +115,45 @@ var FontSize = import_core.Extension.create({
115
115
  // src/backgroundColor.ts
116
116
  var import_core2 = require("@tiptap/core");
117
117
  var import_extension_text_style2 = require("@tiptap/extension-text-style");
118
+
119
+ // src/utils.ts
120
+ var toHex2 = (n) => n.toString(16).padStart(2, "0");
121
+ function rgbToHex(input) {
122
+ if (!input) return input;
123
+ const m = input.match(
124
+ /^\s*rgba?\(\s*(\d+)\s*,\s*(\d+)\s*,\s*(\d+)\s*(?:,\s*([\d.]+)\s*)?\)\s*$/i
125
+ );
126
+ if (!m) return input.trim();
127
+ const r = Math.min(255, parseInt(m[1], 10));
128
+ const g = Math.min(255, parseInt(m[2], 10));
129
+ const b = Math.min(255, parseInt(m[3], 10));
130
+ const base = "#" + toHex2(r) + toHex2(g) + toHex2(b);
131
+ if (m[4] === void 0) return base;
132
+ const a = Math.max(0, Math.min(1, parseFloat(m[4])));
133
+ if (a >= 1) return base;
134
+ return base + toHex2(Math.round(a * 255));
135
+ }
136
+ function normalizeColorsInHtml(html) {
137
+ if (!html) return html;
138
+ return html.replace(
139
+ /rgba?\(\s*\d+\s*,\s*\d+\s*,\s*\d+(?:\s*,\s*[\d.]+)?\s*\)/gi,
140
+ (match) => rgbToHex(match)
141
+ );
142
+ }
143
+ async function uploadFileToCOS(file, docNum, onUploadFile, receiveStatus, elementId, onLoadingChange, suppressStatusChange = false) {
144
+ receiveStatus && elementId && receiveStatus(elementId, true);
145
+ if (!suppressStatusChange) onLoadingChange == null ? void 0 : onLoadingChange(true);
146
+ try {
147
+ const url = await onUploadFile(file, docNum);
148
+ if (!url) throw new Error("Upload failed: no URL returned");
149
+ return url;
150
+ } finally {
151
+ if (!suppressStatusChange) onLoadingChange == null ? void 0 : onLoadingChange(false);
152
+ receiveStatus && elementId && receiveStatus(elementId, false);
153
+ }
154
+ }
155
+
156
+ // src/backgroundColor.ts
118
157
  var BackgroundColor = import_core2.Extension.create({
119
158
  name: "backgroundColor",
120
159
  addOptions() {
@@ -129,13 +168,13 @@ var BackgroundColor = import_core2.Extension.create({
129
168
  attributes: {
130
169
  backgroundColor: {
131
170
  default: null,
132
- parseHTML: (element) => element.style.backgroundColor.replace(/['"]+/g, ""),
171
+ parseHTML: (element) => rgbToHex(element.style.backgroundColor.replace(/['"]+/g, "")),
133
172
  renderHTML: (attributes) => {
134
173
  if (!attributes.backgroundColor) {
135
174
  return {};
136
175
  }
137
176
  return {
138
- style: `background-color: ${attributes.backgroundColor}`
177
+ style: `background-color: ${rgbToHex(attributes.backgroundColor)}`
139
178
  };
140
179
  }
141
180
  }
@@ -187,20 +226,6 @@ var createTiptapExtensions = (placeholder = "Enter content here...") => [
187
226
  import_extension_table_cell.TableCell
188
227
  ];
189
228
 
190
- // src/utils.ts
191
- async function uploadFileToCOS(file, docNum, onUploadFile, receiveStatus, elementId, onLoadingChange, suppressStatusChange = false) {
192
- receiveStatus && elementId && receiveStatus(elementId, true);
193
- if (!suppressStatusChange) onLoadingChange == null ? void 0 : onLoadingChange(true);
194
- try {
195
- const url = await onUploadFile(file, docNum);
196
- if (!url) throw new Error("Upload failed: no URL returned");
197
- return url;
198
- } finally {
199
- if (!suppressStatusChange) onLoadingChange == null ? void 0 : onLoadingChange(false);
200
- receiveStatus && elementId && receiveStatus(elementId, false);
201
- }
202
- }
203
-
204
229
  // src/constants.ts
205
230
  var TIPTAP_COLORS = [
206
231
  "#000000",
@@ -246,6 +271,9 @@ var IMAGE_MIME_TYPES = [
246
271
  "image/bmp"
247
272
  ];
248
273
 
274
+ // src/ToolbarGroups.tsx
275
+ var import_react = __toESM(require("react"));
276
+
249
277
  // src/Icons.tsx
250
278
  var import_jsx_runtime = require("react/jsx-runtime");
251
279
  var LucideSvg = ({ children }) => /* @__PURE__ */ (0, import_jsx_runtime.jsx)("svg", { viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: "2", strokeLinecap: "round", strokeLinejoin: "round", xmlns: "http://www.w3.org/2000/svg", children });
@@ -768,49 +796,75 @@ var InlineGroup = ({ editor, isReadOnly }) => /* @__PURE__ */ (0, import_jsx_run
768
796
  }
769
797
  )
770
798
  ] });
771
- var LinkGroup = ({ editor, isReadOnly, showMenu, onToggle, onClose, linkUrl, onLinkUrlChange, onSubmit }) => /* @__PURE__ */ (0, import_jsx_runtime2.jsxs)("div", { style: { position: "relative", display: "inline-flex" }, children: [
772
- /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(
773
- "button",
774
- {
775
- title: "Insert link",
776
- onClick: onToggle,
777
- onMouseDown: (e) => e.preventDefault(),
778
- disabled: isReadOnly,
779
- className: editor.isActive("link") ? "is-active" : "",
780
- "aria-label": "Insert link",
781
- children: /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(LinkIcon, {})
782
- }
783
- ),
784
- showMenu && !isReadOnly && /* @__PURE__ */ (0, import_jsx_runtime2.jsxs)("div", { className: "tiptap-link-menu", children: [
785
- /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(
786
- "input",
787
- {
788
- type: "url",
789
- placeholder: "Paste a link...",
790
- value: linkUrl,
791
- onChange: (e) => onLinkUrlChange(e.target.value),
792
- onKeyDown: (e) => {
793
- if (e.key === "Enter") onSubmit();
794
- if (e.key === "Escape") onClose();
795
- },
796
- autoFocus: true
797
- }
798
- ),
799
- /* @__PURE__ */ (0, import_jsx_runtime2.jsx)("button", { onClick: onSubmit, title: "Apply", className: "link-submit-btn", children: /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(SubmitIcon, {}) }),
799
+ var getLinkMenuPlacement = (triggerEl) => {
800
+ if (!triggerEl || typeof document === "undefined") return "center";
801
+ const boundaryEl = triggerEl.closest(".tiptap-editor-wrapper");
802
+ const boundaryRect = (boundaryEl == null ? void 0 : boundaryEl.getBoundingClientRect()) || document.documentElement.getBoundingClientRect();
803
+ const triggerRect = triggerEl.getBoundingClientRect();
804
+ const menuWidth = 300;
805
+ const edgePadding = 8;
806
+ const centeredLeft = triggerRect.left + triggerRect.width / 2 - menuWidth / 2;
807
+ const centeredRight = centeredLeft + menuWidth;
808
+ if (centeredLeft < boundaryRect.left + edgePadding) return "start";
809
+ if (centeredRight > boundaryRect.right - edgePadding) return "end";
810
+ return "center";
811
+ };
812
+ var LinkGroup = ({ editor, isReadOnly, showMenu, onToggle, onClose, linkUrl, onLinkUrlChange, onSubmit }) => {
813
+ const triggerRef = import_react.default.useRef(null);
814
+ const [menuPlacement, setMenuPlacement] = import_react.default.useState("center");
815
+ import_react.default.useEffect(() => {
816
+ if (!showMenu || isReadOnly) return;
817
+ const updatePlacement = () => {
818
+ setMenuPlacement(getLinkMenuPlacement(triggerRef.current));
819
+ };
820
+ updatePlacement();
821
+ window.addEventListener("resize", updatePlacement);
822
+ return () => window.removeEventListener("resize", updatePlacement);
823
+ }, [showMenu, isReadOnly]);
824
+ return /* @__PURE__ */ (0, import_jsx_runtime2.jsxs)("div", { ref: triggerRef, style: { position: "relative", display: "inline-flex" }, children: [
800
825
  /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(
801
826
  "button",
802
827
  {
803
- onClick: () => {
804
- editor.chain().focus().extendMarkRange("link").unsetLink().run();
805
- onClose();
806
- },
807
- title: "Unlink",
808
- className: "link-clear-btn",
809
- children: /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(ClearIcon, {})
828
+ title: "Insert link",
829
+ onClick: onToggle,
830
+ onMouseDown: (e) => e.preventDefault(),
831
+ disabled: isReadOnly,
832
+ className: editor.isActive("link") ? "is-active" : "",
833
+ "aria-label": "Insert link",
834
+ children: /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(LinkIcon, {})
810
835
  }
811
- )
812
- ] })
813
- ] });
836
+ ),
837
+ showMenu && !isReadOnly && /* @__PURE__ */ (0, import_jsx_runtime2.jsxs)("div", { className: `tiptap-link-menu align-${menuPlacement}`, children: [
838
+ /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(
839
+ "input",
840
+ {
841
+ type: "url",
842
+ placeholder: "Paste a link...",
843
+ value: linkUrl,
844
+ onChange: (e) => onLinkUrlChange(e.target.value),
845
+ onKeyDown: (e) => {
846
+ if (e.key === "Enter") onSubmit();
847
+ if (e.key === "Escape") onClose();
848
+ },
849
+ autoFocus: true
850
+ }
851
+ ),
852
+ /* @__PURE__ */ (0, import_jsx_runtime2.jsx)("button", { onClick: onSubmit, title: "Apply", className: "link-submit-btn", children: /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(SubmitIcon, {}) }),
853
+ /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(
854
+ "button",
855
+ {
856
+ onClick: () => {
857
+ editor.chain().focus().extendMarkRange("link").unsetLink().run();
858
+ onClose();
859
+ },
860
+ title: "Unlink",
861
+ className: "link-clear-btn",
862
+ children: /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(ClearIcon, {})
863
+ }
864
+ )
865
+ ] })
866
+ ] });
867
+ };
814
868
  var AlignmentGroup = ({ editor, isReadOnly }) => /* @__PURE__ */ (0, import_jsx_runtime2.jsxs)(import_jsx_runtime2.Fragment, { children: [
815
869
  /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(
816
870
  "button",
@@ -946,7 +1000,8 @@ var isEmptyRichTextHtml = (html) => {
946
1000
  };
947
1001
  var getNormalizedEditorHtml = (editor) => {
948
1002
  const html = editor.getHTML();
949
- return isEmptyRichTextHtml(html) ? "" : html;
1003
+ if (isEmptyRichTextHtml(html)) return "";
1004
+ return normalizeColorsInHtml(html);
950
1005
  };
951
1006
  var TiptapEditor = ({
952
1007
  elementId,
@@ -967,23 +1022,23 @@ var TiptapEditor = ({
967
1022
  const loadingChangeFn = onLoadingChange || (() => {
968
1023
  });
969
1024
  const isReadOnly = !editMode;
970
- const containerRef = (0, import_react.useRef)(null);
971
- const imageInputRef = (0, import_react.useRef)(null);
972
- const attachInputRef = (0, import_react.useRef)(null);
973
- const [showHighlightMenu, setShowHighlightMenu] = import_react.default.useState(false);
974
- const [showTextColorMenu, setShowTextColorMenu] = import_react.default.useState(false);
975
- const [showFontMenu, setShowFontMenu] = import_react.default.useState(false);
976
- const [showFontSizeMenu, setShowFontSizeMenu] = import_react.default.useState(false);
977
- const [showHeadingMenu, setShowHeadingMenu] = import_react.default.useState(false);
978
- const [showLinkMenu, setShowLinkMenu] = import_react.default.useState(false);
979
- const [showTableMenu, setShowTableMenu] = import_react.default.useState(false);
980
- const [tableHoverSize, setTableHoverSize] = import_react.default.useState({ rows: 0, cols: 0 });
981
- const [linkUrl, setLinkUrl] = import_react.default.useState("");
982
- const initializedRef = (0, import_react.useRef)(false);
983
- const lastEmittedContentRef = (0, import_react.useRef)(content || "");
984
- const lastUpdateTimestampRef = (0, import_react.useRef)(0);
985
- const activeUploadsRef = (0, import_react.useRef)(0);
986
- const closeAllMenus = import_react.default.useCallback(() => {
1025
+ const containerRef = (0, import_react2.useRef)(null);
1026
+ const imageInputRef = (0, import_react2.useRef)(null);
1027
+ const attachInputRef = (0, import_react2.useRef)(null);
1028
+ const [showHighlightMenu, setShowHighlightMenu] = import_react2.default.useState(false);
1029
+ const [showTextColorMenu, setShowTextColorMenu] = import_react2.default.useState(false);
1030
+ const [showFontMenu, setShowFontMenu] = import_react2.default.useState(false);
1031
+ const [showFontSizeMenu, setShowFontSizeMenu] = import_react2.default.useState(false);
1032
+ const [showHeadingMenu, setShowHeadingMenu] = import_react2.default.useState(false);
1033
+ const [showLinkMenu, setShowLinkMenu] = import_react2.default.useState(false);
1034
+ const [showTableMenu, setShowTableMenu] = import_react2.default.useState(false);
1035
+ const [tableHoverSize, setTableHoverSize] = import_react2.default.useState({ rows: 0, cols: 0 });
1036
+ const [linkUrl, setLinkUrl] = import_react2.default.useState("");
1037
+ const initializedRef = (0, import_react2.useRef)(false);
1038
+ const lastEmittedContentRef = (0, import_react2.useRef)(content || "");
1039
+ const lastUpdateTimestampRef = (0, import_react2.useRef)(0);
1040
+ const activeUploadsRef = (0, import_react2.useRef)(0);
1041
+ const closeAllMenus = import_react2.default.useCallback(() => {
987
1042
  setShowHighlightMenu(false);
988
1043
  setShowTextColorMenu(false);
989
1044
  setShowFontMenu(false);
@@ -992,7 +1047,7 @@ var TiptapEditor = ({
992
1047
  setShowLinkMenu(false);
993
1048
  setShowTableMenu(false);
994
1049
  }, []);
995
- import_react.default.useEffect(() => {
1050
+ import_react2.default.useEffect(() => {
996
1051
  const handleClickOutside = (event) => {
997
1052
  if (containerRef.current && !containerRef.current.contains(event.target)) {
998
1053
  closeAllMenus();
@@ -1003,7 +1058,7 @@ var TiptapEditor = ({
1003
1058
  document.removeEventListener("mousedown", handleClickOutside);
1004
1059
  };
1005
1060
  }, [closeAllMenus]);
1006
- const editor = (0, import_react2.useEditor)({
1061
+ const editor = (0, import_react3.useEditor)({
1007
1062
  immediatelyRender: false,
1008
1063
  extensions: createTiptapExtensions(placeholder),
1009
1064
  content: content || "",
@@ -1077,7 +1132,7 @@ var TiptapEditor = ({
1077
1132
  }
1078
1133
  }
1079
1134
  });
1080
- (0, import_react.useEffect)(() => {
1135
+ (0, import_react2.useEffect)(() => {
1081
1136
  if (!editor) return;
1082
1137
  if (!initializedRef.current) {
1083
1138
  initializedRef.current = true;
@@ -1101,11 +1156,11 @@ var TiptapEditor = ({
1101
1156
  lastEmittedContentRef.current = content || "";
1102
1157
  }
1103
1158
  }, [content, editor]);
1104
- (0, import_react.useEffect)(() => {
1159
+ (0, import_react2.useEffect)(() => {
1105
1160
  if (!editor) return;
1106
1161
  editor.setEditable(editMode);
1107
1162
  }, [editMode, editor]);
1108
- (0, import_react.useEffect)(() => {
1163
+ (0, import_react2.useEffect)(() => {
1109
1164
  if (!editor || !onRegisterReset) return;
1110
1165
  const handleReset = (newContent) => {
1111
1166
  editor.commands.setContent(newContent || "", false);
@@ -1115,7 +1170,7 @@ var TiptapEditor = ({
1115
1170
  unregister && unregister();
1116
1171
  };
1117
1172
  }, [editor, onRegisterReset]);
1118
- const handleImageFileChange = (0, import_react.useCallback)(
1173
+ const handleImageFileChange = (0, import_react2.useCallback)(
1119
1174
  async (e) => {
1120
1175
  const files = Array.from(e.target.files || []);
1121
1176
  if (files.length === 0 || !editor) return;
@@ -1166,7 +1221,7 @@ var TiptapEditor = ({
1166
1221
  },
1167
1222
  [editor, docNum, receiveStatus, elementId, receiveData, onUploadFile, alertFn, loadingChangeFn, customValidationFn]
1168
1223
  );
1169
- const handleAttachFileChange = (0, import_react.useCallback)(
1224
+ const handleAttachFileChange = (0, import_react2.useCallback)(
1170
1225
  async (e) => {
1171
1226
  const files = Array.from(e.target.files || []);
1172
1227
  if (files.length === 0 || !editor) return;
@@ -1216,7 +1271,7 @@ var TiptapEditor = ({
1216
1271
  },
1217
1272
  [editor, docNum, receiveStatus, elementId, receiveData, onUploadFile, alertFn, loadingChangeFn, customValidationFn]
1218
1273
  );
1219
- const handleLinkClick = (0, import_react.useCallback)(() => {
1274
+ const handleLinkClick = (0, import_react2.useCallback)(() => {
1220
1275
  if (!editor || isReadOnly) return;
1221
1276
  const nextState = !showLinkMenu;
1222
1277
  closeAllMenus();
@@ -1226,7 +1281,7 @@ var TiptapEditor = ({
1226
1281
  }
1227
1282
  setShowLinkMenu(nextState);
1228
1283
  }, [editor, isReadOnly, showLinkMenu, closeAllMenus]);
1229
- const submitLink = (0, import_react.useCallback)(() => {
1284
+ const submitLink = (0, import_react2.useCallback)(() => {
1230
1285
  if (!editor) return;
1231
1286
  if (linkUrl === null || linkUrl.trim() === "") {
1232
1287
  editor.chain().focus().extendMarkRange("link").unsetLink().run();
@@ -1404,7 +1459,7 @@ var TiptapEditor = ({
1404
1459
  const component = toolbarComponents[group];
1405
1460
  if (!component) return null;
1406
1461
  const divider = showDividers && index > 0 ? /* @__PURE__ */ (0, import_jsx_runtime3.jsx)("span", { className: "toolbar-divider" }) : null;
1407
- return /* @__PURE__ */ (0, import_jsx_runtime3.jsxs)(import_react.default.Fragment, { children: [
1462
+ return /* @__PURE__ */ (0, import_jsx_runtime3.jsxs)(import_react2.default.Fragment, { children: [
1408
1463
  divider,
1409
1464
  component
1410
1465
  ] }, group);
@@ -1422,7 +1477,7 @@ var TiptapEditor = ({
1422
1477
  return /* @__PURE__ */ (0, import_jsx_runtime3.jsxs)("div", { id: elementId, className: `tiptap-editor-wrapper${isReadOnly ? " read-only" : ""}`, ref: containerRef, children: [
1423
1478
  getHiddenInputs(),
1424
1479
  getToolbar(),
1425
- /* @__PURE__ */ (0, import_jsx_runtime3.jsx)("div", { onMouseDown: closeAllMenus, children: /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(import_react2.EditorContent, { editor }) })
1480
+ /* @__PURE__ */ (0, import_jsx_runtime3.jsx)("div", { onMouseDown: closeAllMenus, children: /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(import_react3.EditorContent, { editor }) })
1426
1481
  ] });
1427
1482
  };
1428
1483
  var TiptapEditor_default = TiptapEditor;