Alfaform-first-step-component NPM

Dev mode `npm run dev`

Для запуска проекта в dev mode выполняйте команду npm run dev.

Для удобства повседневной работы над вашими проектами команда npm run dev запускает sh скрипт dev.sh, который игнорируется гитом. Таким образом вы можете указать путь для компиляции в любой ваш проект, так чтобы не возникало конфликтов в системе контроля версий с другими разработчиками.

Вы можете найти образец содержимого файла dev.sh в example.dev.sh

Путь указывается в абсолютном или в относительном формате со слэшом или без слэша '/' в конце - это не принципиально. Важно чтобы формат указания пути к вашему проекту в файле соответствовал следующему виду:

Цепочкой TARGET= + путь к внешнему проекту + npm run dev-watch,

например dev.sh:

TARGET=../alfaform-land8/node_modules/alfaform-first-step-component npm run dev-watch

Standalone Dev mode `npm start`

Запуск демо-страницы компонента через webpack-dev-server

Конфигурирование

Указать цель редиректа можно следующим образом

<FirstStepComponent
    redirectTarget='https://anketa.alfabank.ru/cc-short/post'
/>

Указать требуемые поля и их нейминг (имена полей, так чтобы они соответствовали именам полей в вашем проекте) можно следующим образом:

<FirstStepComponent
    mapping={{
        lastName: 'lastName',
        firstName: 'firstName',
        middleName: 'middleName',
        gender: 'gender',
        phone: 'phone',
        email: 'email',
        workRegion: 'workRegion'
    }}
/>

Если исключить какое-то поле из маппинга - оно не будет рендериться и на него не будут реагировать валидаторы

Настроить полосу прогресса заполнения шага можно передав в props progressConfig:

<FirstStepComponent
    progressConfig={{
        enabled: true,
        firstStepConfig: {
            weight: 20,
            text: 'Получите 20% к одобрению заявки...'
        },
        stepsCount: 6
    }}
/>

enabled: включить / выключить отображение прогрессбара

firstStepConfig: где weight - вес шага в процентах, а text - отображаемый снизу прогрессбара текст

stepsCount: общее кол-во шагов (отображается сверху прогрессбара)