/*!
- * OOUI v0.29.6
+ * OOUI v0.30.3
* https://www.mediawiki.org/wiki/OOUI
*
- * Copyright 2011–2018 OOUI Team and other contributors.
+ * Copyright 2011–2019 OOUI Team and other contributors.
* Released under the MIT license
* http://oojs.mit-license.org
*
- * Date: 2018-12-05T00:15:55Z
+ * Date: 2019-02-21T10:57:07Z
*/
( function ( OO ) {
* ],
* continuous: true
* } );
- * $( 'body' ).append( myStack.$element );
+ * $( document.body ).append( myStack.$element );
*
* @class
* @extends OO.ui.PanelLayout
*/
OO.ui.StackLayout = function OoUiStackLayout( config ) {
// Configuration initialization
- config = $.extend( { scrollable: true }, config );
+ // Make the layout scrollable in continuous mode, otherwise each
+ // panel is responsible for its own scrolling.
+ config = $.extend( { scrollable: !!( config && config.continuous ) }, config );
// Parent constructor
OO.ui.StackLayout.parent.call( this, config );
* menuLayout.$content.append(
* contentPanel.$element.append( '<b>Content panel</b>', '<p>Note that the menu is positioned relative to the content panel: top, bottom, after, before.</p>')
* );
- * $( 'body' ).append( menuLayout.$element );
+ * $( document.body ).append( menuLayout.$element );
*
* If menu size needs to be overridden, it can be accomplished using CSS similar to the snippet
* below. MenuLayout's CSS will override the appropriate values with 'auto' or '0' to display the
* } );
*
* booklet.addPages( [ page1, page2 ] );
- * $( 'body' ).append( booklet.$element );
+ * $( document.body ).append( booklet.$element );
*
* @class
* @extends OO.ui.MenuLayout
* var index = new OO.ui.IndexLayout();
*
* index.addTabPanels( [ tabPanel1, tabPanel2 ] );
- * $( 'body' ).append( index.$element );
+ * $( document.body ).append( index.$element );
*
* @class
* @extends OO.ui.MenuLayout
* @abstract
* @class
* @extends OO.ui.Widget
+ * @mixins OO.ui.mixin.TitledElement
*
* @constructor
* @param {Object} [config] Configuration options
// Parent constructor
OO.ui.ToggleWidget.parent.call( this, config );
+ // Mixin constructor
+ OO.ui.mixin.TitledElement.call( this, config );
+
// Properties
this.value = null;
/* Setup */
OO.inheritClass( OO.ui.ToggleWidget, OO.ui.Widget );
+OO.mixinClass( OO.ui.ToggleWidget, OO.ui.mixin.TitledElement );
/* Events */
* @example
* // Toggle buttons in the 'off' and 'on' state.
* var toggleButton1 = new OO.ui.ToggleButtonWidget( {
- * label: 'Toggle Button off'
- * } );
- * var toggleButton2 = new OO.ui.ToggleButtonWidget( {
- * label: 'Toggle Button on',
- * value: true
- * } );
+ * label: 'Toggle Button off'
+ * } ),
+ * toggleButton2 = new OO.ui.ToggleButtonWidget( {
+ * label: 'Toggle Button on',
+ * value: true
+ * } );
* // Append the buttons to the DOM.
- * $( 'body' ).append( toggleButton1.$element, toggleButton2.$element );
+ * $( document.body ).append( toggleButton1.$element, toggleButton2.$element );
*
* [1]: https://www.mediawiki.org/wiki/OOUI/Widgets/Buttons_and_Switches#Toggle_buttons
*
* @mixins OO.ui.mixin.IconElement
* @mixins OO.ui.mixin.IndicatorElement
* @mixins OO.ui.mixin.LabelElement
- * @mixins OO.ui.mixin.TitledElement
* @mixins OO.ui.mixin.FlaggedElement
* @mixins OO.ui.mixin.TabIndexedElement
*
OO.ui.mixin.IconElement.call( this, config );
OO.ui.mixin.IndicatorElement.call( this, config );
OO.ui.mixin.LabelElement.call( this, config );
- OO.ui.mixin.TitledElement.call( this, $.extend( {}, config, { $titled: this.$button } ) );
OO.ui.mixin.FlaggedElement.call( this, config );
OO.ui.mixin.TabIndexedElement.call( this, $.extend( {}, config, { $tabIndexed: this.$button } ) );
this.$element
.addClass( 'oo-ui-toggleButtonWidget' )
.append( this.$button );
+ this.setTitledElement( this.$button );
};
/* Setup */
OO.mixinClass( OO.ui.ToggleButtonWidget, OO.ui.mixin.IconElement );
OO.mixinClass( OO.ui.ToggleButtonWidget, OO.ui.mixin.IndicatorElement );
OO.mixinClass( OO.ui.ToggleButtonWidget, OO.ui.mixin.LabelElement );
-OO.mixinClass( OO.ui.ToggleButtonWidget, OO.ui.mixin.TitledElement );
OO.mixinClass( OO.ui.ToggleButtonWidget, OO.ui.mixin.FlaggedElement );
OO.mixinClass( OO.ui.ToggleButtonWidget, OO.ui.mixin.TabIndexedElement );
*
* @example
* // Toggle switches in the 'off' and 'on' position.
- * var toggleSwitch1 = new OO.ui.ToggleSwitchWidget();
- * var toggleSwitch2 = new OO.ui.ToggleSwitchWidget( {
- * value: true
- * } );
- *
- * // Create a FieldsetLayout to layout and label switches
- * var fieldset = new OO.ui.FieldsetLayout( {
- * label: 'Toggle switches'
- * } );
+ * var toggleSwitch1 = new OO.ui.ToggleSwitchWidget(),
+ * toggleSwitch2 = new OO.ui.ToggleSwitchWidget( {
+ * value: true
+ * } );
+ * // Create a FieldsetLayout to layout and label switches.
+ * fieldset = new OO.ui.FieldsetLayout( {
+ * label: 'Toggle switches'
+ * } );
* fieldset.addItems( [
- * new OO.ui.FieldLayout( toggleSwitch1, { label: 'Off', align: 'top' } ),
- * new OO.ui.FieldLayout( toggleSwitch2, { label: 'On', align: 'top' } )
+ * new OO.ui.FieldLayout( toggleSwitch1, {
+ * label: 'Off',
+ * align: 'top'
+ * } ),
+ * new OO.ui.FieldLayout( toggleSwitch2, {
+ * label: 'On',
+ * align: 'top'
+ * } )
* ] );
- * $( 'body' ).append( fieldset.$element );
+ * $( document.body ).append( fieldset.$element );
*
* @class
* @extends OO.ui.ToggleWidget
* @mixins OO.ui.mixin.ButtonElement
* @mixins OO.ui.mixin.IconElement
* @mixins OO.ui.mixin.IndicatorElement
- * @mixins OO.ui.mixin.TitledElement
*
* @constructor
* @param {Object} [config] Configuration options
OO.ui.mixin.ButtonElement.call( this, config );
OO.ui.mixin.IconElement.call( this, config );
OO.ui.mixin.IndicatorElement.call( this, config );
- OO.ui.mixin.TitledElement.call( this, $.extend( {}, config, { $titled: this.$button } ) );
// Initialization
this.$element.addClass( 'oo-ui-buttonOptionWidget' );
this.$button.append( this.$icon, this.$label, this.$indicator );
this.$element.append( this.$button );
+ this.setTitledElement( this.$button );
};
/* Setup */
OO.mixinClass( OO.ui.ButtonOptionWidget, OO.ui.mixin.ButtonElement );
OO.mixinClass( OO.ui.ButtonOptionWidget, OO.ui.mixin.IconElement );
OO.mixinClass( OO.ui.ButtonOptionWidget, OO.ui.mixin.IndicatorElement );
-OO.mixinClass( OO.ui.ButtonOptionWidget, OO.ui.mixin.TitledElement );
/* Static Properties */
* the [OOUI documentation on MediaWiki] [1] for more information.
*
* @example
- * // Example: A ButtonSelectWidget that contains three ButtonOptionWidgets
+ * // A ButtonSelectWidget that contains three ButtonOptionWidgets.
* var option1 = new OO.ui.ButtonOptionWidget( {
- * data: 1,
- * label: 'Option 1',
- * title: 'Button option 1'
- * } );
- *
- * var option2 = new OO.ui.ButtonOptionWidget( {
- * data: 2,
- * label: 'Option 2',
- * title: 'Button option 2'
- * } );
- *
- * var option3 = new OO.ui.ButtonOptionWidget( {
- * data: 3,
- * label: 'Option 3',
- * title: 'Button option 3'
- * } );
- *
- * var buttonSelect=new OO.ui.ButtonSelectWidget( {
- * items: [ option1, option2, option3 ]
- * } );
- * $( 'body' ).append( buttonSelect.$element );
+ * data: 1,
+ * label: 'Option 1',
+ * title: 'Button option 1'
+ * } ),
+ * option2 = new OO.ui.ButtonOptionWidget( {
+ * data: 2,
+ * label: 'Option 2',
+ * title: 'Button option 2'
+ * } ),
+ * option3 = new OO.ui.ButtonOptionWidget( {
+ * data: 3,
+ * label: 'Option 3',
+ * title: 'Button option 3'
+ * } ),
+ * buttonSelect = new OO.ui.ButtonSelectWidget( {
+ * items: [ option1, option2, option3 ]
+ * } );
+ * $( document.body ).append( buttonSelect.$element );
*
* [1]: https://www.mediawiki.org/wiki/OOUI/Widgets/Selects_and_Options
*
* a menu and a popup respectively.
*
* @example
- * // Example: A basic TagMultiselectWidget.
+ * // A TagMultiselectWidget.
* var widget = new OO.ui.TagMultiselectWidget( {
* inputPosition: 'outline',
* allowedValues: [ 'Option 1', 'Option 2', 'Option 3' ],
* selected: [ 'Option 1' ]
* } );
- * $( 'body' ).append( widget.$element );
+ * $( document.body ).append( widget.$element );
*
* @class
* @extends OO.ui.Widget
* @mixins OO.ui.mixin.IconElement
* @mixins OO.ui.mixin.TabIndexedElement
* @mixins OO.ui.mixin.FlaggedElement
+ * @mixins OO.ui.mixin.TitledElement
*
* @constructor
* @param {Object} config Configuration object
OO.ui.mixin.TabIndexedElement.call( this, config );
OO.ui.mixin.FlaggedElement.call( this, config );
OO.ui.mixin.DraggableGroupElement.call( this, config );
+ OO.ui.mixin.TitledElement.call( this, config );
this.toggleDraggable(
config.allowReordering === undefined ?
OO.mixinClass( OO.ui.TagMultiselectWidget, OO.ui.mixin.IconElement );
OO.mixinClass( OO.ui.TagMultiselectWidget, OO.ui.mixin.TabIndexedElement );
OO.mixinClass( OO.ui.TagMultiselectWidget, OO.ui.mixin.FlaggedElement );
+OO.mixinClass( OO.ui.TagMultiselectWidget, OO.ui.mixin.TitledElement );
/* Static properties */
// If Ctrl/Cmd was pressed, delete item entirely.
// Otherwise put it into the text field for editing.
if ( !withMetaKey ) {
- this.input.setValue( item.getData() );
+ this.input.setValue( item.getLabel() );
}
}
OO.ui.TagMultiselectWidget.parent.prototype.setDisabled.call( this, isDisabled );
if ( this.hasInput && this.input ) {
+ if ( !isDisabled ) {
+ this.updateInputSize();
+ }
this.input.setDisabled( !!isDisabled && !this.isUnderLimit() );
}
* to use a popup. The popup can be configured to have a default input to insert values into the widget.
*
* @example
- * // Example: A basic PopupTagMultiselectWidget.
+ * // A PopupTagMultiselectWidget.
* var widget = new OO.ui.PopupTagMultiselectWidget();
- * $( 'body' ).append( widget.$element );
+ * $( document.body ).append( widget.$element );
*
* // Example: A PopupTagMultiselectWidget with an external popup.
* var popupInput = new OO.ui.TextInputWidget(),
* $content: popupInput.$element
* }
* } );
- * $( 'body' ).append( widget.$element );
+ * $( document.body ).append( widget.$element );
*
* @class
* @extends OO.ui.TagMultiselectWidget
* @cfg {OO.ui.InputWidget} [popupInput] An input widget inside the popup that will be
* focused when the popup is opened and will be used as replacement for the
* general input in the widget.
+ * @deprecated
*/
OO.ui.PopupTagMultiselectWidget = function OoUiPopupTagMultiselectWidget( config ) {
var defaultInput,
this.$element
.append( this.popup.$element )
.addClass( 'oo-ui-popupTagMultiselectWidget' );
+
+ // Deprecation warning
+ OO.ui.warnDeprecation( 'PopupTagMultiselectWidget: Deprecated widget. Use MenuTagMultiselectWidget instead. See T208821.' );
};
/* Initialization */
* to use a menu of selectable options.
*
* @example
- * // Example: A basic MenuTagMultiselectWidget.
+ * // A basic MenuTagMultiselectWidget.
* var widget = new OO.ui.MenuTagMultiselectWidget( {
* inputPosition: 'outline',
* options: [
* ],
* selected: [ 'option1', 'option2' ]
* } );
- * $( 'body' ).append( widget.$element );
+ * $( document.body ).append( widget.$element );
*
* @class
* @extends OO.ui.TagMultiselectWidget
.append( this.menu.$element );
this.$element
.addClass( 'oo-ui-menuTagMultiselectWidget' );
+ // Remove MenuSelectWidget's generic focus owner ARIA attribute
+ // TODO: Should this widget have a `role` that is compatible with this attribute?
+ this.menu.$focusOwner.removeAttr( 'aria-expanded' );
// TagMultiselectWidget already does this, but it doesn't work right because this.menu is not yet
// set up while the parent constructor runs, and #getAllowedValues rejects everything.
if ( config.selected ) {
* @param {OO.ui.OptionWidget} menuItem Chosen menu item
*/
OO.ui.MenuTagMultiselectWidget.prototype.onMenuChoose = function ( menuItem ) {
- // Add tag
- this.addTag( menuItem.getData(), menuItem.getLabel() );
if ( this.hasInput && this.clearInputOnChoose ) {
this.input.setValue( '' );
}
+ // Add tag
+ this.addTag( menuItem.getData(), menuItem.getLabel() );
};
/**
} else {
this.initializeMenuSelection();
}
+ setTimeout( function () {
+ // Remove MenuSelectWidget's generic focus owner ARIA attribute
+ // TODO: Should this widget have a `role` that is compatible with this attribute?
+ this.menu.$focusOwner.removeAttr( 'aria-expanded' );
+ }.bind( this ) );
};
/**
/**
* SelectFileWidgets allow for selecting files, using the HTML5 File API. These
- * widgets can be configured with {@link OO.ui.mixin.IconElement icons} and {@link
- * OO.ui.mixin.IndicatorElement indicators}.
+ * widgets can be configured with {@link OO.ui.mixin.IconElement icons}, {@link
+ * OO.ui.mixin.IndicatorElement indicators} and {@link OO.ui.mixin.TitledElement titles}.
* Please see the [OOUI documentation on MediaWiki] [1] for more information and examples.
*
* @example
- * // Example of a file select widget
+ * // A file select widget.
* var selectFile = new OO.ui.SelectFileWidget();
- * $( 'body' ).append( selectFile.$element );
+ * $( document.body ).append( selectFile.$element );
*
* [1]: https://www.mediawiki.org/wiki/OOUI/Widgets
*
* @mixins OO.ui.mixin.IndicatorElement
* @mixins OO.ui.mixin.PendingElement
* @mixins OO.ui.mixin.LabelElement
+ * @mixins OO.ui.mixin.TitledElement
*
* @constructor
* @param {Object} [config] Configuration options
OO.ui.mixin.IndicatorElement.call( this, config );
OO.ui.mixin.PendingElement.call( this, $.extend( {}, config, { $pending: this.$info } ) );
OO.ui.mixin.LabelElement.call( this, config );
+ OO.ui.mixin.TitledElement.call( this, config );
// Properties
this.$info = $( '<span>' );
this.clearButton = new OO.ui.ButtonWidget( {
classes: [ 'oo-ui-selectFileWidget-clearButton' ],
framed: false,
- icon: 'close',
+ icon: 'clear',
disabled: this.disabled
} );
OO.mixinClass( OO.ui.SelectFileWidget, OO.ui.mixin.IndicatorElement );
OO.mixinClass( OO.ui.SelectFileWidget, OO.ui.mixin.PendingElement );
OO.mixinClass( OO.ui.SelectFileWidget, OO.ui.mixin.LabelElement );
+OO.mixinClass( OO.ui.SelectFileWidget, OO.ui.mixin.TitledElement );
/* Static Properties */
if ( this.isSupported && !this.isDisabled() && this.$input &&
( e.which === OO.ui.Keys.SPACE || e.which === OO.ui.Keys.ENTER )
) {
- this.$input.click();
+ this.$input.trigger( 'click' );
return false;
}
};
*/
OO.ui.SelectFileWidget.prototype.onDropTargetClick = function () {
if ( this.isSupported && !this.isDisabled() && this.$input ) {
- this.$input.click();
+ this.$input.trigger( 'click' );
return false;
}
};
dépôts / lhc / web / wiklou.git / blobdiff