@itcase/ui 1.9.28 → 1.9.29
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/{Avatar_cjs_CS01fvh-.js → Avatar_cjs_DsgsCeRd.js} +2 -2
- package/dist/{Avatar_es_DRObE1DB.js → Avatar_es_DBNS3IWw.js} +2 -2
- package/dist/{Button_cjs_DPs7uj_n.js → Button_cjs_VVROhnrj.js} +19 -33
- package/dist/{Button_es_ljlle2Pu.js → Button_es_D74OMP6r.js} +19 -33
- package/dist/{ChipsGroup_cjs_Sn3uiCSJ.js → ChipsGroup_cjs_P0UlUnid.js} +4 -4
- package/dist/{ChipsGroup_es_CbzUWqG9.js → ChipsGroup_es_BgECuDPT.js} +4 -4
- package/dist/{DatePicker_cjs_Bfiav-tb.js → DatePicker_cjs_CnXoxGZ_.js} +5 -5
- package/dist/{DatePicker_es_CtbVXMmy.js → DatePicker_es_DyAZeFi2.js} +5 -5
- package/dist/{DropdownItem_cjs_Capn0Iu7.js → DropdownItem_cjs_l_fnynBJ.js} +2 -2
- package/dist/{DropdownItem_es_CTw07zF3.js → DropdownItem_es_B36TJ2oI.js} +2 -2
- package/dist/{Group_cjs_DNI9PTBq.js → Group_cjs_C1YVff0N.js} +1 -1
- package/dist/{Group_es_nBtACpoG.js → Group_es_C69f2Dom.js} +1 -1
- package/dist/{Icon_cjs_BgGtdviU.js → Icon_cjs_D-jQrwjV.js} +2 -2
- package/dist/{Icon_es_CtZHchZc.js → Icon_es_BstDGBF3.js} +2 -2
- package/dist/{Input_cjs_KgFCCi2U.js → Input_cjs_CV0nr-f4.js} +1 -1
- package/dist/{Input_es_I8GPoibb.js → Input_es_B2dHRF47.js} +1 -1
- package/dist/{Label_cjs_FRIVslSV.js → Label_cjs_CyPU9hqO.js} +3 -3
- package/dist/{Label_es_CI2mt2wH.js → Label_es_qnCgQX52.js} +3 -3
- package/dist/{Loader_cjs_DWBtnjaL.js → Loader_cjs_B3j9ATrq.js} +1 -1
- package/dist/{Loader_es_BvTBRuay.js → Loader_es_wjTqawH6.js} +1 -1
- package/dist/{Overlay_cjs_tGA2fU43.js → Overlay_cjs_-hY4qbRG.js} +1 -1
- package/dist/{Overlay_es_BS7OTFoy.js → Overlay_es_dNz3djDB.js} +1 -1
- package/dist/{SelectContainer_cjs_doMatESV.js → SelectContainer_cjs_CnhODaJP.js} +4 -4
- package/dist/{SelectContainer_es_2ZX3VSMS.js → SelectContainer_es_CcYDHcBP.js} +4 -4
- package/dist/{Text_cjs_DG2eMKBi.js → Text_cjs_Co2XdYF-.js} +1 -1
- package/dist/{Text_es_CU9KR5AE.js → Text_es_DaYcLe4H.js} +1 -1
- package/dist/cjs/components/Accordion.js +2 -2
- package/dist/cjs/components/Avatar.js +3 -3
- package/dist/cjs/components/AvatarStack.js +4 -4
- package/dist/cjs/components/Badge.js +2 -2
- package/dist/cjs/components/Breadcrumbs.js +2 -2
- package/dist/cjs/components/Button.js +4 -4
- package/dist/cjs/components/Cell.js +3 -3
- package/dist/cjs/components/Checkbox.js +1 -1
- package/dist/cjs/components/Chips.js +3 -3
- package/dist/cjs/components/Choice.js +4 -4
- package/dist/cjs/components/CookiesWarning.js +4 -4
- package/dist/cjs/components/Dadata.js +1 -1
- package/dist/cjs/components/DatePeriod.js +10 -10
- package/dist/cjs/components/DatePicker.js +7 -7
- package/dist/cjs/components/Drawer.js +2 -2
- package/dist/cjs/components/Dropdown.js +3 -3
- package/dist/cjs/components/Flex.js +2 -2
- package/dist/cjs/components/Grid.js +2 -2
- package/dist/cjs/components/Group.js +1 -1
- package/dist/cjs/components/HeroTitle.js +3 -3
- package/dist/cjs/components/Icon.js +2 -2
- package/dist/cjs/components/Input.js +1 -1
- package/dist/cjs/components/InputNumber.js +181 -0
- package/dist/cjs/components/InputPassword.js +2 -2
- package/dist/cjs/components/Label.js +3 -3
- package/dist/cjs/components/Loader.js +2 -2
- package/dist/cjs/components/MenuItem.js +4 -4
- package/dist/cjs/components/Modal.js +5 -5
- package/dist/cjs/components/ModalSheetBottom.js +2 -2
- package/dist/cjs/components/Notification.js +5 -5
- package/dist/cjs/components/Overlay.js +1 -1
- package/dist/cjs/components/Pagination.js +4 -4
- package/dist/cjs/components/Radio.js +1 -1
- package/dist/cjs/components/RangeSlider.js +2 -2
- package/dist/cjs/components/Response.js +6 -6
- package/dist/cjs/components/Search.js +2 -2
- package/dist/cjs/components/Segmented.js +2 -2
- package/dist/cjs/components/Select.js +5 -5
- package/dist/cjs/components/Swiper.js +3 -3
- package/dist/cjs/components/Switch.js +1 -1
- package/dist/cjs/components/Tab.js +5 -5
- package/dist/cjs/components/Text.js +1 -1
- package/dist/cjs/components/Tile.js +3 -3
- package/dist/cjs/components/Title.js +2 -2
- package/dist/cjs/components/Tooltip.js +2 -2
- package/dist/cjs/components/Warning.js +2 -2
- package/dist/components/Accordion.js +2 -2
- package/dist/components/Avatar.js +3 -3
- package/dist/components/AvatarStack.js +4 -4
- package/dist/components/Badge.js +2 -2
- package/dist/components/Breadcrumbs.js +2 -2
- package/dist/components/Button.js +4 -4
- package/dist/components/Cell.js +3 -3
- package/dist/components/Checkbox.js +1 -1
- package/dist/components/Chips.js +3 -3
- package/dist/components/Choice.js +4 -4
- package/dist/components/CookiesWarning.js +4 -4
- package/dist/components/Dadata.js +1 -1
- package/dist/components/DatePeriod.js +10 -10
- package/dist/components/DatePicker.js +7 -7
- package/dist/components/Drawer.js +2 -2
- package/dist/components/Dropdown.js +3 -3
- package/dist/components/Flex.js +2 -2
- package/dist/components/Grid.js +2 -2
- package/dist/components/Group.js +1 -1
- package/dist/components/HeroTitle.js +3 -3
- package/dist/components/Icon.js +2 -2
- package/dist/components/Input.js +1 -1
- package/dist/components/InputNumber.js +178 -0
- package/dist/components/InputPassword.js +2 -2
- package/dist/components/Label.js +3 -3
- package/dist/components/Loader.js +2 -2
- package/dist/components/MenuItem.js +4 -4
- package/dist/components/Modal.js +5 -5
- package/dist/components/ModalSheetBottom.js +2 -2
- package/dist/components/Notification.js +5 -5
- package/dist/components/Overlay.js +1 -1
- package/dist/components/Pagination.js +4 -4
- package/dist/components/Radio.js +1 -1
- package/dist/components/RangeSlider.js +2 -2
- package/dist/components/Response.js +6 -6
- package/dist/components/Search.js +2 -2
- package/dist/components/Segmented.js +2 -2
- package/dist/components/Select.js +5 -5
- package/dist/components/Swiper.js +3 -3
- package/dist/components/Switch.js +1 -1
- package/dist/components/Tab.js +5 -5
- package/dist/components/Text.js +1 -1
- package/dist/components/Tile.js +3 -3
- package/dist/components/Title.js +2 -2
- package/dist/components/Tooltip.js +2 -2
- package/dist/components/Warning.js +2 -2
- package/dist/css/styles/bundles.css +49 -0
- package/dist/types/components/Button/Button.appearance.d.ts +290 -0
- package/dist/types/components/Button/Button.d.ts +5 -0
- package/dist/types/components/Button/Button.interface.d.ts +5 -0
- package/dist/types/components/InputNumber/InputNumber.appearance.d.ts +3 -0
- package/dist/types/components/InputNumber/InputNumber.d.ts +3 -0
- package/dist/types/components/InputNumber/InputNumber.interfaces.d.ts +48 -0
- package/dist/types/components/InputNumber/appearance/InputNumberDefault.d.ts +3 -0
- package/dist/types/components/InputNumber/appearance/InputNumberShape.d.ts +25 -0
- package/dist/types/components/InputNumber/appearance/inputNumberSize.d.ts +33 -0
- package/dist/types/components/InputNumber/appearance/inputNumberStyle.d.ts +16 -0
- package/dist/types/components/InputNumber/appearance/inputNumberSurface.d.ts +3 -0
- package/dist/types/components/InputNumber/index.d.ts +2 -0
- package/dist/types/components/RangeSlider/RangeSlider.interface.d.ts +1 -0
- package/dist/types/components/Tab/Tab.interface.d.ts +68 -40
- package/package.json +10 -10
|
@@ -5,9 +5,9 @@ var React = require('react');
|
|
|
5
5
|
var clsx = require('clsx');
|
|
6
6
|
var useAppearanceConfig = require('./cjs/hooks/useAppearanceConfig/useAppearanceConfig.js');
|
|
7
7
|
var useDevicePropsGenerator = require('./cjs/hooks/useDevicePropsGenerator/useDevicePropsGenerator.js');
|
|
8
|
-
var Icon = require('./
|
|
8
|
+
var Icon = require('./Icon_cjs_D-jQrwjV.js');
|
|
9
9
|
var Image = require('./Image_cjs_BUM81t4Y.js');
|
|
10
|
-
var Text = require('./
|
|
10
|
+
var Text = require('./Text_cjs_Co2XdYF-.js');
|
|
11
11
|
|
|
12
12
|
const avatarAppearanceDefault = {
|
|
13
13
|
surfacePrimary: {
|
|
@@ -3,9 +3,9 @@ import { useMemo } from 'react';
|
|
|
3
3
|
import clsx from 'clsx';
|
|
4
4
|
import { useAppearanceConfig } from './hooks/useAppearanceConfig/useAppearanceConfig.js';
|
|
5
5
|
import { useDevicePropsGenerator } from './hooks/useDevicePropsGenerator/useDevicePropsGenerator.js';
|
|
6
|
-
import { I as Icon, B as Badge } from './
|
|
6
|
+
import { I as Icon, B as Badge } from './Icon_es_BstDGBF3.js';
|
|
7
7
|
import { I as Image } from './Image_es_C-IjVkKX.js';
|
|
8
|
-
import { T as Text } from './
|
|
8
|
+
import { T as Text } from './Text_es_DaYcLe4H.js';
|
|
9
9
|
|
|
10
10
|
const avatarAppearanceDefault = {
|
|
11
11
|
surfacePrimary: {
|
|
@@ -6,10 +6,10 @@ var clsx = require('clsx');
|
|
|
6
6
|
var useAppearanceConfig = require('./cjs/hooks/useAppearanceConfig/useAppearanceConfig.js');
|
|
7
7
|
var useDevicePropsGenerator = require('./cjs/hooks/useDevicePropsGenerator/useDevicePropsGenerator.js');
|
|
8
8
|
var useStyles = require('./cjs/hooks/useStyles/useStyles.js');
|
|
9
|
-
var Icon = require('./
|
|
9
|
+
var Icon = require('./Icon_cjs_D-jQrwjV.js');
|
|
10
10
|
var Link = require('./Link_cjs_qKXVfU8e.js');
|
|
11
|
-
var Loader = require('./
|
|
12
|
-
var Text = require('./
|
|
11
|
+
var Loader = require('./Loader_cjs_B3j9ATrq.js');
|
|
12
|
+
var Text = require('./Text_cjs_Co2XdYF-.js');
|
|
13
13
|
|
|
14
14
|
const buttonAppearanceAccent = {
|
|
15
15
|
accentMutedPrimary: {
|
|
@@ -243,64 +243,50 @@ const buttonAppearanceSize = {
|
|
|
243
243
|
sizeXXL: {
|
|
244
244
|
size: 'xxl',
|
|
245
245
|
labelTextSize: 'xl',
|
|
246
|
-
|
|
247
|
-
|
|
248
|
-
iconBeforeFillSize: '24',
|
|
249
|
-
iconBeforeSize: '24',
|
|
246
|
+
iconAfterAppearance: 'size24_24',
|
|
247
|
+
iconBeforeAppearance: 'size24_24',
|
|
250
248
|
loaderAppearanceSize: 'sizeL',
|
|
251
249
|
},
|
|
252
250
|
sizeXL: {
|
|
253
251
|
size: 'xl',
|
|
254
252
|
labelTextSize: 'l',
|
|
255
|
-
|
|
256
|
-
|
|
257
|
-
iconBeforeFillSize: '24',
|
|
258
|
-
iconBeforeSize: '24',
|
|
253
|
+
iconAfterAppearance: 'size24_24',
|
|
254
|
+
iconBeforeAppearance: 'size24_24',
|
|
259
255
|
loaderAppearanceSize: 'sizeL',
|
|
260
256
|
},
|
|
261
257
|
sizeL: {
|
|
262
258
|
size: 'l',
|
|
263
259
|
labelTextSize: 'l',
|
|
264
|
-
|
|
265
|
-
|
|
266
|
-
iconBeforeFillSize: '24',
|
|
267
|
-
iconBeforeSize: '24',
|
|
260
|
+
iconAfterAppearance: 'size24_24',
|
|
261
|
+
iconBeforeAppearance: 'size24_24',
|
|
268
262
|
loaderAppearanceSize: 'sizeL',
|
|
269
263
|
},
|
|
270
264
|
sizeM: {
|
|
271
265
|
size: 'm',
|
|
272
266
|
labelTextSize: 'm',
|
|
273
|
-
|
|
274
|
-
|
|
275
|
-
iconBeforeFillSize: '24',
|
|
276
|
-
iconBeforeSize: '24',
|
|
267
|
+
iconAfterAppearance: 'size24_24',
|
|
268
|
+
iconBeforeAppearance: 'size24_24',
|
|
277
269
|
loaderAppearanceSize: 'sizeL',
|
|
278
270
|
},
|
|
279
271
|
sizeS: {
|
|
280
272
|
size: 's',
|
|
281
273
|
labelTextSize: 's',
|
|
282
|
-
|
|
283
|
-
|
|
284
|
-
iconBeforeFillSize: '20',
|
|
285
|
-
iconBeforeSize: '20',
|
|
274
|
+
iconAfterAppearance: 'size20_20',
|
|
275
|
+
iconBeforeAppearance: 'size20_20',
|
|
286
276
|
loaderAppearanceSize: 'sizeL',
|
|
287
277
|
},
|
|
288
278
|
sizeXS: {
|
|
289
279
|
size: 'xs',
|
|
290
280
|
labelTextSize: 'xs',
|
|
291
|
-
|
|
292
|
-
|
|
293
|
-
iconBeforeFillSize: '16',
|
|
294
|
-
iconBeforeSize: '16',
|
|
281
|
+
iconAfterAppearance: 'size16_16',
|
|
282
|
+
iconBeforeAppearance: 'size16_16',
|
|
295
283
|
loaderAppearanceSize: 'sizeL',
|
|
296
284
|
},
|
|
297
285
|
sizeXXS: {
|
|
298
286
|
size: 'xxs',
|
|
299
287
|
labelTextSize: 'xs',
|
|
300
|
-
|
|
301
|
-
|
|
302
|
-
iconBeforeFillSize: '14',
|
|
303
|
-
iconBeforeSize: '14',
|
|
288
|
+
iconAfterAppearance: 'size14_14',
|
|
289
|
+
iconBeforeAppearance: 'size14_14',
|
|
304
290
|
loaderAppearanceSize: 'sizeL',
|
|
305
291
|
},
|
|
306
292
|
};
|
|
@@ -464,7 +450,7 @@ const Button = React.forwardRef(function Button(props, ref) {
|
|
|
464
450
|
const { appearance, className, dataTestId, dataTour, label, Badge, href, htmlType = 'button', link, rel, target, before, after, isDisabled, isLoading = false, onClick, onMouseDown, children, } = props;
|
|
465
451
|
const appearanceConfig = useAppearanceConfig.useAppearanceConfig(appearance, buttonConfig, isDisabled);
|
|
466
452
|
const propsGenerator = useDevicePropsGenerator.useDevicePropsGenerator(props, appearanceConfig);
|
|
467
|
-
const { fillClass, fillHoverClass, labelTextColor, labelTextColorHover, labelTextSize, labelTextTruncate, labelTextWeight, labelTextWidth, labelTextWrap, borderColorClass, borderTypeClass, borderWidthClass, elevationClass, icon, iconAfter, iconAfterFill, iconAfterFillIcon, iconAfterFillSize, iconAfterShape, iconAfterSize, iconAfterSrc, iconBefore, iconBeforeFill, iconBeforeFillIcon, iconBeforeFillSize, iconBeforeShape, iconBeforeSize, iconBeforeSrc, iconFill, iconFillIcon, iconFillSize, iconShape, iconSize, iconSrc, loaderAppearance, loaderAppearanceSize, loaderFill, loaderItemFill, loaderSize, loaderType = 'simple', shapeClass, shapeStrengthClass, sizeClass, widthClass, zeroGap, zeroPadding, isSkeleton, } = propsGenerator;
|
|
453
|
+
const { fillClass, fillHoverClass, labelTextColor, labelTextColorHover, labelTextSize, labelTextTruncate, labelTextWeight, labelTextWidth, labelTextWrap, borderColorClass, borderTypeClass, borderWidthClass, elevationClass, icon, iconAfter, iconAfterAppearance, iconAfterFill, iconAfterFillIcon, iconAfterFillSize, iconAfterShape, iconAfterSize, iconAfterSrc, iconAppearance, iconBefore, iconBeforeAppearance, iconBeforeFill, iconBeforeFillIcon, iconBeforeFillSize, iconBeforeShape, iconBeforeSize, iconBeforeSrc, iconFill, iconFillIcon, iconFillSize, iconShape, iconSize, iconSrc, loaderAppearance, loaderAppearanceSize, loaderFill, loaderItemFill, loaderSize, loaderType = 'simple', shapeClass, shapeStrengthClass, sizeClass, widthClass, zeroGap, zeroPadding, isSkeleton, } = propsGenerator;
|
|
468
454
|
const { label: labelStyles, styles: buttonStyles } = useStyles.useStyles(props);
|
|
469
455
|
const buttonTypeClass = after ||
|
|
470
456
|
before ||
|
|
@@ -480,7 +466,7 @@ const Button = React.forwardRef(function Button(props, ref) {
|
|
|
480
466
|
? 'button_type_label'
|
|
481
467
|
: buttonTypeClass
|
|
482
468
|
? 'button_type_icon'
|
|
483
|
-
: '', borderWidthClass && `border-width_${borderWidthClass}`, borderColorClass && `border-color_${borderColorClass}`, borderTypeClass && `border_type_${borderTypeClass}`, fillClass && `fill_${fillClass}`, fillHoverClass && !isDisabled && `fill_hover_${fillHoverClass}`, shapeClass && `shape_${shapeClass}`, shapeStrengthClass && `shape-strength_${shapeStrengthClass}`, sizeClass && `button_size_${sizeClass}`, widthClass && `button_width_${widthClass}`, elevationClass && `elevation_${elevationClass}`, onClick && 'cursor_type_pointer', isDisabled && 'button_state_disabled cursor_type_default', Badge && 'button_type_badge', zeroPadding && 'button_reset-padding', zeroGap && 'button_reset-gap', isLoading && 'button_state_loading', isSkeleton && `button_skeleton`), type: htmlType, "data-
|
|
469
|
+
: '', borderWidthClass && `border-width_${borderWidthClass}`, borderColorClass && `border-color_${borderColorClass}`, borderTypeClass && `border_type_${borderTypeClass}`, fillClass && `fill_${fillClass}`, fillHoverClass && !isDisabled && `fill_hover_${fillHoverClass}`, shapeClass && `shape_${shapeClass}`, shapeStrengthClass && `shape-strength_${shapeStrengthClass}`, sizeClass && `button_size_${sizeClass}`, widthClass && `button_width_${widthClass}`, elevationClass && `elevation_${elevationClass}`, onClick && 'cursor_type_pointer', isDisabled && 'button_state_disabled cursor_type_default', Badge && 'button_type_badge', zeroPadding && 'button_reset-padding', zeroGap && 'button_reset-gap', isLoading && 'button_state_loading', isSkeleton && `button_skeleton`), type: htmlType, "data-testid": dataTestId && `${dataTestId}Button`, "data-tour": dataTour, disabled: isDisabled, href: link || href, LinkComponent: "button", rel: rel, style: buttonStyles, target: target, onClick: onClick, onMouseDown: onMouseDown, children: jsxRuntime.jsxs("div", { className: "button__wrapper", ref: ref, children: [isLoading && (jsxRuntime.jsx(Loader.Loader, { appearance: `${loaderAppearance} ${loaderAppearanceSize}`, className: clsx(className, 'button__loader'), type: loaderType, size: loaderSize, fill: loaderFill, itemFill: loaderItemFill })), before, (iconBefore || iconBeforeSrc) && (jsxRuntime.jsx(Icon.Icon, { appearance: iconBeforeAppearance, className: "button__icon_before", fill: iconBeforeFill, fillSize: iconBeforeFillSize, iconFill: iconBeforeFillIcon, iconSize: iconBeforeSize, imageSrc: iconBeforeSrc, shape: iconBeforeShape, SvgImage: iconBefore })), (icon || iconSrc) && (jsxRuntime.jsx(Icon.Icon, { appearance: iconAppearance, className: "button__icon", fill: iconFill, fillSize: iconFillSize, iconFill: iconFillIcon, iconSize: iconSize, imageSrc: iconSrc, shape: iconShape, SvgImage: icon })), (children || label) && (jsxRuntime.jsx(Text.Text, { className: "button__label", width: labelTextWidth, size: labelTextSize, textColor: labelTextColor, textColorHover: labelTextColorHover, textTruncate: labelTextTruncate, textWeight: labelTextWeight, textWrap: labelTextWrap, style: labelStyles, children: children || label })), (iconAfter || iconAfterSrc) && (jsxRuntime.jsx(Icon.Icon, { appearance: iconAfterAppearance, className: "button__icon_after", fill: iconAfterFill, fillSize: iconAfterFillSize, iconFill: iconAfterFillIcon, iconSize: iconAfterSize, imageSrc: iconAfterSrc, shape: iconAfterShape, SvgImage: iconAfter })), Badge, after] }) }));
|
|
484
470
|
});
|
|
485
471
|
|
|
486
472
|
exports.Button = Button;
|
|
@@ -4,10 +4,10 @@ import clsx from 'clsx';
|
|
|
4
4
|
import { useAppearanceConfig } from './hooks/useAppearanceConfig/useAppearanceConfig.js';
|
|
5
5
|
import { useDevicePropsGenerator } from './hooks/useDevicePropsGenerator/useDevicePropsGenerator.js';
|
|
6
6
|
import { useStyles } from './hooks/useStyles/useStyles.js';
|
|
7
|
-
import { I as Icon } from './
|
|
7
|
+
import { I as Icon } from './Icon_es_BstDGBF3.js';
|
|
8
8
|
import { a as LinkWrapper } from './Link_es_P2b6ya7P.js';
|
|
9
|
-
import { L as Loader } from './
|
|
10
|
-
import { T as Text } from './
|
|
9
|
+
import { L as Loader } from './Loader_es_wjTqawH6.js';
|
|
10
|
+
import { T as Text } from './Text_es_DaYcLe4H.js';
|
|
11
11
|
|
|
12
12
|
const buttonAppearanceAccent = {
|
|
13
13
|
accentMutedPrimary: {
|
|
@@ -241,64 +241,50 @@ const buttonAppearanceSize = {
|
|
|
241
241
|
sizeXXL: {
|
|
242
242
|
size: 'xxl',
|
|
243
243
|
labelTextSize: 'xl',
|
|
244
|
-
|
|
245
|
-
|
|
246
|
-
iconBeforeFillSize: '24',
|
|
247
|
-
iconBeforeSize: '24',
|
|
244
|
+
iconAfterAppearance: 'size24_24',
|
|
245
|
+
iconBeforeAppearance: 'size24_24',
|
|
248
246
|
loaderAppearanceSize: 'sizeL',
|
|
249
247
|
},
|
|
250
248
|
sizeXL: {
|
|
251
249
|
size: 'xl',
|
|
252
250
|
labelTextSize: 'l',
|
|
253
|
-
|
|
254
|
-
|
|
255
|
-
iconBeforeFillSize: '24',
|
|
256
|
-
iconBeforeSize: '24',
|
|
251
|
+
iconAfterAppearance: 'size24_24',
|
|
252
|
+
iconBeforeAppearance: 'size24_24',
|
|
257
253
|
loaderAppearanceSize: 'sizeL',
|
|
258
254
|
},
|
|
259
255
|
sizeL: {
|
|
260
256
|
size: 'l',
|
|
261
257
|
labelTextSize: 'l',
|
|
262
|
-
|
|
263
|
-
|
|
264
|
-
iconBeforeFillSize: '24',
|
|
265
|
-
iconBeforeSize: '24',
|
|
258
|
+
iconAfterAppearance: 'size24_24',
|
|
259
|
+
iconBeforeAppearance: 'size24_24',
|
|
266
260
|
loaderAppearanceSize: 'sizeL',
|
|
267
261
|
},
|
|
268
262
|
sizeM: {
|
|
269
263
|
size: 'm',
|
|
270
264
|
labelTextSize: 'm',
|
|
271
|
-
|
|
272
|
-
|
|
273
|
-
iconBeforeFillSize: '24',
|
|
274
|
-
iconBeforeSize: '24',
|
|
265
|
+
iconAfterAppearance: 'size24_24',
|
|
266
|
+
iconBeforeAppearance: 'size24_24',
|
|
275
267
|
loaderAppearanceSize: 'sizeL',
|
|
276
268
|
},
|
|
277
269
|
sizeS: {
|
|
278
270
|
size: 's',
|
|
279
271
|
labelTextSize: 's',
|
|
280
|
-
|
|
281
|
-
|
|
282
|
-
iconBeforeFillSize: '20',
|
|
283
|
-
iconBeforeSize: '20',
|
|
272
|
+
iconAfterAppearance: 'size20_20',
|
|
273
|
+
iconBeforeAppearance: 'size20_20',
|
|
284
274
|
loaderAppearanceSize: 'sizeL',
|
|
285
275
|
},
|
|
286
276
|
sizeXS: {
|
|
287
277
|
size: 'xs',
|
|
288
278
|
labelTextSize: 'xs',
|
|
289
|
-
|
|
290
|
-
|
|
291
|
-
iconBeforeFillSize: '16',
|
|
292
|
-
iconBeforeSize: '16',
|
|
279
|
+
iconAfterAppearance: 'size16_16',
|
|
280
|
+
iconBeforeAppearance: 'size16_16',
|
|
293
281
|
loaderAppearanceSize: 'sizeL',
|
|
294
282
|
},
|
|
295
283
|
sizeXXS: {
|
|
296
284
|
size: 'xxs',
|
|
297
285
|
labelTextSize: 'xs',
|
|
298
|
-
|
|
299
|
-
|
|
300
|
-
iconBeforeFillSize: '14',
|
|
301
|
-
iconBeforeSize: '14',
|
|
286
|
+
iconAfterAppearance: 'size14_14',
|
|
287
|
+
iconBeforeAppearance: 'size14_14',
|
|
302
288
|
loaderAppearanceSize: 'sizeL',
|
|
303
289
|
},
|
|
304
290
|
};
|
|
@@ -462,7 +448,7 @@ const Button = React.forwardRef(function Button(props, ref) {
|
|
|
462
448
|
const { appearance, className, dataTestId, dataTour, label, Badge, href, htmlType = 'button', link, rel, target, before, after, isDisabled, isLoading = false, onClick, onMouseDown, children, } = props;
|
|
463
449
|
const appearanceConfig = useAppearanceConfig(appearance, buttonConfig, isDisabled);
|
|
464
450
|
const propsGenerator = useDevicePropsGenerator(props, appearanceConfig);
|
|
465
|
-
const { fillClass, fillHoverClass, labelTextColor, labelTextColorHover, labelTextSize, labelTextTruncate, labelTextWeight, labelTextWidth, labelTextWrap, borderColorClass, borderTypeClass, borderWidthClass, elevationClass, icon, iconAfter, iconAfterFill, iconAfterFillIcon, iconAfterFillSize, iconAfterShape, iconAfterSize, iconAfterSrc, iconBefore, iconBeforeFill, iconBeforeFillIcon, iconBeforeFillSize, iconBeforeShape, iconBeforeSize, iconBeforeSrc, iconFill, iconFillIcon, iconFillSize, iconShape, iconSize, iconSrc, loaderAppearance, loaderAppearanceSize, loaderFill, loaderItemFill, loaderSize, loaderType = 'simple', shapeClass, shapeStrengthClass, sizeClass, widthClass, zeroGap, zeroPadding, isSkeleton, } = propsGenerator;
|
|
451
|
+
const { fillClass, fillHoverClass, labelTextColor, labelTextColorHover, labelTextSize, labelTextTruncate, labelTextWeight, labelTextWidth, labelTextWrap, borderColorClass, borderTypeClass, borderWidthClass, elevationClass, icon, iconAfter, iconAfterAppearance, iconAfterFill, iconAfterFillIcon, iconAfterFillSize, iconAfterShape, iconAfterSize, iconAfterSrc, iconAppearance, iconBefore, iconBeforeAppearance, iconBeforeFill, iconBeforeFillIcon, iconBeforeFillSize, iconBeforeShape, iconBeforeSize, iconBeforeSrc, iconFill, iconFillIcon, iconFillSize, iconShape, iconSize, iconSrc, loaderAppearance, loaderAppearanceSize, loaderFill, loaderItemFill, loaderSize, loaderType = 'simple', shapeClass, shapeStrengthClass, sizeClass, widthClass, zeroGap, zeroPadding, isSkeleton, } = propsGenerator;
|
|
466
452
|
const { label: labelStyles, styles: buttonStyles } = useStyles(props);
|
|
467
453
|
const buttonTypeClass = after ||
|
|
468
454
|
before ||
|
|
@@ -478,7 +464,7 @@ const Button = React.forwardRef(function Button(props, ref) {
|
|
|
478
464
|
? 'button_type_label'
|
|
479
465
|
: buttonTypeClass
|
|
480
466
|
? 'button_type_icon'
|
|
481
|
-
: '', borderWidthClass && `border-width_${borderWidthClass}`, borderColorClass && `border-color_${borderColorClass}`, borderTypeClass && `border_type_${borderTypeClass}`, fillClass && `fill_${fillClass}`, fillHoverClass && !isDisabled && `fill_hover_${fillHoverClass}`, shapeClass && `shape_${shapeClass}`, shapeStrengthClass && `shape-strength_${shapeStrengthClass}`, sizeClass && `button_size_${sizeClass}`, widthClass && `button_width_${widthClass}`, elevationClass && `elevation_${elevationClass}`, onClick && 'cursor_type_pointer', isDisabled && 'button_state_disabled cursor_type_default', Badge && 'button_type_badge', zeroPadding && 'button_reset-padding', zeroGap && 'button_reset-gap', isLoading && 'button_state_loading', isSkeleton && `button_skeleton`), type: htmlType, "data-
|
|
467
|
+
: '', borderWidthClass && `border-width_${borderWidthClass}`, borderColorClass && `border-color_${borderColorClass}`, borderTypeClass && `border_type_${borderTypeClass}`, fillClass && `fill_${fillClass}`, fillHoverClass && !isDisabled && `fill_hover_${fillHoverClass}`, shapeClass && `shape_${shapeClass}`, shapeStrengthClass && `shape-strength_${shapeStrengthClass}`, sizeClass && `button_size_${sizeClass}`, widthClass && `button_width_${widthClass}`, elevationClass && `elevation_${elevationClass}`, onClick && 'cursor_type_pointer', isDisabled && 'button_state_disabled cursor_type_default', Badge && 'button_type_badge', zeroPadding && 'button_reset-padding', zeroGap && 'button_reset-gap', isLoading && 'button_state_loading', isSkeleton && `button_skeleton`), type: htmlType, "data-testid": dataTestId && `${dataTestId}Button`, "data-tour": dataTour, disabled: isDisabled, href: link || href, LinkComponent: "button", rel: rel, style: buttonStyles, target: target, onClick: onClick, onMouseDown: onMouseDown, children: jsxs("div", { className: "button__wrapper", ref: ref, children: [isLoading && (jsx(Loader, { appearance: `${loaderAppearance} ${loaderAppearanceSize}`, className: clsx(className, 'button__loader'), type: loaderType, size: loaderSize, fill: loaderFill, itemFill: loaderItemFill })), before, (iconBefore || iconBeforeSrc) && (jsx(Icon, { appearance: iconBeforeAppearance, className: "button__icon_before", fill: iconBeforeFill, fillSize: iconBeforeFillSize, iconFill: iconBeforeFillIcon, iconSize: iconBeforeSize, imageSrc: iconBeforeSrc, shape: iconBeforeShape, SvgImage: iconBefore })), (icon || iconSrc) && (jsx(Icon, { appearance: iconAppearance, className: "button__icon", fill: iconFill, fillSize: iconFillSize, iconFill: iconFillIcon, iconSize: iconSize, imageSrc: iconSrc, shape: iconShape, SvgImage: icon })), (children || label) && (jsx(Text, { className: "button__label", width: labelTextWidth, size: labelTextSize, textColor: labelTextColor, textColorHover: labelTextColorHover, textTruncate: labelTextTruncate, textWeight: labelTextWeight, textWrap: labelTextWrap, style: labelStyles, children: children || label })), (iconAfter || iconAfterSrc) && (jsx(Icon, { appearance: iconAfterAppearance, className: "button__icon_after", fill: iconAfterFill, fillSize: iconAfterFillSize, iconFill: iconAfterFillIcon, iconSize: iconAfterSize, imageSrc: iconAfterSrc, shape: iconAfterShape, SvgImage: iconAfter })), Badge, after] }) }));
|
|
482
468
|
});
|
|
483
469
|
|
|
484
470
|
export { Button as B, buttonAppearance as a, buttonConfig as b };
|
|
@@ -5,8 +5,8 @@ var clsx = require('clsx');
|
|
|
5
5
|
var useDevicePropsGenerator = require('./cjs/hooks/useDevicePropsGenerator/useDevicePropsGenerator.js');
|
|
6
6
|
var useStyles = require('./cjs/hooks/useStyles/useStyles.js');
|
|
7
7
|
var useAppearanceConfig = require('./cjs/hooks/useAppearanceConfig/useAppearanceConfig.js');
|
|
8
|
-
var Icon = require('./
|
|
9
|
-
var Text = require('./
|
|
8
|
+
var Icon = require('./Icon_cjs_D-jQrwjV.js');
|
|
9
|
+
var Text = require('./Text_cjs_Co2XdYF-.js');
|
|
10
10
|
|
|
11
11
|
const chipsAppearanceAccent = {
|
|
12
12
|
accentMutedPrimary: {
|
|
@@ -327,7 +327,7 @@ function Chips(props) {
|
|
|
327
327
|
? fillClass && `fill_${fillClass}`
|
|
328
328
|
: fillActiveClass && `fill_active_${fillActiveClass}`, !isActive
|
|
329
329
|
? fillHoverClass && `fill_hover_${fillHoverClass}`
|
|
330
|
-
: fillActiveHoverClass && `fill_active_hover_${fillActiveHoverClass}`, shapeClass && `shape_${shapeClass}`, shapeStrengthClass && `shape-strength_${shapeStrengthClass}`, borderColorClass && `border-color_${borderColorClass}`, borderTypeClass && `border_type_${borderTypeClass}`, sizeClass && `chips_size_${sizeClass}`, alignDirectionClass && `align_${alignDirectionClass}`, alignClass && `align_${alignClass}`, isActive && 'chips_state_active', isDisabled && `chips_state_disabled`, cursorClass && `cursor_${cursorClass}`, onClick && 'cursor_type_pointer', isSkeleton && `chips_skeleton`), "data-
|
|
330
|
+
: fillActiveHoverClass && `fill_active_hover_${fillActiveHoverClass}`, shapeClass && `shape_${shapeClass}`, shapeStrengthClass && `shape-strength_${shapeStrengthClass}`, borderColorClass && `border-color_${borderColorClass}`, borderTypeClass && `border_type_${borderTypeClass}`, sizeClass && `chips_size_${sizeClass}`, alignDirectionClass && `align_${alignDirectionClass}`, alignClass && `align_${alignClass}`, isActive && 'chips_state_active', isDisabled && `chips_state_disabled`, cursorClass && `cursor_${cursorClass}`, onClick && 'cursor_type_pointer', isSkeleton && `chips_skeleton`), "data-testid": dataTestId && `${dataTestId}Chips`, "data-tour": dataTour, style: chipsStyles, onClick: !isDisabled ? onClick : undefined, children: jsxRuntime.jsxs("div", { className: "chips__inner", children: [(iconBefore || iconBeforeSrc) && (jsxRuntime.jsx(Icon.Icon, { className: "chips__icon_before", size: iconBeforeSize, fill: iconBeforeFill, fillSize: iconBeforeFillSize, iconFill: iconBeforeFillIcon, iconFillActive: iconBeforeFillActiveIcon, imageSrc: iconBeforeSrc, shape: iconBeforeShape, SvgImage: iconBefore, isActive: isActive, onClick: onClickIconBefore })), typeof label === 'string' ? (jsxRuntime.jsx(Text.Text, { className: "chips__label", size: labelTextSize, textColor: labelTextColor, textColorActive: labelTextActiveColor, textColorActiveHover: labelTextActiveColorHover, textColorHover: labelTextColorHover, textWeight: labelTextWeight, textWrap: labelTextWrap, isActive: isActive, children: label })) : (jsxRuntime.jsx("div", { className: "chips__label", children: label })), children, (iconAfter || iconAfterSrc) && (jsxRuntime.jsx(Icon.Icon, { className: "chips__icon_after", size: iconAfterSize, fill: iconAfterFill, fillSize: iconAfterFillSize, iconFill: iconAfterFillIcon, iconFillActive: iconAfterFillActiveIcon, imageSrc: iconAfterSrc, shape: iconAfterShape, SvgImage: iconAfter, isActive: isActive, onClick: onClickIconAfter })), badgeValue && (jsxRuntime.jsx(Icon.Badge, { appearance: badgeAppearance, className: "chips__badge", size: badgeSize, textColor: badgeTextColor, textSize: badgeTextSize, shape: badgeShape, value: badgeValue }))] }) }));
|
|
331
331
|
}
|
|
332
332
|
|
|
333
333
|
function ChipsGroup(props) {
|
|
@@ -336,7 +336,7 @@ function ChipsGroup(props) {
|
|
|
336
336
|
const { directionClass, alignClass, alignDirectionClass, fillClass, borderColorClass, borderTypeClass, borderWidthClass, chipsAppearance, widthClass, wrapClass, } = propsGenerator;
|
|
337
337
|
// @ts-expect-error
|
|
338
338
|
const { styles: groupStyles } = useStyles.useStyles(props);
|
|
339
|
-
return (jsxRuntime.jsx("div", { className: clsx(className, 'chips-group', 'group', widthClass && `width_${widthClass}`, alignDirectionClass && `align_${alignDirectionClass}`, directionClass && `group_direction_${directionClass}`, alignClass && `align_${alignClass}`, fillClass && `fill_${fillClass}`, horizontalScroll && 'group_scroll_horizontal', wrapClass && `group_wrap_${wrapClass}`, borderColorClass && `border-color_${borderColorClass}`, borderWidthClass && `border-width_${borderWidthClass}`, borderTypeClass && `border_type_${borderTypeClass}`), "data-
|
|
339
|
+
return (jsxRuntime.jsx("div", { className: clsx(className, 'chips-group', 'group', widthClass && `width_${widthClass}`, alignDirectionClass && `align_${alignDirectionClass}`, directionClass && `group_direction_${directionClass}`, alignClass && `align_${alignClass}`, fillClass && `fill_${fillClass}`, horizontalScroll && 'group_scroll_horizontal', wrapClass && `group_wrap_${wrapClass}`, borderColorClass && `border-color_${borderColorClass}`, borderWidthClass && `border-width_${borderWidthClass}`, borderTypeClass && `border_type_${borderTypeClass}`), "data-testid": dataTestId, "data-tour": dataTour, style: Object.assign({}, groupStyles, style), children: children
|
|
340
340
|
? children
|
|
341
341
|
: chipsList?.map((item) => (jsxRuntime.jsx(Chips, { appearance: chipsAppearance, label: item.label, iconAfter: item.iconAfter, iconBefore: item.iconBefore, isActive: item.isActive, isDisabled: item.isDisabled, onClick: (event) => onClick(item, event) }, item.id))) }));
|
|
342
342
|
}
|
|
@@ -3,8 +3,8 @@ import clsx from 'clsx';
|
|
|
3
3
|
import { useDevicePropsGenerator } from './hooks/useDevicePropsGenerator/useDevicePropsGenerator.js';
|
|
4
4
|
import { useStyles } from './hooks/useStyles/useStyles.js';
|
|
5
5
|
import { useAppearanceConfig } from './hooks/useAppearanceConfig/useAppearanceConfig.js';
|
|
6
|
-
import { I as Icon, B as Badge } from './
|
|
7
|
-
import { T as Text } from './
|
|
6
|
+
import { I as Icon, B as Badge } from './Icon_es_BstDGBF3.js';
|
|
7
|
+
import { T as Text } from './Text_es_DaYcLe4H.js';
|
|
8
8
|
|
|
9
9
|
const chipsAppearanceAccent = {
|
|
10
10
|
accentMutedPrimary: {
|
|
@@ -325,7 +325,7 @@ function Chips(props) {
|
|
|
325
325
|
? fillClass && `fill_${fillClass}`
|
|
326
326
|
: fillActiveClass && `fill_active_${fillActiveClass}`, !isActive
|
|
327
327
|
? fillHoverClass && `fill_hover_${fillHoverClass}`
|
|
328
|
-
: fillActiveHoverClass && `fill_active_hover_${fillActiveHoverClass}`, shapeClass && `shape_${shapeClass}`, shapeStrengthClass && `shape-strength_${shapeStrengthClass}`, borderColorClass && `border-color_${borderColorClass}`, borderTypeClass && `border_type_${borderTypeClass}`, sizeClass && `chips_size_${sizeClass}`, alignDirectionClass && `align_${alignDirectionClass}`, alignClass && `align_${alignClass}`, isActive && 'chips_state_active', isDisabled && `chips_state_disabled`, cursorClass && `cursor_${cursorClass}`, onClick && 'cursor_type_pointer', isSkeleton && `chips_skeleton`), "data-
|
|
328
|
+
: fillActiveHoverClass && `fill_active_hover_${fillActiveHoverClass}`, shapeClass && `shape_${shapeClass}`, shapeStrengthClass && `shape-strength_${shapeStrengthClass}`, borderColorClass && `border-color_${borderColorClass}`, borderTypeClass && `border_type_${borderTypeClass}`, sizeClass && `chips_size_${sizeClass}`, alignDirectionClass && `align_${alignDirectionClass}`, alignClass && `align_${alignClass}`, isActive && 'chips_state_active', isDisabled && `chips_state_disabled`, cursorClass && `cursor_${cursorClass}`, onClick && 'cursor_type_pointer', isSkeleton && `chips_skeleton`), "data-testid": dataTestId && `${dataTestId}Chips`, "data-tour": dataTour, style: chipsStyles, onClick: !isDisabled ? onClick : undefined, children: jsxs("div", { className: "chips__inner", children: [(iconBefore || iconBeforeSrc) && (jsx(Icon, { className: "chips__icon_before", size: iconBeforeSize, fill: iconBeforeFill, fillSize: iconBeforeFillSize, iconFill: iconBeforeFillIcon, iconFillActive: iconBeforeFillActiveIcon, imageSrc: iconBeforeSrc, shape: iconBeforeShape, SvgImage: iconBefore, isActive: isActive, onClick: onClickIconBefore })), typeof label === 'string' ? (jsx(Text, { className: "chips__label", size: labelTextSize, textColor: labelTextColor, textColorActive: labelTextActiveColor, textColorActiveHover: labelTextActiveColorHover, textColorHover: labelTextColorHover, textWeight: labelTextWeight, textWrap: labelTextWrap, isActive: isActive, children: label })) : (jsx("div", { className: "chips__label", children: label })), children, (iconAfter || iconAfterSrc) && (jsx(Icon, { className: "chips__icon_after", size: iconAfterSize, fill: iconAfterFill, fillSize: iconAfterFillSize, iconFill: iconAfterFillIcon, iconFillActive: iconAfterFillActiveIcon, imageSrc: iconAfterSrc, shape: iconAfterShape, SvgImage: iconAfter, isActive: isActive, onClick: onClickIconAfter })), badgeValue && (jsx(Badge, { appearance: badgeAppearance, className: "chips__badge", size: badgeSize, textColor: badgeTextColor, textSize: badgeTextSize, shape: badgeShape, value: badgeValue }))] }) }));
|
|
329
329
|
}
|
|
330
330
|
|
|
331
331
|
function ChipsGroup(props) {
|
|
@@ -334,7 +334,7 @@ function ChipsGroup(props) {
|
|
|
334
334
|
const { directionClass, alignClass, alignDirectionClass, fillClass, borderColorClass, borderTypeClass, borderWidthClass, chipsAppearance, widthClass, wrapClass, } = propsGenerator;
|
|
335
335
|
// @ts-expect-error
|
|
336
336
|
const { styles: groupStyles } = useStyles(props);
|
|
337
|
-
return (jsx("div", { className: clsx(className, 'chips-group', 'group', widthClass && `width_${widthClass}`, alignDirectionClass && `align_${alignDirectionClass}`, directionClass && `group_direction_${directionClass}`, alignClass && `align_${alignClass}`, fillClass && `fill_${fillClass}`, horizontalScroll && 'group_scroll_horizontal', wrapClass && `group_wrap_${wrapClass}`, borderColorClass && `border-color_${borderColorClass}`, borderWidthClass && `border-width_${borderWidthClass}`, borderTypeClass && `border_type_${borderTypeClass}`), "data-
|
|
337
|
+
return (jsx("div", { className: clsx(className, 'chips-group', 'group', widthClass && `width_${widthClass}`, alignDirectionClass && `align_${alignDirectionClass}`, directionClass && `group_direction_${directionClass}`, alignClass && `align_${alignClass}`, fillClass && `fill_${fillClass}`, horizontalScroll && 'group_scroll_horizontal', wrapClass && `group_wrap_${wrapClass}`, borderColorClass && `border-color_${borderColorClass}`, borderWidthClass && `border-width_${borderWidthClass}`, borderTypeClass && `border_type_${borderTypeClass}`), "data-testid": dataTestId, "data-tour": dataTour, style: Object.assign({}, groupStyles, style), children: children
|
|
338
338
|
? children
|
|
339
339
|
: chipsList?.map((item) => (jsx(Chips, { appearance: chipsAppearance, label: item.label, iconAfter: item.iconAfter, iconBefore: item.iconBefore, isActive: item.isActive, isDisabled: item.isDisabled, onClick: (event) => onClick(item, event) }, item.id))) }));
|
|
340
340
|
}
|
|
@@ -8,11 +8,11 @@ var DatePicker = require('react-datepicker');
|
|
|
8
8
|
var useAppearanceConfig = require('./cjs/hooks/useAppearanceConfig/useAppearanceConfig.js');
|
|
9
9
|
var useDevicePropsGenerator = require('./cjs/hooks/useDevicePropsGenerator/useDevicePropsGenerator.js');
|
|
10
10
|
var useStyles = require('./cjs/hooks/useStyles/useStyles.js');
|
|
11
|
-
var Button = require('./
|
|
12
|
-
var Icon = require('./
|
|
13
|
-
var Input = require('./
|
|
14
|
-
var Label = require('./
|
|
15
|
-
var Text = require('./
|
|
11
|
+
var Button = require('./Button_cjs_VVROhnrj.js');
|
|
12
|
+
var Icon = require('./Icon_cjs_D-jQrwjV.js');
|
|
13
|
+
var Input = require('./Input_cjs_CV0nr-f4.js');
|
|
14
|
+
var Label = require('./Label_cjs_CyPU9hqO.js');
|
|
15
|
+
var Text = require('./Text_cjs_Co2XdYF-.js');
|
|
16
16
|
var _default = require('@itcase/icons/default');
|
|
17
17
|
|
|
18
18
|
const datePickerSize = {
|
|
@@ -6,11 +6,11 @@ import DatePicker from 'react-datepicker';
|
|
|
6
6
|
import { useAppearanceConfig } from './hooks/useAppearanceConfig/useAppearanceConfig.js';
|
|
7
7
|
import { useDevicePropsGenerator } from './hooks/useDevicePropsGenerator/useDevicePropsGenerator.js';
|
|
8
8
|
import { useStyles } from './hooks/useStyles/useStyles.js';
|
|
9
|
-
import { B as Button } from './
|
|
10
|
-
import { I as Icon } from './
|
|
11
|
-
import { I as Input } from './
|
|
12
|
-
import { L as Label } from './
|
|
13
|
-
import { T as Text } from './
|
|
9
|
+
import { B as Button } from './Button_es_D74OMP6r.js';
|
|
10
|
+
import { I as Icon } from './Icon_es_BstDGBF3.js';
|
|
11
|
+
import { I as Input } from './Input_es_B2dHRF47.js';
|
|
12
|
+
import { L as Label } from './Label_es_qnCgQX52.js';
|
|
13
|
+
import { T as Text } from './Text_es_DaYcLe4H.js';
|
|
14
14
|
import { icons14 } from '@itcase/icons/default';
|
|
15
15
|
|
|
16
16
|
const datePickerSize = {
|
|
@@ -6,9 +6,9 @@ var clsx = require('clsx');
|
|
|
6
6
|
var useAppearanceConfig = require('./cjs/hooks/useAppearanceConfig/useAppearanceConfig.js');
|
|
7
7
|
var useDevicePropsGenerator = require('./cjs/hooks/useDevicePropsGenerator/useDevicePropsGenerator.js');
|
|
8
8
|
var useStyles = require('./cjs/hooks/useStyles/useStyles.js');
|
|
9
|
-
var Icon = require('./
|
|
9
|
+
var Icon = require('./Icon_cjs_D-jQrwjV.js');
|
|
10
10
|
var Divider = require('./Divider_cjs_BZn2epqW.js');
|
|
11
|
-
var Text = require('./
|
|
11
|
+
var Text = require('./Text_cjs_Co2XdYF-.js');
|
|
12
12
|
|
|
13
13
|
const dropdownAppearanceAccent = {
|
|
14
14
|
accentPrimary: {
|
|
@@ -4,9 +4,9 @@ import clsx from 'clsx';
|
|
|
4
4
|
import { useAppearanceConfig } from './hooks/useAppearanceConfig/useAppearanceConfig.js';
|
|
5
5
|
import { useDevicePropsGenerator } from './hooks/useDevicePropsGenerator/useDevicePropsGenerator.js';
|
|
6
6
|
import { useStyles } from './hooks/useStyles/useStyles.js';
|
|
7
|
-
import { I as Icon, B as Badge } from './
|
|
7
|
+
import { I as Icon, B as Badge } from './Icon_es_BstDGBF3.js';
|
|
8
8
|
import { D as Divider } from './Divider_es_DNJg0mQR.js';
|
|
9
|
-
import { T as Text } from './
|
|
9
|
+
import { T as Text } from './Text_es_DaYcLe4H.js';
|
|
10
10
|
|
|
11
11
|
const dropdownAppearanceAccent = {
|
|
12
12
|
accentPrimary: {
|
|
@@ -51,7 +51,7 @@ const Group = React.forwardRef(function Group(props, ref) {
|
|
|
51
51
|
`border-color_hover_${borderColorHoverClass}`
|
|
52
52
|
: borderColorActiveHoverClass &&
|
|
53
53
|
`border-color_active_hover_${borderColorActiveHoverClass}`
|
|
54
|
-
: fillDisabledClass && `fill_${fillDisabledClass}`, borderWidthClass && `border-width_${borderWidthClass}`, borderTypeClass && `border_type_${borderTypeClass}`, elevationClass && `elevation_${elevationClass}`, !print && 'no-print', print && 'print', onClick && 'cursor_type_pointer'), name: name, ref: ref, "data-
|
|
54
|
+
: fillDisabledClass && `fill_${fillDisabledClass}`, borderWidthClass && `border-width_${borderWidthClass}`, borderTypeClass && `border_type_${borderTypeClass}`, elevationClass && `elevation_${elevationClass}`, !print && 'no-print', print && 'print', onClick && 'cursor_type_pointer'), name: name, ref: ref, "data-testid": dataTestId, "data-tour": dataTour, htmlFor: htmlFor, style: Object.assign({}, groupStyles, style), onClick: onClick, onMouseDown: onMouseDown, children: children }));
|
|
55
55
|
});
|
|
56
56
|
|
|
57
57
|
exports.Group = Group;
|
|
@@ -49,7 +49,7 @@ const Group = React.forwardRef(function Group(props, ref) {
|
|
|
49
49
|
`border-color_hover_${borderColorHoverClass}`
|
|
50
50
|
: borderColorActiveHoverClass &&
|
|
51
51
|
`border-color_active_hover_${borderColorActiveHoverClass}`
|
|
52
|
-
: fillDisabledClass && `fill_${fillDisabledClass}`, borderWidthClass && `border-width_${borderWidthClass}`, borderTypeClass && `border_type_${borderTypeClass}`, elevationClass && `elevation_${elevationClass}`, !print && 'no-print', print && 'print', onClick && 'cursor_type_pointer'), name: name, ref: ref, "data-
|
|
52
|
+
: fillDisabledClass && `fill_${fillDisabledClass}`, borderWidthClass && `border-width_${borderWidthClass}`, borderTypeClass && `border_type_${borderTypeClass}`, elevationClass && `elevation_${elevationClass}`, !print && 'no-print', print && 'print', onClick && 'cursor_type_pointer'), name: name, ref: ref, "data-testid": dataTestId, "data-tour": dataTour, htmlFor: htmlFor, style: Object.assign({}, groupStyles, style), onClick: onClick, onMouseDown: onMouseDown, children: children }));
|
|
53
53
|
});
|
|
54
54
|
|
|
55
55
|
export { Group as G, groupAppearance as a, groupConfig as g };
|
|
@@ -9,7 +9,7 @@ var useAppearanceConfig = require('./cjs/hooks/useAppearanceConfig/useAppearance
|
|
|
9
9
|
var useDevicePropsGenerator = require('./cjs/hooks/useDevicePropsGenerator/useDevicePropsGenerator.js');
|
|
10
10
|
var useStyles = require('./cjs/hooks/useStyles/useStyles.js');
|
|
11
11
|
var Link = require('./Link_cjs_qKXVfU8e.js');
|
|
12
|
-
var Text = require('./
|
|
12
|
+
var Text = require('./Text_cjs_Co2XdYF-.js');
|
|
13
13
|
|
|
14
14
|
const badgeAppearanceAccent = {
|
|
15
15
|
accent: {
|
|
@@ -566,7 +566,7 @@ function Title(props) {
|
|
|
566
566
|
`text-color_hover_${textColorHoverClass}`, isActive &&
|
|
567
567
|
!isDisabled &&
|
|
568
568
|
textColorActiveHoverClass &&
|
|
569
|
-
`text-color_active_hover${textColorActiveHoverClass}`, textFontClass && `text-font_${textFontClass}`, textStyleClass && `text-style_${textStyleClass}`, textWeightClass && `text-weight_${textWeightClass}`, textWrap && `word-wrap_${textWrap}`, iconBadgeValue && 'title_badge', isSkeleton && 'title_skeleton'), "data-
|
|
569
|
+
`text-color_active_hover${textColorActiveHoverClass}`, textFontClass && `text-font_${textFontClass}`, textStyleClass && `text-style_${textStyleClass}`, textWeightClass && `text-weight_${textWeightClass}`, textWrap && `word-wrap_${textWrap}`, iconBadgeValue && 'title_badge', isSkeleton && 'title_skeleton'), "data-testid": dataTestId, "data-tour": dataTour, style: Object.assign({}, titleStyles, style), onClick: onClick, children: [before, jsxRuntime.jsxs("span", { className: clsx(textAlignClass && `text-align_${textAlignClass}`, wrapperDirectionClass && `title_direction_${wrapperDirectionClass}`, 'title__wrapper', textTruncateClass && `text-truncate_${textTruncateClass}`), style: titleWrapperStyles, children: [(iconBefore || iconBeforeSrc) && (jsxRuntime.jsx(Icon, { className: clsx('title__icon_before', iconBadgeValue && 'title__icon_before-badge'), fill: iconBeforeFill, fillSize: iconBeforeFillSize, badgeAppearance: iconBadgeAppearance, badgeClass: 'title__icon_before_badge', badgeShape: iconBadgeShape, badgeSize: iconBadgeSize, badgeTextColor: iconBadgeTextColor, badgeTextSize: iconBadgeTextSize, badgeValue: iconBadgeValue, iconFill: iconBeforeFillIcon, iconSize: iconBeforeSize, imageSrc: iconBeforeSrc, shape: iconBeforeShape, SvgImage: iconBefore })), beforeWrapper, children || text, afterWrapper, (iconAfter || iconAfterSrc) && (jsxRuntime.jsx(Icon, { className: clsx('title__icon_after', iconBadgeValue && 'title__icon_after-badge'), fill: iconAfterFill, fillSize: iconAfterFillSize, badgeAppearance: iconBadgeAppearance, badgeClass: 'title__icon_after_badge', badgeShape: iconBadgeShape, badgeSize: iconBadgeSize, badgeTextColor: iconBadgeTextColor, badgeTextSize: iconBadgeTextSize, badgeValue: iconBadgeValue, iconFill: iconAfterFillIcon, iconSize: iconAfterSize, imageSrc: iconAfterSrc, shape: iconAfterShape, SvgImage: iconAfter }))] }), after] }));
|
|
570
570
|
}
|
|
571
571
|
|
|
572
572
|
const tooltipAppearanceDefault = {
|
|
@@ -7,7 +7,7 @@ import { useAppearanceConfig } from './hooks/useAppearanceConfig/useAppearanceCo
|
|
|
7
7
|
import { useDevicePropsGenerator } from './hooks/useDevicePropsGenerator/useDevicePropsGenerator.js';
|
|
8
8
|
import { useStyles } from './hooks/useStyles/useStyles.js';
|
|
9
9
|
import { a as LinkWrapper } from './Link_es_P2b6ya7P.js';
|
|
10
|
-
import { T as Text } from './
|
|
10
|
+
import { T as Text } from './Text_es_DaYcLe4H.js';
|
|
11
11
|
|
|
12
12
|
const badgeAppearanceAccent = {
|
|
13
13
|
accent: {
|
|
@@ -564,7 +564,7 @@ function Title(props) {
|
|
|
564
564
|
`text-color_hover_${textColorHoverClass}`, isActive &&
|
|
565
565
|
!isDisabled &&
|
|
566
566
|
textColorActiveHoverClass &&
|
|
567
|
-
`text-color_active_hover${textColorActiveHoverClass}`, textFontClass && `text-font_${textFontClass}`, textStyleClass && `text-style_${textStyleClass}`, textWeightClass && `text-weight_${textWeightClass}`, textWrap && `word-wrap_${textWrap}`, iconBadgeValue && 'title_badge', isSkeleton && 'title_skeleton'), "data-
|
|
567
|
+
`text-color_active_hover${textColorActiveHoverClass}`, textFontClass && `text-font_${textFontClass}`, textStyleClass && `text-style_${textStyleClass}`, textWeightClass && `text-weight_${textWeightClass}`, textWrap && `word-wrap_${textWrap}`, iconBadgeValue && 'title_badge', isSkeleton && 'title_skeleton'), "data-testid": dataTestId, "data-tour": dataTour, style: Object.assign({}, titleStyles, style), onClick: onClick, children: [before, jsxs("span", { className: clsx(textAlignClass && `text-align_${textAlignClass}`, wrapperDirectionClass && `title_direction_${wrapperDirectionClass}`, 'title__wrapper', textTruncateClass && `text-truncate_${textTruncateClass}`), style: titleWrapperStyles, children: [(iconBefore || iconBeforeSrc) && (jsx(Icon, { className: clsx('title__icon_before', iconBadgeValue && 'title__icon_before-badge'), fill: iconBeforeFill, fillSize: iconBeforeFillSize, badgeAppearance: iconBadgeAppearance, badgeClass: 'title__icon_before_badge', badgeShape: iconBadgeShape, badgeSize: iconBadgeSize, badgeTextColor: iconBadgeTextColor, badgeTextSize: iconBadgeTextSize, badgeValue: iconBadgeValue, iconFill: iconBeforeFillIcon, iconSize: iconBeforeSize, imageSrc: iconBeforeSrc, shape: iconBeforeShape, SvgImage: iconBefore })), beforeWrapper, children || text, afterWrapper, (iconAfter || iconAfterSrc) && (jsx(Icon, { className: clsx('title__icon_after', iconBadgeValue && 'title__icon_after-badge'), fill: iconAfterFill, fillSize: iconAfterFillSize, badgeAppearance: iconBadgeAppearance, badgeClass: 'title__icon_after_badge', badgeShape: iconBadgeShape, badgeSize: iconBadgeSize, badgeTextColor: iconBadgeTextColor, badgeTextSize: iconBadgeTextSize, badgeValue: iconBadgeValue, iconFill: iconAfterFillIcon, iconSize: iconAfterSize, imageSrc: iconAfterSrc, shape: iconAfterShape, SvgImage: iconAfter }))] }), after] }));
|
|
568
568
|
}
|
|
569
569
|
|
|
570
570
|
const tooltipAppearanceDefault = {
|
|
@@ -215,7 +215,7 @@ const Input = React.forwardRef(function Input(props, ref) {
|
|
|
215
215
|
const { fillClass, fillHoverClass, borderColorClass, borderColorHoverClass, borderWidthClass, textColorClass, textSizeClass, textWeightClass, caretClass, placeholderTextColorClass, shapeClass, shapeStrengthClass, sizeClass, widthClass, } = propsGenerator;
|
|
216
216
|
const fallbackId = React.useId();
|
|
217
217
|
return (jsxRuntime.jsx("input", { id: String(id ?? fallbackId), className: clsx(className, 'input', type === 'number' && 'input_type_number', isDisabled && 'input_state_disabled', (textSizeClass || textColorClass || textWeightClass) && 'text', borderColorClass && `border-color_${borderColorClass}`, borderColorHoverClass && `border-color_hover_${borderColorHoverClass}`, borderWidthClass && `border-width_${borderWidthClass}`, caretClass && `caret-color_${caretClass}`, fillClass && `fill_${fillClass}`, fillHoverClass && `fill_hover_${fillHoverClass}`, placeholderTextColorClass &&
|
|
218
|
-
`placeholder-text-color_${placeholderTextColorClass}`, shapeClass && `shape_${shapeClass}`, shapeStrengthClass && `shape-strength_${shapeStrengthClass}`, sizeClass && `input_size_${sizeClass}`, textColorClass && `text-color_${textColorClass}`, textColorClass && `text-color_${textColorClass}`, textSizeClass && `text_size_${textSizeClass}`, textWeightClass && `text-weight_${textWeightClass}`, widthClass && `width_${widthClass}`), type: type, ref: ref, autoComplete: autocomplete, "data-
|
|
218
|
+
`placeholder-text-color_${placeholderTextColorClass}`, shapeClass && `shape_${shapeClass}`, shapeStrengthClass && `shape-strength_${shapeStrengthClass}`, sizeClass && `input_size_${sizeClass}`, textColorClass && `text-color_${textColorClass}`, textColorClass && `text-color_${textColorClass}`, textSizeClass && `text_size_${textSizeClass}`, textWeightClass && `text-weight_${textWeightClass}`, widthClass && `width_${widthClass}`), type: type, ref: ref, autoComplete: autocomplete, "data-testid": dataTestId || (name ? `${name}Input` : 'input'), disabled: isDisabled, index: index, placeholder: placeholder, readOnly: isReadOnly, value: value, onClick: onClick, onBlur: onBlur, onChange: onChange, onFocus: onFocus, onKeyDown: onKeyDown }));
|
|
219
219
|
});
|
|
220
220
|
|
|
221
221
|
exports.Input = Input;
|
|
@@ -213,7 +213,7 @@ const Input = React.forwardRef(function Input(props, ref) {
|
|
|
213
213
|
const { fillClass, fillHoverClass, borderColorClass, borderColorHoverClass, borderWidthClass, textColorClass, textSizeClass, textWeightClass, caretClass, placeholderTextColorClass, shapeClass, shapeStrengthClass, sizeClass, widthClass, } = propsGenerator;
|
|
214
214
|
const fallbackId = useId();
|
|
215
215
|
return (jsx("input", { id: String(id ?? fallbackId), className: clsx(className, 'input', type === 'number' && 'input_type_number', isDisabled && 'input_state_disabled', (textSizeClass || textColorClass || textWeightClass) && 'text', borderColorClass && `border-color_${borderColorClass}`, borderColorHoverClass && `border-color_hover_${borderColorHoverClass}`, borderWidthClass && `border-width_${borderWidthClass}`, caretClass && `caret-color_${caretClass}`, fillClass && `fill_${fillClass}`, fillHoverClass && `fill_hover_${fillHoverClass}`, placeholderTextColorClass &&
|
|
216
|
-
`placeholder-text-color_${placeholderTextColorClass}`, shapeClass && `shape_${shapeClass}`, shapeStrengthClass && `shape-strength_${shapeStrengthClass}`, sizeClass && `input_size_${sizeClass}`, textColorClass && `text-color_${textColorClass}`, textColorClass && `text-color_${textColorClass}`, textSizeClass && `text_size_${textSizeClass}`, textWeightClass && `text-weight_${textWeightClass}`, widthClass && `width_${widthClass}`), type: type, ref: ref, autoComplete: autocomplete, "data-
|
|
216
|
+
`placeholder-text-color_${placeholderTextColorClass}`, shapeClass && `shape_${shapeClass}`, shapeStrengthClass && `shape-strength_${shapeStrengthClass}`, sizeClass && `input_size_${sizeClass}`, textColorClass && `text-color_${textColorClass}`, textColorClass && `text-color_${textColorClass}`, textSizeClass && `text_size_${textSizeClass}`, textWeightClass && `text-weight_${textWeightClass}`, widthClass && `width_${widthClass}`), type: type, ref: ref, autoComplete: autocomplete, "data-testid": dataTestId || (name ? `${name}Input` : 'input'), disabled: isDisabled, index: index, placeholder: placeholder, readOnly: isReadOnly, value: value, onClick: onClick, onBlur: onBlur, onChange: onChange, onFocus: onFocus, onKeyDown: onKeyDown }));
|
|
217
217
|
});
|
|
218
218
|
|
|
219
219
|
export { Input as I, inputAppearance as a, inputConfig as i };
|
|
@@ -6,8 +6,8 @@ var clsx = require('clsx');
|
|
|
6
6
|
var useAppearanceConfig = require('./cjs/hooks/useAppearanceConfig/useAppearanceConfig.js');
|
|
7
7
|
var useDevicePropsGenerator = require('./cjs/hooks/useDevicePropsGenerator/useDevicePropsGenerator.js');
|
|
8
8
|
var useStyles = require('./cjs/hooks/useStyles/useStyles.js');
|
|
9
|
-
var Icon = require('./
|
|
10
|
-
var Text = require('./
|
|
9
|
+
var Icon = require('./Icon_cjs_D-jQrwjV.js');
|
|
10
|
+
var Text = require('./Text_cjs_Co2XdYF-.js');
|
|
11
11
|
|
|
12
12
|
const labelAppearanceAccent = {
|
|
13
13
|
accentMutedPrimary: {
|
|
@@ -347,7 +347,7 @@ function Label(props) {
|
|
|
347
347
|
const { alignClass, fillClass, fillHoverClass, borderColorClass, borderTypeClass, labelTextColor, labelTextColorHover, labelTextSize, labelTextWeight, labelTextWrap, iconAfter, iconAfterFill, iconAfterFillIcon, iconAfterFillSize, iconAfterShape, iconAfterSize, iconAfterSrc, iconBefore, iconBeforeFill, iconBeforeFillIcon, iconBeforeFillSize, iconBeforeShape, iconBeforeSize, iconBeforeSrc, shapeClass, shapeStrengthClass, sizeClass, tooltipAlignment, tooltipAppearance, tooltipArrowPosition, tooltipText, tooltipTextSize, tooltipTextWeight, tooltipTitle, tooltipTitleSize, tooltipTitleWeight, widthClass, wrapClass, } = propsGenerator;
|
|
348
348
|
// @ts-expect-error
|
|
349
349
|
const { styles: labelStyles } = useStyles.useStyles(props);
|
|
350
|
-
return (jsxRuntime.jsxs("div", { className: clsx(className, 'label', fillClass && `fill_${fillClass}`, fillHoverClass && `fill_hover_${fillHoverClass}`, shapeClass && `shape_${shapeClass}`, borderColorClass && `border-color_${borderColorClass}`, borderTypeClass && `border_type_${borderTypeClass}`, sizeClass && `label_size_${sizeClass}`, wrapClass && `word-wrap_${wrapClass}`, widthClass && `label_width_${widthClass}`, alignClass && `align_${alignClass}`, shapeStrengthClass && `shape-strength_${shapeStrengthClass}`, isSkeleton && `label_skeleton`, onClick && (cursor || 'cursor_type_pointer')), "data-
|
|
350
|
+
return (jsxRuntime.jsxs("div", { className: clsx(className, 'label', fillClass && `fill_${fillClass}`, fillHoverClass && `fill_hover_${fillHoverClass}`, shapeClass && `shape_${shapeClass}`, borderColorClass && `border-color_${borderColorClass}`, borderTypeClass && `border_type_${borderTypeClass}`, sizeClass && `label_size_${sizeClass}`, wrapClass && `word-wrap_${wrapClass}`, widthClass && `label_width_${widthClass}`, alignClass && `align_${alignClass}`, shapeStrengthClass && `shape-strength_${shapeStrengthClass}`, isSkeleton && `label_skeleton`, onClick && (cursor || 'cursor_type_pointer')), "data-testid": dataTestId, "data-tour": dataTour, style: labelStyles, onClick: onClick, onMouseEnter: onMouseEnterLabel, onMouseLeave: onMouseLeaveLabel, children: [before, (iconBefore || iconBeforeSrc) && (jsxRuntime.jsx(Icon.Icon, { className: clsx('label__icon_before'), fill: iconBeforeFill, fillSize: iconBeforeFillSize, iconFill: iconBeforeFillIcon, iconSize: iconBeforeSize, imageSrc: iconBeforeSrc, shape: iconBeforeShape, SvgImage: iconBefore })), jsxRuntime.jsxs("div", { className: "label__inner", children: [typeof label === 'string' ? (jsxRuntime.jsx(Text.Text, { className: "label__text", size: labelTextSize, textColor: labelTextColor, textColorHover: labelTextColorHover, textWeight: labelTextWeight, textWrap: labelTextWrap, children: label })) : (jsxRuntime.jsx("div", { className: "label__text", children: label })), children, tooltipContent && (jsxRuntime.jsx(Icon.Tooltip, { className: "label__tooltip", ref: tooltipRef, appearance: tooltipAppearance, alignment: tooltipAlignment, title: tooltipTitle, titleSize: tooltipTitleSize, titleWeight: tooltipTitleWeight, text: tooltipText, textSize: tooltipTextSize, textWeight: tooltipTextWeight, arrowPosition: tooltipArrowPosition, children: tooltipContent }))] }), (iconAfter || iconAfterSrc) && (jsxRuntime.jsx(Icon.Icon, { className: clsx('label__icon_after'), fill: iconAfterFill, fillSize: iconAfterFillSize, iconFill: iconAfterFillIcon, iconSize: iconAfterSize, imageSrc: iconAfterSrc, shape: iconAfterShape, SvgImage: iconAfter })), after] }));
|
|
351
351
|
}
|
|
352
352
|
|
|
353
353
|
exports.Label = Label;
|
|
@@ -4,8 +4,8 @@ import clsx from 'clsx';
|
|
|
4
4
|
import { useAppearanceConfig } from './hooks/useAppearanceConfig/useAppearanceConfig.js';
|
|
5
5
|
import { useDevicePropsGenerator } from './hooks/useDevicePropsGenerator/useDevicePropsGenerator.js';
|
|
6
6
|
import { useStyles } from './hooks/useStyles/useStyles.js';
|
|
7
|
-
import { I as Icon, T as Tooltip } from './
|
|
8
|
-
import { T as Text } from './
|
|
7
|
+
import { I as Icon, T as Tooltip } from './Icon_es_BstDGBF3.js';
|
|
8
|
+
import { T as Text } from './Text_es_DaYcLe4H.js';
|
|
9
9
|
|
|
10
10
|
const labelAppearanceAccent = {
|
|
11
11
|
accentMutedPrimary: {
|
|
@@ -345,7 +345,7 @@ function Label(props) {
|
|
|
345
345
|
const { alignClass, fillClass, fillHoverClass, borderColorClass, borderTypeClass, labelTextColor, labelTextColorHover, labelTextSize, labelTextWeight, labelTextWrap, iconAfter, iconAfterFill, iconAfterFillIcon, iconAfterFillSize, iconAfterShape, iconAfterSize, iconAfterSrc, iconBefore, iconBeforeFill, iconBeforeFillIcon, iconBeforeFillSize, iconBeforeShape, iconBeforeSize, iconBeforeSrc, shapeClass, shapeStrengthClass, sizeClass, tooltipAlignment, tooltipAppearance, tooltipArrowPosition, tooltipText, tooltipTextSize, tooltipTextWeight, tooltipTitle, tooltipTitleSize, tooltipTitleWeight, widthClass, wrapClass, } = propsGenerator;
|
|
346
346
|
// @ts-expect-error
|
|
347
347
|
const { styles: labelStyles } = useStyles(props);
|
|
348
|
-
return (jsxs("div", { className: clsx(className, 'label', fillClass && `fill_${fillClass}`, fillHoverClass && `fill_hover_${fillHoverClass}`, shapeClass && `shape_${shapeClass}`, borderColorClass && `border-color_${borderColorClass}`, borderTypeClass && `border_type_${borderTypeClass}`, sizeClass && `label_size_${sizeClass}`, wrapClass && `word-wrap_${wrapClass}`, widthClass && `label_width_${widthClass}`, alignClass && `align_${alignClass}`, shapeStrengthClass && `shape-strength_${shapeStrengthClass}`, isSkeleton && `label_skeleton`, onClick && (cursor || 'cursor_type_pointer')), "data-
|
|
348
|
+
return (jsxs("div", { className: clsx(className, 'label', fillClass && `fill_${fillClass}`, fillHoverClass && `fill_hover_${fillHoverClass}`, shapeClass && `shape_${shapeClass}`, borderColorClass && `border-color_${borderColorClass}`, borderTypeClass && `border_type_${borderTypeClass}`, sizeClass && `label_size_${sizeClass}`, wrapClass && `word-wrap_${wrapClass}`, widthClass && `label_width_${widthClass}`, alignClass && `align_${alignClass}`, shapeStrengthClass && `shape-strength_${shapeStrengthClass}`, isSkeleton && `label_skeleton`, onClick && (cursor || 'cursor_type_pointer')), "data-testid": dataTestId, "data-tour": dataTour, style: labelStyles, onClick: onClick, onMouseEnter: onMouseEnterLabel, onMouseLeave: onMouseLeaveLabel, children: [before, (iconBefore || iconBeforeSrc) && (jsx(Icon, { className: clsx('label__icon_before'), fill: iconBeforeFill, fillSize: iconBeforeFillSize, iconFill: iconBeforeFillIcon, iconSize: iconBeforeSize, imageSrc: iconBeforeSrc, shape: iconBeforeShape, SvgImage: iconBefore })), jsxs("div", { className: "label__inner", children: [typeof label === 'string' ? (jsx(Text, { className: "label__text", size: labelTextSize, textColor: labelTextColor, textColorHover: labelTextColorHover, textWeight: labelTextWeight, textWrap: labelTextWrap, children: label })) : (jsx("div", { className: "label__text", children: label })), children, tooltipContent && (jsx(Tooltip, { className: "label__tooltip", ref: tooltipRef, appearance: tooltipAppearance, alignment: tooltipAlignment, title: tooltipTitle, titleSize: tooltipTitleSize, titleWeight: tooltipTitleWeight, text: tooltipText, textSize: tooltipTextSize, textWeight: tooltipTextWeight, arrowPosition: tooltipArrowPosition, children: tooltipContent }))] }), (iconAfter || iconAfterSrc) && (jsx(Icon, { className: clsx('label__icon_after'), fill: iconAfterFill, fillSize: iconAfterFillSize, iconFill: iconAfterFillIcon, iconSize: iconAfterSize, imageSrc: iconAfterSrc, shape: iconAfterShape, SvgImage: iconAfter })), after] }));
|
|
349
349
|
}
|
|
350
350
|
|
|
351
351
|
export { Label as L, labelAppearance as a, labelConfig as l };
|
|
@@ -5,7 +5,7 @@ var clsx = require('clsx');
|
|
|
5
5
|
var useAppearanceConfig = require('./cjs/hooks/useAppearanceConfig/useAppearanceConfig.js');
|
|
6
6
|
var useDevicePropsGenerator = require('./cjs/hooks/useDevicePropsGenerator/useDevicePropsGenerator.js');
|
|
7
7
|
var useStyles = require('./cjs/hooks/useStyles/useStyles.js');
|
|
8
|
-
var Text = require('./
|
|
8
|
+
var Text = require('./Text_cjs_Co2XdYF-.js');
|
|
9
9
|
|
|
10
10
|
const loaderAppearanceAccent = {
|
|
11
11
|
accentPrimary: {
|
|
@@ -3,7 +3,7 @@ import clsx from 'clsx';
|
|
|
3
3
|
import { useAppearanceConfig } from './hooks/useAppearanceConfig/useAppearanceConfig.js';
|
|
4
4
|
import { useDevicePropsGenerator } from './hooks/useDevicePropsGenerator/useDevicePropsGenerator.js';
|
|
5
5
|
import { useStyles } from './hooks/useStyles/useStyles.js';
|
|
6
|
-
import { T as Text } from './
|
|
6
|
+
import { T as Text } from './Text_es_DaYcLe4H.js';
|
|
7
7
|
|
|
8
8
|
const loaderAppearanceAccent = {
|
|
9
9
|
accentPrimary: {
|