@itcase/ui 1.9.16 → 1.9.17

package/dist/{ChipsGroup_cjs_BQ27ybIx.js → ChipsGroup_cjs_Bfv9Z78e.js}

@@ -9,12 +9,6 @@ var Icon = require('./Icon_cjs_NpWSQezS.js');
 var Text = require('./Text_cjs_BhnGHF2T.js');
 
 const chipsAppearanceAccent = {
-    accent: {
-        fill: 'accentPrimary',
-        fillHover: 'accentHoverPrimary',
-        labelTextColor: 'accentTextPrimary',
-        borderColor: 'accentBorderSecondary',
-    },
     accentMutedPrimary: {
         fill: 'accentTertiary',
         fillHover: 'accentHoverPrimary',
@@ -25,10 +19,15 @@ const chipsAppearanceAccent = {
     },
     accentPrimary: {
         fill: 'accentPrimary',
+        fillActive: 'accentPrimary',
+        fillActiveHover: 'accentHoverPrimary',
         fillHover: 'accentHoverPrimary',
+        labelTextActiveColor: 'accentTextPrimary',
         labelTextColor: 'accentTextPrimary',
-        borderColor: 'accentBorderSecondary',
+        borderColor: 'accentBorderPrimary',
+        iconAfterFillActiveIcon: 'accentItemPrimary',
         iconAfterFillIcon: 'accentItemPrimary',
+        iconBeforeFillActiveIcon: 'accentItemPrimary',
         iconBeforeFillIcon: 'accentItemPrimary',
     },
 };

package/dist/{ChipsGroup_es_DFVf6wUN.js → ChipsGroup_es_BrHHulZC.js}

@@ -7,12 +7,6 @@ import { I as Icon, B as Badge } from './Icon_es_CJuX1p1_.js';
 import { T as Text } from './Text_es_C1kfpokr.js';
 
 const chipsAppearanceAccent = {
-    accent: {
-        fill: 'accentPrimary',
-        fillHover: 'accentHoverPrimary',
-        labelTextColor: 'accentTextPrimary',
-        borderColor: 'accentBorderSecondary',
-    },
     accentMutedPrimary: {
         fill: 'accentTertiary',
         fillHover: 'accentHoverPrimary',
@@ -23,10 +17,15 @@ const chipsAppearanceAccent = {
     },
     accentPrimary: {
         fill: 'accentPrimary',
+        fillActive: 'accentPrimary',
+        fillActiveHover: 'accentHoverPrimary',
         fillHover: 'accentHoverPrimary',
+        labelTextActiveColor: 'accentTextPrimary',
         labelTextColor: 'accentTextPrimary',
-        borderColor: 'accentBorderSecondary',
+        borderColor: 'accentBorderPrimary',
+        iconAfterFillActiveIcon: 'accentItemPrimary',
         iconAfterFillIcon: 'accentItemPrimary',
+        iconBeforeFillActiveIcon: 'accentItemPrimary',
         iconBeforeFillIcon: 'accentItemPrimary',
     },
 };

package/dist/cjs/components/Accordion.js

@@ -142,7 +142,7 @@ const accordionItemConfig = {
     },
 };
 function AccordionItem(props) {
-    const { id, className, appearance, title, afterContent, beforeContent, content, isExpanded, onClick, children, } = props;
+    const { id, appearance, className, title, afterContent, beforeContent, content, isExpanded, onClick, children, } = props;
     const onClickTitle = React.useCallback(() => {
         // "!isExpanded" - is next state of expanded
         const thisItemData = {
@@ -157,7 +157,7 @@ function AccordionItem(props) {
     const propsGenerator = useDevicePropsGenerator.useDevicePropsGenerator(props, appearanceConfig);
     const { fillClass, fillHoverClass, titleBorderColorClass, titleFillClass, titleFillHoverClass, titleTextColor, titleTextSize, titleTextWeight, titleWidthClass, borderColorClass, badgeAppearance, badgeAppearanceSize, badgeShape, badgeSize, badgeTextColor, badgeTextSize, badgeValue, contentTextColor, contentTextSize, contentTextWeight, dividerDirection, dividerFill, dividerSize, icon, iconFill, iconFillIcon, iconFillSize, iconShape, iconSize, iconSrc, shapeClass, shapeStrengthClass, showDivider, sizeClass, zeroGap, zeroPadding, } = propsGenerator;
     const { styles } = useStyles.useStyles(props);
-    return (jsxRuntime.jsxs("div", { className: clsx('accordion-item', className, zeroPadding && 'accordion-item_zero-padding', zeroGap && 'accordion-item_zero-gap', borderColorClass && `border-color_${borderColorClass}`, shapeClass && `shape_${shapeClass}`, shapeStrengthClass && `shape-strength_${shapeStrengthClass}`, sizeClass && `accordion-item_size_${sizeClass}`, isExpanded && 'accordion-item_state_open'), style: styles, children: [jsxRuntime.jsxs("div", { className: clsx('accordion-item__header', fillClass && `fill_${fillClass}`, fillHoverClass && `fill_hover_${fillHoverClass}`), children: [jsxRuntime.jsx(Text.Text, { className: clsx('accordion-item__title', titleBorderColorClass && `border-color_${titleBorderColorClass}`, titleFillClass && `fill_${titleFillClass}`, titleFillHoverClass && `fill_hover_${titleFillHoverClass}`, titleWidthClass && `width_${titleWidthClass}`, onClickTitle && 'cursor_type_pointer'), size: titleTextSize, textColor: titleTextColor, textWeight: titleTextWeight, onClick: onClickTitle, children: title }), jsxRuntime.jsxs("div", { className: "accordion-item__action", children: [badgeValue && (jsxRuntime.jsx(Icon.Badge, { className: "accordion-item__badge", appearance: `${badgeAppearance} ${badgeAppearanceSize}`, size: badgeSize, textColor: badgeTextColor, textSize: badgeTextSize, shape: badgeShape, value: badgeValue })), (icon || iconSrc) && (jsxRuntime.jsx(Icon.Icon, { className: clsx('accordion-item__icon'), fill: iconFill, fillSize: iconFillSize, iconFill: iconFillIcon, iconSize: iconSize, imageSrc: iconSrc, shape: iconShape, SvgImage: icon, onClick: onClickTitle }))] }), showDivider && (jsxRuntime.jsx(Divider.Divider, { width: "fill", direction: dividerDirection, size: dividerSize, fill: dividerFill || 'surfaceTertiary' }))] }), beforeContent, isExpanded && (jsxRuntime.jsxs("div", { className: clsx('accordion-item__content'), children: [content && (jsxRuntime.jsx("div", { className: clsx('accordion-item__content-inner', fillClass && `fill_${fillClass}`), children: jsxRuntime.jsx(Text.Text, { size: contentTextSize, textColor: contentTextColor, textWeight: contentTextWeight, children: content }) })), children] })), afterContent] }));
+    return (jsxRuntime.jsxs("div", { className: clsx('accordion-item', className, zeroPadding && 'accordion-item_zero-padding', zeroGap && 'accordion-item_zero-gap', borderColorClass && `border-color_${borderColorClass}`, shapeClass && `shape_${shapeClass}`, shapeStrengthClass && `shape-strength_${shapeStrengthClass}`, sizeClass && `accordion-item_size_${sizeClass}`, isExpanded && 'accordion-item_state_open'), style: styles, children: [jsxRuntime.jsxs("div", { className: clsx('accordion-item__header', fillClass && `fill_${fillClass}`, fillHoverClass && `fill_hover_${fillHoverClass}`), children: [jsxRuntime.jsx(Text.Text, { className: clsx('accordion-item__title', titleBorderColorClass && `border-color_${titleBorderColorClass}`, titleFillClass && `fill_${titleFillClass}`, titleFillHoverClass && `fill_hover_${titleFillHoverClass}`, titleWidthClass && `width_${titleWidthClass}`, onClickTitle && 'cursor_type_pointer'), size: titleTextSize, textColor: titleTextColor, textWeight: titleTextWeight, onClick: onClickTitle, children: title }), jsxRuntime.jsxs("div", { className: "accordion-item__action", children: [badgeValue && (jsxRuntime.jsx(Icon.Badge, { appearance: `${badgeAppearance} ${badgeAppearanceSize}`, className: "accordion-item__badge", size: badgeSize, textColor: badgeTextColor, textSize: badgeTextSize, shape: badgeShape, value: badgeValue })), (icon || iconSrc) && (jsxRuntime.jsx(Icon.Icon, { className: clsx('accordion-item__icon'), fill: iconFill, fillSize: iconFillSize, iconFill: iconFillIcon, iconSize: iconSize, imageSrc: iconSrc, shape: iconShape, SvgImage: icon, onClick: onClickTitle }))] }), showDivider && (jsxRuntime.jsx(Divider.Divider, { width: "fill", direction: dividerDirection, size: dividerSize, fill: dividerFill || 'surfaceTertiary' }))] }), beforeContent, isExpanded && (jsxRuntime.jsxs("div", { className: clsx('accordion-item__content'), children: [content && (jsxRuntime.jsx("div", { className: clsx('accordion-item__content-inner', fillClass && `fill_${fillClass}`), children: jsxRuntime.jsx(Text.Text, { size: contentTextSize, textColor: contentTextColor, textWeight: contentTextWeight, children: content }) })), children] })), afterContent] }));
 }
 
 function Accordion(props) {

package/dist/cjs/components/Chips.js

@@ -1,6 +1,6 @@
 'use strict';
 
-var ChipsGroup = require('../../ChipsGroup_cjs_BQ27ybIx.js');
+var ChipsGroup = require('../../ChipsGroup_cjs_Bfv9Z78e.js');
 require('react/jsx-runtime');
 require('clsx');
 require('../hooks/useDevicePropsGenerator/useDevicePropsGenerator.js');

package/dist/cjs/components/DatePeriod.js

@@ -7,7 +7,7 @@ var luxon = require('luxon');
 var common = require('@itcase/common');
 var useAppearanceConfig = require('../hooks/useAppearanceConfig/useAppearanceConfig.js');
 var useDevicePropsGenerator = require('../hooks/useDevicePropsGenerator/useDevicePropsGenerator.js');
-var ChipsGroup = require('../../ChipsGroup_cjs_BQ27ybIx.js');
+var ChipsGroup = require('../../ChipsGroup_cjs_Bfv9Z78e.js');
 var DatePicker = require('../../DatePicker_cjs_D9q-RqJu.js');
 require('react-select');
 require('../../Icon_cjs_NpWSQezS.js');

package/dist/components/Accordion.js

@@ -140,7 +140,7 @@ const accordionItemConfig = {
     },
 };
 function AccordionItem(props) {
-    const { id, className, appearance, title, afterContent, beforeContent, content, isExpanded, onClick, children, } = props;
+    const { id, appearance, className, title, afterContent, beforeContent, content, isExpanded, onClick, children, } = props;
     const onClickTitle = useCallback(() => {
         // "!isExpanded" - is next state of expanded
         const thisItemData = {
@@ -155,7 +155,7 @@ function AccordionItem(props) {
     const propsGenerator = useDevicePropsGenerator(props, appearanceConfig);
     const { fillClass, fillHoverClass, titleBorderColorClass, titleFillClass, titleFillHoverClass, titleTextColor, titleTextSize, titleTextWeight, titleWidthClass, borderColorClass, badgeAppearance, badgeAppearanceSize, badgeShape, badgeSize, badgeTextColor, badgeTextSize, badgeValue, contentTextColor, contentTextSize, contentTextWeight, dividerDirection, dividerFill, dividerSize, icon, iconFill, iconFillIcon, iconFillSize, iconShape, iconSize, iconSrc, shapeClass, shapeStrengthClass, showDivider, sizeClass, zeroGap, zeroPadding, } = propsGenerator;
     const { styles } = useStyles(props);
-    return (jsxs("div", { className: clsx('accordion-item', className, zeroPadding && 'accordion-item_zero-padding', zeroGap && 'accordion-item_zero-gap', borderColorClass && `border-color_${borderColorClass}`, shapeClass && `shape_${shapeClass}`, shapeStrengthClass && `shape-strength_${shapeStrengthClass}`, sizeClass && `accordion-item_size_${sizeClass}`, isExpanded && 'accordion-item_state_open'), style: styles, children: [jsxs("div", { className: clsx('accordion-item__header', fillClass && `fill_${fillClass}`, fillHoverClass && `fill_hover_${fillHoverClass}`), children: [jsx(Text, { className: clsx('accordion-item__title', titleBorderColorClass && `border-color_${titleBorderColorClass}`, titleFillClass && `fill_${titleFillClass}`, titleFillHoverClass && `fill_hover_${titleFillHoverClass}`, titleWidthClass && `width_${titleWidthClass}`, onClickTitle && 'cursor_type_pointer'), size: titleTextSize, textColor: titleTextColor, textWeight: titleTextWeight, onClick: onClickTitle, children: title }), jsxs("div", { className: "accordion-item__action", children: [badgeValue && (jsx(Badge, { className: "accordion-item__badge", appearance: `${badgeAppearance} ${badgeAppearanceSize}`, size: badgeSize, textColor: badgeTextColor, textSize: badgeTextSize, shape: badgeShape, value: badgeValue })), (icon || iconSrc) && (jsx(Icon, { className: clsx('accordion-item__icon'), fill: iconFill, fillSize: iconFillSize, iconFill: iconFillIcon, iconSize: iconSize, imageSrc: iconSrc, shape: iconShape, SvgImage: icon, onClick: onClickTitle }))] }), showDivider && (jsx(Divider, { width: "fill", direction: dividerDirection, size: dividerSize, fill: dividerFill || 'surfaceTertiary' }))] }), beforeContent, isExpanded && (jsxs("div", { className: clsx('accordion-item__content'), children: [content && (jsx("div", { className: clsx('accordion-item__content-inner', fillClass && `fill_${fillClass}`), children: jsx(Text, { size: contentTextSize, textColor: contentTextColor, textWeight: contentTextWeight, children: content }) })), children] })), afterContent] }));
+    return (jsxs("div", { className: clsx('accordion-item', className, zeroPadding && 'accordion-item_zero-padding', zeroGap && 'accordion-item_zero-gap', borderColorClass && `border-color_${borderColorClass}`, shapeClass && `shape_${shapeClass}`, shapeStrengthClass && `shape-strength_${shapeStrengthClass}`, sizeClass && `accordion-item_size_${sizeClass}`, isExpanded && 'accordion-item_state_open'), style: styles, children: [jsxs("div", { className: clsx('accordion-item__header', fillClass && `fill_${fillClass}`, fillHoverClass && `fill_hover_${fillHoverClass}`), children: [jsx(Text, { className: clsx('accordion-item__title', titleBorderColorClass && `border-color_${titleBorderColorClass}`, titleFillClass && `fill_${titleFillClass}`, titleFillHoverClass && `fill_hover_${titleFillHoverClass}`, titleWidthClass && `width_${titleWidthClass}`, onClickTitle && 'cursor_type_pointer'), size: titleTextSize, textColor: titleTextColor, textWeight: titleTextWeight, onClick: onClickTitle, children: title }), jsxs("div", { className: "accordion-item__action", children: [badgeValue && (jsx(Badge, { appearance: `${badgeAppearance} ${badgeAppearanceSize}`, className: "accordion-item__badge", size: badgeSize, textColor: badgeTextColor, textSize: badgeTextSize, shape: badgeShape, value: badgeValue })), (icon || iconSrc) && (jsx(Icon, { className: clsx('accordion-item__icon'), fill: iconFill, fillSize: iconFillSize, iconFill: iconFillIcon, iconSize: iconSize, imageSrc: iconSrc, shape: iconShape, SvgImage: icon, onClick: onClickTitle }))] }), showDivider && (jsx(Divider, { width: "fill", direction: dividerDirection, size: dividerSize, fill: dividerFill || 'surfaceTertiary' }))] }), beforeContent, isExpanded && (jsxs("div", { className: clsx('accordion-item__content'), children: [content && (jsx("div", { className: clsx('accordion-item__content-inner', fillClass && `fill_${fillClass}`), children: jsx(Text, { size: contentTextSize, textColor: contentTextColor, textWeight: contentTextWeight, children: content }) })), children] })), afterContent] }));
 }
 
 function Accordion(props) {

package/dist/components/Chips.js

@@ -1,4 +1,4 @@
-export { C as Chips, b as ChipsGroup, a as chipsAppearance, c as chipsConfig } from '../ChipsGroup_es_DFVf6wUN.js';
+export { C as Chips, b as ChipsGroup, a as chipsAppearance, c as chipsConfig } from '../ChipsGroup_es_BrHHulZC.js';
 import 'react/jsx-runtime';
 import 'clsx';
 import '../hooks/useDevicePropsGenerator/useDevicePropsGenerator.js';

package/dist/components/DatePeriod.js

@@ -5,7 +5,7 @@ import { DateTime } from 'luxon';
 import { DATE_PERIOD_INTERVALS } from '@itcase/common';
 import { useAppearanceConfig } from '../hooks/useAppearanceConfig/useAppearanceConfig.js';
 import { useDevicePropsGenerator } from '../hooks/useDevicePropsGenerator/useDevicePropsGenerator.js';
-import { b as ChipsGroup, C as Chips } from '../ChipsGroup_es_DFVf6wUN.js';
+import { b as ChipsGroup, C as Chips } from '../ChipsGroup_es_BrHHulZC.js';
 import { D as DatePickerInput } from '../DatePicker_es_C8h_4BAl.js';
 import 'react-select';
 import '../Icon_es_CJuX1p1_.js';

package/dist/css/styles/bundles.css

@@ -45072,8 +45072,18 @@ textarea.fill {
   }
 }
 /* stylelint-disable order/order */
-.text,
-  div.text {
+.title.text,
+  .title.text-font_print,
+  .title.text.text-font_print,
+  .text,
+  .text-font_print,
+  .text.text-font_print,
+  div.text,
+  div.text-font_print,
+  div.text.text-font_print,
+  div.title.text,
+  div.title.text-font_print,
+  div.title.text.text-font_print {
     &-weight {
         &_100 {
           font-weight: 100;
@@ -45131,8 +45141,18 @@ textarea.fill {
       }
     }
   }
-.text,
-  span.text {
+.title.text,
+  .title.text-font_print,
+  .title.text.text-font_print,
+  .text,
+  .text-font_print,
+  .text.text-font_print,
+  span.text,
+  span.text-font_print,
+  span.text.text-font_print,
+  span.title.text,
+  span.title.text-font_print,
+  span.title.text.text-font_print {
     &-weight {
         &_100 {
           font-weight: 100;
@@ -45190,8 +45210,18 @@ textarea.fill {
       }
     }
   }
-.text,
-  li.text {
+.title.text,
+  .title.text-font_print,
+  .title.text.text-font_print,
+  .text,
+  .text-font_print,
+  .text.text-font_print,
+  li.text,
+  li.text-font_print,
+  li.text.text-font_print,
+  li.title.text,
+  li.title.text-font_print,
+  li.title.text.text-font_print {
     &-weight {
         &_100 {
           font-weight: 100;
@@ -45344,6 +45374,7 @@ textarea.fill {
   &_size {
       &_xxl {
         ^^&__header {
+          min-height: var(--accordion-item-header-xxl-min-height);
           padding: var(--accordion-item-header-xxl-padding);
           gap: var(--accordion-item-header-xxl-gap);
         }
@@ -45355,6 +45386,7 @@ textarea.fill {
       }
       &_xl {
         ^^&__header {
+          min-height: var(--accordion-item-header-xl-min-height);
           padding: var(--accordion-item-header-xl-padding);
           gap: var(--accordion-item-header-xl-gap);
         }
@@ -45366,6 +45398,7 @@ textarea.fill {
       }
       &_l {
         ^^&__header {
+          min-height: var(--accordion-item-header-l-min-height);
           padding: var(--accordion-item-header-l-padding);
           gap: var(--accordion-item-header-l-gap);
         }
@@ -45377,6 +45410,7 @@ textarea.fill {
       }
       &_m {
         ^^&__header {
+          min-height: var(--accordion-item-header-m-min-height);
           padding: var(--accordion-item-header-m-padding);
           gap: var(--accordion-item-header-m-gap);
         }
@@ -45388,6 +45422,7 @@ textarea.fill {
       }
       &_s {
         ^^&__header {
+          min-height: var(--accordion-item-header-s-min-height);
           padding: var(--accordion-item-header-s-padding);
           gap: var(--accordion-item-header-s-gap);
         }
@@ -45399,6 +45434,7 @@ textarea.fill {
       }
       &_xs {
         ^^&__header {
+          min-height: var(--accordion-item-header-xs-min-height);
           padding: var(--accordion-item-header-xs-padding);
           gap: var(--accordion-item-header-xs-gap);
         }
@@ -45410,6 +45446,7 @@ textarea.fill {
       }
       &_xxs {
         ^^&__header {
+          min-height: var(--accordion-item-header-xxs-min-height);
           padding: var(--accordion-item-header-xxs-padding);
           gap: var(--accordion-item-header-xxs-gap);
         }
@@ -45449,6 +45486,14 @@ textarea.fill {
   --accordion-item-header-xs-padding: 10px 8px;
   --accordion-item-header-xxs-padding: 12px;
 
+  --accordion-item-header-xxl-min-height: 40px;
+  --accordion-item-header-xl-min-height: 40px;
+  --accordion-item-header-l-min-height: 40px;
+  --accordion-item-header-m-min-height: 40px;
+  --accordion-item-header-s-min-height: 40px;
+  --accordion-item-header-xs-min-height: 40px;
+  --accordion-item-header-xxs-min-height: 40px;
+
   --accordion-item-header-xxl-gap: 8px;
   --accordion-item-header-xl-gap: 8px;
   --accordion-item-header-l-gap: 8px;

package/dist/types/components/Chips/appearance/chipsAccent.d.ts

@@ -1,10 +1,4 @@
 declare const chipsAppearanceAccent: {
-    accent: {
-        fill: string;
-        fillHover: string;
-        labelTextColor: string;
-        borderColor: string;
-    };
     accentMutedPrimary: {
         fill: string;
         fillHover: string;
@@ -15,10 +9,15 @@ declare const chipsAppearanceAccent: {
     };
     accentPrimary: {
         fill: string;
+        fillActive: string;
+        fillActiveHover: string;
         fillHover: string;
+        labelTextActiveColor: string;
         labelTextColor: string;
         borderColor: string;
+        iconAfterFillActiveIcon: string;
         iconAfterFillIcon: string;
+        iconBeforeFillActiveIcon: string;
         iconBeforeFillIcon: string;
     };
 };

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@itcase/ui",
-  "version": "1.9.16",
+  "version": "1.9.17",
   "description": "UI components (Modal, Loader, Popup, etc)",
   "keywords": [
     "Modal",