@steroidsjs/core 2.1.0-beta.3 → 2.1.0-beta.33

package/ui/form/Button/demo/hint.d.ts

@@ -1,7 +1,7 @@
 /// <reference types="react" />
 declare const _default: () => JSX.Element;
 /**
- * Button with hint
+ * С всплывающей подсказкой при наведении на кнопку.
  * @order 7
  * @col 4
  */

package/ui/form/Button/demo/hint.js

@@ -25,7 +25,7 @@ exports.__esModule = true;
 var React = __importStar(require("react"));
 var Button_1 = __importDefault(require("../Button"));
 /**
- * Button with hint
+ * С всплывающей подсказкой при наведении на кнопку.
  * @order 7
  * @col 4
  */

package/ui/form/Button/demo/icon.d.ts

@@ -1,7 +1,7 @@
 /// <reference types="react" />
 declare const _default: () => JSX.Element;
 /**
- * Button with icon
+ * Обычное использования с иконокой.
  * @order 8
  * @col 4
  */

package/ui/form/Button/demo/icon.js

@@ -25,7 +25,7 @@ exports.__esModule = true;
 var React = __importStar(require("react"));
 var Button_1 = __importDefault(require("../Button"));
 /**
- * Button with icon
+ * Обычное использования с иконокой.
  * @order 8
  * @col 4
  */

package/ui/form/Button/demo/link.d.ts

@@ -1,7 +1,7 @@
 /// <reference types="react" />
 declare const _default: () => JSX.Element;
 /**
- * Link
+ * Использвание кнопки в качестве ссылки.
  * @order 9
  * @col 4
  */

package/ui/form/Button/demo/link.js

@@ -25,7 +25,7 @@ exports.__esModule = true;
 var React = __importStar(require("react"));
 var Button_1 = __importDefault(require("../Button"));
 /**
- * Link
+ * Использвание кнопки в качестве ссылки.
  * @order 9
  * @col 4
  */

package/ui/form/Button/demo/sizes.d.ts

@@ -1,8 +1,3 @@
 /// <reference types="react" />
 declare const _default: () => JSX.Element;
-/**
- * Sizes
- * @order 10
- * @col 8
- */
 export default _default;

package/ui/form/Button/demo/sizes.js

@@ -24,14 +24,14 @@ var __importDefault = (this && this.__importDefault) || function (mod) {
 exports.__esModule = true;
 var React = __importStar(require("react"));
 var Button_1 = __importDefault(require("../Button"));
+/**
+ * По-умлочанию Button имеет 3 заданных размера.
+ * @order 10
+ * @col 8
+ */
 var sizes = {
     sm: 'Small',
     md: 'Middle',
     lg: 'Large'
 };
-/**
- * Sizes
- * @order 10
- * @col 8
- */
 exports["default"] = (function () { return (React.createElement(React.Fragment, null, Object.keys(sizes).map(function (size) { return (React.createElement(Button_1["default"], { key: size, size: size, className: 'float-left mr-2' }, sizes[size])); }))); });

package/ui/form/Button/demo/tags.d.ts

@@ -1,7 +1,7 @@
 /// <reference types="react" />
 declare const _default: () => JSX.Element;
 /**
- * Tags
+ * Пример выбора html-тэга, который будет использован в DOM
  * @order 11
  * @col 6
  */

package/ui/form/Button/demo/tags.js

@@ -25,7 +25,7 @@ exports.__esModule = true;
 var React = __importStar(require("react"));
 var Button_1 = __importDefault(require("../Button"));
 /**
- * Tags
+ * Пример выбора html-тэга, который будет использован в DOM
  * @order 11
  * @col 6
  */

package/ui/form/CheckboxField/CheckboxField.d.ts

@@ -30,10 +30,5 @@ export interface ICheckboxFieldViewProps extends ICheckboxFieldProps, IFieldWrap
         disabled: boolean;
     };
 }
-declare const _default: {
-    (props: IFieldWrapperInputProps): JSX.Element;
-    WrappedComponent: any;
-    displayName: any;
-    defaultProps: any;
-};
+declare const _default: import("../Field/fieldWrapper").FieldWrapperComponent<ICheckboxFieldProps>;
 export default _default;

package/ui/form/CheckboxField/demo/basic.d.ts

@@ -1,7 +1,7 @@
 /// <reference types="react" />
 declare const _default: () => JSX.Element;
 /**
- * Basic
+ * Обычный пример использования CheckboxField.
  * @order 1
  * @col 4
  */

package/ui/form/CheckboxField/demo/basic.js

@@ -25,7 +25,7 @@ exports.__esModule = true;
 var React = __importStar(require("react"));
 var CheckboxField_1 = __importDefault(require("../CheckboxField"));
 /**
- * Basic
+ * Обычный пример использования CheckboxField.
  * @order 1
  * @col 4
  */

package/ui/form/CheckboxField/demo/disabled.d.ts

@@ -1,7 +1,7 @@
 /// <reference types="react" />
 declare const _default: () => JSX.Element;
 /**
- * Disabled
+ * Выключенный или недоступный CheckboxField для заполнения.
  * @order 2
  * @col 4
  */

package/ui/form/CheckboxField/demo/disabled.js

@@ -25,7 +25,7 @@ exports.__esModule = true;
 var React = __importStar(require("react"));
 var CheckboxField_1 = __importDefault(require("../CheckboxField"));
 /**
- * Disabled
+ * Выключенный или недоступный CheckboxField для заполнения.
  * @order 2
  * @col 4
  */

package/ui/form/CheckboxField/demo/errors.d.ts

@@ -1,7 +1,7 @@
 /// <reference types="react" />
 declare const _default: () => JSX.Element;
 /**
- * Errors
+ * Обработка ошибок.
  * @order 4
  * @col 4
  */

package/ui/form/CheckboxField/demo/errors.js

@@ -25,9 +25,9 @@ exports.__esModule = true;
 var React = __importStar(require("react"));
 var CheckboxField_1 = __importDefault(require("../CheckboxField"));
 /**
- * Errors
+ * Обработка ошибок.
  * @order 4
  * @col 4
  */
 exports["default"] = (function () { return (React.createElement(React.Fragment, null,
-    React.createElement(CheckboxField_1["default"], { label: 'Errors', errors: ['Error 1 text', 'Error 2 text'] }))); });
+    React.createElement(CheckboxField_1["default"], { label: 'Errors', errors: ['Error 1 text', 'Error 2 text'], layout: true }))); });

package/ui/form/CheckboxField/demo/required.d.ts

@@ -1,7 +1,7 @@
 /// <reference types="react" />
 declare const _default: () => JSX.Element;
 /**
- * Required
+ * Как обязательное поле для заполнения.
  * @order 3
  * @col 4
  */

package/ui/form/CheckboxField/demo/required.js

@@ -25,7 +25,7 @@ exports.__esModule = true;
 var React = __importStar(require("react"));
 var CheckboxField_1 = __importDefault(require("../CheckboxField"));
 /**
- * Required
+ * Как обязательное поле для заполнения.
  * @order 3
  * @col 4
  */

package/ui/form/CheckboxListField/CheckboxListField.d.ts

@@ -40,10 +40,5 @@ export interface ICheckboxListFieldViewProps extends IFieldWrapperOutputProps {
     onItemSelect: (id: PrimaryKey | any) => void;
     onItemHover: (id: PrimaryKey | any) => void;
 }
-declare const _default: {
-    (props: IFieldWrapperInputProps): JSX.Element;
-    WrappedComponent: any;
-    displayName: any;
-    defaultProps: any;
-};
+declare const _default: import("../../../ui/form/Field/fieldWrapper").FieldWrapperComponent<ICheckboxListFieldProps>;
 export default _default;

package/ui/form/CheckboxListField/demo/basic.d.ts

@@ -1,9 +1,9 @@
 /// <reference types="react" />
-export declare const items: string[];
-declare const _default: () => JSX.Element;
 /**
- * Basic
+ * Обычный пример использования списка из CheckboxListField.
  * @order 1
  * @col 6
  */
+export declare const items: string[];
+declare const _default: () => JSX.Element;
 export default _default;

package/ui/form/CheckboxListField/demo/basic.js

@@ -25,15 +25,15 @@ exports.__esModule = true;
 exports.items = void 0;
 var React = __importStar(require("react"));
 var CheckboxListField_1 = __importDefault(require("../CheckboxListField"));
+/**
+ * Обычный пример использования списка из CheckboxListField.
+ * @order 1
+ * @col 6
+ */
 exports.items = [
     'test item 1',
     'test item 2',
     'test item 3',
 ];
-/**
- * Basic
- * @order 1
- * @col 6
- */
 exports["default"] = (function () { return (React.createElement(React.Fragment, null,
     React.createElement(CheckboxListField_1["default"], { items: exports.items }))); });

package/ui/form/CheckboxListField/demo/disabled.d.ts

@@ -1,7 +1,7 @@
 /// <reference types="react" />
 declare const _default: () => JSX.Element;
 /**
- * Disabled
+ * Список с недоступными для заполнения полями.
  * @order 2
  * @col 6
  */

package/ui/form/CheckboxListField/demo/disabled.js

@@ -26,7 +26,7 @@ var React = __importStar(require("react"));
 var CheckboxListField_1 = __importDefault(require("../CheckboxListField"));
 var basic_1 = require("./basic");
 /**
- * Disabled
+ * Список с недоступными для заполнения полями.
  * @order 2
  * @col 6
  */

package/ui/form/CheckboxListField/demo/errors.d.ts

@@ -1,7 +1,7 @@
 /// <reference types="react" />
 declare const _default: () => JSX.Element;
 /**
- * Errors
+ * Обработка ошибок в списке.
  * @order 4
  * @col 6
  */

package/ui/form/CheckboxListField/demo/errors.js

@@ -26,9 +26,9 @@ var React = __importStar(require("react"));
 var CheckboxListField_1 = __importDefault(require("../CheckboxListField"));
 var basic_1 = require("./basic");
 /**
- * Errors
+ * Обработка ошибок в списке.
  * @order 4
  * @col 6
  */
 exports["default"] = (function () { return (React.createElement(React.Fragment, null,
-    React.createElement(CheckboxListField_1["default"], { label: 'Errors', errors: ['Error 1 text', 'Error 2 text'], items: basic_1.items }))); });
+    React.createElement(CheckboxListField_1["default"], { label: 'Errors', errors: ['Error 1 text', 'Error 2 text'], items: basic_1.items, layout: true }))); });

package/ui/form/CheckboxListField/demo/required.d.ts

@@ -1,7 +1,7 @@
 /// <reference types="react" />
 declare const _default: () => JSX.Element;
 /**
- * Required
+ * Список как обязательный для заполнения.
  * @order 3
  * @col 6
  */

package/ui/form/CheckboxListField/demo/required.js

@@ -26,7 +26,7 @@ var React = __importStar(require("react"));
 var CheckboxListField_1 = __importDefault(require("../CheckboxListField"));
 var basic_1 = require("./basic");
 /**
- * Required
+ * Список как обязательный для заполнения.
  * @order 3
  * @col 6
  */

package/ui/form/DateField/DateField.d.ts

@@ -1,4 +1,3 @@
-/// <reference types="react" />
 import { ICalendarProps } from '../../content/Calendar/Calendar';
 import { IDateInputStateInput, IDateInputStateOutput } from './useDateInputState';
 export interface IDateFieldProps extends IDateInputStateInput {
@@ -29,10 +28,5 @@ export interface IDateFieldProps extends IDateInputStateInput {
 export interface IDateFieldViewProps extends IDateInputStateOutput, Pick<IDateFieldProps, 'size' | 'icon' | 'errors' | 'showRemove' | 'className' | 'calendarProps'> {
     [key: string]: any;
 }
-declare const _default: {
-    (props: import("../../form/Field/fieldWrapper").IFieldWrapperInputProps): JSX.Element;
-    WrappedComponent: any;
-    displayName: any;
-    defaultProps: any;
-};
+declare const _default: import("../../form/Field/fieldWrapper").FieldWrapperComponent<IDateFieldProps>;
 export default _default;

package/ui/form/DateField/DateField.js

@@ -40,7 +40,7 @@ function DateField(props) {
         onClose: onClose,
         isOpened: isOpened,
         inputProps: inputProps,
-        calendarProps: calendarProps, size: props.size, icon: props.icon, errors: props.errors, className: props.className, showRemove: props.showRemove }));
+        calendarProps: calendarProps, size: props.size, icon: props.icon, errors: props.errors, disabled: props.disabled, className: props.className, showRemove: props.showRemove }));
 }
 DateField.defaultProps = {
     disabled: false,

package/ui/form/DateField/demo/basic.d.ts

@@ -1,7 +1,7 @@
 /// <reference types="react" />
 declare const _default: () => JSX.Element;
 /**
- * Basic
+ * Обычный  пример использования DateField.
  * @order 1
  * @col 6
  */

package/ui/form/DateField/demo/basic.js

@@ -25,7 +25,7 @@ exports.__esModule = true;
 var React = __importStar(require("react"));
 var DateField_1 = __importDefault(require("../DateField"));
 /**
- * Basic
+ * Обычный  пример использования DateField.
  * @order 1
  * @col 6
  */

package/ui/form/DateField/demo/disabled.d.ts

@@ -1,7 +1,7 @@
 /// <reference types="react" />
 declare const _default: () => JSX.Element;
 /**
- * Disabled
+ * Выключенный или недоступный для использования.
  * @order 2
  * @col 6
  */

package/ui/form/DateField/demo/disabled.js

@@ -25,7 +25,7 @@ exports.__esModule = true;
 var React = __importStar(require("react"));
 var DateField_1 = __importDefault(require("../DateField"));
 /**
- * Disabled
+ * Выключенный или недоступный для использования.
  * @order 2
  * @col 6
  */

package/ui/form/DateField/demo/errors.d.ts

@@ -1,7 +1,7 @@
 /// <reference types="react" />
 declare const _default: () => JSX.Element;
 /**
- * Errors
+ * Обработка ошибок.
  * @order 4
  * @col 6
  */

package/ui/form/DateField/demo/errors.js

@@ -25,7 +25,7 @@ exports.__esModule = true;
 var React = __importStar(require("react"));
 var DateField_1 = __importDefault(require("../DateField"));
 /**
- * Errors
+ * Обработка ошибок.
  * @order 4
  * @col 6
  */

package/ui/form/DateField/demo/icon.d.ts

@@ -1,7 +1,7 @@
 /// <reference types="react" />
 declare const _default: () => JSX.Element;
 /**
- * Icons
+ * С использованием кастомной иконкой.
  * @order 5
  * @col 6
  */

package/ui/form/DateField/demo/icon.js

@@ -25,11 +25,11 @@ exports.__esModule = true;
 var React = __importStar(require("react"));
 var DateField_1 = __importDefault(require("../DateField"));
 /**
- * Icons
+ * С использованием кастомной иконкой.
  * @order 5
  * @col 6
  */
 exports["default"] = (function () { return (React.createElement(React.Fragment, null,
     React.createElement(DateField_1["default"], { label: 'Default', icon: true }),
-    React.createElement(DateField_1["default"], { label: 'With error', icon: true, errors: ['Error 1 text'] }),
+    React.createElement(DateField_1["default"], { label: 'With error', icon: 'plane', errors: ['Error 1 text'] }),
     React.createElement(DateField_1["default"], { label: 'Custom', icon: 'dizzy' }))); });

package/ui/form/DateField/demo/placeholder.d.ts

@@ -1,7 +1,7 @@
 /// <reference types="react" />
 declare const _default: () => JSX.Element;
 /**
- * Placeholder
+ * С сообщением для пользователя по контексту использования.
  * @order 6
  * @col 6
  */

package/ui/form/DateField/demo/placeholder.js

@@ -25,7 +25,7 @@ exports.__esModule = true;
 var React = __importStar(require("react"));
 var DateField_1 = __importDefault(require("../DateField"));
 /**
- * Placeholder
+ * С сообщением для пользователя по контексту использования.
  * @order 6
  * @col 6
  */

package/ui/form/DateField/demo/required.d.ts

@@ -1,7 +1,7 @@
 /// <reference types="react" />
 declare const _default: () => JSX.Element;
 /**
- * Required
+ * Как обязательное поле для заполнения.
  * @order 3
  * @col 6
  */

package/ui/form/DateField/demo/required.js

@@ -25,7 +25,7 @@ exports.__esModule = true;
 var React = __importStar(require("react"));
 var DateField_1 = __importDefault(require("../DateField"));
 /**
- * Required
+ * Как обязательное поле для заполнения.
  * @order 3
  * @col 6
  */

package/ui/form/DateField/demo/sizes.d.ts

@@ -1,7 +1,7 @@
 /// <reference types="react" />
 declare const _default: () => JSX.Element;
 /**
- * Sizes
+ * По-умлочанию DateField имеет 3 заданных размера.
  * @order 7
  * @col 12
  */

package/ui/form/DateField/demo/sizes.js

@@ -30,7 +30,7 @@ var sizes = {
     lg: 'Large'
 };
 /**
- * Sizes
+ * По-умлочанию DateField имеет 3 заданных размера.
  * @order 7
  * @col 12
  */

package/ui/form/DateField/useDateInputState.d.ts

@@ -35,6 +35,10 @@ export interface IDateInputStateInput extends IFieldWrapperInputProps {
      * @example YYYY-MM-DD
      */
     valueFormat?: string;
+    /**
+     * Использовать всемирное время (UTC) вместо местного для даты, отправляемой на сервер
+     */
+    useUTC?: boolean;
 }
 export interface IDateInputStateOutput {
     /**

package/ui/form/DateField/useDateInputState.js

@@ -40,15 +40,15 @@ function useDateInputState(props) {
     // Display input change handler
     var onDisplayValueChange = react_1.useCallback(function (value) {
         setDisplayValue(value);
-        var parsedValue = calendar_1.convertDate(value, props.displayFormat, props.valueFormat);
+        var parsedValue = calendar_1.convertDate(value, props.displayFormat, props.valueFormat, props.useUTC);
         var newValue = parsedValue || !value ? parsedValue || null : false;
         if (newValue !== false && newValue !== props.input.value) {
             props.input.onChange.call(null, newValue);
             if (props.onChange) {
-                props.onChange.call(null, newValue);
+                props.onChange.call(null, value);
             }
         }
-    }, [props.displayFormat, props.input.onChange, props.input.value, props.onChange, props.valueFormat]);
+    }, [props.displayFormat, props.input.onChange, props.input.value, props.onChange, props.useUTC, props.valueFormat]);
     // Dropdown opened state
     var _b = react_1.useState(false), isOpened = _b[0], setIsOpened = _b[1];
     // Focus/blur handlers

package/ui/form/DateField/useDateTime.js

@@ -12,16 +12,18 @@ var calendar_1 = require("../../../utils/calendar");
  * Возвращает значения и обработчики для передачи в Calendar и TimePanel
  */
 function useDateTime(props) {
-    var _a = props.displayFormat.split(props.dateTimeSeparator), dateValueFormat = _a[0], timeValueFormat = _a[1];
-    var dateValue = calendar_1.convertDate(props.input.value, [props.displayFormat, props.valueFormat], dateValueFormat);
-    var timeValue = calendar_1.convertDate(props.input.value, [props.displayFormat, props.valueFormat], timeValueFormat);
+    var _a = props.valueFormat.split(props.dateTimeSeparator), dateValueFormat = _a[0], timeValueFormat = _a[1];
+    var dateValue = react_1.useMemo(function () { return calendar_1.convertDate(props.input.value, [props.displayFormat, props.valueFormat], dateValueFormat); }, [dateValueFormat, props.displayFormat, props.input.value, props.valueFormat]);
+    var timeValue = react_1.useMemo(function () { return calendar_1.convertDate(props.input.value, [props.displayFormat, props.valueFormat], timeValueFormat); }, [props.displayFormat, props.input.value, props.valueFormat, timeValueFormat]);
     // Handler for calendar and time picker changes
     var onDateSelect = react_1.useCallback(function (date) {
-        props.input.onChange.call(null, date + props.dateTimeSeparator + (timeValue || '00:00'));
-    }, [props.dateTimeSeparator, props.input.onChange, timeValue]);
+        var result = date + props.dateTimeSeparator + (timeValue || '00:00');
+        props.input.onChange.call(null, calendar_1.convertDate(result, [props.valueFormat, 'YYYY-MM-DD HH:mm'], props.valueFormat, true));
+    }, [props.dateTimeSeparator, props.input.onChange, props.valueFormat, timeValue]);
     var onTimeSelect = react_1.useCallback(function (time) {
-        props.input.onChange.call(null, (dateValue || moment_1["default"]().format(dateValueFormat)) + props.dateTimeSeparator + time);
-    }, [dateValue, dateValueFormat, props.dateTimeSeparator, props.input.onChange]);
+        var result = (dateValue || moment_1["default"]().format(dateValueFormat)) + props.dateTimeSeparator + time;
+        props.input.onChange.call(null, calendar_1.convertDate(result, [props.valueFormat, 'YYYY-MM-DD HH:mm'], props.valueFormat, true));
+    }, [dateValue, dateValueFormat, props.dateTimeSeparator, props.input.onChange, props.valueFormat]);
     return {
         dateValue: dateValue,
         timeValue: timeValue,

package/ui/form/DateRangeField/DateRangeField.d.ts

@@ -1,4 +1,3 @@
-/// <reference types="react" />
 import { ICalendarProps } from '../../content/Calendar/Calendar';
 import { IDateInputStateInput, IDateInputStateOutput } from '../DateField/useDateInputState';
 import { IFieldWrapperInputProps, IFieldWrapperOutputProps } from '../../form/Field/fieldWrapper';
@@ -80,10 +79,5 @@ export interface IDateRangeFieldViewProps extends IDateInputStateOutput, Omit<IF
     errorsFrom?: string[];
     errorsTo?: string[];
 }
-declare const _default: {
-    (props: IFieldWrapperInputProps): JSX.Element;
-    WrappedComponent: any;
-    displayName: any;
-    defaultProps: any;
-};
+declare const _default: import("../../form/Field/fieldWrapper").FieldWrapperComponent<IDateRangeFieldProps>;
 export default _default;

package/ui/form/DateRangeField/DateRangeField.js

@@ -71,10 +71,11 @@ function DateRangeField(props) {
         valueFormat: props.valueFormat,
         numberOfMonths: 2,
         showFooter: false
-    }); }, [focus, props.inputFrom.onChange, props.inputFrom.value, props.inputTo.onChange, props.inputTo.value, props.valueFormat]);
+    }); }, [focus, props.inputFrom.onChange, props.inputFrom.value, props.inputTo.onChange,
+        props.inputTo.value, props.valueFormat]);
     return components.ui.renderView(props.view || 'form.DateRangeFieldView', __assign(__assign({}, props.viewProps), { onClear: onClear,
         onClose: onClose,
-        calendarProps: calendarProps, icon: props.icon, size: props.size, noBorder: props.noBorder, errorsTo: props.errorsTo, className: props.className, showRemove: props.showRemove, errorsFrom: props.errorsFrom, inputPropsTo: extendedInputPropsTo, inputPropsFrom: extendedInputPropsFrom, isOpened: focus === 'from' ? isOpenedFrom : isOpenedTo }));
+        calendarProps: calendarProps, icon: props.icon, size: props.size, errorsTo: props.errorsTo, disabled: props.disabled, noBorder: props.noBorder, className: props.className, showRemove: props.showRemove, errorsFrom: props.errorsFrom, inputPropsTo: extendedInputPropsTo, inputPropsFrom: extendedInputPropsFrom, isOpened: focus === 'from' ? isOpenedFrom : isOpenedTo }));
 }
 DateRangeField.defaultProps = {
     disabled: false,

package/ui/form/DateRangeField/demo/basic.d.ts

@@ -1,7 +1,7 @@
 /// <reference types="react" />
 declare const _default: () => JSX.Element;
 /**
- * Basic
+ * Обычный пример использования DateRangeField.
  * @order 1
  * @col 6
  */

package/ui/form/DateRangeField/demo/basic.js

@@ -25,7 +25,7 @@ exports.__esModule = true;
 var React = __importStar(require("react"));
 var DateRangeField_1 = __importDefault(require("../DateRangeField"));
 /**
- * Basic
+ * Обычный пример использования DateRangeField.
  * @order 1
  * @col 6
  */

package/ui/form/DateRangeField/demo/disabled.d.ts

@@ -0,0 +1,8 @@
+/// <reference types="react" />
+declare const _default: () => JSX.Element;
+/**
+ * Выключенный или недоступный для использования.
+ * @order 2
+ * @col 6
+ */
+export default _default;