wikimedia/mediawiki-extensions-VisualEditor
1
0
Fork 0
mirror of https://gerrit.wikimedia.org/r/mediawiki/extensions/VisualEditor synced 2024-09-24 10:48:42 +00:00
Code Issues Packages Projects Releases Wiki Activity

Make template parameter checkbox widget an OptionWidget

Browse source 
The plan is to change the outer …TemplateWidget (which contains
a list of template parameter checkboxes) into a SelectWidget.
But this requires the elements in the list to be a subclass of
OptionWidget.

Note this change does not have any effect, as of this patch. But
this makes the following patches smaller and easier to follow.

Additionally:
* The OptionWidget class is already a LabelElement. No need to
  initialize this twice. This happens via the parent constructor
  now.
* Remove CSS that is not needed any more after Idc5e048. This is
  not a FieldLayout any more.
* Update some related code documentation.

Bug: T285323
Change-Id: I92e8fd2bbece9e6c55083cdfe6ed7ad16a64d688
This commit is contained in:
Thiemo Kreuz 2021-08-16 16:06:39 +02:00 committed by Adam Wight
parent dec1742eb7
commit 220c98ab44
3 changed files with 16 additions and 27 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

1
.stylelintrc.json
View file

@ -1,6 +1,7 @@
{
"extends": "stylelint-config-wikimedia/grade-a",
"rules": {
"no-descending-specificity": null,
"selector-class-pattern": "^(ve|mw|oo-ui|client|skin)-"
}
}

25
modules/ve-mw/ui/styles/dialogs/ve.ui.MWTransclusionDialog.css
View file

@ -125,35 +125,15 @@
display: inline-block;
}
.ve-ui-mwTransclusionOutlineItem.oo-ui-fieldLayout.oo-ui-fieldLayout-align-inline > .oo-ui-fieldLayout-body {
display: flex;
}
.ve-ui-mwTransclusionOutlineItem.oo-ui-fieldLayout.oo-ui-fieldLayout-align-inline > .oo-ui-fieldLayout-body > .oo-ui-fieldLayout-field {
width: 20px;
}
.ve-ui-mwTransclusionOutlineItem.oo-ui-fieldLayout.oo-ui-fieldLayout-align-inline > .oo-ui-fieldLayout-body > .oo-ui-fieldLayout-header {
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap;
padding-left: 6px;
padding-right: 12px;
}
.ve-ui-mwTransclusionOutlineItem {
padding-bottom: 8px;
padding-left: 24px;
padding-top: 8px;
}
.ve-ui-mwTransclusionOutlineItem.oo-ui-fieldLayout.oo-ui-fieldLayout-align-inline {
margin-top: 0;
}
.ve-ui-mwTransclusionOutlineItem,
.ve-ui-mwTransclusionOutlineItem label {
.ve-ui-mwTransclusionOutlineItem.oo-ui-labelElement > .oo-ui-labelElement-label {
cursor: pointer;
display: inline;
}
.ve-ui-mwTransclusionOutlineItem:hover {
@ -161,6 +141,7 @@
}
.ve-ui-mwTransclusionOutlineItem .oo-ui-checkboxInputWidget.oo-ui-widget-enabled [ type='checkbox' ]:hover + span {
/* Stronger :hover effect to make the different checkbox/label click regions more obvious */
border-width: 2px;
}

17
modules/ve-mw/ui/widgets/ve.ui.MWTemplateOutlineParameterCheckboxLayout.js
View file

@ -8,7 +8,7 @@
* Container for checkbox and label
*
* @class
* @extends OO.ui.Widget
* @extends OO.ui.OptionWidget
*
* @constructor
* @param {Object} config
@ -28,10 +28,11 @@ ve.ui.MWTemplateOutlineParameterCheckboxLayout = function VeUiMWTemplateOutlineP
this.checkbox.$input.on( 'keydown', this.onKeyDown.bind( this ) );
// Parent constructor
ve.ui.MWTemplateOutlineParameterCheckboxLayout.super.call( this, config );
ve.ui.MWTemplateOutlineParameterCheckboxLayout.super.call( this, ve.extendObject( config, {
$label: $( '<label>' )
} ) );
// Mixin constructors
OO.ui.mixin.LabelElement.call( this, $.extend( { $label: $( '<label>' ) }, config ) );
OO.ui.mixin.TabIndexedElement.call( this, ve.extendObject( config, {
tabIndex: this.checkbox.isDisabled() ? 0 : -1
} ) );
@ -46,8 +47,7 @@ ve.ui.MWTemplateOutlineParameterCheckboxLayout = function VeUiMWTemplateOutlineP
/* Inheritance */
OO.inheritClass( ve.ui.MWTemplateOutlineParameterCheckboxLayout, OO.ui.Widget );
OO.mixinClass( ve.ui.MWTemplateOutlineParameterCheckboxLayout, OO.ui.mixin.LabelElement );
OO.inheritClass( ve.ui.MWTemplateOutlineParameterCheckboxLayout, OO.ui.OptionWidget );
OO.mixinClass( ve.ui.MWTemplateOutlineParameterCheckboxLayout, OO.ui.mixin.TabIndexedElement );
/* Events */
@ -66,12 +66,17 @@ OO.mixinClass( ve.ui.MWTemplateOutlineParameterCheckboxLayout, OO.ui.mixin.TabIn
/* Methods */
/**
* @private
* @fires select
*/
ve.ui.MWTemplateOutlineParameterCheckboxLayout.prototype.onClick = function () {
this.setSelected( true );
};
/**
* @private
* @fires select
*/
ve.ui.MWTemplateOutlineParameterCheckboxLayout.prototype.onKeyDown = function ( e ) {
if ( e.keyCode === OO.ui.Keys.SPACE ) {
// FIXME: Focus should stay in the sidebar
@ -84,6 +89,7 @@ ve.ui.MWTemplateOutlineParameterCheckboxLayout.prototype.onKeyDown = function (
/**
* Handles a checkbox input widget change event {@see OO.ui.CheckboxInputWidget}.
*
* @private
* @param {boolean} value
* @fires change
*/
@ -94,6 +100,7 @@ ve.ui.MWTemplateOutlineParameterCheckboxLayout.prototype.onCheckboxChange = func
/**
* @param {boolean} state Selected state
* @param {boolean} internal Used for internal calls to suppress events
* @fires select
*/
ve.ui.MWTemplateOutlineParameterCheckboxLayout.prototype.setSelected = function ( state, internal ) {
if ( !this.checkbox.isDisabled() ) {