@steroidsjs/core 3.0.0-beta.39 → 3.0.0-beta.40

package/hooks/useDataProvider.d.ts

@@ -24,6 +24,32 @@ export type DataProviderItems = string | ({
     label: string | any;
     [key: string]: any;
 })[];
+export interface IDataProvider {
+    /**
+     * Уникальный (глобально) идентификатор, под которых будут храниться
+     * подгруженные данные в redux (при включенном флаге useRedux). Если
+     * не задан - данные будут храниться в локальном стейте
+     */
+    reduxId?: string;
+    /**
+     * URL для подгрузки новой коллекции данных
+     * @example '/api/v1/search'
+     */
+    action?: string | IApiMethod;
+    /**
+     * Параметры запроса
+     * @example {pageSize: 3}
+     */
+    params?: Record<string, unknown>;
+    /**
+     * Обработчик, который вызывается для подгрузки данных.
+     * Если обработчик не передан, то по умолчанию отправится post-запрос.
+     * @param {string} action
+     * @param {Object} params
+     * @return {Promise<Array> | Array}
+     */
+    onSearch?: (action: string, params: Record<string, unknown>) => Array<unknown> | Promise<Array<unknown>>;
+}
 export interface IDataProviderConfig {
     /**
      * Коллекция элементов
@@ -34,32 +60,7 @@ export interface IDataProviderConfig {
      * Конфигурация для подгрузки данных извне.
      * Если dataProvider не передан, то поиск данных по запросу происходит локально.
      */
-    dataProvider?: {
-        /**
-         * Уникальный (глобально) идентификатор, под которых будут храниться
-         * подгруженные данные в redux (при включенном флаге useRedux). Если
-         * не задан - данные будут храниться в локальном стейте
-         */
-        reduxId?: string;
-        /**
-         * URL для подгрузки новой коллекции данных
-         * @example '/api/v1/search'
-         */
-        action?: string | IApiMethod;
-        /**
-         * Параметры запроса
-         * @example {pageSize: 3}
-         */
-        params?: Record<string, unknown>;
-        /**
-         * Обработчик, который вызывается для подгрузки данных.
-         * Если обработчик не передан, то по умолчанию отправится post-запрос.
-         * @param {string} action
-         * @param {Object} params
-         * @return {Promise<Array> | Array}
-         */
-        onSearch?: (action: string, params: Record<string, unknown>) => Array<unknown> | Promise<Array<unknown>>;
-    };
+    dataProvider?: IDataProvider;
     /**
      * Текст запроса
      * @example 'some text'

package/hooks/useList.d.ts

@@ -8,7 +8,7 @@ import { IEmptyProps } from '../ui/list/Empty/Empty';
 import { IFormProps } from '../ui/form/Form/Form';
 import { Model } from '../components/MetaComponent';
 export type ListControlPosition = 'top' | 'bottom' | 'both' | string;
-export interface ISortProps {
+export interface ISortConfig {
     /**
      * Включить сортировку
      * @example false
@@ -61,7 +61,7 @@ export interface IListConfig {
      * Подключение сортировки
      * @example {enable: true, defaultSort: 'startDate'}
      */
-    sort?: boolean | ISortProps;
+    sort?: boolean | ISortConfig;
     /**
      * Варианты расположения элементов коллекции
      * @example {items: [{id: 'list', label: 'List'}, {id: 'grid', label: 'Grid'}]}

package/index.d.ts

@@ -77,7 +77,7 @@ declare type CustomStyle = React.CSSProperties;
  * Переопределение view React компонента для кастомизации отображения
  * @example MyCustomView
  */
-declare type CustomView = React.ReactNode | React.FunctionComponent;
+declare type CustomView = React.ReactNode | ((props: React.ComponentProps<any>) => JSX.Element);
 
 /**
  * Кастомная иконка

package/package.json

@@ -1,6 +1,6 @@
 {
  "name": "@steroidsjs/core",
- "version": "3.0.0-beta.39",
+ "version": "3.0.0-beta.40",
  "description": "",
  "author": "Vladimir Kozhin <hello@kozhindev.com>",
  "repository": {

package/ui/content/Accordion/Accordion.d.ts

@@ -3,7 +3,7 @@ export interface IAccordionIcon {
     open: React.ReactElement | string;
     close: React.ReactElement | string;
 }
-export interface IAccordionCommonProps {
+export interface IAccordionProps {
     view?: CustomView;
     style?: CustomStyle;
     children?: any;
@@ -55,11 +55,13 @@ export interface IAccordionCommonProps {
      */
     showIcon?: boolean;
 }
-export interface IAccordionCommonViewProps extends IAccordionCommonProps {
+export interface IAccordionViewProps extends IAccordionProps {
     toggleAccordion?: (number: any) => void;
     toggleCollapse?: (number: any) => void;
     childIndex?: number;
     isShowMore?: boolean;
 }
-declare function Accordion(props: IAccordionCommonProps): JSX.Element;
+export type IAccordionItemProps = IAccordionProps;
+export type IAccordionItemViewProps = IAccordionViewProps;
+declare function Accordion(props: IAccordionProps): JSX.Element;
 export default Accordion;

package/ui/content/Accordion/AccordionItem.d.ts

@@ -1,6 +1,6 @@
-import { IAccordionCommonProps, IAccordionCommonViewProps } from './Accordion';
-declare function AccordionItem(props: IAccordionCommonProps): any;
+import { IAccordionItemProps } from './Accordion';
+declare function AccordionItem(props: IAccordionItemProps): any;
 declare namespace AccordionItem {
-    var defaultProps: IAccordionCommonViewProps;
+    var defaultProps: import("./Accordion").IAccordionViewProps;
 }
 export default AccordionItem;

package/ui/content/CopyToClipboard/CopyToClipboard.d.ts

@@ -1,13 +1,49 @@
-interface ICopyToClipboardProps {
+import React from 'react';
+import { IShowNotificationParameters } from '../../../actions/notifications';
+export interface ICopyToClipboardProps extends IUiComponent {
+    /**
+    * Значение, которое будет использоваться при копировании
+    * @example value: 'Steroids.js'
+    */
     value: string;
+    /**
+    * Флаг, который отвечает за выключение функции копирования
+    * @example disabled: false
+    */
     disabled?: boolean;
     notification?: string | {
         message?: string;
         level?: string;
-        timeOut?: string;
+        params?: IShowNotificationParameters;
     };
-    className?: CssClassName;
-    children?: any;
+    /**
+    * Позволяет включить или выключить отображение иконки
+    * @example showCopyIcon: false
+    */
+    showCopyIcon?: boolean;
+    /**
+    * Иконка
+    * @example calendar-day
+    */
+    icon?: string | React.ReactElement;
+    /**
+    * Дочерний элемент
+    * @example <h1>This message will be copied!</h1>
+    */
+    children?: React.ReactNode;
+    /**
+    * Callback функция, которая вызывается при копировании
+    * @example {}
+    */
+    onCopy?: VoidFunction;
 }
-export default function CopyToClipboard(props: ICopyToClipboardProps): any;
-export {};
+export interface ICopyToClipboardViewProps extends ICopyToClipboardProps {
+    onClick: () => void;
+}
+declare function CopyToClipboard(props: ICopyToClipboardProps): any;
+declare namespace CopyToClipboard {
+    var defaultProps: {
+        showCopyIcon: boolean;
+    };
+}
+export default CopyToClipboard;

package/ui/content/CopyToClipboard/CopyToClipboard.js

@@ -10,29 +10,6 @@ var __assign = (this && this.__assign) || function () {
     };
     return __assign.apply(this, arguments);
 };
-var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
-    if (k2 === undefined) k2 = k;
-    var desc = Object.getOwnPropertyDescriptor(m, k);
-    if (!desc || ("get" in desc ? !m.__esModule : desc.writable || desc.configurable)) {
-      desc = { enumerable: true, get: function() { return m[k]; } };
-    }
-    Object.defineProperty(o, k2, desc);
-}) : (function(o, m, k, k2) {
-    if (k2 === undefined) k2 = k;
-    o[k2] = m[k];
-}));
-var __setModuleDefault = (this && this.__setModuleDefault) || (Object.create ? (function(o, v) {
-    Object.defineProperty(o, "default", { enumerable: true, value: v });
-}) : function(o, v) {
-    o["default"] = v;
-});
-var __importStar = (this && this.__importStar) || function (mod) {
-    if (mod && mod.__esModule) return mod;
-    var result = {};
-    if (mod != null) for (var k in mod) if (k !== "default" && Object.prototype.hasOwnProperty.call(mod, k)) __createBinding(result, mod, k);
-    __setModuleDefault(result, mod);
-    return result;
-};
 var __awaiter = (this && this.__awaiter) || function (thisArg, _arguments, P, generator) {
     function adopt(value) { return value instanceof P ? value : new P(function (resolve) { resolve(value); }); }
     return new (P || (P = Promise))(function (resolve, reject) {
@@ -69,60 +46,50 @@ var __generator = (this && this.__generator) || function (thisArg, body) {
         if (op[0] & 5) throw op[1]; return { value: op[0] ? op[1] : void 0, done: true };
     }
 };
-var __importDefault = (this && this.__importDefault) || function (mod) {
-    return (mod && mod.__esModule) ? mod : { "default": mod };
-};
 exports.__esModule = true;
-var react_1 = __importStar(require("react"));
-var useDispatch_1 = __importDefault(require("../../../hooks/useDispatch"));
+/* eslint-disable no-unused-expressions */
+var react_1 = require("react");
+var hooks_1 = require("../../../hooks");
 var notifications_1 = require("../../../actions/notifications");
+var DEFAULT_NOTIFICATION_LEVEL = 'info';
 function CopyToClipboard(props) {
     var _this = this;
-    var inputRef = (0, react_1.useRef)();
+    var components = (0, hooks_1.useComponents)();
     var _a = (0, react_1.useState)(false), isCopied = _a[0], setIsCopied = _a[1];
-    var dispatch = (0, useDispatch_1["default"])();
+    var dispatch = (0, hooks_1.useDispatch)();
+    var notification = props.notification;
     var onClick = (0, react_1.useCallback)(function () { return __awaiter(_this, void 0, void 0, function () {
-        var el, notification;
         return __generator(this, function (_a) {
             switch (_a.label) {
                 case 0:
-                    if (!!isCopied) return [3 /*break*/, 4];
+                    if (props.disabled) {
+                        return [2 /*return*/];
+                    }
+                    if (!!isCopied) return [3 /*break*/, 3];
                     if (!navigator.clipboard) return [3 /*break*/, 2];
                     return [4 /*yield*/, navigator.clipboard.writeText(props.value)];
                 case 1:
                     _a.sent();
-                    return [3 /*break*/, 3];
-                case 2:
-                    el = inputRef.current;
-                    if (el) {
-                        el.focus();
-                        el.select();
+                    if (props.onCopy) {
+                        props.onCopy();
                     }
-                    document.execCommand('copy');
-                    _a.label = 3;
-                case 3:
-                    if (props.notification) {
-                        notification = __assign({ level: 'info', params: undefined }, (typeof props.notification === 'string' ? { message: props.notification } : props.notification));
-                        dispatch((0, notifications_1.showNotification)(notification.message, notification.level, notification.params));
+                    _a.label = 2;
+                case 2:
+                    if (notification) {
+                        typeof notification === 'string'
+                            ? dispatch((0, notifications_1.showNotification)(notification, DEFAULT_NOTIFICATION_LEVEL))
+                            : dispatch((0, notifications_1.showNotification)(notification.message, notification.level || DEFAULT_NOTIFICATION_LEVEL, notification.params));
                     }
                     setIsCopied(true);
                     setTimeout(function () { return setIsCopied(false); }, 1000);
-                    _a.label = 4;
-                case 4: return [2 /*return*/];
+                    _a.label = 3;
+                case 3: return [2 /*return*/];
             }
         });
-    }); }, [dispatch, isCopied, props.notification, props.value]);
-    if (props.disabled) {
-        return props.children;
-    }
-    return (react_1["default"].createElement("span", { className: props.className, onClick: onClick, "aria-hidden": 'true' },
-        props.children,
-        react_1["default"].createElement("input", { ref: inputRef, defaultValue: props.value, style: {
-                position: 'absolute',
-                height: 1,
-                width: 1,
-                top: 0,
-                opacity: 0
-            } })));
+    }); }, [dispatch, isCopied, notification, props]);
+    return components.ui.renderView(props.view || 'content.CopyToClipboardView', __assign(__assign({}, props), { onClick: onClick }));
 }
+CopyToClipboard.defaultProps = {
+    showCopyIcon: true
+};
 exports["default"] = CopyToClipboard;

package/ui/content/Menu/Menu.d.ts

@@ -1,6 +1,6 @@
 import React from 'react';
 import { IDropDownProps } from '../DropDown/DropDown';
-export interface IMenuItemProps {
+export interface IMenuItem {
     /**
      * Заголовок элемента меню
      */
@@ -22,7 +22,7 @@ export interface IMenuProps {
     /**
     *   Элементы меню
     */
-    items: IMenuItemProps[];
+    items: IMenuItem[];
     /**
     * Кастомная иконка, по клику на которую открывается меню
     */
@@ -34,7 +34,7 @@ export interface IMenuProps {
     /**
      * Пропсы для DropDown
      */
-    dropDownProps?: Omit<IDropDownProps, 'children' | 'content'>;
+    dropDownProps?: IDropDownProps;
     /**
      * Переопределение view React элемента меню для кастомизации отображения
      */

package/ui/content/index.d.ts

@@ -7,4 +7,5 @@ import Badge from './Badge';
 import { Detail, DetailItem } from './Detail';
 import Icon from './Icon';
 import Menu from './Menu';
-export { Avatar, AvatarGroup, Accordion, AccordionItem, Alert, Card, DropDown, Badge, Detail, DetailItem, Icon, Menu, };
+import CopyToClipboard from './CopyToClipboard';
+export { Avatar, AvatarGroup, Accordion, AccordionItem, Alert, Card, DropDown, Badge, Detail, DetailItem, Icon, Menu, CopyToClipboard, };

package/ui/content/index.js

@@ -3,7 +3,7 @@ var __importDefault = (this && this.__importDefault) || function (mod) {
     return (mod && mod.__esModule) ? mod : { "default": mod };
 };
 exports.__esModule = true;
-exports.Menu = exports.Icon = exports.DetailItem = exports.Detail = exports.Badge = exports.DropDown = exports.Card = exports.Alert = exports.AccordionItem = exports.Accordion = exports.AvatarGroup = exports.Avatar = void 0;
+exports.CopyToClipboard = exports.Menu = exports.Icon = exports.DetailItem = exports.Detail = exports.Badge = exports.DropDown = exports.Card = exports.Alert = exports.AccordionItem = exports.Accordion = exports.AvatarGroup = exports.Avatar = void 0;
 var Avatar_1 = require("./Avatar");
 exports.Avatar = Avatar_1.Avatar;
 exports.AvatarGroup = Avatar_1.AvatarGroup;
@@ -25,3 +25,5 @@ var Icon_1 = __importDefault(require("./Icon"));
 exports.Icon = Icon_1["default"];
 var Menu_1 = __importDefault(require("./Menu"));
 exports.Menu = Menu_1["default"];
+var CopyToClipboard_1 = __importDefault(require("./CopyToClipboard"));
+exports.CopyToClipboard = CopyToClipboard_1["default"];

package/ui/form/DropDownField/DropDownField.d.ts

@@ -1,5 +1,5 @@
 import React from 'react';
-import { IAccordionCommonViewProps } from 'src/ui/content/Accordion/Accordion';
+import { IAccordionItemViewProps } from 'src/ui/content/Accordion/Accordion';
 import { DataProviderItems, IDataProviderConfig } from '../../../hooks/useDataProvider';
 import { IDataSelectConfig } from '../../../hooks/useDataSelect';
 import { IFieldWrapperInputProps } from '../../form/Field/fieldWrapper';
@@ -16,7 +16,7 @@ export interface IDropDownFieldItem {
     contentType?: ContentType | string;
     contentSrc?: string | React.ReactElement;
 }
-export interface IDropDownFieldItemViewProps extends IAccordionCommonViewProps, Pick<IDropDownFieldProps, 'itemsContent'> {
+export interface IDropDownFieldItemViewProps extends IAccordionItemViewProps, Pick<IDropDownFieldProps, 'itemsContent'> {
     item: IDropDownFieldItem;
     size: Size;
     type: ItemSwitchType;

package/ui/form/ImageField/ImageField.d.ts

@@ -2,7 +2,7 @@ import ReactCropProps, { Crop } from 'react-image-crop';
 import { IModalProps } from '../../modal/Modal/Modal';
 import { IFileInput } from '../../../hooks/useFile';
 import { IFieldWrapperInputProps } from '../Field/fieldWrapper';
-export interface ICropInputProps {
+export interface ICropConfig {
     /**
      * Изначальные параметры обрезки изображения
      * @example {unit: 'px', aspect: 1, x: 0, y: 0, width: 200, height: 200}
@@ -41,7 +41,7 @@ export interface IImageFieldProps extends IFieldWrapperInputProps, Omit<IFileInp
     /**
      * Параметры обрезки
      */
-    crop?: ICropInputProps;
+    crop?: ICropConfig;
     /**
      * Название кнопки
      * @example 'Загрузить'
@@ -49,7 +49,7 @@ export interface IImageFieldProps extends IFieldWrapperInputProps, Omit<IFileInp
     label?: string;
     [key: string]: any;
 }
-export interface ICropOutputProps extends ICropInputProps {
+export interface ICropOutputProps extends ICropConfig {
     onSubmit: (crop: Crop, imageId: any) => void;
 }
 export interface IImageFieldModalViewProps extends IModalProps {

package/ui/layout/Tooltip/Tooltip.d.ts

@@ -4,13 +4,13 @@
  * @example 'top'
  */
 type TooltipPosition = 'top' | 'topLeft' | 'topRight' | 'bottom' | 'bottomLeft' | 'bottomRight' | 'left' | 'leftTop' | 'leftBottom' | 'right' | 'rightTop' | 'rightBottom' | string;
-export interface TooltipArrowPosition {
+export interface ITooltipArrowPosition {
     left?: number | string;
     right?: number | string;
     top?: number | string;
     bottom?: number | string;
 }
-export interface TooltipStylePosition {
+export interface ITooltipStylePosition {
     left: 'unset' | number;
     right: 'unset' | number;
     top: 'unset' | number;
@@ -47,12 +47,12 @@ export interface ITooltipProps {
     /**
      * Стили для абсолютного позиционирования подсказки
      */
-    style?: TooltipStylePosition;
+    style?: ITooltipStylePosition;
     /**
      * Стили для позиционирования стрелки
      * @example {left: 10}
      */
-    arrowPosition?: TooltipArrowPosition;
+    arrowPosition?: ITooltipArrowPosition;
     /**
      * Рассчет позиции подсказки
      */
@@ -63,7 +63,7 @@ export interface ITooltipViewProps extends ITooltipProps {
     isTooltipVisible: boolean;
     content: string | any;
     position: TooltipPosition;
-    style: TooltipStylePosition;
+    style: ITooltipStylePosition;
 }
 declare function Tooltip(props: ITooltipProps): JSX.Element;
 declare namespace Tooltip {

package/ui/layout/Tooltip/calculate.d.ts

@@ -1,6 +1,6 @@
-import { TooltipArrowPosition, TooltipStylePosition } from '../Tooltip/Tooltip';
+import { ITooltipArrowPosition, ITooltipStylePosition } from '../Tooltip/Tooltip';
 export default function calculate(gap: any, position: any, parentRef: any, tooltipSize: any, arrowSize: any): {
-    style: TooltipStylePosition;
+    style: ITooltipStylePosition;
     position: any;
-    arrowPosition: TooltipArrowPosition;
+    arrowPosition: ITooltipArrowPosition;
 };