@uzum-tech/ui 1.4.2 → 1.5.1

package/es/data-table/src/TableParts/BodySkeleton.js

@@ -0,0 +1,52 @@
+import { defineComponent, inject, computed, h } from 'vue';
+import { USkeleton } from '../../../skeleton';
+import { dataTableInjectionKey } from '../interface';
+export default defineComponent({
+    name: 'DataTableBodySkeleton',
+    props: {
+        rowCount: {
+            type: Number,
+            default: 10
+        }
+    },
+    setup(props) {
+        const { mergedClsPrefixRef, colsRef, props: dataTableProps
+        // eslint-disable-next-line @typescript-eslint/no-non-null-assertion
+         } = inject(dataTableInjectionKey);
+        const skeletonRowCount = computed(() => {
+            if (dataTableProps.pagination &&
+                typeof dataTableProps.pagination === 'object' &&
+                dataTableProps.pagination.pageSize) {
+                return dataTableProps.pagination.pageSize;
+            }
+            return props.rowCount;
+        });
+        return {
+            mergedClsPrefix: mergedClsPrefixRef,
+            cols: colsRef,
+            skeletonRowCount
+        };
+    },
+    render() {
+        const { mergedClsPrefix, cols, skeletonRowCount } = this;
+        const skeletonRows = Array.from({ length: skeletonRowCount }, (_, index) => (h("tr", { key: `skeleton-row-${index}`, class: `${mergedClsPrefix}-data-table-tr ${mergedClsPrefix}-data-table-tr--skeleton` }, cols.map((col) => (h("td", { key: col.key, class: [
+                `${mergedClsPrefix}-data-table-td`,
+                `${mergedClsPrefix}-data-table-td--skeleton`,
+                col.column.fixed &&
+                    `${mergedClsPrefix}-data-table-td--fixed-${col.column.fixed}`,
+                col.column.align &&
+                    `${mergedClsPrefix}-data-table-td--${col.column.align}-align`
+            ], style: {
+                textAlign: col.column.align || undefined,
+                padding: 'var(--u-td-padding)'
+            } },
+            col.column.fixed && (h("div", { class: `${mergedClsPrefix}-data-table-td__shadow-holder` })),
+            h(USkeleton, { height: "var(--u-line-height)", width: col.column.type === 'selection' ? '16px' : '85%', animated: true, style: {
+                    borderRadius: '16px'
+                } })))))));
+        return (h("tbody", { class: [
+                `${mergedClsPrefix}-data-table-tbody`,
+                `${mergedClsPrefix}-data-table-tbody--skeleton`
+            ] }, skeletonRows));
+    }
+});

package/es/data-table/src/TableParts/Header.d.ts

@@ -472,6 +472,8 @@ declare const _default: import("vue").DefineComponent<{
                 jumperFontSizeLarge: string;
                 jumperTextColor: string;
                 jumperTextColorDisabled: string;
+                paginationSizePickerBackground: string;
+                paginationSizePickerBorder: string;
             }, {
                 Select: import("../../../_mixins").Theme<"Select", {
                     menuBoxShadow: string;

package/es/data-table/src/interface.d.ts

@@ -565,6 +565,8 @@ export declare const dataTableProps: {
             jumperFontSizeLarge: string;
             jumperTextColor: string;
             jumperTextColorDisabled: string;
+            paginationSizePickerBackground: string;
+            paginationSizePickerBorder: string;
         }, {
             Select: import("../../_mixins").Theme<"Select", {
                 menuBoxShadow: string;
@@ -1481,6 +1483,8 @@ export declare const dataTableProps: {
             jumperFontSizeLarge: string;
             jumperTextColor: string;
             jumperTextColorDisabled: string;
+            paginationSizePickerBackground: string;
+            paginationSizePickerBorder: string;
         }, {
             Select: import("../../_mixins").Theme<"Select", {
                 menuBoxShadow: string;
@@ -2397,6 +2401,8 @@ export declare const dataTableProps: {
             jumperFontSizeLarge: string;
             jumperTextColor: string;
             jumperTextColorDisabled: string;
+            paginationSizePickerBackground: string;
+            paginationSizePickerBorder: string;
         }, {
             Select: import("../../_mixins").Theme<"Select", {
                 menuBoxShadow: string;

package/es/data-table/src/styles/index.cssr.js

@@ -183,7 +183,7 @@ c('&:last-child', 'flex-grow: 1;')])])])])])])]), c('>', [cB('data-table-loading
  white-space: nowrap;
  max-width: 100%;
  `), c('&:hover', `
- color: var(--u-th-icon-color-active);
+ color: var(--u-th-text-color);
  `), cM('hover', `
  background-color: var(--u-merged-th-color-hover);
  color: var(--u-th-icon-color-active);

package/es/data-table/styles/light.d.ts

@@ -506,6 +506,8 @@ declare const dataTableLight: import("../../_mixins").Theme<"DataTable", {
         jumperFontSizeLarge: string;
         jumperTextColor: string;
         jumperTextColorDisabled: string;
+        paginationSizePickerBackground: string;
+        paginationSizePickerBorder: string;
     }, {
         Select: import("../../_mixins").Theme<"Select", {
             menuBoxShadow: string;

package/es/data-table/styles/light.js

@@ -45,7 +45,7 @@ export const self = (vars) => {
         thColorHover: containerPrimary,
         tdColor: containerPrimary,
         tdTextColor: textPrimary,
-        thTextColor: textSecondary,
+        thTextColor: textPrimary,
         thFontWeight: fontWeightBold,
         thSubColor: textSecondary,
         thSubFontWeight: fontWeight,

package/es/dialog/src/DialogProvider.d.ts

@@ -338,6 +338,7 @@ export declare const UDialogProvider: import("vue").DefineComponent<{
                     shadowDepth: string;
                     fontFamily: string;
                     fontFamilyMono: string;
+                    fontFamilyWixMadeforDisplay: string;
                     cubicBezierEaseInOut: string;
                     cubicBezierEaseOut: string;
                     cubicBezierEaseIn: string;
@@ -386,6 +387,7 @@ export declare const UDialogProvider: import("vue").DefineComponent<{
                     closeLarge: string;
                     closeHuge: string;
                     closeBorderRadius: string;
+                    codeBorder: string;
                     name: "common";
                 } | undefined;
             } | undefined;
@@ -692,6 +694,7 @@ export declare const UDialogProvider: import("vue").DefineComponent<{
                     shadowDepth: string;
                     fontFamily: string;
                     fontFamilyMono: string;
+                    fontFamilyWixMadeforDisplay: string;
                     cubicBezierEaseInOut: string;
                     cubicBezierEaseOut: string;
                     cubicBezierEaseIn: string;
@@ -740,6 +743,7 @@ export declare const UDialogProvider: import("vue").DefineComponent<{
                     closeLarge: string;
                     closeHuge: string;
                     closeBorderRadius: string;
+                    codeBorder: string;
                     name: "common";
                 } | undefined;
             } | undefined;

package/es/icon-wrapper/src/IconWrapper.d.ts

@@ -102,6 +102,6 @@ export declare const UIconWrapper: import("vue").DefineComponent<{
 }>>, {
     readonly borderRadius: number;
     readonly size: number;
-    readonly pulseSize: number;
     readonly variant: IconWrapperVariant;
+    readonly pulseSize: number;
 }, {}>;

package/es/modal/src/BodyWrapper.d.ts

@@ -80,6 +80,7 @@ declare const _default: import("vue").DefineComponent<{
             sizeSmall: string;
             sizeMedium: string;
             sizeLarge: string;
+            sizeExtra: string;
         };
         peers: {
             Scrollbar: import("../../_mixins").Theme<"Scrollbar", {

package/es/modal/src/Modal.d.ts

@@ -91,6 +91,7 @@ export declare const modalProps: {
         sizeSmall: string;
         sizeMedium: string;
         sizeLarge: string;
+        sizeExtra: string;
     }, {
         Scrollbar: import("../../_mixins").Theme<"Scrollbar", {
             color: string;
@@ -391,6 +392,7 @@ export declare const modalProps: {
         sizeSmall: string;
         sizeMedium: string;
         sizeLarge: string;
+        sizeExtra: string;
     }, {
         Scrollbar: import("../../_mixins").Theme<"Scrollbar", {
             color: string;
@@ -691,6 +693,7 @@ export declare const modalProps: {
         sizeSmall: string;
         sizeMedium: string;
         sizeLarge: string;
+        sizeExtra: string;
     }, {
         Scrollbar: import("../../_mixins").Theme<"Scrollbar", {
             color: string;
@@ -1077,6 +1080,7 @@ declare const _default: import("vue").DefineComponent<{
         sizeSmall: string;
         sizeMedium: string;
         sizeLarge: string;
+        sizeExtra: string;
     }, {
         Scrollbar: import("../../_mixins").Theme<"Scrollbar", {
             color: string;
@@ -1377,6 +1381,7 @@ declare const _default: import("vue").DefineComponent<{
         sizeSmall: string;
         sizeMedium: string;
         sizeLarge: string;
+        sizeExtra: string;
     }, {
         Scrollbar: import("../../_mixins").Theme<"Scrollbar", {
             color: string;
@@ -1677,6 +1682,7 @@ declare const _default: import("vue").DefineComponent<{
         sizeSmall: string;
         sizeMedium: string;
         sizeLarge: string;
+        sizeExtra: string;
     }, {
         Scrollbar: import("../../_mixins").Theme<"Scrollbar", {
             color: string;
@@ -2084,6 +2090,7 @@ declare const _default: import("vue").DefineComponent<{
         sizeSmall: string;
         sizeMedium: string;
         sizeLarge: string;
+        sizeExtra: string;
     }, {
         Scrollbar: import("../../_mixins").Theme<"Scrollbar", {
             color: string;
@@ -2384,6 +2391,7 @@ declare const _default: import("vue").DefineComponent<{
         sizeSmall: string;
         sizeMedium: string;
         sizeLarge: string;
+        sizeExtra: string;
     }, {
         Scrollbar: import("../../_mixins").Theme<"Scrollbar", {
             color: string;
@@ -2684,6 +2692,7 @@ declare const _default: import("vue").DefineComponent<{
         sizeSmall: string;
         sizeMedium: string;
         sizeLarge: string;
+        sizeExtra: string;
     }, {
         Scrollbar: import("../../_mixins").Theme<"Scrollbar", {
             color: string;

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

@@ -6,6 +6,7 @@ export declare const self: (vars: ThemeCommonVars) => {
     sizeSmall: string;
     sizeMedium: string;
     sizeLarge: string;
+    sizeExtra: string;
 };
 export type ModalThemeVars = ReturnType<typeof self>;
 declare const modalLight: import("../../_mixins").Theme<"Modal", {
@@ -15,6 +16,7 @@ declare const modalLight: import("../../_mixins").Theme<"Modal", {
     sizeSmall: string;
     sizeMedium: string;
     sizeLarge: string;
+    sizeExtra: string;
 }, {
     Scrollbar: import("../../_mixins").Theme<"Scrollbar", {
         color: string;

package/es/modal/styles/light.js

@@ -11,7 +11,8 @@ export const self = (vars) => {
         textColor: textPrimary,
         sizeSmall: '512px',
         sizeMedium: '576px',
-        sizeLarge: '720px'
+        sizeLarge: '720px',
+        sizeExtra: '900px'
     };
 };
 const modalLight = createTheme({

package/es/pagination/src/Pagination.d.ts

@@ -130,6 +130,8 @@ export declare const paginationProps: {
         jumperFontSizeLarge: string;
         jumperTextColor: string;
         jumperTextColorDisabled: string;
+        paginationSizePickerBackground: string;
+        paginationSizePickerBorder: string;
     }, {
         Select: import("../../_mixins").Theme<"Select", {
             menuBoxShadow: string;
@@ -528,6 +530,8 @@ export declare const paginationProps: {
         jumperFontSizeLarge: string;
         jumperTextColor: string;
         jumperTextColorDisabled: string;
+        paginationSizePickerBackground: string;
+        paginationSizePickerBorder: string;
     }, {
         Select: import("../../_mixins").Theme<"Select", {
             menuBoxShadow: string;
@@ -926,6 +930,8 @@ export declare const paginationProps: {
         jumperFontSizeLarge: string;
         jumperTextColor: string;
         jumperTextColorDisabled: string;
+        paginationSizePickerBackground: string;
+        paginationSizePickerBorder: string;
     }, {
         Select: import("../../_mixins").Theme<"Select", {
             menuBoxShadow: string;
@@ -1380,6 +1386,8 @@ declare const _default: import("vue").DefineComponent<{
         jumperFontSizeLarge: string;
         jumperTextColor: string;
         jumperTextColorDisabled: string;
+        paginationSizePickerBackground: string;
+        paginationSizePickerBorder: string;
     }, {
         Select: import("../../_mixins").Theme<"Select", {
             menuBoxShadow: string;
@@ -1778,6 +1786,8 @@ declare const _default: import("vue").DefineComponent<{
         jumperFontSizeLarge: string;
         jumperTextColor: string;
         jumperTextColorDisabled: string;
+        paginationSizePickerBackground: string;
+        paginationSizePickerBorder: string;
     }, {
         Select: import("../../_mixins").Theme<"Select", {
             menuBoxShadow: string;
@@ -2176,6 +2186,8 @@ declare const _default: import("vue").DefineComponent<{
         jumperFontSizeLarge: string;
         jumperTextColor: string;
         jumperTextColorDisabled: string;
+        paginationSizePickerBackground: string;
+        paginationSizePickerBorder: string;
     }, {
         Select: import("../../_mixins").Theme<"Select", {
             menuBoxShadow: string;
@@ -2592,6 +2604,8 @@ declare const _default: import("vue").DefineComponent<{
             jumperFontSizeLarge: string;
             jumperTextColor: string;
             jumperTextColorDisabled: string;
+            paginationSizePickerBackground: string;
+            paginationSizePickerBorder: string;
         };
         peers: {
             Select: import("../../_mixins").Theme<"Select", {
@@ -3251,6 +3265,8 @@ declare const _default: import("vue").DefineComponent<{
         '--u-button-border': string;
         '--u-button-border-hover': string;
         '--u-button-border-pressed': string;
+        '--u-pagination-size-picker-background': string;
+        '--u-pagination-size-picker-border': string;
     }> | undefined;
     themeClass: import("vue").Ref<string> | undefined;
     onRender: (() => void) | undefined;
@@ -3379,6 +3395,8 @@ declare const _default: import("vue").DefineComponent<{
         jumperFontSizeLarge: string;
         jumperTextColor: string;
         jumperTextColorDisabled: string;
+        paginationSizePickerBackground: string;
+        paginationSizePickerBorder: string;
     }, {
         Select: import("../../_mixins").Theme<"Select", {
             menuBoxShadow: string;
@@ -3777,6 +3795,8 @@ declare const _default: import("vue").DefineComponent<{
         jumperFontSizeLarge: string;
         jumperTextColor: string;
         jumperTextColorDisabled: string;
+        paginationSizePickerBackground: string;
+        paginationSizePickerBorder: string;
     }, {
         Select: import("../../_mixins").Theme<"Select", {
             menuBoxShadow: string;
@@ -4175,6 +4195,8 @@ declare const _default: import("vue").DefineComponent<{
         jumperFontSizeLarge: string;
         jumperTextColor: string;
         jumperTextColorDisabled: string;
+        paginationSizePickerBackground: string;
+        paginationSizePickerBorder: string;
     }, {
         Select: import("../../_mixins").Theme<"Select", {
             menuBoxShadow: string;

package/es/pagination/src/Pagination.js

@@ -275,7 +275,7 @@ export default defineComponent({
         });
         const cssVarsRef = computed(() => {
             const { size } = props;
-            const { self: { buttonBorder, buttonBorderHover, buttonBorderPressed, buttonIconColor, buttonIconColorHover, buttonIconColorPressed, itemTextColor, itemTextColorHover, itemTextColorPressed, itemTextColorActive, itemTextColorDisabled, itemColor, itemColorHover, itemColorPressed, itemColorActive, itemColorActiveHover, itemColorDisabled, itemBorder, itemBorderHover, itemBorderPressed, itemBorderActive, itemBorderDisabled, itemBorderRadius, jumperTextColor, jumperTextColorDisabled, buttonColor, buttonColorHover, buttonColorPressed, [createKey('itemPadding', size)]: itemPadding, [createKey('itemMargin', size)]: itemMargin, [createKey('inputWidth', size)]: inputWidth, [createKey('selectWidth', size)]: selectWidth, [createKey('inputMargin', size)]: inputMargin, [createKey('selectMargin', size)]: selectMargin, [createKey('jumperFontSize', size)]: jumperFontSize, [createKey('prefixMargin', size)]: prefixMargin, [createKey('suffixMargin', size)]: suffixMargin, [createKey('itemSize', size)]: itemSize, [createKey('buttonIconSize', size)]: buttonIconSize, [createKey('itemFontSize', size)]: itemFontSize, [`${createKey('itemMargin', size)}Rtl`]: itemMarginRtl, [`${createKey('inputMargin', size)}Rtl`]: inputMarginRtl }, common: { cubicBezierEaseInOut } } = themeRef.value;
+            const { self: { buttonBorder, buttonBorderHover, buttonBorderPressed, buttonIconColor, buttonIconColorHover, buttonIconColorPressed, itemTextColor, itemTextColorHover, itemTextColorPressed, itemTextColorActive, itemTextColorDisabled, itemColor, itemColorHover, itemColorPressed, itemColorActive, itemColorActiveHover, itemColorDisabled, itemBorder, itemBorderHover, itemBorderPressed, itemBorderActive, itemBorderDisabled, itemBorderRadius, jumperTextColor, jumperTextColorDisabled, paginationSizePickerBackground, paginationSizePickerBorder, buttonColor, buttonColorHover, buttonColorPressed, [createKey('itemPadding', size)]: itemPadding, [createKey('itemMargin', size)]: itemMargin, [createKey('inputWidth', size)]: inputWidth, [createKey('selectWidth', size)]: selectWidth, [createKey('inputMargin', size)]: inputMargin, [createKey('selectMargin', size)]: selectMargin, [createKey('jumperFontSize', size)]: jumperFontSize, [createKey('prefixMargin', size)]: prefixMargin, [createKey('suffixMargin', size)]: suffixMargin, [createKey('itemSize', size)]: itemSize, [createKey('buttonIconSize', size)]: buttonIconSize, [createKey('itemFontSize', size)]: itemFontSize, [`${createKey('itemMargin', size)}Rtl`]: itemMarginRtl, [`${createKey('inputMargin', size)}Rtl`]: inputMarginRtl }, common: { cubicBezierEaseInOut } } = themeRef.value;
             return {
                 '--u-prefix-margin': prefixMargin,
                 '--u-suffix-margin': suffixMargin,
@@ -319,7 +319,9 @@ export default defineComponent({
                 '--u-button-color-pressed': buttonColorPressed,
                 '--u-button-border': buttonBorder,
                 '--u-button-border-hover': buttonBorderHover,
-                '--u-button-border-pressed': buttonBorderPressed
+                '--u-button-border-pressed': buttonBorderPressed,
+                '--u-pagination-size-picker-background': paginationSizePickerBackground,
+                '--u-pagination-size-picker-border': paginationSizePickerBorder
             };
         });
         const themeClassHandle = inlineThemeDisabled

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

@@ -45,6 +45,8 @@ const hoverStyleChildren = [cM('button', `
 // --u-button-color
 // --u-button-color-hover
 // --u-button-color-pressed
+// --u-pagination-size-picker-background
+// --u-pagination-size-picker-border
 export default cB('pagination', `
  display: flex;
  width: 100%;
@@ -64,6 +66,7 @@ export default cB('pagination', `
  margin: var(--u-item-margin);
  `), cB('select', `
  min-width: var(--u-select-width);
+ max-width: 100px;
  margin: var(--u-select-margin);
  `), c('&.transition-disabled', [cB('pagination-item', 'transition: none !important;')]), cB('pagination-pages', `
  white-space: nowrap;
@@ -74,10 +77,18 @@ export default cB('pagination', `
  white-space: nowrap;
  transition: color .3s var(--u-bezier);
  align-items: center;
+ display: flex;
+ gap: 16px 10px;
+ flex-wrap: wrap;
+ width: 100%;
  `, [cB('label', `
  font-size: 14px;
  font-weight: 500;
  line-height: 20px;
+ `), cB('base-selection-label', `
+ background-color: var(--u-pagination-size-picker-background);
+ `), cB('base-selection__border', `
+ border-color: var(--u-pagination-size-picker-border);
  `)]), cB('pagination-quick-jumper', `
  white-space: nowrap;
  display: flex;

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

@@ -70,6 +70,8 @@ export declare const self: (vars: ThemeCommonVars) => {
     jumperFontSizeLarge: string;
     jumperTextColor: string;
     jumperTextColorDisabled: string;
+    paginationSizePickerBackground: string;
+    paginationSizePickerBorder: string;
 };
 export type PaginationThemeVars = ReturnType<typeof self>;
 declare const paginationLight: import("../../_mixins").Theme<"Pagination", {
@@ -143,6 +145,8 @@ declare const paginationLight: import("../../_mixins").Theme<"Pagination", {
     jumperFontSizeLarge: string;
     jumperTextColor: string;
     jumperTextColorDisabled: string;
+    paginationSizePickerBackground: string;
+    paginationSizePickerBorder: string;
 }, {
     Select: import("../../_mixins").Theme<"Select", {
         menuBoxShadow: string;

package/es/pagination/styles/light.js

@@ -4,7 +4,7 @@ import { inputLight } from '../../input/styles';
 import { commonLight } from '../../_styles/common';
 import { createTheme } from '../../_mixins';
 export const self = (vars) => {
-    const { transparencySecondary, elementsPrimary, brandPrimary500, textSecondary, borderRadiusLarge, fontBodyMedium, fontBodyLarge, textPrimary, textTertiary } = vars;
+    const { brandPrimary100, transparencySecondary, elementsPrimary, brandPrimary500, textSecondary, borderRadius, fontBodyMedium, fontBodyLarge, textPrimary, textTertiary, elementsTertiary, elementsQuaternary } = vars;
     return {
         itemPaddingSmall: '0 4px',
         itemMarginSmall: '0 0 0 2px',
@@ -56,15 +56,15 @@ export const self = (vars) => {
         itemColor: '#0000',
         itemColorHover: transparencySecondary,
         itemColorPressed: transparencySecondary,
-        itemColorActive: '#0000',
-        itemColorActiveHover: transparencySecondary,
+        itemColorActive: brandPrimary100,
+        itemColorActiveHover: brandPrimary100,
         itemColorDisabled: '#0000',
         itemBorder: '0px',
         itemBorderHover: '0px',
         itemBorderPressed: '0px',
         itemBorderActive: '0px',
         itemBorderDisabled: '0px',
-        itemBorderRadius: borderRadiusLarge,
+        itemBorderRadius: borderRadius,
         itemSizeSmall: '24px',
         itemSizeMedium: '32px',
         itemSizeLarge: '40px',
@@ -75,7 +75,9 @@ export const self = (vars) => {
         jumperFontSizeMedium: fontBodyMedium,
         jumperFontSizeLarge: fontBodyLarge,
         jumperTextColor: textPrimary,
-        jumperTextColorDisabled: textTertiary
+        jumperTextColorDisabled: textTertiary,
+        paginationSizePickerBackground: elementsTertiary,
+        paginationSizePickerBorder: elementsQuaternary
     };
 };
 const paginationLight = createTheme({

package/es/spin/styles/light.js

@@ -1,14 +1,14 @@
 import { commonLight } from '../../_styles/common';
 export const self = (vars) => {
-    const { opacityDisabled, elementsPrimary, brandPrimary500, fontBodyMedium, fontBodySmall, fontBodyLarge, fontHeadingSmall, fontHeadingMedium, fontHeadingLarge } = vars;
+    const { opacityDisabled, elementsPrimary, brandPrimary500, fontBodyMedium, fontBodySmall, fontBodyLarge, fontHeadingSmall, fontTitleMedium, fontHeadingLarge } = vars;
     return {
         tertiaryColor: elementsPrimary,
         primaryColor: brandPrimary500,
         fontSize: fontBodyMedium,
         sizeTiny: fontBodySmall,
         sizeSmall: fontBodyLarge,
-        sizeMedium: fontHeadingSmall,
-        sizeLarge: fontHeadingMedium,
+        sizeMedium: fontTitleMedium,
+        sizeLarge: fontHeadingSmall,
         sizeHuge: fontHeadingLarge,
         opacitySpinning: opacityDisabled
     };

package/es/steps/src/Step.d.ts

@@ -44,12 +44,29 @@ declare const _default: import("vue").DefineComponent<{
         '--u-indicator-color': string;
         '--u-indicator-icon-size': string;
         '--u-indicator-index-font-size': string;
+        '--u-indicator-index-font-size--outline': string;
         '--u-indicator-size': string;
+        '--u-indicator-size--dotted': string;
+        '--u-indicator-color--dotted': string;
         '--u-indicator-text-color': string;
+        '--u-indicator-text-color--outline': string;
         '--u-splitor-color': string;
+        '--u-splitor-color--dotted': string;
+        '--u-splitor-color-finish--dotted': string;
         '--u-step-header-font-size': string;
         '--u-step-header-font-weight': string;
         '--u-step-icon-color': string;
+        '--u-step-icon-color--outline': string;
+        '--u-indicator-background-finish--outline': string;
+        '--u-indicator-color-finish--dotted': string;
+        '--u-indicator-icon-size--outline': string;
+        '--u-indicator-border-color-finish--outline': string;
+        '--u-indicator-icon-color--outline': string;
+        '--u-indicator-border-radius--outline': string;
+        '--u-indicator-border-radius-finish--outline': string;
+        '--u-step-height': string;
+        '--u-description-text-color--dotted': string;
+        '--u-step-header-font-size--dotted': string;
     }> | undefined;
     themeClass: import("vue").Ref<string> | undefined;
     onRender: (() => void) | undefined;