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

chore(deps): update to stencil v3 (#26663)

Browse Source
This commit is contained in:
Liam DeBeasi
2023-01-31 18:07:22 -05:00
committed by GitHub
parent e6c7c57466
commit 1a8bd6d8c6
77 changed files with 1280 additions and 1163 deletions
Download Patch File Download Diff File Expand all files Collapse all files

28
packages/react/src/components/react-component-lib/createComponent.tsx
View File

@ -1,12 +1,6 @@
import React, { createElement } from 'react';
import {
attachProps,
createForwardRef,
dashToPascalCase,
isCoveredByReact,
mergeRefs,
} from './utils';
import { attachProps, camelToDashCase, createForwardRef, dashToPascalCase, isCoveredByReact, mergeRefs } from './utils';
export interface HTMLStencilElement extends HTMLElement {
componentOnReady(): Promise<this>;
@ -27,9 +21,9 @@ export const createReactComponent = <
ReactComponentContext?: React.Context<ContextStateType>,
manipulatePropsFunction?: (
originalProps: StencilReactInternalProps<ElementType>,
propsToPass: any,
propsToPass: any
) => ExpandedPropsTypes,
defineCustomElement?: () => void,
defineCustomElement?: () => void
) => {
if (defineCustomElement !== undefined) {
defineCustomElement();
@ -58,17 +52,25 @@ export const createReactComponent = <
render() {
const { children, forwardedRef, style, className, ref, ...cProps } = this.props;
let propsToPass = Object.keys(cProps).reduce((acc, name) => {
let propsToPass = Object.keys(cProps).reduce((acc: any, name) => {
const value = (cProps as any)[name];
if (name.indexOf('on') === 0 && name[2] === name[2].toUpperCase()) {
const eventName = name.substring(2).toLowerCase();
if (typeof document !== 'undefined' && isCoveredByReact(eventName)) {
(acc as any)[name] = (cProps as any)[name];
acc[name] = value;
}
} else {
(acc as any)[name] = (cProps as any)[name];
// we should only render strings, booleans, and numbers as attrs in html.
// objects, functions, arrays etc get synced via properties on mount.
const type = typeof value;
if (type === 'string' || type === 'boolean' || type === 'number') {
acc[camelToDashCase(name)] = value;
}
}
return acc;
}, {});
}, {} as ExpandedPropsTypes);
if (manipulatePropsFunction) {
propsToPass = manipulatePropsFunction(this.props, propsToPass);