Skip to content

Conversation

partg952
Copy link

@partg952 partg952 commented Sep 26, 2025

This is issue number #3215
Make new document with double clicking on empty tab space

Allowing user to create a new file by double clicking on the empty tab space

Recording.2025-09-26.202723.1.mp4

Closes #3215

@TrueDoctor
Copy link
Member

Is the issue you have linked correct?

@partg952
Copy link
Author

Is the issue you have linked correct?

i have fixed it now ,sorry


<LayoutCol on:pointerdown={() => panelType && editor.handle.setActivePanel(panelType)} class={`panel ${className}`.trim()} {classes} style={styleName} {styles}>
<LayoutRow class="tab-bar" classes={{ "min-widths": tabMinWidths }}>
<LayoutRow class="tab-bar" classes={{ "min-widths": tabMinWidths }} on:dblclick={() => editor.handle.newDocumentDialog()}>
Copy link
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

If you add the click handler to a new element that fills the portion of the bar not occupied by tabs, you won’t need to stop event propagation. I think it feels a little cleaner.

Copy link
Author

@partg952 partg952 Sep 27, 2025

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

can you explain a little more?

Copy link

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

I think its about making 2 new LayoutCol. Left one should have contain existing document tab and the right one could have on:dblclick=()

Copy link
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

can you explain a little more?

I mean add a extra child to the tab bar at the end that takes all remaining space.
That child would have the dblclick listener.

Take a look at how I did it in a similar case

<LayoutRow on:mousedown={() => editor.handle.appWindowDrag()} on:dblclick={() => editor.handle.appWindowMaximize()} />

Copy link
Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

oh okay lemme do it like that

@partg952
Copy link
Author

partg952 commented Sep 30, 2025

@timon-schelling can you please take a look at it?

let document = snap_data.document;
let next_handle_start = self.next_handle_start;
let handle_start = self.latest_point()?.handle_start;

Copy link
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Please don't include formatting changes etc. completely outside of the PR scope.
You probably included this by accident, would be helpful if you could double check what you are committing in the future.
No worries, just a heads-up.

{/if}
</LayoutRow>
{/each}
{#if panelType == 'Document'}
Copy link
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Panel is a component used in different contexts... You could instead create a prop for dblclickEmptySpaceAction (I'm tired, could not think of a better name) and use that prop here

clickAction={(tabIndex) => editor.handle.selectDocument($portfolio.documents[tabIndex].id)}
like it is done for clickAction

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

Successfully merging this pull request may close these issues.

Make new document with doubleclicking on empty tab space
4 participants