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

feat(config): add option to disable custom html functionality (#26956)

Browse Source
This commit is contained in:
Liam DeBeasi
2023-03-22 13:59:59 -04:00
committed by GitHub
parent 6c639ff3a5
commit 3b0af7c55d
12 changed files with 351 additions and 28 deletions
Download Patch File Download Diff File Expand all files Collapse all files

21
core/src/components/infinite-scroll-content/infinite-scroll-content.tsx
View File

@ -4,6 +4,7 @@ import { Component, Host, Prop, h } from '@stencil/core';
import { config } from '../../global/config';
import { getIonMode } from '../../global/ionic-global';
import type { SpinnerTypes } from '../../interface';
import { ENABLE_HTML_CONTENT_DEFAULT } from '../../utils/config';
import type { IonicSafeString } from '../../utils/sanitization';
import { sanitizeDOMString } from '../../utils/sanitization';
@ -15,6 +16,8 @@ import { sanitizeDOMString } from '../../utils/sanitization';
},
})
export class InfiniteScrollContent implements ComponentInterface {
private customHTMLEnabled = config.get('innerHTMLTemplatesEnabled', ENABLE_HTML_CONTENT_DEFAULT);
/**
* An animated SVG spinner that shows while loading.
*/
@ -28,6 +31,11 @@ export class InfiniteScrollContent implements ComponentInterface {
* `<Ionic>`
*
* For more information: [Security Documentation](https://ionicframework.com/docs/faq/security)
*
* This property accepts custom HTML as a string.
* Developers who only want to pass plain text
* can disable the custom HTML functionality
* by setting `innerHTMLTemplatesEnabled: false` in the Ionic config.
*/
@Prop() loadingText?: string | IonicSafeString;
@ -41,6 +49,15 @@ export class InfiniteScrollContent implements ComponentInterface {
}
}
private renderLoadingText() {
const { customHTMLEnabled, loadingText } = this;
if (customHTMLEnabled) {
return <div class="infinite-loading-text" innerHTML={sanitizeDOMString(loadingText)}></div>;
}
return <div class="infinite-loading-text">{this.loadingText}</div>;
}
render() {
const mode = getIonMode(this);
return (
@ -58,9 +75,7 @@ export class InfiniteScrollContent implements ComponentInterface {
<ion-spinner name={this.loadingSpinner} />
</div>
)}
{this.loadingText !== undefined && (
<div class="infinite-loading-text" innerHTML={sanitizeDOMString(this.loadingText)} />
)}
{this.loadingText !== undefined && this.renderLoadingText()}
</div>
</Host>
);