@steroidsjs/core 3.1.7 → 3.1.9

package/ui/form/DateTimeRangeField/DateTimeRangeField.js

@@ -1,174 +0,0 @@
-"use strict";
-var __assign = (this && this.__assign) || function () {
-    __assign = Object.assign || function(t) {
-        for (var s, i = 1, n = arguments.length; i < n; i++) {
-            s = arguments[i];
-            for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p))
-                t[p] = s[p];
-        }
-        return t;
-    };
-    return __assign.apply(this, arguments);
-};
-var __importDefault = (this && this.__importDefault) || function (mod) {
-    return (mod && mod.__esModule) ? mod : { "default": mod };
-};
-exports.__esModule = true;
-var react_1 = require("@maskito/react");
-var utils_1 = require("@steroidsjs/core/ui/form/DateTimeField/utils");
-var react_2 = require("react");
-var enums_1 = require("../../../enums");
-var hooks_1 = require("../../../hooks");
-var useDateInputState_1 = __importDefault(require("../../form/DateField/useDateInputState"));
-var useDateRange_1 = __importDefault(require("../../form/DateField/useDateRange"));
-var useDateTime_1 = __importDefault(require("../../form/DateField/useDateTime"));
-var fieldWrapper_1 = __importDefault(require("../../form/Field/fieldWrapper"));
-var DATE_TIME_SEPARATOR = ', ';
-function DateTimeRangeField(props) {
-    var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k, _l, _m, _o, _p;
-    var components = (0, hooks_1.useComponents)();
-    var maskInputFromRef = (0, react_1.useMaskito)({
-        options: (_b = (_a = props.maskOptions) === null || _a === void 0 ? void 0 : _a.from) !== null && _b !== void 0 ? _b : (0, utils_1.createDateTimeMask)({
-            from: (_c = props.availableTime) === null || _c === void 0 ? void 0 : _c.from,
-            to: (_d = props.availableTime) === null || _d === void 0 ? void 0 : _d.to,
-            minuteStep: props.minuteStep,
-            min: (_f = (_e = props.disabledDays) === null || _e === void 0 ? void 0 : _e.before) !== null && _f !== void 0 ? _f : null,
-            dateTimeSeparator: (_g = props.dateTimeSeparator) !== null && _g !== void 0 ? _g : DATE_TIME_SEPARATOR
-        })
-    });
-    var maskInputToRef = (0, react_1.useMaskito)({
-        options: (_j = (_h = props.maskOptions) === null || _h === void 0 ? void 0 : _h.to) !== null && _j !== void 0 ? _j : (0, utils_1.createDateTimeMask)({
-            from: (_k = props.availableTime) === null || _k === void 0 ? void 0 : _k.from,
-            to: (_l = props.availableTime) === null || _l === void 0 ? void 0 : _l.to,
-            minuteStep: props.minuteStep,
-            min: (_o = (_m = props.disabledDays) === null || _m === void 0 ? void 0 : _m.before) !== null && _o !== void 0 ? _o : null,
-            dateTimeSeparator: (_p = props.dateTimeSeparator) !== null && _p !== void 0 ? _p : DATE_TIME_SEPARATOR
-        })
-    });
-    // Global onChange (from props)
-    var onChange = (0, react_2.useCallback)(function () {
-        var _a;
-        if (props.onChange) {
-            props.onChange.call(null, (_a = {},
-                _a[props.attributeFrom] = props.inputFrom.value,
-                _a[props.attributeTo] = props.inputTo.value,
-                _a));
-        }
-    }, [props.attributeFrom, props.attributeTo, props.inputFrom.value, props.inputTo.value, props.onChange]);
-    // Input 'from'
-    var _q = (0, useDateInputState_1["default"])({
-        displayFormat: props.displayFormat,
-        valueFormat: props.valueFormat,
-        input: props.inputFrom,
-        disabled: props.disabled,
-        placeholder: props.placeholder,
-        required: props.required,
-        inputProps: props.inputPropsFrom,
-        useUTC: props.useUTC,
-        dateInUTC: props.dateInUTC,
-        onChange: onChange
-    }), isOpenedFrom = _q.isOpened, onCloseFrom = _q.onClose, inputPropsFrom = _q.inputProps, onClearFrom = _q.onClear, onNow = _q.onNow;
-    // Input 'to'
-    var _r = (0, useDateInputState_1["default"])({
-        displayFormat: props.displayFormat,
-        valueFormat: props.valueFormat,
-        input: props.inputTo,
-        disabled: props.disabled,
-        placeholder: props.placeholder,
-        required: props.required,
-        inputProps: props.inputPropsTo,
-        useUTC: props.useUTC,
-        dateInUTC: props.dateInUTC,
-        onChange: onChange
-    }), isOpenedTo = _r.isOpened, onCloseTo = _r.onClose, inputPropsTo = _r.inputProps, onClearTo = _r.onClear;
-    var _s = (0, useDateTime_1["default"])({
-        displayFormat: props.displayFormat,
-        valueFormat: props.valueFormat,
-        dateTimeSeparator: DATE_TIME_SEPARATOR,
-        useUTC: props.useUTC,
-        dateInUTC: props.dateInUTC,
-        input: props.inputFrom
-    }), dateValueFormat = _s.dateValueFormat, dateValueFrom = _s.dateValue, timeValueFrom = _s.timeValue, onDateFromSelect = _s.onDateSelect, onTimeFromSelect = _s.onTimeSelect;
-    var _t = (0, useDateTime_1["default"])({
-        displayFormat: props.displayFormat,
-        valueFormat: props.valueFormat,
-        dateTimeSeparator: DATE_TIME_SEPARATOR,
-        useUTC: props.useUTC,
-        dateInUTC: props.dateInUTC,
-        input: props.inputTo
-    }), dateValueTo = _t.dateValue, timeValueTo = _t.timeValue, onDateToSelect = _t.onDateSelect, onTimeToSelect = _t.onTimeSelect;
-    var _u = (0, useDateRange_1["default"])({
-        onClearFrom: onClearFrom,
-        onCloseTo: onCloseTo,
-        onCloseFrom: onCloseFrom,
-        onClearTo: onClearTo,
-        inputPropsFrom: inputPropsFrom,
-        inputPropsTo: inputPropsTo,
-        inputFrom: props.inputFrom,
-        inputTo: props.inputTo,
-        useSmartFocus: false,
-        hasInitialFocus: props.hasInitialFocus,
-        displayFormat: props.displayFormat,
-        valueFormat: props.valueFormat
-    }), focus = _u.focus, onClose = _u.onClose, onClear = _u.onClear, extendedInputPropsFrom = _u.extendedInputPropsFrom, extendedInputPropsTo = _u.extendedInputPropsTo;
-    (0, react_2.useEffect)(function () {
-        if (extendedInputPropsFrom.ref && extendedInputPropsTo.ref) {
-            maskInputFromRef(extendedInputPropsFrom.ref.current);
-            maskInputToRef(extendedInputPropsTo.ref.current);
-        }
-    }, [
-        extendedInputPropsFrom.ref,
-        extendedInputPropsTo.ref,
-        maskInputFromRef,
-        maskInputToRef,
-    ]);
-    // Calendar props
-    var calendarProps = (0, react_2.useMemo)(function () {
-        var _a;
-        return (__assign({ value: [dateValueFrom, dateValueTo], onChange: focus === 'from' ? onDateFromSelect : onDateToSelect, valueFormat: dateValueFormat }, ((props === null || props === void 0 ? void 0 : props.disabledDays)
-            ? __assign(__assign({}, props.calendarProps), { pickerProps: __assign(__assign({}, (_a = props.calendarProps) === null || _a === void 0 ? void 0 : _a.pickerProps), { disabledDays: props.disabledDays }) }) : props.calendarProps)));
-    }, [dateValueFormat, dateValueFrom, dateValueTo, focus, onDateFromSelect, onDateToSelect, props.calendarProps, props.disabledDays]);
-    // TimePanel props
-    var timePanelViewProps = (0, react_2.useMemo)(function () { return (__assign({ value: focus === 'from' ? timeValueFrom : timeValueTo, onSelect: focus === 'from' ? onTimeFromSelect : onTimeToSelect, onNow: onNow, onClose: onClose, showNow: false, showHeader: true, availableTime: props.availableTime, minuteStep: props.minuteStep }, props.timePanelViewProps)); }, [focus, onClose, onNow, onTimeFromSelect, onTimeToSelect, props.availableTime, props.minuteStep, props.timePanelViewProps, timeValueFrom, timeValueTo]);
-    var viewProps = (0, react_2.useMemo)(function () { return ({
-        onClear: onClear,
-        onClose: onClose,
-        calendarProps: calendarProps,
-        timePanelViewProps: timePanelViewProps,
-        icon: props.icon,
-        size: props.size,
-        errorsFrom: props.errorsFrom,
-        errorsTo: props.errorsTo,
-        className: props.className,
-        showRemove: props.showRemove,
-        inputPropsTo: extendedInputPropsTo,
-        inputPropsFrom: extendedInputPropsFrom,
-        isOpened: focus === 'from' ? isOpenedFrom : isOpenedTo,
-        disabled: props.disabled,
-        style: props.style,
-        id: props.id,
-        withRangeButtons: props.withRangeButtons,
-        rangeButtonsPosition: props.rangeButtonsPosition,
-        displayFormat: props.displayFormat
-    }); }, [calendarProps, extendedInputPropsFrom, extendedInputPropsTo, focus, isOpenedFrom,
-        isOpenedTo, onClear, onClose, props.className, props.disabled, props.errorsFrom, props.withRangeButtons, props.rangeButtonsPosition,
-        props.errorsTo, props.icon, props.id, props.showRemove, props.size, props.style, timePanelViewProps, props.displayFormat]);
-    return components.ui.renderView(props.view || 'form.DateTimeRangeFieldView', viewProps);
-}
-DateTimeRangeField.defaultProps = {
-    disabled: false,
-    required: false,
-    className: '',
-    displayFormat: 'DD.MM.YYYY' + DATE_TIME_SEPARATOR + 'HH:mm',
-    valueFormat: 'YYYY-MM-DD' + DATE_TIME_SEPARATOR + 'HH:mm',
-    showRemove: true,
-    hasInitialFocus: false,
-    useUTC: false,
-    dateInUTC: false,
-    icon: true,
-    rangeButtonsPosition: 'left-bottom',
-    minuteStep: 1
-};
-exports["default"] = (0, fieldWrapper_1["default"])(enums_1.FieldEnum.DATE_TIME_RANGE_FIELD, DateTimeRangeField, {
-    attributeSuffixes: ['from', 'to']
-});

package/ui/form/EmailField/hooks/useInputTypeEmail.js

@@ -1,27 +0,0 @@
-"use strict";
-/* eslint-disable max-len */
-/* eslint-disable no-unused-expressions */
-exports.__esModule = true;
-var react_1 = require("react");
-var DEFAULT_VALIDITY = __('Неправильный формат адреса электронной почты.');
-var useInputTypeEmail = function (currentInputRef, onChange, currentValue, required) {
-    var isValueEmail = function (value) {
-        if (!value) {
-            return !required;
-        }
-        var emailRegexp = /^(([^<>()[\]\\.,;:\s@"]+(\.[^<>()[\]\\.,;:\s@"]+)*)|.(".+"))@((\[[0-9]{1,3}\.[0-9]{1,3}\.[0-9]{1,3}\.[0-9]{1,3}\])|(([a-zA-Z\-0-9]+\.)+[a-zA-Z]{2,}))$/;
-        return emailRegexp.test(value.toLowerCase());
-    };
-    var errorMessage = isValueEmail(currentValue) ? '' : DEFAULT_VALIDITY;
-    (0, react_1.useEffect)(function () {
-        var _a;
-        (_a = currentInputRef.current) === null || _a === void 0 ? void 0 : _a.setCustomValidity(errorMessage);
-    }, [currentInputRef, currentValue, errorMessage]);
-    var onInputChange = function (event) {
-        onChange(event);
-    };
-    return {
-        onInputChange: onInputChange
-    };
-};
-exports["default"] = useInputTypeEmail;

package/ui/form/Field/fieldWrapper.d.ts

@@ -1,119 +0,0 @@
-/// <reference types="react" />
-import { FieldEnumType } from '@steroidsjs/core/enums';
-export interface IFieldWrapperInputProps {
-    /**
-     * Префикс, который добавится к аттрибуту (названию) поля в форме
-     */
-    prefix?: string | boolean;
-    /**
-     * Название поля либо отмена отображение поля (false)
-     * @example 'Visible'
-     */
-    label?: string | boolean | any;
-    /**
-     * Аттрибут (название) поля в форме
-     * @example 'isVisible'
-     */
-    attribute?: string;
-    /**
-     * Модель с полями формы
-     * @example
-     * {
-     *  attributes: [
-     *   {
-     *    attribute: 'category',
-     *    field: 'DropDownField'
-     *   }
-     *  ]
-     * }
-     */
-    model?: string | ((...args: any[]) => any) | any;
-    /**
-     * Подсказка, которая отобразится рядом с полем
-     * @example 'Only english letters'
-     */
-    hint?: string;
-    /**
-     * Обязательное ли поле? Если true, то к названию будет добавлен
-     * модификатор 'required' - красная звездочка (по умолчанию)
-     * @example true
-     */
-    required?: boolean;
-    /**
-     * Переводит элемент в состояние "не активен"
-     * @example true
-     */
-    disabled?: boolean;
-    /**
-     * Подсказка для поля
-     * @example Your text...
-     */
-    placeholder?: string;
-    /**
-     * Input ID для связи поля с label
-     */
-    id?: string;
-    /**
-    * Значение для поля
-    */
-    value?: any;
-    /**
-    * Callback-функция, которая вызывается при изменении данных
-    */
-    onChange?: (...args: any[]) => any;
-    /**
-     * Ошибки в поле
-     * @example ['Error text']
-     */
-    errors?: string[];
-    date?: any;
-    /**
-     * Размер поля
-     */
-    size?: Size;
-    /**
-     * Дополнительный CSS-класс для обертки FieldLayout
-     */
-    fieldLayoutClassName?: CssClassName;
-    /**
-     * Возможность отрендерить поле без обертки в компонент FieldLayout
-     */
-    isRenderWithoutFieldLayout?: boolean;
-    [key: string]: any;
-}
-export interface IInputParams {
-    name?: string;
-    value?: any;
-    onChange: (value: any) => void;
-}
-export interface IFieldWrapperOutputProps {
-    /**
-    * Id формы
-    */
-    formId?: string;
-    /**
-    * Id компонента
-    */
-    componentId?: string;
-    /**
-    * Коллекция ошибок
-    */
-    errors?: string[];
-    /**
-    * Параметры для input элемента
-    */
-    input?: IInputParams;
-}
-interface IFieldWrapperOptions {
-    label?: boolean;
-    list?: boolean;
-    attributeSuffixes?: string[];
-}
-export interface FieldWrapperComponent<T> {
-    (props: IFieldWrapperInputProps & T): JSX.Element;
-    WrappedComponent: any;
-    displayName: any;
-    defaultProps: any;
-}
-export default function fieldWrapper<T = any>(componentId: FieldEnumType, Component: any, optionsConfig?: IFieldWrapperOptions): FieldWrapperComponent<T>;
-export {};

package/ui/form/Form/Form.d.ts

@@ -1,239 +0,0 @@
-import { IButtonProps } from '@steroidsjs/core/ui/form/Button/Button';
-import { Dispatch, ReactNode } from 'react';
-import { IAddressBarConfig } from '../../../hooks/useAddressBar';
-import { providers } from '../../../utils/form';
-import { IFieldProps } from '../Field/Field';
-/**
- * Form
- *
- * Компонент для создания формы. Предоставляет управление и синхронизацию состояния формы,
- * а также позволяет выполнять отправку данных формы на сервер с возможностью валидации и обработки результатов.
- */
-export interface IFormProps extends IUiComponent {
-    /**
-     * Идентификатор формы
-     * @example BookingForm
-     */
-    formId?: string;
-    /**
-    * Префикс
-    */
-    prefix?: string;
-    /**
-     * Модель с полями формы
-     * @example
-     * {
-     *  attributes: [
-     *   {
-     *    attribute: 'category',
-     *    field: 'DropDownField'
-     *   }
-     *  ]
-     * }
-     */
-    model?: string | ((...args: any[]) => any) | any;
-    /**
-     * Url на который будет отправлена форма
-     * @example api/v1/handle-form
-     */
-    action?: string;
-    /**
-     * Тип HTTP запроса (GET | POST | PUT | DELETE)
-     * @example POST
-     */
-    actionMethod?: string;
-    /**
-     * Текст ошибки при неудачной отправке данных. По-умолчанию: "Ошибка сервера"
-     * @example Упс, что-то пошло не так
-     */
-    submitErrorMessage?: string;
-    /**
-     * Обработчик события отправки формы
-     * @param args
-     */
-    onSubmit?: (...args: any[]) => any;
-    /**
-     * Набор с правилами для проверки соответствия значений полей формы определенному формату.
-     * Проверка запускается в момент отправки формы (в обработчике onSubmit).
-     * @example
-     * [
-     *  ['name', 'required'],
-     *  ['age', 'integer']
-     * ]
-     */
-    validators?: string[] | Array<string[]> | Array<Record<string, any>>;
-    /**
-     * Обработчик события перед отправкой формы
-     * @param args
-     */
-    onBeforeSubmit?: (...args: any[]) => any;
-    /**
-     * Обработчик события после отправки формы
-     * @param args
-     */
-    onAfterSubmit?: (...args: any[]) => any;
-    /**
-     * Обработчик события при каком-либо изменении в форме
-     * @param args
-     */
-    onChange?: (...args: any[]) => any;
-    /**
-     * Обработчик события ошибки выполнения запроса
-     * @param args
-     */
-    onError?: (...args: any[]) => any;
-    /**
-     * Обработчик успешного выполнения формы (без ошибок)
-     * @param args
-     */
-    onComplete?: (...args: any[]) => any;
-    /**
-     * Автоматически стартовать 2fa аутентификацию (отправлять код)
-     */
-    autoStartTwoFactor?: boolean;
-    /**
-     * Обработчик, который вызывается при запросе 2FA
-     */
-    onTwoFactor?: (providerName: string, info?: any) => Promise<any> | any | void;
-    /**
-     * Сохраняет значения полей формы в LocalStorage
-     * @example true
-     */
-    autoSave?: boolean;
-    /**
-     * Начальные значения формы
-     */
-    initialValues?: any | any[];
-    /**
-     * Свойства для представления
-     * @example {className: 'foo'}
-     */
-    viewProps?: any;
-    /**
-     * Поля, которые необходимо поместить в форму
-     * @example
-     * [
-     *  {
-     *   attribute: 'category',
-     *   component: 'DropDownField'
-     *  }
-     * ]
-     */
-    fields?: (string | IFieldProps)[];
-    /**
-     * Использовать для данных глобальное хранилище (redux)
-     * @example true
-     */
-    useRedux?: boolean;
-    /**
-     * Надпись на кнопке отправки формы
-     * @example Submit
-     */
-    submitLabel?: string;
-    /**
-     * Параметры для кнопки отправки формы
-     * @example {
-     *     block: true,
-     * }
-     */
-    submitButtonProps?: IButtonProps;
-    /**
-     * Синхронизация значений формы с адресной строкой
-     * @example true
-     */
-    addressBar?: boolean | IAddressBarConfig;
-    /**
-     * Если в форме есть элементы '<input>', то произойдет автоматическая фокусировка на первом из них
-     * @example true
-     */
-    autoFocus?: boolean;
-    /**
-     * Название действия, которое передаётся в API Google reCAPTCHA v3, для более детального анализа
-     * поведения пользователя (https://developers.google.com/recaptcha/docs/v3)
-     * @example 'addComment'
-     */
-    captchaActionName?: string;
-    /**
-     * Очищать ли данные формы с redux хранилища при размонтировании компонента. По-умолчанию - false
-     * @example false
-     */
-    autoDestroy?: boolean;
-    /**
-     * Дополнительные кнопки
-     */
-    buttons?: ReactNode;
-    /**
-     * Размер компонента и вложенных полей
-     */
-    size?: Size;
-    /**
-     * Очищать сообщение об ошибке при редактировании поля. По-умолчанию включено
-     */
-    useClearErrors?: boolean;
-    [key: string]: any;
-}
-export interface IFormViewProps {
-    submitLabel?: string;
-    fields?: (string | IFieldProps)[];
-    onSubmit: any;
-    className?: CssClassName;
-    autoFocus?: boolean;
-    style?: CustomStyle;
-    children?: ReactNode;
-    buttons?: ReactNode;
-    submitButtonProps?: IButtonProps;
-    size?: Size;
-}
-export interface IFormReducerState {
-    values: any;
-    initialValues: any;
-    errors: any;
-    isInvalid: boolean;
-    isSubmitting: boolean;
-}
-export interface IFormContext {
-    /**
-    * Id формы
-    * @example {}
-    */
-    formId?: string;
-    /**
-    * Модель с полями формы
-    */
-    model?: any;
-    /**
-    * Префикс для полей формы
-    */
-    prefix?: string | boolean;
-    /**
-    * Размер компонента и вложенных полей
-    */
-    size?: Size;
-    /**
-    * Провайдер
-    */
-    provider?: typeof providers.redux | typeof providers.reducer;
-    /**
-    * Редьюсер
-    */
-    reducer?: {
-        dispatch: Dispatch<any>;
-        select: any;
-    };
-    /**
-    * Диспатч
-    */
-    dispatch?: Dispatch<any>;
-}
-export declare const FormContext: import("react").Context<IFormContext>;
-declare function Form(props: IFormProps): JSX.Element;
-declare namespace Form {
-    var defaultProps: {
-        actionMethod: string;
-        autoStartTwoFactor: boolean;
-        captchaActionName: string;
-        size: string;
-        useClearErrors: boolean;
-    };
-}
-export default Form;