Skip to content
This repository was archived by the owner on Sep 5, 2024. It is now read-only.

Commit 96ec741

Browse files
committed
fix(toast): improve position handling to better align with docs
- position of "" uses documented default positioning - "bottom left" - position of "left" or "right" uses default vertical positioning: "bottom" - improve JSDoc Closes #11843. BREAKING CHANGE: `$mdToast.show()`'s position behavior has been updated to be consistent with the documentation. If you relied on the previously undocumented behavior where it defaulted to `top left` instead of `bottom left`, you will need to update your app. Change your code from this: ```js $mdToast.show( $mdToast.simple() .textContent('Simple Toast!')) .then(... ``` To this: ```js $mdToast.show( $mdToast.simple() .textContent('Simple Toast!') .position('top left')) .then(... ```
1 parent e24d09c commit 96ec741

File tree

2 files changed

+28
-4
lines changed

2 files changed

+28
-4
lines changed

src/components/toast/toast.js

Lines changed: 27 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -459,6 +459,12 @@ function MdToastProvider($$interimElementProvider) {
459459
}
460460
};
461461

462+
/**
463+
* @param {{toast: {actionKey: string=}}=} scope
464+
* @param {JQLite} element
465+
* @param {Object.<string, string>} options
466+
* @return {*}
467+
*/
462468
function onShow(scope, element, options) {
463469
// support deprecated #content method
464470
// TODO remove support for content in 1.2.
@@ -504,9 +510,24 @@ function MdToastProvider($$interimElementProvider) {
504510
scope.toast.actionKey : undefined);
505511

506512
element.on(SWIPE_EVENTS, options.onSwipe);
507-
element.addClass(isSmScreen ? 'md-bottom' : options.position.split(' ').map(function(pos) {
508-
return 'md-' + pos;
509-
}).join(' '));
513+
514+
var verticalPositionDefined = false;
515+
var positionClasses = options.position.split(' ').map(function (position) {
516+
if (position) {
517+
var className = 'md-' + position;
518+
if (className === 'md-top' || className === 'md-bottom') {
519+
verticalPositionDefined = true;
520+
}
521+
return className;
522+
}
523+
return 'md-bottom';
524+
});
525+
// If only "right" or "left" are defined, default to a vertical position of "bottom"
526+
// as documented.
527+
if (!verticalPositionDefined) {
528+
positionClasses.push('md-bottom');
529+
}
530+
element.addClass(isSmScreen ? 'md-bottom' : positionClasses.join(' '));
510531

511532
if (options.parent) {
512533
options.parent.addClass('md-toast-animating');
@@ -551,6 +572,9 @@ function MdToastProvider($$interimElementProvider) {
551572
return 'md-toast-open-' + (position.indexOf('top') > -1 ? 'top' : 'bottom');
552573
}
553574

575+
/**
576+
* @param {string} actionKey
577+
*/
554578
function setupActionKeyListener(actionKey) {
555579
/**
556580
* @param {KeyboardEvent} event

src/core/util/util.js

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -673,7 +673,7 @@ function UtilFactory($document, $timeout, $compile, $rootScope, $$mdAnimate, $in
673673
* Functional equivalent for $element.filter(‘md-bottom-sheet’)
674674
* useful with interimElements where the element and its container are important...
675675
*
676-
* @param {angular.JQLite} element to scan
676+
* @param {JQLite} element to scan
677677
* @param {string} nodeName of node to find (e.g. 'md-dialog')
678678
* @param {boolean=} scanDeep optional flag to allow deep scans; defaults to 'false'.
679679
* @param {boolean=} warnNotFound optional flag to enable log warnings; defaults to false

0 commit comments

Comments
 (0)