@itcase/ui 1.0.80 → 1.0.82

package/dist/components/Tab.js

@@ -78,9 +78,8 @@ function Tab(props) {
     dividerDirection,
     onClick,
     onMouseEnter,
+    badgeAppearance,
     badgeSize,
-    badgeFill,
-    badgeTextColor,
     badgeTextSize,
     badgeValue
   } = props;
@@ -139,44 +138,43 @@ function Tab(props) {
     styles: tab
   } = useStyles.useStyles(props);
   return /*#__PURE__*/React__default.default.createElement("div", {
-    className: clsx__default.default('tab', isActive && 'tab_state_active', isHover && 'tab_state_hover', appearance && tabConfig.appearance[appearance] && `fill_${tabConfig.appearance[appearance].fillClass}`.replace(/([A-Z])/g, '-$1').toLowerCase(), appearance && tabConfig.appearance[appearance] && `fill_hover_${tabConfig.appearance[appearance].fillHoverClass}`.replace(/([A-Z])/g, '-$1').toLowerCase(), className, sizeClass, fillClass, fillHoverClass, fillActiveClass, fillActiveHoverClass, fillDisabledClass, shapeClass, typeClass, widthClass, set && `tab_set_${set}`, justifyContentClass),
+    className: clsx__default.default('tab', isActive && 'tab_state_active', isHover && 'tab_state_hover', fillClass || tabConfig.appearance[appearance] && `fill_${tabConfig.appearance[appearance].fillClass}`.replace(/([A-Z])/g, '-$1').toLowerCase(), fillHoverClass || tabConfig.appearance[appearance] && `fill_hover_${tabConfig.appearance[appearance].fillHoverClass}`.replace(/([A-Z])/g, '-$1').toLowerCase(), className, sizeClass, fillActiveClass, fillActiveHoverClass, fillDisabledClass, shapeClass, typeClass, widthClass, set && `tab_set_${set}`, justifyContentClass, onClick && 'cursor_type_pointer'),
+    "data-tour": dataTour,
     style: tab,
     onClick: onClick,
-    onMouseEnter: onMouseEnter,
-    "data-tour": dataTour
+    onMouseEnter: onMouseEnter
   }, /*#__PURE__*/React__default.default.createElement(index.Link, {
-    href: link || href,
     className: clsx__default.default('tab__link', alignDirectionClass, alignClass),
     fill: linkFillClass,
-    target: target,
-    rel: rel
+    href: link || href,
+    rel: rel,
+    target: target
   }, /*#__PURE__*/React__default.default.createElement(React__default.default.Fragment, null, before, children || /*#__PURE__*/React__default.default.createElement(React__default.default.Fragment, null, /*#__PURE__*/React__default.default.createElement("div", {
     className: "tab__wrapper"
   }, label && /*#__PURE__*/React__default.default.createElement(index$1.Text, {
     className: "tab__label",
-    textColorActive: isActive && labelColorActive || appearance && tabConfig.appearance[appearance].labelColorActive.replace(/([A-Z])/g, '-$1').toLowerCase(),
-    textColorGradient: labelTextGradient,
     size: labelTextSize,
-    textWeight: labelTextWeight,
-    textColor: labelColor || appearance && tabConfig.appearance[appearance].labelColor.replace(/([A-Z])/g, '-$1').toLowerCase(),
-    textWrap: labelTextWrap,
+    textColor: labelColor || tabConfig.appearance[appearance] && tabConfig.appearance[appearance].labelColor.replace(/([A-Z])/g, '-$1').toLowerCase(),
+    textColorActive: isActive && (labelColorActive || tabConfig.appearance[appearance] && tabConfig.appearance[appearance].labelColorActive.replace(/([A-Z])/g, '-$1').toLowerCase()),
+    textColorGradient: labelTextGradient,
     textColorHover: labelTextColorHover,
-    textStyle: labelTextStyle
+    textStyle: labelTextStyle,
+    textWeight: labelTextWeight,
+    textWrap: labelTextWrap
   }, dividerFillActive, " ", label), badgeValue && /*#__PURE__*/React__default.default.createElement(index$2.Badge, {
+    appearance: badgeAppearance,
     size: badgeSize,
-    fill: badgeFill,
-    textColor: badgeTextColor,
     textSize: badgeTextSize,
     value: badgeValue
   })), /*#__PURE__*/React__default.default.createElement(index$3.Divider, {
-    width: "fill",
-    fill: dividerFill || appearance && tabConfig.appearance[appearance].dividerFill.replace(/([A-Z])/g, '-$1').toLowerCase(),
-    fillHover: isHover && (dividerFillHover || appearance && tabConfig.appearance[appearance].dividerFillHover.replace(/([A-Z])/g, '-$1').toLowerCase()),
-    fillActive: isActive && (dividerFillActive || appearance && tabConfig.appearance[appearance].dividerFillActive.replace(/([A-Z])/g, '-$1').toLowerCase()),
+    direction: dividerDirection,
+    fill: dividerFill || tabConfig.appearance[appearance] && tabConfig.appearance[appearance].dividerFill.replace(/([A-Z])/g, '-$1').toLowerCase(),
+    fillActive: isActive && (dividerFillActive || tabConfig.appearance[appearance] && tabConfig.appearance[appearance].dividerFillActive.replace(/([A-Z])/g, '-$1').toLowerCase()),
     fillActiveHover: dividerFillActiveHover,
     fillDisabled: dividerFillDisabled,
+    fillHover: isHover && (dividerFillHover || tabConfig.appearance[appearance] && tabConfig.appearance[appearance].dividerFillHover.replace(/([A-Z])/g, '-$1').toLowerCase()),
     size: dividerSize,
-    direction: dividerDirection
+    width: "fill"
   })), after)));
 }
 Tab.propTypes = {
@@ -188,40 +186,40 @@ Tab.propTypes = {
   fillDesktop: PropTypes__default.default.oneOf(fill.default),
   fillMobile: PropTypes__default.default.oneOf(fill.default),
   fillTablet: PropTypes__default.default.oneOf(fill.default),
+  href: PropTypes__default.default.string,
+  isActive: PropTypes__default.default.bool,
+  label: PropTypes__default.default.string,
+  labelColor: PropTypes__default.default.oneOf(textColor.default),
+  labelColorActive: PropTypes__default.default.oneOf(textColorActive.default),
+  labelTextColorHover: PropTypes__default.default.oneOf(textColorHover.default),
+  labelTextGradient: PropTypes__default.default.oneOf(textGradient.default),
+  labelTextSize: PropTypes__default.default.oneOf(size.default),
+  labelTextStyle: PropTypes__default.default.oneOf(textStyle.default),
+  labelTextWeight: PropTypes__default.default.oneOf(textWeight.default),
+  labelTextWrap: PropTypes__default.default.string,
+  link: PropTypes__default.default.string,
+  LinkComponent: PropTypes__default.default.any,
   linkFill: PropTypes__default.default.oneOf(fill.default),
   linkFillDesktop: PropTypes__default.default.oneOf(fill.default),
   linkFillMobile: PropTypes__default.default.oneOf(fill.default),
   linkFillTablet: PropTypes__default.default.oneOf(fill.default),
-  isActive: PropTypes__default.default.bool,
-  label: PropTypes__default.default.string,
-  onClick: PropTypes__default.default.func,
-  onMouseEnter: PropTypes__default.default.func,
-  size: PropTypes__default.default.oneOf(size.default),
-  sizeDesktop: PropTypes__default.default.oneOf(size.default),
-  sizeMobile: PropTypes__default.default.oneOf(size.default),
-  sizeTablet: PropTypes__default.default.oneOf(size.default),
-  LinkComponent: PropTypes__default.default.any,
-  href: PropTypes__default.default.string,
-  link: PropTypes__default.default.string,
-  target: PropTypes__default.default.string,
   rel: PropTypes__default.default.string,
   shape: PropTypes__default.default.oneOf(shape.default),
   shapeDesktop: PropTypes__default.default.oneOf(shape.default),
   shapeMobile: PropTypes__default.default.oneOf(shape.default),
   shapeTablet: PropTypes__default.default.oneOf(shape.default),
-  labelColor: PropTypes__default.default.oneOf(textColor.default),
-  labelTextColorHover: PropTypes__default.default.oneOf(textColorHover.default),
-  labelColorActive: PropTypes__default.default.oneOf(textColorActive.default),
-  labelTextGradient: PropTypes__default.default.oneOf(textGradient.default),
-  labelTextSize: PropTypes__default.default.oneOf(size.default),
-  labelTextWrap: PropTypes__default.default.string,
-  labelTextStyle: PropTypes__default.default.oneOf(textStyle.default),
-  labelTextWeight: PropTypes__default.default.oneOf(textWeight.default),
+  size: PropTypes__default.default.oneOf(size.default),
+  sizeDesktop: PropTypes__default.default.oneOf(size.default),
+  sizeMobile: PropTypes__default.default.oneOf(size.default),
+  sizeTablet: PropTypes__default.default.oneOf(size.default),
+  target: PropTypes__default.default.string,
   type: PropTypes__default.default.oneOf(type.default),
   typeDesktop: PropTypes__default.default.oneOf(type.default),
   typeMobile: PropTypes__default.default.oneOf(type.default),
   typeTablet: PropTypes__default.default.oneOf(type.default),
-  underline: PropTypes__default.default.oneOf(underline.default)
+  underline: PropTypes__default.default.oneOf(underline.default),
+  onClick: PropTypes__default.default.func,
+  onMouseEnter: PropTypes__default.default.func
 };
 Tab.defaultProps = {
   size: 'normal',
@@ -328,71 +326,64 @@ Tab.__docgenInfo = {
       },
       "required": false
     },
-    "linkFill": {
+    "href": {
       "description": "",
       "type": {
-        "name": "enum",
-        "computed": true,
-        "value": "fillProps"
+        "name": "string"
       },
       "required": false
     },
-    "linkFillDesktop": {
+    "isActive": {
       "description": "",
       "type": {
-        "name": "enum",
-        "computed": true,
-        "value": "fillProps"
+        "name": "bool"
       },
       "required": false
     },
-    "linkFillMobile": {
+    "label": {
       "description": "",
       "type": {
-        "name": "enum",
-        "computed": true,
-        "value": "fillProps"
+        "name": "string"
       },
       "required": false
     },
-    "linkFillTablet": {
+    "labelColor": {
       "description": "",
       "type": {
         "name": "enum",
         "computed": true,
-        "value": "fillProps"
-      },
-      "required": false
-    },
-    "isActive": {
-      "description": "",
-      "type": {
-        "name": "bool"
+        "value": "textColorProps"
       },
       "required": false
     },
-    "label": {
+    "labelColorActive": {
       "description": "",
       "type": {
-        "name": "string"
+        "name": "enum",
+        "computed": true,
+        "value": "textColorActiveProps"
       },
       "required": false
     },
-    "onClick": {
+    "labelTextColorHover": {
       "description": "",
       "type": {
-        "name": "func"
+        "name": "enum",
+        "computed": true,
+        "value": "textColorHoverProps"
       },
       "required": false
     },
-    "onMouseEnter": {
+    "labelTextGradient": {
       "description": "",
       "type": {
-        "name": "func"
+        "name": "enum",
+        "computed": true,
+        "value": "textGradientProps"
       },
       "required": false
     },
-    "sizeDesktop": {
+    "labelTextSize": {
       "description": "",
       "type": {
         "name": "enum",
@@ -401,25 +392,25 @@ Tab.__docgenInfo = {
       },
       "required": false
     },
-    "sizeMobile": {
+    "labelTextStyle": {
       "description": "",
       "type": {
         "name": "enum",
         "computed": true,
-        "value": "sizeProps"
+        "value": "textStyleProps"
       },
       "required": false
     },
-    "sizeTablet": {
+    "labelTextWeight": {
       "description": "",
       "type": {
         "name": "enum",
         "computed": true,
-        "value": "sizeProps"
+        "value": "textWeightProps"
       },
       "required": false
     },
-    "href": {
+    "labelTextWrap": {
       "description": "",
       "type": {
         "name": "string"
@@ -433,48 +424,50 @@ Tab.__docgenInfo = {
       },
       "required": false
     },
-    "target": {
+    "linkFill": {
       "description": "",
       "type": {
-        "name": "string"
+        "name": "enum",
+        "computed": true,
+        "value": "fillProps"
       },
       "required": false
     },
-    "rel": {
+    "linkFillDesktop": {
       "description": "",
       "type": {
-        "name": "string"
+        "name": "enum",
+        "computed": true,
+        "value": "fillProps"
       },
       "required": false
     },
-    "shape": {
+    "linkFillMobile": {
       "description": "",
       "type": {
         "name": "enum",
         "computed": true,
-        "value": "shapeProps"
+        "value": "fillProps"
       },
       "required": false
     },
-    "shapeDesktop": {
+    "linkFillTablet": {
       "description": "",
       "type": {
         "name": "enum",
         "computed": true,
-        "value": "shapeProps"
+        "value": "fillProps"
       },
       "required": false
     },
-    "shapeMobile": {
+    "rel": {
       "description": "",
       "type": {
-        "name": "enum",
-        "computed": true,
-        "value": "shapeProps"
+        "name": "string"
       },
       "required": false
     },
-    "shapeTablet": {
+    "shape": {
       "description": "",
       "type": {
         "name": "enum",
@@ -483,43 +476,43 @@ Tab.__docgenInfo = {
       },
       "required": false
     },
-    "labelColor": {
+    "shapeDesktop": {
       "description": "",
       "type": {
         "name": "enum",
         "computed": true,
-        "value": "textColorProps"
+        "value": "shapeProps"
       },
       "required": false
     },
-    "labelTextColorHover": {
+    "shapeMobile": {
       "description": "",
       "type": {
         "name": "enum",
         "computed": true,
-        "value": "textColorHoverProps"
+        "value": "shapeProps"
       },
       "required": false
     },
-    "labelColorActive": {
+    "shapeTablet": {
       "description": "",
       "type": {
         "name": "enum",
         "computed": true,
-        "value": "textColorActiveProps"
+        "value": "shapeProps"
       },
       "required": false
     },
-    "labelTextGradient": {
+    "sizeDesktop": {
       "description": "",
       "type": {
         "name": "enum",
         "computed": true,
-        "value": "textGradientProps"
+        "value": "sizeProps"
       },
       "required": false
     },
-    "labelTextSize": {
+    "sizeMobile": {
       "description": "",
       "type": {
         "name": "enum",
@@ -528,28 +521,19 @@ Tab.__docgenInfo = {
       },
       "required": false
     },
-    "labelTextWrap": {
-      "description": "",
-      "type": {
-        "name": "string"
-      },
-      "required": false
-    },
-    "labelTextStyle": {
+    "sizeTablet": {
       "description": "",
       "type": {
         "name": "enum",
         "computed": true,
-        "value": "textStyleProps"
+        "value": "sizeProps"
       },
       "required": false
     },
-    "labelTextWeight": {
+    "target": {
       "description": "",
       "type": {
-        "name": "enum",
-        "computed": true,
-        "value": "textWeightProps"
+        "name": "string"
       },
       "required": false
     },
@@ -597,6 +581,20 @@ Tab.__docgenInfo = {
         "value": "underlineProps"
       },
       "required": false
+    },
+    "onClick": {
+      "description": "",
+      "type": {
+        "name": "func"
+      },
+      "required": false
+    },
+    "onMouseEnter": {
+      "description": "",
+      "type": {
+        "name": "func"
+      },
+      "required": false
     }
   }
 };

package/dist/components/Text.js

@@ -60,7 +60,7 @@ function Text(props) {
     propsKey: 'textColor'
   });
   const textColorActiveClass = useDeviceTargetClass.useDeviceTargetClass(props, {
-    prefix: 'text-color-active_',
+    prefix: 'text-color_active_',
     propsKey: 'textColorActive'
   });
   const textColorHoverClass = useDeviceTargetClass.useDeviceTargetClass(props, {

package/dist/components/Tile.js

@@ -97,7 +97,7 @@ function Tile(props) {
   });
   const borderColorHoverClass = useDeviceTargetClass.useDeviceTargetClass(props, {
     prefix: 'border-color_hover_',
-    propsKey: 'borderHover'
+    propsKey: 'borderColorHover'
   });
   const borderWidthClass = useDeviceTargetClass.useDeviceTargetClass(props, {
     prefix: 'border-width_',

package/dist/components/Title.js

@@ -57,7 +57,7 @@ function Title(props) {
     propsKey: 'textColor'
   });
   const textColorActiveClass = useDeviceTargetClass.useDeviceTargetClass(props, {
-    prefix: 'text-color-active_',
+    prefix: 'text-color_active_',
     propsKey: 'textColorActive'
   });
   const textColorHoverClass = useDeviceTargetClass.useDeviceTargetClass(props, {

package/dist/constants/componentProps/borderColor.js

@@ -1,5 +1,5 @@
 'use strict';
 
-const borderColorProps = [null, 'accentBorderPrimary', 'accentBorderSecondary', 'accentBorderTertiary', 'accentBorderQuaternary', 'accentBorderDisabled', 'primaryBorderPrimary', 'primaryBorderSecondary', 'primaryBorderTertiary', 'primaryBorderQuaternary', 'primaryBorderDisabled', 'secondaryBorderPrimary', 'secondaryBorderSecondary', 'secondaryBorderTertiary', 'secondaryBorderQuaternary', 'secondaryBorderDisabled', 'tertiaryBorderPrimary', 'tertiaryBorderSecondary', 'tertiaryBorderTertiary', 'tertiaryBorderQuaternary', 'tertiaryBorderDisabled', 'surfaceBorderPrimary', 'surfaceBorderSecondary', 'surfaceBorderTertiary', 'surfaceBorderQuaternary', 'surfaceBorderDisabled', 'errorBorderPrimary', 'errorBorderSecondary', 'errorBorderDisabled', 'successBorderPrimary', 'successBorderSecondary', 'successBorderDisabled'];
+const borderColorProps = [null, 'accentBorderPrimary', 'accentBorderSecondary', 'accentBorderTertiary', 'accentBorderQuaternary', 'accentBorderDisabled', 'primaryBorderPrimary', 'primaryBorderSecondary', 'primaryBorderTertiary', 'primaryBorderQuaternary', 'primaryBorderDisabled', 'secondaryBorderPrimary', 'secondaryBorderSecondary', 'secondaryBorderTertiary', 'secondaryBorderQuaternary', 'secondaryBorderDisabled', 'tertiaryBorderPrimary', 'tertiaryBorderSecondary', 'tertiaryBorderTertiary', 'tertiaryBorderQuaternary', 'tertiaryBorderDisabled', 'surfaceBorderPrimary', 'surfaceBorderSecondary', 'surfaceBorderTertiary', 'surfaceBorderQuaternary', 'surfaceBorderDisabled', 'surfaceBorderInvert', 'errorBorderPrimary', 'errorBorderSecondary', 'errorBorderDisabled', 'successBorderPrimary', 'successBorderSecondary', 'successBorderDisabled'];
 
 exports.default = borderColorProps;

package/dist/constants/componentProps/fill.js

@@ -1,5 +1,5 @@
 'use strict';
 
-const fillProps = [null, 'accentPrimary', 'accentSecondary', 'accentTertiary', 'primaryPrimary', 'primarySecondary', 'primaryTertiary', 'secondaryPrimary', 'secondarySecondary', 'secondaryTertiary', 'tertiaryPrimary', 'tertiarySecondary', 'tertiaryTertiary', 'surfacePrimary', 'surfaceSecondary', 'surfaceTertiary', 'surfaceQuaternary', 'surfaceQuinary', 'errorPrimary', 'errorSecondary', 'successPrimary', 'successSecondary'];
+const fillProps = [null, 'accentPrimary', 'accentSecondary', 'accentTertiary', 'primaryPrimary', 'primarySecondary', 'primaryTertiary', 'secondaryPrimary', 'secondarySecondary', 'secondaryTertiary', 'tertiaryPrimary', 'tertiarySecondary', 'tertiaryTertiary', 'surfacePrimary', 'surfaceSecondary', 'surfaceTertiary', 'surfaceQuaternary', 'surfaceQuinary', 'errorPrimary', 'errorSecondary', 'successPrimary', 'successSecondary', 'gradientPrimary'];
 
 exports.default = fillProps;

package/dist/constants/componentProps/strokeColor.js

@@ -1,5 +1,5 @@
 'use strict';
 
-const strokeColorProps = [null, 'accent', 'primary', 'secondary', 'tertiary', 'surface', 'error', 'success'];
+const strokeColorProps = [null, 'surfaceItemPrimary', 'surfaceItemSecondary', 'surfaceItemTertiary', 'surfaceItemAccent', 'surfaceItemDisabled', 'accentItemPrimary', 'accentItemSecondary', 'primaryItemPrimary', 'secondaryItemPrimary', 'errorItemPrimary', 'errorItemSecondary', 'successItemPrimary', 'successItemSecondary'];
 
 exports.default = strokeColorProps;

package/dist/constants/componentProps/textColor.js

@@ -1,5 +1,5 @@
 'use strict';
 
-const textColorProps = [null, 'accentTextPrimary', 'accentTextSecondary', 'accentTextTertiary', 'primaryTextPrimary', 'primaryTextSecondary', 'primaryTextTertiary', 'secondaryTextPrimary', 'secondaryTextSecondary', 'secondaryTextTertiary', 'tertiaryTextPrimary', 'tertiaryTextSecondary', 'surfaceTextPrimary', 'surfaceTextSecondary', 'surfaceTextTertiary', 'surfaceTextQuaternary', 'surfaceTextAccent', 'surfaceTextHover', 'surfaceTextFocus', 'surfaceTextActive', 'surfaceTextDisabled', 'errorTextPrimary', 'errorTextSecondary', 'successTextPrimary', 'successTextSecondary'];
+const textColorProps = [null, 'accentTextPrimary', 'accentTextSecondary', 'accentTextTertiary', 'primaryTextPrimary', 'primaryTextSecondary', 'primaryTextTertiary', 'secondaryTextPrimary', 'secondaryTextSecondary', 'secondaryTextTertiary', 'tertiaryTextPrimary', 'tertiaryTextSecondary', 'surfaceTextPrimary', 'surfaceTextAccent', 'surfaceTextSecondary', 'surfaceTextTertiary', 'surfaceTextQuaternary', 'surfaceTextAccent', 'surfaceTextHover', 'surfaceTextFocus', 'surfaceTextActive', 'surfaceTextDisabled', 'errorTextPrimary', 'errorTextSecondary', 'successTextPrimary', 'successTextSecondary', 'surfaceTextInvert'];
 
 exports.default = textColorProps;

package/dist/constants/componentProps/textColorActive.js

@@ -1,5 +1,5 @@
 'use strict';
 
-const textColorActiveProps = [null, false, 'accent', 'primary', 'secondary', 'tertiary', 'surface', 'error', 'success'];
+const textColorActiveProps = [null, false, 'accentTextPrimary', 'accentTextSecondary', 'accentTextTertiary', 'primaryTextPrimary', 'primaryTextSecondary', 'primaryTextTertiary', 'secondaryTextPrimary', 'secondaryTextSecondary', 'secondaryTextTertiary', 'tertiaryTextPrimary', 'tertiaryTextSecondary', 'surfaceTextPrimary', 'surfaceTextSecondary', 'surfaceTextTertiary', 'surfaceTextQuaternary', 'surfaceTextHover', 'surfaceTextFocus', 'surfaceTextActive', 'surfaceTextDisabled', 'errorTextPrimary', 'errorTextSecondary', 'successTextPrimary', 'successTextSecondary'];
 
 exports.default = textColorActiveProps;

package/dist/constants/componentProps/textColorHover.js

@@ -1,5 +1,5 @@
 'use strict';
 
-const textColorHoverProps = [null, 'accent', 'primary', 'secondary', 'tertiary', 'surface', 'error', 'success', 'surfaceTextAccent'];
+const textColorHoverProps = [null, 'accentTextPrimary', 'accentTextSecondary', 'accentTextTertiary', 'primaryTextPrimary', 'primaryTextSecondary', 'primaryTextTertiary', 'secondaryTextPrimary', 'secondaryTextSecondary', 'secondaryTextTertiary', 'tertiaryTextPrimary', 'tertiaryTextSecondary', 'surfaceTextPrimary', 'surfaceTextSecondary', 'surfaceTextTertiary', 'surfaceTextQuaternary', 'surfaceTextHover', 'surfaceTextFocus', 'surfaceTextActive', 'surfaceTextDisabled', 'errorTextPrimary', 'errorTextSecondary', 'successTextPrimary', 'successTextSecondary', 'surfaceTextInvert'];
 
 exports.default = textColorHoverProps;

package/dist/css/components/Accordion/Accordion.css

@@ -34,7 +34,6 @@
   flex-flow: row wrap;
   &__title {
     flex: 1;
-    cursor: pointer;
   }
   &__icon {
     margin: 0 0 0 40px;
@@ -49,7 +48,7 @@
 .accordion-item {
   &_shape {
     &_rounded {
-      border-radius: 12px;
+      border-radius: var(--accordion-item-shape-rounded, 12px);
     }
     &_circular {
       border-radius: 50%;

package/dist/css/components/Avatar/Avatar.css

@@ -37,18 +37,21 @@
 .avatar {
   &_shape {
     &_circular {
-      ^^&__image {
+      ^^&__image,
+      ^^&__wrapper {
         border-radius: 50%;
       }
     }
     &_geometric {
-      ^^&__image {
+      ^^&__image,
+      ^^&__wrapper {
         border-radius: 0;
       }
     }
     &_rounded {
-      ^^&__image {
-        border-radius: 10px;
+      ^^&__image,
+      ^^&__wrapper {
+        border-radius: var(--avatar-shape-rounded, 10px);
       }
     }
   }

package/dist/css/components/Badge/Badge.css

@@ -15,22 +15,6 @@
     }
   }
 }
-.badge {
-  &&_type {
-    &_accent {
-      background: var(--color-accent-primary);
-      color: var(--color-accent-text-primary);
-    }
-  }
-}
-.badge {
-  &&_type {
-    &_primary {
-      color: var(--color-primary-text-primary);
-      background: var(--color-primary-primary);
-    }
-  }
-}
 .badge {
   &_type_status {
     &.badge_size {
@@ -48,7 +32,7 @@
 .badge {
   &_shape {
     &_rounded {
-      border-radius: var(--badge-shape-rounded-default);
+      border-radius: var(--badge-shape-rounded, 6px);
     }
     &_circular {
       border-radius: 50%;
@@ -70,5 +54,4 @@
   --badge-height-size-xl: 40px;
   --badge-width-size-xxl: 48px;
   --badge-height-size-xxl: 48px;
-  --badge-shape-rounded-default: 6px;
 }