@uzum-tech/ui 0.1.1 → 1.0.0

package/es/avatar-group/styles/light.d.ts

@@ -14,12 +14,9 @@ declare const avatarGroupLight: import("../../_mixins").Theme<"AvatarGroup", {
         heightSmall: string;
         heightMedium: string;
         heightLarge: string;
-        heightHuge: string;
         textColor: string;
         iconColor: string;
         color: string;
-        colorModal: string;
-        colorPopover: string;
     }, any>;
 }>;
 export default avatarGroupLight;

package/es/back-top/src/BackTop.d.ts

@@ -30,6 +30,10 @@ export declare const backTopProps: {
     readonly onShow: PropType<() => void>;
     readonly onHide: PropType<() => void>;
     readonly theme: PropType<import("../../_mixins").Theme<"BackTop", {
+        width: string;
+        height: string;
+        borderRadius: string;
+        iconSize: string;
         color: string;
         textColor: string;
         iconColor: string;
@@ -38,12 +42,12 @@ export declare const backTopProps: {
         boxShadow: string;
         boxShadowHover: string;
         boxShadowPressed: string;
+    }, any>>;
+    readonly themeOverrides: PropType<import("../../_mixins/use-theme").ExtractThemeOverrides<import("../../_mixins").Theme<"BackTop", {
         width: string;
         height: string;
         borderRadius: string;
         iconSize: string;
-    }, any>>;
-    readonly themeOverrides: PropType<import("../../_mixins/use-theme").ExtractThemeOverrides<import("../../_mixins").Theme<"BackTop", {
         color: string;
         textColor: string;
         iconColor: string;
@@ -52,12 +56,12 @@ export declare const backTopProps: {
         boxShadow: string;
         boxShadowHover: string;
         boxShadowPressed: string;
+    }, any>>>;
+    readonly builtinThemeOverrides: PropType<import("../../_mixins/use-theme").ExtractThemeOverrides<import("../../_mixins").Theme<"BackTop", {
         width: string;
         height: string;
         borderRadius: string;
         iconSize: string;
-    }, any>>>;
-    readonly builtinThemeOverrides: PropType<import("../../_mixins/use-theme").ExtractThemeOverrides<import("../../_mixins").Theme<"BackTop", {
         color: string;
         textColor: string;
         iconColor: string;
@@ -66,10 +70,6 @@ export declare const backTopProps: {
         boxShadow: string;
         boxShadowHover: string;
         boxShadowPressed: string;
-        width: string;
-        height: string;
-        borderRadius: string;
-        iconSize: string;
     }, any>>>;
 };
 export type BackTopProps = ExtractPublicPropTypes<typeof backTopProps>;
@@ -103,6 +103,10 @@ declare const _default: import("vue").DefineComponent<{
     readonly onShow: PropType<() => void>;
     readonly onHide: PropType<() => void>;
     readonly theme: PropType<import("../../_mixins").Theme<"BackTop", {
+        width: string;
+        height: string;
+        borderRadius: string;
+        iconSize: string;
         color: string;
         textColor: string;
         iconColor: string;
@@ -111,12 +115,12 @@ declare const _default: import("vue").DefineComponent<{
         boxShadow: string;
         boxShadowHover: string;
         boxShadowPressed: string;
+    }, any>>;
+    readonly themeOverrides: PropType<import("../../_mixins/use-theme").ExtractThemeOverrides<import("../../_mixins").Theme<"BackTop", {
         width: string;
         height: string;
         borderRadius: string;
         iconSize: string;
-    }, any>>;
-    readonly themeOverrides: PropType<import("../../_mixins/use-theme").ExtractThemeOverrides<import("../../_mixins").Theme<"BackTop", {
         color: string;
         textColor: string;
         iconColor: string;
@@ -125,12 +129,12 @@ declare const _default: import("vue").DefineComponent<{
         boxShadow: string;
         boxShadowHover: string;
         boxShadowPressed: string;
+    }, any>>>;
+    readonly builtinThemeOverrides: PropType<import("../../_mixins/use-theme").ExtractThemeOverrides<import("../../_mixins").Theme<"BackTop", {
         width: string;
         height: string;
         borderRadius: string;
         iconSize: string;
-    }, any>>>;
-    readonly builtinThemeOverrides: PropType<import("../../_mixins/use-theme").ExtractThemeOverrides<import("../../_mixins").Theme<"BackTop", {
         color: string;
         textColor: string;
         iconColor: string;
@@ -139,10 +143,6 @@ declare const _default: import("vue").DefineComponent<{
         boxShadow: string;
         boxShadowHover: string;
         boxShadowPressed: string;
-        width: string;
-        height: string;
-        borderRadius: string;
-        iconSize: string;
     }, any>>>;
 }, {
     placeholderRef: import("vue").Ref<HTMLElement | null>;
@@ -207,6 +207,10 @@ declare const _default: import("vue").DefineComponent<{
     readonly onShow: PropType<() => void>;
     readonly onHide: PropType<() => void>;
     readonly theme: PropType<import("../../_mixins").Theme<"BackTop", {
+        width: string;
+        height: string;
+        borderRadius: string;
+        iconSize: string;
         color: string;
         textColor: string;
         iconColor: string;
@@ -215,12 +219,12 @@ declare const _default: import("vue").DefineComponent<{
         boxShadow: string;
         boxShadowHover: string;
         boxShadowPressed: string;
+    }, any>>;
+    readonly themeOverrides: PropType<import("../../_mixins/use-theme").ExtractThemeOverrides<import("../../_mixins").Theme<"BackTop", {
         width: string;
         height: string;
         borderRadius: string;
         iconSize: string;
-    }, any>>;
-    readonly themeOverrides: PropType<import("../../_mixins/use-theme").ExtractThemeOverrides<import("../../_mixins").Theme<"BackTop", {
         color: string;
         textColor: string;
         iconColor: string;
@@ -229,12 +233,12 @@ declare const _default: import("vue").DefineComponent<{
         boxShadow: string;
         boxShadowHover: string;
         boxShadowPressed: string;
+    }, any>>>;
+    readonly builtinThemeOverrides: PropType<import("../../_mixins/use-theme").ExtractThemeOverrides<import("../../_mixins").Theme<"BackTop", {
         width: string;
         height: string;
         borderRadius: string;
         iconSize: string;
-    }, any>>>;
-    readonly builtinThemeOverrides: PropType<import("../../_mixins/use-theme").ExtractThemeOverrides<import("../../_mixins").Theme<"BackTop", {
         color: string;
         textColor: string;
         iconColor: string;
@@ -243,10 +247,6 @@ declare const _default: import("vue").DefineComponent<{
         boxShadow: string;
         boxShadowHover: string;
         boxShadowPressed: string;
-        width: string;
-        height: string;
-        borderRadius: string;
-        iconSize: string;
     }, any>>>;
 }>>, {
     readonly right: string | number;

package/es/back-top/styles/dark.js

@@ -1,11 +1,8 @@
-import commonVariables from './_common';
 import { commonDark } from '../../_styles/common';
+import { self } from './light';
 const backTopDark = {
     name: 'BackTop',
     common: commonDark,
-    self(vars) {
-        const { popoverColor, textColor2, primaryColorHover, primaryColorPressed } = vars;
-        return Object.assign(Object.assign({}, commonVariables), { color: popoverColor, textColor: textColor2, iconColor: textColor2, iconColorHover: primaryColorHover, iconColorPressed: primaryColorPressed, boxShadow: '0 2px 8px 0px rgba(0, 0, 0, .12)', boxShadowHover: '0 2px 12px 0px rgba(0, 0, 0, .18)', boxShadowPressed: '0 2px 12px 0px rgba(0, 0, 0, .18)' });
-    }
+    self
 };
 export default backTopDark;

package/es/back-top/styles/light.d.ts

@@ -1,6 +1,10 @@
 import type { ThemeCommonVars } from '../../_styles/common';
 import type { Theme } from '../../_mixins';
-declare const self: (vars: ThemeCommonVars) => {
+export declare const self: (vars: ThemeCommonVars) => {
+    width: string;
+    height: string;
+    borderRadius: string;
+    iconSize: string;
     color: string;
     textColor: string;
     iconColor: string;
@@ -9,10 +13,6 @@ declare const self: (vars: ThemeCommonVars) => {
     boxShadow: string;
     boxShadowHover: string;
     boxShadowPressed: string;
-    width: string;
-    height: string;
-    borderRadius: string;
-    iconSize: string;
 };
 export type BackTopThemeVars = ReturnType<typeof self>;
 declare const backTopLight: Theme<'BackTop', BackTopThemeVars>;

package/es/back-top/styles/light.js

@@ -1,8 +1,20 @@
-import commonVariables from './_common';
 import { commonLight } from '../../_styles/common';
-const self = (vars) => {
-    const { popoverColor, textColor2, primaryColorHover, primaryColorPressed } = vars;
-    return Object.assign(Object.assign({}, commonVariables), { color: popoverColor, textColor: textColor2, iconColor: textColor2, iconColorHover: primaryColorHover, iconColorPressed: primaryColorPressed, boxShadow: '0 2px 8px 0px rgba(0, 0, 0, .12)', boxShadowHover: '0 2px 12px 0px rgba(0, 0, 0, .18)', boxShadowPressed: '0 2px 12px 0px rgba(0, 0, 0, .18)' });
+export const self = (vars) => {
+    const { heightLarge, iconMedium, containerPrimary, textPrimary } = vars;
+    return {
+        width: heightLarge,
+        height: heightLarge,
+        borderRadius: '100px',
+        iconSize: iconMedium,
+        color: containerPrimary,
+        textColor: textPrimary,
+        iconColor: textPrimary,
+        iconColorHover: textPrimary,
+        iconColorPressed: textPrimary,
+        boxShadow: '0 2px 8px 0px rgba(0, 0, 0, .12)',
+        boxShadowHover: '0 2px 12px 0px rgba(0, 0, 0, .18)',
+        boxShadowPressed: '0 2px 12px 0px rgba(0, 0, 0, .18)'
+    };
 };
 const backTopLight = {
     name: 'BackTop',

package/es/badge/src/Badge.d.ts

@@ -23,7 +23,6 @@ export declare const badgeProps: {
         colorError: string;
         colorWarning: string;
         fontSize: string;
-        fontFamily: string;
     }, any>>;
     readonly themeOverrides: PropType<import("../../_mixins/use-theme").ExtractThemeOverrides<import("../../_mixins").Theme<"Badge", {
         color: string;
@@ -32,7 +31,6 @@ export declare const badgeProps: {
         colorError: string;
         colorWarning: string;
         fontSize: string;
-        fontFamily: string;
     }, any>>>;
     readonly builtinThemeOverrides: PropType<import("../../_mixins/use-theme").ExtractThemeOverrides<import("../../_mixins").Theme<"Badge", {
         color: string;
@@ -41,7 +39,6 @@ export declare const badgeProps: {
         colorError: string;
         colorWarning: string;
         fontSize: string;
-        fontFamily: string;
     }, any>>>;
 };
 export type BadgeProps = ExtractPublicPropTypes<typeof badgeProps>;
@@ -68,7 +65,6 @@ declare const _default: import("vue").DefineComponent<{
         colorError: string;
         colorWarning: string;
         fontSize: string;
-        fontFamily: string;
     }, any>>;
     readonly themeOverrides: PropType<import("../../_mixins/use-theme").ExtractThemeOverrides<import("../../_mixins").Theme<"Badge", {
         color: string;
@@ -77,7 +73,6 @@ declare const _default: import("vue").DefineComponent<{
         colorError: string;
         colorWarning: string;
         fontSize: string;
-        fontFamily: string;
     }, any>>>;
     readonly builtinThemeOverrides: PropType<import("../../_mixins/use-theme").ExtractThemeOverrides<import("../../_mixins").Theme<"Badge", {
         color: string;
@@ -86,7 +81,6 @@ declare const _default: import("vue").DefineComponent<{
         colorError: string;
         colorWarning: string;
         fontSize: string;
-        fontFamily: string;
     }, any>>>;
 }, {
     rtlEnabled: import("vue").Ref<import("../../config-provider/src/internal-interface").RtlItem | undefined> | undefined;
@@ -97,7 +91,6 @@ declare const _default: import("vue").DefineComponent<{
     handleAfterLeave: () => void;
     cssVars: import("vue").ComputedRef<{
         '--u-font-size': string;
-        '--u-font-family': string;
         '--u-color': string;
         '--u-ripple-color': string;
         '--u-bezier': string;
@@ -131,7 +124,6 @@ declare const _default: import("vue").DefineComponent<{
         colorError: string;
         colorWarning: string;
         fontSize: string;
-        fontFamily: string;
     }, any>>;
     readonly themeOverrides: PropType<import("../../_mixins/use-theme").ExtractThemeOverrides<import("../../_mixins").Theme<"Badge", {
         color: string;
@@ -140,7 +132,6 @@ declare const _default: import("vue").DefineComponent<{
         colorError: string;
         colorWarning: string;
         fontSize: string;
-        fontFamily: string;
     }, any>>>;
     readonly builtinThemeOverrides: PropType<import("../../_mixins/use-theme").ExtractThemeOverrides<import("../../_mixins").Theme<"Badge", {
         color: string;
@@ -149,7 +140,6 @@ declare const _default: import("vue").DefineComponent<{
         colorError: string;
         colorWarning: string;
         fontSize: string;
-        fontFamily: string;
     }, any>>>;
 }>>, {
     readonly type: "default" | "error" | "info" | "success" | "warning";

package/es/badge/src/Badge.js

@@ -39,10 +39,9 @@ export default defineComponent({
         const rtlEnabledRef = useRtl('Badge', mergedRtlRef, mergedClsPrefixRef);
         const cssVarsRef = computed(() => {
             const { type, color: propColor } = props;
-            const { common: { cubicBezierEaseInOut, cubicBezierEaseOut }, self: { [createKey('color', type)]: color, fontFamily, fontSize } } = themeRef.value;
+            const { common: { cubicBezierEaseInOut, cubicBezierEaseOut }, self: { [createKey('color', type)]: color, fontSize } } = themeRef.value;
             return {
                 '--u-font-size': fontSize,
-                '--u-font-family': fontFamily,
                 '--u-color': propColor || color,
                 '--u-ripple-color': propColor || color,
                 '--u-bezier': cubicBezierEaseInOut,

package/es/badge/src/styles/index.cssr.js

@@ -6,7 +6,6 @@ import { fadeInScaleUpTransition } from '../../../_styles/transitions/fade-in-sc
 // --u-bezier
 // --u-ripple-bezier
 // --u-font-size
-// --u-font-family
 export default c([c('@keyframes badge-wave-spread', {
   from: {
     boxShadow: '0 0 0.5px 0px var(--u-ripple-color)',
@@ -22,7 +21,6 @@ export default c([c('@keyframes badge-wave-spread', {
  position: relative;
  vertical-align: middle;
  color: var(--u-color);
- font-family: var(--u-font-family);
  `, [cM('as-is', [cB('badge-sup', {
   position: 'static',
   transform: 'translateX(0)'

package/es/badge/styles/dark.js

@@ -1,18 +1,8 @@
 import { commonDark } from '../../_styles/common';
+import { self } from './light';
 const badgeDark = {
     name: 'Badge',
     common: commonDark,
-    self(vars) {
-        const { errorColorSuppl, infoColorSuppl, successColorSuppl, warningColorSuppl, fontFamily } = vars;
-        return {
-            color: errorColorSuppl,
-            colorInfo: infoColorSuppl,
-            colorSuccess: successColorSuppl,
-            colorError: errorColorSuppl,
-            colorWarning: warningColorSuppl,
-            fontSize: '12px',
-            fontFamily
-        };
-    }
+    self
 };
 export default badgeDark;

package/es/badge/styles/light.d.ts

@@ -1,13 +1,12 @@
 import type { ThemeCommonVars } from '../../_styles/common';
 import type { Theme } from '../../_mixins';
-declare const self: (vars: ThemeCommonVars) => {
+export declare const self: (vars: ThemeCommonVars) => {
     color: string;
     colorInfo: string;
     colorSuccess: string;
     colorError: string;
     colorWarning: string;
     fontSize: string;
-    fontFamily: string;
 };
 export type BadgeThemeVars = ReturnType<typeof self>;
 declare const badgeLight: Theme<'Badge', BadgeThemeVars>;

package/es/badge/styles/light.js

@@ -1,14 +1,13 @@
 import { commonLight } from '../../_styles/common';
-const self = (vars) => {
-    const { errorColor, infoColor, successColor, warningColor, fontFamily } = vars;
+export const self = (vars) => {
+    const { brandQuaternary500, staticGreen, staticRed, staticOrange, fontBodySmall } = vars;
     return {
-        color: errorColor,
-        colorInfo: infoColor,
-        colorSuccess: successColor,
-        colorError: errorColor,
-        colorWarning: warningColor,
-        fontSize: '12px',
-        fontFamily
+        color: staticRed,
+        colorInfo: brandQuaternary500,
+        colorSuccess: staticGreen,
+        colorError: staticRed,
+        colorWarning: staticOrange,
+        fontSize: fontBodySmall
     };
 };
 const badgeLight = {

package/es/breadcrumb/src/Breadcrumb.d.ts

@@ -11,43 +11,34 @@ export declare const breadcrumbProps: {
         readonly default: "/";
     };
     readonly theme: import("vue").PropType<import("../../_mixins").Theme<"Breadcrumb", {
+        fontWeight: string;
         fontSize: string;
         itemLineHeight: string;
         itemTextColor: string;
         itemTextColorHover: string;
         itemTextColorPressed: string;
         itemTextColorActive: string;
-        itemBorderRadius: string;
-        itemColorHover: string;
-        itemColorPressed: string;
         separatorColor: string;
-        fontWeightActive: string;
     }, any>>;
     readonly themeOverrides: import("vue").PropType<import("../../_mixins/use-theme").ExtractThemeOverrides<import("../../_mixins").Theme<"Breadcrumb", {
+        fontWeight: string;
         fontSize: string;
         itemLineHeight: string;
         itemTextColor: string;
         itemTextColorHover: string;
         itemTextColorPressed: string;
         itemTextColorActive: string;
-        itemBorderRadius: string;
-        itemColorHover: string;
-        itemColorPressed: string;
         separatorColor: string;
-        fontWeightActive: string;
     }, any>>>;
     readonly builtinThemeOverrides: import("vue").PropType<import("../../_mixins/use-theme").ExtractThemeOverrides<import("../../_mixins").Theme<"Breadcrumb", {
+        fontWeight: string;
         fontSize: string;
         itemLineHeight: string;
         itemTextColor: string;
         itemTextColorHover: string;
         itemTextColorPressed: string;
         itemTextColorActive: string;
-        itemBorderRadius: string;
-        itemColorHover: string;
-        itemColorPressed: string;
         separatorColor: string;
-        fontWeightActive: string;
     }, any>>>;
 };
 export type BreadcrumbProps = ExtractPublicPropTypes<typeof breadcrumbProps>;
@@ -57,43 +48,34 @@ declare const _default: import("vue").DefineComponent<{
         readonly default: "/";
     };
     readonly theme: import("vue").PropType<import("../../_mixins").Theme<"Breadcrumb", {
+        fontWeight: string;
         fontSize: string;
         itemLineHeight: string;
         itemTextColor: string;
         itemTextColorHover: string;
         itemTextColorPressed: string;
         itemTextColorActive: string;
-        itemBorderRadius: string;
-        itemColorHover: string;
-        itemColorPressed: string;
         separatorColor: string;
-        fontWeightActive: string;
     }, any>>;
     readonly themeOverrides: import("vue").PropType<import("../../_mixins/use-theme").ExtractThemeOverrides<import("../../_mixins").Theme<"Breadcrumb", {
+        fontWeight: string;
         fontSize: string;
         itemLineHeight: string;
         itemTextColor: string;
         itemTextColorHover: string;
         itemTextColorPressed: string;
         itemTextColorActive: string;
-        itemBorderRadius: string;
-        itemColorHover: string;
-        itemColorPressed: string;
         separatorColor: string;
-        fontWeightActive: string;
     }, any>>>;
     readonly builtinThemeOverrides: import("vue").PropType<import("../../_mixins/use-theme").ExtractThemeOverrides<import("../../_mixins").Theme<"Breadcrumb", {
+        fontWeight: string;
         fontSize: string;
         itemLineHeight: string;
         itemTextColor: string;
         itemTextColorHover: string;
         itemTextColorPressed: string;
         itemTextColorActive: string;
-        itemBorderRadius: string;
-        itemColorHover: string;
-        itemColorPressed: string;
         separatorColor: string;
-        fontWeightActive: string;
     }, any>>>;
 }, {
     mergedClsPrefix: Ref<string>;
@@ -105,10 +87,7 @@ declare const _default: import("vue").DefineComponent<{
         '--u-item-text-color-pressed': string;
         '--u-item-text-color-active': string;
         '--u-separator-color': string;
-        '--u-item-color-hover': string;
-        '--u-item-color-pressed': string;
-        '--u-item-border-radius': string;
-        '--u-font-weight-active': string;
+        '--u-font-weight': string;
         '--u-item-line-height': string;
     }> | undefined;
     themeClass: Ref<string> | undefined;
@@ -119,43 +98,34 @@ declare const _default: import("vue").DefineComponent<{
         readonly default: "/";
     };
     readonly theme: import("vue").PropType<import("../../_mixins").Theme<"Breadcrumb", {
+        fontWeight: string;
         fontSize: string;
         itemLineHeight: string;
         itemTextColor: string;
         itemTextColorHover: string;
         itemTextColorPressed: string;
         itemTextColorActive: string;
-        itemBorderRadius: string;
-        itemColorHover: string;
-        itemColorPressed: string;
         separatorColor: string;
-        fontWeightActive: string;
     }, any>>;
     readonly themeOverrides: import("vue").PropType<import("../../_mixins/use-theme").ExtractThemeOverrides<import("../../_mixins").Theme<"Breadcrumb", {
+        fontWeight: string;
         fontSize: string;
         itemLineHeight: string;
         itemTextColor: string;
         itemTextColorHover: string;
         itemTextColorPressed: string;
         itemTextColorActive: string;
-        itemBorderRadius: string;
-        itemColorHover: string;
-        itemColorPressed: string;
         separatorColor: string;
-        fontWeightActive: string;
     }, any>>>;
     readonly builtinThemeOverrides: import("vue").PropType<import("../../_mixins/use-theme").ExtractThemeOverrides<import("../../_mixins").Theme<"Breadcrumb", {
+        fontWeight: string;
         fontSize: string;
         itemLineHeight: string;
         itemTextColor: string;
         itemTextColorHover: string;
         itemTextColorPressed: string;
         itemTextColorActive: string;
-        itemBorderRadius: string;
-        itemColorHover: string;
-        itemColorPressed: string;
         separatorColor: string;
-        fontWeightActive: string;
     }, any>>>;
 }>>, {
     readonly separator: string;

package/es/breadcrumb/src/Breadcrumb.js

@@ -19,7 +19,7 @@ export default defineComponent({
             mergedClsPrefixRef
         });
         const cssVarsRef = computed(() => {
-            const { common: { cubicBezierEaseInOut }, self: { separatorColor, itemTextColor, itemTextColorHover, itemTextColorPressed, itemTextColorActive, fontSize, fontWeightActive, itemBorderRadius, itemColorHover, itemColorPressed, itemLineHeight } } = themeRef.value;
+            const { common: { cubicBezierEaseInOut }, self: { separatorColor, itemTextColor, itemTextColorHover, itemTextColorPressed, itemTextColorActive, fontSize, fontWeight, itemLineHeight } } = themeRef.value;
             return {
                 '--u-font-size': fontSize,
                 '--u-bezier': cubicBezierEaseInOut,
@@ -28,10 +28,7 @@ export default defineComponent({
                 '--u-item-text-color-pressed': itemTextColorPressed,
                 '--u-item-text-color-active': itemTextColorActive,
                 '--u-separator-color': separatorColor,
-                '--u-item-color-hover': itemColorHover,
-                '--u-item-color-pressed': itemColorPressed,
-                '--u-item-border-radius': itemBorderRadius,
-                '--u-font-weight-active': fontWeightActive,
+                '--u-font-weight': fontWeight,
                 '--u-item-line-height': itemLineHeight
             };
         });

package/es/breadcrumb/src/styles/index.cssr.js

@@ -25,23 +25,19 @@ export default cB('breadcrumb', `
  text-decoration: inherit;
  `), cB('breadcrumb-item', `
  font-size: var(--u-font-size);
+ font-weight: var(--u-font-weight);
  transition: color .3s var(--u-bezier);
  display: inline-flex;
  align-items: center;
  `, [cB('icon', `
- font-size: 18px;
+ font-size: 16px;
  vertical-align: -.2em;
  transition: color .3s var(--u-bezier);
  color: var(--u-item-text-color);
  `), c('&:not(:last-child)', [cM('clickable', [cE('link', `
  cursor: pointer;
- `, [c('&:hover', `
- background-color: var(--u-item-color-hover);
- `), c('&:active', `
- background-color: var(--u-item-color-pressed); 
- `)])])]), cE('link', `
+ `)])]), cE('link', `
  padding: 4px;
- border-radius: var(--u-item-border-radius);
  transition:
  background-color .3s var(--u-bezier),
  color .3s var(--u-bezier);
@@ -56,13 +52,12 @@ export default cB('breadcrumb', `
  `, [cB('icon', `
  color: var(--u-item-text-color-pressed);
  `)])]), cE('separator', `
- margin: 0 8px;
+ margin: 0 4px;
  color: var(--u-separator-color);
  transition: color .3s var(--u-bezier);
  user-select: none;
  -webkit-user-select: none;
  `), c('&:last-child', [cE('link', `
- font-weight: var(--u-font-weight-active);
  cursor: unset;
  color: var(--u-item-text-color-active);
  `, [cB('icon', `

package/es/breadcrumb/styles/light.d.ts

@@ -1,17 +1,14 @@
 import type { ThemeCommonVars } from '../../_styles/common';
 import type { Theme } from '../../_mixins';
 export declare const self: (vars: ThemeCommonVars) => {
+    fontWeight: string;
     fontSize: string;
     itemLineHeight: string;
     itemTextColor: string;
     itemTextColorHover: string;
     itemTextColorPressed: string;
     itemTextColorActive: string;
-    itemBorderRadius: string;
-    itemColorHover: string;
-    itemColorPressed: string;
     separatorColor: string;
-    fontWeightActive: string;
 };
 export type BreadcrumbThemeVars = ReturnType<typeof self>;
 declare const breadcrumbLight: Theme<'Breadcrumb', BreadcrumbThemeVars>;

package/es/breadcrumb/styles/light.js

@@ -1,8 +1,16 @@
-import commonVariables from './_common';
 import { commonLight } from '../../_styles/common';
 export const self = (vars) => {
-    const { fontSize, textColor3, textColor2, borderRadius, buttonColor2Hover, buttonColor2Pressed } = vars;
-    return Object.assign(Object.assign({}, commonVariables), { fontSize, itemLineHeight: '1.25', itemTextColor: textColor3, itemTextColorHover: textColor2, itemTextColorPressed: textColor2, itemTextColorActive: textColor2, itemBorderRadius: borderRadius, itemColorHover: buttonColor2Hover, itemColorPressed: buttonColor2Pressed, separatorColor: textColor3 });
+    const { fontWeightStrong, fontBodyMedium, lineHeightBodyMedium, textSecondary, textTertiary, textPrimary } = vars;
+    return {
+        fontWeight: fontWeightStrong,
+        fontSize: fontBodyMedium,
+        itemLineHeight: lineHeightBodyMedium,
+        itemTextColor: textPrimary,
+        itemTextColorHover: textTertiary,
+        itemTextColorPressed: textSecondary,
+        itemTextColorActive: textSecondary,
+        separatorColor: textPrimary
+    };
 };
 const breadcrumbLight = {
     name: 'Breadcrumb',