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

fix(react): improve component compatibility with preact (#24132)

Browse Source 
resolves #23516
This commit is contained in:
Liam DeBeasi
2021-11-03 09:25:08 -04:00
committed by GitHub
parent ff25ac14fa
commit 15fc293d75
5 changed files with 182 additions and 180 deletions
Download Patch File Download Diff File Expand all files Collapse all files

1
core/stencil.config.ts
View File

@ -95,6 +95,7 @@ export const config: Config = {
'ion-popover', 'ion-popover',
'ion-toast', 'ion-toast',
'ion-app',
'ion-icon' 'ion-icon'
] ]
}), }),

5
packages/react/src/components/IonApp.tsx
View File

@ -13,7 +13,8 @@ type Props = LocalJSX.IonApp &
ref?: React.Ref<HTMLIonAppElement>; ref?: React.Ref<HTMLIonAppElement>;
}; };
export class IonApp extends React.Component<Props> { export const IonApp = /*@__PURE__*/ (() =>
class extends React.Component<Props> {
addOverlayCallback?: (id: string, overlay: any, containerElement: HTMLDivElement) => void; addOverlayCallback?: (id: string, overlay: any, containerElement: HTMLDivElement) => void;
removeOverlayCallback?: (id: string) => void; removeOverlayCallback?: (id: string) => void;
@ -60,4 +61,4 @@ export class IonApp extends React.Component<Props> {
static get displayName() { static get displayName() {
return 'IonApp'; return 'IonApp';
} }
} })();

5
packages/react/src/components/navigation/IonTabButton.tsx
View File

@ -12,7 +12,8 @@ type Props = LocalJSX.IonTabButton &
onClick?: (e: any) => void; onClick?: (e: any) => void;
}; };
export class IonTabButton extends React.Component<Props> { export const IonTabButton = /*@__PURE__*/ (() =>
class extends React.Component<Props> {
constructor(props: Props) { constructor(props: Props) {
super(props); super(props);
this.handleIonTabButtonClick = this.handleIonTabButtonClick.bind(this); this.handleIonTabButtonClick = this.handleIonTabButtonClick.bind(this);
@ -45,4 +46,4 @@ export class IonTabButton extends React.Component<Props> {
static get displayName() { static get displayName() {
return 'IonTabButton'; return 'IonTabButton';
} }
} })();

5
packages/react/src/components/navigation/IonTabs.tsx
View File

@ -56,7 +56,8 @@ const tabsInner: React.CSSProperties = {
contain: 'layout size style', contain: 'layout size style',
}; };
export class IonTabs extends React.Component<Props> { export const IonTabs = /*@__PURE__*/ (() =>
class extends React.Component<Props> {
context!: React.ContextType<typeof NavContext>; context!: React.ContextType<typeof NavContext>;
routerOutletRef: React.Ref<HTMLIonRouterOutletElement> = React.createRef(); routerOutletRef: React.Ref<HTMLIonRouterOutletElement> = React.createRef();
selectTabHandler?: (tag: string) => boolean; selectTabHandler?: (tag: string) => boolean;
@ -177,4 +178,4 @@ export class IonTabs extends React.Component<Props> {
static get contextType() { static get contextType() {
return NavContext; return NavContext;
} }
} })();

2
packages/react/src/components/proxies.ts
View File

@ -7,7 +7,6 @@ import type { JSX } from '@ionic/core/components';
import { IonAccordion as IonAccordionCmp } from '@ionic/core/components/ion-accordion.js'; import { IonAccordion as IonAccordionCmp } from '@ionic/core/components/ion-accordion.js';
import { IonAccordionGroup as IonAccordionGroupCmp } from '@ionic/core/components/ion-accordion-group.js'; import { IonAccordionGroup as IonAccordionGroupCmp } from '@ionic/core/components/ion-accordion-group.js';
import { IonApp as IonAppCmp } from '@ionic/core/components/ion-app.js';
import { IonAvatar as IonAvatarCmp } from '@ionic/core/components/ion-avatar.js'; import { IonAvatar as IonAvatarCmp } from '@ionic/core/components/ion-avatar.js';
import { IonBackdrop as IonBackdropCmp } from '@ionic/core/components/ion-backdrop.js'; import { IonBackdrop as IonBackdropCmp } from '@ionic/core/components/ion-backdrop.js';
import { IonBadge as IonBadgeCmp } from '@ionic/core/components/ion-badge.js'; import { IonBadge as IonBadgeCmp } from '@ionic/core/components/ion-badge.js';
@ -76,7 +75,6 @@ import { IonVirtualScroll as IonVirtualScrollCmp } from '@ionic/core/components/
export const IonAccordion = /*@__PURE__*/createReactComponent<JSX.IonAccordion, HTMLIonAccordionElement>('ion-accordion', undefined, undefined, IonAccordionCmp); export const IonAccordion = /*@__PURE__*/createReactComponent<JSX.IonAccordion, HTMLIonAccordionElement>('ion-accordion', undefined, undefined, IonAccordionCmp);
export const IonAccordionGroup = /*@__PURE__*/createReactComponent<JSX.IonAccordionGroup, HTMLIonAccordionGroupElement>('ion-accordion-group', undefined, undefined, IonAccordionGroupCmp); export const IonAccordionGroup = /*@__PURE__*/createReactComponent<JSX.IonAccordionGroup, HTMLIonAccordionGroupElement>('ion-accordion-group', undefined, undefined, IonAccordionGroupCmp);
export const IonApp = /*@__PURE__*/createReactComponent<JSX.IonApp, HTMLIonAppElement>('ion-app', undefined, undefined, IonAppCmp);
export const IonAvatar = /*@__PURE__*/createReactComponent<JSX.IonAvatar, HTMLIonAvatarElement>('ion-avatar', undefined, undefined, IonAvatarCmp); export const IonAvatar = /*@__PURE__*/createReactComponent<JSX.IonAvatar, HTMLIonAvatarElement>('ion-avatar', undefined, undefined, IonAvatarCmp);
export const IonBackdrop = /*@__PURE__*/createReactComponent<JSX.IonBackdrop, HTMLIonBackdropElement>('ion-backdrop', undefined, undefined, IonBackdropCmp); export const IonBackdrop = /*@__PURE__*/createReactComponent<JSX.IonBackdrop, HTMLIonBackdropElement>('ion-backdrop', undefined, undefined, IonBackdropCmp);
export const IonBadge = /*@__PURE__*/createReactComponent<JSX.IonBadge, HTMLIonBadgeElement>('ion-badge', undefined, undefined, IonBadgeCmp); export const IonBadge = /*@__PURE__*/createReactComponent<JSX.IonBadge, HTMLIonBadgeElement>('ion-badge', undefined, undefined, IonBadgeCmp);