@inshapardaz/likhari-react 0.1.18-dev.138 → 0.1.18-dev.142

package/dist/EditorRoot.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"EditorRoot.d.ts","sourceRoot":"","sources":["../src/EditorRoot.tsx"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAE,oBAAoB,EAAE,MAAM,eAAe,CAAC;AAY1D,OAAO,KAAK,EAA8B,qBAAqB,EAAE,MAAM,SAAS,CAAC;AAEjF,OAAO,EAAyB,KAAK,QAAQ,EAAE,MAAM,iCAAiC,CAAC;AACvF,OAAO,EAAwB,KAAK,mBAAmB,EAAE,KAAK,uBAAuB,EAAE,MAAM,2BAA2B,CAAC;AAKzH,OAAO,EAAyB,KAAK,UAAU,EAAE,MAAM,SAAS,CAAC;AAMjE,OAAO,EAAgB,KAAK,gBAAgB,EAAE,MAAM,2BAA2B,CAAC;AAYhF,OAAO,EAAgC,KAAK,MAAM,EAAE,MAAM,QAAQ,CAAC;AAMnE,yEAAyE;AACzE,MAAM,MAAM,mBAAmB,GAAG,SAAS,GAAG,YAAY,GAAG,KAAK,CAAC;AAEnE,MAAM,WAAW,oBAAoB;IACnC,MAAM,EAAE,QAAQ,CAAC;IACjB,KAAK,EAAE,MAAM,CAAC;CACf;AAED,MAAM,WAAW,eAAe;IAC9B,UAAU,CAAC,EAAE,MAAM,CAAC;IACpB,cAAc,CAAC,EAAE,oBAAoB,CAAC;IACtC,aAAa,CAAC,EAAE,mBAAmB,CAAC;IACpC,aAAa,CAAC,EAAE,uBAAuB,CAAC;IACxC,KAAK,CAAC,EAAE,oBAAoB,CAAC;IAC7B,WAAW,CAAC,EAAE,OAAO,GAAG,MAAM,CAAC;IAC/B;;;;;;OAMG;IACH,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB,MAAM,CAAC,EAAE,MAAM,CAAC;IAChB,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB;;;;;;;OAOG;IACH,MAAM,CAAC,EAAE,MAAM,GAAG,MAAM,CAAC;IACzB,QAAQ,CAAC,EAAE,CAAC,KAAK,EAAE,qBAAqB,KAAK,IAAI,CAAC;IAClD;;;OAGG;IACH,MAAM,CAAC,EAAE,CAAC,OAAO,EAAE,MAAM,EAAE,MAAM,EAAE,QAAQ,KAAK,IAAI,CAAC;IACrD;;;;;OAKG;IACH,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB;;;;OAIG;IACH,aAAa,CAAC,EAAE,CAAC,IAAI,EAAE,IAAI,KAAK,OAAO,CAAC,MAAM,CAAC,CAAC;IAChD;;;;;;;OAOG;IACH,UAAU,CAAC,EAAE,CAAC,GAAG,EAAE,MAAM,KAAK,OAAO,CAAC,IAAI,CAAC,CAAC;IAC5C;;;;;;OAMG;IACH,WAAW,CAAC,EAAE,UAAU,EAAE,CAAC;IAC3B;;;;;;;;;OASG;IACH,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB;;;;;;;OAOG;IACH,YAAY,CAAC,EAAE,gBAAgB,CAAC;IAChC;;;;;;;;;;;;;;;OAeG;IACH,eAAe,CAAC,EAAE,mBAAmB,CAAC;IACtC,uGAAuG;IACvG,eAAe,CAAC,EAAE,CAAC,KAAK,EAAE;QAAE,UAAU,EAAE,MAAM,CAAC;QAAC,OAAO,EAAE,MAAM,CAAA;KAAE,KAAK,IAAI,CAAC;IAC3E,6EAA6E;IAC7E,eAAe,CAAC,EAAE,MAAM,CAAC;IACzB;;;;;OAKG;IACH,gBAAgB,CAAC,EAAE,MAAM,CAAC;IAC1B;;;;OAIG;IACH,iBAAiB,CAAC,EAAE,MAAM,CAAC;CAC5B;AAED,MAAM,WAAW,SAAS;IACxB,UAAU,CAAC,MAAM,EAAE,QAAQ,GAAG,MAAM,CAAC;IACrC,UAAU,CAAC,KAAK,EAAE,MAAM,EAAE,MAAM,EAAE,QAAQ,GAAG,IAAI,CAAC;IAClD,iBAAiB,IAAI,OAAO,CAAC;IAC7B,cAAc,IAAI,OAAO,CAAC,OAAO,CAAC,CAAC;IACnC,KAAK,IAAI,IAAI,CAAC;CACf;AAQD,eAAO,MAAM,UAAU,uGAoXrB,CAAC"}
+{"version":3,"file":"EditorRoot.d.ts","sourceRoot":"","sources":["../src/EditorRoot.tsx"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAE,oBAAoB,EAAE,MAAM,eAAe,CAAC;AAY1D,OAAO,KAAK,EAA8B,qBAAqB,EAAE,MAAM,SAAS,CAAC;AAEjF,OAAO,EAAyB,KAAK,QAAQ,EAAE,MAAM,iCAAiC,CAAC;AACvF,OAAO,EAAwB,KAAK,mBAAmB,EAAE,KAAK,uBAAuB,EAAE,MAAM,2BAA2B,CAAC;AAKzH,OAAO,EAAyB,KAAK,UAAU,EAAE,MAAM,SAAS,CAAC;AAOjE,OAAO,EAAgB,KAAK,gBAAgB,EAAE,MAAM,2BAA2B,CAAC;AAYhF,OAAO,EAAgC,KAAK,MAAM,EAAE,MAAM,QAAQ,CAAC;AAMnE,yEAAyE;AACzE,MAAM,MAAM,mBAAmB,GAAG,SAAS,GAAG,YAAY,GAAG,KAAK,CAAC;AAEnE,MAAM,WAAW,oBAAoB;IACnC,MAAM,EAAE,QAAQ,CAAC;IACjB,KAAK,EAAE,MAAM,CAAC;CACf;AAED,MAAM,WAAW,eAAe;IAC9B,UAAU,CAAC,EAAE,MAAM,CAAC;IACpB,cAAc,CAAC,EAAE,oBAAoB,CAAC;IACtC,aAAa,CAAC,EAAE,mBAAmB,CAAC;IACpC,aAAa,CAAC,EAAE,uBAAuB,CAAC;IACxC,KAAK,CAAC,EAAE,oBAAoB,CAAC;IAC7B,WAAW,CAAC,EAAE,OAAO,GAAG,MAAM,CAAC;IAC/B;;;;;;OAMG;IACH,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB,MAAM,CAAC,EAAE,MAAM,CAAC;IAChB,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB;;;;;;;OAOG;IACH,MAAM,CAAC,EAAE,MAAM,GAAG,MAAM,CAAC;IACzB,QAAQ,CAAC,EAAE,CAAC,KAAK,EAAE,qBAAqB,KAAK,IAAI,CAAC;IAClD;;;OAGG;IACH,MAAM,CAAC,EAAE,CAAC,OAAO,EAAE,MAAM,EAAE,MAAM,EAAE,QAAQ,KAAK,IAAI,CAAC;IACrD;;;;;OAKG;IACH,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB;;;;OAIG;IACH,aAAa,CAAC,EAAE,CAAC,IAAI,EAAE,IAAI,KAAK,OAAO,CAAC,MAAM,CAAC,CAAC;IAChD;;;;;;;OAOG;IACH,UAAU,CAAC,EAAE,CAAC,GAAG,EAAE,MAAM,KAAK,OAAO,CAAC,IAAI,CAAC,CAAC;IAC5C;;;;;;OAMG;IACH,WAAW,CAAC,EAAE,UAAU,EAAE,CAAC;IAC3B;;;;;;;;;OASG;IACH,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB;;;;;;;OAOG;IACH,YAAY,CAAC,EAAE,gBAAgB,CAAC;IAChC;;;;;;;;;;;;;;;OAeG;IACH,eAAe,CAAC,EAAE,mBAAmB,CAAC;IACtC,uGAAuG;IACvG,eAAe,CAAC,EAAE,CAAC,KAAK,EAAE;QAAE,UAAU,EAAE,MAAM,CAAC;QAAC,OAAO,EAAE,MAAM,CAAA;KAAE,KAAK,IAAI,CAAC;IAC3E,6EAA6E;IAC7E,eAAe,CAAC,EAAE,MAAM,CAAC;IACzB;;;;;OAKG;IACH,gBAAgB,CAAC,EAAE,MAAM,CAAC;IAC1B;;;;OAIG;IACH,iBAAiB,CAAC,EAAE,MAAM,CAAC;CAC5B;AAED,MAAM,WAAW,SAAS;IACxB,UAAU,CAAC,MAAM,EAAE,QAAQ,GAAG,MAAM,CAAC;IACrC,UAAU,CAAC,KAAK,EAAE,MAAM,EAAE,MAAM,EAAE,QAAQ,GAAG,IAAI,CAAC;IAClD,iBAAiB,IAAI,OAAO,CAAC;IAC7B,cAAc,IAAI,OAAO,CAAC,OAAO,CAAC,CAAC;IACnC,KAAK,IAAI,IAAI,CAAC;CACf;AAQD,eAAO,MAAM,UAAU,uGAqXrB,CAAC"}

package/dist/EditorRoot.js

@@ -24,6 +24,7 @@ import { PageBreakPlugin } from './plugins/PageBreakPlugin.js';
 import { LayoutPlugin } from './plugins/LayoutPlugin.js';
 import { FootnotePlugin } from './plugins/FootnotePlugin.js';
 import { PoetryPlugin } from './plugins/PoetryPlugin.js';
+import { PoetryResizer } from './blocks/PoetryResizer.js';
 import { DraftRestore } from './components/DraftRestore.js';
 import { LeaveDialog } from './components/LeaveDialog.js';
 import { clearDraft, createDraftId, hasDraftContent, pruneDrafts, writeDraft, } from './persistence/draftStorage.js';
@@ -280,7 +281,7 @@ export const EditorRoot = forwardRef(function EditorRoot({ documentId, initialCo
     const portalTargetSelector = `#${CSS.escape(portalTargetId)}`;
     return (_jsx(EditorThemeProvider, { theme: theme, colorScheme: colorScheme, accentColor: accentColor, scopeElementId: portalTargetId, children: _jsxs("div", { className: "likhari-root", dir: dir, ref: rootElementRef, "data-document-id": documentId, style: { height: typeof height === 'number' ? `${height}px` : height }, children: [_jsx("div", { id: portalTargetId, className: "likhari-portal-target" }), _jsx(PortalTargetContext.Provider, { value: portalTargetSelector, children: _jsxs(UiStringsContext.Provider, { value: strings, children: [_jsx(ImageOptionsContext.Provider, { value: imageOptions, children: _jsxs(LexicalComposer, { initialConfig: initialConfig, children: [_jsx(Toolbar, { config: config, onSave: handleSave, isDirty: isDirty, showSave: showSave, fontOptions: fontOptions, direction: dir, locale: locale, drafts: autosave
                                                 ? { currentId: draftId, maxBytes: autosaveMaxBytes, adoptOnRestore: !documentId, onRestored: handleDraftRestored }
-                                                : undefined }), documentId && (_jsx(DraftRestore, { draftId: documentId, mode: restoreDraft, initialJson: initialContentJsonRef.current, locale: locale, onRestored: handleDraftRestored })), _jsx("div", { className: "likhari-canvas", children: _jsx(RichTextPlugin, { contentEditable: _jsx(ContentEditable, { className: "likhari-content-editable", dir: dir, "aria-label": strings.editor.contentLabel }), placeholder: _jsx("div", { className: "likhari-placeholder", children: resolvedPlaceholder }), ErrorBoundary: LexicalErrorBoundary }) }), config.history && _jsx(HistoryPlugin, {}), (config.lists.bullet || config.lists.numbered || config.lists.check) && _jsx(ListPlugin, {}), config.lists.check && _jsx(CheckListPlugin, {}), config.links && _jsx(LinkPlugin, {}), config.links && _jsx(LinkPastePlugin, {}), config.blocks.pageBreak && _jsx(PageBreakPlugin, {}), config.columns && _jsx(LayoutPlugin, {}), config.footnotes && _jsx(FootnotePlugin, {}), config.poetry.enabled && _jsx(PoetryPlugin, {}), config.tables && _jsx(TablePlugin, { hasCellMerge: true, hasTabHandler: true }), config.blocks.horizontalRule && _jsx(HorizontalRulePlugin, {}), _jsx(EditorInstancePlugin, { instanceRef: editorInstanceRef }), _jsx(OnChangePlugin, { onChange: handleChange })] }) }), _jsx(LeaveDialog, { opened: leavePrompt !== null, canSave: Boolean(onSave), canSaveDraft: autosave || navigationGuard === 'save-draft', draftFailed: leavePrompt?.draftFailed ?? false, onSave: () => {
+                                                : undefined }), documentId && (_jsx(DraftRestore, { draftId: documentId, mode: restoreDraft, initialJson: initialContentJsonRef.current, locale: locale, onRestored: handleDraftRestored })), _jsx("div", { className: "likhari-canvas", children: _jsx(RichTextPlugin, { contentEditable: _jsx(ContentEditable, { className: "likhari-content-editable", dir: dir, "aria-label": strings.editor.contentLabel }), placeholder: _jsx("div", { className: "likhari-placeholder", children: resolvedPlaceholder }), ErrorBoundary: LexicalErrorBoundary }) }), config.history && _jsx(HistoryPlugin, {}), (config.lists.bullet || config.lists.numbered || config.lists.check) && _jsx(ListPlugin, {}), config.lists.check && _jsx(CheckListPlugin, {}), config.links && _jsx(LinkPlugin, {}), config.links && _jsx(LinkPastePlugin, {}), config.blocks.pageBreak && _jsx(PageBreakPlugin, {}), config.columns && _jsx(LayoutPlugin, {}), config.footnotes && _jsx(FootnotePlugin, {}), config.poetry.enabled && _jsx(PoetryPlugin, {}), config.poetry.enabled && _jsx(PoetryResizer, {}), config.tables && _jsx(TablePlugin, { hasCellMerge: true, hasTabHandler: true }), config.blocks.horizontalRule && _jsx(HorizontalRulePlugin, {}), _jsx(EditorInstancePlugin, { instanceRef: editorInstanceRef }), _jsx(OnChangePlugin, { onChange: handleChange })] }) }), _jsx(LeaveDialog, { opened: leavePrompt !== null, canSave: Boolean(onSave), canSaveDraft: autosave || navigationGuard === 'save-draft', draftFailed: leavePrompt?.draftFailed ?? false, onSave: () => {
                                     handleSave();
                                     settleLeave(true);
                                 }, onSaveDraft: () => {

package/dist/blocks/PoetryNode.d.ts

@@ -4,6 +4,7 @@ export type PoetryAlign = 'justify' | 'left' | 'right' | 'start';
 export type SerializedPoetryBlockNode = Spread<{
     layout: PoetryLayout;
     align: PoetryAlign;
+    width?: number;
 }, SerializedElementNode>;
 /**
  * A couplet (two-line verse unit), the one extensible primitive requirements
@@ -18,11 +19,16 @@ export type SerializedPoetryBlockNode = Spread<{
 export declare class PoetryBlockNode extends ElementNode {
     __layout: PoetryLayout;
     __align: PoetryAlign;
-    constructor(layout?: PoetryLayout, align?: PoetryAlign, key?: NodeKey);
+    /** User-chosen width in px (drag-resized), overriding editor.css's default
+     * max-width: 70%. Undefined until the user resizes it. */
+    __width?: number;
+    constructor(layout?: PoetryLayout, align?: PoetryAlign, width?: number, key?: NodeKey);
     static getType(): string;
     static clone(node: PoetryBlockNode): PoetryBlockNode;
     getLayout(): PoetryLayout;
     getAlign(): PoetryAlign;
+    getWidth(): number | undefined;
+    setWidth(width: number | undefined): this;
     /** Attribute-only — restructuring children for a layout change is
      * poetryActions.ts's $setPoetryLayout, not a node method, since it needs
      * $-context tree mutations beyond this node's own state. */
@@ -37,6 +43,6 @@ export declare class PoetryBlockNode extends ElementNode {
     canBeEmpty(): false;
     isShadowRoot(): boolean;
 }
-export declare function $createPoetryBlockNode(layout?: PoetryLayout, align?: PoetryAlign): PoetryBlockNode;
+export declare function $createPoetryBlockNode(layout?: PoetryLayout, align?: PoetryAlign, width?: number): PoetryBlockNode;
 export declare function $isPoetryBlockNode(node: LexicalNode | null | undefined): node is PoetryBlockNode;
 //# sourceMappingURL=PoetryNode.d.ts.map

package/dist/blocks/PoetryNode.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"PoetryNode.d.ts","sourceRoot":"","sources":["../../src/blocks/PoetryNode.tsx"],"names":[],"mappings":"AACA,OAAO,EAGL,KAAK,gBAAgB,EACrB,KAAK,eAAe,EACpB,KAAK,YAAY,EACjB,KAAK,WAAW,EAChB,KAAK,OAAO,EACZ,KAAK,qBAAqB,EAC1B,KAAK,MAAM,EACX,WAAW,EACZ,MAAM,SAAS,CAAC;AAEjB,MAAM,MAAM,YAAY,GAAG,QAAQ,GAAG,YAAY,CAAC;AACnD,MAAM,MAAM,WAAW,GAAG,SAAS,GAAG,MAAM,GAAG,OAAO,GAAG,OAAO,CAAC;AAgBjE,MAAM,MAAM,yBAAyB,GAAG,MAAM,CAAC;IAAE,MAAM,EAAE,YAAY,CAAC;IAAC,KAAK,EAAE,WAAW,CAAA;CAAE,EAAE,qBAAqB,CAAC,CAAC;AAEpH;;;;;;;;;GASG;AACH,qBAAa,eAAgB,SAAQ,WAAW;IAC9C,QAAQ,EAAE,YAAY,CAAC;IACvB,OAAO,EAAE,WAAW,CAAC;gBAET,MAAM,GAAE,YAAuB,EAAE,KAAK,GAAE,WAAuB,EAAE,GAAG,CAAC,EAAE,OAAO;IAM1F,MAAM,CAAC,OAAO,IAAI,MAAM;IAIxB,MAAM,CAAC,KAAK,CAAC,IAAI,EAAE,eAAe,GAAG,eAAe;IAIpD,SAAS,IAAI,YAAY;IAIzB,QAAQ,IAAI,WAAW;IAIvB;;gEAE4D;IAC5D,kBAAkB,CAAC,MAAM,EAAE,YAAY,GAAG,IAAI;IAM9C,QAAQ,CAAC,KAAK,EAAE,WAAW,GAAG,IAAI;IAMlC,MAAM,CAAC,UAAU,CAAC,cAAc,EAAE,yBAAyB,GAAG,eAAe;IAI7E,UAAU,IAAI,yBAAyB;IAIvC,MAAM,CAAC,SAAS,IAAI,gBAAgB,GAAG,IAAI;IAa3C,SAAS,IAAI,eAAe;IAQ5B,SAAS,CAAC,MAAM,EAAE,YAAY,GAAG,WAAW;IAY5C,SAAS,CAAC,QAAQ,EAAE,eAAe,EAAE,GAAG,EAAE,WAAW,EAAE,MAAM,EAAE,YAAY,GAAG,OAAO;IAYrF,UAAU,IAAI,KAAK;IAInB,YAAY,IAAI,OAAO;CAGxB;AAED,wBAAgB,sBAAsB,CAAC,MAAM,GAAE,YAAuB,EAAE,KAAK,GAAE,WAAuB,GAAG,eAAe,CAEvH;AAED,wBAAgB,kBAAkB,CAAC,IAAI,EAAE,WAAW,GAAG,IAAI,GAAG,SAAS,GAAG,IAAI,IAAI,eAAe,CAEhG"}
+{"version":3,"file":"PoetryNode.d.ts","sourceRoot":"","sources":["../../src/blocks/PoetryNode.tsx"],"names":[],"mappings":"AACA,OAAO,EAGL,KAAK,gBAAgB,EACrB,KAAK,eAAe,EACpB,KAAK,YAAY,EACjB,KAAK,WAAW,EAChB,KAAK,OAAO,EACZ,KAAK,qBAAqB,EAC1B,KAAK,MAAM,EACX,WAAW,EACZ,MAAM,SAAS,CAAC;AAEjB,MAAM,MAAM,YAAY,GAAG,QAAQ,GAAG,YAAY,CAAC;AACnD,MAAM,MAAM,WAAW,GAAG,SAAS,GAAG,MAAM,GAAG,OAAO,GAAG,OAAO,CAAC;AAwBjE,MAAM,MAAM,yBAAyB,GAAG,MAAM,CAAC;IAAE,MAAM,EAAE,YAAY,CAAC;IAAC,KAAK,EAAE,WAAW,CAAC;IAAC,KAAK,CAAC,EAAE,MAAM,CAAA;CAAE,EAAE,qBAAqB,CAAC,CAAC;AAEpI;;;;;;;;;GASG;AACH,qBAAa,eAAgB,SAAQ,WAAW;IAC9C,QAAQ,EAAE,YAAY,CAAC;IACvB,OAAO,EAAE,WAAW,CAAC;IACrB;8DAC0D;IAC1D,OAAO,CAAC,EAAE,MAAM,CAAC;gBAEL,MAAM,GAAE,YAAuB,EAAE,KAAK,GAAE,WAAuB,EAAE,KAAK,CAAC,EAAE,MAAM,EAAE,GAAG,CAAC,EAAE,OAAO;IAO1G,MAAM,CAAC,OAAO,IAAI,MAAM;IAIxB,MAAM,CAAC,KAAK,CAAC,IAAI,EAAE,eAAe,GAAG,eAAe;IAIpD,SAAS,IAAI,YAAY;IAIzB,QAAQ,IAAI,WAAW;IAIvB,QAAQ,IAAI,MAAM,GAAG,SAAS;IAI9B,QAAQ,CAAC,KAAK,EAAE,MAAM,GAAG,SAAS,GAAG,IAAI;IAMzC;;gEAE4D;IAC5D,kBAAkB,CAAC,MAAM,EAAE,YAAY,GAAG,IAAI;IAM9C,QAAQ,CAAC,KAAK,EAAE,WAAW,GAAG,IAAI;IAMlC,MAAM,CAAC,UAAU,CAAC,cAAc,EAAE,yBAAyB,GAAG,eAAe;IAI7E,UAAU,IAAI,yBAAyB;IAYvC,MAAM,CAAC,SAAS,IAAI,gBAAgB,GAAG,IAAI;IAe3C,SAAS,IAAI,eAAe;IAW5B,SAAS,CAAC,MAAM,EAAE,YAAY,GAAG,WAAW;IAa5C,SAAS,CAAC,QAAQ,EAAE,eAAe,EAAE,GAAG,EAAE,WAAW,EAAE,MAAM,EAAE,YAAY,GAAG,OAAO;IAerF,UAAU,IAAI,KAAK;IAInB,YAAY,IAAI,OAAO;CAGxB;AAED,wBAAgB,sBAAsB,CAAC,MAAM,GAAE,YAAuB,EAAE,KAAK,GAAE,WAAuB,EAAE,KAAK,CAAC,EAAE,MAAM,GAAG,eAAe,CAEvI;AAED,wBAAgB,kBAAkB,CAAC,IAAI,EAAE,WAAW,GAAG,IAAI,GAAG,SAAS,GAAG,IAAI,IAAI,eAAe,CAEhG"}

package/dist/blocks/PoetryNode.js

@@ -12,6 +12,15 @@ function applyAlignStyle(element, align) {
     element.style.textAlign = align;
     element.style.textAlignLast = align === 'justify' ? 'justify' : '';
 }
+/** A user-dragged width overrides editor.css's default max-width: 70% —
+ * clearing the inline style (rather than setting it to that same 70%)
+ * lets the CSS default keep tracking the canvas if it's ever resized. */
+function applyWidthStyle(element, width) {
+    if (width === undefined)
+        element.style.removeProperty('max-width');
+    else
+        element.style.maxWidth = `${width}px`;
+}
 /**
  * A couplet (two-line verse unit), the one extensible primitive requirements
  * doc §4.11 recommends in place of four fixed templates. `layout` picks
@@ -23,16 +32,17 @@ function applyAlignStyle(element, align) {
  * between layouts doesn't lose selection/undo coherence.
  */
 export class PoetryBlockNode extends ElementNode {
-    constructor(layout = 'single', align = 'justify', key) {
+    constructor(layout = 'single', align = 'justify', width, key) {
         super(key);
         this.__layout = layout;
         this.__align = align;
+        this.__width = width;
     }
     static getType() {
         return 'poetry-couplet';
     }
     static clone(node) {
-        return new PoetryBlockNode(node.__layout, node.__align, node.__key);
+        return new PoetryBlockNode(node.__layout, node.__align, node.__width, node.__key);
     }
     getLayout() {
         return this.getLatest().__layout;
@@ -40,6 +50,14 @@ export class PoetryBlockNode extends ElementNode {
     getAlign() {
         return this.getLatest().__align;
     }
+    getWidth() {
+        return this.getLatest().__width;
+    }
+    setWidth(width) {
+        const writable = this.getWritable();
+        writable.__width = width;
+        return writable;
+    }
     /** Attribute-only — restructuring children for a layout change is
      * poetryActions.ts's $setPoetryLayout, not a node method, since it needs
      * $-context tree mutations beyond this node's own state. */
@@ -54,10 +72,18 @@ export class PoetryBlockNode extends ElementNode {
         return writable;
     }
     static importJSON(serializedNode) {
-        return $createPoetryBlockNode(serializedNode.layout, serializedNode.align);
+        return $createPoetryBlockNode(serializedNode.layout, serializedNode.align, serializedNode.width);
     }
     exportJSON() {
-        return { ...super.exportJSON(), type: 'poetry-couplet', version: 1, layout: this.getLayout(), align: this.getAlign() };
+        const width = this.getWidth();
+        return {
+            ...super.exportJSON(),
+            type: 'poetry-couplet',
+            version: 1,
+            layout: this.getLayout(),
+            align: this.getAlign(),
+            ...(width !== undefined ? { width } : {}),
+        };
     }
     static importDOM() {
         return {
@@ -68,7 +94,9 @@ export class PoetryBlockNode extends ElementNode {
                 const layout = VALID_LAYOUTS.has(rawLayout) ? rawLayout : 'single';
                 const rawAlign = domNode.getAttribute('data-likhari-poetry-align') ?? 'justify';
                 const align = VALID_ALIGNS.has(rawAlign) ? rawAlign : 'justify';
-                return { conversion: () => ({ node: $createPoetryBlockNode(layout, align) }), priority: 2 };
+                const rawWidth = Number(domNode.getAttribute('data-likhari-poetry-width'));
+                const width = Number.isFinite(rawWidth) && rawWidth > 0 ? rawWidth : undefined;
+                return { conversion: () => ({ node: $createPoetryBlockNode(layout, align, width) }), priority: 2 };
             },
         };
     }
@@ -76,7 +104,11 @@ export class PoetryBlockNode extends ElementNode {
         const element = document.createElement('div');
         element.setAttribute('data-likhari-poetry-layout', this.getLayout());
         element.setAttribute('data-likhari-poetry-align', this.getAlign());
+        const width = this.getWidth();
+        if (width !== undefined)
+            element.setAttribute('data-likhari-poetry-width', String(width));
         applyAlignStyle(element, this.getAlign());
+        applyWidthStyle(element, width);
         return { element };
     }
     createDOM(config) {
@@ -84,6 +116,7 @@ export class PoetryBlockNode extends ElementNode {
         const base = config.theme.poetry ?? 'likhari-poetry';
         addClassNamesToElement(element, base, `${base}--${this.__layout}`);
         applyAlignStyle(element, this.__align);
+        applyWidthStyle(element, this.__width);
         return element;
     }
     // Only ever adds/removes the layout modifier class, never touches the
@@ -99,6 +132,9 @@ export class PoetryBlockNode extends ElementNode {
         if (prevNode.__align !== this.__align) {
             applyAlignStyle(dom, this.__align);
         }
+        if (prevNode.__width !== this.__width) {
+            applyWidthStyle(dom, this.__width);
+        }
         return false;
     }
     canBeEmpty() {
@@ -108,8 +144,8 @@ export class PoetryBlockNode extends ElementNode {
         return true;
     }
 }
-export function $createPoetryBlockNode(layout = 'single', align = 'justify') {
-    return $applyNodeReplacement(new PoetryBlockNode(layout, align));
+export function $createPoetryBlockNode(layout = 'single', align = 'justify', width) {
+    return $applyNodeReplacement(new PoetryBlockNode(layout, align, width));
 }
 export function $isPoetryBlockNode(node) {
     return node instanceof PoetryBlockNode;

package/dist/blocks/PoetryResizer.d.ts

@@ -0,0 +1,11 @@
+/**
+ * A floating drag handle over the currently-active poetry couplet's
+ * inline-end edge, letting the user resize how wide the block reads on the
+ * page — "size it according to the length of the couplet" — rather than
+ * being stuck with editor.css's default max-width: 70%. Rendered as a
+ * portal into the editor's own portal-target element, never as a child of
+ * the couplet's own DOM, so it can't interfere with Lexical's
+ * reconciliation of the couplet's real (editable) children.
+ */
+export declare function PoetryResizer(): import("react").JSX.Element | null;
+//# sourceMappingURL=PoetryResizer.d.ts.map

package/dist/blocks/PoetryResizer.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"PoetryResizer.d.ts","sourceRoot":"","sources":["../../src/blocks/PoetryResizer.tsx"],"names":[],"mappings":"AAuBA;;;;;;;;GAQG;AACH,wBAAgB,aAAa,uCAqF5B"}

package/dist/blocks/PoetryResizer.js

@@ -0,0 +1,94 @@
+import { jsx as _jsx } from "react/jsx-runtime";
+import { useEffect, useRef, useState } from 'react';
+import { createPortal } from 'react-dom';
+import { useLexicalComposerContext } from '@lexical/react/LexicalComposerContext';
+import { $getNodeByKey } from 'lexical';
+import { usePortalTarget } from '../PortalTargetContext.js';
+import { $getPoetryBlockFromSelection } from './poetryActions.js';
+import { $isPoetryBlockNode } from './PoetryNode.js';
+const MIN_WIDTH_PX = 160;
+function measure(el) {
+    const box = el.getBoundingClientRect();
+    return { top: box.top, left: box.left, width: box.width, height: box.height, rtl: getComputedStyle(el).direction === 'rtl' };
+}
+/**
+ * A floating drag handle over the currently-active poetry couplet's
+ * inline-end edge, letting the user resize how wide the block reads on the
+ * page — "size it according to the length of the couplet" — rather than
+ * being stuck with editor.css's default max-width: 70%. Rendered as a
+ * portal into the editor's own portal-target element, never as a child of
+ * the couplet's own DOM, so it can't interfere with Lexical's
+ * reconciliation of the couplet's real (editable) children.
+ */
+export function PoetryResizer() {
+    const [editor] = useLexicalComposerContext();
+    const portalSelector = usePortalTarget();
+    const [activeKey, setActiveKey] = useState(null);
+    const [box, setBox] = useState(null);
+    const dragStart = useRef(null);
+    useEffect(() => {
+        const recompute = () => {
+            if (dragStart.current)
+                return; // the pointermove handler owns `box` mid-drag
+            editor.getEditorState().read(() => {
+                const couplet = $getPoetryBlockFromSelection();
+                const el = couplet ? editor.getElementByKey(couplet.getKey()) : null;
+                if (!couplet || !el) {
+                    setActiveKey(null);
+                    setBox(null);
+                    return;
+                }
+                setActiveKey(couplet.getKey());
+                setBox(measure(el));
+            });
+        };
+        recompute();
+        const unregister = editor.registerUpdateListener(recompute);
+        window.addEventListener('resize', recompute);
+        window.addEventListener('scroll', recompute, true);
+        return () => {
+            unregister();
+            window.removeEventListener('resize', recompute);
+            window.removeEventListener('scroll', recompute, true);
+        };
+    }, [editor]);
+    if (!box || !activeKey)
+        return null;
+    const onPointerDown = (event) => {
+        event.preventDefault();
+        event.currentTarget.setPointerCapture(event.pointerId);
+        dragStart.current = { x: event.clientX, width: box.width, rtl: box.rtl };
+    };
+    const onPointerMove = (event) => {
+        const start = dragStart.current;
+        const el = editor.getElementByKey(activeKey);
+        if (!start || !el)
+            return;
+        const delta = event.clientX - start.x;
+        const signedDelta = start.rtl ? -delta : delta;
+        const canvasMax = editor.getRootElement()?.clientWidth ?? start.width + signedDelta;
+        const width = Math.round(Math.min(Math.max(start.width + signedDelta, MIN_WIDTH_PX), canvasMax));
+        // Live visual feedback: the couplet is centered (margin: auto), so
+        // resizing it moves both edges — re-measure after mutating rather than
+        // computing the new position from the drag delta alone.
+        el.style.maxWidth = `${width}px`;
+        setBox(measure(el));
+    };
+    const onPointerUp = () => {
+        const start = dragStart.current;
+        dragStart.current = null;
+        const el = editor.getElementByKey(activeKey);
+        const width = el ? Math.round(el.getBoundingClientRect().width) : null;
+        if (start && width !== null) {
+            editor.update(() => {
+                const node = $getNodeByKey(activeKey);
+                if ($isPoetryBlockNode(node))
+                    node.setWidth(width);
+            });
+        }
+    };
+    const handleX = box.rtl ? box.left : box.left + box.width;
+    const handle = (_jsx("div", { className: "likhari-poetry-resize-handle", style: { position: 'fixed', top: box.top, left: handleX, height: box.height }, onPointerDown: onPointerDown, onPointerMove: onPointerMove, onPointerUp: onPointerUp, role: "separator", "aria-orientation": "vertical" }));
+    const portalRoot = portalSelector ? document.querySelector(portalSelector) : null;
+    return portalRoot ? createPortal(handle, portalRoot) : handle;
+}

package/dist/theme/editor.css

@@ -406,18 +406,55 @@
 
 .likhari-poetry--two-column .likhari-layout-container {
   margin: 0;
-  gap: 16px;
+  /* No grid gap — the divider below sits exactly on the track boundary, so
+     spacing instead comes from matching padding on each side of it, which
+     keeps the gutter visually even on both sides of the line. */
+  gap: 0;
 }
 
 .likhari-poetry--two-column .likhari-layout-item {
   text-align: inherit;
 }
 
+.likhari-poetry--two-column .likhari-layout-item:first-child {
+  padding-inline-end: 20px;
+}
+
 /* A visible divider between misra columns, same dashed language as the
    couplet's own border — matches a table's internal cell borders. */
 .likhari-poetry--two-column .likhari-layout-item:not(:first-child) {
   border-inline-start: 1px dashed var(--editor-line-strong);
-  padding-inline-start: 16px;
+  padding-inline-start: 20px;
+}
+
+/* PoetryResizer.tsx's drag handle — portaled to a fixed position over the
+   active couplet's inline-end edge, so top/left are set inline per drag. */
+.likhari-poetry-resize-handle {
+  position: fixed;
+  width: 10px;
+  /* Physical, not logical: PoetryResizer.tsx already computes `left` as the
+     couplet's actual edge in viewport coordinates for either direction, so
+     centering the handle on it must stay physical too. */
+  margin-left: -5px;
+  cursor: ew-resize;
+  touch-action: none;
+  z-index: 20;
+}
+
+.likhari-poetry-resize-handle::before {
+  content: '';
+  display: block;
+  width: 3px;
+  height: 100%;
+  margin-inline: auto;
+  border-radius: 2px;
+  background: var(--editor-accent);
+  opacity: 0;
+  transition: opacity 0.1s ease;
+}
+
+.likhari-poetry-resize-handle:hover::before {
+  opacity: 0.6;
 }
 
 .likhari-table {

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@inshapardaz/likhari-react",
-  "version": "0.1.18-dev.138",
+  "version": "0.1.18-dev.142",
   "description": "React implementation of the Likhari editor, built on @lexical/react.",
   "license": "MIT",
   "repository": {