@uzum-tech/ui 1.12.13 → 1.12.15

package/es/_internal/icons/Logout.js

@@ -1,4 +1,4 @@
 import { h } from 'vue';
 import { replaceable } from './replaceable';
 export default replaceable('logout', h("svg", { xmlns: "http://www.w3.org/2000/svg", width: "24", height: "24", viewBox: "0 0 24 24", fill: "none" },
-    h("path", { d: "M16 17L21 12M21 12L16 7M21 12H9M9 3H7.8C6.11984 3 5.27976 3 4.63803 3.32698C4.07354 3.6146 3.6146 4.07354 3.32698 4.63803C3 5.27976 3 6.11984 3 7.8V16.2C3 17.8802 3 18.7202 3.32698 19.362C3.6146 19.9265 4.07354 20.3854 4.63803 20.673C5.27976 21 6.11984 21 7.8 21H9", stroke: "#101010", "stroke-width": "1.66667", "stroke-linecap": "round", "stroke-linejoin": "round" })));
+    h("path", { d: "M16 17L21 12M21 12L16 7M21 12H9M9 3H7.8C6.11984 3 5.27976 3 4.63803 3.32698C4.07354 3.6146 3.6146 4.07354 3.32698 4.63803C3 5.27976 3 6.11984 3 7.8V16.2C3 17.8802 3 18.7202 3.32698 19.362C3.6146 19.9265 4.07354 20.3854 4.63803 20.673C5.27976 21 6.11984 21 7.8 21H9", stroke: "currentColor", "stroke-width": "1.66667", "stroke-linecap": "round", "stroke-linejoin": "round" })));

package/es/config-provider/src/ConfigProvider.d.ts

@@ -1,8 +1,8 @@
-import { type PropType, type ComputedRef, type ExtractPropTypes } from 'vue';
+import { type PropType, type ExtractPropTypes } from 'vue';
 import { type Hljs } from '../../_mixins';
 import type { UDateLocale, ULocale } from '../../locales';
 import type { GlobalTheme, GlobalThemeOverrides, GlobalComponentConfig, GlobalIconConfig } from './interface';
-import type { RtlProp, Breakpoints, BreakpointProps, BreakpointThemeOverrides } from './internal-interface';
+import type { RtlProp, Breakpoints, BreakpointProps, BreakpointThemeOverrides, BreakpointMode } from './internal-interface';
 import type { Katex } from './katex';
 export declare const configProviderProps: {
     readonly abstract: BooleanConstructor;
@@ -31,6 +31,10 @@ export declare const configProviderProps: {
     readonly breakpoints: PropType<Breakpoints>;
     readonly breakpointProps: PropType<BreakpointProps>;
     readonly breakpointThemeOverrides: PropType<BreakpointThemeOverrides>;
+    readonly breakpointMode: {
+        readonly type: PropType<BreakpointMode>;
+        readonly default: "desktop-first";
+    };
     readonly preflightStyleDisabled: BooleanConstructor;
     readonly inlineThemeDisabled: {
         readonly type: BooleanConstructor;
@@ -70,6 +74,10 @@ declare const _default: import("vue").DefineComponent<{
     readonly breakpoints: PropType<Breakpoints>;
     readonly breakpointProps: PropType<BreakpointProps>;
     readonly breakpointThemeOverrides: PropType<BreakpointThemeOverrides>;
+    readonly breakpointMode: {
+        readonly type: PropType<BreakpointMode>;
+        readonly default: "desktop-first";
+    };
     readonly preflightStyleDisabled: BooleanConstructor;
     readonly inlineThemeDisabled: {
         readonly type: BooleanConstructor;
@@ -81,11 +89,11 @@ declare const _default: import("vue").DefineComponent<{
         readonly default: undefined;
     };
 }, {
-    mergedClsPrefix: ComputedRef<string>;
-    mergedBordered: ComputedRef<boolean | undefined>;
-    mergedNamespace: ComputedRef<string | undefined>;
-    mergedTheme: ComputedRef<GlobalTheme | undefined>;
-    mergedThemeOverrides: ComputedRef<GlobalThemeOverrides | undefined>;
+    mergedClsPrefix: import("vue").ComputedRef<string>;
+    mergedBordered: import("vue").ComputedRef<boolean | undefined>;
+    mergedNamespace: import("vue").ComputedRef<string | undefined>;
+    mergedTheme: import("vue").ComputedRef<GlobalTheme | undefined>;
+    mergedThemeOverrides: import("vue").ComputedRef<GlobalThemeOverrides | undefined>;
 }, unknown, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps, Readonly<ExtractPropTypes<{
     readonly abstract: BooleanConstructor;
     readonly bordered: {
@@ -113,6 +121,10 @@ declare const _default: import("vue").DefineComponent<{
     readonly breakpoints: PropType<Breakpoints>;
     readonly breakpointProps: PropType<BreakpointProps>;
     readonly breakpointThemeOverrides: PropType<BreakpointThemeOverrides>;
+    readonly breakpointMode: {
+        readonly type: PropType<BreakpointMode>;
+        readonly default: "desktop-first";
+    };
     readonly preflightStyleDisabled: BooleanConstructor;
     readonly inlineThemeDisabled: {
         readonly type: BooleanConstructor;
@@ -128,6 +140,7 @@ declare const _default: import("vue").DefineComponent<{
     readonly bordered: boolean | undefined;
     readonly clsPrefix: string;
     readonly tag: string;
+    readonly breakpointMode: BreakpointMode;
     readonly preflightStyleDisabled: boolean;
     readonly inlineThemeDisabled: boolean;
     readonly as: string | undefined;

package/es/config-provider/src/ConfigProvider.js

@@ -29,6 +29,10 @@ export const configProviderProps = {
     breakpoints: Object,
     breakpointProps: Object,
     breakpointThemeOverrides: Object,
+    breakpointMode: {
+        type: String,
+        default: 'desktop-first'
+    },
     preflightStyleDisabled: Boolean,
     inlineThemeDisabled: {
         type: Boolean,
@@ -53,7 +57,7 @@ export default defineComponent({
         const mergedThemeRef = computed(() => {
             const { theme } = props;
             if (theme === null)
-                return undefined;
+                return;
             const inheritedTheme = UConfigProvider === null || UConfigProvider === void 0 ? void 0 : UConfigProvider.mergedThemeRef.value;
             return theme === undefined
                 ? inheritedTheme
@@ -61,30 +65,68 @@ export default defineComponent({
                     ? theme
                     : Object.assign({}, inheritedTheme, theme);
         });
-        const getActiveBreakpointValue = (breakpointMap) => {
-            if (!breakpointMap || !isBrowser) {
-                return undefined;
+        const mergedBreakpointModeRef = computed(() => {
+            const { breakpointMode } = props;
+            return (breakpointMode ||
+                (UConfigProvider === null || UConfigProvider === void 0 ? void 0 : UConfigProvider.mergedBreakpointModeRef.value) ||
+                'desktop-first');
+        });
+        const getMergedBreakpointValues = (breakpointMap) => {
+            if (!breakpointMap)
+                return;
+            const breakpointWidths = Object.keys(breakpointMap)
+                .map(Number)
+                .sort((leftWidth, rightWidth) => leftWidth - rightWidth);
+            const mergedMap = {};
+            let previousValue;
+            for (const width of breakpointWidths) {
+                if (previousValue !== undefined) {
+                    mergedMap[width] = merge({}, previousValue, breakpointMap[width]);
+                }
+                else {
+                    mergedMap[width] = breakpointMap[width];
+                }
+                previousValue = mergedMap[width];
             }
+            return mergedMap;
+        };
+        const getActiveBreakpointValue = (breakpointMap, mode = 'desktop-first') => {
+            if (!breakpointMap || !isBrowser)
+                return;
+            const mergedMap = getMergedBreakpointValues(breakpointMap);
+            if (!mergedMap)
+                return;
             const currentWidth = windowWidthRef.value;
-            const breakpointWidths = Object.keys(breakpointMap)
+            const breakpointWidths = Object.keys(mergedMap)
                 .map(Number)
-                .filter((width) => width <= currentWidth)
-                .sort((a, b) => b - a);
-            if (breakpointWidths.length === 0) {
-                return undefined;
+                .sort((leftWidth, rightWidth) => leftWidth - rightWidth);
+            let matchingBreakpoints;
+            if (mode === 'mobile-first') {
+                matchingBreakpoints = breakpointWidths.filter((width) => width >= currentWidth);
+                if (matchingBreakpoints.length === 0) {
+                    matchingBreakpoints = [breakpointWidths[breakpointWidths.length - 1]];
+                }
+            }
+            else {
+                matchingBreakpoints = breakpointWidths
+                    .filter((width) => width <= currentWidth)
+                    .reverse();
+                if (matchingBreakpoints.length === 0) {
+                    matchingBreakpoints = [breakpointWidths[0]];
+                }
             }
-            const activeBreakpoint = breakpointWidths[0];
-            return breakpointMap[activeBreakpoint];
+            const activeBreakpoint = matchingBreakpoints[0];
+            return mergedMap[activeBreakpoint];
         };
-        const activeBreakPointThemeOverridesRef = computed(() => {
+        const activeBreakpointThemeOverridesRef = computed(() => {
             const { breakpointThemeOverrides } = props;
             const breakpointThemeOverridesToUse = breakpointThemeOverrides !== null && breakpointThemeOverrides !== void 0 ? breakpointThemeOverrides : UConfigProvider === null || UConfigProvider === void 0 ? void 0 : UConfigProvider.mergedBreakpointThemeOverridesRef.value;
-            return getActiveBreakpointValue(breakpointThemeOverridesToUse);
+            return getActiveBreakpointValue(breakpointThemeOverridesToUse, mergedBreakpointModeRef.value);
         });
         const mergedThemeOverridesRef = computed(() => {
             const { themeOverrides } = props;
             if (themeOverrides === null)
-                return undefined;
+                return;
             let baseThemeOverrides;
             if (themeOverrides === undefined) {
                 baseThemeOverrides = UConfigProvider === null || UConfigProvider === void 0 ? void 0 : UConfigProvider.mergedThemeOverridesRef.value;
@@ -98,14 +140,14 @@ export default defineComponent({
                     baseThemeOverrides = merge({}, inheritedThemeOverrides, themeOverrides);
                 }
             }
-            const activeBreakPointThemeOverrides = activeBreakPointThemeOverridesRef.value;
-            if (!activeBreakPointThemeOverrides) {
+            const activeBreakpointThemeOverrides = activeBreakpointThemeOverridesRef.value;
+            if (!activeBreakpointThemeOverrides) {
                 return baseThemeOverrides;
             }
             if (!baseThemeOverrides) {
-                return activeBreakPointThemeOverrides;
+                return activeBreakpointThemeOverrides;
             }
-            return merge({}, baseThemeOverrides, activeBreakPointThemeOverrides);
+            return merge({}, baseThemeOverrides, activeBreakpointThemeOverrides);
         });
         const mergedNamespaceRef = useMemo(() => {
             const { namespace } = props;
@@ -140,24 +182,24 @@ export default defineComponent({
                 window.removeEventListener('resize', updateWindowWidth);
             }
         });
-        const activeBreakPointPropsRef = computed(() => {
+        const activeBreakpointPropsRef = computed(() => {
             const { breakpointProps } = props;
             const breakpointPropsToUse = breakpointProps !== null && breakpointProps !== void 0 ? breakpointProps : UConfigProvider === null || UConfigProvider === void 0 ? void 0 : UConfigProvider.mergedBreakpointPropsRef.value;
-            return getActiveBreakpointValue(breakpointPropsToUse);
+            return getActiveBreakpointValue(breakpointPropsToUse, mergedBreakpointModeRef.value);
         });
         const mergedComponentPropsRef = computed(() => {
             const { componentOptions } = props;
             const baseComponentOptions = componentOptions !== undefined
                 ? componentOptions
                 : UConfigProvider === null || UConfigProvider === void 0 ? void 0 : UConfigProvider.mergedComponentPropsRef.value;
-            const activeBreakPointProps = activeBreakPointPropsRef.value;
-            if (!activeBreakPointProps) {
+            const activeBreakpointProps = activeBreakpointPropsRef.value;
+            if (!activeBreakpointProps) {
                 return baseComponentOptions;
             }
             if (!baseComponentOptions) {
-                return activeBreakPointProps;
+                return activeBreakpointProps;
             }
-            return merge({}, baseComponentOptions, activeBreakPointProps);
+            return merge({}, baseComponentOptions, activeBreakpointProps);
         });
         const mergedClsPrefixRef = computed(() => {
             const { clsPrefix } = props;
@@ -227,13 +269,16 @@ export default defineComponent({
             mergedComponentPropsRef,
             mergedBreakpointPropsRef,
             mergedBreakpointThemeOverridesRef,
+            mergedBreakpointModeRef,
+            activeBreakpointPropsRef,
+            activeBreakpointThemeOverridesRef,
             mergedBorderedRef,
             mergedNamespaceRef,
             mergedClsPrefixRef,
             mergedLocaleRef: computed(() => {
                 const { locale } = props;
                 if (locale === null)
-                    return undefined;
+                    return;
                 return locale === undefined
                     ? UConfigProvider === null || UConfigProvider === void 0 ? void 0 : UConfigProvider.mergedLocaleRef.value
                     : locale;
@@ -241,7 +286,7 @@ export default defineComponent({
             mergedDateLocaleRef: computed(() => {
                 const { dateLocale } = props;
                 if (dateLocale === null)
-                    return undefined;
+                    return;
                 return dateLocale === undefined
                     ? UConfigProvider === null || UConfigProvider === void 0 ? void 0 : UConfigProvider.mergedDateLocaleRef.value
                     : dateLocale;

package/es/config-provider/src/interface.d.ts

@@ -13,4 +13,4 @@ export type GlobalThemeOverrides = {
 } & {
     [key in keyof GlobalThemeWithoutCommon]?: ExtractThemeOverrides<GlobalThemeWithoutCommon[key]>;
 };
-export type { GlobalIconConfig, GlobalComponentConfig, BreakpointProps, BreakpointThemeOverrides } from './internal-interface';
+export type { GlobalIconConfig, GlobalComponentConfig, BreakpointProps, BreakpointThemeOverrides, BreakpointMode } from './internal-interface';

package/es/config-provider/src/internal-interface.d.ts

@@ -429,6 +429,7 @@ export type RtlEnabledState = Partial<Record<keyof GlobalThemeWithoutCommon, Rtl
 export type Breakpoints = Record<string, number> | undefined;
 export type BreakpointProps = Record<number, GlobalComponentConfig> | undefined;
 export type BreakpointThemeOverrides = Record<number, GlobalThemeOverrides> | undefined;
+export type BreakpointMode = 'mobile-first' | 'desktop-first';
 export interface ConfigProviderInjection {
     mergedBreakpointsRef: Ref<Breakpoints | undefined>;
     mergedClsPrefixRef: Ref<string>;
@@ -446,6 +447,9 @@ export interface ConfigProviderInjection {
     mergedThemeHashRef: Ref<string>;
     mergedBreakpointPropsRef: Ref<BreakpointProps | undefined>;
     mergedBreakpointThemeOverridesRef: Ref<BreakpointThemeOverrides | undefined>;
+    mergedBreakpointModeRef: Ref<BreakpointMode>;
+    activeBreakpointPropsRef: Ref<GlobalComponentConfig | undefined>;
+    activeBreakpointThemeOverridesRef: Ref<GlobalThemeOverrides | undefined>;
     inlineThemeDisabled: boolean;
     preflightStyleDisabled: boolean;
 }

package/es/header/src/Header.d.ts

@@ -43,6 +43,10 @@ export declare const headerProps: {
         type: PropType<HeaderPropsInterface["responsive"]>;
         default: boolean;
     };
+    isMobile: {
+        type: PropType<HeaderPropsInterface["isMobile"]>;
+        default: boolean;
+    };
     mobileMenuType: {
         type: PropType<"drawer" | "dropdown">;
         default: string;
@@ -213,6 +217,10 @@ declare const _default: import("vue").DefineComponent<{
         type: PropType<HeaderPropsInterface["responsive"]>;
         default: boolean;
     };
+    isMobile: {
+        type: PropType<HeaderPropsInterface["isMobile"]>;
+        default: boolean;
+    };
     mobileMenuType: {
         type: PropType<"drawer" | "dropdown">;
         default: string;
@@ -388,7 +396,7 @@ declare const _default: import("vue").DefineComponent<{
         key: string | number;
         icon?: (() => import("vue").VNodeChild) | undefined;
     }>;
-    isMobile: ComputedRef<boolean>;
+    isMobile: boolean | undefined;
     mobileMenuVisible: import("vue").Ref<boolean>;
     searchVisible: import("vue").Ref<boolean>;
     handleSelectLang: (key: string | number) => void;
@@ -448,6 +456,10 @@ declare const _default: import("vue").DefineComponent<{
         type: PropType<HeaderPropsInterface["responsive"]>;
         default: boolean;
     };
+    isMobile: {
+        type: PropType<HeaderPropsInterface["isMobile"]>;
+        default: boolean;
+    };
     mobileMenuType: {
         type: PropType<"drawer" | "dropdown">;
         default: string;
@@ -596,6 +608,7 @@ declare const _default: import("vue").DefineComponent<{
     menuCardMinColumnWidth: string | number | undefined;
     logoSrc: string | undefined;
     logoAlt: string | undefined;
+    isMobile: boolean | undefined;
     mobileActionsCollapse: boolean | undefined;
     mobileShowFooterActions: boolean | undefined;
     mobilePrimaryActionText: string | undefined;

package/es/header/src/Header.js

@@ -14,7 +14,6 @@ import { useConfig, useTheme, useThemeClass } from '../../_mixins';
 import { headerLight } from '../styles';
 import { formatLength, resolveWrappedSlot, call } from '../../_utils';
 import { getMenuItemKey } from './utils';
-import { useIsMobile } from '../../_utils/composable/composables';
 import { UIcon } from '../../icon';
 import HeaderNavigation from './HeaderNavigation';
 import HeaderMobile from './mobile/HeaderMobile';
@@ -67,6 +66,9 @@ export const headerProps = Object.assign(Object.assign({}, useTheme.props), { me
     }, responsive: {
         type: Boolean,
         default: true
+    }, isMobile: {
+        type: Boolean,
+        default: true
     }, mobileMenuType: {
         type: String,
         default: 'drawer'
@@ -103,7 +105,7 @@ export default defineComponent({
         var _a, _b, _c;
         const { mergedClsPrefixRef } = useConfig(props);
         const themeRef = useTheme('Header', '-header', style, headerLight, props, mergedClsPrefixRef);
-        const isMobileRef = useIsMobile();
+        const isMobileRef = props.isMobile;
         const mobileMenuVisibleRef = ref(false);
         const searchVisibleRef = ref(false);
         onBeforeMount(() => {

package/es/header/src/HeaderActions.d.ts

@@ -114,7 +114,7 @@ declare const _default: import("vue").DefineComponent<{
     readonly onSearchResultSelect: PropType<(result: HeaderSearchResult) => void>;
 }>>, {
     readonly responsive: boolean;
-    readonly mobileActionsCollapse: boolean;
     readonly isMobile: boolean;
+    readonly mobileActionsCollapse: boolean;
 }, {}>;
 export default _default;

package/es/header/src/interface.d.ts

@@ -16,6 +16,7 @@ export interface HeaderProps {
     logoAlt?: string;
     logoProps?: Partial<ImageProps>;
     responsive?: boolean;
+    isMobile?: boolean;
     mobileMenuType?: 'drawer' | 'dropdown';
     mobileActionsCollapse?: boolean;
     mobileShowFooterActions?: boolean;

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

@@ -17,12 +17,12 @@ export default cB('header', `
  `), cE('logo', [c('img', `
  max-height: 24px;
  `)])]), cM('desktop', [cE('inner-wrapper', `
- width: 1300px;
+ width: 100%;
+ max-width: 1300px;
  box-sizing: border-box;
  display: flex;
  align-items: center;
  justify-content: space-between;
- gap: var(--u-header-navigation-gap);
  padding: 0;
  position: relative;
  height: 80px;
@@ -31,12 +31,14 @@ export default cB('header', `
  display: flex;
  align-items: center;
  justify-content: space-between;
- gap: 60px;
+ flex: 1;
  height: 100%;
  `)]), cE('inner', `
+ width: 100%;
  box-sizing: border-box;
  display: flex;
  align-items: center;
+ justify-content: center;
  gap: var(--u-header-navigation-gap);
  padding: 0;
  position: relative;
@@ -73,7 +75,6 @@ export default cB('header', `
  position: relative;
  display: inline-flex;
  align-items: center;
- gap: var(--u-header-action-gap);
  flex-shrink: 0;
  height: 100%;
  `, [cE('actions-block', `

package/es/version.d.ts

@@ -1,2 +1,2 @@
-declare const _default: "1.12.13";
+declare const _default: "1.12.15";
 export default _default;

package/es/version.js

@@ -1 +1 @@
-export default '1.12.13';
+export default '1.12.15';

package/lib/_internal/icons/Logout.js

@@ -3,4 +3,4 @@ Object.defineProperty(exports, "__esModule", { value: true });
 const vue_1 = require("vue");
 const replaceable_1 = require("./replaceable");
 exports.default = (0, replaceable_1.replaceable)('logout', (0, vue_1.h)("svg", { xmlns: "http://www.w3.org/2000/svg", width: "24", height: "24", viewBox: "0 0 24 24", fill: "none" },
-    (0, vue_1.h)("path", { d: "M16 17L21 12M21 12L16 7M21 12H9M9 3H7.8C6.11984 3 5.27976 3 4.63803 3.32698C4.07354 3.6146 3.6146 4.07354 3.32698 4.63803C3 5.27976 3 6.11984 3 7.8V16.2C3 17.8802 3 18.7202 3.32698 19.362C3.6146 19.9265 4.07354 20.3854 4.63803 20.673C5.27976 21 6.11984 21 7.8 21H9", stroke: "#101010", "stroke-width": "1.66667", "stroke-linecap": "round", "stroke-linejoin": "round" })));
+    (0, vue_1.h)("path", { d: "M16 17L21 12M21 12L16 7M21 12H9M9 3H7.8C6.11984 3 5.27976 3 4.63803 3.32698C4.07354 3.6146 3.6146 4.07354 3.32698 4.63803C3 5.27976 3 6.11984 3 7.8V16.2C3 17.8802 3 18.7202 3.32698 19.362C3.6146 19.9265 4.07354 20.3854 4.63803 20.673C5.27976 21 6.11984 21 7.8 21H9", stroke: "currentColor", "stroke-width": "1.66667", "stroke-linecap": "round", "stroke-linejoin": "round" })));

package/lib/config-provider/src/ConfigProvider.d.ts

@@ -1,8 +1,8 @@
-import { type PropType, type ComputedRef, type ExtractPropTypes } from 'vue';
+import { type PropType, type ExtractPropTypes } from 'vue';
 import { type Hljs } from '../../_mixins';
 import type { UDateLocale, ULocale } from '../../locales';
 import type { GlobalTheme, GlobalThemeOverrides, GlobalComponentConfig, GlobalIconConfig } from './interface';
-import type { RtlProp, Breakpoints, BreakpointProps, BreakpointThemeOverrides } from './internal-interface';
+import type { RtlProp, Breakpoints, BreakpointProps, BreakpointThemeOverrides, BreakpointMode } from './internal-interface';
 import type { Katex } from './katex';
 export declare const configProviderProps: {
     readonly abstract: BooleanConstructor;
@@ -31,6 +31,10 @@ export declare const configProviderProps: {
     readonly breakpoints: PropType<Breakpoints>;
     readonly breakpointProps: PropType<BreakpointProps>;
     readonly breakpointThemeOverrides: PropType<BreakpointThemeOverrides>;
+    readonly breakpointMode: {
+        readonly type: PropType<BreakpointMode>;
+        readonly default: "desktop-first";
+    };
     readonly preflightStyleDisabled: BooleanConstructor;
     readonly inlineThemeDisabled: {
         readonly type: BooleanConstructor;
@@ -70,6 +74,10 @@ declare const _default: import("vue").DefineComponent<{
     readonly breakpoints: PropType<Breakpoints>;
     readonly breakpointProps: PropType<BreakpointProps>;
     readonly breakpointThemeOverrides: PropType<BreakpointThemeOverrides>;
+    readonly breakpointMode: {
+        readonly type: PropType<BreakpointMode>;
+        readonly default: "desktop-first";
+    };
     readonly preflightStyleDisabled: BooleanConstructor;
     readonly inlineThemeDisabled: {
         readonly type: BooleanConstructor;
@@ -81,11 +89,11 @@ declare const _default: import("vue").DefineComponent<{
         readonly default: undefined;
     };
 }, {
-    mergedClsPrefix: ComputedRef<string>;
-    mergedBordered: ComputedRef<boolean | undefined>;
-    mergedNamespace: ComputedRef<string | undefined>;
-    mergedTheme: ComputedRef<GlobalTheme | undefined>;
-    mergedThemeOverrides: ComputedRef<GlobalThemeOverrides | undefined>;
+    mergedClsPrefix: import("vue").ComputedRef<string>;
+    mergedBordered: import("vue").ComputedRef<boolean | undefined>;
+    mergedNamespace: import("vue").ComputedRef<string | undefined>;
+    mergedTheme: import("vue").ComputedRef<GlobalTheme | undefined>;
+    mergedThemeOverrides: import("vue").ComputedRef<GlobalThemeOverrides | undefined>;
 }, unknown, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps, Readonly<ExtractPropTypes<{
     readonly abstract: BooleanConstructor;
     readonly bordered: {
@@ -113,6 +121,10 @@ declare const _default: import("vue").DefineComponent<{
     readonly breakpoints: PropType<Breakpoints>;
     readonly breakpointProps: PropType<BreakpointProps>;
     readonly breakpointThemeOverrides: PropType<BreakpointThemeOverrides>;
+    readonly breakpointMode: {
+        readonly type: PropType<BreakpointMode>;
+        readonly default: "desktop-first";
+    };
     readonly preflightStyleDisabled: BooleanConstructor;
     readonly inlineThemeDisabled: {
         readonly type: BooleanConstructor;
@@ -128,6 +140,7 @@ declare const _default: import("vue").DefineComponent<{
     readonly bordered: boolean | undefined;
     readonly clsPrefix: string;
     readonly tag: string;
+    readonly breakpointMode: BreakpointMode;
     readonly preflightStyleDisabled: boolean;
     readonly inlineThemeDisabled: boolean;
     readonly as: string | undefined;