diff --git a/modules/ve-mw/ui/pages/ve.ui.MWParameterPage.js b/modules/ve-mw/ui/pages/ve.ui.MWParameterPage.js index 45be12a85f..3f35418491 100644 --- a/modules/ve-mw/ui/pages/ve.ui.MWParameterPage.js +++ b/modules/ve-mw/ui/pages/ve.ui.MWParameterPage.js @@ -29,6 +29,7 @@ ve.ui.MWParameterPage = function VeUiMWParameterPage( parameter, name, config ) this.$label = this.$( '
' ); this.$field = this.$( '
' ); this.$actions = this.$( '
' ); + this.$indicators = this.$( '
' ); this.$info = this.$( '
' ); this.$description = this.$( '
' ); this.$more = this.$( '
' ); @@ -56,6 +57,7 @@ ve.ui.MWParameterPage = function VeUiMWParameterPage( parameter, name, config ) 'tabIndex': -1 } ) .connect( this, { 'click': 'onAddButtonClick' } ); + this.requiredIndicator = new OO.ui.IndicatorWidget( { '$': this.$ } ); // TODO: Use spec.deprecation // TODO: Use spec.type @@ -71,6 +73,9 @@ ve.ui.MWParameterPage = function VeUiMWParameterPage( parameter, name, config ) this.$actions .addClass( 've-ui-mwParameterPage-actions' ) .append( this.removeButton.$element ); + this.$indicators + .addClass( 've-ui-mwParameterPage-indicators' ) + .append( this.requiredIndicator.$element ); this.$description .addClass( 've-ui-mwParameterPage-description' ) .text( this.spec.getParameterDescription( paramName ) || '' ); @@ -79,13 +84,21 @@ ve.ui.MWParameterPage = function VeUiMWParameterPage( parameter, name, config ) .append( this.$description ); this.$field .addClass( 've-ui-mwParameterPage-field' ) - .append( this.valueInput.$element, this.$actions, this.$info ); + .append( this.valueInput.$element, this.$indicators, this.$actions, this.$info ); this.$more .addClass( 've-ui-mwParameterPage-more' ) .append( this.addButton.$element ); this.$element .addClass( 've-ui-mwParameterPage' ) .append( this.$label, this.$field, this.$more ); + + if ( this.parameter.isRequired() ) { + this.requiredIndicator + .setIndicator( 'required' ) + .setIndicatorTitle( + ve.msg( 'visualeditor-dialog-transclusion-required-parameter' ) + ); + } }; /* Inheritance */ diff --git a/modules/ve-mw/ui/styles/ve.ui.MWPage.css b/modules/ve-mw/ui/styles/ve.ui.MWPage.css index ab8b15edff..3cee53fa40 100644 --- a/modules/ve-mw/ui/styles/ve.ui.MWPage.css +++ b/modules/ve-mw/ui/styles/ve.ui.MWPage.css @@ -24,6 +24,7 @@ .ve-ui-mwParameterPage-field, .ve-ui-mwParameterPage-info, .ve-ui-mwParameterPage-actions, +.ve-ui-mwParameterPage-indicators, .ve-ui-mwParameterPage .oo-ui-textInputWidget { display: inline-block; vertical-align: top; @@ -46,20 +47,24 @@ } .ve-ui-mwParameterPage .oo-ui-textInputWidget { - width: 90%; + width: 86%; } .ve-ui-mwParameterPage .oo-ui-textInputWidget textarea { height: 2.5em; } +.ve-ui-mwParameterPage-indicators, .ve-ui-mwParameterPage-actions { - display: none; - width: 10%; + width: 7%; padding: 0.33em 0; text-align: right; } +.ve-ui-mwParameterPage-actions { + display: none; +} + .ve-ui-mwParameterPage.oo-ui-pageLayout-active .ve-ui-mwParameterPage-actions { display: inline-block; }