javascript/ionic-framework
1
0
Fork 0
mirror of https://github.com/ionic-team/ionic-framework.git synced 2025-11-09 16:16:41 +08:00
Code Issues Packages Projects Releases Wiki Activity

chore(): sync with main

Browse Source
This commit is contained in:
Liam DeBeasi
2023-01-23 13:38:16 -05:00
parent a7c2c555f3 c6620c7c74
commit e8fb9e7328
377 changed files with 23765 additions and 8053 deletions
Download Patch File Download Diff File Expand all files Collapse all files

22
core/src/components/loading/loading.tsx
View File

@ -29,6 +29,8 @@ import { iosLeaveAnimation } from './animations/ios.leave';
import { mdEnterAnimation } from './animations/md.enter';
import { mdLeaveAnimation } from './animations/md.leave';
// TODO(FW-2832): types
/**
* @virtualProp {"ios" | "md"} mode - The mode determines which platform styles to use.
*/
@ -43,7 +45,7 @@ import { mdLeaveAnimation } from './animations/md.leave';
export class Loading implements ComponentInterface, OverlayInterface {
private readonly delegateController = createDelegateController(this);
private readonly triggerController = createTriggerController();
private durationTimeout: any;
private durationTimeout?: ReturnType<typeof setTimeout>;
private currentTransition?: Promise<any>;
presented = false;
@ -299,10 +301,20 @@ export class Loading implements ComponentInterface, OverlayInterface {
};
render() {
const { message, spinner, htmlAttributes } = this;
const { message, spinner, htmlAttributes, overlayIndex } = this;
const mode = getIonMode(this);
const msgId = `loading-${overlayIndex}-msg`;
/**
* If the message is defined, use that as the label.
* Otherwise, don't set aria-labelledby.
*/
const ariaLabelledBy = message !== undefined ? msgId : null;
return (
<Host
role="dialog"
aria-modal="true"
aria-labelledby={ariaLabelledBy}
tabindex="-1"
{...(htmlAttributes as any)}
style={{
@ -320,14 +332,16 @@ export class Loading implements ComponentInterface, OverlayInterface {
<div tabindex="0"></div>
<div class="loading-wrapper ion-overlay-wrapper" role="dialog">
<div class="loading-wrapper ion-overlay-wrapper">
{spinner && (
<div class="loading-spinner">
<ion-spinner name={spinner} aria-hidden="true" />
</div>
)}
{message !== undefined && <div class="loading-content" innerHTML={sanitizeDOMString(message)}></div>}
{message !== undefined && (
<div class="loading-content" id={msgId} innerHTML={sanitizeDOMString(message)}></div>
)}
</div>
<div tabindex="0"></div>