@tiptap/core 3.9.1 → 3.10.1
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.
- package/dist/index.cjs +543 -1
- package/dist/index.cjs.map +1 -1
- package/dist/index.d.cts +463 -3
- package/dist/index.d.ts +463 -3
- package/dist/index.js +541 -1
- package/dist/index.js.map +1 -1
- package/package.json +3 -3
- package/src/ExtensionManager.ts +7 -1
- package/src/Node.ts +1 -1
- package/src/index.ts +1 -0
- package/src/lib/ResizableNodeView.ts +942 -0
- package/src/lib/index.ts +1 -0
package/dist/index.d.ts
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
import { Transaction, EditorState, Plugin, Selection, NodeSelection, TextSelection, PluginKey } from '@tiptap/pm/state';
|
|
2
2
|
import { Node as Node$1, MarkType as MarkType$1, MarkSpec, Mark as Mark$1, DOMOutputSpec, NodeType as NodeType$1, NodeSpec, Slice, ParseOptions, Fragment as Fragment$1, Schema, ContentMatch, ResolvedPos, ParseRule } from '@tiptap/pm/model';
|
|
3
|
-
import { EditorProps, EditorView, Decoration, DecorationAttrs, ViewMutationRecord, NodeViewConstructor, NodeView as NodeView$1, MarkViewConstructor, MarkView as MarkView$1 } from '@tiptap/pm/view';
|
|
3
|
+
import { EditorProps, EditorView, Decoration, DecorationAttrs, ViewMutationRecord, NodeViewConstructor, NodeView as NodeView$1, MarkViewConstructor, MarkView as MarkView$1, DecorationSource } from '@tiptap/pm/view';
|
|
4
4
|
import { Transform, Mappable } from '@tiptap/pm/transform';
|
|
5
5
|
|
|
6
6
|
type StringKeyOf<T> = Extract<keyof T, string>;
|
|
@@ -215,7 +215,7 @@ interface NodeConfig<Options = any, Storage = any> extends ExtendableConfig<Opti
|
|
|
215
215
|
editor: Editor;
|
|
216
216
|
type: NodeType$1;
|
|
217
217
|
parent: ParentConfig<NodeConfig<Options, Storage>>['addNodeView'];
|
|
218
|
-
}) => NodeViewRenderer) | null;
|
|
218
|
+
}) => NodeViewRenderer | null) | null;
|
|
219
219
|
/**
|
|
220
220
|
* Defines if this node should be a top level node (doc)
|
|
221
221
|
* @default false
|
|
@@ -3524,6 +3524,466 @@ declare function Fragment(props: {
|
|
|
3524
3524
|
}): JSXRenderer[];
|
|
3525
3525
|
declare const h: JSXRenderer;
|
|
3526
3526
|
|
|
3527
|
+
/**
|
|
3528
|
+
* Directions where resize handles can be placed
|
|
3529
|
+
*
|
|
3530
|
+
* @example
|
|
3531
|
+
* - `'top'` - Top edge handle
|
|
3532
|
+
* - `'bottom-right'` - Bottom-right corner handle
|
|
3533
|
+
*/
|
|
3534
|
+
type ResizableNodeViewDirection = 'top' | 'right' | 'bottom' | 'left' | 'top-right' | 'top-left' | 'bottom-right' | 'bottom-left';
|
|
3535
|
+
/**
|
|
3536
|
+
* Dimensions for the resizable node in pixels
|
|
3537
|
+
*/
|
|
3538
|
+
type ResizableNodeDimensions = {
|
|
3539
|
+
/** Width in pixels */
|
|
3540
|
+
width: number;
|
|
3541
|
+
/** Height in pixels */
|
|
3542
|
+
height: number;
|
|
3543
|
+
};
|
|
3544
|
+
/**
|
|
3545
|
+
* Configuration options for creating a ResizableNodeView
|
|
3546
|
+
*
|
|
3547
|
+
* @example
|
|
3548
|
+
* ```ts
|
|
3549
|
+
* new ResizableNodeView({
|
|
3550
|
+
* element: imgElement,
|
|
3551
|
+
* node,
|
|
3552
|
+
* getPos,
|
|
3553
|
+
* onResize: (width, height) => {
|
|
3554
|
+
* imgElement.style.width = `${width}px`
|
|
3555
|
+
* imgElement.style.height = `${height}px`
|
|
3556
|
+
* },
|
|
3557
|
+
* onCommit: (width, height) => {
|
|
3558
|
+
* editor.commands.updateAttributes('image', { width, height })
|
|
3559
|
+
* },
|
|
3560
|
+
* onUpdate: (node) => true,
|
|
3561
|
+
* options: {
|
|
3562
|
+
* directions: ['bottom-right', 'bottom-left'],
|
|
3563
|
+
* min: { width: 100, height: 100 },
|
|
3564
|
+
* preserveAspectRatio: true
|
|
3565
|
+
* }
|
|
3566
|
+
* })
|
|
3567
|
+
* ```
|
|
3568
|
+
*/
|
|
3569
|
+
type ResizableNodeViewOptions = {
|
|
3570
|
+
/**
|
|
3571
|
+
* The DOM element to make resizable (e.g., an img, video, or iframe element)
|
|
3572
|
+
*/
|
|
3573
|
+
element: HTMLElement;
|
|
3574
|
+
/**
|
|
3575
|
+
* The DOM element that will hold the editable content element
|
|
3576
|
+
*/
|
|
3577
|
+
contentElement?: HTMLElement;
|
|
3578
|
+
/**
|
|
3579
|
+
* The ProseMirror node instance
|
|
3580
|
+
*/
|
|
3581
|
+
node: Node$1;
|
|
3582
|
+
/**
|
|
3583
|
+
* Function that returns the current position of the node in the document
|
|
3584
|
+
*/
|
|
3585
|
+
getPos: () => number | undefined;
|
|
3586
|
+
/**
|
|
3587
|
+
* Callback fired continuously during resize with current dimensions.
|
|
3588
|
+
* Use this to update the element's visual size in real-time.
|
|
3589
|
+
*
|
|
3590
|
+
* @param width - Current width in pixels
|
|
3591
|
+
* @param height - Current height in pixels
|
|
3592
|
+
*
|
|
3593
|
+
* @example
|
|
3594
|
+
* ```ts
|
|
3595
|
+
* onResize: (width, height) => {
|
|
3596
|
+
* element.style.width = `${width}px`
|
|
3597
|
+
* element.style.height = `${height}px`
|
|
3598
|
+
* }
|
|
3599
|
+
* ```
|
|
3600
|
+
*/
|
|
3601
|
+
onResize?: (width: number, height: number) => void;
|
|
3602
|
+
/**
|
|
3603
|
+
* Callback fired once when resize completes with final dimensions.
|
|
3604
|
+
* Use this to persist the new size to the node's attributes.
|
|
3605
|
+
*
|
|
3606
|
+
* @param width - Final width in pixels
|
|
3607
|
+
* @param height - Final height in pixels
|
|
3608
|
+
*
|
|
3609
|
+
* @example
|
|
3610
|
+
* ```ts
|
|
3611
|
+
* onCommit: (width, height) => {
|
|
3612
|
+
* const pos = getPos()
|
|
3613
|
+
* if (pos !== undefined) {
|
|
3614
|
+
* editor.commands.updateAttributes('image', { width, height })
|
|
3615
|
+
* }
|
|
3616
|
+
* }
|
|
3617
|
+
* ```
|
|
3618
|
+
*/
|
|
3619
|
+
onCommit: (width: number, height: number) => void;
|
|
3620
|
+
/**
|
|
3621
|
+
* Callback for handling node updates.
|
|
3622
|
+
* Return `true` to accept the update, `false` to reject it.
|
|
3623
|
+
*
|
|
3624
|
+
* @example
|
|
3625
|
+
* ```ts
|
|
3626
|
+
* onUpdate: (node, decorations, innerDecorations) => {
|
|
3627
|
+
* if (node.type !== this.node.type) return false
|
|
3628
|
+
* return true
|
|
3629
|
+
* }
|
|
3630
|
+
* ```
|
|
3631
|
+
*/
|
|
3632
|
+
onUpdate: NodeView$1['update'];
|
|
3633
|
+
/**
|
|
3634
|
+
* Optional configuration for resize behavior and styling
|
|
3635
|
+
*/
|
|
3636
|
+
options?: {
|
|
3637
|
+
/**
|
|
3638
|
+
* Which resize handles to display.
|
|
3639
|
+
* @default ['bottom-left', 'bottom-right', 'top-left', 'top-right']
|
|
3640
|
+
*
|
|
3641
|
+
* @example
|
|
3642
|
+
* ```ts
|
|
3643
|
+
* // Only show corner handles
|
|
3644
|
+
* directions: ['top-left', 'top-right', 'bottom-left', 'bottom-right']
|
|
3645
|
+
*
|
|
3646
|
+
* // Only show right edge handle
|
|
3647
|
+
* directions: ['right']
|
|
3648
|
+
* ```
|
|
3649
|
+
*/
|
|
3650
|
+
directions?: ResizableNodeViewDirection[];
|
|
3651
|
+
/**
|
|
3652
|
+
* Minimum dimensions in pixels
|
|
3653
|
+
* @default { width: 8, height: 8 }
|
|
3654
|
+
*
|
|
3655
|
+
* @example
|
|
3656
|
+
* ```ts
|
|
3657
|
+
* min: { width: 100, height: 50 }
|
|
3658
|
+
* ```
|
|
3659
|
+
*/
|
|
3660
|
+
min?: Partial<ResizableNodeDimensions>;
|
|
3661
|
+
/**
|
|
3662
|
+
* Maximum dimensions in pixels
|
|
3663
|
+
* @default undefined (no maximum)
|
|
3664
|
+
*
|
|
3665
|
+
* @example
|
|
3666
|
+
* ```ts
|
|
3667
|
+
* max: { width: 1000, height: 800 }
|
|
3668
|
+
* ```
|
|
3669
|
+
*/
|
|
3670
|
+
max?: Partial<ResizableNodeDimensions>;
|
|
3671
|
+
/**
|
|
3672
|
+
* Always preserve aspect ratio when resizing.
|
|
3673
|
+
* When `false`, aspect ratio is preserved only when Shift key is pressed.
|
|
3674
|
+
* @default false
|
|
3675
|
+
*
|
|
3676
|
+
* @example
|
|
3677
|
+
* ```ts
|
|
3678
|
+
* preserveAspectRatio: true // Always lock aspect ratio
|
|
3679
|
+
* ```
|
|
3680
|
+
*/
|
|
3681
|
+
preserveAspectRatio?: boolean;
|
|
3682
|
+
/**
|
|
3683
|
+
* Custom CSS class names for styling
|
|
3684
|
+
*
|
|
3685
|
+
* @example
|
|
3686
|
+
* ```ts
|
|
3687
|
+
* className: {
|
|
3688
|
+
* container: 'resize-container',
|
|
3689
|
+
* wrapper: 'resize-wrapper',
|
|
3690
|
+
* handle: 'resize-handle',
|
|
3691
|
+
* resizing: 'is-resizing'
|
|
3692
|
+
* }
|
|
3693
|
+
* ```
|
|
3694
|
+
*/
|
|
3695
|
+
className?: {
|
|
3696
|
+
/** Class for the outer container element */
|
|
3697
|
+
container?: string;
|
|
3698
|
+
/** Class for the wrapper element that contains the resizable element */
|
|
3699
|
+
wrapper?: string;
|
|
3700
|
+
/** Class applied to all resize handles */
|
|
3701
|
+
handle?: string;
|
|
3702
|
+
/** Class added to container while actively resizing */
|
|
3703
|
+
resizing?: string;
|
|
3704
|
+
};
|
|
3705
|
+
};
|
|
3706
|
+
};
|
|
3707
|
+
/**
|
|
3708
|
+
* A NodeView implementation that adds resize handles to any DOM element.
|
|
3709
|
+
*
|
|
3710
|
+
* This class creates a resizable node view for Tiptap/ProseMirror editors.
|
|
3711
|
+
* It wraps your element with resize handles and manages the resize interaction,
|
|
3712
|
+
* including aspect ratio preservation, min/max constraints, and keyboard modifiers.
|
|
3713
|
+
*
|
|
3714
|
+
* @example
|
|
3715
|
+
* ```ts
|
|
3716
|
+
* // Basic usage in a Tiptap extension
|
|
3717
|
+
* addNodeView() {
|
|
3718
|
+
* return ({ node, getPos }) => {
|
|
3719
|
+
* const img = document.createElement('img')
|
|
3720
|
+
* img.src = node.attrs.src
|
|
3721
|
+
*
|
|
3722
|
+
* return new ResizableNodeView({
|
|
3723
|
+
* element: img,
|
|
3724
|
+
* node,
|
|
3725
|
+
* getPos,
|
|
3726
|
+
* onResize: (width, height) => {
|
|
3727
|
+
* img.style.width = `${width}px`
|
|
3728
|
+
* img.style.height = `${height}px`
|
|
3729
|
+
* },
|
|
3730
|
+
* onCommit: (width, height) => {
|
|
3731
|
+
* this.editor.commands.updateAttributes('image', { width, height })
|
|
3732
|
+
* },
|
|
3733
|
+
* onUpdate: () => true,
|
|
3734
|
+
* options: {
|
|
3735
|
+
* min: { width: 100, height: 100 },
|
|
3736
|
+
* preserveAspectRatio: true
|
|
3737
|
+
* }
|
|
3738
|
+
* })
|
|
3739
|
+
* }
|
|
3740
|
+
* }
|
|
3741
|
+
* ```
|
|
3742
|
+
*/
|
|
3743
|
+
declare class ResizableNodeView {
|
|
3744
|
+
/** The ProseMirror node instance */
|
|
3745
|
+
node: Node$1;
|
|
3746
|
+
/** The DOM element being made resizable */
|
|
3747
|
+
element: HTMLElement;
|
|
3748
|
+
/** The editable DOM element inside the DOM */
|
|
3749
|
+
contentElement?: HTMLElement;
|
|
3750
|
+
/** The outer container element (returned as NodeView.dom) */
|
|
3751
|
+
container: HTMLElement;
|
|
3752
|
+
/** The wrapper element that contains the element and handles */
|
|
3753
|
+
wrapper: HTMLElement;
|
|
3754
|
+
/** Function to get the current node position */
|
|
3755
|
+
getPos: () => number | undefined;
|
|
3756
|
+
/** Callback fired during resize */
|
|
3757
|
+
onResize?: (width: number, height: number) => void;
|
|
3758
|
+
/** Callback fired when resize completes */
|
|
3759
|
+
onCommit: (width: number, height: number) => void;
|
|
3760
|
+
/** Callback for node updates */
|
|
3761
|
+
onUpdate?: NodeView$1['update'];
|
|
3762
|
+
/** Active resize handle directions */
|
|
3763
|
+
directions: ResizableNodeViewDirection[];
|
|
3764
|
+
/** Minimum allowed dimensions */
|
|
3765
|
+
minSize: ResizableNodeDimensions;
|
|
3766
|
+
/** Maximum allowed dimensions (optional) */
|
|
3767
|
+
maxSize?: Partial<ResizableNodeDimensions>;
|
|
3768
|
+
/** Whether to always preserve aspect ratio */
|
|
3769
|
+
preserveAspectRatio: boolean;
|
|
3770
|
+
/** CSS class names for elements */
|
|
3771
|
+
classNames: {
|
|
3772
|
+
container: string;
|
|
3773
|
+
wrapper: string;
|
|
3774
|
+
handle: string;
|
|
3775
|
+
resizing: string;
|
|
3776
|
+
};
|
|
3777
|
+
/** Initial width of the element (for aspect ratio calculation) */
|
|
3778
|
+
private initialWidth;
|
|
3779
|
+
/** Initial height of the element (for aspect ratio calculation) */
|
|
3780
|
+
private initialHeight;
|
|
3781
|
+
/** Calculated aspect ratio (width / height) */
|
|
3782
|
+
private aspectRatio;
|
|
3783
|
+
/** Whether a resize operation is currently active */
|
|
3784
|
+
private isResizing;
|
|
3785
|
+
/** The handle currently being dragged */
|
|
3786
|
+
private activeHandle;
|
|
3787
|
+
/** Starting mouse X position when resize began */
|
|
3788
|
+
private startX;
|
|
3789
|
+
/** Starting mouse Y position when resize began */
|
|
3790
|
+
private startY;
|
|
3791
|
+
/** Element width when resize began */
|
|
3792
|
+
private startWidth;
|
|
3793
|
+
/** Element height when resize began */
|
|
3794
|
+
private startHeight;
|
|
3795
|
+
/** Whether Shift key is currently pressed (for temporary aspect ratio lock) */
|
|
3796
|
+
private isShiftKeyPressed;
|
|
3797
|
+
/**
|
|
3798
|
+
* Creates a new ResizableNodeView instance.
|
|
3799
|
+
*
|
|
3800
|
+
* The constructor sets up the resize handles, applies initial sizing from
|
|
3801
|
+
* node attributes, and configures all resize behavior options.
|
|
3802
|
+
*
|
|
3803
|
+
* @param options - Configuration options for the resizable node view
|
|
3804
|
+
*/
|
|
3805
|
+
constructor(options: ResizableNodeViewOptions);
|
|
3806
|
+
/**
|
|
3807
|
+
* Returns the top-level DOM node that should be placed in the editor.
|
|
3808
|
+
*
|
|
3809
|
+
* This is required by the ProseMirror NodeView interface. The container
|
|
3810
|
+
* includes the wrapper, handles, and the actual content element.
|
|
3811
|
+
*
|
|
3812
|
+
* @returns The container element to be inserted into the editor
|
|
3813
|
+
*/
|
|
3814
|
+
get dom(): HTMLElement;
|
|
3815
|
+
get contentDOM(): HTMLElement | undefined;
|
|
3816
|
+
/**
|
|
3817
|
+
* Called when the node's content or attributes change.
|
|
3818
|
+
*
|
|
3819
|
+
* Updates the internal node reference. If a custom `onUpdate` callback
|
|
3820
|
+
* was provided, it will be called to handle additional update logic.
|
|
3821
|
+
*
|
|
3822
|
+
* @param node - The new/updated node
|
|
3823
|
+
* @param decorations - Node decorations
|
|
3824
|
+
* @param innerDecorations - Inner decorations
|
|
3825
|
+
* @returns `false` if the node type has changed (requires full rebuild), otherwise the result of `onUpdate` or `true`
|
|
3826
|
+
*/
|
|
3827
|
+
update(node: Node$1, decorations: readonly Decoration[], innerDecorations: DecorationSource): boolean;
|
|
3828
|
+
/**
|
|
3829
|
+
* Cleanup method called when the node view is being removed.
|
|
3830
|
+
*
|
|
3831
|
+
* Removes all event listeners to prevent memory leaks. This is required
|
|
3832
|
+
* by the ProseMirror NodeView interface. If a resize is active when
|
|
3833
|
+
* destroy is called, it will be properly cancelled.
|
|
3834
|
+
*/
|
|
3835
|
+
destroy(): void;
|
|
3836
|
+
/**
|
|
3837
|
+
* Creates the outer container element.
|
|
3838
|
+
*
|
|
3839
|
+
* The container is the top-level element returned by the NodeView and
|
|
3840
|
+
* wraps the entire resizable node. It's set up with flexbox to handle
|
|
3841
|
+
* alignment and includes data attributes for styling and identification.
|
|
3842
|
+
*
|
|
3843
|
+
* @returns The container element
|
|
3844
|
+
*/
|
|
3845
|
+
createContainer(): HTMLDivElement;
|
|
3846
|
+
/**
|
|
3847
|
+
* Creates the wrapper element that contains the content and handles.
|
|
3848
|
+
*
|
|
3849
|
+
* The wrapper uses relative positioning so that resize handles can be
|
|
3850
|
+
* positioned absolutely within it. This is the direct parent of the
|
|
3851
|
+
* content element being made resizable.
|
|
3852
|
+
*
|
|
3853
|
+
* @returns The wrapper element
|
|
3854
|
+
*/
|
|
3855
|
+
createWrapper(): HTMLDivElement;
|
|
3856
|
+
/**
|
|
3857
|
+
* Creates a resize handle element for a specific direction.
|
|
3858
|
+
*
|
|
3859
|
+
* Each handle is absolutely positioned and includes a data attribute
|
|
3860
|
+
* identifying its direction for styling purposes.
|
|
3861
|
+
*
|
|
3862
|
+
* @param direction - The resize direction for this handle
|
|
3863
|
+
* @returns The handle element
|
|
3864
|
+
*/
|
|
3865
|
+
private createHandle;
|
|
3866
|
+
/**
|
|
3867
|
+
* Positions a handle element according to its direction.
|
|
3868
|
+
*
|
|
3869
|
+
* Corner handles (e.g., 'top-left') are positioned at the intersection
|
|
3870
|
+
* of two edges. Edge handles (e.g., 'top') span the full width or height.
|
|
3871
|
+
*
|
|
3872
|
+
* @param handle - The handle element to position
|
|
3873
|
+
* @param direction - The direction determining the position
|
|
3874
|
+
*/
|
|
3875
|
+
private positionHandle;
|
|
3876
|
+
/**
|
|
3877
|
+
* Creates and attaches all resize handles to the wrapper.
|
|
3878
|
+
*
|
|
3879
|
+
* Iterates through the configured directions, creates a handle for each,
|
|
3880
|
+
* positions it, attaches the mousedown listener, and appends it to the DOM.
|
|
3881
|
+
*/
|
|
3882
|
+
private attachHandles;
|
|
3883
|
+
/**
|
|
3884
|
+
* Applies initial sizing from node attributes to the element.
|
|
3885
|
+
*
|
|
3886
|
+
* If width/height attributes exist on the node, they're applied to the element.
|
|
3887
|
+
* Otherwise, the element's natural/current dimensions are measured. The aspect
|
|
3888
|
+
* ratio is calculated for later use in aspect-ratio-preserving resizes.
|
|
3889
|
+
*/
|
|
3890
|
+
private applyInitialSize;
|
|
3891
|
+
/**
|
|
3892
|
+
* Initiates a resize operation when a handle is clicked.
|
|
3893
|
+
*
|
|
3894
|
+
* Captures the starting mouse position and element dimensions, sets up
|
|
3895
|
+
* the resize state, adds the resizing class and state attribute, and
|
|
3896
|
+
* attaches document-level listeners for mouse movement and keyboard input.
|
|
3897
|
+
*
|
|
3898
|
+
* @param event - The mouse down event
|
|
3899
|
+
* @param direction - The direction of the handle being dragged
|
|
3900
|
+
*/
|
|
3901
|
+
private handleResizeStart;
|
|
3902
|
+
/**
|
|
3903
|
+
* Handles mouse movement during an active resize.
|
|
3904
|
+
*
|
|
3905
|
+
* Calculates the delta from the starting position, computes new dimensions
|
|
3906
|
+
* based on the active handle direction, applies constraints and aspect ratio,
|
|
3907
|
+
* then updates the element's style and calls the onResize callback.
|
|
3908
|
+
*
|
|
3909
|
+
* @param event - The mouse move event
|
|
3910
|
+
*/
|
|
3911
|
+
private handleMouseMove;
|
|
3912
|
+
private handleTouchMove;
|
|
3913
|
+
private handleResize;
|
|
3914
|
+
/**
|
|
3915
|
+
* Completes the resize operation when the mouse button is released.
|
|
3916
|
+
*
|
|
3917
|
+
* Captures final dimensions, calls the onCommit callback to persist changes,
|
|
3918
|
+
* removes the resizing state and class, and cleans up document-level listeners.
|
|
3919
|
+
*/
|
|
3920
|
+
private handleMouseUp;
|
|
3921
|
+
/**
|
|
3922
|
+
* Tracks Shift key state to enable temporary aspect ratio locking.
|
|
3923
|
+
*
|
|
3924
|
+
* When Shift is pressed during resize, aspect ratio is preserved even if
|
|
3925
|
+
* preserveAspectRatio is false.
|
|
3926
|
+
*
|
|
3927
|
+
* @param event - The keyboard event
|
|
3928
|
+
*/
|
|
3929
|
+
private handleKeyDown;
|
|
3930
|
+
/**
|
|
3931
|
+
* Tracks Shift key release to disable temporary aspect ratio locking.
|
|
3932
|
+
*
|
|
3933
|
+
* @param event - The keyboard event
|
|
3934
|
+
*/
|
|
3935
|
+
private handleKeyUp;
|
|
3936
|
+
/**
|
|
3937
|
+
* Calculates new dimensions based on mouse delta and resize direction.
|
|
3938
|
+
*
|
|
3939
|
+
* Takes the starting dimensions and applies the mouse movement delta
|
|
3940
|
+
* according to the handle direction. For corner handles, both dimensions
|
|
3941
|
+
* are affected. For edge handles, only one dimension changes. If aspect
|
|
3942
|
+
* ratio should be preserved, delegates to applyAspectRatio.
|
|
3943
|
+
*
|
|
3944
|
+
* @param direction - The active resize handle direction
|
|
3945
|
+
* @param deltaX - Horizontal mouse movement since resize start
|
|
3946
|
+
* @param deltaY - Vertical mouse movement since resize start
|
|
3947
|
+
* @returns The calculated width and height
|
|
3948
|
+
*/
|
|
3949
|
+
private calculateNewDimensions;
|
|
3950
|
+
/**
|
|
3951
|
+
* Applies min/max constraints to dimensions.
|
|
3952
|
+
*
|
|
3953
|
+
* When aspect ratio is NOT preserved, constraints are applied independently
|
|
3954
|
+
* to width and height. When aspect ratio IS preserved, constraints are
|
|
3955
|
+
* applied while maintaining the aspect ratio—if one dimension hits a limit,
|
|
3956
|
+
* the other is recalculated proportionally.
|
|
3957
|
+
*
|
|
3958
|
+
* This ensures that aspect ratio is never broken when constrained.
|
|
3959
|
+
*
|
|
3960
|
+
* @param width - The unconstrained width
|
|
3961
|
+
* @param height - The unconstrained height
|
|
3962
|
+
* @param preserveAspectRatio - Whether to maintain aspect ratio while constraining
|
|
3963
|
+
* @returns The constrained dimensions
|
|
3964
|
+
*/
|
|
3965
|
+
private applyConstraints;
|
|
3966
|
+
/**
|
|
3967
|
+
* Adjusts dimensions to maintain the original aspect ratio.
|
|
3968
|
+
*
|
|
3969
|
+
* For horizontal handles (left/right), uses width as the primary dimension
|
|
3970
|
+
* and calculates height from it. For vertical handles (top/bottom), uses
|
|
3971
|
+
* height as primary and calculates width. For corner handles, uses width
|
|
3972
|
+
* as the primary dimension.
|
|
3973
|
+
*
|
|
3974
|
+
* @param width - The new width
|
|
3975
|
+
* @param height - The new height
|
|
3976
|
+
* @param direction - The active resize direction
|
|
3977
|
+
* @returns Dimensions adjusted to preserve aspect ratio
|
|
3978
|
+
*/
|
|
3979
|
+
private applyAspectRatio;
|
|
3980
|
+
}
|
|
3981
|
+
/**
|
|
3982
|
+
* Alias for ResizableNodeView to maintain consistent naming.
|
|
3983
|
+
* @deprecated Use ResizableNodeView instead - will be removed in future versions.
|
|
3984
|
+
*/
|
|
3985
|
+
declare const ResizableNodeview: typeof ResizableNodeView;
|
|
3986
|
+
|
|
3527
3987
|
declare function updateMarkViewAttributes(checkMark: Mark$1, editor: Editor, attrs?: Record<string, any>): void;
|
|
3528
3988
|
declare class MarkView<Component, Options extends MarkViewRendererOptions = MarkViewRendererOptions> {
|
|
3529
3989
|
component: Component;
|
|
@@ -4072,4 +4532,4 @@ interface Commands<ReturnType = any> {
|
|
|
4072
4532
|
interface Storage {
|
|
4073
4533
|
}
|
|
4074
4534
|
|
|
4075
|
-
export { type AnyCommands, type AnyConfig, type AnyExtension, type AtomBlockMarkdownSpecOptions, type Attribute, type Attributes$1 as Attributes, type BlockMarkdownSpecOptions, type BlockParserConfig, type CanCommands, type ChainedCommands, type ChangedRange, type Command, CommandManager, type CommandProps, type CommandSpec, type Commands, type Content, type CreateNodeFromContentOptions, type DOMNode, type DOMOutputSpecArray$1 as DOMOutputSpecArray, type DecorationType, type DecorationWithType, type Diff, type Dispatch, type DocumentType, Editor, type EditorEvents, type EditorOptions, type EnableRules, Extendable, type ExtendableConfig, type ExtendedRegExpMatchArray, Extension, type ExtensionAttribute, type ExtensionConfig, type Extensions, type FocusPosition, Fragment, type FullMarkdownHelpers, type GlobalAttributes, type HTMLContent, type InlineMarkdownSpecOptions, InputRule, type InputRuleFinder, type InputRuleMatch, type InsertContentAtOptions, type InsertContentOptions, type JSONContent, type KeyboardShortcutCommand, type KeysWithTypeOf, Mark, type MarkConfig, type MarkRange, type MarkType, MarkView, type MarkViewProps, type MarkViewRenderer, type MarkViewRendererOptions, type MarkViewRendererProps, type MarkdownExtensionSpec, type MarkdownHelpers, type MarkdownLexerConfiguration, type MarkdownParseHelpers, type MarkdownParseResult, type MarkdownRendererHelpers, type MarkdownToken, type MarkdownTokenizer, type MaybeReturnType, type MaybeThisParameterType, Node, type NodeConfig, NodePos, type NodeRange, type NodeType, NodeView, type NodeViewProps, type NodeViewRenderer, type NodeViewRendererOptions, type NodeViewRendererProps, type NodeWithPos, type Overwrite, type ParentConfig, type ParsedBlock, PasteRule, type PasteRuleFinder, type PasteRuleMatch, type PickValue, type Predicate, type Primitive, type Range, type RawCommands, type RemoveThis, type RenderContext, type SetContentOptions, type SingleCommands, type Storage, type TextSerializer, type TextType, type TiptapEditorHTMLElement, Tracker, type TrackerResult, type UnionCommands, type UnionToIntersection, type ValuesOf, blur, callOrReturn, canInsertNode, clearContent, clearNodes, combineTransactionSteps, command, index$2 as commands, createAtomBlockMarkdownSpec, createBlockMarkdownSpec, createChainableState, createDocument, h as createElement, createInlineMarkdownSpec, createNodeFromContent, createParagraphNear, createStyleTag, cut, defaultBlockAt, deleteCurrentNode, deleteNode, deleteProps, deleteRange, deleteSelection, elementFromString, enter, escapeForRegEx, exitCode, extendMarkRange, index$1 as extensions, findChildren, findChildrenInRange, findDuplicates, findParentNode, findParentNodeClosestToPos, first, flattenExtensions, focus, forEach, fromString, generateHTML, generateJSON, generateText, getAttributes, getAttributesFromExtensions, getChangedRanges, getDebugJSON, getExtensionField, getHTMLFromFragment, getMarkAttributes, getMarkRange, getMarkType, getMarksBetween, getNodeAtPosition, getNodeAttributes, getNodeType, getRenderedAttributes, getSchema, getSchemaByResolvedExtensions, getSchemaTypeByName, getSchemaTypeNameByName, getSplittedAttributes, getText, getTextBetween, getTextContentFromNodes, getTextSerializersFromSchema, h, injectExtensionAttributesToParseRule, inputRulesPlugin, insertContent, insertContentAt, isActive, isAndroid, isAtEndOfNode, isAtStartOfNode, isEmptyObject, isExtensionRulesEnabled, isFunction, isList, isMacOS, isMarkActive, isNodeActive, isNodeEmpty, isNodeSelection, isNumber, isPlainObject, isRegExp, isString, isTextSelection, isiOS, joinBackward, joinDown, joinForward, joinItemBackward, joinItemForward, joinTextblockBackward, joinTextblockForward, joinUp, keyboardShortcut, lift, liftEmptyBlock, liftListItem, markInputRule, markPasteRule, index as markdown, mergeAttributes, mergeDeep, minMax, newlineInCode, nodeInputRule, nodePasteRule, objectIncludes, parseAttributes, parseIndentedBlocks, pasteRulesPlugin, posToDOMRect, removeDuplicates, renderNestedMarkdownContent, resetAttributes, resolveExtensions, resolveFocusPosition, rewriteUnknownContent, scrollIntoView, selectAll, selectNodeBackward, selectNodeForward, selectParentNode, selectTextblockEnd, selectTextblockStart, selectionToInsertionEnd, serializeAttributes, setContent, setMark, setMeta, setNode, setNodeSelection, setTextSelection, sinkListItem, sortExtensions, splitBlock, splitExtensions, splitListItem, textInputRule, textPasteRule, textblockTypeInputRule, toggleList, toggleMark, toggleNode, toggleWrap, undoInputRule, unsetAllMarks, unsetMark, updateAttributes, updateMarkViewAttributes, wrapIn, wrapInList, wrappingInputRule };
|
|
4535
|
+
export { type AnyCommands, type AnyConfig, type AnyExtension, type AtomBlockMarkdownSpecOptions, type Attribute, type Attributes$1 as Attributes, type BlockMarkdownSpecOptions, type BlockParserConfig, type CanCommands, type ChainedCommands, type ChangedRange, type Command, CommandManager, type CommandProps, type CommandSpec, type Commands, type Content, type CreateNodeFromContentOptions, type DOMNode, type DOMOutputSpecArray$1 as DOMOutputSpecArray, type DecorationType, type DecorationWithType, type Diff, type Dispatch, type DocumentType, Editor, type EditorEvents, type EditorOptions, type EnableRules, Extendable, type ExtendableConfig, type ExtendedRegExpMatchArray, Extension, type ExtensionAttribute, type ExtensionConfig, type Extensions, type FocusPosition, Fragment, type FullMarkdownHelpers, type GlobalAttributes, type HTMLContent, type InlineMarkdownSpecOptions, InputRule, type InputRuleFinder, type InputRuleMatch, type InsertContentAtOptions, type InsertContentOptions, type JSONContent, type KeyboardShortcutCommand, type KeysWithTypeOf, Mark, type MarkConfig, type MarkRange, type MarkType, MarkView, type MarkViewProps, type MarkViewRenderer, type MarkViewRendererOptions, type MarkViewRendererProps, type MarkdownExtensionSpec, type MarkdownHelpers, type MarkdownLexerConfiguration, type MarkdownParseHelpers, type MarkdownParseResult, type MarkdownRendererHelpers, type MarkdownToken, type MarkdownTokenizer, type MaybeReturnType, type MaybeThisParameterType, Node, type NodeConfig, NodePos, type NodeRange, type NodeType, NodeView, type NodeViewProps, type NodeViewRenderer, type NodeViewRendererOptions, type NodeViewRendererProps, type NodeWithPos, type Overwrite, type ParentConfig, type ParsedBlock, PasteRule, type PasteRuleFinder, type PasteRuleMatch, type PickValue, type Predicate, type Primitive, type Range, type RawCommands, type RemoveThis, type RenderContext, type ResizableNodeDimensions, ResizableNodeView, type ResizableNodeViewDirection, type ResizableNodeViewOptions, ResizableNodeview, type SetContentOptions, type SingleCommands, type Storage, type TextSerializer, type TextType, type TiptapEditorHTMLElement, Tracker, type TrackerResult, type UnionCommands, type UnionToIntersection, type ValuesOf, blur, callOrReturn, canInsertNode, clearContent, clearNodes, combineTransactionSteps, command, index$2 as commands, createAtomBlockMarkdownSpec, createBlockMarkdownSpec, createChainableState, createDocument, h as createElement, createInlineMarkdownSpec, createNodeFromContent, createParagraphNear, createStyleTag, cut, defaultBlockAt, deleteCurrentNode, deleteNode, deleteProps, deleteRange, deleteSelection, elementFromString, enter, escapeForRegEx, exitCode, extendMarkRange, index$1 as extensions, findChildren, findChildrenInRange, findDuplicates, findParentNode, findParentNodeClosestToPos, first, flattenExtensions, focus, forEach, fromString, generateHTML, generateJSON, generateText, getAttributes, getAttributesFromExtensions, getChangedRanges, getDebugJSON, getExtensionField, getHTMLFromFragment, getMarkAttributes, getMarkRange, getMarkType, getMarksBetween, getNodeAtPosition, getNodeAttributes, getNodeType, getRenderedAttributes, getSchema, getSchemaByResolvedExtensions, getSchemaTypeByName, getSchemaTypeNameByName, getSplittedAttributes, getText, getTextBetween, getTextContentFromNodes, getTextSerializersFromSchema, h, injectExtensionAttributesToParseRule, inputRulesPlugin, insertContent, insertContentAt, isActive, isAndroid, isAtEndOfNode, isAtStartOfNode, isEmptyObject, isExtensionRulesEnabled, isFunction, isList, isMacOS, isMarkActive, isNodeActive, isNodeEmpty, isNodeSelection, isNumber, isPlainObject, isRegExp, isString, isTextSelection, isiOS, joinBackward, joinDown, joinForward, joinItemBackward, joinItemForward, joinTextblockBackward, joinTextblockForward, joinUp, keyboardShortcut, lift, liftEmptyBlock, liftListItem, markInputRule, markPasteRule, index as markdown, mergeAttributes, mergeDeep, minMax, newlineInCode, nodeInputRule, nodePasteRule, objectIncludes, parseAttributes, parseIndentedBlocks, pasteRulesPlugin, posToDOMRect, removeDuplicates, renderNestedMarkdownContent, resetAttributes, resolveExtensions, resolveFocusPosition, rewriteUnknownContent, scrollIntoView, selectAll, selectNodeBackward, selectNodeForward, selectParentNode, selectTextblockEnd, selectTextblockStart, selectionToInsertionEnd, serializeAttributes, setContent, setMark, setMeta, setNode, setNodeSelection, setTextSelection, sinkListItem, sortExtensions, splitBlock, splitExtensions, splitListItem, textInputRule, textPasteRule, textblockTypeInputRule, toggleList, toggleMark, toggleNode, toggleWrap, undoInputRule, unsetAllMarks, unsetMark, updateAttributes, updateMarkViewAttributes, wrapIn, wrapInList, wrappingInputRule };
|