@alfalab/core-components 27.9.0 → 27.12.0

package/pure-cell/component-0c0196e4.js

@@ -0,0 +1,57 @@
+var React = require('react');
+var getDataTestId = require('./getDataTestId-633f12d5.js');
+var coreComponentsButton = require('../button');
+
+function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'default' in e ? e : { 'default': e }; }
+
+var React__default = /*#__PURE__*/_interopDefaultLegacy(React);
+
+/*! *****************************************************************************
+Copyright (c) Microsoft Corporation.
+
+Permission to use, copy, modify, and/or distribute this software for any
+purpose with or without fee is hereby granted.
+
+THE SOFTWARE IS PROVIDED "AS IS" AND THE AUTHOR DISCLAIMS ALL WARRANTIES WITH
+REGARD TO THIS SOFTWARE INCLUDING ALL IMPLIED WARRANTIES OF MERCHANTABILITY
+AND FITNESS. IN NO EVENT SHALL THE AUTHOR BE LIABLE FOR ANY SPECIAL, DIRECT,
+INDIRECT, OR CONSEQUENTIAL DAMAGES OR ANY DAMAGES WHATSOEVER RESULTING FROM
+LOSS OF USE, DATA OR PROFITS, WHETHER IN AN ACTION OF CONTRACT, NEGLIGENCE OR
+OTHER TORTIOUS ACTION, ARISING OUT OF OR IN CONNECTION WITH THE USE OR
+PERFORMANCE OF THIS SOFTWARE.
+***************************************************************************** */
+exports.__assign = function () {
+    exports.__assign = Object.assign || function __assign(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 exports.__assign.apply(this, arguments);
+};
+function __rest(s, e) {
+    var t = {};
+    for (var p in s)
+        if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0)
+            t[p] = s[p];
+    if (s != null && typeof Object.getOwnPropertySymbols === "function")
+        for (var i = 0, p = Object.getOwnPropertySymbols(s); i < p.length; i++) {
+            if (e.indexOf(p[i]) < 0 && Object.prototype.propertyIsEnumerable.call(s, p[i]))
+                t[p[i]] = s[p[i]];
+        }
+    return t;
+}
+
+var styles = {"component":"pure-cell__component_xjoiw"};
+require('./components/footer-button/index.css');
+
+var FooterButton = function (_a) {
+    var children = _a.children, dataTestId = _a.dataTestId, props = __rest(_a, ["children", "dataTestId"]);
+    return (React__default['default'].createElement(coreComponentsButton.Button, exports.__assign({}, props, { size: 'xxs', dataTestId: getDataTestId.getDataTestId(dataTestId, 'button'), className: styles.component }), children));
+};
+
+exports.FooterButton = FooterButton;
+exports.__rest = __rest;

package/pure-cell/component-7b7f28f3.d.ts

@@ -0,0 +1,107 @@
+/// <reference types="react" />
+import React from 'react';
+import { AnchorHTMLAttributes, ButtonHTMLAttributes, ElementType, HTMLAttributes } from "react";
+import { PureCellElement } from "./components/types";
+type PureCellContext = {
+    /** Направление */
+    direction?: 'horizontal' | 'vertical';
+};
+declare const PureCellContext: React.Context<PureCellContext>;
+type PureCellProps = {
+    /**
+     * Направление
+     */
+    direction?: 'horizontal' | 'vertical';
+    /**
+     * Сss класс для стилизации общей обёртки
+     */
+    className?: string;
+    /**
+     * Выводит ссылку в виде ячейки
+     */
+    href?: string;
+    /**
+     * Вертикальные отступы
+     */
+    verticalPadding?: 'airy' | 'default' | 'compact' | 'tiny' | 'none';
+    /**
+     * Горизонтальные отступы
+     */
+    horizontalPadding?: 'left' | 'right' | 'both' | 'none';
+    /**
+     * Позволяет использовать кастомный компонент для кнопки (например Link из роутера)
+     */
+    tag?: ElementType;
+    /**
+     * Компоненты
+     */
+    children: PureCellElement;
+    /**
+     * Идентификатор для систем автоматизированного тестирования
+     */
+    dataTestId?: string;
+};
+type AnchorPureCellProps = PureCellProps & AnchorHTMLAttributes<HTMLAnchorElement>;
+type ButtonPureCellProps = PureCellProps & ButtonHTMLAttributes<HTMLButtonElement>;
+type ElementPureCellProps = PureCellProps & HTMLAttributes<HTMLElement>;
+/**
+ * Универсальный конструктор для сборки любой ячейки.
+ *
+ * [Макет](https://www.figma.com/file/KlFOLLkKO8rtvvQE3RXuhq/Click-Library?node-id=43525%3A240018)
+ */
+declare const PureCell: React.ForwardRefExoticComponent<(Partial<AnchorPureCellProps> & React.RefAttributes<HTMLElement>) | (Partial<ButtonPureCellProps> & React.RefAttributes<HTMLElement>) | (Partial<ElementPureCellProps> & React.RefAttributes<HTMLElement>)> & {
+    Main: React.FC<{
+        children: import("./components/types").MainElement;
+        isReverse?: boolean | undefined;
+        dataTestId?: string | undefined;
+    }>;
+    Graphics: React.FC<import("./components/graphics/index").Props>;
+    Content: React.FC<{
+        children: import("./components/types").ContentElement;
+        dataTestId?: string | undefined;
+    }>;
+    Text: React.FC<{
+        rowLimit?: 1 | 2 | undefined;
+        isMultiline?: boolean | undefined;
+        view: "primary-small" | "component";
+        titleColor: "tertiary" | "disabled" | "accent" | "primary" | "attention" | "positive" | "secondary" | "tertiary-inverted" | "primary-inverted" | "secondary-inverted" | "link" | "negative";
+        value?: string | undefined;
+        valueColor?: "tertiary" | "disabled" | "accent" | "primary" | "attention" | "positive" | "secondary" | "tertiary-inverted" | "primary-inverted" | "secondary-inverted" | "link" | "negative" | undefined;
+        dataTestId?: string | undefined;
+    }>;
+    Amount: React.FC<{
+        amount: import("./components/typesProps").AmountProps;
+        weight?: "bold" | "normal" | undefined;
+        view?: "primary-small" | "component" | undefined;
+        color?: "tertiary" | "disabled" | "accent" | "primary" | "attention" | "positive" | "secondary" | "tertiary-inverted" | "primary-inverted" | "secondary-inverted" | "link" | "negative" | undefined;
+        dataTestId?: string | undefined;
+    }>;
+    AmountTitle: React.FC<{
+        amount: import("./components/typesProps").AmountProps;
+        color?: "tertiary" | "disabled" | "accent" | "primary" | "attention" | "positive" | "secondary" | "tertiary-inverted" | "primary-inverted" | "secondary-inverted" | "link" | "negative" | undefined;
+        dataTestId?: string | undefined;
+    }>;
+    Addon: React.FC<{
+        verticalAlign?: "center" | undefined;
+        addonPadding?: "none" | "default" | undefined;
+        children: import("./components/types").AddonElement;
+        dataTestId?: string | undefined;
+    }>;
+    Footer: React.FC<{
+        children: import("./components/types").FooterElement;
+        footerPadding?: "none" | "default" | undefined;
+        dataTestId?: string | undefined;
+    }>;
+    ExtraSubtitle: React.FC<import("./components/footer-text/index").Props>;
+    FooterButton: React.FC<Partial<import("packages/button/src").ComponentProps & React.AnchorHTMLAttributes<HTMLAnchorElement>> | Partial<import("packages/button/src").ComponentProps & React.ButtonHTMLAttributes<HTMLButtonElement>>>;
+    Comment: React.FC<{
+        children: import("./components/types").CommentElement;
+        dataTestId?: string | undefined;
+    }>;
+    Category: React.FC<{
+        categoryName: string;
+        categoryPercent?: number | undefined;
+        dataTestId?: string | undefined;
+    }>;
+};
+export { PureCellContext, PureCellProps, PureCell };

package/pure-cell/component-d20d86f7.d.ts

@@ -0,0 +1,62 @@
+/// <reference types="react" />
+import React from "react";
+import { MainElement, ContentElement } from "./components/types";
+import { Color } from "../typography";
+type Props = {
+    /**
+     * Компоненты
+     */
+    children: MainElement;
+    /**
+     * Позволяет изменить расположение блоков внутри main
+     */
+    isReverse?: boolean;
+    /**
+     * Идентификатор для систем автоматизированного тестирования
+     */
+    dataTestId?: string;
+};
+declare const Main: React.FC<Props>;
+type Props$0 = {
+    /**
+     * Компоненты
+     */
+    children: ContentElement;
+    /**
+     * Идентификатор для систем автоматизированного тестирования
+     */
+    dataTestId?: string;
+};
+declare const Content: React.FC<Props$0>;
+type Props$1 = {
+    /**
+     * Количество строк
+     */
+    rowLimit?: 1 | 2;
+    /**
+     * Многострочный ли компонент
+     */
+    isMultiline?: boolean;
+    /**
+     * Размер текста
+     */
+    view: 'primary-small' | 'component';
+    /**
+     * Цвет title
+     */
+    titleColor: Color;
+    /**
+     * Value ячейки
+     */
+    value?: string;
+    /**
+     * Цвет value
+     */
+    valueColor?: Color;
+    /**
+     * Идентификатор для систем автоматизированного тестирования
+     */
+    dataTestId?: string;
+};
+declare const Text: React.FC<Props$1>;
+export { Main, Content, Text };

package/pure-cell/component-d20d86f7.js

@@ -0,0 +1,118 @@
+var components_footerButton_component = require('./component-0c0196e4.js');
+var React = require('react');
+var mergeRefs = require('react-merge-refs');
+var cn = require('classnames');
+var hooks = require('@alfalab/hooks');
+var getDataTestId = require('./getDataTestId-633f12d5.js');
+var components_addon_component = require('./components/addon/component.js');
+var coreComponentsTypography = require('../typography');
+var components_amount_component = require('./components/amount/component.js');
+var components_amountTitle_component = require('./components/amount-title/component.js');
+var components_category_component = require('./components/category/component.js');
+var components_comment_component = require('./components/comment/component.js');
+var components_footer_component = require('./components/footer/component.js');
+var components_footerText_component = require('./components/footer-text/component.js');
+var components_graphics_component = require('./components/graphics/component.js');
+
+function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'default' in e ? e : { 'default': e }; }
+
+var React__default = /*#__PURE__*/_interopDefaultLegacy(React);
+var mergeRefs__default = /*#__PURE__*/_interopDefaultLegacy(mergeRefs);
+var cn__default = /*#__PURE__*/_interopDefaultLegacy(cn);
+
+var styles = {"component":"pure-cell__component_mpc34","horizontal":"pure-cell__horizontal_mpc34"};
+require('./components/content/index.css');
+
+var Content = function (_a) {
+    var _b;
+    var children = _a.children, dataTestId = _a.dataTestId;
+    var direction = React.useContext(PureCellContext).direction;
+    return (React__default['default'].createElement("section", { className: cn__default['default'](styles.component, (_b = {}, _b[styles.horizontal] = direction === 'horizontal', _b)), "data-test-id": getDataTestId.getDataTestId(dataTestId, 'content') }, children));
+};
+
+var styles$1 = {"component":"pure-cell__component_1df7b","vertical":"pure-cell__vertical_1df7b","reverse":"pure-cell__reverse_1df7b"};
+require('./components/main/index.css');
+
+var Main = function (_a) {
+    var _b;
+    var children = _a.children, isReverse = _a.isReverse, dataTestId = _a.dataTestId;
+    var _c = React.useContext(PureCellContext).direction, direction = _c === void 0 ? 'horizontal' : _c;
+    return (React__default['default'].createElement("main", { className: cn__default['default'](styles$1.component, styles$1[direction], (_b = {},
+            _b[styles$1.reverse] = isReverse,
+            _b)), "data-test-id": getDataTestId.getDataTestId(dataTestId, 'main') }, children));
+};
+
+var styles$2 = {"horizontal":"pure-cell__horizontal_1ki50","rowLimit1":"pure-cell__rowLimit1_1ki50","rowLimit2":"pure-cell__rowLimit2_1ki50","component":"pure-cell__component_1ki50","multiline":"pure-cell__multiline_1ki50","vertical":"pure-cell__vertical_1ki50","title":"pure-cell__title_1ki50"};
+require('./components/text/index.css');
+
+var Text = function (_a) {
+    var _b, _c, _d;
+    var children = _a.children, value = _a.value, rowLimit = _a.rowLimit, isMultiline = _a.isMultiline, _e = _a.view, view = _e === void 0 ? 'component' : _e, titleColor = _a.titleColor, valueColor = _a.valueColor, dataTestId = _a.dataTestId;
+    var _f = React.useContext(PureCellContext).direction, direction = _f === void 0 ? 'horizontal' : _f;
+    return (React__default['default'].createElement("div", { className: cn__default['default'](styles$2.component, (_b = {},
+            _b[styles$2.vertical] = direction !== 'horizontal',
+            _b)) },
+        React__default['default'].createElement("span", { className: cn__default['default'](styles$2.title) },
+            React__default['default'].createElement(coreComponentsTypography.Typography.Text, { view: view, color: titleColor, className: cn__default['default'](rowLimit && styles$2["rowLimit" + rowLimit], (_c = {},
+                    _c[styles$2.rowLimit1] = !isMultiline,
+                    _c)), "data-test-id": getDataTestId.getDataTestId(dataTestId, 'text') }, children)),
+        React__default['default'].createElement("span", null,
+            React__default['default'].createElement(coreComponentsTypography.Typography.Text, { view: view, color: valueColor, className: cn__default['default']((_d = {},
+                    _d[styles$2["rowLimit" + rowLimit]] = rowLimit,
+                    _d[styles$2.multiline] = isMultiline,
+                    _d)), "data-test-id": getDataTestId.getDataTestId(dataTestId, 'text') }, value))));
+};
+
+var styles$3 = {"component":"pure-cell__component_1fn40","horizontal":"pure-cell__horizontal_1fn40","vertical":"pure-cell__vertical_1fn40","button":"pure-cell__button_1fn40","link":"pure-cell__link_1fn40","none":"pure-cell__none_1fn40","airy":"pure-cell__airy_1fn40","default":"pure-cell__default_1fn40","compact":"pure-cell__compact_1fn40","tiny":"pure-cell__tiny_1fn40","left":"pure-cell__left_1fn40","right":"pure-cell__right_1fn40","both":"pure-cell__both_1fn40","focused":"pure-cell__focused_1fn40"};
+require('./index.css');
+
+var PureCellContext = React__default['default'].createContext({});
+var PureCellComponent = React.forwardRef(function (_a, ref) {
+    var _b, _c;
+    var className = _a.className, dataTestId = _a.dataTestId, onClick = _a.onClick, href = _a.href, _d = _a.tag, Component = _d === void 0 ? (href && 'a') || (onClick && 'button') || 'section' : _d, children = _a.children, _e = _a.horizontalPadding, horizontalPadding = _e === void 0 ? 'default' : _e, _f = _a.verticalPadding, verticalPadding = _f === void 0 ? 'none' : _f, _g = _a.direction, direction = _g === void 0 ? 'horizontal' : _g, restProps = components_footerButton_component.__rest(_a, ["className", "dataTestId", "onClick", "href", "tag", "children", "horizontalPadding", "verticalPadding", "direction"]);
+    var cellRef = React.useRef(null);
+    var focused = hooks.useFocus(cellRef, 'keyboard')[0];
+    var addClasses = (_b = {},
+        _b[styles$3.component] = true,
+        _b[styles$3.focused] = focused,
+        _b[styles$3[direction]] = true,
+        _b);
+    if (href) {
+        var target = restProps.target;
+        // Для совместимости с react-router-dom, меняем href на to
+        var hrefProps = (_c = {}, _c[typeof Component === 'string' ? 'href' : 'to'] = href, _c);
+        return (React__default['default'].createElement(Component, components_footerButton_component.__assign({ rel: target === '_blank' ? 'noreferrer noopener' : undefined }, restProps, hrefProps, { ref: mergeRefs__default['default']([cellRef, ref]), className: cn__default['default'](styles$3.link, addClasses, className, styles$3[horizontalPadding], styles$3[verticalPadding]), "data-test-id": dataTestId }),
+            React__default['default'].createElement(PureCellContext.Provider, { value: { direction: direction } }, children)));
+    }
+    if (onClick) {
+        return (React__default['default'].createElement(Component, components_footerButton_component.__assign({}, restProps, { ref: mergeRefs__default['default']([cellRef, ref]), className: cn__default['default'](styles$3.button, addClasses, styles$3[horizontalPadding], styles$3[verticalPadding], className), "data-test-id": dataTestId, onClick: onClick }),
+            React__default['default'].createElement(PureCellContext.Provider, { value: { direction: direction } }, children)));
+    }
+    return (React__default['default'].createElement(Component, { ref: ref, tabIndex: 0, className: cn__default['default'](addClasses, styles$3[horizontalPadding], styles$3[verticalPadding], className), "data-test-id": dataTestId },
+        React__default['default'].createElement(PureCellContext.Provider, { value: { direction: direction } }, children)));
+});
+/**
+ * Универсальный конструктор для сборки любой ячейки.
+ *
+ * [Макет](https://www.figma.com/file/KlFOLLkKO8rtvvQE3RXuhq/Click-Library?node-id=43525%3A240018)
+ */
+var PureCell = Object.assign(PureCellComponent, {
+    Main: Main,
+    Graphics: components_graphics_component.Graphics,
+    Content: Content,
+    Text: Text,
+    Amount: components_amount_component.Amount,
+    AmountTitle: components_amountTitle_component.AmountTitle,
+    Addon: components_addon_component.Addon,
+    Footer: components_footer_component.Footer,
+    ExtraSubtitle: components_footerText_component.FooterText,
+    FooterButton: components_footerButton_component.FooterButton,
+    Comment: components_comment_component.Comment,
+    Category: components_category_component.Category,
+});
+
+exports.Content = Content;
+exports.Main = Main;
+exports.PureCell = PureCell;
+exports.PureCellContext = PureCellContext;
+exports.Text = Text;

package/pure-cell/component.js

@@ -0,0 +1,25 @@
+Object.defineProperty(exports, '__esModule', { value: true });
+
+require('./component-0c0196e4.js');
+require('react');
+require('react-merge-refs');
+require('classnames');
+require('@alfalab/hooks');
+require('./getDataTestId-633f12d5.js');
+require('./components/addon/component.js');
+require('../typography');
+require('../amount');
+require('./components/amount/component.js');
+require('./components/amount-title/component.js');
+require('./components/category/component.js');
+require('./components/comment/component.js');
+var components_content_component = require('./component-d20d86f7.js');
+require('./components/footer/component.js');
+require('../button');
+require('./components/footer-text/component.js');
+require('./components/graphics/component.js');
+
+
+
+exports.PureCell = components_content_component.PureCell;
+exports.PureCellContext = components_content_component.PureCellContext;

package/pure-cell/components/addon/component.d.ts

@@ -0,0 +1,23 @@
+/// <reference types="react" />
+import React from 'react';
+import { AddonElement } from "../types";
+type Props = {
+    /**
+     * Вертикальное выравнивание
+     */
+    verticalAlign?: 'center';
+    /**
+     * Горизонтальные отступы
+     */
+    addonPadding?: 'default' | 'none';
+    /**
+     * Компоненты
+     */
+    children: AddonElement;
+    /**
+     * Идентификатор для систем автоматизированного тестирования
+     */
+    dataTestId?: string;
+};
+declare const Addon: React.FC<Props>;
+export { Addon };

package/pure-cell/components/addon/component.js

@@ -0,0 +1,23 @@
+Object.defineProperty(exports, '__esModule', { value: true });
+
+var React = require('react');
+var cn = require('classnames');
+var getDataTestId = require('../../getDataTestId-633f12d5.js');
+
+function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'default' in e ? e : { 'default': e }; }
+
+var React__default = /*#__PURE__*/_interopDefaultLegacy(React);
+var cn__default = /*#__PURE__*/_interopDefaultLegacy(cn);
+
+var styles = {"component":"pure-cell__component_11g7k","none":"pure-cell__none_11g7k","default":"pure-cell__default_11g7k","center":"pure-cell__center_11g7k"};
+require('./index.css');
+
+var Addon = function (_a) {
+    var _b;
+    var children = _a.children, verticalAlign = _a.verticalAlign, _c = _a.addonPadding, addonPadding = _c === void 0 ? 'default' : _c, dataTestId = _a.dataTestId;
+    return (React__default['default'].createElement("section", { className: cn__default['default'](styles.component, styles[addonPadding], (_b = {},
+            _b[styles.center] = verticalAlign,
+            _b)), "data-test-id": getDataTestId.getDataTestId(dataTestId, 'addon') }, children));
+};
+
+exports.Addon = Addon;