#2675 : AdvancedPopperInput.jsx

Structure du code

Importations depuis : ../index, ./Popper.module.scss, classnames, prop-types, react

Possède PropTypes pour : AdvancedPopperInput

Utilise les modules CSS pour le style.

Code source (abrégé)

import classNames from 'classnames';
import PropTypes from 'prop-types';
import React from 'react';
import { Input } from '../index';
import styles from './Popper.module.scss';

function AdvancedPopperInput(
    {
        children,
        dark = false,
        // Extrait 'dispatch' pour ne pas le passer à la balise input
        // eslint-disable-next-line @typescript-eslint/no-unused-vars
        dispatch,
        forwardRef,
        icon,
        onCancel,
        onKeyDown,
        ...props
    },
) {
    const handleKeyDown = (event) => {
        if (onCancel && event.key === 'Escape') {
            onCancel();
        }

        if (onKeyDown) {
            onKeyDown(event);
        }
    };

    return (
        <div className={classNames(styles.input, { [styles.dark]: dark })}>
            <Input
                ref={forwardRef}
                icon={icon}
                className={styles.container}
                autoComplete="off"
                {...props}
                onKeyDown={handleKeyDown}
            />
            {children}
        </div>
    );
}

AdvancedPopperInput.propTypes = {
    id: PropTypes.string.isRequired,
    onChange: PropTypes.func.isRequired,
    children: PropTypes.node,
    dark: PropTypes.bool,
    dispatch: PropTypes.func,
    forwardRef: PropTypes.shape({}),
    icon: PropTypes.shape({}),
    onCancel: PropTypes.func,
    onKeyDown: PropTypes.func,
    placeholder: PropTypes.string,
    value: PropTypes.string,
};

export default AdvancedPopperInput;

Historique Git

3685edd6c mise à niveau vers react 18 wip
033629f77 correction des bugs eslint typescript
d217c9aff refonte du design d'autocomplétion vers les nouvelles entrées materialize
8667f1f6c nouveau design d'entrée materialize
031c85102 extension de l'entrée popper avancée