/
githubmirror
/
ionic
Обзор
Документация
Войти
/
githubmirror
/
ionic
Код
Запросы
0
Пакеты
0
Релизы
0
Аналитика
Безопасность
main
packages/react/src/components/IonIcon.tsx
69 строк
2 KB
Brandy Carney
fix(react/vue): properly switch ionicon based on the mode when ios/md is set (#26924)
14 мар 2023, 22:03
Не верифицирован
14 мар 2023, 22:03
1eb9a08
Код
Авторство
О чём код?
import React from 'react'; import { NavContext } from '../contexts/NavContext'; import type { IonicReactProps } from './IonicReactProps'; import { IonIconInner } from './inner-proxies'; import { createForwardRef, getConfig } from './utils'; interface IonIconProps { color?: string; flipRtl?: boolean; icon?: string; ios?: string; lazy?: boolean; md?: string; mode?: 'ios' | 'md'; name?: string; size?: string; src?: string; } type InternalProps = IonIconProps & { forwardedRef?: React.ForwardedRef<HTMLIonIconElement>; }; class IonIconContainer extends React.PureComponent<InternalProps> { constructor(props: InternalProps) { super(props); if (this.props.name) { console.warn( 'In Ionic React, you import icons from "ionicons/icons" and set the icon you imported to the "icon" property. Setting the "name" property has no effect.' ); } } render() { const { icon, ios, md, mode, ...rest } = this.props; let iconToUse: typeof icon; const config = getConfig(); const iconMode = mode || config?.get('mode'); if (ios || md) { if (iconMode === 'ios') { iconToUse = ios ?? md ?? icon; } else { iconToUse = md ?? ios ?? icon; } } else { iconToUse = icon; } return ( <IonIconInner ref={this.props.forwardedRef} icon={iconToUse} {...rest}> {this.props.children} </IonIconInner> ); } static get contextType() { return NavContext; } } export const IonIcon = createForwardRef<IonIconProps & IonicReactProps, HTMLIonIconElement>( IonIconContainer, 'IonIcon' );