@forgedevstack/ink 1.1.1 → 1.1.3

package/CHANGELOG.md

@@ -1,8 +1,30 @@
 # Changelog
 
-## Unreleased
+## Unreleased — 1.1.3
+
+### Fixed
+- `keepInMemory` restores drafts on mount in controlled mode via `onChange`
+- SignPad clears drawing state when closed; Insert relies on stroke state only
+- `canvasHasInk` ignores white fill (RGB), not alpha alone
+- localStorage read/write/clear wrapped in try/catch
+- Default memory key moved to `DEFAULT_MEMORY_KEY` const
+
+## 1.1.2 — 2026-08-04
 
 ### Added
+- Sign pad toolbar (`signature`) — canvas draw → insert PNG image
+- `keepInMemory` + `memoryKey` — persist draft HTML in localStorage
+- Find and replace toolbar (`findReplace`) — text-node safe
+- Horizontal rule toolbar (`horizontalRule`)
+- Aerocraft-style utility classes for SignPad / FindReplace panels
+- `isLocalStorageAvailable` util; path aliases (`@/`)
+- Docs: Jira bootstrap, Confluence paste pack, payments research, articles + Gemini video prompt
+- Examples in README for sign pad, memory, find/replace
+
+### Changed
+- Product copy no longer names other editor vendors
+
+### Previously unreleased (1.1.1)
 - Premium scaffolding: `premium={{ enabled | licenseKey }}` unlocks theme tokens, icon map, rich paste, image upload, WYSIWYG
 - Props: `theme`, `icons`, `pasteMode="rich"`, `onImageUpload`, `wysiwyg`
 - Helpers: `resolveInkPremium`, `mintInkPremiumLicenseKey`, `sanitizePastedHtml`, `INK_DEFAULT_ICONS`
@@ -12,7 +34,7 @@
 ## 1.1.0 — 2026-08-01
 
 ### Added
-- CKEditor-inspired editor shell: soft light card, rounded toolbar, `variant="classic" | "document"`
+- Editor shell: soft light card, rounded toolbar, `variant="classic" | "document"`
 - Structure blocks with hover/focus outline and block handles (move up/down MVP)
 - Toolbar: table insert, undo/redo, track changes, comments, AI toggles
 - Tables: insert N×M HTML tables with basic editable cells
@@ -31,17 +53,17 @@
 - Exports: `INK_COLLAB_TOOLBAR`, `INK_AI_MODEL_CATALOG`, `buildTableHtml`, comment/track helpers
 
 ### Docs
-- Feature matrix: CK-inspired capabilities → Ink status (Shipped MVP / Stub / Planned)
-- Honesty framing: CKEditor-inspired architecture with local demo providers; bring your own LLM. No SOC2/enterprise hosting claims.
+- Feature matrix: capability → Ink status (Shipped MVP / Stub / Planned)
+- Honesty framing: local demo providers; bring your own LLM. No SOC2/enterprise hosting claims.
 
 ## 1.0.1 — 2026-08-01
 
 ### Added
 - Theme helper classes: `.ink-theme-snow`, `.ink-theme-bubble`, `.ink-theme-dark`, `.ink-theme-minimal`
-- Expanded README: full prop table, `ToolbarOption` list, CSS variables, Quill positioning, portal links, asset screenshots
+- Expanded README: full prop table, `ToolbarOption` list, CSS variables, portal links, asset screenshots
 
 ### Docs
-- Companion light Quill-inspired portal (docs + Format/Modules/Theme playground)
+- Companion light portal (docs + Format/Modules/Theme playground)
 
 ## 1.0.0 — 2026-08-01
 

package/README.md

@@ -3,14 +3,14 @@
 [![npm version](https://img.shields.io/npm/v/@forgedevstack/ink.svg)](https://www.npmjs.com/package/@forgedevstack/ink)
 [![license](https://img.shields.io/npm/l/@forgedevstack/ink.svg)](./LICENSE)
 
-**ForgeStack rich text editor** for React. CKEditor-inspired shell with tables, track changes, comments, block handles, slash commands, and pluggable Ink AI (bring your own LLM + local demo provider).
+**ForgeStack rich text editor** for React. Soft document shell with tables, track changes, comments, block handles, slash commands, sign pad, draft memory, and pluggable Ink AI (bring your own LLM + local demo provider).
 
 <p align="center">
   <img src="./assets/ink-logo.png" alt="Ink logo" width="120" />
 </p>
 
 > **Domain:** [inkforgejs.com](https://inkforgejs.com) — docs + demos.  
-> **Inspired by CKEditor 5** demos / AI features pages and earlier Quill-like portal aesthetics — not a fork. Ink is a contenteditable React component with ForgeStack integrations.  
+> Ink is a contenteditable React component with ForgeStack integrations — not a fork of other editors.  
 > **Honesty:** Local demo AI providers only. No hosted enterprise LLM, SOC2, or on-prem claims. Connect Claude / Gemini / GPT (or custom) via `inkAi.registerProvider`.
 
 ## Install
@@ -51,26 +51,82 @@ export function App() {
 | npm | https://www.npmjs.com/package/@forgedevstack/ink |
 | Repo | https://github.com/yaghobieh/ink |
 
-## Feature matrix (CK-inspired → Ink 1.1.0)
+## Feature matrix (Ink 1.1.2)
 
 | Capability | Status |
 |---|---|
-| Classic / document editor shell | **Shipped MVP** |
-| Headings, lists, links, images, colors | **Shipped MVP** |
-| Tables (insert N×M) | **Shipped MVP** |
-| Undo / redo | **Shipped MVP** |
-| Block handles (move up/down) | **Shipped MVP** (full DnD Planned) |
-| Slash commands | **Shipped MVP** |
-| Track changes + Accept/Reject | **Shipped MVP** |
-| Comments archive sidebar | **Shipped MVP** |
-| AI chat + history | **Shipped MVP** (demo provider) |
-| AI Quick Actions / Review / Translate | **Shipped MVP** (demo) |
-| AI diff preview → apply | **Shipped MVP** |
-| Provider registry + model catalog | **Shipped MVP** (catalog constants; BYO run) |
-| Cost control / moderation / permissions / RAG hooks | **Stub** (typed interfaces + no-ops) |
-| Quality eval suite / MCP hosting | **Stub / Planned** |
+| Classic / document editor shell | **Shipped** |
+| Headings, lists, links, images, colors | **Shipped** |
+| Tables (insert N×M) | **Shipped** |
+| Undo / redo | **Shipped** |
+| Block handles (move up/down) | **Shipped** (full DnD Planned) |
+| Slash commands | **Shipped** |
+| Track changes + Accept/Reject | **Shipped** |
+| Comments archive sidebar | **Shipped** |
+| Sign pad (canvas → image) | **Shipped** (1.1.2) |
+| Keep in memory (localStorage drafts) | **Shipped** (1.1.2) |
+| Find and replace | **Shipped** (1.1.2) |
+| Horizontal rule | **Shipped** (1.1.2) |
+| AI chat + history | **Shipped** (demo provider) |
+| AI Quick Actions / Review / Translate | **Shipped** (demo) |
+| Provider registry + model catalog | **Shipped** (BYO run) |
+| Cost control / moderation / permissions / RAG hooks | **Stub** |
 | Real-time multiplayer CRDT | **Planned** |
 
+## Examples
+
+### Sign pad + draft memory
+
+```tsx
+import { useState } from 'react';
+import { InkEditor } from '@forgedevstack/ink';
+import '@forgedevstack/ink/styles.css';
+
+export function ContractEditor() {
+  const [html, setHtml] = useState('<p>Sign below.</p>');
+  return (
+    <InkEditor
+      value={html}
+      onChange={setHtml}
+      keepInMemory
+      memoryKey="contract-draft"
+      features={{ signature: true, findReplace: true, horizontalRule: true }}
+      toolbar={[
+        'bold',
+        'italic',
+        'divider',
+        'signature',
+        'findReplace',
+        'horizontalRule',
+        'divider',
+        'undo',
+        'redo',
+      ]}
+    />
+  );
+}
+```
+
+**How to test sign pad**
+
+1. Open the portal playground or the example above.
+2. Click the **✍** toolbar button.
+3. Draw with mouse/touch on the canvas.
+4. Click **Insert** — a PNG image is inserted into the document.
+5. Refresh with `keepInMemory` + `memoryKey` — draft HTML restores (memory wins on mount for controlled `value` / `onChange` too).
+
+### Find and replace
+
+```tsx
+<InkEditor
+  defaultValue="<p>Hello world</p>"
+  features={{ findReplace: true }}
+  toolbar={['findReplace', 'bold', 'italic']}
+/>
+```
+
+Open **⌕**, type find/replace, use **Replace** or **Replace all** (text nodes only — attributes are safe).
+
 ## Props (`InkEditorProps`)
 
 | Prop | Type | Default | Description |
@@ -88,14 +144,16 @@ export function App() {
 | `tableRows` / `tableCols` | `number` | `3` | Default table size |
 | `author` | `string` | `'You'` | TC / comment author |
 | `typoAutoFix` | `boolean` | `true` | Blur typo MVP |
+| `keepInMemory` | `boolean` | `false` | Persist HTML in localStorage |
+| `memoryKey` | `string` | `'default'` | Storage key suffix (`ink-memory:{key}`) |
 
 ## Toolbar options
 
 ```
 headingDropdown | bold | italic | underline | strikethrough
 textColor | highlightColor | bulletList | orderedList
-link | image | table | undo | redo
-trackChanges | comments | ai | clearFormat | divider
+link | image | table | signature | findReplace | horizontalRule
+undo | redo | trackChanges | comments | ai | clearFormat | divider
 + align* | indent | outdent | blockquote | code | heading1–6
 ```
 

package/dist/components/InkEditor/InkEditor.cjs

@@ -1 +1 @@
-"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const c=require("react/jsx-runtime"),l=require("react"),Z=require("../../constants/numbers.const.cjs"),m=require("../../constants/defaults.const.cjs"),Ae=require("../../constants/premium.const.cjs"),Pt=require("../../utils/cn.utils.cjs"),Rt=require("../../utils/typo.utils.cjs"),ye=require("../../utils/id.utils.cjs"),Ot=require("../../utils/table.utils.cjs"),F=require("../../utils/blocks.utils.cjs"),I=require("../../utils/trackChanges.utils.cjs"),ee=require("../../utils/comments.utils.cjs"),Ee=require("../../utils/history.utils.cjs"),Ne=require("../../utils/slash.utils.cjs"),S=require("../../utils/premium.utils.cjs"),te=require("../../utils/paste.utils.cjs"),a=require("./helpers/format.utils.cjs"),T=require("./components/ToolbarButton/ToolbarButton.cjs"),Dt=require("./components/ToolbarDropdown/ToolbarDropdown.cjs"),ve=require("./components/ToolbarColorPicker/ToolbarColorPicker.cjs"),Ut=require("./components/CommentsPanel/CommentsPanel.cjs"),jt=require("./components/AiPanel/AiPanel.cjs"),Ft=require("./components/BlockHandles/BlockHandles.cjs"),Mt=require("./components/SlashMenu/SlashMenu.cjs"),Kt=require("./components/TrackChangesBar/TrackChangesBar.cjs"),ne=()=>{const A=window.getSelection();if(!A||A.rangeCount===0)return"";const g=A.getRangeAt(0),x=document.createElement("div");return x.appendChild(g.cloneContents()),x.innerHTML},qt=A=>{var Le;const{value:g,defaultValue:x="",onChange:M,placeholder:re=m.INK_PLACEHOLDER_DEFAULT,disabled:i=!1,readOnly:u=!1,minHeight:K=Z.INK_MIN_HEIGHT,maxHeight:q,toolbar:Be=m.INK_DEFAULT_TOOLBAR,className:Pe="",testId:Re,allowImagePaste:oe=!0,showCharCount:se=!1,charCountMax:ce,typoAutoFix:Oe=!0,variant:De=m.INK_DEFAULT_VARIANT,features:Ue,author:_=m.INK_DEFAULT_AUTHOR,trackChanges:y,onTrackChangesChange:V,trackChangesEnabled:O,onTrackChangesEnabledChange:G,comments:E,onCommentsChange:W,showCommentsPanel:N,onShowCommentsPanelChange:$,ai:h,slashCommands:je,tableRows:Fe=m.INK_TABLE_DEFAULT_ROWS,tableCols:Me=m.INK_TABLE_DEFAULT_COLS,premium:Ke,theme:qe,icons:ae,pasteMode:Ve="plain",onImageUpload:ie,wysiwyg:Ge=!1,style:We,...$e}=A,f={...m.INK_DEFAULT_FEATURES,...Ue},H=S.resolveInkPremium(Ke),ze=S.hasInkPremiumFeature(H,"icons"),Xe=S.hasInkPremiumFeature(H,"theme"),Qe=S.hasInkPremiumFeature(H,"richPaste"),Ye=S.hasInkPremiumFeature(H,"imageUpload"),Je=S.hasInkPremiumFeature(H,"wysiwyg")&&Ge,C=ze&&ae?{...Ae.INK_DEFAULT_ICONS,...ae}:Ae.INK_DEFAULT_ICONS,Ze=Xe?S.themeTokensToStyle(qe):{},et=Qe&&Ve==="rich",r=l.useRef(null),D=l.useRef(new Ee.InkHistoryStack(g??x)),[tt,nt]=l.useState(new Set),[rt,le]=l.useState("p"),[ot,st]=l.useState(0),[ct,at]=l.useState(Z.INK_DEFAULT_TEXT_COLOR),[it,lt]=l.useState(Z.INK_DEFAULT_HIGHLIGHT_COLOR),[w,ue]=l.useState(O??!1),[ut,de]=l.useState(y??[]),[dt,me]=l.useState(E??[]),[mt,fe]=l.useState(N??!1),[he,z]=l.useState(!!(h!=null&&h.enabled&&h.openOnInit)),[pe,ft]=l.useState(""),[ht,pt]=l.useState(0),[gt,ge]=l.useState(!1),[Ct,U]=l.useState([]),[Ce,Tt]=l.useState({top:0,left:0}),k=y??ut,v=E??dt,X=N??mt,Te=je??f.slash;l.useEffect(()=>{O!==void 0&&ue(O)},[O]),l.useEffect(()=>{y&&de(y)},[y]),l.useEffect(()=>{E&&me(E)},[E]),l.useEffect(()=>{N!==void 0&&fe(N)},[N]),l.useEffect(()=>{!r.current||g===void 0||r.current.innerHTML!==g&&(r.current.innerHTML=g)},[g]),l.useEffect(()=>{!r.current||g||!x||(r.current.innerHTML=x,D.current=new Ee.InkHistoryStack(x))},[]);const Q=e=>{var t;D.current.push(e),M==null||M(e),se&&r.current&&st(((t=r.current.textContent)==null?void 0:t.length)??0)},L=e=>{r.current&&(r.current.innerHTML=e,Q(e))},B=e=>{de(e),V==null||V(e)},Y=e=>{me(e),W==null||W(e)},J=e=>{fe(e),$==null||$(e)},kt=e=>{ue(e),G==null||G(e)},j=()=>{nt(a.getActiveFormats());const e=a.queryCommandValue("formatBlock");if(e&&le(e.toLowerCase().replace(/[<>]/g,"")),ft(ne()),!r.current||!f.blocks)return;const t=window.getSelection(),n=(t==null?void 0:t.anchorNode)??null,o=F.getBlockElement(n,r.current);if(F.markActiveBlock(r.current,o),o){const s=r.current.getBoundingClientRect(),p=o.getBoundingClientRect();pt(p.top-s.top+r.current.scrollTop),ge(!0)}else ge(!1)},d=()=>{var t,n,o;if(!r.current)return;let e=r.current.innerHTML;if(w&&f.trackChanges){const s=window.getSelection();if(s&&!s.isCollapsed){const p=ne();if(p){const b=I.createTrackChange("delete",p,_);B([...k,b]),bt(b.id),e=r.current.innerHTML}}}if(Q(e),j(),Te&&r.current){const s=((n=(t=window.getSelection())==null?void 0:t.anchorNode)==null?void 0:n.textContent)??"",p=Ne.extractSlashQuery(s);if(p!==null){U(Ne.filterSlashCommands(p));const b=(o=window.getSelection())==null?void 0:o.getRangeAt(0);if(b&&r.current){const P=b.getBoundingClientRect(),R=r.current.getBoundingClientRect();Tt({top:P.bottom-R.top+8,left:P.left-R.left})}}else U([])}},bt=e=>{const t=window.getSelection();if(!t||t.rangeCount===0)return;const n=ne();n&&a.insertHTML(I.wrapDeleteHtml(n,e))},It=()=>{if(!r.current||!Oe||!f.typoAutoFix||i||u)return;const e=r.current.innerHTML,t=Rt.applyTypoAutoFix(e);t.html!==e&&(r.current.innerHTML=t.html,Q(t.html))},xt=e=>{var n;if(i||u)return;(n=r.current)==null||n.focus();const t=m.INK_BUTTON_CONFIG[e];t&&(t.value?a.execCommand(t.command,t.value):a.execCommand(t.command),d())},St=e=>{var t;i||u||((t=r.current)==null||t.focus(),a.execCommand("formatBlock",e),le(e),d())},_t=()=>{var t;if(i||u)return;const e=window.prompt("Enter URL:","https://");e&&((t=r.current)==null||t.focus(),a.insertLink(e),d())},ke=async e=>Ye&&ie?ie(e):a.fileToDataUrl(e),Ht=async()=>{if(i||u)return;const e=document.createElement("input");e.type="file",e.accept="image/*",e.onchange=async()=>{var o,s;const t=(o=e.files)==null?void 0:o[0];if(!t)return;const n=await ke(t);(s=r.current)==null||s.focus(),a.insertImage(n,t.name),d()},e.click()},be=()=>{var t;if(i||u||!f.table)return;(t=r.current)==null||t.focus();const e=Ot.buildTableHtml(Fe,Me);if(w&&f.trackChanges){const n=I.createTrackChange("insert",e,_);B([...k,n]),a.insertHTML(I.wrapInsertHtml(e,n.id))}else a.insertHTML(e);d()},Ie=()=>{const e=D.current.undo();if(e===null||!r.current){a.execCommand("undo"),d();return}L(e)},xe=()=>{const e=D.current.redo();if(e===null||!r.current){a.execCommand("redo"),d();return}L(e)},wt=()=>{var s;if(i||u||!f.comments)return;const e=window.prompt("Comment:");if(!(e!=null&&e.trim()))return;const t=ye.createInkId("hl");if((s=r.current)==null||s.focus(),!ee.wrapSelectionAsComment(t))return;const o=ee.createCommentThread(_,e.trim(),t);Y([o,...v]),J(!0),d()},Se=e=>{if(!r.current)return;const t=I.acceptTrackChangeInHtml(r.current.innerHTML,e);L(t),B(k.map(n=>n.id===e?{...n,accepted:!0}:n))},_e=e=>{if(!r.current)return;const t=I.rejectTrackChangeInHtml(r.current.innerHTML,e);L(t),B(k.map(n=>n.id===e?{...n,rejected:!0}:n))},He=async e=>{const t=await ke(e),n=`<img src="${t}" alt="" style="max-width:100%;height:auto;" />`;if(w&&f.trackChanges){const o=I.createTrackChange("insert",n,_);B([...k,o]),a.insertHTML(I.wrapInsertHtml(n,o.id))}else a.insertImage(t);d()},Lt=async e=>{if(i||u)return;const t=e.clipboardData;if(!t)return;if(et){const o=te.extractClipboardHtml(t);if(o){e.preventDefault();const p=te.sanitizePastedHtml(o);p&&(a.insertHTML(p),d());const b=t.items;if(oe&&b)for(const P of Array.from(b)){if(!P.type.startsWith("image/"))continue;const R=P.getAsFile();R&&await He(R)}return}const s=te.extractClipboardText(t);if(s){e.preventDefault(),a.insertHTML(s.replace(/\n/g,"<br />")),d();return}}if(!oe)return;const n=t.items;if(n)for(const o of Array.from(n)){if(!o.type.startsWith("image/"))continue;e.preventDefault();const s=o.getAsFile();s&&await He(s)}},At=e=>{e.key==="Escape"&&U([]),(e.metaKey||e.ctrlKey)&&e.key==="z"&&(e.preventDefault(),e.shiftKey?xe():Ie())},yt=e=>{var n,o;(n=r.current)==null||n.focus();const t=window.getSelection();if((o=t==null?void 0:t.anchorNode)!=null&&o.textContent){const p=t.anchorNode.textContent.replace(/(?:^|\s)\/[^\s]*$/," ");t.anchorNode.nodeType===Node.TEXT_NODE&&(t.anchorNode.textContent=p)}switch(U([]),e.insert){case"heading1":a.execCommand("formatBlock","h1");break;case"heading2":a.execCommand("formatBlock","h2");break;case"bulletList":a.execCommand("insertUnorderedList");break;case"orderedList":a.execCommand("insertOrderedList");break;case"table":be();return;case"ai":z(!0);break}d()},we=e=>{if(!r.current)return;const t=window.getSelection(),n=F.getBlockElement((t==null?void 0:t.anchorNode)??null,r.current);n&&F.moveBlock(n,e)&&(d(),j())},Et=(e,t)=>{if(e==="divider")return c.jsx("span",{className:m.INK_CLASS_DIVIDER},`divider-${t}`);if(e==="headingDropdown")return c.jsx(Dt.ToolbarDropdown,{title:"Heading",options:m.INK_HEADING_OPTIONS,value:rt||"p",disabled:i||u,onChange:St},"heading");if(e==="textColor")return c.jsx(ve.ToolbarColorPicker,{title:"Text color",type:"text",value:ct,disabled:i||u,onChange:o=>{var s;(s=r.current)==null||s.focus(),a.setTextColor(o),at(o),d()}},"textColor");if(e==="highlightColor")return c.jsx(ve.ToolbarColorPicker,{title:"Highlight color",type:"highlight",value:it,disabled:i||u,onChange:o=>{var s;(s=r.current)==null||s.focus(),a.setHighlightColor(o),lt(o),d()}},"highlightColor");if(e==="link")return c.jsx(T.ToolbarButton,{icon:C.link,title:"Insert link",disabled:i||u,onClick:_t},"link");if(e==="image")return c.jsx(T.ToolbarButton,{icon:C.image,title:"Insert image",disabled:i||u,onClick:()=>{Ht()}},"image");if(e==="table")return f.table?c.jsx(T.ToolbarButton,{icon:C.table,title:"Insert table",disabled:i||u,onClick:be},"table"):null;if(e==="undo")return c.jsx(T.ToolbarButton,{icon:C.undo,title:"Undo",disabled:i||u,onClick:Ie},"undo");if(e==="redo")return c.jsx(T.ToolbarButton,{icon:C.redo,title:"Redo",disabled:i||u,onClick:xe},"redo");if(e==="trackChanges")return f.trackChanges?c.jsx(T.ToolbarButton,{icon:C.trackChanges,title:"Track changes",active:w,disabled:i||u,onClick:()=>kt(!w)},"trackChanges"):null;if(e==="comments")return f.comments?c.jsx(T.ToolbarButton,{icon:C.comments,title:"Comments",active:X,disabled:i||u,onClick:()=>{X?J(!1):wt()}},"comments"):null;if(e==="ai")return!f.ai||!(h!=null&&h.enabled)?null:c.jsx(T.ToolbarButton,{icon:C.ai,title:"Ink AI",active:he,disabled:i||u,onClick:()=>z(o=>!o)},"ai");const n=m.INK_BUTTON_CONFIG[e];return n?c.jsx(T.ToolbarButton,{icon:C[e]??e.slice(0,1).toUpperCase(),title:n.title,active:tt.has(e),disabled:i||u,onClick:()=>xt(e)},e):null},Nt=typeof K=="number"?`${K}px`:K,vt=typeof q=="number"?`${q}px`:q,Bt=!!(h!=null&&h.enabled&&he);return c.jsxs("div",{className:Pt.cn(m.INK_CLASS_ROOT,Pe),"data-testid":Re,"data-disabled":i||void 0,"data-variant":De,"data-premium":H.active||void 0,"data-wysiwyg":Je||void 0,style:{...Ze,...We},...$e,children:[c.jsx("div",{className:m.INK_CLASS_TOOLBAR,role:"toolbar","aria-label":"Ink formatting toolbar",children:Be.map(Et)}),w&&f.trackChanges?c.jsx(Kt.TrackChangesBar,{changes:k,onAccept:Se,onReject:_e,onAcceptAll:()=>k.forEach(e=>Se(e.id)),onRejectAll:()=>k.forEach(e=>_e(e.id))}):null,c.jsxs("div",{className:m.INK_CLASS_SHELL,children:[c.jsxs("div",{className:m.INK_CLASS_BODY,children:[f.blocks?c.jsx(Ft.BlockHandles,{visible:gt&&!i&&!u,top:ht,onMoveUp:()=>we("up"),onMoveDown:()=>we("down")}):null,c.jsx("div",{ref:r,className:m.INK_CLASS_CONTENT,contentEditable:!i&&!u,role:"textbox","aria-multiline":"true","aria-placeholder":re,"data-placeholder":re,suppressContentEditableWarning:!0,style:{minHeight:Nt,maxHeight:vt},onInput:d,onBlur:It,onKeyUp:j,onKeyDown:At,onMouseUp:j,onPaste:e=>{Lt(e)}}),Te?c.jsx(Mt.SlashMenu,{items:Ct,top:Ce.top,left:Ce.left,onSelect:yt}):null]}),X&&f.comments?c.jsx(Ut.CommentsPanel,{comments:v,author:_,onClose:()=>J(!1),onResolve:e=>{const t=v.find(n=>n.id===e);Y(v.map(n=>n.id===e?{...n,resolved:!0}:n)),t&&r.current&&L(ee.removeCommentMark(r.current.innerHTML,t.highlightId))},onAddReply:(e,t)=>{Y(v.map(n=>n.id===e?{...n,replies:[...n.replies,{id:ye.createInkId("reply"),author:_,body:t,timestamp:Date.now()}]}:n))}}):null,Bt&&h?c.jsx(jt.AiPanel,{config:h,documentHtml:((Le=r.current)==null?void 0:Le.innerHTML)??g??"",selectionHtml:pe,onClose:()=>z(!1),onApplyHtml:e=>{var t;if((t=r.current)==null||t.focus(),pe)a.insertHTML(e);else{L(e);return}d()}}):null]}),se?c.jsxs("div",{className:m.INK_CLASS_FOOTER,children:[ot,ce?` / ${ce}`:""]}):null]})};exports.InkEditor=qt;
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const s=require("react/jsx-runtime"),u=require("react"),ee=require("../../constants/numbers.cjs"),y=require("../../constants/toolbar.const.cjs"),f=require("../../constants/defaults.const.cjs"),ve=require("../../constants/premium.const.cjs"),qt=require("../../utils/cn.utils.cjs"),Kt=require("../../utils/typo.utils.cjs"),je=require("../../utils/id.utils.cjs"),Vt=require("../../utils/table.utils.cjs"),q=require("../../utils/blocks.utils.cjs"),L=require("../../utils/trackChanges.utils.cjs"),te=require("../../utils/comments.utils.cjs"),ne=require("../../utils/history.utils.cjs"),Fe=require("../../utils/slash.utils.cjs"),x=require("../../utils/premium.utils.cjs"),re=require("../../utils/paste.utils.cjs"),Me=require("../../utils/memory.utils.cjs"),Gt=require("../../utils/findReplace.utils.cjs"),a=require("./helpers/format.utils.cjs"),C=require("./components/ToolbarButton/ToolbarButton.cjs"),Wt=require("./components/ToolbarDropdown/ToolbarDropdown.cjs"),Ue=require("./components/ToolbarColorPicker/ToolbarColorPicker.cjs"),$t=require("./components/CommentsPanel/CommentsPanel.cjs"),zt=require("./components/AiPanel/AiPanel.cjs"),Xt=require("./components/BlockHandles/BlockHandles.cjs"),Zt=require("./components/SlashMenu/SlashMenu.cjs"),Qt=require("./components/TrackChangesBar/TrackChangesBar.cjs"),Yt=require("./components/SignPad/SignPad.cjs"),Jt=require("./components/FindReplace/FindReplace.cjs"),oe=()=>{const N=window.getSelection();if(!N||N.rangeCount===0)return"";const T=N.getRangeAt(0),I=document.createElement("div");return I.appendChild(T.cloneContents()),I.innerHTML},en=N=>{var Pe;const{value:T,defaultValue:I="",onChange:k,placeholder:se=f.INK_PLACEHOLDER_DEFAULT,disabled:c=!1,readOnly:i=!1,minHeight:K=ee.INK_MIN_HEIGHT,maxHeight:V,toolbar:De=f.INK_DEFAULT_TOOLBAR,className:qe="",testId:Ke,allowImagePaste:ce=!0,showCharCount:ae=!1,charCountMax:ie,typoAutoFix:Ve=!0,variant:Ge=f.INK_DEFAULT_VARIANT,features:We,author:A=f.INK_DEFAULT_AUTHOR,trackChanges:w,onTrackChangesChange:G,trackChangesEnabled:M,onTrackChangesEnabledChange:W,comments:R,onCommentsChange:$,showCommentsPanel:E,onShowCommentsPanelChange:z,ai:h,slashCommands:$e,tableRows:ze=f.INK_TABLE_DEFAULT_ROWS,tableCols:Xe=f.INK_TABLE_DEFAULT_COLS,premium:Ze,theme:Qe,icons:le,pasteMode:Ye="plain",onImageUpload:ue,wysiwyg:Je=!1,keepInMemory:de=!1,memoryKey:me,style:et,...tt}=N,m={...f.INK_DEFAULT_FEATURES,...We},H=x.resolveInkPremium(Ze),nt=x.hasInkPremiumFeature(H,"icons"),rt=x.hasInkPremiumFeature(H,"theme"),ot=x.hasInkPremiumFeature(H,"richPaste"),st=x.hasInkPremiumFeature(H,"imageUpload"),ct=x.hasInkPremiumFeature(H,"wysiwyg")&&Je,p=nt&&le?{...ve.INK_DEFAULT_ICONS,...le}:ve.INK_DEFAULT_ICONS,at=rt?x.themeTokensToStyle(Qe):{},it=ot&&Ye==="rich",r=u.useRef(null),B=u.useRef(new ne.InkHistoryStack(T??I)),[lt,ut]=u.useState(new Set),[dt,fe]=u.useState("p"),[mt,ft]=u.useState(0),[ht,pt]=u.useState(ee.INK_DEFAULT_TEXT_COLOR),[gt,Ct]=u.useState(ee.INK_DEFAULT_HIGHLIGHT_COLOR),[O,he]=u.useState(M??!1),[Tt,pe]=u.useState(w??[]),[kt,ge]=u.useState(R??[]),[It,Ce]=u.useState(E??!1),[Te,X]=u.useState(!!(h!=null&&h.enabled&&h.openOnInit)),[ke,bt]=u.useState(""),[_t,Lt]=u.useState(0),[St,Ie]=u.useState(!1),[xt,U]=u.useState([]),[be,At]=u.useState({top:0,left:0}),[_e,Le]=u.useState(!1),[Se,xe]=u.useState(!1),b=w??Tt,P=R??kt,Z=E??It,Ae=$e??m.slash;u.useEffect(()=>{M!==void 0&&he(M)},[M]),u.useEffect(()=>{w&&pe(w)},[w]),u.useEffect(()=>{R&&ge(R)},[R]),u.useEffect(()=>{E!==void 0&&Ce(E)},[E]),u.useEffect(()=>{!r.current||T===void 0||r.current.innerHTML!==T&&(r.current.innerHTML=T)},[T]),u.useEffect(()=>{if(!r.current)return;const e=de?Me.readInkMemory(me):"";if(e){r.current.innerHTML=e,B.current=new ne.InkHistoryStack(e),k==null||k(e);return}T===void 0&&I&&(r.current.innerHTML=I,B.current=new ne.InkHistoryStack(I),k==null||k(I))},[]);const Q=e=>{var t;B.current.push(e),k==null||k(e),de&&Me.writeInkMemory(e,me),ae&&r.current&&ft(((t=r.current.textContent)==null?void 0:t.length)??0)},S=e=>{r.current&&(r.current.innerHTML=e,Q(e))},v=e=>{pe(e),G==null||G(e)},Y=e=>{ge(e),$==null||$(e)},J=e=>{Ce(e),z==null||z(e)},Ht=e=>{he(e),W==null||W(e)},D=()=>{ut(a.getActiveFormats());const e=a.queryCommandValue("formatBlock");if(e&&fe(e.toLowerCase().replace(/[<>]/g,"")),bt(oe()),!r.current||!m.blocks)return;const t=window.getSelection(),n=(t==null?void 0:t.anchorNode)??null,o=q.getBlockElement(n,r.current);if(q.markActiveBlock(r.current,o),o){const l=r.current.getBoundingClientRect(),g=o.getBoundingClientRect();Lt(g.top-l.top+r.current.scrollTop),Ie(!0)}else Ie(!1)},d=()=>{var t,n,o;if(!r.current)return;let e=r.current.innerHTML;if(O&&m.trackChanges){const l=window.getSelection();if(l&&!l.isCollapsed){const g=oe();if(g){const _=L.createTrackChange("delete",g,A);v([...b,_]),Ot(_.id),e=r.current.innerHTML}}}if(Q(e),D(),Ae&&r.current){const l=((n=(t=window.getSelection())==null?void 0:t.anchorNode)==null?void 0:n.textContent)??"",g=Fe.extractSlashQuery(l);if(g!==null){U(Fe.filterSlashCommands(g));const _=(o=window.getSelection())==null?void 0:o.getRangeAt(0);if(_&&r.current){const j=_.getBoundingClientRect(),F=r.current.getBoundingClientRect();At({top:j.bottom-F.top+8,left:j.left-F.left})}}else U([])}},Ot=e=>{const t=window.getSelection();if(!t||t.rangeCount===0)return;const n=oe();n&&a.insertHTML(L.wrapDeleteHtml(n,e))},yt=()=>{if(!r.current||!Ve||!m.typoAutoFix||c||i)return;const e=r.current.innerHTML,t=Kt.applyTypoAutoFix(e);t.html!==e&&(r.current.innerHTML=t.html,Q(t.html))},Nt=e=>{var n;if(c||i)return;(n=r.current)==null||n.focus();const t=f.INK_BUTTON_CONFIG[e];t&&(t.value?a.execCommand(t.command,t.value):a.execCommand(t.command),d())},wt=e=>{var t;c||i||((t=r.current)==null||t.focus(),a.execCommand("formatBlock",e),fe(e),d())},Rt=()=>{var t;if(c||i)return;const e=window.prompt("Enter URL:","https://");e&&((t=r.current)==null||t.focus(),a.insertLink(e),d())},He=async e=>st&&ue?ue(e):a.fileToDataUrl(e),Et=async()=>{if(c||i)return;const e=document.createElement("input");e.type="file",e.accept="image/*",e.onchange=async()=>{var o,l;const t=(o=e.files)==null?void 0:o[0];if(!t)return;const n=await He(t);(l=r.current)==null||l.focus(),a.insertImage(n,t.name),d()},e.click()},Oe=()=>{var t;if(c||i||!m.table)return;(t=r.current)==null||t.focus();const e=Vt.buildTableHtml(ze,Xe);if(O&&m.trackChanges){const n=L.createTrackChange("insert",e,A);v([...b,n]),a.insertHTML(L.wrapInsertHtml(e,n.id))}else a.insertHTML(e);d()},ye=()=>{const e=B.current.undo();if(e===null||!r.current){a.execCommand("undo"),d();return}S(e)},Ne=()=>{const e=B.current.redo();if(e===null||!r.current){a.execCommand("redo"),d();return}S(e)},Bt=()=>{var l;if(c||i||!m.comments)return;const e=window.prompt("Comment:");if(!(e!=null&&e.trim()))return;const t=je.createInkId("hl");if((l=r.current)==null||l.focus(),!te.wrapSelectionAsComment(t))return;const o=te.createCommentThread(A,e.trim(),t);Y([o,...P]),J(!0),d()},we=e=>{if(!r.current)return;const t=L.acceptTrackChangeInHtml(r.current.innerHTML,e);S(t),v(b.map(n=>n.id===e?{...n,accepted:!0}:n))},Re=e=>{if(!r.current)return;const t=L.rejectTrackChangeInHtml(r.current.innerHTML,e);S(t),v(b.map(n=>n.id===e?{...n,rejected:!0}:n))},Ee=async e=>{const t=await He(e),n=`<img src="${t}" alt="" style="max-width:100%;height:auto;" />`;if(O&&m.trackChanges){const o=L.createTrackChange("insert",n,A);v([...b,o]),a.insertHTML(L.wrapInsertHtml(n,o.id))}else a.insertImage(t);d()},Pt=async e=>{if(c||i)return;const t=e.clipboardData;if(!t)return;if(it){const o=re.extractClipboardHtml(t);if(o){e.preventDefault();const g=re.sanitizePastedHtml(o);g&&(a.insertHTML(g),d());const _=t.items;if(ce&&_)for(const j of Array.from(_)){if(!j.type.startsWith("image/"))continue;const F=j.getAsFile();F&&await Ee(F)}return}const l=re.extractClipboardText(t);if(l){e.preventDefault(),a.insertHTML(l.replace(/\n/g,"<br />")),d();return}}if(!ce)return;const n=t.items;if(n)for(const o of Array.from(n)){if(!o.type.startsWith("image/"))continue;e.preventDefault();const l=o.getAsFile();l&&await Ee(l)}},vt=e=>{e.key==="Escape"&&U([]),(e.metaKey||e.ctrlKey)&&e.key==="z"&&(e.preventDefault(),e.shiftKey?Ne():ye())},jt=e=>{var n,o;(n=r.current)==null||n.focus();const t=window.getSelection();if((o=t==null?void 0:t.anchorNode)!=null&&o.textContent){const g=t.anchorNode.textContent.replace(/(?:^|\s)\/[^\s]*$/," ");t.anchorNode.nodeType===Node.TEXT_NODE&&(t.anchorNode.textContent=g)}switch(U([]),e.insert){case"heading1":a.execCommand("formatBlock","h1");break;case"heading2":a.execCommand("formatBlock","h2");break;case"bulletList":a.execCommand("insertUnorderedList");break;case"orderedList":a.execCommand("insertOrderedList");break;case"table":Oe();return;case"ai":X(!0);break}d()},Be=e=>{if(!r.current)return;const t=window.getSelection(),n=q.getBlockElement((t==null?void 0:t.anchorNode)??null,r.current);n&&q.moveBlock(n,e)&&(d(),D())},Ft=(e,t)=>{if(e==="divider")return s.jsx("span",{className:f.INK_CLASS_DIVIDER},`divider-${t}`);if(e==="headingDropdown")return s.jsx(Wt.ToolbarDropdown,{title:"Heading",options:f.INK_HEADING_OPTIONS,value:dt||"p",disabled:c||i,onChange:wt},"heading");if(e==="textColor")return s.jsx(Ue.ToolbarColorPicker,{title:"Text color",type:"text",value:ht,disabled:c||i,onChange:o=>{var l;(l=r.current)==null||l.focus(),a.setTextColor(o),pt(o),d()}},"textColor");if(e==="highlightColor")return s.jsx(Ue.ToolbarColorPicker,{title:"Highlight color",type:"highlight",value:gt,disabled:c||i,onChange:o=>{var l;(l=r.current)==null||l.focus(),a.setHighlightColor(o),Ct(o),d()}},"highlightColor");if(e==="link")return s.jsx(C.ToolbarButton,{icon:p.link,title:"Insert link",disabled:c||i,onClick:Rt},"link");if(e==="image")return s.jsx(C.ToolbarButton,{icon:p.image,title:"Insert image",disabled:c||i,onClick:()=>{Et()}},"image");if(e==="table")return m.table?s.jsx(C.ToolbarButton,{icon:p.table,title:"Insert table",disabled:c||i,onClick:Oe},"table"):null;if(e===y.TOOLBAR_OPTION_SIGNATURE)return m.signature?s.jsx(C.ToolbarButton,{icon:p.signature,title:"Sign pad",active:_e,disabled:c||i,onClick:()=>Le(!0)},y.TOOLBAR_OPTION_SIGNATURE):null;if(e===y.TOOLBAR_OPTION_FIND_REPLACE)return m.findReplace?s.jsx(C.ToolbarButton,{icon:p.findReplace,title:"Find and replace",active:Se,disabled:c||i,onClick:()=>xe(o=>!o)},y.TOOLBAR_OPTION_FIND_REPLACE):null;if(e===y.TOOLBAR_OPTION_HORIZONTAL_RULE)return m.horizontalRule?s.jsx(C.ToolbarButton,{icon:p.horizontalRule,title:"Horizontal rule",disabled:c||i,onClick:()=>{var o;(o=r.current)==null||o.focus(),a.insertHTML("<hr />"),d()}},y.TOOLBAR_OPTION_HORIZONTAL_RULE):null;if(e==="undo")return s.jsx(C.ToolbarButton,{icon:p.undo,title:"Undo",disabled:c||i,onClick:ye},"undo");if(e==="redo")return s.jsx(C.ToolbarButton,{icon:p.redo,title:"Redo",disabled:c||i,onClick:Ne},"redo");if(e==="trackChanges")return m.trackChanges?s.jsx(C.ToolbarButton,{icon:p.trackChanges,title:"Track changes",active:O,disabled:c||i,onClick:()=>Ht(!O)},"trackChanges"):null;if(e==="comments")return m.comments?s.jsx(C.ToolbarButton,{icon:p.comments,title:"Comments",active:Z,disabled:c||i,onClick:()=>{Z?J(!1):Bt()}},"comments"):null;if(e==="ai")return!m.ai||!(h!=null&&h.enabled)?null:s.jsx(C.ToolbarButton,{icon:p.ai,title:"Ink AI",active:Te,disabled:c||i,onClick:()=>X(o=>!o)},"ai");const n=f.INK_BUTTON_CONFIG[e];return n?s.jsx(C.ToolbarButton,{icon:p[e]??e.slice(0,1).toUpperCase(),title:n.title,active:lt.has(e),disabled:c||i,onClick:()=>Nt(e)},e):null},Mt=typeof K=="number"?`${K}px`:K,Ut=typeof V=="number"?`${V}px`:V,Dt=!!(h!=null&&h.enabled&&Te);return s.jsxs("div",{className:qt.cn(f.INK_CLASS_ROOT,qe),"data-testid":Ke,"data-disabled":c||void 0,"data-variant":Ge,"data-premium":H.active||void 0,"data-wysiwyg":ct||void 0,style:{...at,...et},...tt,children:[s.jsx("div",{className:f.INK_CLASS_TOOLBAR,role:"toolbar","aria-label":"Ink formatting toolbar",children:De.map(Ft)}),s.jsx(Yt.SignPad,{open:_e,onClose:()=>Le(!1),onConfirm:e=>{var t;(t=r.current)==null||t.focus(),a.insertImage(e),d()}}),s.jsx(Jt.FindReplace,{open:Se,onClose:()=>xe(!1),onReplace:(e,t,n)=>{if(!r.current)return;const o=Gt.replaceInHtml(r.current.innerHTML,e,t,n);S(o)}}),O&&m.trackChanges?s.jsx(Qt.TrackChangesBar,{changes:b,onAccept:we,onReject:Re,onAcceptAll:()=>b.forEach(e=>we(e.id)),onRejectAll:()=>b.forEach(e=>Re(e.id))}):null,s.jsxs("div",{className:f.INK_CLASS_SHELL,children:[s.jsxs("div",{className:f.INK_CLASS_BODY,children:[m.blocks?s.jsx(Xt.BlockHandles,{visible:St&&!c&&!i,top:_t,onMoveUp:()=>Be("up"),onMoveDown:()=>Be("down")}):null,s.jsx("div",{ref:r,className:f.INK_CLASS_CONTENT,contentEditable:!c&&!i,role:"textbox","aria-multiline":"true","aria-placeholder":se,"data-placeholder":se,suppressContentEditableWarning:!0,style:{minHeight:Mt,maxHeight:Ut},onInput:d,onBlur:yt,onKeyUp:D,onKeyDown:vt,onMouseUp:D,onPaste:e=>{Pt(e)}}),Ae?s.jsx(Zt.SlashMenu,{items:xt,top:be.top,left:be.left,onSelect:jt}):null]}),Z&&m.comments?s.jsx($t.CommentsPanel,{comments:P,author:A,onClose:()=>J(!1),onResolve:e=>{const t=P.find(n=>n.id===e);Y(P.map(n=>n.id===e?{...n,resolved:!0}:n)),t&&r.current&&S(te.removeCommentMark(r.current.innerHTML,t.highlightId))},onAddReply:(e,t)=>{Y(P.map(n=>n.id===e?{...n,replies:[...n.replies,{id:je.createInkId("reply"),author:A,body:t,timestamp:Date.now()}]}:n))}}):null,Dt&&h?s.jsx(zt.AiPanel,{config:h,documentHtml:((Pe=r.current)==null?void 0:Pe.innerHTML)??T??"",selectionHtml:ke,onClose:()=>X(!1),onApplyHtml:e=>{var t;if((t=r.current)==null||t.focus(),ke)a.insertHTML(e);else{S(e);return}d()}}):null]}),ae?s.jsxs("div",{className:f.INK_CLASS_FOOTER,children:[mt,ie?` / ${ie}`:""]}):null]})};exports.InkEditor=en;

package/dist/components/InkEditor/InkEditor.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"InkEditor.d.ts","sourceRoot":"","sources":["../../../src/components/InkEditor/InkEditor.tsx"],"names":[],"mappings":"AAAA,OAAO,EAIL,KAAK,EAAE,EAIR,MAAM,OAAO,CAAC;AACf,OAAO,KAAK,EAEV,cAAc,EAIf,MAAM,aAAa,CAAC;AAgFrB,eAAO,MAAM,SAAS,EAAE,EAAE,CAAC,cAAc,CAuuBxC,CAAC"}
+{"version":3,"file":"InkEditor.d.ts","sourceRoot":"","sources":["../../../src/components/InkEditor/InkEditor.tsx"],"names":[],"mappings":"AAAA,OAAO,EAIL,KAAK,EAAE,EAIR,MAAM,OAAO,CAAC;AACf,OAAO,KAAK,EAEV,cAAc,EAIf,MAAM,aAAa,CAAC;AAwFrB,eAAO,MAAM,SAAS,EAAE,EAAE,CAAC,cAAc,CAkzBxC,CAAC"}