@itcase/ui 1.3.24 → 1.3.26
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/{Badge-Bcj5H3vs.js → Badge-CcaG-4ly.js} +49 -8
- package/dist/{Badge-DxHwStfq.js → Badge-CoHPvO35.js} +49 -8
- package/dist/{Button-BSygAkO5.js → Button-BFX_EEum.js} +6 -6
- package/dist/{Button-Bn8Mjoeh.js → Button-BSzqA8CB.js} +6 -6
- package/dist/{DropdownItem-CExjlJjQ.js → DropdownItem-Bq-oPnWX.js} +4 -4
- package/dist/{DropdownItem-DFE1HsyX.js → DropdownItem-FNOztnTT.js} +4 -4
- package/dist/{Group-CIIZoSm5.js → Group-B9L2NTgM.js} +1 -1
- package/dist/{Group-pMTTxQH4.js → Group-D6CXN4hS.js} +1 -1
- package/dist/{Icon-DotE-03d.js → Icon-BZa8B7te.js} +3 -3
- package/dist/{Icon-ByLHEhHL.js → Icon-B_bS-o4g.js} +2 -2
- package/dist/{Input-Ck5IbuH6.js → Input-BrV5_NoV.js} +1 -1
- package/dist/{Input-zkYoZhQk.js → Input-ffioh1sj.js} +1 -1
- package/dist/{Label-9O3dQlUa.js → Label-DQyB2ThM.js} +6 -6
- package/dist/{Label-GEBQXoVJ.js → Label-HKRKV3mn.js} +6 -6
- package/dist/{Link-CoAhRbFg.js → Link-CxWmYMyL.js} +1 -1
- package/dist/{Link-C53o3P6_.js → Link-DN2LhPjD.js} +4 -4
- package/dist/{Loader-D_53c71f.js → Loader-Dn036JwE.js} +2 -2
- package/dist/{Loader-Cm98w6lJ.js → Loader-K_DJmah6.js} +2 -2
- package/dist/{MenuItem-Cu6wlj-X.js → MenuItem-CLDNk2l8.js} +3 -3
- package/dist/{MenuItem-Ybh5Mpoi.js → MenuItem-amqx61Y0.js} +3 -3
- package/dist/{Scrollbar-DkJr3S-w.js → Scrollbar-Bo7z7ELm.js} +1 -1
- package/dist/{Scrollbar-CL9V8d1X.js → Scrollbar-CKbA0jQU.js} +1 -1
- package/dist/{Text-COHpLTYr.js → Text-Beslj4Ns.js} +1 -1
- package/dist/{Text-D9sEeRE4.js → Text-JayJa3hj.js} +1 -1
- package/dist/{Title-Cl95USIn.js → Title-CHgrIarR.js} +1 -1
- package/dist/{Title-BduD-TXE.js → Title-DBaHcpvB.js} +1 -1
- package/dist/{Tooltip-BsbXMzGd.js → Tooltip-1Jbub0K6.js} +4 -4
- package/dist/{Tooltip-CyZCVyba.js → Tooltip-CNua1g76.js} +4 -4
- package/dist/cjs/components/Accordion.js +8 -7
- package/dist/cjs/components/Avatar.js +10 -9
- package/dist/cjs/components/Badge.js +4 -3
- package/dist/cjs/components/Breadcrumbs.js +7 -6
- package/dist/cjs/components/Button.js +8 -7
- package/dist/cjs/components/Caption.js +1 -0
- package/dist/cjs/components/Card.js +3 -2
- package/dist/cjs/components/Cell.js +10 -9
- package/dist/cjs/components/Checkbox.js +4 -3
- package/dist/cjs/components/Checkmark.js +65 -0
- package/dist/cjs/components/Chips.js +5 -4
- package/dist/cjs/components/Choice.js +11 -10
- package/dist/cjs/components/Code.js +4 -3
- package/dist/cjs/components/CookiesWarning.js +11 -10
- package/dist/cjs/components/DadataHintField.js +2 -1
- package/dist/cjs/components/DatePicker.js +17 -16
- package/dist/cjs/components/Divider.js +1 -0
- package/dist/cjs/components/Dot.js +1 -0
- package/dist/cjs/components/Dropdown.js +4 -3
- package/dist/cjs/components/Flex.js +3 -2
- package/dist/cjs/components/Grid.js +3 -2
- package/dist/cjs/components/Group.js +2 -1
- package/dist/cjs/components/HTMLContent.js +1 -0
- package/dist/cjs/components/HeroTitle.js +2 -1
- package/dist/cjs/components/Icon.js +6 -5
- package/dist/cjs/components/Image.js +1 -0
- package/dist/cjs/components/Input.js +2 -1
- package/dist/cjs/components/InputMask.js +2 -1
- package/dist/cjs/components/InputPassword.js +6 -5
- package/dist/cjs/components/Label.js +5 -4
- package/dist/cjs/components/Link.js +2 -1
- package/dist/cjs/components/List.js +2 -1
- package/dist/cjs/components/Loader.js +3 -2
- package/dist/cjs/components/Logo.js +3 -2
- package/dist/cjs/components/Menu.js +5 -4
- package/dist/cjs/components/MenuItem.js +4 -3
- package/dist/cjs/components/Modal.js +6 -5
- package/dist/cjs/components/ModalSheetBottom.js +1 -0
- package/dist/cjs/components/Notification.js +4 -5
- package/dist/cjs/components/Overlay.js +1 -0
- package/dist/cjs/components/Pagination.js +29 -28
- package/dist/cjs/components/Panel.js +3 -2
- package/dist/cjs/components/Radio.js +4 -3
- package/dist/cjs/components/RangeSlider.js +1 -0
- package/dist/cjs/components/Response.js +82 -57
- package/dist/cjs/components/SVGContent.js +1 -0
- package/dist/cjs/components/ScrollOnDrag.js +1 -0
- package/dist/cjs/components/ScrollToView.js +2 -1
- package/dist/cjs/components/Scrollbar.js +1 -1
- package/dist/cjs/components/Search.js +10 -9
- package/dist/cjs/components/Segmented.js +14 -13
- package/dist/cjs/components/Select.js +28 -12
- package/dist/cjs/components/SiteMenu.js +7 -6
- package/dist/cjs/components/Swiper.js +9 -8
- package/dist/cjs/components/Tab.js +10 -9
- package/dist/cjs/components/Text.js +2 -1
- package/dist/cjs/components/Textarea.js +1 -0
- package/dist/cjs/components/Tile.js +5 -4
- package/dist/cjs/components/Title.js +2 -1
- package/dist/cjs/components/Tooltip.js +4 -3
- package/dist/cjs/components/Video.js +1 -0
- package/dist/cjs/components/Wrapper.js +2 -1
- package/dist/cjs/context/Notifications.js +6 -6
- package/dist/cjs/context/UIContext.js +6 -1
- package/dist/cjs/hooks/useDeviceTargetClass.js +1 -0
- package/dist/cjs/hooks/useDeviceTargetClassGenerator.interface.js +1 -0
- package/dist/cjs/hooks/useDeviceTargetClassGenerator.js +5 -4
- package/dist/cjs/hooks/useMediaQueries.js +0 -12
- package/dist/cjs/hooks/useStyles.js +1 -0
- package/dist/cjs/hooks.js +0 -1
- package/dist/cjs/utils/setViewportProperty.js +8 -0
- package/dist/cjs/utils.js +7 -0
- package/dist/components/Accordion.js +9 -8
- package/dist/components/Avatar.js +11 -10
- package/dist/components/Badge.js +4 -3
- package/dist/components/Breadcrumbs.js +8 -7
- package/dist/components/Button.js +9 -8
- package/dist/components/Caption.js +2 -1
- package/dist/components/Card.js +4 -3
- package/dist/components/Cell.js +11 -10
- package/dist/components/Checkbox.js +5 -4
- package/dist/components/Checkmark.js +61 -0
- package/dist/components/Chips.js +6 -5
- package/dist/components/Choice.js +12 -11
- package/dist/components/Code.js +5 -4
- package/dist/components/CookiesWarning.js +12 -11
- package/dist/components/DadataHintField.js +3 -2
- package/dist/components/DatePicker.js +18 -17
- package/dist/components/Divider.js +2 -1
- package/dist/components/Dot.js +2 -1
- package/dist/components/Dropdown.js +5 -4
- package/dist/components/Flex.js +4 -3
- package/dist/components/Grid.js +4 -3
- package/dist/components/Group.js +3 -2
- package/dist/components/HTMLContent.js +2 -1
- package/dist/components/HeroTitle.js +3 -2
- package/dist/components/Icon.js +7 -6
- package/dist/components/Image.js +2 -1
- package/dist/components/Input.js +3 -2
- package/dist/components/InputMask.js +3 -2
- package/dist/components/InputPassword.js +7 -6
- package/dist/components/Label.js +6 -5
- package/dist/components/Link.js +3 -2
- package/dist/components/List.js +3 -2
- package/dist/components/Loader.js +4 -3
- package/dist/components/Logo.js +4 -3
- package/dist/components/Menu.js +6 -5
- package/dist/components/MenuItem.js +5 -4
- package/dist/components/Modal.js +7 -6
- package/dist/components/ModalSheetBottom.js +2 -1
- package/dist/components/Notification.js +5 -6
- package/dist/components/Overlay.js +2 -1
- package/dist/components/Pagination.js +30 -29
- package/dist/components/Panel.js +4 -3
- package/dist/components/Radio.js +5 -4
- package/dist/components/RangeSlider.js +2 -1
- package/dist/components/Response.js +83 -58
- package/dist/components/SVGContent.js +2 -1
- package/dist/components/ScrollOnDrag.js +2 -1
- package/dist/components/ScrollToView.js +3 -2
- package/dist/components/Scrollbar.js +1 -1
- package/dist/components/Search.js +11 -10
- package/dist/components/Segmented.js +15 -14
- package/dist/components/Select.js +29 -13
- package/dist/components/SiteMenu.js +8 -7
- package/dist/components/Swiper.js +10 -9
- package/dist/components/Tab.js +11 -10
- package/dist/components/Text.js +3 -2
- package/dist/components/Textarea.js +2 -1
- package/dist/components/Tile.js +6 -5
- package/dist/components/Title.js +3 -2
- package/dist/components/Tooltip.js +5 -4
- package/dist/components/Video.js +1 -0
- package/dist/components/Wrapper.js +3 -2
- package/dist/context/Notifications.js +7 -7
- package/dist/context/UIContext.js +7 -2
- package/dist/css/components/Checkmark/Checkmark.css +30 -0
- package/dist/css/components/Checkmark/Checkmark.tokens.css +16 -0
- package/dist/css/components/Code/Code.css +2 -1
- package/dist/css/components/Dropdown/Dropdown.css +1 -1
- package/dist/css/components/Notification/Notification.css +6 -2
- package/dist/css/components/Notification/css/__item/notification__item_set_form.css +6 -2
- package/dist/css/components/Pagination/Pagination.css +4 -4
- package/dist/css/components/Pagination/css/__item/pagination__item_state_active.css +4 -4
- package/dist/css/components/Response/Response.css +10 -2
- package/dist/css/components/Swiper/Swiper.css +2 -2
- package/dist/css/components/Switch/Switch.css +1 -1
- package/dist/css/components/Tile/Tile.css +1 -1
- package/dist/css/tokens/colors.css +9 -0
- package/dist/hooks/useDeviceTargetClass.js +1 -0
- package/dist/hooks/useDeviceTargetClassGenerator.interface.js +1 -1
- package/dist/hooks/useDeviceTargetClassGenerator.js +6 -5
- package/dist/hooks/useMediaQueries.js +0 -12
- package/dist/hooks/useStyles.js +1 -0
- package/dist/hooks.js +1 -1
- package/dist/stories/Checkmark.mdx +11 -0
- package/dist/stories/Overview.mdx +5 -5
- package/dist/stories/Playground.mdx +4 -4
- package/dist/{tslib.es6-5FtW-kfi.js → tslib.es6-Bwu1Cn-t.js} +1 -1
- package/dist/types/components/Badge/stories/args.d.ts +69 -0
- package/dist/types/components/Checkmark/Checkmark.appearance.d.ts +2 -0
- package/dist/types/components/Checkmark/Checkmark.d.ts +4 -0
- package/dist/types/components/Checkmark/Checkmark.interface.d.ts +29 -0
- package/dist/types/components/Checkmark/index.d.ts +2 -0
- package/dist/types/components/Notification/Notification.interface.d.ts +3 -3
- package/dist/types/components/Select/index.d.ts +15 -15
- package/dist/types/utils/index.d.ts +2 -0
- package/dist/types/utils/setViewportProperty.d.ts +2 -0
- package/dist/utils/setViewportProperty.js +6 -0
- package/dist/utils.js +1 -0
- package/package.json +29 -53
|
@@ -4,7 +4,7 @@ var jsxRuntime = require('react/jsx-runtime');
|
|
|
4
4
|
var clsx = require('clsx');
|
|
5
5
|
var useDeviceTargetClassGenerator = require('./cjs/hooks/useDeviceTargetClassGenerator.js');
|
|
6
6
|
var useStyles = require('./cjs/hooks/useStyles.js');
|
|
7
|
-
var Text = require('./Text-
|
|
7
|
+
var Text = require('./Text-Beslj4Ns.js');
|
|
8
8
|
|
|
9
9
|
var loaderAppearance = {
|
|
10
10
|
accent: {
|
|
@@ -48,7 +48,7 @@ function Loader(props) {
|
|
|
48
48
|
var fillClass = classGenerator.fillClass, heightClass = classGenerator.heightClass, itemFillClass = classGenerator.itemFillClass, positionClass = classGenerator.positionClass, widthClass = classGenerator.widthClass;
|
|
49
49
|
// @ts-expect-error
|
|
50
50
|
var loader = useStyles.useStyles(props).styles;
|
|
51
|
-
return (jsxRuntime.jsxs("div", { className: clsx('loader', positionClass && "position_".concat(positionClass), widthClass && "width_".concat(widthClass), heightClass && "height_".concat(heightClass), fillClass && "fill_".concat(fillClass), className, set && "loader_set_".concat(set)), style: loader, children: [children || (jsxRuntime.jsxs("div", { className: "loader__inner", children: [jsxRuntime.jsx("span", { className: clsx('loader__item', itemFillClass && "fill_".concat(itemFillClass)) }), jsxRuntime.jsx("span", { className: clsx('loader__item', itemFillClass && "fill_".concat(itemFillClass)) }), jsxRuntime.jsx("span", { className: clsx('loader__item', itemFillClass && "fill_".concat(itemFillClass)) })] })), text && (jsxRuntime.jsx(Text.Text, { className: "loader__text", size: textSize || (appearanceConfig === null || appearanceConfig ===
|
|
51
|
+
return (jsxRuntime.jsxs("div", { className: clsx('loader', positionClass && "position_".concat(positionClass), widthClass && "width_".concat(widthClass), heightClass && "height_".concat(heightClass), fillClass && "fill_".concat(fillClass), className, set && "loader_set_".concat(set)), style: loader, children: [children || (jsxRuntime.jsxs("div", { className: "loader__inner", children: [jsxRuntime.jsx("span", { className: clsx('loader__item', itemFillClass && "fill_".concat(itemFillClass)) }), jsxRuntime.jsx("span", { className: clsx('loader__item', itemFillClass && "fill_".concat(itemFillClass)) }), jsxRuntime.jsx("span", { className: clsx('loader__item', itemFillClass && "fill_".concat(itemFillClass)) })] })), text && (jsxRuntime.jsx(Text.Text, { className: "loader__text", size: textSize || (appearanceConfig === null || appearanceConfig === void 0 ? void 0 : appearanceConfig.textSize), textColor: textColor || (appearanceConfig === null || appearanceConfig === void 0 ? void 0 : appearanceConfig.textColor), children: text }))] }));
|
|
52
52
|
}
|
|
53
53
|
|
|
54
54
|
exports.Loader = Loader;
|
|
@@ -2,7 +2,7 @@ import { jsxs, jsx } from 'react/jsx-runtime';
|
|
|
2
2
|
import clsx from 'clsx';
|
|
3
3
|
import { useDeviceTargetClassGenerator } from './hooks/useDeviceTargetClassGenerator.js';
|
|
4
4
|
import { useStyles } from './hooks/useStyles.js';
|
|
5
|
-
import { T as Text } from './Text-
|
|
5
|
+
import { T as Text } from './Text-JayJa3hj.js';
|
|
6
6
|
|
|
7
7
|
var loaderAppearance = {
|
|
8
8
|
accent: {
|
|
@@ -46,7 +46,7 @@ function Loader(props) {
|
|
|
46
46
|
var fillClass = classGenerator.fillClass, heightClass = classGenerator.heightClass, itemFillClass = classGenerator.itemFillClass, positionClass = classGenerator.positionClass, widthClass = classGenerator.widthClass;
|
|
47
47
|
// @ts-expect-error
|
|
48
48
|
var loader = useStyles(props).styles;
|
|
49
|
-
return (jsxs("div", { className: clsx('loader', positionClass && "position_".concat(positionClass), widthClass && "width_".concat(widthClass), heightClass && "height_".concat(heightClass), fillClass && "fill_".concat(fillClass), className, set && "loader_set_".concat(set)), style: loader, children: [children || (jsxs("div", { className: "loader__inner", children: [jsx("span", { className: clsx('loader__item', itemFillClass && "fill_".concat(itemFillClass)) }), jsx("span", { className: clsx('loader__item', itemFillClass && "fill_".concat(itemFillClass)) }), jsx("span", { className: clsx('loader__item', itemFillClass && "fill_".concat(itemFillClass)) })] })), text && (jsx(Text, { className: "loader__text", size: textSize || (appearanceConfig === null || appearanceConfig ===
|
|
49
|
+
return (jsxs("div", { className: clsx('loader', positionClass && "position_".concat(positionClass), widthClass && "width_".concat(widthClass), heightClass && "height_".concat(heightClass), fillClass && "fill_".concat(fillClass), className, set && "loader_set_".concat(set)), style: loader, children: [children || (jsxs("div", { className: "loader__inner", children: [jsx("span", { className: clsx('loader__item', itemFillClass && "fill_".concat(itemFillClass)) }), jsx("span", { className: clsx('loader__item', itemFillClass && "fill_".concat(itemFillClass)) }), jsx("span", { className: clsx('loader__item', itemFillClass && "fill_".concat(itemFillClass)) })] })), text && (jsx(Text, { className: "loader__text", size: textSize || (appearanceConfig === null || appearanceConfig === void 0 ? void 0 : appearanceConfig.textSize), textColor: textColor || (appearanceConfig === null || appearanceConfig === void 0 ? void 0 : appearanceConfig.textColor), children: text }))] }));
|
|
50
50
|
}
|
|
51
51
|
|
|
52
52
|
export { Loader as L, loaderAppearance as a, loaderConfig as l };
|
|
@@ -3,8 +3,8 @@ import React from 'react';
|
|
|
3
3
|
import clsx from 'clsx';
|
|
4
4
|
import { useDeviceTargetClassGenerator } from './hooks/useDeviceTargetClassGenerator.js';
|
|
5
5
|
import { useStyles } from './hooks/useStyles.js';
|
|
6
|
-
import {
|
|
7
|
-
import { T as Text } from './Text-
|
|
6
|
+
import { a as Link } from './Link-DN2LhPjD.js';
|
|
7
|
+
import { T as Text } from './Text-JayJa3hj.js';
|
|
8
8
|
|
|
9
9
|
var menuItemAppearance = {
|
|
10
10
|
any: {
|
|
@@ -29,7 +29,7 @@ function MenuItem(props) {
|
|
|
29
29
|
var alignClass = classGenerator.alignClass, alignDirectionClass = classGenerator.alignDirectionClass, directionClass = classGenerator.directionClass, fillActiveClass = classGenerator.fillActiveClass, fillActiveHoverClass = classGenerator.fillActiveHoverClass, fillClass = classGenerator.fillClass, fillDisabledClass = classGenerator.fillDisabledClass, fillHoverClass = classGenerator.fillHoverClass, justifyContentClass = classGenerator.justifyContentClass, shapeClass = classGenerator.shapeClass, sizeClass = classGenerator.sizeClass, typeClass = classGenerator.typeClass, widthClass = classGenerator.widthClass;
|
|
30
30
|
// @ts-expect-error
|
|
31
31
|
var menuItem = useStyles(props).styles;
|
|
32
|
-
return (jsx("div", { className: clsx('menu-item', isActive && 'menu-item_state_active', isHover && 'menu-item_state_hover', directionClass && "menu-item_direction_".concat(directionClass), className, sizeClass && "menu-item_size_".concat(sizeClass), fillClass && "fill_".concat(fillClass), fillHoverClass && "fill_hover_".concat(fillHoverClass), fillActiveClass && "fill_active_".concat(fillActiveClass), fillActiveHoverClass && "fill_active_hover_".concat(fillActiveHoverClass), fillDisabledClass && "fill_disabled_".concat(fillDisabledClass), shapeClass && "menu-item_shape_".concat(shapeClass), typeClass && "menu-item_type_".concat(typeClass), widthClass && "width_".concat(widthClass), set && "menu-item_set_".concat(set), justifyContentClass && "menu-item_justify-content_".concat(justifyContentClass)), style: menuItem, onClick: onClick, onMouseEnter: onMouseEnter, children: jsx(Link, { className: clsx('menu-item__label', alignDirectionClass && "align_".concat(alignDirectionClass), alignClass && "align_".concat(alignClass)), fill: linkFill, href: link || href, rel: rel, target: target, underline: underline, children: jsxs(React.Fragment, { children: [before, children || (jsxs(React.Fragment, { children: [label && (jsx(Text, { className: "menu-item__label", size: textSize || (appearanceConfig === null || appearanceConfig ===
|
|
32
|
+
return (jsx("div", { className: clsx('menu-item', isActive && 'menu-item_state_active', isHover && 'menu-item_state_hover', directionClass && "menu-item_direction_".concat(directionClass), className, sizeClass && "menu-item_size_".concat(sizeClass), fillClass && "fill_".concat(fillClass), fillHoverClass && "fill_hover_".concat(fillHoverClass), fillActiveClass && "fill_active_".concat(fillActiveClass), fillActiveHoverClass && "fill_active_hover_".concat(fillActiveHoverClass), fillDisabledClass && "fill_disabled_".concat(fillDisabledClass), shapeClass && "menu-item_shape_".concat(shapeClass), typeClass && "menu-item_type_".concat(typeClass), widthClass && "width_".concat(widthClass), set && "menu-item_set_".concat(set), justifyContentClass && "menu-item_justify-content_".concat(justifyContentClass)), style: menuItem, onClick: onClick, onMouseEnter: onMouseEnter, children: jsx(Link, { className: clsx('menu-item__label', alignDirectionClass && "align_".concat(alignDirectionClass), alignClass && "align_".concat(alignClass)), fill: linkFill, href: link || href, rel: rel, target: target, underline: underline, children: jsxs(React.Fragment, { children: [before, children || (jsxs(React.Fragment, { children: [label && (jsx(Text, { className: "menu-item__label", size: textSize || (appearanceConfig === null || appearanceConfig === void 0 ? void 0 : appearanceConfig.textSize), textColor: textColor || (appearanceConfig === null || appearanceConfig === void 0 ? void 0 : appearanceConfig.textColor), textColorGradient: textGradient, textColorHover: textColorHover || (appearanceConfig === null || appearanceConfig === void 0 ? void 0 : appearanceConfig.textColorHover), textStyle: textStyle, textWeight: textWeight, textWrap: textWrap, textColorActive: isActive && (textColorActive || (appearanceConfig === null || appearanceConfig === void 0 ? void 0 : appearanceConfig.textColorActive)), children: label })), desc && (jsx(Text, { className: "menu-item__desc", size: descTextSize || (appearanceConfig === null || appearanceConfig === void 0 ? void 0 : appearanceConfig.descTextSize), textColor: descTextColor || (appearanceConfig === null || appearanceConfig === void 0 ? void 0 : appearanceConfig.descTextColor), textColorGradient: descTextGradient, textColorHover: descTextColorHover || (appearanceConfig === null || appearanceConfig === void 0 ? void 0 : appearanceConfig.descTextColorHover), textStyle: descTextStyle, textWeight: descTextWeight, textWrap: descTextWrap, children: desc }))] })), after] }) }) }));
|
|
33
33
|
}
|
|
34
34
|
MenuItem.defaultProps = {
|
|
35
35
|
direction: 'horizontal',
|
|
@@ -5,8 +5,8 @@ var React = require('react');
|
|
|
5
5
|
var clsx = require('clsx');
|
|
6
6
|
var useDeviceTargetClassGenerator = require('./cjs/hooks/useDeviceTargetClassGenerator.js');
|
|
7
7
|
var useStyles = require('./cjs/hooks/useStyles.js');
|
|
8
|
-
var Link = require('./Link-
|
|
9
|
-
var Text = require('./Text-
|
|
8
|
+
var Link = require('./Link-CxWmYMyL.js');
|
|
9
|
+
var Text = require('./Text-Beslj4Ns.js');
|
|
10
10
|
|
|
11
11
|
var menuItemAppearance = {
|
|
12
12
|
any: {
|
|
@@ -31,7 +31,7 @@ function MenuItem(props) {
|
|
|
31
31
|
var alignClass = classGenerator.alignClass, alignDirectionClass = classGenerator.alignDirectionClass, directionClass = classGenerator.directionClass, fillActiveClass = classGenerator.fillActiveClass, fillActiveHoverClass = classGenerator.fillActiveHoverClass, fillClass = classGenerator.fillClass, fillDisabledClass = classGenerator.fillDisabledClass, fillHoverClass = classGenerator.fillHoverClass, justifyContentClass = classGenerator.justifyContentClass, shapeClass = classGenerator.shapeClass, sizeClass = classGenerator.sizeClass, typeClass = classGenerator.typeClass, widthClass = classGenerator.widthClass;
|
|
32
32
|
// @ts-expect-error
|
|
33
33
|
var menuItem = useStyles.useStyles(props).styles;
|
|
34
|
-
return (jsxRuntime.jsx("div", { className: clsx('menu-item', isActive && 'menu-item_state_active', isHover && 'menu-item_state_hover', directionClass && "menu-item_direction_".concat(directionClass), className, sizeClass && "menu-item_size_".concat(sizeClass), fillClass && "fill_".concat(fillClass), fillHoverClass && "fill_hover_".concat(fillHoverClass), fillActiveClass && "fill_active_".concat(fillActiveClass), fillActiveHoverClass && "fill_active_hover_".concat(fillActiveHoverClass), fillDisabledClass && "fill_disabled_".concat(fillDisabledClass), shapeClass && "menu-item_shape_".concat(shapeClass), typeClass && "menu-item_type_".concat(typeClass), widthClass && "width_".concat(widthClass), set && "menu-item_set_".concat(set), justifyContentClass && "menu-item_justify-content_".concat(justifyContentClass)), style: menuItem, onClick: onClick, onMouseEnter: onMouseEnter, children: jsxRuntime.jsx(Link.Link, { className: clsx('menu-item__label', alignDirectionClass && "align_".concat(alignDirectionClass), alignClass && "align_".concat(alignClass)), fill: linkFill, href: link || href, rel: rel, target: target, underline: underline, children: jsxRuntime.jsxs(React.Fragment, { children: [before, children || (jsxRuntime.jsxs(React.Fragment, { children: [label && (jsxRuntime.jsx(Text.Text, { className: "menu-item__label", size: textSize || (appearanceConfig === null || appearanceConfig ===
|
|
34
|
+
return (jsxRuntime.jsx("div", { className: clsx('menu-item', isActive && 'menu-item_state_active', isHover && 'menu-item_state_hover', directionClass && "menu-item_direction_".concat(directionClass), className, sizeClass && "menu-item_size_".concat(sizeClass), fillClass && "fill_".concat(fillClass), fillHoverClass && "fill_hover_".concat(fillHoverClass), fillActiveClass && "fill_active_".concat(fillActiveClass), fillActiveHoverClass && "fill_active_hover_".concat(fillActiveHoverClass), fillDisabledClass && "fill_disabled_".concat(fillDisabledClass), shapeClass && "menu-item_shape_".concat(shapeClass), typeClass && "menu-item_type_".concat(typeClass), widthClass && "width_".concat(widthClass), set && "menu-item_set_".concat(set), justifyContentClass && "menu-item_justify-content_".concat(justifyContentClass)), style: menuItem, onClick: onClick, onMouseEnter: onMouseEnter, children: jsxRuntime.jsx(Link.Link, { className: clsx('menu-item__label', alignDirectionClass && "align_".concat(alignDirectionClass), alignClass && "align_".concat(alignClass)), fill: linkFill, href: link || href, rel: rel, target: target, underline: underline, children: jsxRuntime.jsxs(React.Fragment, { children: [before, children || (jsxRuntime.jsxs(React.Fragment, { children: [label && (jsxRuntime.jsx(Text.Text, { className: "menu-item__label", size: textSize || (appearanceConfig === null || appearanceConfig === void 0 ? void 0 : appearanceConfig.textSize), textColor: textColor || (appearanceConfig === null || appearanceConfig === void 0 ? void 0 : appearanceConfig.textColor), textColorGradient: textGradient, textColorHover: textColorHover || (appearanceConfig === null || appearanceConfig === void 0 ? void 0 : appearanceConfig.textColorHover), textStyle: textStyle, textWeight: textWeight, textWrap: textWrap, textColorActive: isActive && (textColorActive || (appearanceConfig === null || appearanceConfig === void 0 ? void 0 : appearanceConfig.textColorActive)), children: label })), desc && (jsxRuntime.jsx(Text.Text, { className: "menu-item__desc", size: descTextSize || (appearanceConfig === null || appearanceConfig === void 0 ? void 0 : appearanceConfig.descTextSize), textColor: descTextColor || (appearanceConfig === null || appearanceConfig === void 0 ? void 0 : appearanceConfig.descTextColor), textColorGradient: descTextGradient, textColorHover: descTextColorHover || (appearanceConfig === null || appearanceConfig === void 0 ? void 0 : appearanceConfig.descTextColorHover), textStyle: descTextStyle, textWeight: descTextWeight, textWrap: descTextWrap, children: desc }))] })), after] }) }) }));
|
|
35
35
|
}
|
|
36
36
|
MenuItem.defaultProps = {
|
|
37
37
|
direction: 'horizontal',
|
|
@@ -3,7 +3,7 @@ import clsx from 'clsx';
|
|
|
3
3
|
import { Scrollbar as Scrollbar$1 } from 'react-scrollbars-custom';
|
|
4
4
|
|
|
5
5
|
function Scrollbar(props) {
|
|
6
|
-
var children = props.children, className = props.className, noDefaultStyles = props.noDefaultStyles, scrollbarWidth = props.scrollbarWidth, _a = props.scrollHeight, scrollHeight = _a ===
|
|
6
|
+
var children = props.children, className = props.className, noDefaultStyles = props.noDefaultStyles, scrollbarWidth = props.scrollbarWidth, _a = props.scrollHeight, scrollHeight = _a === void 0 ? '200' : _a, onScroll = props.onScroll;
|
|
7
7
|
return (jsx(Scrollbar$1, { className: clsx('scrollbar', className), noDefaultStyles: noDefaultStyles, scrollbarWidth: scrollbarWidth, style: { height: scrollHeight + 'px' }, contentProps: {
|
|
8
8
|
className: 'scrollbar__scroll-content',
|
|
9
9
|
}, scrollerProps: {
|
|
@@ -5,7 +5,7 @@ var clsx = require('clsx');
|
|
|
5
5
|
var reactScrollbarsCustom = require('react-scrollbars-custom');
|
|
6
6
|
|
|
7
7
|
function Scrollbar(props) {
|
|
8
|
-
var children = props.children, className = props.className, noDefaultStyles = props.noDefaultStyles, scrollbarWidth = props.scrollbarWidth, _a = props.scrollHeight, scrollHeight = _a ===
|
|
8
|
+
var children = props.children, className = props.className, noDefaultStyles = props.noDefaultStyles, scrollbarWidth = props.scrollbarWidth, _a = props.scrollHeight, scrollHeight = _a === void 0 ? '200' : _a, onScroll = props.onScroll;
|
|
9
9
|
return (jsxRuntime.jsx(reactScrollbarsCustom.Scrollbar, { className: clsx('scrollbar', className), noDefaultStyles: noDefaultStyles, scrollbarWidth: scrollbarWidth, style: { height: scrollHeight + 'px' }, contentProps: {
|
|
10
10
|
className: 'scrollbar__scroll-content',
|
|
11
11
|
}, scrollerProps: {
|
|
@@ -19,7 +19,7 @@ var textConfig = {
|
|
|
19
19
|
},
|
|
20
20
|
};
|
|
21
21
|
function Text(props) {
|
|
22
|
-
var children = props.children, cursor = props.cursor, after = props.after, appearance = props.appearance, before = props.before, className = props.className, dataTestId = props.dataTestId, dataTour = props.dataTour, htmlFor = props.htmlFor, mode = props.mode, _a = props.tag, Tag = _a ===
|
|
22
|
+
var children = props.children, cursor = props.cursor, after = props.after, appearance = props.appearance, before = props.before, className = props.className, dataTestId = props.dataTestId, dataTour = props.dataTour, htmlFor = props.htmlFor, mode = props.mode, _a = props.tag, Tag = _a === void 0 ? 'span' : _a, type = props.type, onClick = props.onClick, onDoubleClick = props.onDoubleClick;
|
|
23
23
|
// @ts-expect-error
|
|
24
24
|
var appearanceConfig = textConfig.appearance && textConfig.appearance[appearance];
|
|
25
25
|
var classGenerator = useDeviceTargetClassGenerator.useDeviceTargetClassGenerator(props, appearanceConfig);
|
|
@@ -17,7 +17,7 @@ var textConfig = {
|
|
|
17
17
|
},
|
|
18
18
|
};
|
|
19
19
|
function Text(props) {
|
|
20
|
-
var children = props.children, cursor = props.cursor, after = props.after, appearance = props.appearance, before = props.before, className = props.className, dataTestId = props.dataTestId, dataTour = props.dataTour, htmlFor = props.htmlFor, mode = props.mode, _a = props.tag, Tag = _a ===
|
|
20
|
+
var children = props.children, cursor = props.cursor, after = props.after, appearance = props.appearance, before = props.before, className = props.className, dataTestId = props.dataTestId, dataTour = props.dataTour, htmlFor = props.htmlFor, mode = props.mode, _a = props.tag, Tag = _a === void 0 ? 'span' : _a, type = props.type, onClick = props.onClick, onDoubleClick = props.onDoubleClick;
|
|
21
21
|
// @ts-expect-error
|
|
22
22
|
var appearanceConfig = textConfig.appearance && textConfig.appearance[appearance];
|
|
23
23
|
var classGenerator = useDeviceTargetClassGenerator(props, appearanceConfig);
|
|
@@ -18,7 +18,7 @@ var titleConfig = {
|
|
|
18
18
|
},
|
|
19
19
|
};
|
|
20
20
|
function Title(props) {
|
|
21
|
-
var children = props.children, after = props.after, afterWrapper = props.afterWrapper, appearance = props.appearance, before = props.before, beforeWrapper = props.beforeWrapper, className = props.className, dataTour = props.dataTour, mode = props.mode, _a = props.size, size = _a ===
|
|
21
|
+
var children = props.children, after = props.after, afterWrapper = props.afterWrapper, appearance = props.appearance, before = props.before, beforeWrapper = props.beforeWrapper, className = props.className, dataTour = props.dataTour, mode = props.mode, _a = props.size, size = _a === void 0 ? 'h3' : _a, sizeDesktop = props.sizeDesktop, sizeMobile = props.sizeMobile, sizeTablet = props.sizeTablet, _b = props.tag, tag = _b === void 0 ? 'span' : _b, text = props.text, textWrap = props.textWrap, onClick = props.onClick;
|
|
22
22
|
var _c = useUserDeviceContext(), isMobile = _c.isMobile, isTablet = _c.isTablet, isDesktop = _c.isDesktop;
|
|
23
23
|
// @ts-expect-error
|
|
24
24
|
var appearanceConfig = titleConfig.appearance && titleConfig.appearance[appearance];
|
|
@@ -20,7 +20,7 @@ var titleConfig = {
|
|
|
20
20
|
},
|
|
21
21
|
};
|
|
22
22
|
function Title(props) {
|
|
23
|
-
var children = props.children, after = props.after, afterWrapper = props.afterWrapper, appearance = props.appearance, before = props.before, beforeWrapper = props.beforeWrapper, className = props.className, dataTour = props.dataTour, mode = props.mode, _a = props.size, size = _a ===
|
|
23
|
+
var children = props.children, after = props.after, afterWrapper = props.afterWrapper, appearance = props.appearance, before = props.before, beforeWrapper = props.beforeWrapper, className = props.className, dataTour = props.dataTour, mode = props.mode, _a = props.size, size = _a === void 0 ? 'h3' : _a, sizeDesktop = props.sizeDesktop, sizeMobile = props.sizeMobile, sizeTablet = props.sizeTablet, _b = props.tag, tag = _b === void 0 ? 'span' : _b, text = props.text, textWrap = props.textWrap, onClick = props.onClick;
|
|
24
24
|
var _c = UIContext.useUserDeviceContext(), isMobile = _c.isMobile, isTablet = _c.isTablet, isDesktop = _c.isDesktop;
|
|
25
25
|
// @ts-expect-error
|
|
26
26
|
var appearanceConfig = titleConfig.appearance && titleConfig.appearance[appearance];
|
|
@@ -3,8 +3,8 @@ import React, { useRef, useState, useCallback, useImperativeHandle } from 'react
|
|
|
3
3
|
import clsx from 'clsx';
|
|
4
4
|
import { useDeviceTargetClassGenerator } from './hooks/useDeviceTargetClassGenerator.js';
|
|
5
5
|
import { useStyles } from './hooks/useStyles.js';
|
|
6
|
-
import { T as Text } from './Text-
|
|
7
|
-
import { T as Title } from './Title-
|
|
6
|
+
import { T as Text } from './Text-JayJa3hj.js';
|
|
7
|
+
import { T as Title } from './Title-CHgrIarR.js';
|
|
8
8
|
|
|
9
9
|
var tooltipAppearance = {
|
|
10
10
|
surfacePrimary: {
|
|
@@ -31,7 +31,7 @@ var tooltipConfig = {
|
|
|
31
31
|
},
|
|
32
32
|
};
|
|
33
33
|
var Tooltip = React.forwardRef(function Tooltip(props, ref) {
|
|
34
|
-
var children = props.children, after = props.after, appearance = props.appearance, arrowPosition = props.arrowPosition, before = props.before, className = props.className, initialIsVisible = props.initialIsVisible, set = props.set, text = props.text, textColor = props.textColor, textSize = props.textSize, title = props.title, alignPosition = props.alignPosition, titleSize = props.titleSize, titleTextColor = props.titleTextColor, titleTextWeight = props.titleTextWeight, type = props.type, _a = props.openTimeoutDelay, openTimeoutDelay = _a ===
|
|
34
|
+
var children = props.children, after = props.after, appearance = props.appearance, arrowPosition = props.arrowPosition, before = props.before, className = props.className, initialIsVisible = props.initialIsVisible, set = props.set, text = props.text, textColor = props.textColor, textSize = props.textSize, title = props.title, alignPosition = props.alignPosition, titleSize = props.titleSize, titleTextColor = props.titleTextColor, titleTextWeight = props.titleTextWeight, type = props.type, _a = props.openTimeoutDelay, openTimeoutDelay = _a === void 0 ? 500 : _a, _b = props.closeTimeoutDelay, closeTimeoutDelay = _b === void 0 ? 250 : _b;
|
|
35
35
|
var tooltipElementRef = useRef(null);
|
|
36
36
|
var tooltipTimeoutHideRef = useRef(null);
|
|
37
37
|
var tooltipTimeoutShowRef = useRef(null);
|
|
@@ -83,7 +83,7 @@ var Tooltip = React.forwardRef(function Tooltip(props, ref) {
|
|
|
83
83
|
var borderWidthClass = classGenerator.borderWidthClass, borderTypeClass = classGenerator.borderTypeClass, widthClass = classGenerator.widthClass, fillClass = classGenerator.fillClass, shapeClass = classGenerator.shapeClass, alignDirectionClass = classGenerator.alignDirectionClass, alignClass = classGenerator.alignClass, alignmentClass = classGenerator.alignmentClass, borderColorClass = classGenerator.borderColorClass, elevationClass = classGenerator.elevationClass, sizeClass = classGenerator.sizeClass;
|
|
84
84
|
// @ts-expect-error
|
|
85
85
|
var tooltipStyles = useStyles(props).styles;
|
|
86
|
-
return (jsxs("div", { className: clsx(className, 'tooltip', isTooltipVisible === true && 'tooltip_state_open', isTooltipVisible === false && 'tooltip_state_close', fillClass && "fill_".concat(fillClass), shapeClass && "tooltip_shape_".concat(shapeClass), alignPosition && "tooltip_align-position_".concat(alignPosition), alignDirectionClass && "align_".concat(alignDirectionClass), alignClass && "align_".concat(alignClass), alignmentClass && "alignment_".concat(alignmentClass), borderWidthClass && "border-width_".concat(borderWidthClass), borderColorClass && "border-color_".concat(borderColorClass), borderTypeClass && "border_type_".concat(borderTypeClass), elevationClass && "elevation_".concat(elevationClass), sizeClass && "tooltip_size_".concat(sizeClass), arrowPosition && "tooltip_type_arrow tooltip_arrow_position_".concat(arrowPosition), type && "tooltip_type_".concat(type), set && "tooltip_set_".concat(set), widthClass && "width_".concat(widthClass)), ref: tooltipElementRef, style: tooltipStyles, onAnimationEnd: onAnimationEnd, children: [before, jsxs("div", { className: "tooltip__inner", children: [title && (jsx(Title, { className: "tooltip__title", size: titleSize || (appearanceConfig === null || appearanceConfig ===
|
|
86
|
+
return (jsxs("div", { className: clsx(className, 'tooltip', isTooltipVisible === true && 'tooltip_state_open', isTooltipVisible === false && 'tooltip_state_close', fillClass && "fill_".concat(fillClass), shapeClass && "tooltip_shape_".concat(shapeClass), alignPosition && "tooltip_align-position_".concat(alignPosition), alignDirectionClass && "align_".concat(alignDirectionClass), alignClass && "align_".concat(alignClass), alignmentClass && "alignment_".concat(alignmentClass), borderWidthClass && "border-width_".concat(borderWidthClass), borderColorClass && "border-color_".concat(borderColorClass), borderTypeClass && "border_type_".concat(borderTypeClass), elevationClass && "elevation_".concat(elevationClass), sizeClass && "tooltip_size_".concat(sizeClass), arrowPosition && "tooltip_type_arrow tooltip_arrow_position_".concat(arrowPosition), type && "tooltip_type_".concat(type), set && "tooltip_set_".concat(set), widthClass && "width_".concat(widthClass)), ref: tooltipElementRef, style: tooltipStyles, onAnimationEnd: onAnimationEnd, children: [before, jsxs("div", { className: "tooltip__inner", children: [title && (jsx(Title, { className: "tooltip__title", size: titleSize || (appearanceConfig === null || appearanceConfig === void 0 ? void 0 : appearanceConfig.titleSize), textColor: titleTextColor || (appearanceConfig === null || appearanceConfig === void 0 ? void 0 : appearanceConfig.titleTextColor), textWeight: titleTextWeight || (appearanceConfig === null || appearanceConfig === void 0 ? void 0 : appearanceConfig.titleTextWeight), children: title })), text && (jsx(Text, { className: "tooltip__text", size: textSize || (appearanceConfig === null || appearanceConfig === void 0 ? void 0 : appearanceConfig.textSize), textColor: textColor || (appearanceConfig === null || appearanceConfig === void 0 ? void 0 : appearanceConfig.textColor), children: text })), children] }), after] }));
|
|
87
87
|
});
|
|
88
88
|
|
|
89
89
|
export { Tooltip as T, tooltipAppearance as a, tooltipConfig as t };
|
|
@@ -5,8 +5,8 @@ var React = require('react');
|
|
|
5
5
|
var clsx = require('clsx');
|
|
6
6
|
var useDeviceTargetClassGenerator = require('./cjs/hooks/useDeviceTargetClassGenerator.js');
|
|
7
7
|
var useStyles = require('./cjs/hooks/useStyles.js');
|
|
8
|
-
var Text = require('./Text-
|
|
9
|
-
var Title = require('./Title-
|
|
8
|
+
var Text = require('./Text-Beslj4Ns.js');
|
|
9
|
+
var Title = require('./Title-DBaHcpvB.js');
|
|
10
10
|
|
|
11
11
|
var tooltipAppearance = {
|
|
12
12
|
surfacePrimary: {
|
|
@@ -33,7 +33,7 @@ var tooltipConfig = {
|
|
|
33
33
|
},
|
|
34
34
|
};
|
|
35
35
|
var Tooltip = React.forwardRef(function Tooltip(props, ref) {
|
|
36
|
-
var children = props.children, after = props.after, appearance = props.appearance, arrowPosition = props.arrowPosition, before = props.before, className = props.className, initialIsVisible = props.initialIsVisible, set = props.set, text = props.text, textColor = props.textColor, textSize = props.textSize, title = props.title, alignPosition = props.alignPosition, titleSize = props.titleSize, titleTextColor = props.titleTextColor, titleTextWeight = props.titleTextWeight, type = props.type, _a = props.openTimeoutDelay, openTimeoutDelay = _a ===
|
|
36
|
+
var children = props.children, after = props.after, appearance = props.appearance, arrowPosition = props.arrowPosition, before = props.before, className = props.className, initialIsVisible = props.initialIsVisible, set = props.set, text = props.text, textColor = props.textColor, textSize = props.textSize, title = props.title, alignPosition = props.alignPosition, titleSize = props.titleSize, titleTextColor = props.titleTextColor, titleTextWeight = props.titleTextWeight, type = props.type, _a = props.openTimeoutDelay, openTimeoutDelay = _a === void 0 ? 500 : _a, _b = props.closeTimeoutDelay, closeTimeoutDelay = _b === void 0 ? 250 : _b;
|
|
37
37
|
var tooltipElementRef = React.useRef(null);
|
|
38
38
|
var tooltipTimeoutHideRef = React.useRef(null);
|
|
39
39
|
var tooltipTimeoutShowRef = React.useRef(null);
|
|
@@ -85,7 +85,7 @@ var Tooltip = React.forwardRef(function Tooltip(props, ref) {
|
|
|
85
85
|
var borderWidthClass = classGenerator.borderWidthClass, borderTypeClass = classGenerator.borderTypeClass, widthClass = classGenerator.widthClass, fillClass = classGenerator.fillClass, shapeClass = classGenerator.shapeClass, alignDirectionClass = classGenerator.alignDirectionClass, alignClass = classGenerator.alignClass, alignmentClass = classGenerator.alignmentClass, borderColorClass = classGenerator.borderColorClass, elevationClass = classGenerator.elevationClass, sizeClass = classGenerator.sizeClass;
|
|
86
86
|
// @ts-expect-error
|
|
87
87
|
var tooltipStyles = useStyles.useStyles(props).styles;
|
|
88
|
-
return (jsxRuntime.jsxs("div", { className: clsx(className, 'tooltip', isTooltipVisible === true && 'tooltip_state_open', isTooltipVisible === false && 'tooltip_state_close', fillClass && "fill_".concat(fillClass), shapeClass && "tooltip_shape_".concat(shapeClass), alignPosition && "tooltip_align-position_".concat(alignPosition), alignDirectionClass && "align_".concat(alignDirectionClass), alignClass && "align_".concat(alignClass), alignmentClass && "alignment_".concat(alignmentClass), borderWidthClass && "border-width_".concat(borderWidthClass), borderColorClass && "border-color_".concat(borderColorClass), borderTypeClass && "border_type_".concat(borderTypeClass), elevationClass && "elevation_".concat(elevationClass), sizeClass && "tooltip_size_".concat(sizeClass), arrowPosition && "tooltip_type_arrow tooltip_arrow_position_".concat(arrowPosition), type && "tooltip_type_".concat(type), set && "tooltip_set_".concat(set), widthClass && "width_".concat(widthClass)), ref: tooltipElementRef, style: tooltipStyles, onAnimationEnd: onAnimationEnd, children: [before, jsxRuntime.jsxs("div", { className: "tooltip__inner", children: [title && (jsxRuntime.jsx(Title.Title, { className: "tooltip__title", size: titleSize || (appearanceConfig === null || appearanceConfig ===
|
|
88
|
+
return (jsxRuntime.jsxs("div", { className: clsx(className, 'tooltip', isTooltipVisible === true && 'tooltip_state_open', isTooltipVisible === false && 'tooltip_state_close', fillClass && "fill_".concat(fillClass), shapeClass && "tooltip_shape_".concat(shapeClass), alignPosition && "tooltip_align-position_".concat(alignPosition), alignDirectionClass && "align_".concat(alignDirectionClass), alignClass && "align_".concat(alignClass), alignmentClass && "alignment_".concat(alignmentClass), borderWidthClass && "border-width_".concat(borderWidthClass), borderColorClass && "border-color_".concat(borderColorClass), borderTypeClass && "border_type_".concat(borderTypeClass), elevationClass && "elevation_".concat(elevationClass), sizeClass && "tooltip_size_".concat(sizeClass), arrowPosition && "tooltip_type_arrow tooltip_arrow_position_".concat(arrowPosition), type && "tooltip_type_".concat(type), set && "tooltip_set_".concat(set), widthClass && "width_".concat(widthClass)), ref: tooltipElementRef, style: tooltipStyles, onAnimationEnd: onAnimationEnd, children: [before, jsxRuntime.jsxs("div", { className: "tooltip__inner", children: [title && (jsxRuntime.jsx(Title.Title, { className: "tooltip__title", size: titleSize || (appearanceConfig === null || appearanceConfig === void 0 ? void 0 : appearanceConfig.titleSize), textColor: titleTextColor || (appearanceConfig === null || appearanceConfig === void 0 ? void 0 : appearanceConfig.titleTextColor), textWeight: titleTextWeight || (appearanceConfig === null || appearanceConfig === void 0 ? void 0 : appearanceConfig.titleTextWeight), children: title })), text && (jsxRuntime.jsx(Text.Text, { className: "tooltip__text", size: textSize || (appearanceConfig === null || appearanceConfig === void 0 ? void 0 : appearanceConfig.textSize), textColor: textColor || (appearanceConfig === null || appearanceConfig === void 0 ? void 0 : appearanceConfig.textColor), children: text })), children] }), after] }));
|
|
89
89
|
});
|
|
90
90
|
|
|
91
91
|
exports.Tooltip = Tooltip;
|
|
@@ -9,19 +9,20 @@ var useDeviceTargetClassGenerator = require('../hooks/useDeviceTargetClassGenera
|
|
|
9
9
|
var useStyles = require('../hooks/useStyles.js');
|
|
10
10
|
var _default = require('@itcase/icons/default');
|
|
11
11
|
var Divider = require('../../Divider-Goh6mpPK.js');
|
|
12
|
-
var Icon = require('../../Icon-
|
|
13
|
-
var Text = require('../../Text-
|
|
12
|
+
var Icon = require('../../Icon-B_bS-o4g.js');
|
|
13
|
+
var Text = require('../../Text-Beslj4Ns.js');
|
|
14
14
|
require('lodash/camelCase');
|
|
15
15
|
require('../context/UIContext.js');
|
|
16
16
|
require('../hooks/useMediaQueries.js');
|
|
17
17
|
require('react-responsive');
|
|
18
|
+
require('../utils/setViewportProperty.js');
|
|
18
19
|
require('lodash/maxBy');
|
|
19
20
|
require('lodash/upperFirst');
|
|
20
21
|
require('../hooks/styleAttributes.js');
|
|
21
22
|
require('react-inlinesvg');
|
|
22
|
-
require('../../Link-
|
|
23
|
-
require('../../Tooltip-
|
|
24
|
-
require('../../Title-
|
|
23
|
+
require('../../Link-CxWmYMyL.js');
|
|
24
|
+
require('../../Tooltip-CNua1g76.js');
|
|
25
|
+
require('../../Title-DBaHcpvB.js');
|
|
25
26
|
|
|
26
27
|
var accordionAppearance = {
|
|
27
28
|
dev: {},
|
|
@@ -37,7 +38,7 @@ var accordionItemConfig = {
|
|
|
37
38
|
},
|
|
38
39
|
};
|
|
39
40
|
function AccordionItem(props) {
|
|
40
|
-
var id = props.id, children = props.children, isExpanded = props.isExpanded, afterContent = props.afterContent, appearance = props.appearance, beforeContent = props.beforeContent, className = props.className, content = props.content, contentTextColor = props.contentTextColor, contentTextSize = props.contentTextSize, contentTextWeight = props.contentTextWeight, dividerDirection = props.dividerDirection, dividerFill = props.dividerFill, dividerSize = props.dividerSize, icon = props.icon, _a = props.iconFill, iconFill = _a ===
|
|
41
|
+
var id = props.id, children = props.children, isExpanded = props.isExpanded, afterContent = props.afterContent, appearance = props.appearance, beforeContent = props.beforeContent, className = props.className, content = props.content, contentTextColor = props.contentTextColor, contentTextSize = props.contentTextSize, contentTextWeight = props.contentTextWeight, dividerDirection = props.dividerDirection, dividerFill = props.dividerFill, dividerSize = props.dividerSize, icon = props.icon, _a = props.iconFill, iconFill = _a === void 0 ? 'surfaceItemAccent' : _a, showDivider = props.showDivider, size = props.size, title = props.title, titleTextColor = props.titleTextColor, titleTextSize = props.titleTextSize, titleTextWeight = props.titleTextWeight, onClick = props.onClick;
|
|
41
42
|
var onClickTitle = React.useCallback(function () {
|
|
42
43
|
// "!isExpanded" - is next state of expanded
|
|
43
44
|
var thisItemData = {
|
|
@@ -65,7 +66,7 @@ var accordionConfig = {
|
|
|
65
66
|
},
|
|
66
67
|
};
|
|
67
68
|
function Accordion(props) {
|
|
68
|
-
var children = props.children, isMultiple = props.isMultiple, appearance = props.appearance, className = props.className, _a = props.initial, initial = _a ===
|
|
69
|
+
var children = props.children, isMultiple = props.isMultiple, appearance = props.appearance, className = props.className, _a = props.initial, initial = _a === void 0 ? [] : _a, items = props.items, onClickItem = props.onClickItem;
|
|
69
70
|
var _b = React.useState(function () { return castArray(initial); }), expandedItems = _b[0], setExpandedItems = _b[1];
|
|
70
71
|
var onClickAccordionItem = React.useCallback(function (targetItem) {
|
|
71
72
|
setExpandedItems(function (prevState) {
|
|
@@ -4,23 +4,24 @@ var jsxRuntime = require('react/jsx-runtime');
|
|
|
4
4
|
var React = require('react');
|
|
5
5
|
var clsx = require('clsx');
|
|
6
6
|
var useDeviceTargetClassGenerator = require('../hooks/useDeviceTargetClassGenerator.js');
|
|
7
|
-
var Icon = require('../../Icon-
|
|
7
|
+
var Icon = require('../../Icon-B_bS-o4g.js');
|
|
8
8
|
var Image = require('../../Image-BbBG_UGI.js');
|
|
9
|
-
var Text = require('../../Text-
|
|
9
|
+
var Text = require('../../Text-Beslj4Ns.js');
|
|
10
10
|
require('../../tslib.es6-CCZ3TN_7.js');
|
|
11
11
|
require('lodash/camelCase');
|
|
12
12
|
require('lodash/castArray');
|
|
13
13
|
require('../context/UIContext.js');
|
|
14
14
|
require('../hooks/useMediaQueries.js');
|
|
15
15
|
require('react-responsive');
|
|
16
|
+
require('../utils/setViewportProperty.js');
|
|
16
17
|
require('react-inlinesvg');
|
|
17
18
|
require('../hooks/useStyles.js');
|
|
18
19
|
require('lodash/maxBy');
|
|
19
20
|
require('lodash/upperFirst');
|
|
20
21
|
require('../hooks/styleAttributes.js');
|
|
21
|
-
require('../../Link-
|
|
22
|
-
require('../../Tooltip-
|
|
23
|
-
require('../../Title-
|
|
22
|
+
require('../../Link-CxWmYMyL.js');
|
|
23
|
+
require('../../Tooltip-CNua1g76.js');
|
|
24
|
+
require('../../Title-DBaHcpvB.js');
|
|
24
25
|
|
|
25
26
|
var avatarAppearance = {
|
|
26
27
|
dev: {},
|
|
@@ -33,17 +34,17 @@ var avatarConfig = {
|
|
|
33
34
|
},
|
|
34
35
|
};
|
|
35
36
|
function Avatar(props) {
|
|
36
|
-
var after = props.after, appearance = props.appearance, before = props.before, className = props.className, Dot = props.Dot, _a = props.firstName, firstName = _a ===
|
|
37
|
+
var after = props.after, appearance = props.appearance, before = props.before, className = props.className, Dot = props.Dot, _a = props.firstName, firstName = _a === void 0 ? '' : _a, icon = props.icon, iconFill = props.iconFill, iconFillHover = props.iconFillHover, iconFillSize = props.iconFillSize, iconItemFill = props.iconItemFill, iconShape = props.iconShape, iconSize = props.iconSize, iconSrc = props.iconSrc, mode = props.mode, _b = props.secondName, secondName = _b === void 0 ? '' : _b, _c = props.size, size = _c === void 0 ? '96' : _c, src = props.src, _d = props.textColor, textColor = _d === void 0 ? 'surfaceTextTertiary' : _d, _e = props.textSize, textSize = _e === void 0 ? 'l' : _e, _f = props.textWeight, textWeight = _f === void 0 ? '600' : _f, type = props.type, onClick = props.onClick;
|
|
37
38
|
var avatarChars = React.useMemo(function () {
|
|
38
|
-
var firstChar = ((firstName === null || firstName ===
|
|
39
|
-
var secondChar = ((secondName === null || secondName ===
|
|
39
|
+
var firstChar = ((firstName === null || firstName === void 0 ? void 0 : firstName[0]) || '').toUpperCase();
|
|
40
|
+
var secondChar = ((secondName === null || secondName === void 0 ? void 0 : secondName[0]) || '').toUpperCase();
|
|
40
41
|
return "".concat(firstChar).concat(secondChar);
|
|
41
42
|
}, [firstName, secondName]);
|
|
42
43
|
// @ts-expect-error
|
|
43
44
|
var appearanceConfig = avatarConfig.appearance && avatarConfig.appearance[appearance];
|
|
44
45
|
var classGenerator = useDeviceTargetClassGenerator.useDeviceTargetClassGenerator(props, appearanceConfig);
|
|
45
46
|
var fillClass = classGenerator.fillClass, fillHoverClass = classGenerator.fillHoverClass, shapeClass = classGenerator.shapeClass;
|
|
46
|
-
return (jsxRuntime.jsx("div", { className: clsx(className, 'avatar', shapeClass && "avatar_shape_".concat(shapeClass), mode && "avatar_mode_".concat(mode), size && "avatar_size_".concat(size), type && "avatar_type_".concat(type), Dot && 'avatar_status', onClick && 'cursor_type_pointer'), onClick: onClick, children: jsxRuntime.jsxs("div", { className: clsx('avatar__wrapper', fillClass && "fill_".concat(fillClass), fillHoverClass && "fill_hover_".concat(fillHoverClass)), children: [before, src ? (jsxRuntime.jsx(Image.Image, { className: "avatar__image", shape: "geometric", src: src })) : (jsxRuntime.jsx(Text.Text, { className: "avatar__name", size: textSize || (appearanceConfig === null || appearanceConfig ===
|
|
47
|
+
return (jsxRuntime.jsx("div", { className: clsx(className, 'avatar', shapeClass && "avatar_shape_".concat(shapeClass), mode && "avatar_mode_".concat(mode), size && "avatar_size_".concat(size), type && "avatar_type_".concat(type), Dot && 'avatar_status', onClick && 'cursor_type_pointer'), onClick: onClick, children: jsxRuntime.jsxs("div", { className: clsx('avatar__wrapper', fillClass && "fill_".concat(fillClass), fillHoverClass && "fill_hover_".concat(fillHoverClass)), children: [before, src ? (jsxRuntime.jsx(Image.Image, { className: "avatar__image", shape: "geometric", src: src })) : (jsxRuntime.jsx(Text.Text, { className: "avatar__name", size: textSize || (appearanceConfig === null || appearanceConfig === void 0 ? void 0 : appearanceConfig.textSize), textColor: textColor || (appearanceConfig === null || appearanceConfig === void 0 ? void 0 : appearanceConfig.textColor), textWeight: textWeight || (appearanceConfig === null || appearanceConfig === void 0 ? void 0 : appearanceConfig.textWeight), children: avatarChars })), (icon || iconSrc) && (jsxRuntime.jsx(Icon.Icon, { className: "avatar__icon", fill: iconFill || (appearanceConfig === null || appearanceConfig === void 0 ? void 0 : appearanceConfig.iconFill), fillHover: iconFillHover || (appearanceConfig === null || appearanceConfig === void 0 ? void 0 : appearanceConfig.iconFillHover), fillSize: iconFillSize || (appearanceConfig === null || appearanceConfig === void 0 ? void 0 : appearanceConfig.iconFillSize), iconFill: iconItemFill || (appearanceConfig === null || appearanceConfig === void 0 ? void 0 : appearanceConfig.iconItemFill), iconSize: iconSize || (appearanceConfig === null || appearanceConfig === void 0 ? void 0 : appearanceConfig.iconSize), imageSrc: iconSrc || (appearanceConfig === null || appearanceConfig === void 0 ? void 0 : appearanceConfig.iconSrc), shape: iconShape || (appearanceConfig === null || appearanceConfig === void 0 ? void 0 : appearanceConfig.iconShape), SvgImage: icon || (appearanceConfig === null || appearanceConfig === void 0 ? void 0 : appearanceConfig.icon) })), Dot, after] }) }));
|
|
47
48
|
}
|
|
48
49
|
|
|
49
50
|
exports.Avatar = Avatar;
|
|
@@ -1,21 +1,22 @@
|
|
|
1
1
|
'use strict';
|
|
2
2
|
|
|
3
|
-
var Badge = require('../../Badge-
|
|
3
|
+
var Badge = require('../../Badge-CoHPvO35.js');
|
|
4
|
+
require('../../tslib.es6-CCZ3TN_7.js');
|
|
4
5
|
require('react/jsx-runtime');
|
|
5
6
|
require('clsx');
|
|
6
7
|
require('../hooks/useDeviceTargetClassGenerator.js');
|
|
7
|
-
require('../../tslib.es6-CCZ3TN_7.js');
|
|
8
8
|
require('react');
|
|
9
9
|
require('lodash/camelCase');
|
|
10
10
|
require('lodash/castArray');
|
|
11
11
|
require('../context/UIContext.js');
|
|
12
12
|
require('../hooks/useMediaQueries.js');
|
|
13
13
|
require('react-responsive');
|
|
14
|
+
require('../utils/setViewportProperty.js');
|
|
14
15
|
require('../hooks/useStyles.js');
|
|
15
16
|
require('lodash/maxBy');
|
|
16
17
|
require('lodash/upperFirst');
|
|
17
18
|
require('../hooks/styleAttributes.js');
|
|
18
|
-
require('../../Text-
|
|
19
|
+
require('../../Text-Beslj4Ns.js');
|
|
19
20
|
|
|
20
21
|
|
|
21
22
|
|
|
@@ -7,22 +7,23 @@ var clsx = require('clsx');
|
|
|
7
7
|
var camelCase = require('lodash/camelCase');
|
|
8
8
|
var useDeviceTargetClassGenerator = require('../hooks/useDeviceTargetClassGenerator.js');
|
|
9
9
|
var useStyles = require('../hooks/useStyles.js');
|
|
10
|
-
var Icon = require('../../Icon-
|
|
11
|
-
var Link = require('../../Link-
|
|
12
|
-
var Text = require('../../Text-
|
|
10
|
+
var Icon = require('../../Icon-B_bS-o4g.js');
|
|
11
|
+
var Link = require('../../Link-CxWmYMyL.js');
|
|
12
|
+
var Text = require('../../Text-Beslj4Ns.js');
|
|
13
13
|
require('lodash/castArray');
|
|
14
14
|
require('../context/UIContext.js');
|
|
15
15
|
require('../hooks/useMediaQueries.js');
|
|
16
16
|
require('react-responsive');
|
|
17
|
+
require('../utils/setViewportProperty.js');
|
|
17
18
|
require('lodash/maxBy');
|
|
18
19
|
require('lodash/upperFirst');
|
|
19
20
|
require('../hooks/styleAttributes.js');
|
|
20
21
|
require('react-inlinesvg');
|
|
21
|
-
require('../../Tooltip-
|
|
22
|
-
require('../../Title-
|
|
22
|
+
require('../../Tooltip-CNua1g76.js');
|
|
23
|
+
require('../../Title-DBaHcpvB.js');
|
|
23
24
|
|
|
24
25
|
function BreadcrumbsItem(props) {
|
|
25
|
-
var children = props.children, cursor = props.cursor, className = props.className, href = props.href, iconAfter = props.iconAfter, iconAfterBgFill = props.iconAfterBgFill, iconAfterFill = props.iconAfterFill, iconAfterSize = props.iconAfterSize, _a = props.set, set = _a ===
|
|
26
|
+
var children = props.children, cursor = props.cursor, className = props.className, href = props.href, iconAfter = props.iconAfter, iconAfterBgFill = props.iconAfterBgFill, iconAfterFill = props.iconAfterFill, iconAfterSize = props.iconAfterSize, _a = props.set, set = _a === void 0 ? 'default' : _a, text = props.text, textColor = props.textColor, textColorHover = props.textColorHover, textSize = props.textSize, onClick = props.onClick;
|
|
26
27
|
var classGenerator = useDeviceTargetClassGenerator.useDeviceTargetClassGenerator(props);
|
|
27
28
|
var fillClass = classGenerator.fillClass, positionClass = classGenerator.positionClass, shapeClass = classGenerator.shapeClass, underlineClass = classGenerator.underlineClass;
|
|
28
29
|
// @ts-expect-error
|
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
'use strict';
|
|
2
2
|
|
|
3
|
-
var Button = require('../../Button-
|
|
3
|
+
var Button = require('../../Button-BFX_EEum.js');
|
|
4
4
|
require('react/jsx-runtime');
|
|
5
5
|
require('react');
|
|
6
6
|
require('clsx');
|
|
@@ -11,17 +11,18 @@ require('lodash/castArray');
|
|
|
11
11
|
require('../context/UIContext.js');
|
|
12
12
|
require('../hooks/useMediaQueries.js');
|
|
13
13
|
require('react-responsive');
|
|
14
|
+
require('../utils/setViewportProperty.js');
|
|
14
15
|
require('../hooks/useStyles.js');
|
|
15
16
|
require('lodash/maxBy');
|
|
16
17
|
require('lodash/upperFirst');
|
|
17
18
|
require('../hooks/styleAttributes.js');
|
|
18
|
-
require('../../Icon-
|
|
19
|
+
require('../../Icon-B_bS-o4g.js');
|
|
19
20
|
require('react-inlinesvg');
|
|
20
|
-
require('../../Link-
|
|
21
|
-
require('../../Tooltip-
|
|
22
|
-
require('../../Text-
|
|
23
|
-
require('../../Title-
|
|
24
|
-
require('../../Loader-
|
|
21
|
+
require('../../Link-CxWmYMyL.js');
|
|
22
|
+
require('../../Tooltip-CNua1g76.js');
|
|
23
|
+
require('../../Text-Beslj4Ns.js');
|
|
24
|
+
require('../../Title-DBaHcpvB.js');
|
|
25
|
+
require('../../Loader-Dn036JwE.js');
|
|
25
26
|
|
|
26
27
|
|
|
27
28
|
|
|
@@ -11,6 +11,7 @@ require('lodash/castArray');
|
|
|
11
11
|
require('../context/UIContext.js');
|
|
12
12
|
require('../hooks/useMediaQueries.js');
|
|
13
13
|
require('react-responsive');
|
|
14
|
+
require('../utils/setViewportProperty.js');
|
|
14
15
|
require('lodash/maxBy');
|
|
15
16
|
require('lodash/upperFirst');
|
|
16
17
|
require('../hooks/styleAttributes.js');
|
|
@@ -4,7 +4,7 @@ var jsxRuntime = require('react/jsx-runtime');
|
|
|
4
4
|
var clsx = require('clsx');
|
|
5
5
|
var useDeviceTargetClassGenerator = require('../hooks/useDeviceTargetClassGenerator.js');
|
|
6
6
|
var Image = require('../../Image-BbBG_UGI.js');
|
|
7
|
-
var Text = require('../../Text-
|
|
7
|
+
var Text = require('../../Text-Beslj4Ns.js');
|
|
8
8
|
require('../../tslib.es6-CCZ3TN_7.js');
|
|
9
9
|
require('react');
|
|
10
10
|
require('lodash/camelCase');
|
|
@@ -12,13 +12,14 @@ require('lodash/castArray');
|
|
|
12
12
|
require('../context/UIContext.js');
|
|
13
13
|
require('../hooks/useMediaQueries.js');
|
|
14
14
|
require('react-responsive');
|
|
15
|
+
require('../utils/setViewportProperty.js');
|
|
15
16
|
require('../hooks/useStyles.js');
|
|
16
17
|
require('lodash/maxBy');
|
|
17
18
|
require('lodash/upperFirst');
|
|
18
19
|
require('../hooks/styleAttributes.js');
|
|
19
20
|
|
|
20
21
|
function Card(props) {
|
|
21
|
-
var children = props.children, className = props.className, image = props.image, _a = props.imageShape, imageShape = _a ===
|
|
22
|
+
var children = props.children, className = props.className, image = props.image, _a = props.imageShape, imageShape = _a === void 0 ? 'rounded' : _a, size = props.size, src = props.src, text = props.text, _b = props.textColor, textColor = _b === void 0 ? 'surfaceTextPrimary' : _b, _c = props.textSize, textSize = _c === void 0 ? 'p' : _c, textTag = props.textTag, title = props.title, _d = props.titleColor, titleColor = _d === void 0 ? 'surfaceTextPrimary' : _d, _e = props.titleSize, titleSize = _e === void 0 ? 'h5' : _e, _f = props.titleTag, titleTag = _f === void 0 ? 'span' : _f, type = props.type, onClick = props.onClick;
|
|
22
23
|
var classGenerator = useDeviceTargetClassGenerator.useDeviceTargetClassGenerator(props);
|
|
23
24
|
var shapeClass = classGenerator.shapeClass, widthClass = classGenerator.widthClass;
|
|
24
25
|
return (jsxRuntime.jsx("div", { className: clsx(className, 'card', shapeClass && "card_shape_".concat(shapeClass), size && "card_size_".concat(size), type && "card_type_".concat(type), widthClass && "resize-horizontal_".concat(widthClass)), onClick: onClick, children: jsxRuntime.jsxs("div", { className: "card__wrapper", children: [image, src && jsxRuntime.jsx(Image.Image, { className: "card__image", shape: imageShape, src: src }), jsxRuntime.jsxs("div", { className: "card__data", children: [title && (jsxRuntime.jsx(Text.Text, { className: "card__data-title", size: titleSize, tag: titleTag, textColor: titleColor, children: title })), text && (jsxRuntime.jsx(Text.Text, { className: "card__data-desc", size: textSize, tag: textTag, textColor: textColor, children: text }))] }), children] }) }));
|
|
@@ -4,9 +4,9 @@ var jsxRuntime = require('react/jsx-runtime');
|
|
|
4
4
|
var clsx = require('clsx');
|
|
5
5
|
var useDeviceTargetClassGenerator = require('../hooks/useDeviceTargetClassGenerator.js');
|
|
6
6
|
var useStyles = require('../hooks/useStyles.js');
|
|
7
|
-
var Icon = require('../../Icon-
|
|
8
|
-
var Label = require('../../Label-
|
|
9
|
-
var Text = require('../../Text-
|
|
7
|
+
var Icon = require('../../Icon-B_bS-o4g.js');
|
|
8
|
+
var Label = require('../../Label-HKRKV3mn.js');
|
|
9
|
+
var Text = require('../../Text-Beslj4Ns.js');
|
|
10
10
|
require('../../tslib.es6-CCZ3TN_7.js');
|
|
11
11
|
require('react');
|
|
12
12
|
require('lodash/camelCase');
|
|
@@ -14,13 +14,14 @@ require('lodash/castArray');
|
|
|
14
14
|
require('../context/UIContext.js');
|
|
15
15
|
require('../hooks/useMediaQueries.js');
|
|
16
16
|
require('react-responsive');
|
|
17
|
+
require('../utils/setViewportProperty.js');
|
|
17
18
|
require('lodash/maxBy');
|
|
18
19
|
require('lodash/upperFirst');
|
|
19
20
|
require('../hooks/styleAttributes.js');
|
|
20
21
|
require('react-inlinesvg');
|
|
21
|
-
require('../../Link-
|
|
22
|
-
require('../../Tooltip-
|
|
23
|
-
require('../../Title-
|
|
22
|
+
require('../../Link-CxWmYMyL.js');
|
|
23
|
+
require('../../Tooltip-CNua1g76.js');
|
|
24
|
+
require('../../Title-DBaHcpvB.js');
|
|
24
25
|
|
|
25
26
|
var cellAppearance = {
|
|
26
27
|
dev: {},
|
|
@@ -33,14 +34,14 @@ var cellConfig = {
|
|
|
33
34
|
},
|
|
34
35
|
};
|
|
35
36
|
function Cell(props) {
|
|
36
|
-
var isActive = props.isActive, _a = props.isDisabled, isDisabled = _a ===
|
|
37
|
+
var isActive = props.isActive, _a = props.isDisabled, isDisabled = _a === void 0 ? false : _a, isEqual = props.isEqual, after = props.after, appearance = props.appearance, before = props.before, className = props.className, mode = props.mode, reverse = props.reverse, set = props.set, showTitleLabel = props.showTitleLabel, showValueLabel = props.showValueLabel, size = props.size, title = props.title, titleIcon = props.titleIcon, titleIconFill = props.titleIconFill, titleIconFillHover = props.titleIconFillHover, titleIconFillSize = props.titleIconFillSize, titleIconItemFill = props.titleIconItemFill, titleIconShape = props.titleIconShape, titleIconSrc = props.titleIconSrc, titleLabel = props.titleLabel, titleLabelAppearance = props.titleLabelAppearance, titleLabelShape = props.titleLabelShape, titleLabelSize = props.titleLabelSize, titleLabelTextSize = props.titleLabelTextSize, titleTag = props.titleTag, titleTextColor = props.titleTextColor, titleTextSize = props.titleTextSize, titleTextTruncate = props.titleTextTruncate, titleTextWeight = props.titleTextWeight, titleTextWrap = props.titleTextWrap, value = props.value, valueIcon = props.valueIcon, valueIconFill = props.valueIconFill, valueIconFillHover = props.valueIconFillHover, valueIconFillSize = props.valueIconFillSize, valueIconItemFill = props.valueIconItemFill, valueIconShape = props.valueIconShape, valueIconSrc = props.valueIconSrc, valueLabel = props.valueLabel, valueLabelAppearance = props.valueLabelAppearance, valueLabelShape = props.valueLabelShape, valueLabelSize = props.valueLabelSize, valueLabelTextSize = props.valueLabelTextSize, valueTag = props.valueTag, valueTextAlign = props.valueTextAlign, valueTextColor = props.valueTextColor, valueTextSize = props.valueTextSize, valueTextTruncate = props.valueTextTruncate, valueTextWeight = props.valueTextWeight, valueTextWrap = props.valueTextWrap, zeroGap = props.zeroGap, zeroPadding = props.zeroPadding, onClick = props.onClick, onMouseEnter = props.onMouseEnter;
|
|
37
38
|
// @ts-expect-error
|
|
38
39
|
var appearanceConfig = cellConfig.appearance && cellConfig.appearance[appearance];
|
|
39
40
|
var classGenerator = useDeviceTargetClassGenerator.useDeviceTargetClassGenerator(props, appearanceConfig);
|
|
40
41
|
var bgFillActiveClass = classGenerator.bgFillActiveClass, bgFillClass = classGenerator.bgFillClass, bgFillDisabledClass = classGenerator.bgFillDisabledClass, bgFillHoverClass = classGenerator.bgFillHoverClass, bgShapeClass = classGenerator.bgShapeClass, directionClass = classGenerator.directionClass, fillActiveClass = classGenerator.fillActiveClass, fillClass = classGenerator.fillClass, fillDisabledClass = classGenerator.fillDisabledClass, fillHoverClass = classGenerator.fillHoverClass, gapClass = classGenerator.gapClass, shapeClass = classGenerator.shapeClass, widthClass = classGenerator.widthClass;
|
|
41
42
|
// @ts-expect-error
|
|
42
|
-
var
|
|
43
|
-
return (jsxRuntime.jsxs("div", { className: clsx(className, 'cell', mode && "cell_mode_".concat(mode), size && "cell_size_".concat(size), set && "cell_set_".concat(set), bgFillClass && "fill_".concat(bgFillClass), bgFillHoverClass && "fill_hover_".concat(bgFillHoverClass), isActive && bgFillActiveClass && "fill_active_".concat(bgFillActiveClass), isDisabled && bgFillDisabledClass && "fill_disabled_".concat(bgFillDisabledClass), bgShapeClass && "cell_shape_".concat(bgShapeClass), widthClass && "width_".concat(widthClass), gapClass && "gap_".concat(gapClass), zeroPadding && 'cell_reset-padding', zeroGap && 'cell_reset-gap', reverse && 'cell_reverse'), style: cellStyles, onClick: onClick, onMouseEnter: onMouseEnter, children: [before && jsxRuntime.jsx("div", { className: "cell__before", children: before }), jsxRuntime.jsxs("div", { className: clsx('cell__wrapper', directionClass && "cell__wrapper_direction_".concat(directionClass), fillClass && "fill_".concat(fillClass), fillHoverClass && "fill_hover_".concat(fillHoverClass), isActive && fillActiveClass && "fill_active_".concat(fillActiveClass), isDisabled && fillDisabledClass && "fill_disabled_".concat(fillDisabledClass), shapeClass && "cell__wrapper_shape_".concat(shapeClass), isEqual && 'cell__wrapper-equal'), children: [title && (jsxRuntime.jsxs("div", { className: "cell__data", children: [jsxRuntime.jsx(Text.Text, { className: "cell__title", size: titleTextSize, tag: titleTag, textColor: titleTextColor, textTruncate: titleTextTruncate, textWeight: titleTextWeight, textWrap: titleTextWrap, children: title }), (titleIcon || titleIconSrc) && (jsxRuntime.jsx(Icon.Icon, { className: "cell__icon", fill: titleIconFill, fillSize: titleIconFillSize, iconFill: titleIconItemFill, iconFillHover: titleIconFillHover, imageSrc: titleIconSrc, shape: titleIconShape, SvgImage: titleIcon })), showTitleLabel && (jsxRuntime.jsx(Label.Label, { labelTextSize: titleLabelTextSize, appearance: titleLabelAppearance, label: titleLabel, shape: titleLabelShape, size: titleLabelSize }))] })), value && (jsxRuntime.jsxs("div", { className: "cell__data", children: [jsxRuntime.jsx(Text.Text, { className: "cell__value", size: valueTextSize, tag: valueTag, textAlign: valueTextAlign, textColor: valueTextColor, textTruncate: valueTextTruncate, textWeight: valueTextWeight, textWrap: valueTextWrap, children: value }), (valueIcon || valueIconSrc) && (jsxRuntime.jsx(Icon.Icon, { className: "cell__icon", fill: valueIconFill, fillSize: valueIconFillSize, iconFill: valueIconItemFill, iconFillHover: valueIconFillHover, imageSrc: valueIconSrc, shape: valueIconShape, SvgImage: valueIcon })), showValueLabel && (jsxRuntime.jsx(Label.Label, { labelTextSize: valueLabelTextSize, appearance: valueLabelAppearance, label: valueLabel, shape: valueLabelShape, size: valueLabelSize }))] }))] }), after && jsxRuntime.jsx("div", { className: "cell__after", children: after })] }));
|
|
43
|
+
var _b = useStyles.useStyles(props), dataStyles = _b.data, cellStyles = _b.styles;
|
|
44
|
+
return (jsxRuntime.jsxs("div", { className: clsx(className, 'cell', mode && "cell_mode_".concat(mode), size && "cell_size_".concat(size), set && "cell_set_".concat(set), bgFillClass && "fill_".concat(bgFillClass), bgFillHoverClass && "fill_hover_".concat(bgFillHoverClass), isActive && bgFillActiveClass && "fill_active_".concat(bgFillActiveClass), isDisabled && bgFillDisabledClass && "fill_disabled_".concat(bgFillDisabledClass), bgShapeClass && "cell_shape_".concat(bgShapeClass), widthClass && "width_".concat(widthClass), gapClass && "gap_".concat(gapClass), zeroPadding && 'cell_reset-padding', zeroGap && 'cell_reset-gap', reverse && 'cell_reverse'), style: cellStyles, onClick: onClick, onMouseEnter: onMouseEnter, children: [before && jsxRuntime.jsx("div", { className: "cell__before", children: before }), jsxRuntime.jsxs("div", { className: clsx('cell__wrapper', directionClass && "cell__wrapper_direction_".concat(directionClass), fillClass && "fill_".concat(fillClass), fillHoverClass && "fill_hover_".concat(fillHoverClass), isActive && fillActiveClass && "fill_active_".concat(fillActiveClass), isDisabled && fillDisabledClass && "fill_disabled_".concat(fillDisabledClass), shapeClass && "cell__wrapper_shape_".concat(shapeClass), isEqual && 'cell__wrapper-equal'), children: [title && (jsxRuntime.jsxs("div", { className: "cell__data", style: dataStyles, children: [jsxRuntime.jsx(Text.Text, { className: "cell__title", size: titleTextSize, tag: titleTag, textColor: titleTextColor, textTruncate: titleTextTruncate, textWeight: titleTextWeight, textWrap: titleTextWrap, children: title }), (titleIcon || titleIconSrc) && (jsxRuntime.jsx(Icon.Icon, { className: "cell__icon", fill: titleIconFill, fillSize: titleIconFillSize, iconFill: titleIconItemFill, iconFillHover: titleIconFillHover, imageSrc: titleIconSrc, shape: titleIconShape, SvgImage: titleIcon })), showTitleLabel && (jsxRuntime.jsx(Label.Label, { labelTextSize: titleLabelTextSize, appearance: titleLabelAppearance, label: titleLabel, shape: titleLabelShape, size: titleLabelSize }))] })), value && (jsxRuntime.jsxs("div", { className: "cell__data", style: dataStyles, children: [jsxRuntime.jsx(Text.Text, { className: "cell__value", size: valueTextSize, tag: valueTag, textAlign: valueTextAlign, textColor: valueTextColor, textTruncate: valueTextTruncate, textWeight: valueTextWeight, textWrap: valueTextWrap, children: value }), (valueIcon || valueIconSrc) && (jsxRuntime.jsx(Icon.Icon, { className: "cell__icon", fill: valueIconFill, fillSize: valueIconFillSize, iconFill: valueIconItemFill, iconFillHover: valueIconFillHover, imageSrc: valueIconSrc, shape: valueIconShape, SvgImage: valueIcon })), showValueLabel && (jsxRuntime.jsx(Label.Label, { labelTextSize: valueLabelTextSize, appearance: valueLabelAppearance, label: valueLabel, shape: valueLabelShape, size: valueLabelSize }))] }))] }), after && jsxRuntime.jsx("div", { className: "cell__after", children: after })] }));
|
|
44
45
|
}
|
|
45
46
|
|
|
46
47
|
exports.Cell = Cell;
|