Create a base Dialog component
Closed, ResolvedPublic
Actions

Assigned To

Authored By

	SimoneThisDot
	Feb 9 2022, 10:14 AM

Description

As an user, I would like a dialogue component to be available within the Base components library so that I can use it while developing new screens

The component should:

The Dialog should use the new "teleport" feature available in Vue 3
The dialog should be made in a way to ensure keyboard and mouse does NOT affect the background (so scrolling should not scroll the page)
The Dialog should allow the user to define if the dialog should close or NOT if clicked outside
The dialog should have the following props/emit title, description, @success, @decline

	Subject	Repo	Branch	Lines +/-
	Add dialog component and use a dialog when abandoning function edits	mediawiki/extensions/WikiLambda	master	+292 -7

		Status	Subtype	Assigned	Task
		Declined		• JKieserman	T301329 Show a dialog when user clicks "cancel" while editing a function
		Resolved		• JKieserman	T301325 Create a base Dialog component

• JKieserman changed the task status from Open to In Progress.Feb 10 2022, 3:59 PM

• JKieserman claimed this task.

Change 762516 had a related patch set uploaded (by Jkieserman; author: Jkieserman):

[mediawiki/extensions/WikiLambda@master] Add dialog component and use a dialog when abandoning function edits

Change 762516 had a related patch set uploaded (by Jkieserman; author: Jkieserman):

[mediawiki/extensions/WikiLambda@master] Add dialog component and use a dialog when abandoning function edits

Change 762516 merged by jenkins-bot:

[mediawiki/extensions/WikiLambda@master] Add dialog component and use a dialog when abandoning function edits

Design review notes

White overlay is missing.
Buttons look weird? They're not matching the spec.
Font type in dialog isn't matching the spec.
Dialog in the design file has been updated to not have an 'X' in the top right corner (this matches codex)
Dialog should be centered in the white overlay

Dialog should be triggered if the user edits anything in the object and then clicks anything that would navigate them away from edit mode such as 1) anywhere in the left sidebar 2) clicks 'Read' tab 3) clicks 'View history' tab 3) anywhere in the top right bar (e.g. Talk, Contributions, etc..) 4) If I search a term in the search box and click away from the page